/* ==========================================================================
   Top End Pressure Cleaning — site stylesheet
   Static build of the Claude Design system (project 25d599).
   Tokens are reproduced from tokens/*.css; component styles are ported from
   the React design system to plain CSS classes. Australian English throughout.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:ital,wght@0,500;0,600;0,700;0,800;1,700&family=Public+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

/* ---- Tokens: colour ---- */
:root {
  --blue-50:#eaf3fb; --blue-100:#cfe4f6; --blue-200:#a0c9ec; --blue-300:#66a8df;
  --blue-400:#2e88d1; --blue-500:#0e63b2; --blue-600:#0b539a; --blue-700:#094380;
  --blue-800:#0a3666; --blue-900:#0c2340;
  --navy-900:#0c2340; --navy-800:#0f2b50; --navy-700:#143862;
  --sky-200:#bfe4f8; --sky-300:#7ccbf2; --sky-400:#43aee8; --sky-500:#1fa0e0; --sky-600:#1487c2;
  --white:#ffffff; --neutral-25:#fbfcfd; --neutral-50:#f4f7fa; --neutral-100:#e9eef3;
  --neutral-200:#d8e0e8; --neutral-300:#bcc8d3; --neutral-400:#93a2b2; --neutral-500:#6b7b8c;
  --neutral-600:#4e5c6b; --neutral-700:#38434f; --neutral-800:#232c35; --neutral-900:#0f1b28;
  --success-500:#18935f; --success-50:#e7f5ee; --warning-500:#e0921f; --warning-50:#fcf1dd;
  --error-500:#d64545; --error-50:#fbe9e9; --info-500:#0e63b2; --info-50:#e6f1fa;

  --color-primary:var(--blue-500); --color-primary-hover:var(--blue-600); --color-primary-active:var(--blue-700);
  --color-accent:var(--sky-500); --color-navy:var(--navy-900);
  --surface-page:var(--neutral-50); --surface-card:var(--white); --surface-sunken:var(--neutral-100);
  --surface-dark:var(--navy-900); --surface-dark-raised:var(--navy-700);
  --border-subtle:var(--neutral-200); --border-strong:var(--neutral-300); --border-focus:var(--blue-500);
  --text-strong:var(--neutral-900); --text-body:var(--neutral-700); --text-muted:var(--neutral-500);
  --text-on-primary:var(--white); --text-on-dark:var(--white); --text-on-dark-muted:#a9bbcd; --text-link:var(--blue-600);
  --focus-ring:0 0 0 3px rgba(14,99,178,0.35);

  /* ---- Tokens: type ---- */
  --font-display:'Barlow Semi Condensed','Arial Narrow',sans-serif;
  --font-body:'Public Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extrabold:800;
  --text-display:4.0rem; --text-h1:3.0rem; --text-h2:2.25rem; --text-h3:1.75rem; --text-h4:1.375rem;
  --text-h5:1.125rem; --text-h6:1.0rem; --text-body-lg:1.125rem; --text-body-base:1.0rem;
  --text-body-sm:0.875rem; --text-caption:0.75rem;
  --lh-tight:1.05; --lh-heading:1.15; --lh-snug:1.35; --lh-body:1.6;
  --ls-display:-0.02em; --ls-heading:-0.01em; --ls-eyebrow:0.12em; --ls-normal:0;

  /* ---- Tokens: spacing / layout ---- */
  --space-0:0; --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.25rem;
  --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem; --space-16:4rem; --space-20:5rem;
  --space-24:6rem; --space-32:8rem;
  --section-y:clamp(3.5rem,8vw,7rem);
  --container-sm:640px; --container-md:768px; --container-lg:1024px; --container-xl:1200px;
  --container-content:720px; --gutter:clamp(1rem,5vw,2.5rem);
  --radius-xs:4px; --radius-sm:6px; --radius-md:10px; --radius-lg:16px; --radius-xl:24px;
  --radius-pill:999px; --radius-circle:50%; --border-thin:1px; --border-med:2px;

  /* ---- Tokens: elevation / motion ---- */
  --shadow-xs:0 1px 2px rgba(12,35,64,.06);
  --shadow-sm:0 1px 3px rgba(12,35,64,.08),0 1px 2px rgba(12,35,64,.06);
  --shadow-md:0 4px 12px rgba(12,35,64,.10),0 2px 4px rgba(12,35,64,.06);
  --shadow-lg:0 12px 28px rgba(12,35,64,.14),0 4px 8px rgba(12,35,64,.06);
  --shadow-xl:0 24px 48px rgba(12,35,64,.18);
  --shadow-primary:0 8px 20px rgba(14,99,178,.28);
  --ease-standard:cubic-bezier(.2,0,0,1); --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-fast:120ms; --dur-base:200ms; --dur-slow:320ms;
}

