/* ============================================================
   Apex Locksmiths — shared site styles (production)
   Used by: index.html, areas/*.html, legal/*.html
   ============================================================ */

/* ============ TOKENS ============ */
:root{
  --navy-900:#0A1424;
  --navy-800:#0F2238;
  --navy-700:#16344F;
  --navy-600:#21507C;
  --navy-100:#E5EDF6;

  /* brand blue (from the logo) — used as the primary accent */
  --amber-600:#00428C;   /* dark blue / hover */
  --amber-500:#0057B8;   /* logo blue */
  --amber-400:#3B86E0;   /* light blue (on dark) */
  --amber-100:#E2ECF8;   /* pale blue */

  /* conversion green — inviting, high-converting CTA color */
  --cta:#15A65A;
  --cta-600:#0E8C49;

  --green-600:#15924F;
  --green-500:#1FA85E;
  --green-100:#E0F1E7;

  --gold:#F5B82E;        /* stars */

  --ink:#101A26;
  --body:#3C4B5A;
  --muted:#6A788A;
  --line:#E3E8EF;
  --line-2:#EEF2F7;
  --page:#F5F7FA;
  --card:#FFFFFF;

  --shadow-sm:0 1px 2px rgba(16,42,67,.06), 0 1px 3px rgba(16,42,67,.08);
  --shadow-md:0 6px 18px rgba(16,42,67,.10);
  --shadow-lg:0 18px 48px rgba(16,42,67,.16);

  --r-sm:8px; --r-md:12px; --r-lg:18px;
  --maxw:1180px;

  --f-disp:"Sora", system-ui, sans-serif; /* @kind font */
  --f-body:"Plus Jakarta Sans", system-ui, sans-serif; /* @kind font */
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--page); color:var(--body);
  font-family:var(--f-body); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--f-disp); color:var(--ink); margin:0; line-height:1.08; letter-spacing:-.01em;}
p{margin:0;}
a{color:inherit; text-decoration:none;}
p a{color:var(--amber-600); font-weight:600;}
p a:hover{color:var(--amber-500);}
img{max-width:100%; display:block; height:auto;}
[hidden]{display:none !important;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px;}
.sec{padding:84px 0;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--f-disp); font-weight:700; font-size:13px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--amber-600);
}
.eyebrow.on-dark{color:var(--amber-400);}
.eb-flag-ct{width:26px; height:auto; flex:none; filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.25));}
.lead{font-size:19px; color:var(--body); max-width:60ch;}
.icn{width:1em; height:1em; stroke-width:2.25;}

/* ============ ACCESSIBILITY HELPERS ============ */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;}
.skip-link{position:fixed; left:-9999px; top:0; z-index:300; background:var(--navy-900); color:#fff; padding:13px 20px; border-radius:0 0 10px 0; font-family:var(--f-disp); font-weight:700; font-size:15px;}
.skip-link:focus{left:0;}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, .area:focus-visible{outline:2px solid var(--amber-500); outline-offset:3px; border-radius:6px;}
.wform input:focus-visible, .wform select:focus-visible, .wform textarea:focus-visible, .form input:focus-visible, .form select:focus-visible, .cp-field input:focus-visible{outline:none;}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--f-disp); font-weight:700; font-size:16px;
  padding:15px 24px; border-radius:var(--r-sm); border:2px solid transparent;
  cursor:pointer; white-space:nowrap;
  transition:background .18s ease, transform .14s ease, box-shadow .2s ease, color .18s ease, border-color .18s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0) scale(.985);}
