:root{
 /* Marvel: dark asphalt base + amber accent (blue* tokens remapped to amber) */
 --ink:#090C11; --granite:#11161D; --granite-2:#1A212B; --granite-3:#26313D;
 --blue:#F5A623; --blue-lt:#FFC85C; --blue-dk:#B06A08; --blue-deep:#8A5207; --blue-pale:#FBEEDA;
 --brass:#E8B457; --brass-dk:#8A6415;
 --head:#101822; --body:#4B5A69; --muted:#667584;
 --on-dark:#BFCAD6; --on-dark-dim:#8FA0AF;
 --bg:#F5F7FA; --bg-2:#EDF1F6; --line:#E3E9EF; --line-2:#CBD6E1; --white:#fff;
 --ok:#12854B;
 --r:14px; --r-sm:10px; --maxw:1180px; --nav-h:74px;
 --sh-1:0 1px 2px rgba(9,12,17,.06),0 4px 14px -6px rgba(9,12,17,.10);
 --sh-2:0 2px 4px rgba(9,12,17,.06),0 18px 40px -18px rgba(9,12,17,.24);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
 color:var(--body);background:#fff;line-height:1.72;font-size:16.5px;-webkit-font-smoothing:antialiased;
 text-rendering:optimizeLegibility}
h1,h2,h3,h4,h5{font-family:Sora,Inter,system-ui,sans-serif;color:var(--head);line-height:1.16;
 letter-spacing:-.021em;font-weight:700}