/* ---- Base ---- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);font-size:var(--text-body-base);line-height:var(--lh-body);
  color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text-strong);line-height:var(--lh-heading);
  letter-spacing:var(--ls-heading);font-weight:var(--fw-bold);margin:0;text-wrap:balance}
h1{font-size:var(--text-h1);font-weight:var(--fw-extrabold);line-height:var(--lh-tight)}
h2{font-size:var(--text-h2)} h3{font-size:var(--text-h3)} h4{font-size:var(--text-h4)}
h5{font-size:var(--text-h5)} h6{font-size:var(--text-h6)}
p{margin:0}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---- Icons (Lucide via CSS mask; recolour via currentColor) ---- */
.ico{display:inline-block;flex:none;width:var(--ico-sz,20px);height:var(--ico-sz,20px);
  background-color:currentColor;-webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.ico--14{--ico-sz:14px} .ico--18{--ico-sz:18px} .ico--20{--ico-sz:20px} .ico--22{--ico-sz:22px}
.ico--26{--ico-sz:26px} .ico--28{--ico-sz:28px} .ico--30{--ico-sz:30px} .ico--34{--ico-sz:34px}
.ico--primary{color:var(--color-primary)} .ico--sky{color:var(--sky-400)} .ico--white{color:#fff}
.ico--success{color:var(--success-500)} .ico--gold{color:#f5a623} .ico--muted{color:var(--text-muted)}
.ico-spray-can{-webkit-mask-image:url(../icons/spray-can.svg);mask-image:url(../icons/spray-can.svg)}
.ico-home{-webkit-mask-image:url(../icons/home.svg);mask-image:url(../icons/home.svg)}
.ico-house{-webkit-mask-image:url(../icons/house.svg);mask-image:url(../icons/house.svg)}
.ico-fence{-webkit-mask-image:url(../icons/fence.svg);mask-image:url(../icons/fence.svg)}
.ico-sun{-webkit-mask-image:url(../icons/sun.svg);mask-image:url(../icons/sun.svg)}
.ico-truck{-webkit-mask-image:url(../icons/truck.svg);mask-image:url(../icons/truck.svg)}
.ico-droplets{-webkit-mask-image:url(../icons/droplets.svg);mask-image:url(../icons/droplets.svg)}
.ico-arrow-right{-webkit-mask-image:url(../icons/arrow-right.svg);mask-image:url(../icons/arrow-right.svg)}
.ico-phone{-webkit-mask-image:url(../icons/phone.svg);mask-image:url(../icons/phone.svg)}
.ico-phone-call{-webkit-mask-image:url(../icons/phone-call.svg);mask-image:url(../icons/phone-call.svg)}
.ico-shield-check{-webkit-mask-image:url(../icons/shield-check.svg);mask-image:url(../icons/shield-check.svg)}
.ico-badge-check{-webkit-mask-image:url(../icons/badge-check.svg);mask-image:url(../icons/badge-check.svg)}
.ico-map-pin{-webkit-mask-image:url(../icons/map-pin.svg);mask-image:url(../icons/map-pin.svg)}
.ico-mail{-webkit-mask-image:url(../icons/mail.svg);mask-image:url(../icons/mail.svg)}
.ico-clock{-webkit-mask-image:url(../icons/clock.svg);mask-image:url(../icons/clock.svg)}
.ico-sparkles{-webkit-mask-image:url(../icons/sparkles.svg);mask-image:url(../icons/sparkles.svg)}
.ico-cloud-drizzle{-webkit-mask-image:url(../icons/cloud-drizzle.svg);mask-image:url(../icons/cloud-drizzle.svg)}
.ico-chevrons-left-right{-webkit-mask-image:url(../icons/chevrons-left-right.svg);mask-image:url(../icons/chevrons-left-right.svg)}
.ico-check{-webkit-mask-image:url(../icons/check.svg);mask-image:url(../icons/check.svg)}
.ico-circle-check{-webkit-mask-image:url(../icons/circle-check.svg);mask-image:url(../icons/circle-check.svg)}
.ico-users{-webkit-mask-image:url(../icons/users.svg);mask-image:url(../icons/users.svg)}
.ico-map{-webkit-mask-image:url(../icons/map.svg);mask-image:url(../icons/map.svg)}
.ico-handshake{-webkit-mask-image:url(../icons/handshake.svg);mask-image:url(../icons/handshake.svg)}
.ico-leaf{-webkit-mask-image:url(../icons/leaf.svg);mask-image:url(../icons/leaf.svg)}
.ico-clipboard-check{-webkit-mask-image:url(../icons/clipboard-check.svg);mask-image:url(../icons/clipboard-check.svg)}
.ico-star{-webkit-mask-image:url(../icons/star.svg);mask-image:url(../icons/star.svg)}
.ico-menu{-webkit-mask-image:url(../icons/menu.svg);mask-image:url(../icons/menu.svg)}
.ico-x{-webkit-mask-image:url(../icons/x.svg);mask-image:url(../icons/x.svg)}
.ico-chevron-down{-webkit-mask-image:url(../icons/chevron-down.svg);mask-image:url(../icons/chevron-down.svg)}
.ico-instagram{-webkit-mask-image:url(../icons/instagram.svg);mask-image:url(../icons/instagram.svg)}
.ico-facebook{-webkit-mask-image:url(../icons/facebook.svg);mask-image:url(../icons/facebook.svg)}
.ico-send{-webkit-mask-image:url(../icons/send.svg);mask-image:url(../icons/send.svg)}

/* ---- Layout ---- */
.container{max-width:var(--container-xl);margin:0 auto;padding:0 var(--gutter)}
.container--narrow{max-width:var(--container-lg)}
.section{padding:var(--section-y) 0}
.section--sunken{background:var(--surface-sunken)}
.section--dark{background:var(--surface-dark);color:var(--text-on-dark)}
.stack-center{text-align:center}

/* ---- Eyebrow / section heads ---- */
.eyebrow{font-family:var(--font-display);font-weight:700;font-size:14px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--color-primary);margin-bottom:12px;display:block}
.eyebrow--ondark{color:var(--sky-400)}
.section-head{text-align:center;max-width:720px;margin:0 auto var(--space-12)}
.section-head h2{font-size:var(--text-h2)}
.section-head .intro{font-size:var(--text-body-lg);color:var(--text-muted);margin-top:12px}
.section-head--ondark h2{color:#fff}
.section-head--ondark .intro{color:var(--text-on-dark-muted)}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-display);
  font-weight:700;letter-spacing:.01em;line-height:1;height:46px;padding:11px 20px;font-size:16px;
  border-radius:var(--radius-md);cursor:pointer;border:2px solid transparent;text-decoration:none;
  white-space:nowrap;transition:background var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard),transform var(--dur-fast) var(--ease-standard),border-color var(--dur-base)}