.btn .icn{width:20px; height:20px;}
.btn-call{background:var(--cta); color:#fff; box-shadow:var(--shadow-md);}
.btn-call:hover{background:var(--cta-600); box-shadow:0 12px 26px rgba(21,166,90,.30);}
.btn-ghost{background:#fff; color:var(--navy-800); border-color:var(--line);}
.btn-ghost:hover{border-color:var(--navy-600); color:var(--navy-700); box-shadow:var(--shadow-md);}
.btn-ghost.on-dark{background:transparent; color:#fff; border-color:rgba(255,255,255,.35);}
.btn-ghost.on-dark:hover{border-color:#fff; background:rgba(255,255,255,.08);}
.btn-lg{padding:18px 30px; font-size:18px;}
.btn-block{width:100%;}
a, button{-webkit-tap-highlight-color:rgba(0,0,0,0);}
.linklike{background:none; border:none; color:inherit; font:inherit; cursor:pointer; padding:0;}

/* ============ HEADER ============ */
header.site{position:sticky; top:0; z-index:60; background:#fff; border-bottom:1px solid var(--line);}
header.site .wrap{display:flex; align-items:center; justify-content:center; height:74px; gap:20px; position:relative;}
.header-cta{position:absolute; right:22px; top:50%; transform:translateY(-50%); display:flex; align-items:center; gap:12px;}
.logo{display:flex; align-items:center; gap:11px;}
.logo-img{height:48px; width:auto; display:block;}
.menu-btn{display:none; background:none; border:none; color:var(--navy-800); cursor:pointer;}
.menu-btn .icn{width:28px; height:28px;}
@media(max-width:940px){
  .menu-btn{display:block;}
}

/* mobile drawer */
.drawer{position:fixed; inset:0; z-index:80; background:rgba(10,27,46,.5); opacity:0; pointer-events:none; transition:opacity .2s;}
.drawer.open{opacity:1; pointer-events:auto;}
.drawer .panel{position:absolute; top:0; right:0; width:min(320px,84vw); height:100%; overflow-y:auto; background:#fff; padding:22px; transform:translateX(100%); transition:transform .25s ease; display:flex; flex-direction:column; gap:6px;}
.drawer.open .panel{transform:none;}
.drawer .panel a{padding:14px 8px; font-family:var(--f-disp); font-weight:700; font-size:18px; color:var(--navy-800); border-bottom:1px solid var(--line-2);}
.drawer .panel .btn{margin-top:14px; color:#fff;}
.drawer .panel a.btn-ghost{color:var(--navy-800); border-bottom:none;}
.drawer .x{align-self:flex-end; background:none; border:none; cursor:pointer; color:var(--navy-800); margin-bottom:8px;}
.drawer .x .icn{width:28px;height:28px;}

/* ============ HERO ============ */
.hero{position:relative; min-height:680px; display:flex; align-items:center; background:var(--navy-900); color:#fff; overflow:hidden;}
.hero-bg{position:absolute; inset:0; z-index:0;}
.hero-bg img{width:100%; height:100%; object-fit:cover; object-position:center 38%;}
.hero-scrim{position:absolute; inset:0; z-index:1; background:
    radial-gradient(120% 75% at 50% 45%, rgba(7,17,29,.50) 0%, rgba(7,17,29,.74) 100%),
    linear-gradient(180deg, rgba(7,17,29,.55) 0%, rgba(7,17,29,.40) 45%, rgba(7,17,29,.82) 100%);}
.hero .wrap{position:relative; z-index:2; width:100%; padding-top:70px; padding-bottom:70px; display:flex; flex-direction:column; align-items:center; gap:34px;}
.hero-head{max-width:780px; text-align:center;}
.hero-head h1{font-size:46px;}
.hero-head .sub{margin-left:auto; margin-right:auto;}
.hero h1{color:#fff; font-weight:800; letter-spacing:-.025em; line-height:1.04;}
.hero h1 .hl{color:#fff;}
.hero .sub{color:#C4D2E2; font-size:19.5px; line-height:1.5; margin-top:20px; max-width:52ch;}
@media(max-width:940px){
  .hero{min-height:0;}
  .hero-bg img{object-position:center 42%;}
  .hero-scrim{background:linear-gradient(180deg, rgba(8,20,34,.62) 0%, rgba(8,20,34,.84) 100%);}
  .hero .wrap{gap:26px; padding-top:40px; padding-bottom:54px;}
  .hero-head h1{font-size:39px;}
  .hero .sub{font-size:18px; max-width:44ch;}
}
@media(max-width:560px){
  .hero .wrap{gap:18px; padding-top:28px; padding-bottom:42px;}
  .hero-head h1{font-size:30px;}
  .hero .sub{font-size:16.5px;}
}

/* ============ SUBURB PAGE HERO ============ */
.subhero{position:relative; display:flex; align-items:center; min-height:440px; background:var(--navy-900); color:#fff; overflow:hidden;}
.subhero .wrap{position:relative; z-index:2; width:100%; padding-top:56px; padding-bottom:64px;}
.subhero h1{color:#fff; font-size:44px; letter-spacing:-.022em; line-height:1.06; max-width:22ch;}
.subhero .sub{color:#C4D2E2; font-size:18.5px; line-height:1.55; margin-top:16px; max-width:58ch;}
.subhero .hero-cta{display:flex; gap:13px; margin-top:28px; flex-wrap:wrap;}
.subhero .meta-chips{display:flex; gap:10px; flex-wrap:wrap; margin-top:24px;}
.chipline{display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); padding:8px 14px; border-radius:999px; font-size:13.5px; font-weight:600; color:#E4ECF4;}
.chipline .icn{width:15px; height:15px; color:var(--amber-400); flex:none;}
.crumbs{display:flex; align-items:center; gap:9px; flex-wrap:wrap; font-family:var(--f-disp); font-weight:600; font-size:13.5px; color:#9FB3C8; margin-bottom:20px;}
.crumbs a{color:#DCE6F1;}
.crumbs a:hover{color:#fff;}
.crumbs .sep{opacity:.45;}
.crumbs [aria-current="page"]{color:#fff;}
@media(max-width:640px){
  .subhero{min-height:0;}
  .subhero .wrap{padding-top:40px; padding-bottom:48px;}
  .subhero h1{font-size:30px;}
  .subhero .sub{font-size:16.5px;}
  .subhero .hero-cta .btn{flex:1 1 100%;}
}

/* ============ EMERGENCY IMAGE BAND ============ */
.imgband{position:relative; min-height:380px; display:flex; align-items:center; overflow:hidden; background:var(--navy-900);}
.imgband-bg{position:absolute; inset:0; z-index:0;}
.imgband-bg img{width:100%; height:100%; object-fit:cover; object-position:center 32%;}
.imgband-scrim{position:absolute; inset:0; z-index:1; background:linear-gradient(90deg, rgba(8,16,28,.92) 0%, rgba(8,16,28,.78) 36%, rgba(8,16,28,.30) 70%, rgba(8,16,28,.10) 100%);}
.imgband .wrap{position:relative; z-index:2; width:100%; padding:54px 22px;}
.ib-copy{max-width:560px; color:#fff;}
.ib-copy .eyebrow.on-dark{color:#fff; align-items:center;}
.ib-dot{width:9px; height:9px; border-radius:50%; background:#34D27B; box-shadow:0 0 0 4px rgba(52,210,123,.22); display:inline-block;}
.ib-copy h2{color:#fff; font-size:34px; margin-top:14px; line-height:1.12; letter-spacing:-.01em;}
.ib-copy p{color:#C4D2E2; font-size:17px; margin-top:14px; line-height:1.55;}
.ib-cta{display:flex; align-items:center; gap:18px; margin-top:24px; flex-wrap:wrap;}
.ib-num{font-family:var(--f-disp); font-weight:800; font-size:26px; color:#fff; letter-spacing:-.01em; white-space:nowrap;}
@media(max-width:680px){
  .imgband{min-height:320px;}
  .imgband-scrim{background:linear-gradient(180deg, rgba(8,16,28,.55) 0%, rgba(8,16,28,.88) 100%);}
  .ib-copy h2{font-size:26px;}
  .imgband-bg img{object-position:center 28%;}
}

/* ============ SECTION HEAD ============ */
.sec-head{text-align:center; max-width:680px; margin:0 auto 52px;}
.sec-head h2{font-size:40px; font-weight:800; margin-top:14px;}
.sec-head p{margin-top:16px; font-size:18px; color:var(--muted);}
@media(max-width:560px){ .sec-head h2{font-size:30px;} }

/* ============ SERVICES ============ */
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.svc{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-sm); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  overflow:hidden; display:flex; flex-direction:column;
}
.svc:hover{transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--navy-100);}
.svc-photo{position:relative; aspect-ratio:16/10; background:var(--navy-100); overflow:hidden;}
.svc-photo img{width:100%; height:100%; object-fit:cover; transition:transform .4s ease;}
.svc:hover .svc-photo img{transform:scale(1.05);}
.svc .ic{position:absolute; left:22px; bottom:-24px; width:54px; height:54px; border-radius:13px; background:var(--navy-800); color:#fff; display:grid; place-items:center; box-shadow:var(--shadow-md); border:3px solid #fff;}
.svc .ic .icn{width:26px; height:26px;}
.svc.urgent .ic{background:var(--amber-500);}
.svc.urgent .svc-tag{position:absolute; top:14px; left:14px; background:var(--amber-500); color:#fff; font-family:var(--f-disp); font-weight:700; font-size:12px; letter-spacing:.06em; text-transform:uppercase; padding:6px 11px; border-radius:6px; display:flex; align-items:center; gap:5px;}
.svc.urgent .svc-tag .icn{width:13px; height:13px;}
.svc-body{padding:38px 26px 28px; display:flex; flex-direction:column; flex:1;}
.svc h3{font-size:21px; font-weight:700;}
.svc p{margin-top:10px; font-size:15.5px; color:var(--body); flex:1;}
.svc .svc-price{display:flex; align-items:baseline; gap:8px; margin-top:18px; padding-top:16px; border-top:1px solid var(--line-2);}
.svc .svc-price .from{font-family:var(--f-disp); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}
.svc .svc-price .amt{font-family:var(--f-disp); font-weight:900; font-size:27px; color:var(--ink); line-height:1; letter-spacing:-.01em;}
.svc .svc-price .unit{font-size:13.5px; color:var(--muted); font-weight:600;}
.svc .more{display:inline-flex; align-items:center; gap:6px; margin-top:14px; font-family:var(--f-disp); font-weight:700; font-size:14.5px; color:var(--amber-600);}
.svc .more .icn{width:16px;height:16px; transition:transform .15s;}
.svc:hover .more .icn{transform:translateX(3px);}
@media(max-width:880px){ .grid-3{grid-template-columns:1fr 1fr;} }
@media(max-width:560px){ .grid-3{grid-template-columns:1fr;} }
.svc-pricenote{display:flex; align-items:center; justify-content:center; gap:8px; margin-top:30px; font-size:14px; color:var(--muted); text-align:center;}
.svc-pricenote .icn{width:16px; height:16px; color:var(--amber-600); flex:none;}

/* ============ AUTOMOTIVE FEATURE ============ */
.pillars{background:var(--page);}
.auto-feature{display:grid; grid-template-columns:1.02fr .98fr; gap:54px; align-items:center;}
.auto-media{position:relative;}
.auto-media img{width:100%; height:440px; object-fit:cover; object-position:center; border-radius:var(--r-lg); box-shadow:var(--shadow-lg); border:6px solid #fff;}
.auto-badge{position:absolute; left:-16px; top:26px; background:var(--amber-500); color:#fff; font-family:var(--f-disp); font-weight:800; font-size:13px; letter-spacing:.04em; text-transform:uppercase; padding:11px 17px; border-radius:999px; display:flex; align-items:center; gap:8px; box-shadow:var(--shadow-lg);}
.auto-badge .icn{width:17px; height:17px;}
.auto-rating{position:absolute; left:24px; bottom:-24px; background:#fff; color:var(--ink); border-radius:var(--r-md); padding:13px 18px; box-shadow:var(--shadow-lg); display:flex; align-items:center; gap:12px;}
.auto-rating .rstars{display:flex; gap:2px;}
.auto-rating .rstars .icn{width:16px; height:16px; fill:var(--gold); stroke:var(--gold);}
.auto-rating .rn{font-family:var(--f-disp); font-weight:900; font-size:20px; color:var(--ink); line-height:1;}
.auto-rating .rl{font-size:12.5px; color:var(--muted); margin-top:2px;}
.auto-copy h3{font-size:31px; font-weight:800; letter-spacing:-.01em;}
.auto-copy .lead{margin-top:14px;}
.auto-checks{list-style:none; margin:24px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:13px 24px;}
.auto-checks li{display:flex; align-items:center; gap:10px; font-size:15.5px; color:var(--ink); font-weight:500;}
.auto-checks li .icn{width:20px; height:20px; color:var(--green-600); flex:none;}
.auto-cta{display:flex; gap:13px; margin-top:30px; flex-wrap:wrap;}
.auto-note{margin-top:22px; font-size:15px; color:var(--muted);}
.auto-note a{color:var(--amber-600); font-family:var(--f-disp); font-weight:700;}
.auto-note a .icn{width:15px; height:15px; vertical-align:-2px;}
@media(max-width:880px){ .auto-feature{grid-template-columns:1fr; gap:46px;} .auto-media img{height:320px;} }
@media(max-width:440px){ .auto-checks{grid-template-columns:1fr;} }

/* ============ COMPETITIVE PRICING ============ */
.cpricing{position:relative; overflow:hidden; background:var(--page); color:var(--ink);}
.cp-promise{position:relative; display:flex; align-items:center; gap:42px; background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:34px 40px; overflow:hidden; box-shadow:var(--shadow-md);}
.cp-promise-main{flex:1; min-width:0;}
.cp-promise-side{flex:none; display:flex; flex-direction:column; gap:22px; align-items:flex-start;}
.cp-form{width:330px; max-width:100%; display:flex; flex-direction:column; gap:12px;}
.cp-field{display:flex; flex-direction:column; gap:6px;}
.cp-field span{font-family:var(--f-disp); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}
.cp-field input{width:100%; font-family:var(--f-body); font-size:15px; color:var(--ink); background:var(--page); border:1px solid var(--line); border-radius:3px; padding:12px 14px; transition:border-color .15s ease, box-shadow .15s ease;}
.cp-field input::placeholder{color:#9AA7B5;}
.cp-field input:focus{outline:none; border-color:var(--amber-500); box-shadow:0 0 0 3px rgba(0,87,184,.10);}
.cp-form-btn{width:100%; justify-content:center; border-radius:3px; margin-top:4px;}
.cp-form-note{display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--muted); margin:0;}
.cp-form-note .icn{width:14px; height:14px; color:#15A65A;}
.cp-tag{display:inline-flex; align-items:center; gap:8px; align-self:flex-start; background:var(--gold); color:#3A2A00; border-radius:999px; padding:8px 15px; font-family:var(--f-disp); font-weight:800; font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; box-shadow:0 10px 24px rgba(245,184,46,.28); animation:cpbob 3.8s ease-in-out infinite;}
.cp-tag .icn{width:15px; height:15px;}
@keyframes cpbob{0%,100%{transform:translateY(0) rotate(-1.5deg);}50%{transform:translateY(-6px) rotate(1.5deg);}}
.cp-promise h3{font-size:30px; font-weight:800; color:var(--ink); margin-top:18px; line-height:1.14; letter-spacing:-.02em; text-wrap:balance;}
.cp-promise h3 .grad{background:linear-gradient(90deg,#0057B8,#15A65A,#0057B8); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation:cpgrad 4.5s linear infinite;}
@keyframes cpgrad{to{background-position:200% 0;}}
.cp-promise>.cp-promise-main>p{color:var(--body); font-size:16px; margin-top:14px; line-height:1.6; max-width:54ch;}
/* framer-style entrance (JS staggers the .in class) */
.cpricing .cp-anim{opacity:0; transform:translateY(30px) scale(.97);}
.cpricing .cp-anim.in{opacity:1; transform:none;}
@media(prefers-reduced-motion:no-preference){
  .cpricing .cp-anim{transition:opacity .7s ease, transform .8s cubic-bezier(.22,1,.36,1);}
}
@media(prefers-reduced-motion:reduce){
  .cp-tag{animation:none !important;}
  .cp-promise h3 .grad{animation:none; -webkit-text-fill-color:#0057B8;}
  .cpricing .cp-anim{opacity:1; transform:none;}
}
@media(max-width:880px){ .cp-promise{flex-direction:column; align-items:flex-start; gap:26px; padding:32px 30px;} .cp-promise-side{width:100%;} .cp-promise h3{font-size:27px;} }
@media(max-width:480px){ .cp-promise{padding:28px 22px;} .cp-promise h3{font-size:24px;} }

/* ============ DIFFERENTIATOR ============ */
.diff{background:#fff;}
.diff-card{max-width:940px; margin:0 auto; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-md);}
.diff-head{display:grid; grid-template-columns:1.5fr 1fr 1fr;}
.diff-head>div{padding:20px 24px; font-family:var(--f-disp);}
.diff-head .dh-spacer{background:var(--page);}
.diff-head .dh-us{background:var(--navy-800); color:#fff; display:flex; align-items:center; justify-content:center; gap:10px; font-weight:800; font-size:16.5px;}
.diff-head .dh-us .dh-logo{height:34px; width:auto; display:block;}
.diff-head .dh-them{background:var(--page); color:var(--muted); font-weight:700; font-size:15.5px; display:flex; align-items:center;}
.diff-row{display:grid; grid-template-columns:1.5fr 1fr 1fr; border-top:1px solid var(--line);}
.diff-row>div{padding:17px 24px; display:flex; align-items:center;}
.diff-row .dr-label{font-weight:600; color:var(--ink); font-size:15.5px;}
.diff-row .dr-us{background:rgba(31,157,99,.06); color:var(--ink); font-weight:600; gap:10px; font-size:15px;}
.diff-row .dr-us .icn{width:20px; height:20px; color:var(--green-600); flex:none;}
.diff-row .dr-them{color:var(--muted); gap:10px; font-size:15px;}
.diff-row .dr-them .icn{width:20px; height:20px; color:#C3CCD8; flex:none;}
@media(max-width:680px){
  .diff-card{max-width:100%; border:none; border-radius:0; box-shadow:none; background:transparent; overflow:visible;}
  .diff-head{display:none;}
  .diff-row{display:block; border:1px solid var(--line); border-top:1px solid var(--line); border-radius:var(--r-md); background:#fff; box-shadow:var(--shadow-sm); margin-bottom:13px; overflow:hidden;}
  .diff-row:last-child{margin-bottom:0;}
  .diff-row>div{padding:0;}
  .diff-row .dr-label{display:block; padding:12px 16px; background:var(--page); border-bottom:1px solid var(--line); font-family:var(--f-disp); font-weight:700; font-size:14px; color:var(--ink);}
  .diff-row .dr-us, .diff-row .dr-them{display:flex; align-items:center; gap:9px; padding:12px 16px; font-size:14.5px; line-height:1.35;}
  .diff-row .dr-them{border-top:1px solid var(--line-2);}
  .diff-row .dr-us::before, .diff-row .dr-them::before{flex:none; font-family:var(--f-disp); font-weight:700; font-size:10px; letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:6px; width:62px; text-align:center;}
  .diff-row .dr-us::before{content:"Apex"; background:var(--green-100); color:var(--green-600);}
  .diff-row .dr-them::before{content:"Typical"; background:var(--line); color:var(--muted);}
  .diff-row .dr-us .icn, .diff-row .dr-them .icn{display:none;}
}

/* ============ HERO SPLIT CARD (booking + emergency) ============ */
.split-card{display:grid; grid-template-columns:1fr 1fr; width:100%; max-width:1000px; margin:0 auto; background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:0 30px 70px rgba(0,0,0,.34); position:relative;}
.split-form{padding:38px 38px;}
.split-form h3{font-size:23px; margin-top:12px; letter-spacing:-.01em;}
.split-form>p{font-size:15px; color:var(--muted); margin-top:10px; line-height:1.55;}
.split-form>p b{color:var(--ink); font-weight:700;}
.wform{display:flex; flex-direction:column; gap:12px; margin-top:22px;}
.wf-row{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.wform input, .wform select, .wform textarea{width:100%; font-family:var(--f-body); font-size:15px; color:var(--ink); background:var(--page); border:1px solid var(--line); border-radius:var(--r-sm); padding:13px 14px; outline:none; transition:border-color .15s, box-shadow .15s;}
.wform textarea{resize:vertical; min-height:46px;}
.wform input:focus, .wform select:focus, .wform textarea:focus{border-color:var(--amber-500); box-shadow:0 0 0 3px rgba(0,87,184,.12);}
.wf-submit{width:100%; justify-content:center; margin-top:2px;}
.wf-fine{display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--muted); margin-top:2px;}
.wf-fine .icn{width:14px; height:14px; color:var(--green-600); flex:none;}
.wf-done{display:flex; align-items:center; gap:8px; font-size:14.5px; font-weight:600; color:var(--green-600); margin-top:4px;}
.wf-done .icn{width:18px; height:18px; flex:none;}
.split-form .wf-done{align-items:center; gap:13px; padding:16px 18px; border-radius:var(--r-md); background:var(--green-100); border:1px solid rgba(21,146,79,.22); margin-top:6px;}
.split-form .wf-done .wf-done-ic{width:42px; height:42px; border-radius:50%; background:var(--cta); color:#fff; display:grid; place-items:center; flex:none;}
.split-form .wf-done .wf-done-ic .icn{width:23px; height:23px;}
.split-form .wf-done .wf-done-tx{display:flex; flex-direction:column; gap:2px; line-height:1.35;}
.split-form .wf-done .wf-done-tx b{font-family:var(--f-disp); color:var(--green-600); font-size:16px;}
.split-form .wf-done .wf-done-tx span{color:var(--body); font-weight:500; font-size:14px;}
.split-or{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:3; width:42px; height:42px; border-radius:50%; background:var(--card); border:1px solid var(--line); display:grid; place-items:center; font-family:var(--f-disp); font-weight:800; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); box-shadow:var(--shadow-sm);}
.split-emergency{padding:38px 38px; background:linear-gradient(160deg, var(--navy-800), var(--navy-900)); color:#fff; display:flex; flex-direction:column;}
.split-emergency .eyebrow.on-dark{color:#fff; align-items:center;}
.split-emergency .em-dot{width:9px; height:9px; border-radius:50%; background:#34D27B; box-shadow:0 0 0 4px rgba(52,210,123,.22); display:inline-block;}
.split-emergency h3{color:#fff; font-size:23px; margin-top:12px; letter-spacing:-.01em;}
.split-emergency>p{font-size:15px; color:#C4D2E2; margin-top:10px; line-height:1.55;}
.em-list{list-style:none; padding:0; margin:20px 0 0; display:flex; flex-direction:column; gap:12px;}
.em-list li{display:flex; align-items:center; gap:11px; font-size:15px; color:#E4ECF4; font-weight:500;}
.em-list li .icn{width:19px; height:19px; color:var(--amber-400); flex:none;}
.em-callbtn{margin-top:24px; width:100%; justify-content:center;}
.em-avail{display:flex; align-items:center; gap:8px; justify-content:center; margin-top:14px; font-size:13px; color:#AFC0D4;}
@media(max-width:680px){
  .split-card{grid-template-columns:1fr;}
  .split-form, .split-emergency{padding:30px 24px;}
  .split-or{display:none;}
}

/* ============ GOOGLE REVIEWS ============ */
.reviews{background:var(--page);}
.rv-belt{display:flex; flex-direction:column; align-items:center; gap:13px; margin-top:24px;}
.rv-belt-avatars{display:flex;}
.rv-belt-avatars .av{width:46px; height:46px; border-radius:50%; border:3px solid #fff; overflow:hidden; margin-left:-14px; box-shadow:var(--shadow-sm); background:var(--navy-100);}
.rv-belt-avatars .av:first-child{margin-left:0;}
.rv-belt-avatars .av img{width:100%; height:100%; object-fit:cover; display:block;}
.rv-belt-text{font-family:var(--f-disp); font-weight:700; font-size:21px; color:var(--ink);}
.rv-belt-text b{color:var(--amber-600); font-weight:900;}
@media(max-width:560px){ .rv-belt-avatars .av{width:40px; height:40px; margin-left:-12px;} }
.gword{font-family:var(--f-disp); font-weight:700; letter-spacing:-.01em;}
.gword .b{color:#4285F4;} .gword .r{color:#EA4335;} .gword .y{color:#FBBC05;} .gword .g{color:#34A853;}
.rv-summary{display:flex; align-items:center; justify-content:center; gap:18px; flex-wrap:wrap; margin:-14px auto 46px; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-sm); padding:20px 30px; width:max-content; max-width:100%;}
.rv-summary .gword{font-size:23px;}
.rv-summary .div{width:1px; height:42px; background:var(--line);}
.rv-score{display:flex; align-items:center; gap:14px;}
.rv-score .n{font-family:var(--f-disp); font-weight:900; font-size:38px; color:var(--ink); line-height:1;}
.rv-stars{display:flex; gap:2px;}
.rv-stars .icn{width:20px; height:20px; fill:var(--gold); stroke:var(--gold);}
.rv-score .meta{font-size:13.5px; color:var(--muted); margin-top:3px;}
.review{background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:24px; box-shadow:var(--shadow-sm); position:relative; display:flex; flex-direction:column; transition:transform .22s ease, box-shadow .22s ease;}
.review .gbadge{position:absolute; top:22px; right:22px; width:24px; height:24px; border-radius:50%; background:#fff; border:1px solid var(--line); display:grid; place-items:center; font-family:var(--f-disp); font-weight:700; font-size:14px; color:#4285F4;}
.review-top{display:flex; align-items:center; gap:12px; margin-bottom:14px;}
.review .av{width:46px; height:46px; border-radius:50%; display:grid; place-items:center; font-family:var(--f-disp); font-weight:800; font-size:18px; color:#fff; flex:none; overflow:hidden;}
.review .av img{width:100%; height:100%; object-fit:cover; display:block;}
.review .who .nm{font-family:var(--f-disp); font-weight:700; font-size:16px; color:var(--ink);}
.review .who .sub{font-size:12.5px; color:var(--muted); display:flex; align-items:center; gap:5px; margin-top:2px;}
.review .who .sub .icn{width:13px; height:13px;}
.review .rstars{display:flex; gap:2px; margin-bottom:11px;}
.review .rstars .icn{width:16px; height:16px; fill:var(--gold); stroke:var(--gold);}
.review p{font-size:15px; color:var(--body); line-height:1.6; flex:1;}
.review .date{margin-top:16px; font-size:12.5px; color:var(--muted); display:flex; align-items:center; gap:6px;}
.review .date .icn{width:13px; height:13px;}

/* reviews carousel */
.rv-carousel{position:relative;}
.rv-viewport{overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -ms-overflow-style:none; padding:6px 2px;}
.rv-viewport::-webkit-scrollbar{display:none;}
.rv-track{display:flex; gap:22px; width:max-content;}
.rv-track .review{scroll-snap-align:start; flex:0 0 360px; margin:0;}
.rv-controls{display:flex; align-items:center; justify-content:center; gap:20px; margin-top:36px;}
.rv-arrow{width:50px; height:50px; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--navy-800); display:grid; place-items:center; cursor:pointer; box-shadow:var(--shadow-sm); transition:background .15s, color .15s, border-color .15s, opacity .15s;}
.rv-arrow .icn{width:22px; height:22px;}
.rv-arrow:hover{background:var(--navy-800); color:#fff; border-color:var(--navy-800);}
.rv-arrow:disabled{opacity:.3; cursor:default; background:#fff; color:var(--navy-800); border-color:var(--line);}
.rv-dots{display:flex; align-items:center; gap:9px;}
.rv-dot{width:9px; height:9px; border-radius:50%; background:var(--line); border:none; cursor:pointer; padding:0; transition:width .2s, background .2s, border-radius .2s;}
.rv-dot.active{background:var(--amber-500); width:28px; border-radius:5px;}
@media(max-width:560px){ .rv-track .review{flex:0 0 84vw;} }

/* static 3-up reviews (suburb pages) */
.rv-static{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
@media(max-width:880px){ .rv-static{grid-template-columns:1fr;} }

/* ============ CAR BRAND BELT ============ */
.brandbelt{position:relative; background:transparent; border-top:1px solid var(--line); padding:40px 0 4px; margin-top:54px; overflow:hidden;}
.brandbelt .bb-head{text-align:center; font-family:var(--f-disp); font-weight:800; font-size:18px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); margin-bottom:28px;}
.bb-head .ic{width:19px; height:19px; vertical-align:-3px; color:var(--amber-500); margin-right:7px;}
.bb-mask{position:relative; overflow:hidden;}
.bb-track{display:flex; width:max-content; animation:bbscroll 42s linear infinite;}
.brandbelt:hover .bb-track{animation-play-state:paused;}
@keyframes bbscroll{from{transform:translateX(0);} to{transform:translateX(-50%);}}
.bb-item{flex:none; padding:0 40px; font-family:var(--f-disp); font-weight:800; font-size:27px; color:var(--navy-700); letter-spacing:.01em; opacity:.5; transition:opacity .2s, color .2s; white-space:nowrap;}
.bb-item:hover{opacity:1; color:var(--amber-600);}
.brandbelt::before, .brandbelt::after{content:""; position:absolute; top:0; bottom:0; width:130px; z-index:2; pointer-events:none;}
.brandbelt::before{left:0; background:linear-gradient(90deg,var(--page),rgba(245,247,250,0));}
.brandbelt::after{right:0; background:linear-gradient(270deg,var(--page),rgba(245,247,250,0));}
@media(prefers-reduced-motion:reduce){ .bb-track{animation:none;} }

/* ============ OFFER / CONVERSION ============ */
.offer{background:var(--page); padding:40px 0;}
.offer-card{display:grid; grid-template-columns:.82fr 1.18fr; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-lg); border:1px solid var(--line); background:#fff;}
.offer-coupon{position:relative; background:linear-gradient(105deg, rgba(10,27,46,.93) 0%, rgba(13,34,56,.72) 52%, rgba(16,42,67,.42) 100%), url('photos/offer-bg.jpg'); background-size:cover, cover; background-position:center, center 28%; color:#fff; padding:30px 34px; display:flex; flex-direction:column; justify-content:center; border-right:2px dashed rgba(255,255,255,.6);}
.offer-coupon::after{content:""; position:absolute; inset:0; background:radial-gradient(120% 80% at 0% 0%, rgba(255,255,255,.18), transparent 60%); pointer-events:none;}
.offer-coupon .notch{position:absolute; right:-15px; width:30px; height:30px; border-radius:50%; background:var(--page); z-index:3;}
.offer-coupon .notch.t{top:-15px;}
.offer-coupon .notch.b{bottom:-15px;}
.oc-tag{position:relative; z-index:2; align-self:flex-start; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35); font-family:var(--f-disp); font-weight:800; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; padding:7px 13px; border-radius:999px; color:#fff;}
.oc-amt{position:relative; z-index:2; font-family:var(--f-disp); font-weight:900; font-size:52px; line-height:.9; color:#fff; margin-top:12px; display:flex; align-items:baseline; gap:9px; letter-spacing:-.02em;}
.oc-amt span{font-size:22px; font-weight:800;}
.oc-for{position:relative; z-index:2; font-family:var(--f-disp); font-weight:700; font-size:16px; margin-top:3px; color:#fff;}
.oc-code{position:relative; z-index:2; margin-top:13px; font-size:14px; color:#E6EEF8;}
.oc-code b{font-family:var(--f-disp); font-weight:800; color:#fff; background:rgba(255,255,255,.16); padding:2px 9px; border-radius:6px; letter-spacing:.04em;}
.oc-fine{position:relative; z-index:2; margin-top:16px; font-size:12px; color:#D7E3F0; line-height:1.5;}
.offer-body{padding:30px 34px;}
.offer-body .eyebrow .icn{width:15px; height:15px;}
.offer-body h2{font-size:24px; margin-top:11px; letter-spacing:-.01em;}
.offer-body .lead{font-size:15px; color:var(--muted); margin-top:9px;}
.offer-guars{display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; margin:18px 0 20px;}
.offer-guars .og{display:flex; align-items:center; gap:10px; font-family:var(--f-disp); font-weight:700; font-size:14px; color:var(--navy-800);}
.offer-guars .og .icn{width:20px; height:20px; color:var(--green-600); flex:none;}
.offer-cta{display:flex; gap:13px; flex-wrap:wrap;}
.offer-cta .om-note{flex-basis:100%; margin-top:6px; font-size:13.5px; color:var(--muted); display:flex; align-items:center; gap:7px;}
.offer-cta .om-note .icn{width:15px; height:15px; color:var(--amber-600);}
@media(max-width:880px){
  .offer-card{grid-template-columns:1fr;}
  .offer-coupon{border-right:none; border-bottom:2px dashed rgba(255,255,255,.6); padding:38px 32px; text-align:center; align-items:center;}
  .oc-tag{align-self:center;}
  .oc-amt{justify-content:center;}
  .offer-coupon .notch.t{top:auto; bottom:-15px; right:auto; left:-15px;}
  .offer-coupon .notch.b{bottom:-15px; right:-15px;}
  .offer-body{padding:36px 30px;}
}
@media(max-width:560px){ .offer-guars{grid-template-columns:1fr;} .oc-amt{font-size:64px;} .offer-cta .btn{flex:1 1 100%;} }

/* ============ AREAS ============ */
.areas{background:linear-gradient(165deg,#E9F2FC 0%,#F3F8FE 55%,#FFFFFF 100%); color:var(--ink); position:relative; overflow:hidden;}
.areas::before{content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(0,87,184,.55) 1px, transparent 1.6px); background-size:40px 40px; opacity:.07; pointer-events:none;}
.areas .wrap{position:relative; z-index:1;}
.usa-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--line); border-radius:999px; padding:9px 17px; font-family:var(--f-disp); font-weight:800; font-size:12.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--amber-600); box-shadow:var(--shadow-sm); margin-bottom:18px;}
.usa-flag{width:28px; height:18px; border-radius:2px; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.3); flex:none;
  background:linear-gradient(180deg,#fff 0 14.3%,#B22234 14.3% 28.6%,#fff 28.6% 42.9%,#B22234 42.9% 57.2%,#fff 57.2% 71.5%,#B22234 71.5% 85.8%,#fff 85.8% 100%);}
.usa-flag::before{content:""; position:absolute; left:0; top:0; width:12px; height:10px; background:#2A3D8F;}
.areas .sec-head h2{color:var(--ink);}
.areas .sec-head p{color:var(--body);}
.areas-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:34px; align-items:stretch;}
.areas-list{display:flex; flex-direction:column;}
.area-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0;}
.area{
  display:flex; align-items:center; gap:10px; background:#fff;
  border:1px solid var(--line); border-radius:var(--r-sm); padding:15px 16px;
  font-weight:600; font-size:15.5px; color:var(--ink); box-shadow:var(--shadow-sm); transition:background .15s, border-color .15s, box-shadow .15s, transform .15s;
}
.area:hover{border-color:var(--amber-400); box-shadow:var(--shadow-md); transform:translateY(-1px); color:var(--amber-600);}
.area .icn{width:17px; height:17px; color:var(--amber-500); flex:none; transition:transform .2s ease;}
.area:hover .icn{transform:scale(1.18);}
.area .go{margin-left:auto; width:15px; height:15px; color:var(--muted); transition:transform .15s, color .15s;}
.area:hover .go{transform:translateX(2px); color:var(--amber-600);}
.areas .note{margin-top:22px; color:var(--muted); font-size:15px;}
.areas .note a{color:var(--amber-600); font-weight:700;}
.areas-map{position:relative; min-height:420px; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-lg);}
#areaMap{position:absolute; inset:0; width:100%; height:100%; background:#dfe6ee; z-index:0;}
.leaflet-container{font-family:var(--f-body);}
.leaflet-tooltip{font-family:var(--f-disp); font-weight:700; font-size:12px;}
@media(max-width:860px){ .areas-grid{grid-template-columns:1fr; gap:24px;} .areas-map{min-height:340px; order:-1;} }
@media(max-width:760px){ .area-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:400px){ .area-grid{grid-template-columns:1fr;} }

/* ============ LOCAL AREA PAGE ============ */
.local-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:38px; align-items:stretch;}
.local-copy h2{font-size:32px; margin-top:12px;}
.local-copy p{margin-top:14px; font-size:16.5px; line-height:1.65;}
.local-facts{list-style:none; margin:22px 0 0; padding:0; display:flex; flex-direction:column; gap:12px;}
.local-facts li{display:flex; gap:10px; align-items:flex-start; font-size:15.5px; color:var(--ink); font-weight:500;}
.local-facts .icn{width:19px; height:19px; color:var(--green-600); flex:none; margin-top:3px;}
.local-map{position:relative; min-height:380px; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-lg);}
.local-map #areaMap{position:absolute; inset:0;}
@media(max-width:860px){ .local-grid{grid-template-columns:1fr;} .local-map{min-height:320px;} }

.nearby{margin-top:44px; padding-top:30px; border-top:1px solid var(--line);}
.nearby h3{font-size:18px;}
.nearby-links{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px;}
.nearby-links a{display:inline-flex; align-items:center; gap:7px; background:#fff; border:1px solid var(--line); border-radius:999px; padding:9px 16px; font-weight:600; font-size:14px; color:var(--navy-800); transition:border-color .15s, color .15s, transform .15s;}
.nearby-links a:hover{border-color:var(--amber-400); color:var(--amber-600); transform:translateY(-1px);}
.nearby-links .icn{width:15px; height:15px; color:var(--amber-500);}

/* ============ PROCESS TIMELINE ============ */
.timeline{max-width:660px; margin:6px auto 0; position:relative;}
.tl-rail{position:absolute; left:34px; top:30px; bottom:46px; width:4px; background:var(--line-2); border-radius:4px; overflow:hidden;}
.tl-fill{position:absolute; left:0; top:0; width:100%; height:0; background:linear-gradient(180deg,var(--amber-400),var(--amber-600)); border-radius:4px; transition:height 1.9s cubic-bezier(.4,0,.2,1);}
.timeline.is-on .tl-fill{height:100%;}
.tl-step{position:relative; display:grid; grid-template-columns:72px 1fr; gap:20px; align-items:flex-start; padding:14px 0 30px;
  opacity:0; transform:translateY(22px); transition:opacity .55s ease, transform .55s ease;}
.tl-step:last-child{padding-bottom:6px;}
.timeline.is-on .tl-step{opacity:1; transform:none;}
.timeline.is-on .tl-step:nth-child(2){transition-delay:.15s;}
.timeline.is-on .tl-step:nth-child(3){transition-delay:.5s;}
.timeline.is-on .tl-step:nth-child(4){transition-delay:.85s;}
.timeline.is-on .tl-step:nth-child(5){transition-delay:1.2s;}
.tl-node{position:relative; z-index:1; width:68px; height:68px; border-radius:50%; background:#fff; border:3px solid var(--line);
  display:grid; place-items:center; box-shadow:var(--shadow-sm); transition:border-color .4s ease, background .4s ease, box-shadow .4s ease;}
.tl-node .icn{width:29px; height:29px; color:var(--navy-700); transition:color .4s ease;}
.tl-node .badge{position:absolute; top:-7px; right:-7px; width:27px; height:27px; border-radius:50%; background:var(--navy-600); color:#fff;
  font-family:var(--f-disp); font-weight:800; font-size:13.5px; display:grid; place-items:center; border:3px solid var(--page); transition:background .4s ease;}
.timeline.is-on .tl-step:nth-child(1) .tl-node{transition-delay:.1s;}
.timeline.is-on .tl-step:nth-child(2) .tl-node{transition-delay:.45s;}
.timeline.is-on .tl-step:nth-child(3) .tl-node{transition-delay:.8s;}
.timeline.is-on .tl-step:nth-child(4) .tl-node{transition-delay:1.15s;}
.timeline.is-on .tl-node{border-color:var(--amber-400); background:var(--amber-100); box-shadow:0 8px 22px rgba(59,134,224,.22);}
.timeline.is-on .tl-node .icn{color:var(--amber-600);}
.timeline.is-on .tl-node .badge{background:var(--amber-500);}
.tl-body{padding-top:11px;}
.tl-body h4{font-size:20px; font-weight:700; color:var(--ink);}
.tl-body p{font-size:15.5px; color:var(--muted); margin-top:7px; max-width:46ch;}
.tl-body .tl-meta{display:inline-flex; align-items:center; gap:7px; margin-top:11px; font-family:var(--f-disp); font-weight:700; font-size:13px; color:var(--navy-700); background:var(--page); border:1px solid var(--line); border-radius:999px; padding:6px 12px;}
.tl-body .tl-meta .icn{width:14px; height:14px; color:var(--green-600);}
@media(prefers-reduced-motion:reduce){
  .tl-step{opacity:1; transform:none; transition:none;}
  .tl-fill{transition:none;}
}
@media(max-width:560px){
  .tl-rail{left:28px;}
  .tl-step{grid-template-columns:58px 1fr; gap:16px;}
  .tl-node{width:56px; height:56px;}
  .tl-node .icn{width:24px; height:24px;}
  .tl-body{padding-top:6px;}
  .tl-body h4{font-size:18px;}
}
@media(max-width:420px){
  .tl-rail{left:23px;}
  .tl-step{grid-template-columns:48px 1fr; gap:13px; padding-bottom:24px;}
  .tl-node{width:46px; height:46px;}
  .tl-node .icn{width:20px; height:20px;}
  .tl-node .badge{width:22px; height:22px; font-size:11.5px; top:-5px; right:-5px; border-width:2px;}
  .tl-body{padding-top:3px;}
  .tl-body h4{font-size:16.5px;}
  .tl-body p{font-size:14px;}
  .tl-body .tl-meta{font-size:11.5px; margin-top:9px;}
}

/* ============ FAQ ============ */
.faq{background:#fff;}
.faq-wrap{max-width:820px; margin:0 auto; display:flex; flex-direction:column; gap:14px;}
.qa{border:1px solid var(--line); border-radius:var(--r-md); background:#fff; overflow:hidden; transition:box-shadow .15s, border-color .15s;}
.qa[open]{box-shadow:var(--shadow-sm); border-color:var(--navy-100);}
.qa summary{
  list-style:none; cursor:pointer; padding:22px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-family:var(--f-disp); font-weight:700; font-size:18.5px; color:var(--ink);
}
.qa summary::-webkit-details-marker{display:none;}
.qa summary .chev{flex:none; width:26px; height:26px; color:var(--amber-600); transition:transform .2s;}
.qa[open] summary .chev{transform:rotate(180deg);}
.qa .ans{padding:0 24px 24px; font-size:16px; color:var(--body);}
.qa .ans a{color:var(--amber-600); font-weight:600;}
@media(max-width:560px){ .qa summary{font-size:16.5px; padding:18px;} }

/* ============ CONTACT CTA ============ */
.contact{background:linear-gradient(160deg,var(--navy-700),var(--navy-900)); color:#fff;}
.contact .wrap{display:grid; grid-template-columns:1.1fr .9fr; gap:54px; align-items:center;}
.contact h2{color:#fff; font-size:42px; font-weight:800;}
.contact .sub{color:#C4D2E2; font-size:19px; margin-top:18px; max-width:42ch;}
.contact-phone{display:inline-flex; align-items:center; gap:14px; margin-top:30px;}
.contact-phone .big{font-family:var(--f-disp); font-weight:900; font-size:38px; color:#fff; letter-spacing:-.01em;}
.contact-phone .ic{width:60px; height:60px; border-radius:14px; background:var(--amber-500); display:grid; place-items:center; box-shadow:var(--shadow-md);}
.contact-phone .ic .icn{width:30px; height:30px; color:#fff;}
.contact .avail{margin-top:18px; color:#9FE8C2; font-weight:600; display:flex; align-items:center; gap:8px; font-size:15.5px;}
.contact .avail .icn{width:18px;height:18px;}
.form{background:#fff; border-radius:var(--r-lg); padding:26px; box-shadow:var(--shadow-lg); max-width:420px; margin-left:auto;}
.form h3{font-size:21px; font-weight:800; color:var(--ink);}
.form p.fp{font-size:14px; color:var(--muted); margin-top:6px; margin-bottom:18px; line-height:1.5;}
.field{margin-bottom:13px;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.form .wf-done{display:flex; align-items:center; gap:8px; font-size:14.5px; font-weight:600; color:var(--green-600); margin-top:12px;}
.form .wf-done .icn{width:18px; height:18px; flex:none;}
.form .note .icn{width:13px; height:13px; color:var(--green-600); vertical-align:-2px; margin-right:3px;}
.field label{display:block; font-family:var(--f-disp); font-weight:600; font-size:13.5px; color:var(--navy-800); margin-bottom:6px;}
.field input, .field select, .field textarea{
  width:100%; padding:13px 15px; border:1.5px solid var(--line); border-radius:var(--r-sm);
  font-family:var(--f-body); font-size:15.5px; color:var(--ink); background:#fff; transition:border-color .15s, box-shadow .15s;
}
.field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--amber-500); box-shadow:0 0 0 3px var(--amber-100);}
.form .note{font-size:12.5px; color:var(--muted); margin-top:12px; text-align:center;}
@media(max-width:880px){ .contact .wrap{grid-template-columns:1fr; gap:38px;} .contact h2{font-size:32px;} .contact-phone .big{font-size:30px;} .form{margin-left:0; max-width:none;} }

/* ============ FOOTER ============ */
footer.site{background:var(--navy-900); color:#9FB0C2; padding:60px 0 30px; font-size:15px;}
footer.site .cols{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:36px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.08);}
footer.site .fdesc{margin-top:16px; max-width:34ch; line-height:1.7;}
footer.site h5{font-family:var(--f-disp); font-weight:700; color:#fff; font-size:15px; letter-spacing:.04em; margin:0 0 16px;}
footer.site ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px;}
footer.site a{transition:color .16s ease;}
footer.site ul a:hover{color:#fff;}
footer.site .fcon{display:flex; align-items:center; gap:9px;}
footer.site .fcon .icn{width:16px; height:16px; color:var(--amber-400); flex:none;}
footer.site .legal{display:flex; align-items:center; justify-content:space-between; padding-top:24px; gap:16px; flex-wrap:wrap; font-size:13.5px; color:#7488A0;}
footer.site .legal .badges{display:flex; gap:14px; align-items:center;}
footer.site .legal .bdg{display:flex; align-items:center; gap:7px;}
footer.site .legal .bdg .icn{width:15px;height:15px;color:var(--green-500);}
footer.site .legal-links{display:flex; gap:6px 18px; flex-wrap:wrap; width:100%; padding-top:14px; border-top:1px solid rgba(255,255,255,.06);}
footer.site .legal-links a, footer.site .legal-links .linklike{color:#8FA3B8; font-size:13px;}
footer.site .legal-links a:hover, footer.site .legal-links .linklike:hover{color:#fff;}
@media(max-width:760px){ footer.site .cols{grid-template-columns:1fr 1fr;} }
@media(max-width:460px){ footer.site .cols{grid-template-columns:1fr;} }

/* ============ STICKY MOBILE CALL BAR ============ */
.callbar{display:none;}
@media(max-width:940px){
  .callbar{
    display:grid; grid-template-columns:1fr 1fr; gap:0; position:fixed; left:0; right:0; bottom:0; z-index:70;
    box-shadow:0 -4px 20px rgba(10,27,46,.18);
    padding-bottom:env(safe-area-inset-bottom, 0);
    background:var(--navy-800);
  }
  .callbar a{display:flex; align-items:center; justify-content:center; gap:9px; padding:16px; font-family:var(--f-disp); font-weight:800; font-size:16px; color:#fff;}
  .callbar a.c1{background:var(--cta);}
  .callbar a.c2{background:var(--navy-800);}
  .callbar a .icn{width:20px;height:20px;}
  body{padding-bottom:58px;}
  #a11y-btn{bottom:calc(83px + env(safe-area-inset-bottom, 0) + 14px) !important;}
}

/* ============ COOKIE CONSENT ============ */
.ckbar{position:fixed; left:18px; bottom:18px; z-index:120; max-width:390px; background:#fff; border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow-lg); padding:19px 21px; font-size:14px; color:var(--body);}
@media(prefers-reduced-motion:no-preference){ .ckbar{animation:ckin .45s cubic-bezier(.2,.8,.2,1) both;} }
@keyframes ckin{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;}}
.ckbar h2{font-size:15.5px; display:flex; gap:8px; align-items:center; margin-bottom:7px;}
.ckbar h2 .icn{width:17px; height:17px; color:var(--amber-500);}
.ckbar p{line-height:1.55;}
.ckbar a{color:var(--amber-600); font-weight:600; text-decoration:underline;}
.ckbar .ck-actions{display:flex; gap:10px; margin-top:15px;}
.ckbar .ck-btn{flex:1; font-family:var(--f-disp); font-weight:700; font-size:13.5px; padding:11px 12px; border-radius:var(--r-sm); cursor:pointer; border:1.5px solid transparent; transition:background .15s, color .15s, border-color .15s; white-space:nowrap;}
.ckbar .ck-accept{background:var(--navy-800); color:#fff;}
.ckbar .ck-accept:hover{background:var(--navy-700);}
.ckbar .ck-min{background:#fff; color:var(--navy-800); border-color:var(--line);}
.ckbar .ck-min:hover{border-color:var(--navy-600);}
@media(max-width:940px){ .ckbar{bottom:76px;} }
@media(max-width:560px){ .ckbar{left:12px; right:12px; max-width:none;} }

/* ============ LEGAL / DOC PAGES ============ */
.doc-hero{background:linear-gradient(160deg,var(--navy-800),var(--navy-900)); color:#fff; padding:60px 0 50px;}
.doc-hero h1{color:#fff; font-size:38px; letter-spacing:-.02em;}
.doc-hero .doc-updated{color:#AFC0D4; margin-top:12px; font-size:14.5px; display:flex; align-items:center; gap:7px;}
.doc-hero .doc-updated .icn{width:15px; height:15px; color:var(--amber-400);}
.doc{max-width:840px; margin:0 auto; padding:50px 22px 84px; font-size:16.5px;}
.doc h2{font-size:24px; margin:40px 0 12px;}
.doc h2:first-child{margin-top:0;}
.doc h3{font-size:18px; margin:26px 0 8px;}
.doc p{margin:0 0 14px; line-height:1.7;}
.doc ul{margin:0 0 16px; padding-left:22px; display:flex; flex-direction:column; gap:8px;}
.doc a{color:var(--amber-600); font-weight:600;}
.doc a:hover{color:var(--amber-500);}
.doc .doc-note{background:var(--amber-100); border:1px solid #CBDDF2; border-radius:var(--r-md); padding:16px 18px; font-size:15px; margin:22px 0;}
@media(max-width:560px){ .doc-hero h1{font-size:29px;} .doc{font-size:15.5px;} }

/* ============ SPLASH ============ */
.splash{position:fixed; inset:0; z-index:9999; background:var(--page); display:grid; place-items:center; transition:opacity .5s ease, visibility .5s ease;}
.splash.hide{opacity:0; visibility:hidden;}
.splash-inner{display:flex; flex-direction:column; align-items:center; gap:22px;}
.splash-logo{height:88px; width:auto; animation:splashpop .6s cubic-bezier(.2,.8,.2,1) both;}
.splash-bar{width:150px; height:4px; border-radius:4px; background:var(--line); overflow:hidden;}
.splash-bar span{display:block; height:100%; width:38%; border-radius:4px; background:linear-gradient(90deg,var(--amber-400),var(--amber-500)); animation:splashload 1.05s ease-in-out infinite;}
@keyframes splashpop{from{opacity:0; transform:translateY(10px) scale(.95);} to{opacity:1; transform:none;}}
@keyframes splashload{0%{transform:translateX(-130%);} 100%{transform:translateX(420%);}}
@media(prefers-reduced-motion:reduce){ .splash-logo, .splash-bar span{animation:none;} }

/* ============ SCROLL / MOBILE POLISH ============ */
section[id], main [id]{scroll-margin-top:88px;}
@media(max-width:880px){
  .sec{padding:68px 0;}
  .sec-head{margin-bottom:42px;}
}
@media(max-width:640px){
  .sec{padding:52px 0;}
  .wrap{padding:0 18px;}
  .sec-head{margin-bottom:32px;}
  .sec-head h2{font-size:27px;}
  .sec-head p{font-size:16px; margin-top:12px;}
  .lead{font-size:16.5px;}
  .eyebrow{font-size:12px; letter-spacing:.1em;}
  .btn-lg{padding:16px 22px; font-size:16.5px;}

  /* header compaction */
  header.site .wrap{height:62px; gap:10px;}
  .logo{gap:9px;}
  .logo-img{height:38px;}
  .header-cta{gap:8px; right:18px;}
  .header-cta .btn-call{padding:10px 14px; font-size:14px;}
  .header-cta .btn-call .icn{width:17px; height:17px;}

  /* iOS: 16px inputs prevent focus auto-zoom */
  .field input, .field select, .field textarea,
  .wform input, .wform select, .wform textarea,
  .cp-field input{font-size:16px;}

  /* reviews summary cleanup */
  .rv-summary{gap:14px; padding:16px 18px;}
  .rv-summary .div{display:none;}
  .rv-summary .gword{font-size:20px;}
  .rv-score .n{font-size:32px;}

  /* car-brand belt smaller */
  .bb-item{font-size:22px; padding:0 28px;}
  .brandbelt{padding:32px 0 0; margin-top:40px;}
  .brandbelt .bb-head{margin-bottom:20px; padding:0 18px;}

  /* auto-feature badges hug the frame (no edge overflow) */
  .auto-badge{left:10px; top:14px; font-size:12px; padding:9px 14px;}
  .auto-rating{left:12px;}
}
@media(max-width:380px){
  .header-cta .btn-call{padding:9px 12px;}
  .sec-head h2{font-size:24px;}
  .hero-head h1{font-size:27px;}
  .subhero h1{font-size:27px;}
}

/* ============ REVEAL ANIMATIONS ============ */
@media(prefers-reduced-motion:no-preference){
  .reveal{opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1);}
  .reveal.in{opacity:1; transform:none;}
  .grid-3 .svc.reveal:nth-child(2){transition-delay:.07s;}
  .grid-3 .svc.reveal:nth-child(3){transition-delay:.14s;}
  .grid-3 .svc.reveal:nth-child(4){transition-delay:.05s;}
  .grid-3 .svc.reveal:nth-child(5){transition-delay:.12s;}
  .grid-3 .svc.reveal:nth-child(6){transition-delay:.19s;}
  .reviews .rv-summary.reveal{transition-delay:.04s;}
  .reviews .rv-carousel.reveal{transition-delay:.12s;}
  .auto-feature .auto-checks li{opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1);}
  .auto-feature.in .auto-checks li{opacity:1; transform:none;}
  .auto-feature.in .auto-checks li:nth-child(1){transition-delay:.20s;}
  .auto-feature.in .auto-checks li:nth-child(2){transition-delay:.28s;}
  .auto-feature.in .auto-checks li:nth-child(3){transition-delay:.36s;}
  .auto-feature.in .auto-checks li:nth-child(4){transition-delay:.44s;}
  .auto-feature.in .auto-checks li:nth-child(5){transition-delay:.52s;}
  .auto-feature.in .auto-checks li:nth-child(6){transition-delay:.60s;}
  /* avatars pop in one-by-one when the review belt reveals */
  .reviews .rv-belt .rv-belt-avatars .av{opacity:0; transform:translateX(18px) scale(.6); transition:opacity .45s ease, transform .55s cubic-bezier(.34,1.56,.64,1);}
  .reviews .rv-belt.in .rv-belt-avatars .av{opacity:1; transform:none;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(1){transition-delay:.10s;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(2){transition-delay:.18s;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(3){transition-delay:.26s;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(4){transition-delay:.34s;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(5){transition-delay:.42s;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(6){transition-delay:.50s;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(7){transition-delay:.58s;}
  .reviews .rv-belt.in .rv-belt-avatars .av:nth-child(8){transition-delay:.66s;}
}