/* height:auto is mandatory. With width/height attributes present, max-width:100% alone
   shrinks the width but leaves the attribute height, which vertically stretches the image. */
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:4px}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.narrow{max-width:820px;margin:0 auto}
.section{padding:88px 0;position:relative}
.section.tight{padding:64px 0}
.bg{background:var(--bg)}
.bg-2{background:var(--bg-2)}
.center{text-align:center}
.dark{background:var(--granite);color:var(--on-dark)}
.dark h1,.dark h2,.dark h3,.dark h4{color:#fff}
.skip{position:absolute;left:-9999px;top:0;background:#fff;color:var(--head);padding:12px 18px;z-index:200}
.skip:focus{left:12px;top:12px}

/* type */
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.72rem;font-weight:700;
 letter-spacing:.19em;text-transform:uppercase;color:var(--blue-dk)}
.eyebrow::before{content:"";width:24px;height:2px;background:var(--blue);flex:none;border-radius:2px}
.center .eyebrow::after{content:"";width:24px;height:2px;background:var(--blue);flex:none;border-radius:2px}
.dark .eyebrow,.hero .eyebrow,.phero .eyebrow,.lp-hero .eyebrow,.form-sec .eyebrow{color:var(--blue-lt)}
.dark .eyebrow::before,.dark .eyebrow::after,.hero .eyebrow::before,.hero .eyebrow::after,
.phero .eyebrow::before,.phero .eyebrow::after,
.lp-hero .eyebrow::before,.lp-hero .eyebrow::after,
.form-sec .eyebrow::before,.form-sec .eyebrow::after{background:var(--blue-lt)}
/* any dark band: headings stay white, body copy stays legible. Guards against the
   default dark-on-dark heading colour leaking into gradient/image sections. */
.dark h1,.dark h2,.dark h3,.dark h4,.dark h5,
.warr h1,.warr h2,.warr h3,.emg h1,.emg h2,.emg h3,.cta h1,.cta h2,.cta h3{color:#fff}
.warr p,.warr .lead,.emg p,.emg .lead{color:var(--on-dark)}
.warr h2 em,.emg h2 em,.cta h2 em,.dark h2 em{color:var(--blue-lt)}
/* lighter tint: these bands carry a blue gradient, so --blue-lt gets too close to it */
.warr .eyebrow,.emg .eyebrow,.cta .eyebrow{color:#A8D9FB}
.warr .eyebrow::before,.warr .eyebrow::after,.emg .eyebrow::before,.emg .eyebrow::after,
.cta .eyebrow::before,.cta .eyebrow::after{background:#A8D9FB}
h1{font-size:clamp(2.15rem,4.9vw,3.5rem);font-weight:800}
h2.sec{font-size:clamp(1.85rem,3.6vw,2.6rem);margin:16px 0 14px;font-weight:800}
h2.sec em{font-style:normal;color:var(--blue-dk)}
.dark h2.sec em{color:var(--blue-lt)}
.lead{font-size:1.09rem;max-width:64ch}
.center .lead{margin-left:auto;margin-right:auto}
/* a section-head lead sits above a full-width block, so a 64ch measure reads as a
   truncated column. Let it run the width of the section instead. */
.sec-head .lead{max-width:none}
.center .sec-head .lead{max-width:72ch}
.dark .lead,.dark p{color:var(--on-dark)}
p+p{margin-top:1.05em}
.sec-head{margin-bottom:44px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:Sora,sans-serif;
 font-weight:700;font-size:1rem;line-height:1.15;padding:16px 26px;border-radius:10px;cursor:pointer;
 border:0;text-align:center;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease}
.btn svg{width:18px;height:18px;flex:none}
.btn-p{background:var(--blue-dk);color:#fff;box-shadow:0 10px 24px -10px rgba(14,111,180,.85)}
.btn-p:hover{background:#0b5f9c;transform:translateY(-2px)}
.btn-w{background:#fff;color:var(--head);box-shadow:0 10px 26px -12px rgba(0,0,0,.55)}
.btn-w:hover{transform:translateY(-2px)}
.btn-g{background:rgba(255,255,255,.10);color:#fff;border:1.6px solid rgba(255,255,255,.46)}
.btn-g:hover{background:rgba(255,255,255,.20);transform:translateY(-2px)}
.btn-o{background:transparent;color:var(--head);border:1.6px solid var(--line-2)}
.btn-o:hover{border-color:var(--blue-dk);color:var(--blue-dk);transform:translateY(-2px)}
.btn-brass{background:var(--brass);color:#2A1E05;box-shadow:0 10px 24px -12px rgba(232,180,87,.9)}
.btn-brass:hover{background:#f0c169;transform:translateY(-2px)}
.btn-lg{padding:18px 32px;font-size:1.05rem}
.btns{display:flex;flex-wrap:wrap;gap:13px}
.center .btns{justify-content:center}
/* narrow phones: long CTA labels (with the phone number in them) must not push the page wide */
@media(max-width:430px){
 .btn{padding:15px 16px;font-size:.94rem;max-width:100%}
 .btn-lg{padding:16px 18px;font-size:.98rem}
 .btns{gap:10px}
 .btns .btn{flex:1 1 100%}
}

/* topbar */
.top{background:var(--ink);color:var(--on-dark-dim);font-size:.815rem;position:relative;z-index:90}
.top .container{display:flex;align-items:center;justify-content:space-between;gap:8px 16px;
 padding-top:9px;padding-bottom:9px;flex-wrap:wrap}
.top ul{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.top li{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.top svg{width:14px;height:14px;color:var(--blue-lt);flex:none}
.top a{color:#fff;font-weight:600}
.top a:hover{color:var(--blue-lt)}
.top .brass{color:var(--brass)}
@media(max-width:1000px){.top .r li:not(:last-child){display:none}}
@media(max-width:720px){.top .l li:nth-child(n+2){display:none}}
@media(max-width:420px){.top{font-size:.76rem}.top ul{gap:14px}}

/* nav */
header.nav{position:sticky;top:0;z-index:100;background:rgba(21,28,37,.97);
 backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.09)}
header.nav::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
 background:linear-gradient(90deg,transparent,var(--blue) 22%,var(--blue) 78%,transparent);opacity:.75}
.nav-in{display:flex;align-items:center;gap:18px;height:var(--nav-h)}
.lg{display:flex;align-items:center;gap:12px;flex:none}
.lg-mark{flex:none}
.lg-txt{display:flex;flex-direction:column;line-height:1}
.lg-txt strong{font-family:Sora,sans-serif;font-size:1.22rem;font-weight:800;letter-spacing:.07em;color:#fff}
.lg-txt small{font-size:.585rem;font-weight:600;letter-spacing:.132em;text-transform:uppercase;
 color:var(--on-dark-dim);margin-top:5px}
.lg-light .lg-txt strong{color:var(--head)}
.lg-light .lg-txt small{color:var(--muted)}
.nlinks{display:flex;align-items:center;gap:21px;margin-left:auto}
.nlinks a{font-size:.875rem;font-weight:600;color:#C4D2DF;padding:6px 0;border-bottom:2px solid transparent;
 transition:.18s;white-space:nowrap}
.nlinks a:hover,.nlinks a.on{color:#fff;border-bottom-color:var(--blue)}
.ncall{display:flex;align-items:center;gap:12px;flex:none;margin-left:8px}
.ncall .num{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.ncall .num small{font-size:.58rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-lt)}
.ncall .num a{font-family:Sora,sans-serif;font-size:1.03rem;font-weight:700;color:#fff;white-space:nowrap}
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:40px;
 margin-left:auto;background:none;border:0;cursor:pointer;padding:0 10px}
.burger span{display:block;height:2px;background:#fff;border-radius:2px;transition:.22s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.drawer{display:none}
/* Nav width budget: brand + 6 links + phone + CTA needs ~1130px. Collapse to the burger
   at 1140px, NOT at 1024, or the nav overflows the container on small laptops. */
@media(max-width:1240px){.nlinks{gap:15px}.nlinks a{font-size:.83rem}.ncall .num a{font-size:.96rem}
 .ncall .btn{padding:14px 18px;font-size:.92rem}}
@media(max-width:1140px){
 .nlinks{display:none}.ncall{display:none}.burger{display:flex}
 .drawer{display:block;position:absolute;left:0;right:0;top:100%;background:var(--granite-2);
  border-top:1px solid rgba(255,255,255,.10);opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .2s,transform .2s,visibility .2s;max-height:calc(100vh - var(--nav-h));overflow-y:auto}
 .drawer.open{opacity:1;visibility:visible;transform:translateY(0)}
 .drawer ul{padding:8px 24px 20px}
 .drawer .dbtns{display:flex;flex-direction:column;gap:10px;padding:18px 24px 24px}
}
.drawer li a{display:block;padding:14px 0;color:#DCE6F0;font-weight:600;
 border-bottom:1px solid rgba(255,255,255,.08)}
@media(max-width:420px){.lg-txt strong{font-size:1.03rem}.lg-txt small{font-size:.5rem;letter-spacing:.12em}}

/* hero */
.hero{position:relative;background:var(--ink);overflow:hidden;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center 42%}
/* Hero copy is centred, so the scrim is a centred radial rather than left-weighted,
   otherwise the headline sits over the open right-hand side of the photograph. */
.hero-bg::after{content:"";position:absolute;inset:0;background:
 radial-gradient(ellipse 78% 70% at 50% 48%,rgba(9,13,18,.80) 0%,rgba(9,13,18,.40) 58%,rgba(9,13,18,.16) 100%),
 linear-gradient(180deg,rgba(9,13,18,.55) 0%,rgba(9,13,18,.20) 26%,rgba(9,13,18,.24) 68%,rgba(9,13,18,.78) 100%)}
.hero-in{position:relative;z-index:2;padding:96px 0 84px;max-width:960px;margin:0 auto;
 text-align:center}
.hero h1{color:#fff;margin:20px 0 20px;text-shadow:0 2px 22px rgba(0,0,0,.6)}
.hero h1 em{font-style:normal;color:var(--blue-lt)}
.hero .sub{color:#D2DEE9;font-size:1.14rem;margin:0 auto 30px;max-width:62ch;
 text-shadow:0 2px 18px rgba(0,0,0,.6)}
.hero .eyebrow{text-shadow:0 2px 14px rgba(0,0,0,.7)}
.hero .btns{margin-bottom:30px;justify-content:center}
.hero-chips{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.chip{display:inline-flex;align-items:center;gap:8px;font-size:.79rem;font-weight:600;color:#D7E3EE;
 background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);padding:8px 14px;border-radius:999px}
.chip svg{width:14px;height:14px;color:var(--blue-lt);flex:none}
.chip.brass svg{color:var(--brass)}
@media(max-width:900px){.hero-in{padding:64px 0 60px}}

/* page hero (inner pages) */
.phero{position:relative;background:var(--ink);overflow:hidden;isolation:isolate}
.phero-bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center 45%}
.phero-bg::after{content:"";position:absolute;inset:0;background:
 linear-gradient(100deg,rgba(10,14,19,.92) 0%,rgba(10,14,19,.82) 50%,rgba(10,14,19,.31) 100%),
 linear-gradient(180deg,rgba(10,14,19,.44),transparent 38%,rgba(10,14,19,.66))}
.phero-in{position:relative;z-index:2;padding:70px 0 66px;max-width:760px}
.phero h1{color:#fff;font-size:clamp(1.95rem,4.2vw,3rem);margin:16px 0 16px}
.phero h1 em{font-style:normal;color:var(--blue-lt)}
.phero .sub{color:#C9D6E3;font-size:1.07rem;max-width:58ch}
.phero .btns{margin-top:26px}
.crumbs{font-size:.78rem;color:#8DA0B3;margin-bottom:6px}
.crumbs a{color:#B6C6D5}.crumbs a:hover{color:#fff}
.crumbs span{opacity:.5;padding:0 7px}

/* trust strip */
.trust{background:var(--granite-2);color:var(--on-dark);border-top:1px solid rgba(255,255,255,.08)}
.trust .container{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}
.trust .t{display:flex;align-items:flex-start;gap:13px;padding:26px 22px 26px 0}
.trust .t+.t{border-left:1px solid rgba(255,255,255,.10);padding-left:26px}
.trust svg{width:26px;height:26px;color:var(--blue-lt);flex:none;margin-top:2px}
.trust .brass svg{color:var(--brass)}
.trust b{display:block;font-family:Sora,sans-serif;color:#fff;font-size:.98rem;font-weight:700;margin-bottom:2px}
.trust span{font-size:.85rem;color:var(--on-dark-dim);line-height:1.55;display:block}
@media(max-width:940px){.trust .container{grid-template-columns:repeat(2,1fr)}
 .trust .t{padding:22px 18px}.trust .t+.t{border-left:0}
 .trust .t:nth-child(even){border-left:1px solid rgba(255,255,255,.10);padding-left:22px}
 .trust .t:nth-child(n+3){border-top:1px solid rgba(255,255,255,.10)}}
@media(max-width:560px){.trust .container{grid-template-columns:1fr}
 .trust .t:nth-child(even){border-left:0}.trust .t+.t{border-top:1px solid rgba(255,255,255,.10)}}

/* cards grid */
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.g2,.g3,.g4{grid-template-columns:1fr}}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
 display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease,border-color .18s}
.card:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.card .ph{aspect-ratio:16/10;overflow:hidden;background:var(--bg-2)}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .ph img{transform:scale(1.045)}
.card .cb{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.card h3{font-size:1.16rem;margin-bottom:9px}
.card p{font-size:.945rem;color:var(--body);flex:1}
.card .more{display:inline-flex;align-items:center;gap:7px;margin-top:16px;font-weight:700;
 font-size:.88rem;color:var(--blue-dk);font-family:Sora,sans-serif}
.card .more svg{width:15px;height:15px;transition:transform .18s}
.card:hover .more svg{transform:translateX(4px)}

.icard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 26px}
.icard .ico{width:46px;height:46px;border-radius:11px;background:var(--blue-pale);color:var(--blue-dk);
 display:grid;place-items:center;margin-bottom:16px}
.icard .ico svg{width:23px;height:23px}
.icard h3{font-size:1.08rem;margin-bottom:8px}
.icard p{font-size:.93rem}
.dark .icard{background:var(--granite-2);border-color:rgba(255,255,255,.10)}
.dark .icard .ico{background:rgba(42,147,224,.16);color:var(--blue-lt)}
.dark .icard p{color:var(--on-dark-dim)}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split.wide-l{grid-template-columns:1.15fr 1fr}
/* class-only selector: this was scoped to `.split img.shot`, so any .shot used inside a
   plain grid silently lost its ratio and object-fit and rendered stretched */
.shot{border-radius:var(--r);box-shadow:var(--sh-2);width:100%;aspect-ratio:4/3;
 object-fit:cover;height:auto}
@media(max-width:900px){.split,.split.wide-l{grid-template-columns:1fr;gap:36px}}

/* checklist */
.checks{display:grid;gap:12px;margin-top:22px}
.checks.two{grid-template-columns:1fr 1fr;gap:12px 28px}
@media(max-width:720px){.checks.two{grid-template-columns:1fr}}
.checks li{display:flex;align-items:flex-start;gap:11px;font-size:.96rem}
.checks svg{width:19px;height:19px;color:var(--ok);flex:none;margin-top:3px}
.dark .checks svg{color:var(--blue-lt)}
.checks b{color:var(--head);font-weight:650}
.dark .checks b{color:#fff}

/* warning list */
.warns{display:grid;gap:11px;margin-top:20px}
.warns li{display:flex;align-items:flex-start;gap:11px;font-size:.96rem}
.warns svg{width:18px;height:18px;color:#C0392B;flex:none;margin-top:4px}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:s}
@media(max-width:1000px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.steps{grid-template-columns:1fr}}
.step{position:relative;padding:30px 24px 28px;background:#fff;border:1px solid var(--line);border-radius:var(--r)}
.step .n{font-family:Sora,sans-serif;font-size:.74rem;font-weight:800;letter-spacing:.14em;
 color:var(--blue-dk);margin-bottom:12px;display:block}
.step h3{font-size:1.05rem;margin-bottom:8px}
.step p{font-size:.925rem}

/* warranty band */
.warr{background:linear-gradient(135deg,var(--granite) 0%,var(--granite-2) 55%,var(--blue-deep) 175%);
 color:var(--on-dark);position:relative;overflow:hidden;isolation:isolate}
.warr::before{content:"";position:absolute;width:760px;height:760px;border-radius:50%;
 top:-420px;right:-220px;background:radial-gradient(circle,rgba(42,147,224,.20) 0%,transparent 66%);z-index:-1}
.warr .seal{width:96px;height:96px;border-radius:50%;border:2px solid var(--brass);
 display:grid;place-items:center;text-align:center;flex:none;
 background:radial-gradient(circle at 34% 28%,rgba(232,180,87,.24),rgba(232,180,87,.07))}
.warr .seal b{font-family:Sora,sans-serif;color:var(--brass);font-size:1.65rem;font-weight:800;line-height:1}
.warr .seal small{display:block;font-size:.53rem;letter-spacing:.16em;color:var(--brass);
 text-transform:uppercase;margin-top:4px;font-weight:700}
.warr-in{display:flex;align-items:center;gap:34px}
@media(max-width:760px){.warr-in{flex-direction:column;text-align:center;gap:24px}}

/* emergency band */
.emg{position:relative;background:var(--ink);color:var(--on-dark);overflow:hidden;isolation:isolate}
.emg-bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center}
.emg-bg::after{content:"";position:absolute;inset:0;
 background:linear-gradient(95deg,rgba(9,13,18,.96),rgba(9,13,18,.88) 55%,rgba(9,13,18,.78))}
.emg .pill{display:inline-flex;align-items:center;gap:9px;background:rgba(192,57,43,.20);
 border:1px solid rgba(226,110,98,.55);color:#F3B4AC;font-size:.76rem;font-weight:700;
 letter-spacing:.14em;text-transform:uppercase;padding:7px 15px;border-radius:999px}
.emg .pill svg{width:14px;height:14px}

/* counties */
.cty{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 24px;
 display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}
.cty:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.cty .st{font-size:.7rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-dk)}
.cty h3{font-size:1.14rem;margin:8px 0 10px}
.cty p{font-size:.92rem;flex:1}
.cty .n{margin-top:16px;font-size:.83rem;color:var(--muted);font-weight:600}

/* town / zip lists */
.tl{columns:4;column-gap:26px;margin-top:20px}
.tl li{break-inside:avoid;font-size:.92rem;padding:4px 0;color:var(--body)}
@media(max-width:1000px){.tl{columns:3}}
@media(max-width:720px){.tl{columns:2}}
@media(max-width:440px){.tl{columns:1}}
.zips{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.zips li{font-size:.815rem;font-variant-numeric:tabular-nums;background:#fff;border:1px solid var(--line-2);
 border-radius:6px;padding:4px 9px;color:#556478;font-weight:600}
.area-blk{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:32px 30px;margin-bottom:24px}
.area-blk>h3{font-size:1.3rem;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.area-blk>h3 span{font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
 color:var(--blue-dk)}
.area-blk h4,.area-blk .area-sub{font-size:.76rem;font-weight:800;letter-spacing:.15em;
 text-transform:uppercase;color:var(--muted);margin-top:26px;padding-top:20px;
 border-top:1px solid var(--line)}

/* faq */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative;
 font-family:Sora,sans-serif;font-weight:650;font-size:1.03rem;color:var(--head)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:11px;height:11px;
 border-right:2.2px solid var(--blue-dk);border-bottom:2.2px solid var(--blue-dk);
 transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq .a{padding:0 0 24px;font-size:.97rem;max-width:74ch}
.faq .a p+p{margin-top:.9em}

/* offices */
.off{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
@media(max-width:760px){.off{grid-template-columns:1fr}}
.off .o{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 26px}
.dark .off .o{background:var(--granite-2);border-color:rgba(255,255,255,.10)}
.off .o .st{display:inline-flex;align-items:center;gap:8px;font-size:.7rem;font-weight:800;
 letter-spacing:.16em;text-transform:uppercase;color:var(--blue-dk);margin-bottom:12px}
.dark .off .o .st{color:var(--blue-lt)}
.off .o .st svg{width:15px;height:15px}
.off .o address{font-style:normal;font-size:1rem;color:var(--head);line-height:1.75;font-weight:600}
.dark .off .o address{color:#fff}
.off .o .note{font-size:.86rem;color:var(--muted);margin-top:12px}
.dark .off .o .note{color:var(--on-dark-dim)}

/* form */
.fwrap{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px 32px;box-shadow:var(--sh-1)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.frow{grid-template-columns:1fr}}
.fld{margin-bottom:16px}
.fld label{display:block;font-size:.83rem;font-weight:700;color:var(--head);margin-bottom:7px}
.fld .req{color:#C0392B}
.fld input,.fld select,.fld textarea{width:100%;font:inherit;font-size:.97rem;color:var(--head);
 background:#fff;border:1.5px solid var(--line-2);border-radius:9px;padding:13px 14px;transition:border-color .15s,box-shadow .15s}
.fld textarea{min-height:126px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:0;border-color:var(--blue-dk);
 box-shadow:0 0 0 3px rgba(14,111,180,.16)}
.fnote{font-size:.83rem;color:var(--muted);margin-top:14px}
.hp{position:absolute;left:-9999px}

/* cta band */
.cta{background:linear-gradient(140deg,var(--granite) 0%,var(--granite-2) 60%,#123B5E 190%);
 color:var(--on-dark);position:relative;overflow:hidden;isolation:isolate}
.cta::before{content:"";position:absolute;width:900px;height:700px;left:50%;top:-360px;
 transform:translateX(-50%);background:radial-gradient(ellipse,rgba(42,147,224,.22),transparent 62%);z-index:-1}
.cta h2{font-size:clamp(1.8rem,3.6vw,2.5rem);color:#fff;margin-bottom:14px}
.cta h2 em{font-style:normal;color:var(--blue-lt)}
.cta p{max-width:56ch;margin:0 auto 28px;color:#C3D2E0}

/* footer */
footer.ft{background:var(--ink);color:var(--on-dark-dim);font-size:.9rem}
.ft-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.25fr;gap:40px;padding:64px 0 48px}
@media(max-width:980px){.ft-top{grid-template-columns:1fr 1fr;gap:34px}}
@media(max-width:560px){.ft-top{grid-template-columns:1fr}}
.ft h4,.ft .ft-h{color:#fff;font-size:.78rem;font-weight:800;letter-spacing:.15em;
 text-transform:uppercase;margin-bottom:18px;font-family:Sora,sans-serif}
.ft ul li{margin-bottom:10px}
.ft a:hover{color:var(--blue-lt)}
.ft .blurb{margin:18px 0 20px;line-height:1.7;max-width:38ch}
.ft .fcon li{display:flex;align-items:flex-start;gap:10px}
.ft .fcon svg{width:16px;height:16px;color:var(--blue-lt);flex:none;margin-top:4px}
.ft .fcon a{color:#fff;font-weight:600}
.ft-bar{border-top:1px solid rgba(255,255,255,.10);padding:22px 0;display:flex;
 justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.82rem}
.ft-bar .badges{display:flex;gap:16px;flex-wrap:wrap}
.ft-bar .badges span{display:inline-flex;align-items:center;gap:7px}
.ft-bar svg{width:14px;height:14px;color:var(--brass)}

/* ---- scroll-triggered sticky CTA bar (all viewports) ---- */
.cbar{position:fixed;left:0;right:0;bottom:0;z-index:130;background:rgba(13,17,23,.97);
 backdrop-filter:blur(14px);border-top:1px solid rgba(255,255,255,.13);
 transform:translateY(105%);transition:transform .3s cubic-bezier(.22,1,.36,1);
 box-shadow:0 -12px 40px -16px rgba(0,0,0,.8)}
.cbar.show{transform:translateY(0)}
.cbar-in{max-width:var(--maxw);margin:0 auto;padding:13px 24px;display:flex;align-items:center;gap:20px}
.cbar-txt{display:flex;flex-direction:column;line-height:1.25;margin-right:auto;min-width:0}
.cbar-txt b{font-family:Sora,sans-serif;font-size:.98rem;font-weight:700;color:#fff;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cbar-txt span{font-size:.79rem;color:var(--on-dark-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cbar-acts{display:flex;align-items:center;gap:10px;flex:none}
.cbar .btn{padding:13px 20px;font-size:.93rem;white-space:nowrap}
.cbar-close{background:none;border:0;color:var(--on-dark-dim);cursor:pointer;padding:8px;
 line-height:0;border-radius:6px;flex:none}
.cbar-close:hover{color:#fff;background:rgba(255,255,255,.1)}
.cbar-close svg{width:16px;height:16px}
@media(max-width:860px){.cbar-txt{display:none}.cbar-in{gap:10px;padding:11px 14px}
 .cbar-acts{width:100%;gap:8px}.cbar-acts .btn{flex:1 1 auto;min-width:0}
 /* the phone number is what truncates the third button on phones; the swapped number
    still lives in the tel: href, so nothing is lost by hiding the digits */
 .cbar-num{display:none}}
@media(max-width:520px){.cbar .btn{padding:13px 6px;font-size:.85rem}
 .cbar .btn svg{width:15px;height:15px}.cbar-close{display:none}}
@media(max-width:370px){.cbar .btn{padding:12px 4px;font-size:.79rem;gap:5px}
 .cbar .btn svg{width:13px;height:13px}.cbar-in{padding:10px 8px}}
@media print{.cbar,header.nav,.top{display:none}}

/* ---- premium polish: scroll reveal ----
   Scoped to .js-reveal, which JS adds to <html> only once it has confirmed it can run
   the observer. If the script never runs, or the observer never fires, content simply
   stays visible instead of being stuck at opacity 0 forever. */
@media(prefers-reduced-motion:no-preference){
 .js-reveal .rv{opacity:0;transform:translateY(18px);
  transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
 .js-reveal .rv.in{opacity:1;transform:none}
}

/* ---- premium polish: type, depth and detail ----
   Bigger optical contrast between display and body, tighter display tracking, and
   layered rather than flat shadows. These are the cues that separate a considered
   site from a template. */
h1,h2.sec{letter-spacing:-.028em}
h1{line-height:1.08}
h2.sec{line-height:1.12}
.lead{line-height:1.72;color:#525F6D}
.eyebrow{font-size:.685rem;letter-spacing:.22em}

/* numerals align in tables, stat rows and ZIP chips */
.zips li,.cty .n,.trust b,.warr .seal b{font-variant-numeric:tabular-nums}

/* cards: layered elevation + a hairline top accent that appears on hover */
.card,.icard,.step{position:relative;isolation:isolate}
.card{box-shadow:0 1px 2px rgba(13,17,23,.04)}
.card:hover{box-shadow:0 2px 4px rgba(13,17,23,.05),0 24px 48px -22px rgba(13,17,23,.28)}
.card .ph{position:relative}
.card .ph::after{content:"";position:absolute;inset:0;
 background:linear-gradient(180deg,transparent 55%,rgba(13,17,23,.18));pointer-events:none}
.card::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;
 background:linear-gradient(90deg,var(--blue),var(--blue-lt));opacity:0;transition:opacity .22s;z-index:2}
.card:hover::after{opacity:1}

/* section headings get a hairline above them for editorial rhythm */
.sec-head .eyebrow{position:relative}

/* images: consistent, slightly deeper elevation */
.shot{box-shadow:0 2px 6px rgba(13,17,23,.06),0 28px 56px -26px rgba(13,17,23,.42)}

/* buttons: subtle inner top light, the detail that reads as "designed" */
.btn-p{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 24px -10px rgba(14,111,180,.8)}
.btn-brass{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 10px 24px -12px rgba(232,180,87,.85)}

/* trust strip: tighter, more considered */
.trust b{letter-spacing:-.012em}

/* faq: hover affordance */
.faq summary{transition:color .18s}
.faq summary:hover{color:var(--blue-dk)}
.faq details[open] summary{color:var(--blue-dk)}

/* selection colour */
::selection{background:rgba(42,147,224,.24)}

/* ---- signature details ----
   1. Fine photographic grain on every dark band. Baked at ~4% white inside the SVG so it
      cannot meaningfully shift contrast; it just stops the navy reading as flat vinyl. */
.hero-bg::before,.phero-bg::before,.lp-hero-bg::before,.emg-bg::before{content:"";
 position:absolute;inset:0;z-index:1;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.045 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
 background-size:180px 180px}
.warr::after,.cta::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.045 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
 background-size:180px 180px}

/* 2. The brass waterline from the logo, as a seam across the top of the warranty band */
.warr-seam{position:absolute;top:0;left:0;right:0;height:3px;z-index:0;
 background:linear-gradient(90deg,transparent,var(--brass) 18%,var(--brass) 82%,transparent)}

/* 3. Ghosted shield watermark in the closing CTA, tying the band back to the mark */
.cta-ghost{position:absolute;right:-70px;bottom:-120px;z-index:-1;opacity:.07;
 pointer-events:none;transform:rotate(-8deg)}
.cta-ghost svg{display:block}

/* 4. Real coverage numbers, presented like a dataset (all derived from the ZIP/town data) */
.georow{display:flex;flex-wrap:wrap;background:#fff;border:1px solid var(--line);
 border-radius:var(--r);overflow:hidden;margin-bottom:46px;box-shadow:var(--sh-1)}
.georow>div{flex:1 1 25%;min-width:150px;text-align:center;padding:28px 18px}
.georow>div+div{border-left:1px solid var(--line)}
.georow b{display:block;font-family:Sora,sans-serif;font-size:clamp(1.9rem,3.4vw,2.6rem);
 font-weight:800;color:var(--blue-dk);line-height:1.1;font-variant-numeric:tabular-nums}
.georow span{display:block;font-size:.76rem;font-weight:700;letter-spacing:.13em;
 text-transform:uppercase;color:var(--muted);margin-top:9px}
@media(max-width:700px){.georow>div{flex:1 1 50%}
 .georow>div:nth-child(3){border-left:0}
 .georow>div:nth-child(n+3){border-top:1px solid var(--line)}}

/* 5. Numbered service cards: quiet editorial index chips on the card photos */
.card .cnum{position:absolute;top:12px;left:12px;z-index:2;font-family:Sora,sans-serif;
 font-size:.72rem;font-weight:800;letter-spacing:.09em;color:#fff;background:var(--granite);
 border:1px solid rgba(255,255,255,.28);padding:4px 10px;border-radius:6px}
.lp-head{background:var(--granite);border-bottom:1px solid rgba(255,255,255,.1);
 position:sticky;top:0;z-index:100}
.lp-head .container{display:flex;align-items:center;gap:18px;height:74px}
.lp-head .r{margin-left:auto;display:flex;align-items:center;gap:14px}
/* trust signals fill the empty middle of the bar. Every item is a client-supplied fact.
   They drop out before the phone and the call button do, so the nav never overflows. */
.lp-trust{display:flex;align-items:center;gap:26px;margin:0 auto}
.lp-trust li{display:inline-flex;align-items:center;gap:8px;color:#C4D2DF;font-size:.82rem;
 font-weight:600;white-space:nowrap}
.lp-trust svg{width:16px;height:16px;color:var(--blue-lt);flex:none}
.lp-trust li.brass svg{color:var(--brass)}
/* The container is capped at --maxw, so a wider viewport buys no extra room: three
   items is the most that fits beside the logo and the call button at any width. */
@media(max-width:1240px){.lp-trust li:nth-child(3){display:none}}
@media(max-width:1080px){.lp-trust{display:none}}
.lp-head .num{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.lp-head .num small{font-size:.58rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-lt)}
.lp-head .num a{font-family:Sora,sans-serif;font-size:1.03rem;font-weight:700;color:#fff;white-space:nowrap}
@media(max-width:640px){.lp-head .num{display:none}.lp-head .container{height:64px}}
/* narrow phones: logo lockup + call button will not both fit at 320px */
@media(max-width:520px){.lp-head .lg-txt small{display:none}
 .lp-head .lg-txt strong{font-size:1.02rem}
 .lp-head .btn{padding:12px 14px;font-size:.87rem}}
@media(max-width:370px){.lp-head .lg-txt{display:none}}
.lp-hero{background:var(--ink);position:relative;overflow:hidden;isolation:isolate}
.lp-hero-bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center 45%}
/* Two layers instead of one flat scrim: a soft radial that darkens only behind the
   centred text, over a light global tint. The photo stays visible at the edges while
   contrast where the words actually sit is unchanged. */
.lp-hero-bg::after{content:"";position:absolute;inset:0;background:
 radial-gradient(ellipse 76% 66% at 50% 46%,rgba(9,13,18,.90) 0%,rgba(9,13,18,.56) 58%,rgba(9,13,18,.22) 100%),
 linear-gradient(180deg,rgba(9,13,18,.62) 0%,rgba(9,13,18,.28) 26%,rgba(9,13,18,.32) 68%,rgba(9,13,18,.84) 100%)}
/* Centred hero, same shape as the Pacific landing pages: a trust chip, eyebrow,
   headline, sub, points and the calls to action, all on the centre line. */
.lp-grid{padding:52px 0 76px;position:relative;z-index:2;max-width:940px;margin:0 auto;
 text-align:center}
.lp-grid h1{color:#fff;font-size:clamp(2.1rem,4.9vw,3.5rem);margin:18px 0 20px;
 text-shadow:0 2px 22px rgba(0,0,0,.6)}
.lp-grid h1 em{font-style:normal;color:var(--blue-lt)}
.lp-grid .sub{color:#D2DEE9;font-size:1.13rem;margin:0 auto 30px;max-width:60ch;
 text-shadow:0 2px 18px rgba(0,0,0,.6)}
.lp-grid .eyebrow{text-shadow:0 2px 14px rgba(0,0,0,.7)}
.lp-grid .btns{justify-content:center}
.lp-chip{display:inline-flex;align-items:center;gap:11px;background:rgba(255,255,255,.09);
 border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:9px 18px 9px 12px;
 backdrop-filter:blur(6px);margin-bottom:6px}
.lp-chip .md{width:30px;height:30px;border-radius:50%;background:rgba(232,180,87,.18);
 display:grid;place-items:center;color:var(--brass);flex:none}
.lp-chip .md svg{width:17px;height:17px}
.lp-chip .t{display:flex;flex-direction:column;align-items:flex-start;line-height:1.25;text-align:left}
.lp-chip .t b{font-family:Sora,sans-serif;font-size:.88rem;font-weight:700;color:#fff}
.lp-chip .t small{font-size:.72rem;color:#B8C8D8}
/* the offer banner: brass on navy is the loudest contrast pair on the page, so the
   free inspection reads before anything else after the headline */
.lp-offer{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;
 gap:6px 10px;background:linear-gradient(180deg,rgb(240,193,105),rgb(232,180,87));
 color:#2A1E05;font-family:Sora,sans-serif;font-size:1.02rem;padding:13px 24px;
 border-radius:10px;margin:4px 0 24px;
 box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 12px 30px -10px rgba(232,180,87,.55)}
.lp-offer svg{width:19px;height:19px;flex:none}
.lp-offer strong{font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.lp-offer span{font-weight:600;font-size:.92rem}
@media(max-width:430px){.lp-offer{font-size:.94rem;padding:12px 16px}}
/* the banner is a link: tap-to-call on phones (one tap = a live lead), scroll-to-form
   on desktop (where tel: links go nowhere). Same look, different action per device. */
a.lp-offer{cursor:pointer;transition:transform .16s,box-shadow .16s}
a.lp-offer:hover{transform:translateY(-2px);
 box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 16px 36px -10px rgba(232,180,87,.7)}
.lp-offer-call{display:none}
@media(max-width:760px){.lp-offer-call{display:inline-flex}.lp-offer-form{display:none}}

/* compact trust badges: mobile replaces the paragraph + bullets with these */
.lp-badges{display:none;flex-wrap:wrap;justify-content:center;gap:8px;margin:16px 0 4px;
 padding:0;list-style:none}
.lp-badges li{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:650;
 color:#D7E3EE;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.20);
 padding:8px 13px;border-radius:999px;white-space:nowrap}
.lp-badges svg{width:13px;height:13px;color:var(--brass);flex:none}

/* MOBILE HERO: one screen from headline to all three CTAs. The paragraph and bullet
   list push the buttons below the fold on phones, and their content is repeated in
   the credential and included-work sections, so they hide rather than shrink. */
@media(max-width:640px){
 .lp-grid{padding:22px 0 40px}
 .lp-grid .eyebrow{display:none}
 .lp-grid h1{font-size:1.74rem;margin:12px 0 14px}
 .lp-offer{margin:2px 0 16px;font-size:.95rem;padding:12px 16px}
 .lp-grid .sub{display:none}
 .lp-grid .lp-pts{display:none}
 .lp-badges{display:flex}
 .lp-chip{padding:7px 14px 7px 9px;margin-bottom:2px}
 .lp-chip .md{width:26px;height:26px}
 .lp-chip .t b{font-size:.8rem}
 .lp-chip .t small{font-size:.67rem}
}
.lp-pts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin:0 auto 30px;
 max-width:820px}
.lp-pts li{display:flex;gap:9px;align-items:center;color:#DCE7F1;font-size:.97rem}
.lp-pts svg{width:18px;height:18px;color:var(--blue-lt);flex:none}
@media(max-width:900px){.lp-grid{padding:38px 0 54px}}

/* searched-for problems: the exact phrases people type, each one a real service.
   Mirrors the paid keywords so the ad, the search and the page all use the same words. */
.kwcloud{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px;margin:0 auto;
 padding:0;list-style:none}
.kwcloud li{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);
 border-radius:999px;padding:10px 17px;font-size:.93rem;color:var(--body);font-weight:600}
.kwcloud svg{width:15px;height:15px;color:var(--blue-dk);flex:none}

/* real-job proof strip: three photos from actual crew jobs, dark band so it reads as
   evidence rather than decoration. One strip per page; captions state only what is
   visible in the photo. */
.work-sec{background:var(--granite);color:var(--on-dark);padding:56px 0 60px}
.work-sec .sec-head .eyebrow{color:var(--blue-lt)}
.work-sec h2{color:#fff}
.work-sec .lead{color:#B9C8D7}
.workgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:980px;margin:0 auto}
.workgrid figure{margin:0}
.workgrid img{width:100%;height:300px;object-fit:cover;border-radius:var(--r-sm);display:block;
 border:1px solid rgba(255,255,255,.12)}
.workgrid figcaption{font-size:.85rem;color:#B9C8D7;margin-top:9px;line-height:1.45}
@media(max-width:760px){.workgrid{grid-template-columns:1fr;max-width:440px}
 .workgrid img{height:240px}}

/* credentials row */
.cred{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){.cred{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cred{grid-template-columns:1fr}}
.cred .c{text-align:center;padding:30px 22px;background:#fff;border:1px solid var(--line);
 border-radius:var(--r)}
.cred .c .ico{width:48px;height:48px;border-radius:50%;background:var(--blue-pale);
 color:var(--blue-dk);display:grid;place-items:center;margin:0 auto 15px}
.cred .c .ico svg{width:23px;height:23px}
.cred .c.brass .ico{background:rgba(232,180,87,.16);color:var(--brass-dk)}
.cred .c h3{font-size:1.06rem;margin-bottom:7px}
.cred .c p{font-size:.92rem}

/* warning signs */
.signs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:900px){.signs{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.signs{grid-template-columns:1fr}}
.signs li{display:flex;gap:13px;align-items:flex-start;background:#fff;border:1px solid var(--line);
 border-left:3px solid var(--blue);border-radius:var(--r-sm);padding:19px 20px;font-size:.95rem}
.signs svg{width:18px;height:18px;color:var(--blue-dk);flex:none;margin-top:3px}

/* 3-step process, centred */
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:s}
@media(max-width:800px){.steps3{grid-template-columns:1fr}}
.steps3 .s{text-align:center;padding:0 14px}
.steps3 .n{width:52px;height:52px;border-radius:50%;background:var(--blue-dk);color:#fff;
 font-family:Sora,sans-serif;font-weight:800;font-size:1.12rem;display:grid;place-items:center;
 margin:0 auto 16px}
.steps3 h3{font-size:1.08rem;margin-bottom:8px}
.steps3 p{font-size:.93rem}

/* bottom form section */
.form-sec{background:var(--granite);color:var(--on-dark);position:relative;overflow:hidden;isolation:isolate}
.form-sec::before{content:"";position:absolute;bottom:-260px;left:-160px;width:680px;height:680px;
 border-radius:50%;background:radial-gradient(circle,rgba(42,147,224,.22),transparent 68%);z-index:-1}
.form-wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.form-copy h2{color:#fff;font-size:clamp(1.9rem,3.9vw,2.7rem);margin-bottom:16px}
.form-copy h2 em{font-style:normal;color:var(--blue-lt)}
.form-copy>p{color:#B9C8D7;font-size:1.03rem;margin-bottom:24px;max-width:46ch}
.form-points{display:grid;gap:10px}
.form-points li{display:flex;align-items:flex-start;gap:12px;color:#CBD8E5;font-size:.97rem}
.form-points svg{width:18px;height:18px;flex:none;color:var(--blue-lt);margin-top:4px}
.formcall{margin-top:30px;padding:22px 24px;border-radius:var(--r);
 background:rgba(42,147,224,.14);border:1px solid rgba(124,198,247,.36)}
.formcall .t{font-size:.66rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;
 color:var(--blue-lt);margin-bottom:6px}
.formcall a.num{font-family:Sora,sans-serif;font-size:1.85rem;font-weight:800;color:#fff;
 line-height:1.1;display:inline-block}
.formcall p{font-size:.87rem;color:#A9BBCC;margin-top:8px}
.lp-form{background:#fff;border-radius:var(--r);padding:32px 30px 28px;
 box-shadow:0 30px 70px -30px rgba(0,0,0,.85)}
.lp-form h3{font-size:1.3rem;margin-bottom:6px}
.lp-form .sm{font-size:.9rem;color:var(--muted);margin-bottom:22px}
.lp-form .fld{margin-bottom:14px}
.lp-badge{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:16px;
 font-size:.83rem;color:var(--muted);text-align:center}
.lp-badge svg{width:15px;height:15px;color:var(--ok);flex:none}
@media(max-width:900px){.form-wrap{grid-template-columns:1fr;gap:38px}}
.lp-strip{background:var(--granite-2);color:var(--on-dark)}
.lp-strip .container{display:flex;flex-wrap:wrap;gap:12px 34px;justify-content:center;
 padding:20px 24px;font-size:.9rem}
.lp-strip span{display:inline-flex;align-items:center;gap:9px}
.lp-strip svg{width:16px;height:16px;color:var(--blue-lt)}
.lp-strip .brass svg{color:var(--brass)}
.lp-ft{background:var(--ink);color:var(--on-dark-dim);font-size:.86rem;padding:34px 0}
.lp-ft .container{display:flex;flex-wrap:wrap;gap:14px 30px;align-items:center;justify-content:space-between}
.lp-ft a{color:#fff;font-weight:600}
/* formcall variant for LIGHT backgrounds (contact page). The base .formcall was designed
   for dark sections; its white number is invisible on a white page. */
.formcall.light{background:var(--blue-pale);border-color:rgba(14,111,180,.35)}
.formcall.light .t{color:var(--blue-dk)}
.formcall.light a.num{color:var(--head)}
.formcall.light p{color:var(--body)}

/* ============================================================
   MARVEL THEME OVERRIDES  (asphalt + amber)
   ============================================================ */
/* Primary button: bright amber with dark ink text — the paving-brand signature */
.btn-p{background:linear-gradient(180deg,#FBB840,#F5A623);color:#241802;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 10px 24px -10px rgba(245,166,35,.75)}
.btn-p:hover{background:linear-gradient(180deg,#FFC352,#F0A015);color:#241802}
.btn-p svg{color:#241802}
/* ghost + white buttons unchanged (white btn keeps navy --head text) */
.btn-brass{color:#2A1E05}
::selection{background:rgba(245,166,35,.28)}
/* hero em / on-dark accents already amber via --blue-lt; eyebrow underline via --blue */
/* nav bottom accent seam -> amber */
header.nav::after{background:linear-gradient(90deg,transparent,var(--blue) 22%,var(--blue) 78%,transparent);opacity:.8}
/* warranty seal: gold ring already; keep */
/* subtle hazard-stripe seam option for bands */
.stripe-seam{position:absolute;top:0;left:0;right:0;height:4px;z-index:1;
 background:repeating-linear-gradient(-45deg,#F5A623 0 14px,#11161D 14px 28px);opacity:.9}
/* logo image in nav/footer */
.lg-img{height:46px;width:auto;display:block}
@media(max-width:520px){.lg-img{height:38px}}
/* star rating inline */
.stars{display:inline-flex;gap:1px;color:var(--blue)}
.stars svg{width:16px;height:16px;fill:currentColor;stroke:none}
.gpill{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.09);
 border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:7px 14px 7px 11px;font-size:.82rem;font-weight:700;color:#fff}
.gpill .gg{width:19px;height:19px}
.gpill .stars svg{width:14px;height:14px}
/* review cards */
.rev{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 24px;position:relative}
.rev .gg{position:absolute;top:22px;right:22px;width:22px;height:22px}
.rev .stars{margin-bottom:12px}
.rev p{font-size:.97rem;color:#3a4653}
.rev .who{margin-top:16px;display:flex;align-items:center;gap:12px}
.rev .av{width:40px;height:40px;border-radius:50%;background:var(--granite);color:var(--blue-lt);
 font-family:Sora,sans-serif;font-weight:800;display:grid;place-items:center;font-size:1rem}
.rev .who b{display:block;color:var(--head);font-size:.95rem}
.rev .who span{font-size:.8rem;color:var(--muted)}

/* anchored sections clear the sticky nav when jumped to */
:target{scroll-margin-top:92px}
.form-sec,.icard[id],section[id]{scroll-margin-top:92px}
/* home hero: tighten the gap under the nav */
.hero-in{padding:44px 0 66px}
@media(max-width:900px){.hero-in{padding:30px 0 48px}}
/* hero 10% offer chip — amber badge + line, sits between the sub and the CTAs */
.hero-offer{display:inline-flex;align-items:center;gap:12px;margin:4px auto 26px;
 background:rgba(245,166,35,.12);border:1px solid rgba(245,166,35,.52);border-radius:999px;
 padding:7px 18px 7px 7px;color:#EAF1F8;font-size:.92rem;font-weight:600;
 backdrop-filter:blur(4px);transition:background .16s ease,transform .16s ease;text-shadow:none}
.hero-offer:hover{background:rgba(245,166,35,.22);transform:translateY(-1px)}
.hero-offer .ho-badge{font-family:Sora,sans-serif;font-weight:800;font-size:.72rem;letter-spacing:.05em;
 color:#241802;background:linear-gradient(180deg,#FBB840,#F5A623);padding:6px 11px;border-radius:999px;
 box-shadow:0 4px 12px -4px rgba(245,166,35,.7);flex:none}
.hero-offer b{color:var(--blue-lt);font-weight:800}
.hero-offer svg{width:15px;height:15px;color:var(--blue-lt);flex:none}
@media(max-width:520px){.hero-offer{font-size:.82rem;gap:9px;padding:6px 14px 6px 6px}
 .hero-offer .ho-badge{font-size:.66rem;padding:5px 9px}}

/* ===== MOBILE REFINEMENTS ===== */
@media(max-width:680px){
 /* tighter vertical rhythm so pages don't feel endless on a phone */
 .section{padding:56px 0}
 .section.tight{padding:44px 0}
 .sec-head{margin-bottom:30px}
 .grid{gap:18px}
 /* iOS Safari zooms in on focus when an input is < 16px; pin to 16px */
 .fld input,.fld select,.fld textarea{font-size:16px}
 /* form cards get their padding back a bit on small screens */
 .fwrap,.lp-form{padding:26px 20px}
 /* form section stacks: give the copy and card real spacing */
 .form-wrap{gap:30px}
 /* trust strip + georow read better with a touch less padding */
 .trust .t{padding:20px 16px}
 .georow>div{padding:22px 14px}
}
@media(max-width:400px){
 .container{padding:0 18px}
 .hero h1{font-size:1.72rem}
 .cbar-in{padding:10px 12px}
}