.btn--lg{height:56px;padding:15px 28px;font-size:18px;gap:10px}
.btn--sm{height:38px;padding:8px 14px;font-size:14px;gap:6px}
.btn--block{width:100%}
.btn--primary{background:var(--color-primary);color:var(--text-on-primary);box-shadow:var(--shadow-sm)}
.btn--primary:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-primary)}
.btn--primary:active{background:var(--color-primary-active);transform:translateY(1px)}
.btn--secondary{background:var(--white);color:var(--color-primary);border-color:var(--color-primary)}
.btn--secondary:hover{background:var(--blue-50)}
.btn--navy{background:var(--navy-900);color:#fff;box-shadow:var(--shadow-sm)}
.btn--navy:hover{background:var(--navy-800);box-shadow:var(--shadow-md)}
.btn--ghost{background:transparent;color:var(--color-primary)}
.btn--ghost:hover{background:var(--blue-50)}
.btn--outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn--outline-light:hover{background:rgba(255,255,255,.12)}

/* ---- Cards ---- */
.card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);padding:var(--space-6);transition:box-shadow var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard)}
.card--pad-lg{padding:var(--space-8)}
.card--interactive{cursor:pointer}
.card--interactive:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}

/* ---- Badges ---- */
.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-display);font-weight:700;
  letter-spacing:.03em;text-transform:uppercase;border-radius:var(--radius-pill);line-height:1.2;
  font-size:13px;padding:5px 12px;background:var(--neutral-100);color:var(--neutral-700)}
