/* ==========================================================================
   Betterfix Management: main stylesheet
   --------------------------------------------------------------------------
   1. Original site styles (carried over unchanged from the first version)
   2. Logo / wordmark
   3. WhatsApp click-to-chat button
   4. Accessibility helpers
   ========================================================================== */

/* 1. Original site styles ------------------------------------------------ */
:root{--navy:#06294a;--navy2:#0a3c65;--green:#19b765;--green2:#e8f8ef;--bluewash:#eef6fc;--ink:#17324c;--muted:#5d7285;--white:#fff;--line:#dce7ef;--shadow:0 14px 40px rgba(6,41,74,.10);--radius:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"DM Sans",sans-serif;line-height:1.6;background:#fff}h1,h2,h3,h4{font-family:Manrope,sans-serif;line-height:1.15;color:var(--navy);margin:0 0 14px}p{margin:0 0 16px}.container{width:min(1160px,calc(100% - 40px));margin:auto}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.76rem;font-weight:800;color:var(--green);margin-bottom:10px}.section{padding:82px 0}.section-head{max-width:680px;margin:0 auto 42px;text-align:center}.section-head h2{font-size:clamp(1.9rem,3.5vw,2.7rem)}.section-head p{color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 21px;border-radius:999px;font-weight:700;text-decoration:none;border:1px solid transparent;transition:.2s ease;cursor:pointer;font:inherit;font-weight:700}.btn-primary{background:var(--green);color:#fff;box-shadow:0 8px 20px rgba(25,183,101,.2)}.btn-primary:hover{background:#109c52;transform:translateY(-1px)}.btn-outline{border-color:rgba(255,255,255,.7);color:#fff;background:transparent}.btn-outline:hover{background:#fff;color:var(--navy)}.btn-dark-outline{border-color:var(--line);color:var(--navy)}.btn-dark-outline:hover{border-color:var(--green);color:#0c8c4c}.topbar{background:var(--navy);color:#d8e7f2;font-size:.82rem;padding:8px 0}.topbar-inner{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}.topbar a{color:inherit;text-decoration:none}.header{background:#fff;position:sticky;top:0;z-index:50;box-shadow:0 3px 18px rgba(6,41,74,.06)}.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--navy);min-width:max-content}.brand-mark{width:43px;height:43px;border-radius:13px;background:var(--green2);display:grid;place-items:center}.brand-mark svg{width:30px;height:30px}.brand-name{font:800 1.25rem Manrope,sans-serif;letter-spacing:-.04em;line-height:1.1}.brand-name span{display:block;font-size:.64rem;letter-spacing:.34em;color:var(--green);margin-top:4px}.brand-tagline{font-size:.69rem;color:var(--muted);padding-left:12px;border-left:1px solid var(--line);line-height:1.35;max-width:165px}.nav-links{display:flex;align-items:center;gap:25px}.nav-links a{font-size:.87rem;font-weight:600;color:var(--ink);text-decoration:none}.nav-links a:hover{color:var(--green)}.nav-cta{padding:10px 16px;font-size:.86rem}.menu-toggle{display:none;border:0;background:var(--green2);color:var(--navy);width:42px;height:42px;border-radius:12px;font-size:1.35rem}
.hero{background:var(--navy);color:#fff;position:relative;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;min-height:540px;align-items:stretch}.hero-copy{padding:75px 24px 72px 0;align-self:center;position:relative;z-index:2}.hero h1{color:#fff;font-size:clamp(2.45rem,5vw,4.25rem);letter-spacing:-.055em;margin-bottom:16px}.hero h1 span{color:var(--green)}.hero-subtitle{font:700 clamp(1.1rem,2vw,1.35rem) Manrope,sans-serif;line-height:1.35;color:#e3eef6;max-width:580px;margin-bottom:18px}.hero-copy p{color:#d0e0ed;max-width:570px;font-size:1.02rem}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:27px}.hero-note{display:flex;align-items:center;gap:12px;color:#d2e5f0;font-size:.86rem;margin-top:25px}.hero-note .check{width:25px;height:25px;display:grid;place-items:center;background:rgba(25,183,101,.18);color:#5de39b;border-radius:50%;font-weight:800}.hero-image{position:relative;min-height:440px;background:#123d5d}.hero-image img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--navy) 0%,rgba(6,41,74,.28) 28%,rgba(6,41,74,.03) 75%),linear-gradient(0deg,rgba(6,41,74,.22),transparent 45%)}.hero-badge{position:absolute;z-index:2;right:25px;bottom:26px;background:#fff;color:var(--navy);padding:17px 19px;border-radius:15px;box-shadow:var(--shadow);max-width:235px}.hero-badge strong{display:block;font:800 1rem Manrope,sans-serif}.hero-badge small{display:block;color:var(--muted);margin-top:3px}
.trust-strip{border-bottom:1px solid var(--line);background:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}.trust-item{display:flex;align-items:center;gap:13px;padding:22px 17px;border-right:1px solid var(--line)}.trust-item:first-child{padding-left:0}.trust-item:last-child{border:0}.trust-icon{width:43px;height:43px;flex:none;display:grid;place-items:center;border-radius:14px;background:var(--green2);color:#0b9b51}.trust-icon svg{width:23px;height:23px}.trust-item strong{display:block;font-size:.9rem;color:var(--navy)}.trust-item span{font-size:.78rem;color:var(--muted)}
.services-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.service-card{padding:25px 20px 23px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;transition:.2s;min-height:240px}.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#b7e8cd}.service-icon{width:53px;height:53px;display:grid;place-items:center;border-radius:17px;background:var(--green2);color:#0b9b51;margin-bottom:21px}.service-icon svg{width:28px;height:28px}.service-card h3{font-size:1.05rem;margin-bottom:10px}.service-card p{font-size:.88rem;color:var(--muted);margin:0}
.industries{background:#eff9f3}.industries-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:45px;align-items:center}.industries-intro h2{font-size:clamp(1.9rem,3vw,2.55rem)}.industries-intro p{color:var(--muted)}.industry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.industry-card{background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 8px 22px rgba(6,41,74,.07)}.industry-card img{width:100%;height:145px;object-fit:cover;display:block}.industry-card-body{padding:17px}.industry-card h3{font-size:.98rem;margin-bottom:7px}.industry-card p{font-size:.81rem;color:var(--muted);margin:0}
.why-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:center}.why-copy h2{font-size:clamp(1.9rem,3vw,2.6rem)}.why-copy p{color:var(--muted)}.why-points{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.why-point{padding:20px;border-radius:15px;background:#f7fafc;border:1px solid #eaf0f4}.why-point .service-icon{margin-bottom:13px;width:44px;height:44px}.why-point h3{font-size:.98rem;margin-bottom:7px}.why-point p{font-size:.84rem;color:var(--muted);margin:0}
.process{background:var(--bluewash)}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;position:relative}.process-card{position:relative;text-align:center;padding:12px 16px}.step-number{width:43px;height:43px;display:grid;place-items:center;margin:0 auto 17px;border-radius:50%;background:var(--green);color:#fff;font:800 1rem Manrope,sans-serif;box-shadow:0 0 0 7px #d9f5e5}.process-card h3{font-size:1.04rem}.process-card p{font-size:.86rem;color:var(--muted);margin:0}.process-card:not(:last-child):after{content:"→";position:absolute;right:-17px;top:19px;color:#8faec4;font-size:1.35rem}
.pricing-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:45px;align-items:center}.pricing-intro h2{font-size:clamp(1.9rem,3vw,2.5rem)}.pricing-intro p{color:var(--muted)}.pricing-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.price-card{border:1px solid var(--line);border-radius:16px;padding:22px 19px;background:#fff}.price-card:nth-child(1){background:#effaf4;border-color:#e0f4e8}.price-card:nth-child(2){background:#eff6fc;border-color:#e0edf7}.price-card:nth-child(3){background:#f7f3ff;border-color:#eee6ff}.price-icon{width:38px;height:38px;border-radius:12px;background:#fff;display:grid;place-items:center;color:#119a53;margin-bottom:14px;font-weight:800}.price-card h3{font-size:.96rem;margin-bottom:9px}.price-card p{font-size:.81rem;color:var(--muted);margin:0}.pricing-disclaimer{font-size:.78rem;color:var(--muted);margin-top:14px}
.cta-band{background:var(--navy);color:#fff;position:relative;overflow:hidden}.cta-band:after{content:"";position:absolute;right:0;top:0;bottom:0;width:48%;background:linear-gradient(90deg,var(--navy),rgba(6,41,74,.15)),url('https://images.unsplash.com/photo-1500382017468-9049fed747ef?auto=format&fit=crop&w=1200&q=80') center/cover}.cta-content{position:relative;z-index:1;padding:58px 0;max-width:650px}.cta-content h2{font-size:clamp(1.8rem,3vw,2.55rem);color:#fff}.cta-content p{color:#d3e2ed;max-width:560px}.footer{background:#041f39;color:#d4e3ee;padding:55px 0 0}.footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:35px;padding-bottom:40px}.footer .brand{color:#fff;margin-bottom:18px}.footer .brand-tagline{display:none}.footer-about p{font-size:.88rem;color:#b7cbd9;max-width:280px}.footer h3{font-size:.93rem;color:#fff;margin-bottom:15px}.footer-links{list-style:none;padding:0;margin:0}.footer-links li{margin:8px 0}.footer-links a,.footer-links span{font-size:.86rem;color:#c2d4e1;text-decoration:none}.footer-links a:hover{color:#5de39b}.contact-line{display:flex;gap:10px;align-items:flex-start;margin:11px 0;font-size:.86rem;color:#c2d4e1;overflow-wrap:anywhere}.contact-line .symbol{color:#55dc94;font-weight:800;min-width:17px}.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding:18px 0;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#a8c0d1;font-size:.77rem}.footer-bottom a{color:inherit;text-decoration:none}.disclaimer{font-size:.75rem;color:#9db7c9;margin-top:14px}
.contact-section{background:#f7fafc}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:start}.contact-copy h2{font-size:clamp(1.9rem,3vw,2.5rem)}.contact-copy p{color:var(--muted)}.contact-card{background:#fff;padding:28px;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 8px 25px rgba(6,41,74,.05)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-weight:700;font-size:.83rem;color:var(--navy)}.field input,.field select,.field textarea{width:100%;padding:12px 13px;border:1px solid #cbd9e4;border-radius:10px;font:inherit;color:var(--ink);background:#fff}.field textarea{min-height:110px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid rgba(25,183,101,.15);border-color:var(--green)}.form-note{font-size:.78rem;color:var(--muted);margin:12px 0 17px}.form-status{margin-top:12px;color:var(--navy);font-size:.86rem;display:none}.form-status.show{display:block}
@media(max-width:1000px){.nav-links{gap:14px}.brand-tagline{display:none}.hero-grid{grid-template-columns:1fr  .85fr}.services-grid{grid-template-columns:repeat(3,1fr)}.service-card{min-height:205px}.industries-layout,.pricing-layout{grid-template-columns:1fr;gap:25px}.industry-card img{height:170px}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.container{width:min(100% - 30px,600px)}.topbar-inner{justify-content:center;text-align:center}.topbar-inner span:first-child{display:none}.nav{height:72px}.menu-toggle{display:block}.nav-links{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;padding:18px 22px 24px;box-shadow:0 15px 25px rgba(6,41,74,.12);align-items:stretch;flex-direction:column;gap:0}.nav-links.open{display:flex}.nav-links a{padding:12px 0;border-bottom:1px solid #eef2f5}.nav-links .nav-cta{margin-top:12px;border:0;text-align:center}.hero-grid{grid-template-columns:1fr}.hero-copy{padding:58px 0 38px}.hero-image{min-height:290px;margin:0 -15px}.hero-image:after{background:linear-gradient(0deg,rgba(6,41,74,.45),transparent 70%)}.hero-badge{right:15px;bottom:15px}.trust-grid{grid-template-columns:repeat(2,1fr)}.trust-item{padding:16px 8px;border-bottom:1px solid var(--line)}.trust-item:first-child{padding-left:8px}.trust-item:nth-child(2){border-right:0}.trust-item:nth-child(3),.trust-item:nth-child(4){border-bottom:0}.section{padding:60px 0}.section-head{margin-bottom:30px}.services-grid{grid-template-columns:repeat(2,1fr);gap:12px}.service-card{padding:20px 16px;min-height:0}.industries-layout{gap:25px}.industry-grid{grid-template-columns:1fr;gap:14px}.industry-card{display:grid;grid-template-columns:125px 1fr}.industry-card img{height:100%;min-height:130px}.industry-card-body{padding:17px}.why-grid{grid-template-columns:1fr;gap:28px}.why-points{gap:10px}.why-point{padding:16px}.process-grid{grid-template-columns:repeat(2,1fr);gap:24px 10px}.process-card:nth-child(2):after{display:none}.pricing-cards{grid-template-columns:1fr}.price-card{display:grid;grid-template-columns:45px 1fr;column-gap:12px;padding:18px}.price-icon{grid-row:span 2;margin:0}.price-card h3{align-self:end}.price-card p{grid-column:2}.cta-band:after{width:100%;opacity:.22}.cta-content{padding:48px 0}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-about{grid-column:1/-1}.contact-grid{grid-template-columns:1fr;gap:25px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}
@media(max-width:420px){.brand-name{font-size:1.08rem}.brand-mark{width:38px;height:38px}.hero h1{font-size:2.35rem}.services-grid{grid-template-columns:1fr}.trust-item{gap:9px}.trust-item span{font-size:.72rem}.footer-grid{grid-template-columns:1fr}.footer-about{grid-column:auto}.footer-bottom{flex-direction:column}.hero-badge{max-width:210px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* 2. Logo / wordmark ------------------------------------------------------ */
@font-face {
  font-family: "Archivo";
  src: url("/assets/fonts/archivo-sc-latin.woff2") format("woff2");
  font-weight: 700 800;
  font-stretch: 87.5%;
  font-style: normal;
  font-display: swap;
}
.brand-mark { width: auto; height: auto; background: none; border-radius: 0; }
.brand-mark svg { width: 34px; height: 34px; display: block; }
.brand-name {
  font-family: "Archivo", Manrope, sans-serif;
  font-stretch: 87.5%;
  font-weight: 800;
  font-size: 1.35rem;
  line-height: 1;
  letter-spacing: -0.02em;
}
.brand-name span {
  margin-top: 3px;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #0a7a42;
}
.footer .brand-name span { color: var(--green); }
.brand-tagline { max-width: 210px; }

/* 3. WhatsApp click-to-chat ---------------------------------------------- */
/* WhatsApp green, darkened slightly so the white icon reads clearly (3.1:1). */
.whatsapp-float {
  --wa: #1da851;
  --wa-dark: #178a43;
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.whatsapp-icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: var(--wa);
  color: #fff;
  box-shadow: 0 8px 22px rgba(6, 41, 74, 0.22), 0 2px 6px rgba(6, 41, 74, 0.12);
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.whatsapp-icon svg { width: 30px; height: 30px; }
/* Soft ring that pulses a few times after page load to draw the eye, then stops. */
.whatsapp-icon::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(29, 168, 81, 0.45);
  animation: wa-pulse 2.4s ease-out 1.5s 3;
}
@keyframes wa-pulse {
  0% { box-shadow: 0 0 0 0 rgba(29, 168, 81, 0.45); }
  70% { box-shadow: 0 0 0 16px rgba(29, 168, 81, 0); }
  100% { box-shadow: 0 0 0 0 rgba(29, 168, 81, 0); }
}
/* Label: a speech bubble to the left of the icon (shown on wider screens). */
.whatsapp-label {
  display: none;
  flex-direction: column;
  padding: 9px 14px;
  border-radius: 12px 12px 4px 12px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 8px 22px rgba(6, 41, 74, 0.14);
  color: var(--navy);
  line-height: 1.25;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.whatsapp-label strong { font: 700 0.9rem Manrope, sans-serif; }
.whatsapp-label small { font-size: 0.76rem; color: var(--muted); }
.whatsapp-float:hover .whatsapp-icon,
.whatsapp-float:focus-visible .whatsapp-icon { background: var(--wa-dark); transform: scale(1.05); }
.whatsapp-float:hover .whatsapp-label { transform: translateX(-3px); }
.whatsapp-float:focus-visible { outline: none; }
.whatsapp-float:focus-visible .whatsapp-icon { outline: 3px solid var(--navy); outline-offset: 3px; }
@media (min-width: 761px) { .whatsapp-label { display: flex; } }

/* 4. Accessibility helpers ------------------------------------------------ */
.skip-link {
  position: absolute; left: 16px; top: -100px; z-index: 100;
  padding: 10px 16px; background: var(--navy); color: #fff; font-weight: 700; border-radius: 8px;
}
.skip-link:focus { top: 16px; }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
main:focus { outline: none; }
@media (prefers-reduced-motion: reduce) { .whatsapp-icon::after { animation: none; } }

/* ==========================================================================
   5. Inner pages (Services, About, Blog, Contact, Legal)
   Built on the original tokens: --navy, --green, --green2, --line, --muted, --radius
   ========================================================================== */

/* Shared helpers */
.section--alt { background: #f7fafc; }
.section--tight { padding: 64px 0; }
.muted { color: var(--muted); }
.muted a { color: #0a7a42; font-weight: 600; }
.section-head--left { margin-left: 0; text-align: left; }
.placeholder-text { color: #8a6d00 !important; font-style: italic; }
.placeholder-box {
  display: grid; place-items: center;
  background: repeating-linear-gradient(135deg, #eef6fc 0 10px, #f7fafc 10px 20px);
  border: 1px dashed #9db0c0; color: var(--muted); font-size: .8rem; font-weight: 700;
}
.placeholder-banner {
  background: #fff8e1; border: 1px solid #f1d27a; border-left: 4px solid #d9a400;
  color: #5c4300; padding: 14px 18px; border-radius: 10px; font-size: .9rem; margin-bottom: 28px;
}
.img-placeholder {
  display: grid; place-items: center; aspect-ratio: 3/2; padding: 16px; text-align: center;
  background: repeating-linear-gradient(135deg, #eef6fc 0 10px, #f7fafc 10px 20px);
  border: 1px dashed #9db0c0; color: var(--muted); font-size: .85rem;
}

/* Page hero (inner pages) */
.page-hero {
  position: relative; overflow: hidden;
  background: var(--navy); color: #fff;
  padding: 56px 0 64px;
}
.page-hero { border-bottom: 4px solid var(--green); }
.page-hero .container { position: relative; z-index: 1; }
.page-hero h1 {
  color: #fff; font-size: clamp(2rem, 4.2vw, 3.1rem); letter-spacing: -.04em;
  max-width: 820px; margin-bottom: 16px;
}
.page-lead { color: #d0e0ed; font-size: 1.08rem; max-width: 680px; margin: 0; }
.page-meta { color: #b7cbd9; font-size: .9rem; margin: 6px 0 0; }
.breadcrumb ol { list-style: none; padding: 0; margin: 0 0 26px; display: flex; flex-wrap: wrap; gap: 6px; font-size: .84rem; }
.breadcrumb li { color: #b7cbd9; }
.breadcrumb li + li::before { content: "/"; margin-right: 6px; color: #6f8ba3; }
.breadcrumb a { color: #d8e7f2; text-decoration: none; }
.breadcrumb a:hover { color: #5de39b; text-decoration: underline; }
.breadcrumb [aria-current] { color: #fff; font-weight: 600; }

/* Current page in the main nav */
.nav-links a[aria-current="page"] { color: #0a7a42; }
.nav-links a[aria-current="page"]:not(.btn) { box-shadow: inset 0 -2px 0 var(--green); }

/* Lists with check / cross markers */
.check-list, .cross-list { list-style: none; padding: 0; margin: 0; }
.check-list li, .cross-list li { position: relative; padding: 7px 0 7px 30px; font-size: .95rem; }
.check-list li::before, .cross-list li::before {
  content: ""; position: absolute; left: 0; top: 10px; width: 19px; height: 19px; border-radius: 50%;
  background: var(--green2) center/11px no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b9b51' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E");
}
.cross-list li { color: var(--muted); }
.cross-list li::before {
  background-color: #f1f4f7;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d8fa0' stroke-width='4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
}

/* --- Services ---------------------------------------------------------- */
.overview-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 56px; align-items: start; }
.overview-intro h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); }
.overview-intro p { color: var(--muted); }
.overview-note { background: var(--green2); border-radius: 14px; padding: 16px 18px; color: var(--ink) !important; font-size: .93rem; }
.overview-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.overview-list a {
  display: grid; grid-template-columns: 46px 1fr 24px; gap: 14px; align-items: center;
  padding: 18px 6px; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--ink);
  transition: background-color .2s, padding .2s;
}
.overview-list a:hover { background: #f7fafc; padding-left: 12px; }
.overview-num { font: 800 1.05rem Manrope, sans-serif; color: #0a7a42; }
.overview-text strong { display: block; font: 700 1.02rem Manrope, sans-serif; color: var(--navy); }
.overview-text span { font-size: .88rem; color: var(--muted); }
.overview-arrow { color: #8faec4; font-size: 1.2rem; transition: transform .2s, color .2s; }
.overview-list a:hover .overview-arrow { transform: translateX(4px); color: #0a7a42; }

.with-sidebar { display: grid; grid-template-columns: 240px 1fr; gap: 48px; align-items: start; }
.subnav { position: sticky; top: 110px; }
.subnav-title { font-size: .74rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.subnav ul { list-style: none; padding: 0; margin: 0 0 22px; border-left: 2px solid var(--line); }
.subnav ul a {
  display: block; padding: 8px 0 8px 16px; margin-left: -2px; border-left: 2px solid transparent;
  color: var(--muted); font-size: .9rem; font-weight: 600; text-decoration: none;
}
.subnav ul a:hover { color: var(--navy); }
.subnav ul a.is-active { color: var(--navy); border-left-color: var(--green); }
.subnav-cta { width: 100%; font-size: .9rem; }

.service-details { display: grid; gap: 22px; }
.service-detail {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 34px; scroll-margin-top: 110px;
}
.service-detail-head { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.service-detail-head .service-icon { margin: 0; flex: none; }
.service-detail-num { margin: 0 0 2px; font-size: .74rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #0a7a42; }
.service-detail h2 { font-size: clamp(1.4rem, 2.4vw, 1.8rem); margin: 0; }
.service-detail-intro { color: var(--muted); font-size: 1.02rem; max-width: 70ch; }
.detail-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--line); }
.detail-columns h3 { font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.check-list--deliverables li { font-weight: 600; color: var(--navy); }
.detail-note { margin: 22px 0 0; padding: 14px 16px; background: var(--bluewash); border-radius: 12px; font-size: .9rem; color: var(--ink); }

/* FAQ (native details/summary) */
.faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 56px; align-items: start; }
.faq-layout h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list details:first-child { border-top: 1px solid var(--line); }
.faq-list summary {
  display: flex; justify-content: space-between; gap: 16px; align-items: center;
  padding: 20px 0; cursor: pointer; list-style: none;
  font: 700 1.04rem Manrope, sans-serif; color: var(--navy);
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after {
  content: "+"; flex: none; width: 30px; height: 30px; display: grid; place-items: center;
  border-radius: 50%; background: var(--green2); color: #0b9b51; font-size: 1.2rem; transition: transform .2s;
}
.faq-list details[open] summary::after { transform: rotate(45deg); }
.faq-list details p { color: var(--muted); margin: 0 0 20px; max-width: 64ch; }

/* --- About ------------------------------------------------------------- */
.about-intro { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; }
.about-copy h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
.about-copy p { color: var(--muted); }
.about-figure { margin: 0; }
.about-figure img, .about-figure .img-placeholder { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--radius); }
.about-figure figcaption { font-size: .8rem; margin-top: 10px; }

.compare-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.compare-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; }
.compare-card h3 { font-size: 1.15rem; padding-bottom: 14px; margin-bottom: 10px; border-bottom: 1px solid var(--line); }
.compare-card--us { border: 2px solid var(--green); box-shadow: var(--shadow); }
.compare-card--us h3 { color: #0a7a42; }

.principles { display: grid; grid-template-columns: .8fr 1.2fr; gap: 56px; align-items: start; }
.principles h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); }
.principle-list { list-style: none; padding: 0; margin: 0; counter-reset: principle; display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.principle-list li { counter-increment: principle; padding: 22px 0; border-top: 1px solid var(--line); }
.principle-list li::before {
  content: counter(principle, decimal-leading-zero);
  display: block; margin-bottom: 8px; font: 800 .85rem Manrope, sans-serif; color: #0a7a42; letter-spacing: .08em;
}
.principle-list h3 { font-size: 1.08rem; margin-bottom: 6px; }
.principle-list p { color: var(--muted); margin: 0; font-size: .93rem; }

.facts-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 40px; align-items: start; }
.facts-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; }
.facts-card h2, .team h2 { font-size: 1.5rem; }
.facts { margin: 0; }
.facts div { display: grid; grid-template-columns: 130px 1fr; gap: 12px; padding: 11px 0; border-top: 1px solid var(--line); font-size: .9rem; }
.facts dt { color: var(--muted); font-weight: 600; }
.facts dd { margin: 0; color: var(--ink); }
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.team-card h3 { font-size: 1rem; margin: 12px 0 2px; }
.team-card p { font-size: .85rem; margin: 0; }
.team-photo { aspect-ratio: 1; border-radius: 14px; }

/* --- Blog -------------------------------------------------------------- */
.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.post-card {
  display: flex; flex-direction: column; background: #fff;
  border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
  transition: border-color .2s, box-shadow .2s;
}
.post-card:hover { border-color: #b7e8cd; box-shadow: var(--shadow); }
.post-card-media img, .post-card-media .img-placeholder { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.post-card-body { padding: 22px; display: flex; flex-direction: column; flex: 1; }
.post-card h2 { font-size: 1.15rem; line-height: 1.3; margin-bottom: 10px; }
.post-card h2 a { color: var(--navy); text-decoration: none; }
.post-card h2 a::after { content: ""; position: absolute; inset: 0; }   /* whole card clickable */
.post-card { position: relative; }
.post-card h2 a:focus-visible { outline: none; }
.post-card:focus-within { outline: 3px solid var(--green); outline-offset: 3px; }
.post-card p { color: var(--muted); font-size: .92rem; }
.post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .8rem !important; color: var(--muted); margin-bottom: 12px; }
.post-tag { background: var(--green2); color: #0a7a42; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.read-more { margin-top: auto; font-weight: 700; font-size: .9rem; color: #0a7a42; text-decoration: none; }
.pagination { display: flex; justify-content: space-between; margin-top: 40px; }
.pagination a { font-weight: 700; color: var(--navy); }

.post-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 56px; align-items: start; }
.post-aside { position: sticky; top: 110px; }
.aside-card { background: var(--navy); color: #d0e0ed; border-radius: var(--radius); padding: 26px; }
.aside-card h2 { color: #fff; font-size: 1.2rem; }
.aside-card p { font-size: .9rem; }
.aside-card .btn { width: 100%; }
.aside-link { display: block; margin-top: 12px; text-align: center; font-size: .85rem; color: #b7cbd9; }
.post-figure { margin: 0 0 28px; }
.post-figure img, .post-figure .img-placeholder { width: 100%; border-radius: var(--radius); aspect-ratio: 16/9; object-fit: cover; }
.post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 56px; }
.post-nav-link {
  display: block; padding: 20px 22px; border: 1px solid var(--line); border-radius: 14px;
  text-decoration: none; color: var(--navy); font: 700 1rem Manrope, sans-serif; line-height: 1.35;
}
.post-nav-link span { display: block; font: 600 .78rem "DM Sans", sans-serif; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: 6px; }
.post-nav-link--older { text-align: right; }
.post-nav-link:hover { border-color: var(--green); }

/* Long-form text: blog posts and legal pages */
.prose { max-width: 720px; font-size: 1.04rem; line-height: 1.75; }
.prose h2 { font-size: 1.5rem; margin: 2em 0 .6em; }
.prose h3 { font-size: 1.15rem; margin: 1.6em 0 .5em; }
.prose > :first-child { margin-top: 0; }
.prose p, .prose ul, .prose ol { margin: 0 0 1.1em; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li { margin-bottom: .4em; }
.prose a { color: #0a7a42; font-weight: 600; }
.prose strong { color: var(--navy); }
.prose blockquote { margin: 1.5em 0; padding: 4px 0 4px 20px; border-left: 4px solid var(--green); color: var(--navy); font-style: italic; }
.prose table { width: 100%; border-collapse: collapse; margin: 1.5em 0; font-size: .92rem; display: block; overflow-x: auto; }
.prose th, .prose td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.prose thead th { background: var(--navy); color: #fff; font-weight: 700; }
.prose tbody th { font-weight: 600; color: var(--navy); }
.prose code { background: var(--bluewash); padding: 2px 6px; border-radius: 6px; font-size: .9em; }
.legal-layout { max-width: 820px; }

/* --- Contact ----------------------------------------------------------- */
.contact-page { display: grid; grid-template-columns: .8fr 1.2fr; gap: 40px; align-items: start; }
.contact-methods { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 12px; }
.contact-method {
  display: flex; align-items: center; gap: 14px; padding: 16px 18px;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  text-decoration: none; color: var(--ink); transition: border-color .2s, transform .2s;
}
a.contact-method:hover { border-color: var(--green); transform: translateY(-1px); }
.contact-method strong { display: block; font: 700 .95rem Manrope, sans-serif; color: var(--navy); }
.contact-method span span { font-size: .9rem; color: var(--muted); overflow-wrap: anywhere; }
.contact-method-icon { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: var(--green2); color: #0b9b51; }
.contact-method-icon svg { width: 22px; height: 22px; }
.contact-method-icon--wa { background: #1da851; color: #fff; }
.next-steps { background: var(--navy); color: #d0e0ed; border-radius: var(--radius); padding: 26px; }
.next-steps h2 { color: #fff; font-size: 1.2rem; }
.next-steps ol { margin: 0; padding: 0; list-style: none; counter-reset: step; }
.next-steps li { counter-increment: step; position: relative; padding: 10px 0 10px 40px; font-size: .92rem; border-top: 1px solid rgba(255,255,255,.12); }
.next-steps li::before {
  content: counter(step); position: absolute; left: 0; top: 10px; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center; background: var(--green); color: #fff; font: 800 .8rem Manrope, sans-serif;
}
.next-steps strong { color: #fff; }
.contact-card--page { padding: 34px; }
.form-title { font-size: 1.4rem; margin-bottom: 20px; }

/* Form states (homepage and contact page) */
.req { color: #c0392b; }
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.field-error { margin: 0; min-height: 0; font-size: .8rem; color: #b42318; font-weight: 600; }
.field-error:empty { display: none; }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: #d92d20; background: #fffbfa; }
.field.has-error input:focus, .field.has-error select:focus { outline-color: rgba(217,45,32,.18); }
.form-alert { margin-bottom: 18px; padding: 14px 16px; border-radius: 10px; background: #fef3f2; border: 1px solid #fecdca; color: #912018; font-size: .9rem; }
.form-alert a { color: inherit; font-weight: 700; }
.form-note a { color: #0a7a42; }
.enquiry-form button[aria-busy="true"] { opacity: .75; cursor: progress; }
.enquiry-form button[aria-busy="true"] .btn-label::after { content: "…"; }
.form-success { text-align: center; padding: 32px 12px; }
.form-success:focus { outline: none; }
.success-icon { width: 64px; height: 64px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 50%; background: var(--green2); color: #0b9b51; }
.success-icon svg { width: 30px; height: 30px; }
.form-success h3 { font-size: 1.35rem; }
.form-success p { color: var(--muted); max-width: 46ch; margin: 0 auto; }
.form-success a { color: #0a7a42; font-weight: 700; }

/* 404 */
.link-cards { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.link-cards a { display: block; height: 100%; padding: 22px; border: 1px solid var(--line); border-radius: 14px; text-decoration: none; transition: border-color .2s; }
.link-cards a:hover { border-color: var(--green); }
.link-cards strong { display: block; color: var(--navy); font: 700 1.05rem Manrope, sans-serif; margin-bottom: 4px; }
.link-cards span { color: var(--muted); font-size: .88rem; }

/* Inner pages: tablet */
@media (max-width: 1000px) {
  .with-sidebar { grid-template-columns: 1fr; }
  .subnav { position: static; display: none; }
  .post-layout { grid-template-columns: 1fr; }
  .post-aside { position: static; max-width: 720px; }
  .post-grid { grid-template-columns: repeat(2, 1fr); }
  .overview-grid, .faq-layout, .principles, .facts-layout, .about-intro, .contact-page { grid-template-columns: 1fr; gap: 32px; }
  .link-cards { grid-template-columns: repeat(2, 1fr); }
}
/* Inner pages: mobile */
@media (max-width: 760px) {
  .page-hero { padding: 40px 0 46px; }
  .section--tight { padding: 48px 0; }
  .service-detail, .compare-card, .facts-card, .contact-card--page { padding: 22px; }
  .detail-columns, .compare-cards, .principle-list, .post-grid, .post-nav { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .facts div { grid-template-columns: 1fr; gap: 2px; }
  .post-nav-link--older { text-align: left; }
  .link-cards { grid-template-columns: 1fr; }
}