.badge--primary{background:var(--blue-50);color:var(--blue-700)}
.badge--navy{background:var(--navy-900);color:#fff}
.badge--success{background:var(--success-50);color:var(--success-500)}
.badge--before{background:rgba(12,35,64,.85);color:#fff}
.badge--after{background:var(--color-primary);color:#fff}

/* ---- Grids ---- */
.grid{display:grid;gap:var(--space-6)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6)}

/* ---- Feature tiles / trust / steps ---- */
.feature-ico{width:52px;height:52px;border-radius:var(--radius-md);background:var(--blue-50);
  display:grid;place-items:center;margin-bottom:var(--space-4)}
.feature-ico--lg{width:56px;height:56px}
.trust-ico{width:64px;height:64px;border-radius:50%;background:var(--blue-50);display:grid;place-items:center;margin:0 auto var(--space-4)}
.trust-item{text-align:center}
.step__top{display:flex;align-items:center;gap:12px;margin-bottom:var(--space-4)}
.step__num{font-family:var(--font-display);font-weight:800;font-size:34px;color:var(--blue-200)}

/* ---- Navbar ---- */
.nav{position:sticky;top:0;z-index:50;width:100%;background:var(--white);
  border-bottom:1px solid var(--border-subtle);transition:box-shadow var(--dur-base),background var(--dur-base)}
.nav.is-scrolled{background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(8px);box-shadow:var(--shadow-sm)}
.nav__inner{max-width:var(--container-xl);margin:0 auto;padding:0 var(--gutter);height:74px;
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.nav__logo{display:flex;align-items:center;flex:none}
.nav__logo img{height:52px;width:auto;display:block}
.nav__links{display:flex;gap:var(--space-6);align-items:center}
.nav__links a{font-family:var(--font-display);font-weight:600;font-size:17px;text-decoration:none;white-space:nowrap;
  color:var(--text-strong);padding-bottom:2px;border-bottom:3px solid transparent;transition:color var(--dur-fast)}
.nav__links a:hover{color:var(--color-primary)}
.nav__links a.is-active{color:var(--color-primary);border-bottom-color:var(--color-primary)}
.nav__actions{display:flex;align-items:center;gap:var(--space-3);flex:none}
.nav__phone{display:flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--font-display);
  font-weight:700;font-size:17px;color:var(--navy-900);white-space:nowrap}
.nav__toggle{display:none;background:none;border:none;cursor:pointer;color:var(--navy-900);padding:6px}
.nav__mobile{display:none;border-top:1px solid var(--border-subtle);background:var(--white);padding:var(--space-4) var(--gutter)}
.nav__mobile.is-open{display:block}
.nav__mobile a{display:block;padding:12px 4px;font-family:var(--font-display);font-weight:600;font-size:18px;
  text-decoration:none;color:var(--text-strong);border-bottom:1px solid var(--border-subtle)}
.nav__mobile a:last-of-type{border-bottom:none}
.nav__mobile .btn{margin-top:var(--space-4)}

/* ---- Hero ---- */
.hero{position:relative;background:linear-gradient(135deg,#0c2340 0%,#0e3a6e 55%,#0e63b2 100%);
  color:var(--white);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;opacity:.5;
  background:radial-gradient(circle at 80% 20%,rgba(31,160,224,.45),transparent 45%)}
.hero__inner{position:relative;padding:clamp(3rem,7vw,6rem) var(--gutter)}
.hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-12);align-items:center}
.hero h1{color:var(--white);font-size:clamp(2.6rem,6vw,4rem);line-height:1.02}
.hero h1 .hl{color:var(--sky-400)}
.hero__lead{font-size:var(--text-body-lg);color:rgba(255,255,255,.85);max-width:520px;margin-top:var(--space-5)}
.hero__cta{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-8)}
.hero__trust{display:flex;align-items:center;gap:var(--space-6);margin-top:var(--space-8);flex-wrap:wrap;
  font-size:15px;color:rgba(255,255,255,.9)}
.hero__trust span{display:flex;align-items:center;gap:8px}

/* ---- Page header (inner pages) ---- */
.page-header{background:var(--navy-900);color:#fff;position:relative;overflow:hidden}
.page-header::before{content:"";position:absolute;inset:0;opacity:.45;
  background:radial-gradient(circle at 85% 30%,rgba(31,160,224,.4),transparent 50%)}
.page-header__inner{position:relative;padding:clamp(2.75rem,6vw,4.5rem) var(--gutter)}
.page-header h1{color:#fff;font-size:clamp(2.4rem,5vw,3.2rem);max-width:760px}
.page-header .intro{color:rgba(255,255,255,.85);font-size:var(--text-body-lg);max-width:620px;margin-top:var(--space-4)}

/* ---- CTA band ---- */
.cta-band{background:linear-gradient(120deg,#0c2340 0%,#0b539a 100%);color:#fff}
.cta-band__inner{padding:var(--section-y) var(--gutter);text-align:center}
.cta-band h2{color:#fff;font-size:var(--text-h1);max-width:760px;margin:0 auto}
.cta-band p{color:rgba(255,255,255,.85);font-size:var(--text-body-lg);max-width:560px;margin:var(--space-4) auto var(--space-8)}
.cta-band__btns{display:flex;gap:var(--space-3);justify-content:center;flex-wrap:wrap}

/* ---- Star rating ---- */
.stars{display:inline-flex;gap:2px}
.stars .ico{color:#f5a623}

/* ---- Photo / placeholder surfaces ---- */
.photo{position:relative;width:100%;min-height:160px;border-radius:var(--radius-lg);overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:rgba(255,255,255,.85)}
.photo--clean{background:linear-gradient(135deg,#2e88d1 0%,#0e63b2 60%,#0c2340 100%)}
.photo--grimy{background:linear-gradient(135deg,#6b7b8c 0%,#4e5c6b 60%,#38434f 100%)}
.photo--sky{background:linear-gradient(135deg,#7ccbf2 0%,#1fa0e0 100%)}
.photo--neutral{background:linear-gradient(135deg,#d8e0e8 0%,#bcc8d3 100%);color:var(--neutral-600)}
.photo__label{font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:.04em}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---- Before / After slider ---- */
.ba__frame{position:relative;height:320px;border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow-md);cursor:ew-resize;user-select:none;touch-action:none}
.ba__layer{position:absolute;inset:0}
.ba__after{overflow:hidden}
.ba__handle{position:absolute;top:0;bottom:0;width:3px;background:#fff;box-shadow:0 0 0 1px rgba(12,35,64,.2)}
.ba__knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;
  border-radius:50%;background:#fff;box-shadow:var(--shadow-md);display:grid;place-items:center}
.ba__badge{position:absolute;top:12px}
.ba__badge--before{left:12px} .ba__badge--after{right:12px}
.ba__cap{margin:10px 2px 0;font-size:14px;font-weight:600;color:var(--text-strong);font-family:var(--font-display)}

/* ---- Gallery filters ---- */
.filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:var(--space-10)}
.filter{font-family:var(--font-display);font-weight:700;font-size:15px;cursor:pointer;padding:8px 18px;
  border-radius:var(--radius-pill);border:2px solid var(--border-strong);background:var(--white);
  color:var(--text-strong);transition:all var(--dur-fast)}
.filter.is-active{border-color:var(--color-primary);background:var(--color-primary);color:#fff}

/* ---- Reviews ---- */
.reviews-placeholder{text-align:center;max-width:620px;margin:0 auto;padding:var(--space-8);
  border:2px dashed var(--border-strong);border-radius:var(--radius-lg);background:var(--white)}
.reviews-placeholder .ico{color:#f5a623;margin-bottom:var(--space-3)}

/* ---- Quote form ---- */
.quote-form{background:var(--white);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg);padding:var(--space-8);display:flex;flex-direction:column;gap:var(--space-5);
  max-width:480px;width:100%}
.quote-form h3{margin-bottom:6px}
.quote-form__sub{margin:0;font-size:15px;color:var(--text-muted)}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-family:var(--font-display);font-weight:600;font-size:15px;color:var(--text-strong)}
.field .req{color:var(--error-500)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.field__wrap{position:relative;display:flex;align-items:center}
.field__icon{position:absolute;left:12px;display:flex;pointer-events:none;color:var(--text-muted)}
.input,.select,.textarea{width:100%;font:inherit;font-size:16px;color:var(--text-strong);background:var(--white);
  border:2px solid var(--border-strong);border-radius:var(--radius-md);padding:12px 14px;outline:none;
  transition:border-color var(--dur-base),box-shadow var(--dur-base)}
.input.has-icon{padding-left:40px}
.input:focus,.select:focus,.textarea:focus{border-color:var(--border-focus);box-shadow:var(--focus-ring)}
.textarea{resize:vertical}
.select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:40px}
.select-wrap{position:relative}
.select-wrap .chev{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;
  pointer-events:none;color:var(--text-muted)}
.checkbox{display:inline-flex;align-items:flex-start;gap:10px;cursor:pointer;font-size:15px;color:var(--text-body)}
.checkbox input{appearance:none;-webkit-appearance:none;margin:0;margin-top:1px;width:20px;height:20px;flex:none;
  border:2px solid var(--border-strong);border-radius:var(--radius-xs);background:var(--white);cursor:pointer}
.checkbox input:checked{background:var(--color-primary);border-color:var(--color-primary);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center}
.form-note{margin:0;font-size:13px;color:var(--text-muted);text-align:center}
.alert{display:flex;gap:var(--space-3);border-radius:var(--radius-md);padding:var(--space-4)}
.alert--success{background:var(--success-50);border:1px solid #b7e0cd;color:#0f6e46}
.alert__title{font-family:var(--font-display);font-weight:700;font-size:15px;margin-bottom:2px}
.alert__body{font-size:14px;color:var(--text-body);line-height:1.5}
.is-hidden{display:none !important}

/* ---- Contact ---- */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--space-12);align-items:start}
.contact-details{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);margin-bottom:var(--space-8)}
.contact-item{display:flex;gap:14px;align-items:flex-start;text-decoration:none}
.contact-item__ic{width:46px;height:46px;flex:none;border-radius:var(--radius-md);background:var(--blue-50);display:grid;place-items:center}
.contact-item__label{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:700;font-family:var(--font-display)}
.contact-item__value{font-family:var(--font-display);font-weight:700;color:var(--text-strong);font-size:16px;word-break:break-word}
.contact-item__sub{font-size:13px;color:var(--text-muted)}
.urgent{margin-top:var(--space-6);padding:var(--space-5);border-radius:var(--radius-lg);background:var(--navy-900);
  color:#fff;display:flex;gap:14px;align-items:center}
.urgent a{color:var(--sky-400);font-weight:700}

/* ---- Services list cards ---- */
.svc-card{display:flex;gap:var(--space-5)}
.svc-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--space-3)}
.svc-point{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text-body);
  background:var(--surface-sunken);padding:4px 10px;border-radius:var(--radius-pill)}

/* ---- About ---- */
.stats-band{background:var(--navy-900);color:#fff}
.stats-band__inner{padding:var(--space-16) var(--gutter)}
.stat{text-align:center}
.stat__n{font-family:var(--font-display);font-weight:800;font-size:clamp(2.4rem,4vw,3.2rem);color:var(--sky-400);line-height:1}
.stat__l{margin-top:8px;color:rgba(255,255,255,.85);font-size:15px}

/* ---- Footer ---- */
.footer{background:var(--surface-dark);color:var(--text-on-dark)}
.footer__cta{border-bottom:1px solid rgba(255,255,255,.12)}
.footer__cta-inner{max-width:var(--container-xl);margin:0 auto;padding:var(--space-8) var(--gutter);
  display:flex;flex-wrap:wrap;gap:var(--space-6);align-items:center;justify-content:space-between}
.footer__cta h3{color:#fff}
.footer__cta p{margin:4px 0 0;color:var(--text-on-dark-muted)}
.footer__cta-btns{display:flex;gap:var(--space-3);flex-wrap:wrap}
.footer__cols{max-width:var(--container-xl);margin:0 auto;padding:var(--space-12) var(--gutter);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-8)}
.footer__cols img{height:88px;width:auto;margin-bottom:var(--space-4)}
.footer__about{color:var(--text-on-dark-muted);font-size:15px;max-width:260px}
.footer__coltitle{font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--sky-400);margin-bottom:var(--space-4)}
.footer__link{display:flex;align-items:center;gap:10px;color:var(--text-on-dark-muted);text-decoration:none;
  font-size:15px;padding:5px 0}
.footer__link:hover{color:#fff}
.footer__legal{border-top:1px solid rgba(255,255,255,.12)}
.footer__legal-inner{max-width:var(--container-xl);margin:0 auto;padding:var(--space-5) var(--gutter);
  display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:space-between;font-size:13px;color:var(--text-on-dark-muted)}

/* ---- Utilities ---- */
.mt-10{margin-top:var(--space-10)}
.center{text-align:center}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:960px){
  .hero__grid{grid-template-columns:1fr;gap:var(--space-8)}
  .grid-3{grid-template-columns:1fr 1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr;gap:var(--space-8)}
  .nav__links{display:none}
  .nav__actions .nav__phone,.nav__actions .btn{display:none}
  .nav__toggle{display:inline-flex}
}
@media (max-width:640px){
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .grid-4{grid-template-columns:1fr 1fr}
  .field-row{grid-template-columns:1fr}
  .contact-details{grid-template-columns:1fr}
  .svc-card{flex-direction:column;gap:var(--space-4)}
  .footer__cta-inner{flex-direction:column;align-items:flex-start}
}