/* ============================================================
   AXIS DESIGN SYSTEM — SOURCE OF TRUTH: axis_template_v1.html
   Inherited VERBATIM. Home-only additions live at the bottom
   under HOME EXTENSIONS and use existing tokens only.
   ============================================================ */
:root{
  --navy:#0A1622; --navy-90:#101F30; --navy-80:#16293E;
  --line:#E4E8EE; --line-dark:#1F3349;
  --ink:#16202E; --steel:#5B6B80; --mist:#F4F7F9; --white:#fff;
  --orange:#FFC93D; --orange-dark:#F0B81F; --orange-tint:#FFF7E0;
  --aqua:#FFC93D; --aqua-dark:#C79A06; --aqua-tint:#FFF6DC;
  --radius:12px; --radius-sm:8px;
  --shadow:0 10px 30px -12px rgba(10,22,34,.18);
  --shadow-lg:0 24px 60px -24px rgba(10,22,34,.35);
  --container:1160px;
  --font-display:'Saira Extra Condensed',sans-serif;
  --font-body:'Inter',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:var(--ink);line-height:1.6;font-size:16px;background:var(--white)}
img{max-width:100%;display:block}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}

h1,h2,h3{font-family:var(--font-display);text-transform:uppercase;line-height:1;letter-spacing:.01em}
h1{font-size:clamp(44px,6.5vw,72px);font-weight:800}
h2{font-size:clamp(32px,4.5vw,48px);font-weight:800}
h3{font-size:24px;font-weight:700}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:15.5px;padding:15px 28px;border-radius:var(--radius-sm);text-decoration:none;border:0;cursor:pointer;transition:.18s;font-family:var(--font-body)}
.btn-orange{background:var(--orange);color:#1A1503}
.btn-orange:hover{background:var(--orange-dark);color:#1A1503;transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--white);border:1.5px solid rgba(255,255,255,.35)}
.btn-ghost:hover{border-color:var(--orange);color:var(--orange)}
.btn-navy{background:#171303;color:#fff}
.btn-navy:hover{background:var(--navy-80)}

/* ============ TOPBAR + HEADER ============ */
.topbar{background:var(--navy);color:#B9C6D8;font-size:13px}
.topbar .container{display:flex;justify-content:space-between;align-items:center;height:36px}
.topbar a{color:var(--orange);font-weight:700;text-decoration:none}
.header{position:sticky;top:0;z-index:100;background:var(--white);transition:box-shadow .25s}
.header.scrolled{box-shadow:0 6px 24px -12px rgba(10,22,34,.18)}
.header .container{display:flex;align-items:center;justify-content:space-between;height:86px;gap:28px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none}
.logo svg{width:40px;height:40px;flex:none}
.logo-txt{font-family:var(--font-display);font-weight:800;font-size:30px;color:var(--navy);letter-spacing:.03em;line-height:.9}
.logo-txt small{display:block;font-family:var(--font-body);font-size:9px;font-weight:800;letter-spacing:.36em;color:var(--steel)}
.nav{display:flex;gap:34px;align-items:center}
.nav > a{display:flex;align-items:center;text-decoration:none;color:var(--ink);font-weight:700;font-size:17.5px;padding:8px 0;transition:.15s}
.nav > a:hover{color:#171303}

.h-right{display:flex;align-items:center;flex:none}
.header-cta{flex:none;padding:15px 28px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:14px}

.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.burger span{width:24px;height:2.5px;background:var(--navy);border-radius:2px;transition:.25s}

/* mobile drawer — billion-dollar grade */
.drawer{position:fixed;inset:0;z-index:200;pointer-events:none}
.drawer .scrim{position:absolute;inset:0;background:rgba(9,17,28,.55);backdrop-filter:blur(3px);opacity:0;transition:.3s}
.drawer .panel{position:absolute;top:0;right:0;bottom:0;width:min(360px,92vw);background:linear-gradient(175deg,var(--navy) 0%,#0F2236 100%);transform:translateX(102%);transition:.34s cubic-bezier(.32,.72,0,1);display:flex;flex-direction:column;overflow-y:auto;box-shadow:-24px 0 60px rgba(0,0,0,.35)}
.drawer.open{pointer-events:auto}
.drawer.open .scrim{opacity:1}
.drawer.open .panel{transform:none}

.dw-top{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 16px;border-bottom:1px solid var(--line-dark)}
.dw-top .logo-txt{color:#fff;font-size:24px}
.dw-top .close{background:rgba(255,255,255,.08);border:0;color:#fff;width:38px;height:38px;border-radius:50%;font-size:20px;cursor:pointer;line-height:1;display:grid;place-items:center;transition:.15s}
.dw-top .close:active{background:var(--orange)}

.dw-label{font-size:10.5px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:#6F84A0;padding:18px 22px 8px}
.dw-nav{display:flex;flex-direction:column}
.dw-nav a{display:flex;align-items:center;justify-content:space-between;color:#E7EDF4;text-decoration:none;font-weight:600;font-size:16.5px;padding:14px 22px;border-bottom:1px solid rgba(36,58,92,.5);transition:.15s}
.dw-nav a::after{content:"→";color:#41577A;font-weight:400;transition:.15s}
.dw-nav a:active{background:rgba(255,255,255,.05);color:#fff}
.dw-nav a:active::after{color:#fff;transform:translateX(3px)}
.dw-nav a.active{color:#fff;box-shadow:inset 3px 0 0 var(--orange);background:rgba(255,255,255,.04)}
.dw-nav a.active::after{content:"●";font-size:8px;color:var(--orange)}

/* staggered reveal */
.dw-label,.dw-nav a,.dw-actions,.dw-foot{opacity:0;transform:translateX(14px)}
.drawer.open .dw-label,.drawer.open .dw-nav a,.drawer.open .dw-actions,.drawer.open .dw-foot{opacity:1;transform:none;transition:opacity .3s ease,transform .3s cubic-bezier(.2,.7,.3,1)}
.drawer.open .dw-nav a:nth-child(1){transition-delay:.05s}
.drawer.open .dw-nav a:nth-child(2){transition-delay:.09s}
.drawer.open .dw-nav a:nth-child(3){transition-delay:.13s}
.drawer.open .dw-nav a:nth-child(4){transition-delay:.17s}
.drawer.open .dw-nav a:nth-child(5){transition-delay:.21s}
.drawer.open .dw-actions{transition-delay:.26s}
.drawer.open .dw-foot{transition-delay:.32s}

.dw-area{font-size:12.5px;color:#6F84A0;margin-bottom:12px;display:flex;align-items:center;gap:7px}
.dw-area svg{width:13px;height:13px;stroke:var(--orange);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}

.dw-actions{padding:16px 22px 6px;display:grid;gap:10px}
.dw-actions .btn{width:100%;font-size:15.5px}
.dw-actions .btn-line{background:rgba(255,255,255,.06);color:#E7EDF4;border:1px solid var(--line-dark)}
.dw-actions .btn-line:active{border-color:#fff;color:#fff}

.dw-foot{margin-top:auto;padding:20px 22px 24px;border-top:1px solid var(--line-dark)}
.dw-hours{display:flex;justify-content:space-between;font-size:13.5px;color:#9DB0C5;margin-bottom:6px}
.dw-hours b{color:#fff;font-weight:700}
.dw-open{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:#5ECB7B;margin-bottom:16px}
.dw-open::before{content:"";width:7px;height:7px;border-radius:50%;background:#5ECB7B;animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.25}}
.dw-contact{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dw-call,.dw-text{display:flex;align-items:center;justify-content:center;gap:9px;text-decoration:none;font-weight:800;font-size:15.5px;padding:16px 10px;border-radius:var(--radius-sm);transition:.15s}
.dw-call{background:var(--orange);color:#1A1503}
.dw-call:active{background:var(--orange-dark)}
.dw-text{background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--line-dark)}
.dw-text:active{border-color:var(--orange);color:var(--orange)}
.dw-call svg{stroke:#1A1503}.dw-call svg,.dw-text svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* short phones — compress so everything fits without scrolling */
@media(max-height:740px){
  .dw-top{padding:14px 22px 12px}
  .dw-label{padding:12px 22px 6px}
  .dw-nav a{padding:11px 22px;font-size:15.5px}
  .dw-actions{padding:12px 22px 4px;gap:8px}
  .dw-actions .btn{padding:13px;font-size:14.5px}
  .dw-foot{padding:14px 22px 18px}
  .dw-hours{font-size:12.5px;margin-bottom:4px}
  .dw-open{margin-bottom:12px}
  .dw-call,.dw-text{padding:14px 8px;font-size:14.5px}
}

@media(max-width:920px){
  .nav,.h-right{display:none}
  .burger{display:flex}
  .topbar .tb-right{display:none}
  .topbar .container{justify-content:center;height:34px}
  .topbar .hide-m{display:inline-flex !important;font-size:12.5px}
  body{padding-bottom:64px}
  .dock{display:grid}
}

/* ============ MOBILE ACTION DOCK — premium ============ */
.dock{display:none;position:fixed;left:0;right:0;bottom:0;z-index:150;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 -8px 32px rgba(13,27,42,.14);padding:9px 14px calc(9px + env(safe-area-inset-bottom));justify-content:space-between;align-items:center;gap:8px}
.dock::before{content:"";position:absolute;top:0;left:0;right:0;height:3.5px;background:#171303}
.dock a{display:flex;flex-direction:row;align-items:center;gap:7px;padding:10px 8px;border-radius:10px;text-decoration:none;color:var(--navy);font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;transition:transform .12s,background .15s}
.dock a svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.dock a:active{transform:scale(.94);background:var(--mist)}
.dock .dock-cta{background:var(--orange);color:#1A1503;font-size:13.5px;padding:13px 20px;border-radius:10px;box-shadow:0 5px 16px -6px rgba(255,201,61,.55);gap:0}
.dock .dock-cta svg{display:none}
.dock .dock-cta:active{transform:scale(.96);background:var(--orange-dark)}
@media(max-width:920px){.dock{display:flex}}

/* ============ SECTIONS (system) ============ */
.section{padding:68px 0}
.section.tint{background:var(--mist)}
.sec-head{margin-bottom:38px;max-width:640px}
.sec-head .kicker{color:var(--steel)}
.sec-head h2{color:var(--navy)}
.sec-head p{color:var(--steel);margin-top:12px;font-size:16.5px}
.kicker{display:inline-flex;align-items:center;gap:10px;color:#9DB0C5;font-weight:800;font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px}
.kicker::before{content:"";width:26px;height:2px;background:#9DB0C5}

/* CTA band */
.cta-band{background:linear-gradient(135deg,#0A1622,#10243A);color:#fff;text-align:center}
.cta-band .container{padding-top:80px;padding-bottom:80px}
.cta-band p{color:#9DB0C5;margin:12px 0 30px;font-size:17px}

/* footer */
.footer{background:var(--navy);color:#8FA2B8}
.ft-inner{display:grid;grid-template-columns:1.4fr 2.2fr;gap:80px;padding-top:72px;padding-bottom:56px}
.ft-logo{display:inline-flex;align-items:center;gap:11px;text-decoration:none;margin-bottom:18px}
.ft-logo svg{width:36px;height:36px;flex:none}
.ft-brand p{font-size:14px;color:#7E92A8;max-width:340px;line-height:1.7}
.ft-area{display:flex;align-items:center;gap:8px;margin-top:18px;font-size:13px;color:#7E92A8}
.ft-area b{color:#fff;font-weight:700}
.ft-area svg{width:14px;height:14px;stroke:var(--orange);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ft-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.ft-col h5{font-family:var(--font-display);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.14em;color:#fff;margin-bottom:18px}
.ft-col a{display:block;color:#94A6BA;text-decoration:none;padding:6px 0;font-size:14px;transition:color .13s}
.ft-col a:hover{color:#fff}
.ft-meta{display:block;margin-top:12px;font-size:12.5px;color:#5F7388;line-height:1.6}
.ft-bottom{border-top:1px solid rgba(255,255,255,.07)}
.ft-bottom .container{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-top:24px;padding-bottom:28px;font-size:12.5px;color:#5F7388;flex-wrap:wrap}
.ft-legal-links{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.ft-legal-links a{color:#5F7388;text-decoration:none;transition:color .13s}
.ft-legal-links a:hover{color:#94A6BA}
@media(max-width:860px){
  .ft-inner{grid-template-columns:1fr;gap:44px;padding-top:56px}
  .ft-cols{gap:32px}
}
@media(max-width:560px){
  .ft-cols{grid-template-columns:1fr 1fr;gap:32px 24px}
  .ft-bottom .container{flex-direction:column;align-items:flex-start;gap:12px}
}

/* ============================================================
   HOME EXTENSIONS — new pieces only · existing tokens only
   ============================================================ */
.home-hero{position:relative;background:linear-gradient(160deg,var(--navy) 0%,#0F2236 60%,#132C49 100%);color:#fff;overflow:hidden}
.home-hero .media{position:absolute;inset:0}
.home-hero .media video,.home-hero .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* placeholder until assets/videos/hero-drone-roof-01.mp4 lands — delete .ph then */
.home-hero .ph{position:absolute;inset:0;background:radial-gradient(900px 420px at 78% 18%,rgba(255,201,61,.08),transparent 60%)}
.home-hero .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,22,34,.42) 0%,rgba(10,22,34,.18) 45%,rgba(10,22,34,.66) 100%)}
.home-hero .container{position:relative;z-index:2;max-width:880px;text-align:center;padding-top:clamp(68px,11vh,120px);padding-bottom:clamp(60px,9vh,100px)}
.home-hero .kicker{margin-bottom:18px;color:#fff;text-shadow:0 1px 3px rgba(10,22,34,.7),0 2px 14px rgba(10,22,34,.55)}
.home-hero .kicker::before{background:rgba(255,255,255,.85)}
.home-hero .kicker::after{content:"";width:26px;height:2px;background:rgba(255,255,255,.85)}
.home-hero h1{margin-bottom:14px;font-size:clamp(46px,7vw,80px)}
.home-hero h1 em{font-style:normal;color:var(--orange)}
.home-hero .lede{font-size:clamp(16px,2vw,18.5px);color:#B9C6D8;max-width:620px;margin:0 auto 32px}

/* the RoofIQ bar */
.iqbar{display:flex;gap:0;max-width:640px;margin:0 auto;background:var(--white);border-radius:var(--radius);padding:7px;box-shadow:var(--shadow-lg)}
.iqbar .fld{position:relative;flex:1;display:flex;align-items:center}
.iqbar .fld svg{position:absolute;left:14px;width:18px;height:18px;flex:none}
.iqbar input{width:100%;border:0;outline:none;font:inherit;font-size:15.5px;padding:14px 12px 14px 42px;border-radius:var(--radius-sm);color:var(--ink)}
.iqbar input::placeholder{color:#93A3B7}
.iqbar .btn{flex:none;padding:14px 24px;font-size:15px}
.iq-under{display:flex;gap:22px;justify-content:center;margin-top:16px;font-size:12.5px;font-weight:600;color:#9DB0C5;flex-wrap:wrap}
.iq-under span{display:inline-flex;align-items:center;gap:6px}
.iq-under svg{width:13px;height:13px;stroke:#9DB0C5;stroke-width:2.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:640px){
  .iqbar{flex-direction:column;gap:8px;padding:10px}
  .iqbar .btn{width:100%}
}

/* trust band — stat-band structure, icon items */
.trust{background:var(--white);border-bottom:1px solid var(--line)}
.trust .container{display:grid;grid-template-columns:repeat(4,1fr)}
.t-item{display:flex;align-items:center;gap:15px;padding:26px 22px;border-right:1px solid var(--line);transition:background .18s}
.t-item:hover{background:var(--mist)}
.t-item:last-child{border-right:0}
.t-item svg{width:48px;height:38px;flex:none;transition:transform .18s}
.t-item:hover svg{transform:translateY(-2px)}
.t-item b{display:block;font-size:14px;font-weight:800;color:var(--navy);line-height:1.25;letter-spacing:.01em}
.t-item span{font-size:12px;color:var(--steel);line-height:1.35;display:block;margin-top:1px}
@media(max-width:920px){
  .trust .container{grid-template-columns:1fr 1fr}
  .t-item:nth-child(2){border-right:0}
  .t-item{border-bottom:1px solid var(--line)}
  .t-item:nth-child(3),.t-item:nth-child(4){border-bottom:0}
}
.tf{stroke:var(--navy);stroke-width:6;fill:none;stroke-linejoin:miter;stroke-linecap:square}
.tf2{stroke:var(--navy);stroke-width:4;fill:none;stroke-linejoin:miter;stroke-linecap:square}
.thf{fill:var(--orange);stroke:none}
.tha{stroke:var(--orange);stroke-width:7;fill:none;stroke-linecap:round;stroke-linejoin:round}



/* services grid */
.svc{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.svc-card{grid-column:span 2}
.svc-card:nth-child(4),.svc-card:nth-child(5){grid-column:span 3}
.svc-card{display:block;text-decoration:none;border-radius:16px;overflow:hidden;position:relative;transition:.25s cubic-bezier(.2,.7,.3,1);box-shadow:0 10px 30px -16px rgba(10,22,34,.25)}
.svc-card:hover{transform:translateY(-5px);box-shadow:0 26px 60px -24px rgba(10,22,34,.45)}
.svc-media{position:relative;aspect-ratio:4/3}
.svc-card:nth-child(4) .svc-media,.svc-card:nth-child(5) .svc-media{aspect-ratio:16/8.5}
.svc-media{background:linear-gradient(160deg,#13283F,#0A1622);overflow:hidden}
.svc-media .ph-icon{position:absolute;inset:0;margin:auto;width:46%;height:46%;opacity:.16}
.svc-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.svc-card:hover .svc-media img{transform:scale(1.05)}
.svc-shade{position:absolute;inset:0;background:linear-gradient(185deg,rgba(10,22,34,.12) 35%,rgba(10,22,34,.72) 100%)}
.svc-media h3{position:absolute;left:20px;bottom:16px;right:20px;color:#fff;font-size:clamp(24px,2.4vw,30px);letter-spacing:.04em;text-shadow:0 1px 3px rgba(10,22,34,.7),0 2px 14px rgba(10,22,34,.5);display:flex;align-items:center}
.svc-media h3::after{content:"→";font-family:var(--font-body);font-size:19px;font-weight:700;margin-left:auto;opacity:0;transform:translateX(-6px);transition:.22s}
.svc-card:hover h3::after{opacity:1;transform:none}
.svc-badge{position:absolute;top:14px;left:14px;display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:6px 11px;border-radius:99px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.svc-badge svg{width:11px;height:11px;margin:0;stroke:currentColor;stroke-width:2.6;fill:none;stroke-linecap:round}
.svc-badge{gap:6px;font-size:10px;font-weight:800;letter-spacing:.1em;padding:7px 12px;border:1px solid transparent;box-shadow:0 2px 10px -2px rgba(3,8,15,.4)}
.svc-badge.iq{background:rgba(15,27,42,.62);color:#7BE3A4;border-color:rgba(61,220,104,.5)}
.svc-badge.iq svg{stroke:#3DDC68}
.svc-badge.dc{background:rgba(15,27,42,.62);color:#fff;border-color:rgba(255,255,255,.4)}
.svc-badge.dc svg{stroke:#fff}
.svc-badge svg{width:11px;height:11px;margin:0;stroke:currentColor;stroke-width:2.6;fill:none;stroke-linecap:round}
@media(max-width:920px){.svc{grid-template-columns:1fr;gap:14px}.svc-media{aspect-ratio:16/9}}
/* technical icon strokes for cards */
.cf{stroke:var(--navy);stroke-width:5;fill:none;stroke-linejoin:miter;stroke-linecap:square}
.cf2{stroke:var(--navy);stroke-width:3.2;fill:none;stroke-linejoin:miter;stroke-linecap:square}
.cg{stroke:#AEB9C6;stroke-width:3.2;fill:none;stroke-linecap:round}
.chf{fill:var(--orange);stroke:none}

/* RoofIQ showcase — dark band */
.showcase{background:linear-gradient(160deg,var(--navy) 0%,#0F2236 70%,#132C49 100%);color:#fff}
.showcase .container{padding-top:76px;padding-bottom:76px}
.showcase .sec-head h2{color:#fff}
.showcase .sec-head p{color:#9DB0C5}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:8px}
.step{background:rgba(255,255,255,.04);border:1px solid var(--line-dark);border-radius:var(--radius);padding:26px}
.step .n{font-family:var(--font-display);font-weight:800;font-size:15px;color:var(--orange);letter-spacing:.1em;margin-bottom:10px;display:block}
.step h3{color:#fff;margin-bottom:8px;font-size:21px}
.step p{font-size:14px;color:#9DB0C5}
.kill{display:flex;align-items:center;gap:16px;justify-content:center;margin-top:36px;flex-wrap:wrap;text-align:center}
.kill p{font-size:clamp(16px,2.2vw,20px);color:#D7DFE9;font-weight:600}
.kill p b{color:var(--orange)}
@media(max-width:920px){.steps{grid-template-columns:1fr}}

/* baths & windows band */
.design{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.design .visual{position:relative;border-radius:var(--radius);overflow:hidden;min-height:320px;background:linear-gradient(150deg,#16293E,#0F2236);box-shadow:var(--shadow-lg);display:grid;place-items:center}
.design .visual span{color:#6F84A0;font-size:13px;font-weight:600;text-align:center;padding:0 30px}
.design .visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.design h2{color:var(--navy)}
.design p{color:var(--steel);margin:14px 0;font-size:16px}
@media(max-width:920px){.design{grid-template-columns:1fr}}

/* process strip */
.proc{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.pstep{text-align:center;padding:18px 10px}
.pstep svg{width:64px;height:50px;margin:0 auto 10px;display:block}
.pstep b{display:block;font-size:13px;font-weight:800;color:var(--navy);line-height:1.25}
.pstep span{font-size:11.5px;color:var(--steel)}
.pstep .pn{font-family:var(--font-display);font-weight:800;font-size:13px;color:#C9CFD8;letter-spacing:.1em;display:block;margin-bottom:8px}
@media(max-width:920px){.proc{grid-template-columns:1fr 1fr}.pstep:last-child{grid-column:1/-1}}

/* storm authority strip */
.sauth{display:grid;grid-template-columns:1.1fr .9fr;gap:42px;align-items:center}
.sauth .feed{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.sauth .feed .head{display:flex;justify-content:space-between;align-items:center;background:var(--navy);color:#9DB0C5;font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:13px 18px}
.sauth .feed .head .live{color:#fff;display:flex;gap:7px;align-items:center}
.sauth .evt{display:flex;gap:14px;align-items:baseline;padding:14px 18px;border-bottom:1px solid var(--line);font-size:14px}
.sauth .evt:last-child{border:0}
.sauth .evt time{font-weight:800;font-size:12px;color:var(--steel);flex:none;width:88px}
.sauth .evt p b{color:var(--navy)}
.sauth .evt p{color:var(--steel)}
.sauth h2{color:var(--navy)}
.sauth .copy p{color:var(--steel);margin:14px 0;font-size:15.5px}
.sauth .copy p b{color:var(--ink)}
@media(max-width:920px){.sauth{grid-template-columns:1fr}}
.home-hero .hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:22px}

/* two-tier: slim utility bar under the main header */
.subbar{background:var(--mist);border-bottom:1px solid var(--line)}
.subbar .container{display:flex;justify-content:space-between;align-items:center;height:42px;gap:18px}
.sub-links{display:flex;gap:24px}
.sub-links a{font-size:13.5px;font-weight:600;color:var(--steel);text-decoration:none;transition:.15s}
.sub-links a:hover{color:var(--navy)}
.sub-phone{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--steel);text-decoration:none;transition:.15s}
.sub-phone b{color:var(--navy);font-weight:800}
.sub-phone svg{width:15px;height:15px;stroke:var(--navy);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sub-phone:hover b{color:#171303}
@media(max-width:920px){.subbar{display:none}}

/* ===== home hero: two-column (Infinity structure) ===== */
.home-hero .hgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;text-align:left}
.home-hero .hgrid h1{font-size:clamp(46px,6vw,74px);text-shadow:0 2px 24px rgba(10,22,34,.45)}
.home-hero .hgrid .lede{color:#fff;text-shadow:0 1px 3px rgba(10,22,34,.7),0 2px 14px rgba(10,22,34,.55);font-size:clamp(16px,1.9vw,18px)}
.home-hero .accent{text-shadow:0 2px 18px rgba(10,22,34,.45)}
.home-hero .accent{font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:clamp(22px,2.6vw,30px);color:#fff;margin:6px 0 16px;line-height:1.05}
.home-hero .accent em{font-style:normal;color:var(--orange)}
.home-hero .hgrid .lede{margin:0 0 0}
@media(max-width:920px){.home-hero .hgrid{grid-template-columns:1fr;gap:32px}}

/* ===== quote card + RoofIQ (ported from axis_template_v1) ===== */



.quote-card h3{color:var(--navy);margin-bottom:4px}
.quote-card .sub{font-size:13.5px;color:var(--steel);margin-bottom:18px}
.field{margin-bottom:11px}
.field input{width:100%;padding:14px 15px;border:1.5px solid var(--line);border-radius:var(--radius-sm);font:inherit;font-size:15px;transition:.15s}
.field input:focus{outline:none;border-color:#171303;box-shadow:0 0 0 3px rgba(23,19,3,.08)}
.quote-card .btn{width:100%}
.quote-card .fine{text-align:center;font-size:12px;color:var(--steel);margin-top:11px}
.quote-card .tool-badge{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#1E9E4B;background:#E7F8EC;padding:5px 10px;border-radius:99px;margin-bottom:10px}
.tool-badge svg{width:11px;height:11px;stroke:#1E9E4B;stroke-width:2.6;fill:none;stroke-linecap:round}
.iq-field{position:relative}
.iq-field > svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:19px;height:19px;pointer-events:none;z-index:2}
.field.iq-field input{padding:14px 15px 14px 46px}
.iq-err{display:none;font-size:12.5px;font-weight:600;color:#C92A2A;background:#FDECEC;border-radius:8px;padding:9px 12px;margin:-3px 0 10px}
.iq-err.on{display:block}
.iq-oob{display:none}
.iq-oob.on{display:block;animation:rise .4s cubic-bezier(.2,.7,.3,1)}
.iq-oob h3{color:var(--navy);margin-bottom:6px}
.iq-oob p{font-size:13.5px;color:var(--steel);margin-bottom:14px}
.iq-back{display:block;width:100%;background:none;border:0;color:var(--steel);font-size:13px;font-weight:700;margin-top:10px;cursor:pointer;font-family:var(--font-body)}
.iq-back:hover{color:#171303}
/* autocomplete dropdown — same smoked glass as the card */
.pac-container{border-radius:14px;border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 24px 60px -16px rgba(3,8,15,.7);font-family:var(--font-body);margin-top:8px;padding:5px 0;background:linear-gradient(165deg,rgba(15,27,42,.88),rgba(9,18,30,.86));backdrop-filter:blur(22px) saturate(170%);-webkit-backdrop-filter:blur(22px) saturate(170%);z-index:300}
.pac-item{display:flex;align-items:center;padding:10px 14px;font-size:12px;color:#9DB0C5;cursor:pointer;border:0;line-height:1.3;transition:.12s}
.pac-item + .pac-item{border-top:1px solid rgba(255,255,255,.08)}
.pac-item::before{content:"";width:13px;height:13px;margin-right:9px;flex:none;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2 C8.1 2 5 5.1 5 9 C5 14.2 12 22 12 22 C12 22 19 14.2 19 9 C19 5.1 15.9 2 12 2 Z" fill="%233DDC68"/><circle cx="12" cy="9" r="2.6" fill="%230A1622"/></svg>') no-repeat center/contain}
.pac-item:hover,.pac-item-selected{background:rgba(255,255,255,.08)}
.pac-item-query{font-size:13.5px;font-weight:700;color:#fff;padding-right:5px}
.pac-icon{display:none}
.pac-logo:after{margin:5px 12px;opacity:.7;transform:scale(.85);transform-origin:right;filter:invert(1) brightness(1.6)}
.iq-loading{display:none;padding:6px 0 2px}
.iq-loading.on{display:block}
.iq-step{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--steel);padding:7px 0;opacity:.35;transition:.3s}
.iq-step.active{opacity:1;color:var(--navy);font-weight:600}
.iq-step.done{opacity:1}
.iq-step .ic{width:18px;height:18px;flex:none;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;transition:.3s}
.iq-step.active .ic{border-color:var(--orange);animation:spin 1s linear infinite}
.iq-step.active .ic::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--orange)}
.iq-step.done .ic{border-color:#2FA85B;background:#2FA85B}
.iq-step.done .ic::after{content:"✓";color:#fff;font-size:10px;font-weight:800}
@keyframes spin{to{transform:rotate(360deg)}}
.iq-report{display:none}
.iq-report.on{display:block;animation:rise .5s cubic-bezier(.2,.7,.3,1)}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.iq-addr{font-size:12.5px;font-weight:700;color:var(--steel);margin-bottom:12px;display:flex;align-items:center;gap:6px}
.iq-addr svg{width:13px;height:13px;stroke:var(--steel);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.iq-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:12px}
.iq-stat{background:var(--mist);border-radius:10px;padding:12px 14px}
.iq-stat b{font-family:var(--font-display);font-weight:800;font-size:27px;color:var(--navy);line-height:1;display:block}
.iq-stat b span{font-size:inherit;font-family:inherit;font-weight:inherit;color:inherit}
.iq-stat b i{font-style:normal;color:var(--steel);font-size:16px}
.iq-stat span{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--steel)}
.iq-storm{display:flex;gap:9px;align-items:center;background:#F1F4F8;border-radius:10px;padding:11px 14px;font-size:13px;color:#3B4B61;margin-bottom:12px}
.iq-storm svg{width:17px;height:17px;stroke:#3B4B61;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.iq-storm b{color:#171303}
.iq-map{position:relative;height:200px;border-radius:10px;overflow:hidden;margin-bottom:12px;background:var(--navy-90)}
.iq-map-canvas{position:absolute;inset:0}
.iq-scanline{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent);animation:scan 2.2s ease-in-out infinite;z-index:3;pointer-events:none;transition:opacity .5s}
.iq-map.locked .iq-scanline{opacity:0}
@keyframes scan{0%,100%{top:8%}50%{top:88%}}
.iq-reticle{position:absolute;inset:18%;z-index:3;pointer-events:none;border-radius:10px;box-shadow:0 0 0 9999px rgba(9,17,28,.32)}
.iq-reticle i{position:absolute;width:24px;height:24px;border:3px solid #fff;filter:drop-shadow(1px 0 0 rgba(255,255,255,.9)) drop-shadow(-1px 0 0 rgba(255,255,255,.9)) drop-shadow(0 1px 0 rgba(255,255,255,.9)) drop-shadow(0 -1px 0 rgba(255,255,255,.9)) drop-shadow(0 2px 5px rgba(0,0,0,.45))}
.iq-map.locked .iq-reticle i{border-color:#3DDC68;transition:border-color .5s}
.iq-reticle .c1{top:0;left:0;border-right:0;border-bottom:0;border-radius:4px 0 0 0}
.iq-reticle .c2{top:0;right:0;border-left:0;border-bottom:0;border-radius:0 4px 0 0}
.iq-reticle .c3{bottom:0;left:0;border-right:0;border-top:0;border-radius:0 0 0 4px}
.iq-reticle .c4{bottom:0;right:0;border-left:0;border-top:0;border-radius:0 0 4px 0}
.iq-located{position:absolute;left:10px;bottom:10px;z-index:4;display:inline-flex;align-items:center;gap:6px;background:rgba(13,27,42,.85);backdrop-filter:blur(6px);color:#fff;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:7px 12px;border-radius:99px;opacity:0;transform:translateY(6px);transition:.4s}
.iq-located.on{opacity:1;transform:none}
.iq-located svg{width:12px;height:12px;stroke:#5ECB7B;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.iq-lock{position:relative;border:1.5px solid var(--line);background:var(--mist);border-radius:10px;padding:16px 14px 14px;text-align:center}
.iq-range{font-family:var(--font-display);font-weight:800;font-size:34px;color:var(--navy);line-height:1.05;display:block;margin:3px 0 2px}
.iq-monthly{font-size:13px;color:var(--steel);margin-bottom:4px}
.iq-monthly b{color:#1E9E4B;font-size:15px}
.iq-lock .lk-label{font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);margin-bottom:2px;display:flex;align-items:center;justify-content:center;gap:5px}
.lk-label svg{width:11px;height:11px;stroke:var(--steel);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.iq-lock .field{margin:11px 0 9px}
.iq-lock .btn{width:100%;padding:13px}
.iq-lock .fine{margin-top:8px}
.iq-final{display:none;text-align:center;padding:6px 0}
.iq-final.on{display:block;animation:rise .4s cubic-bezier(.2,.7,.3,1)}
.iq-final .lk-label{color:#2FA85B}
.iq-final b.range{font-family:var(--font-display);font-weight:800;font-size:34px;color:var(--navy);line-height:1.05;display:block;margin:4px 0 6px}
.iq-final p{font-size:12.5px;color:var(--steel)}
/* ============ QUOTE CARD — SMOKED GLASS v4 ============ */
.quote-card{position:relative;border-radius:22px;padding:30px 28px;
  background:linear-gradient(165deg,rgba(15,27,42,.44) 0%,rgba(9,18,30,.38) 55%,rgba(12,24,38,.46) 100%);
  backdrop-filter:blur(16px) saturate(165%) brightness(.92) contrast(1.06);
  -webkit-backdrop-filter:blur(16px) saturate(165%) brightness(.92) contrast(1.06);
  border:1px solid rgba(255,255,255,.26);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(255,255,255,.13),
    inset 0 0 0 1px rgba(255,255,255,.05),
    inset 0 -14px 28px -18px rgba(0,0,0,.32),
    inset 0 18px 32px -24px rgba(255,255,255,.18),
    0 2px 8px rgba(3,8,15,.22),
    0 44px 110px -30px rgba(3,8,15,.68);
}
/* real refraction: the pane warps the video (float-glass distortion) */
.glass-refract .quote-card{
  backdrop-filter:url(#glassDistort) blur(14px) saturate(165%) brightness(.92) contrast(1.06);
  -webkit-backdrop-filter:url(#glassDistort) blur(14px) saturate(165%) brightness(.92) contrast(1.06);
}
/* bright refracted rim — light concentrates at the pane's edge */
.quote-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:8px;pointer-events:none;
  backdrop-filter:blur(30px) brightness(1.45) saturate(200%);
  -webkit-backdrop-filter:blur(30px) brightness(1.45) saturate(200%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:.65}
/* surface: one specular streak + corner light + micro-grain */
.quote-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:
    radial-gradient(3px 3px at 8.5% 1.5%,rgba(255,255,255,.9),transparent 70%),
    radial-gradient(3px 3px at 91.5% 1.5%,rgba(255,255,255,.7),transparent 70%),
    radial-gradient(620px circle at 88% 112%,rgba(4,9,17,.16),transparent 60%),
    radial-gradient(380px circle at 16% -10%,rgba(255,255,255,.22),transparent 60%),
    linear-gradient(116deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.03) 26%,transparent 44%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E")}
.quote-card .rim{position:absolute;top:0;left:8%;right:8%;height:1.5px;border-radius:99px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.9) 30%,rgba(255,255,255,.9) 70%,transparent)}
.quote-card > *{position:relative;z-index:1}
/* ink flips to light — text printed on smoked glass */
.quote-card h3{color:#fff}
.quote-card .sub{color:#C4D1E0}
.quote-card .fine{color:#C7D4E2}
.quote-card .tool-badge{background:rgba(40,160,90,.22);color:#7BE3A4;box-shadow:inset 0 1px 0 rgba(255,255,255,.18);border:1px solid rgba(123,227,164,.25)}
.quote-card .tool-badge svg{stroke:#7BE3A4}
.quote-card .field input{background:rgba(255,255,255,.97);border-color:transparent}
.quote-card .iq-err{background:rgba(228,72,72,.18);color:#FFB4B4}
/* report internals on smoked glass */
.quote-card .iq-addr{color:#fff;font-size:13px}
.quote-card .iq-addr svg{stroke:#fff}
.quote-card .iq-stat{background:rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.quote-card .iq-stat b{color:#fff}
.quote-card .iq-stat b i{color:#DCE6F0}
.quote-card .iq-stat span{color:#E7EDF4}
.quote-card .iq-storm{background:rgba(255,255,255,.08);color:#C4D1E0}
.quote-card .iq-storm svg{stroke:#C4D1E0}
.quote-card .iq-storm b{color:#fff}
.quote-card .iq-lock{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16)}
.quote-card .iq-range{color:#fff}
.quote-card .iq-monthly{color:#C7D4E2}
.quote-card .lk-label{color:#DCE6F0}
.quote-card .lk-label svg{stroke:#9DB0C5}
.quote-card .iq-final b.range{color:#fff}
.quote-card .iq-final p{color:#C7D4E2}
.quote-card .iq-oob h3{color:#fff}
.quote-card .iq-oob p{color:#C4D1E0}
.quote-card .iq-back{color:#C7D4E2}
.quote-card .iq-back:hover{color:#fff}
.quote-card .iq-loading h3{color:#fff}
.quote-card .iq-step{color:#B9C8DA}
.quote-card .iq-step.active{color:#fff}
.quote-card .iq-step .ic{border-color:rgba(255,255,255,.25)}
@supports not (backdrop-filter:blur(1px)){
  .quote-card{background:rgba(13,22,34,.94)}
  .quote-card::before{display:none}
}

/* ===== RoofIQ — standalone product brand inside the card ===== */
.riq-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.riq-logo{display:flex;align-items:center;gap:9px}
.riq-logo svg{width:30px;height:30px;flex:none}
.riq-word{font-family:var(--font-display);font-weight:800;font-size:21px;letter-spacing:.04em;color:#fff;line-height:1}
.riq-word em{font-style:normal;color:#3DDC68}
.riq-word small{display:block;font-family:var(--font-body);font-size:8px;font-weight:800;letter-spacing:.3em;color:#B7C6D8;margin-top:2px}
.riq-secure{display:inline-flex;align-items:center;gap:6px;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#E7EDF4;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.28);padding:5px 11px;border-radius:7px;box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.riq-secure svg{width:11px;height:11px;flex:none}
.riq-sources{display:flex;gap:14px;justify-content:center;margin-top:12px;flex-wrap:wrap}
.riq-sources span{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#B7C6D8}
.riq-sources svg{width:11px;height:11px;stroke:#B7C6D8;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.riq-power{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.12);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#B7C6D8}
.riq-power svg{width:15px;height:15px;flex:none}
.riq-power b{color:#fff;letter-spacing:.06em}
.riq-power b em{font-style:normal;color:#3DDC68}



/* the triple price stack */
.iq-prices{margin:10px 0 4px;text-align:left}
.iq-price{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 2px;border-bottom:1px solid rgba(255,255,255,.12)}
.iq-price:last-child{border-bottom:0}
.iq-price .s{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#9DB0C5}
.iq-price .r{text-align:right}
.iq-price .r b{display:block;font-family:var(--font-display);font-weight:800;font-size:22px;color:#fff;line-height:1.05}
.iq-price .r i{font-style:normal;font-size:11px;font-weight:700;color:#7BE3A4}

/* louder card headline */
.quote-card .riq-h{font-size:27px;letter-spacing:.015em}
.quote-card .riq-h em{font-style:normal;color:#3DDC68}
/* trust chips */
.riq-trust{display:flex;gap:6px 16px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.riq-trust span{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:#C4D1E0}
.riq-trust svg{width:11px;height:11px;stroke:#3DDC68;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.riq-trust .star{color:#7BE3A4;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
/* services listed under the headline */
.riq-list{display:flex;gap:6px 18px;flex-wrap:wrap;margin:2px 0 16px}
.riq-list span{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:#fff}
.riq-list svg{width:13px;height:13px;stroke:#3DDC68;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
/* pricing stack: louder */
.iq-prices .iq-price .r b{font-size:26px}
.iq-prices .iq-price .s{color:#DCE6F0}
.iq-prices .iq-price .r i{font-size:12px}
.quote-card .iq-lock .lk-label{color:#DCE6F0;font-size:11px}

/* visual-audit polish */
.btn:focus-visible,.quote-card input:focus-visible{outline:3px solid rgba(61,220,104,.55);outline-offset:2px}
@media(max-width:480px){.quote-card{padding:24px 20px;border-radius:18px}}
.quote-card .field input{font-size:16px}
.riq-power svg,.riq-logo svg{filter:drop-shadow(0 1px 2px rgba(3,8,15,.4))}

/* confirmed-address state — matches the dropdown typography */
.iq-selected{display:none;align-items:center;gap:10px;width:100%;padding:11.5px 14px;border-radius:var(--radius-sm);cursor:text;
  background:#fff;border:1px solid rgba(61,220,104,.55);box-shadow:0 2px 10px rgba(3,8,15,.25),0 0 0 3px rgba(61,220,104,.18)}
.iq-selected.on{display:flex}
.iq-field.haspick input{display:none}
.iq-field.haspick > svg{display:none}
.iq-selected .selpin{width:17px;height:17px;flex:none}
.iq-selected .seltxt{flex:1;min-width:0;line-height:1.25}
.iq-selected b{display:block;font-size:15px;font-weight:700;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.iq-selected i{display:block;font-style:normal;font-size:12px;color:#5B6B80;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.iq-selected .selpen{width:16px;height:16px;flex:none;opacity:.8}
.iq-selected:hover .selpen path{stroke:var(--navy)}

.iq-maplogo{position:absolute;right:10px;bottom:10px;z-index:4;display:inline-flex;align-items:center;gap:6px;background:rgba(13,27,42,.85);backdrop-filter:blur(6px);color:#fff;font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.05em;padding:6px 11px;border-radius:99px;border:1px solid rgba(255,255,255,.16)}
.iq-maplogo em{font-style:normal;color:#3DDC68}
.iq-maplogo svg{width:15px;height:15px;flex:none}

.iq-stormpanel{background:rgba(255,255,255,.08);border-radius:10px;padding:12px 14px;margin-bottom:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.iq-stormpanel .sp-head{display:flex;align-items:center;gap:7px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#E7EDF4;margin-bottom:9px}
.iq-stormpanel .sp-head svg{width:13px;height:13px;stroke:#3DDC68;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.iq-stormpanel .sp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center}
.iq-stormpanel .sp-grid b{display:block;font-family:var(--font-display);font-weight:800;font-size:19px;color:#fff;line-height:1}
.iq-stormpanel .sp-grid span{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#C4D1E0}
.iq-stormpanel .sp-note{margin-top:9px;font-size:11px;font-weight:600;color:#CBD8E6;text-align:center}
@media(max-width:380px){.iq-stormpanel .sp-grid{grid-template-columns:repeat(2,1fr);gap:10px 8px}}

.iq-alt{width:100%;margin-top:9px;background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.25);padding:12px}
.iq-alt:hover{border-color:#fff;background:rgba(255,255,255,.12)}

/* marketing consent — optional, unchecked, TCPA-clean */
.iq-consent{display:flex;align-items:flex-start;gap:8px;text-align:left;margin:0 0 10px;cursor:pointer}
.iq-consent input{position:absolute;opacity:0;pointer-events:none}
.iq-consent .box{flex:none;width:17px;height:17px;border-radius:5px;border:1.5px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);display:grid;place-items:center;margin-top:1px;transition:.15s}
.iq-consent .box svg{width:12px;height:12px;stroke:#0A1622;stroke-width:3.4;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:.12s}
.iq-consent input:checked + .box{background:#3DDC68;border-color:#3DDC68}
.iq-consent input:checked + .box svg{opacity:1}
.iq-consent input:focus-visible + .box{outline:3px solid rgba(61,220,104,.45);outline-offset:2px}
.iq-consent .txt{font-size:9.8px;line-height:1.42;color:#AFBFD0}
.iq-consent .txt b{color:#fff;font-weight:700}

.btn[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none;transform:none}

/* phone verification states */
#iqPhoneWrap .pcheck{position:absolute;right:12px;top:50%;transform:translateY(-50%) scale(.6);opacity:0;transition:.18s;width:20px;height:20px;border-radius:50%;background:#3DDC68;display:grid;place-items:center;pointer-events:none}
#iqPhoneWrap .pcheck svg{width:12px;height:12px;stroke:#0A1622;stroke-width:3.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
#iqPhoneWrap.ok .pcheck{opacity:1;transform:translateY(-50%) scale(1)}
#iqPhoneWrap.ok input{border-color:#3DDC68;box-shadow:0 2px 10px rgba(3,8,15,.25),0 0 0 3px rgba(61,220,104,.2)}
#iqPhoneWrap.bad input{border-color:#E44848;box-shadow:0 2px 10px rgba(3,8,15,.25),0 0 0 3px rgba(228,72,72,.22)}

/* credentials strip — typographic, institutional */
.creds{background:var(--white);border-bottom:1px solid var(--line)}
.creds .container{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;padding-top:20px;padding-bottom:20px}
.creds span{font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);white-space:nowrap}
.creds i{width:4px;height:4px;border-radius:50%;background:#C9CFD8;flex:none}
@media(max-width:920px){
  .creds .container{gap:10px 16px;padding-top:16px;padding-bottom:16px}
  .creds span{font-size:10.5px;letter-spacing:.12em}
  .creds i{display:none}
}



/* THE PROMISE — risk reversal, calm authority */
.promise{background:var(--white);border-bottom:1px solid var(--line)}
.promise .container{max-width:860px;text-align:center;padding-top:64px;padding-bottom:64px}
.pr-kicker{font-size:12px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--steel);margin-bottom:14px}
.promise h2{color:var(--navy);font-size:clamp(34px,4.8vw,52px)}
.promise h2::after{content:"";display:block;width:56px;height:4px;background:var(--orange);margin:18px auto 0;border-radius:99px}
.promise p{margin:20px auto 0;max-width:640px;font-size:16.5px;color:var(--steel);line-height:1.65}
.pr-line{margin-top:26px;font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--navy)}
.m-only{display:none}
@media(max-width:920px){
  .promise .container{padding-top:48px;padding-bottom:48px}
  .m-only{display:block}
  .pr-line{font-size:10.5px;letter-spacing:.1em;line-height:2}
}


/* the seal */
/* blueprint grid — delete the 'bp' class on .promise to return to pure white */
.promise.bp{background:
  repeating-linear-gradient(0deg,rgba(10,22,34,.045) 0 1px,transparent 1px 28px),
  repeating-linear-gradient(90deg,rgba(10,22,34,.045) 0 1px,transparent 1px 28px),
  repeating-linear-gradient(0deg,rgba(10,22,34,.06) 0 1px,transparent 1px 140px),
  repeating-linear-gradient(90deg,rgba(10,22,34,.06) 0 1px,transparent 1px 140px),
  var(--white)}

/* ============ DOMINANCE — canonical ============ */
.dom{position:relative;background:linear-gradient(175deg,var(--navy) 0%,#0D1F33 100%);overflow:hidden}
.dom-bg{position:absolute;inset:0;background:url('/assets/photos/bg-storm-clouds-01.jpg') center/cover no-repeat;opacity:.4;filter:contrast(1.18) brightness(.88) saturate(.8);
  -webkit-mask:linear-gradient(180deg,transparent 0%,#000 18%,#000 88%,transparent 100%);
  mask:linear-gradient(180deg,transparent 0%,#000 18%,#000 88%,transparent 100%)}
.dom .container{position:relative}
.dom .container{padding-top:78px;padding-bottom:78px}
.dom-head{max-width:720px;margin-bottom:54px}
.dom-head .kicker{color:#8FA2B8}
.dom-head h2{color:#fff;font-size:clamp(34px,4.8vw,54px)}
.dom-head p{margin-top:14px;font-size:16.5px;color:#9DB0C5}
.dom-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:36px}
.dom .num{text-align:left;padding-top:18px;border-top:2px solid var(--orange)}
.dom .num b{font-family:var(--font-display);font-weight:800;font-size:clamp(58px,6.2vw,94px);line-height:.92;display:block;color:#fff;letter-spacing:.005em;white-space:nowrap}
.dom .num b i{font-style:normal;color:var(--orange);font-size:.5em;vertical-align:.22em}
.dom .num > span{display:block;margin-top:10px;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#8FA2B8}
.dom .num b span{display:inline;font:inherit;color:inherit;letter-spacing:inherit;text-transform:none;margin:0}
@media(max-width:920px){
  .dom .container{padding-top:56px;padding-bottom:56px}
  .dom-head{margin-bottom:38px}
  .dom-grid{grid-template-columns:1fr 1fr;gap:32px 22px}
  .dom .num b{font-size:clamp(46px,12vw,64px)}
}


/* RoofIQ lockup in the showcase header — same mark as the card */
.riq-lockup{display:inline-flex;align-items:center;gap:11px;margin-bottom:18px}
.riq-lockup svg{width:34px;height:34px;flex:none}
.riq-lockup .riq-word{font-family:var(--font-display);font-weight:800;font-size:24px;letter-spacing:.04em;color:#fff;line-height:1}
.riq-lockup .riq-word em{font-style:normal;color:#3DDC68}
.riq-lockup .riq-word small{display:block;font-family:var(--font-body);font-size:8.5px;font-weight:800;letter-spacing:.3em;color:#8FA2B8;margin-top:3px}

@keyframes iqPulse{0%{box-shadow:0 44px 110px -30px rgba(3,8,15,.68),0 0 0 0 rgba(61,220,104,.55)}100%{box-shadow:0 44px 110px -30px rgba(3,8,15,.68),0 0 0 22px rgba(61,220,104,0)}}
.quote-card.pulse{animation:iqPulse 1.1s ease-out 2}

/* RoofIQ-green CTA — this section is RoofIQ's turf */
.btn-riq{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:800;font-size:16px;letter-spacing:.02em;padding:16px 34px;border-radius:var(--radius-sm);text-decoration:none;cursor:pointer;transition:.18s;font-family:var(--font-body);background:#3DDC68;color:#06231A;box-shadow:0 10px 30px -10px rgba(61,220,104,.5)}
.btn-riq:hover{background:#34c95d;transform:translateY(-1px);box-shadow:0 14px 36px -10px rgba(61,220,104,.6)}
.showcase .step .n{color:#3DDC68}
.showcase .kill p b{color:#3DDC68}

.design-art{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}
.design-art svg{width:100%;height:auto;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:30px;box-shadow:var(--shadow)}
@media(max-width:920px){.design-art{margin-top:8px}}

.storm-teaser{text-align:center;max-width:680px;margin:0 auto}
.storm-teaser .kicker{justify-content:center}
.storm-teaser h2{color:var(--navy)}
.storm-teaser p{color:var(--steel);font-size:16.5px;margin:16px auto 26px;max-width:560px}

/* WINDOW CALCULATOR — compact tile grid */
.wc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
.wc-tile{background:var(--white);border:1.5px solid var(--line);border-radius:14px;padding:14px 10px 12px;cursor:pointer;text-align:center;transition:.18s cubic-bezier(.2,.7,.3,1);position:relative;overflow:hidden}
.wc-tile:hover{border-color:#C3CAD4;box-shadow:0 12px 28px -16px rgba(10,22,34,.28);transform:translateY(-2px)}
.wc-tile.on{border-color:var(--navy);box-shadow:0 0 0 3px rgba(10,22,34,.07),0 14px 34px -18px rgba(10,22,34,.3)}
.wc-tile svg{width:100%;height:64px;display:block;margin:0 auto 8px}
.wc-tile .wc-n{font-size:12px;font-weight:800;color:var(--navy);line-height:1.15;display:block}
.wc-tile .wc-p{font-size:10.5px;color:var(--steel);display:block;margin-top:1px}
.wc-qbadge{position:absolute;top:9px;right:9px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:var(--navy);color:#fff;font-size:11px;font-weight:800;display:none;align-items:center;justify-content:center;line-height:1}
.wc-tile.on .wc-qbadge{display:inline-flex}
.wc-step{display:flex;align-items:center;justify-content:center;gap:0;margin-top:9px;border:1.5px solid var(--line);border-radius:8px;overflow:hidden}
.wc-step button{flex:1;height:30px;border:0;background:var(--mist);color:var(--navy);font-size:17px;font-weight:700;cursor:pointer;transition:.12s;line-height:1}
.wc-step button:hover{background:#E8ECF1}
.wc-step input{width:34px;height:30px;border:0;border-left:1.5px solid var(--line);border-right:1.5px solid var(--line);text-align:center;font:inherit;font-weight:800;font-size:14px;color:var(--navy);-moz-appearance:textfield;appearance:textfield}
.wc-step input::-webkit-outer-spin-button,.wc-step input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
/* window icons — token-driven like the technical catalog */
.wc-tile{--wframe:#2A3645;--wglass:#C2CCD8;--waccent:#FFC93D}
.wc-tile.on{--wframe:var(--navy);--wglass:#9DB0C5;--waccent:var(--orange)}
.wc-icv{stroke:var(--wframe);stroke-width:2.6;fill:none;stroke-linejoin:miter;stroke-linecap:square;transition:stroke .2s}
.wc-icv2{stroke:var(--wframe);stroke-width:1.7;fill:none;transition:stroke .2s}
.wc-icg{stroke:var(--wglass);stroke-width:1.7;fill:none;stroke-linecap:round;transition:stroke .2s}
.wc-ich{fill:var(--waccent);stroke:none;transition:fill .2s}
.wc-bar{position:relative;background:linear-gradient(155deg,#0C1A2B 0%,#0F2236 55%,#13294180 100%),var(--navy);border-radius:20px;padding:30px 30px 22px;box-shadow:0 30px 70px -28px rgba(5,12,20,.6);overflow:hidden;border:1px solid rgba(255,255,255,.06)}
.wc-bar-glow{position:absolute;top:-60px;right:-40px;width:340px;height:240px;background:radial-gradient(closest-side,rgba(255,201,61,.16),transparent);opacity:0;transition:.5s;pointer-events:none}
.wc-bar.live .wc-bar-glow{opacity:1}
.wc-bar::after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--orange),transparent);opacity:0;transition:.4s}
.wc-bar.live::after{opacity:1}
.wc-bar-inner{position:relative;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.wc-left{flex:none}
.wc-count{display:flex;align-items:center;gap:12px}
.wc-count b{font-family:var(--font-display);font-weight:800;font-size:64px;color:#fff;line-height:.85;display:block;min-width:54px;text-align:center;transition:color .3s}
.wc-bar:not(.live) .wc-count b{color:#33485F}
.wc-count span{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8FA2B8;line-height:1.3}
/* windows zone: intro + calculator share one mist block, connected */
.wc-sec{padding-top:20px;background:var(--mist)}
.win-intro{padding-bottom:6px;background:var(--mist)}
.wc-sec{padding-top:18px}
.baths-sec{background:#fff;border-top:1px solid var(--line)}
.ba-mark{display:flex;align-items:center;justify-content:center;width:118px;height:84px;background:rgba(61,220,104,.06);border:1px solid rgba(61,220,104,.18);border-radius:14px}
.ba-mark svg{width:80px;height:64px;display:block}
@media(max-width:760px){.ba-mark{width:100%;height:72px}}
.wc-mid{flex:1;min-width:200px;padding-left:28px;border-left:1px solid rgba(141,160,185,.2)}
.wc-mid-label{display:block;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#8FA2B8;margin-bottom:5px}
.wc-rangebig{display:block;font-family:var(--font-display);font-weight:800;font-size:clamp(34px,4vw,50px);line-height:1;color:#fff;transition:color .3s}
.wc-bar:not(.live) .wc-rangebig{font-size:26px;color:#5B7088}
.wc-bar.live .wc-rangebig{color:var(--orange)}
.wc-mid-sub{display:block;margin-top:6px;font-size:13px;font-weight:700;color:#9DB0C5;min-height:18px}
.wc-mid-sub b{color:#7BE3A4}
.wc-cta{flex:none;background:var(--orange);color:#1A1503;font-weight:800;letter-spacing:.03em;padding:16px 30px;font-size:15.5px;box-shadow:0 12px 30px -10px rgba(255,201,61,.5);transition:.18s}
.wc-cta:hover{background:var(--orange-dark);transform:translateY(-1px)}
.wc-bar:not(.live) .wc-cta{opacity:.45;pointer-events:none;box-shadow:none}
.wc-cta-arrow::after{content:"→";margin-left:6px;display:inline-block;transition:transform .2s}
.wc-cta:hover .wc-cta-arrow::after{transform:translateX(3px)}
.wc-fine{position:relative;margin-top:16px;font-size:12px;color:#7E92A8;line-height:1.5}
@media(max-width:920px){
  .wc-bar-inner{gap:18px}
  .wc-mid{width:100%;padding-left:0;border-left:0;border-top:1px solid rgba(141,160,185,.2);padding-top:16px}
  .wc-cta{width:100%;justify-content:center}
}
@media(max-width:920px){
  .wc-grid{grid-template-columns:1fr 1fr 1fr;gap:10px}
  .wc-range{margin-left:0;text-align:left;width:100%}
  .wc-bar .btn{width:100%}
}
@media(max-width:480px){.wc-grid{grid-template-columns:1fr 1fr}}

/* ===== WINDOW CALCULATOR — billion-dollar pass ===== */
.wc-sec{position:relative;background:linear-gradient(180deg,var(--white) 0%,var(--mist) 100%);overflow:hidden}
.wc-sec::before{content:"";position:absolute;top:-120px;left:50%;transform:translateX(-50%);width:900px;height:300px;background:radial-gradient(closest-side,rgba(10,22,34,.05),transparent);pointer-events:none}
.wc-sec .container{position:relative}
.wc-tile{background:var(--white)}
.wc-tile::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.6),transparent 40%);opacity:0;transition:.2s}
.wc-tile:hover::after{opacity:1}
.wc-tile.on{animation:wcPop .28s cubic-bezier(.2,.9,.3,1.2)}
@keyframes wcPop{0%{transform:scale(.97)}60%{transform:scale(1.02)}100%{transform:scale(1)}}
.wc-tile svg{transition:transform .25s cubic-bezier(.2,.7,.3,1)}
.wc-tile:hover svg{transform:translateY(-2px) scale(1.04)}
.wc-qbadge{box-shadow:0 4px 10px -3px rgba(10,22,34,.5);animation:wcBadge .25s cubic-bezier(.2,.9,.3,1.3)}
@keyframes wcBadge{0%{transform:scale(0)}100%{transform:scale(1)}}
/* premium result bar */
.wc-bar{position:relative;overflow:hidden}
.wc-bar::before{content:"";position:absolute;inset:0;background:
  radial-gradient(500px 200px at 88% -40px,rgba(255,201,61,.10),transparent 60%);opacity:0;transition:.4s;pointer-events:none}
.wc-bar.live::before{opacity:1}
.wc-bar::after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--orange),transparent);opacity:0;transition:.4s}
.wc-bar.live::after{opacity:1}
.wc-bar-inner{position:relative}
.wc-count b{transition:transform .2s}
.wc-bar.live .wc-count b{animation:wcCount .3s cubic-bezier(.2,.9,.3,1.2)}
@keyframes wcCount{0%{transform:scale(1)}50%{transform:scale(1.12)}100%{transform:scale(1)}}
.wc-bar .btn{transition:.18s}
.wc-bar:not(.live) .btn{opacity:.5;pointer-events:none}
.wc-cta-arrow::after{content:"→";margin-left:6px;transition:transform .2s}
.wc-bar .btn:hover .wc-cta-arrow::after{transform:translateX(3px)}

/* window calc — text-me capture (mirrors RoofIQ) */
.wc-capture{display:none;position:relative;margin-top:20px;padding-top:20px;border-top:1px solid rgba(141,160,185,.2)}
.wc-capture.on{display:block;animation:rise .4s cubic-bezier(.2,.7,.3,1)}
.wc-cap-fields{display:flex;gap:10px;flex-wrap:wrap}
.wc-phonewrap{flex:1;min-width:200px;margin-bottom:0}
.wc-phonewrap input{background:#fff;border:1px solid transparent;color:var(--ink);box-shadow:0 2px 10px rgba(3,8,15,.25);padding:14px 15px 14px 44px;border-radius:var(--radius-sm);width:100%;font:inherit;font-size:16px}
.wc-phonewrap input:focus{outline:none;border-color:#3DDC68;box-shadow:0 2px 10px rgba(3,8,15,.25),0 0 0 3px rgba(61,220,104,.25)}
.wc-phonewrap .pcheck{position:absolute;right:12px;top:50%;transform:translateY(-50%) scale(.6);opacity:0;transition:.18s;width:20px;height:20px;border-radius:50%;background:#3DDC68;display:grid;place-items:center;pointer-events:none}
.wc-phonewrap .pcheck svg{width:12px;height:12px;stroke:#0A1622;stroke-width:3.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.wc-phonewrap.ok .pcheck{opacity:1;transform:translateY(-50%) scale(1)}
.wc-phonewrap.ok input{border-color:#3DDC68;box-shadow:0 2px 10px rgba(3,8,15,.25),0 0 0 3px rgba(61,220,104,.2)}
.wc-phonewrap.bad input{border-color:#E44848;box-shadow:0 2px 10px rgba(3,8,15,.25),0 0 0 3px rgba(228,72,72,.22)}
.wc-send{flex:none;background:var(--orange);color:#1A1503;font-weight:800;padding:14px 26px}
.wc-send:hover{background:var(--orange-dark)}
.wc-send[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none}
.wc-consent{margin:0 0 13px}
.wc-consent .txt{font-size:9.8px;line-height:1.42;color:#9DB0C5}
.wc-consent .box{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.08)}
.wc-consent input:checked + .box{background:#3DDC68;border-color:#3DDC68}
.wc-consent input:checked + .box svg{opacity:1}
.wc-consent .box svg{stroke:#0A1622}
.wc-sent{display:none;align-items:center;gap:11px;margin-top:14px;padding:14px 16px;background:rgba(61,220,104,.12);border:1px solid rgba(61,220,104,.4);border-radius:10px;color:#CDEBD8;font-size:13.5px;line-height:1.4}
.wc-sent.on{display:flex;animation:rise .4s cubic-bezier(.2,.7,.3,1)}
.wc-sent b{color:#fff}
.wc-sent svg{width:20px;height:20px;flex:none;stroke:#3DDC68;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* ===== STORM INTELLIGENCE ===== */
.storm-sec{position:relative;background:linear-gradient(168deg,#0A1622 0%,#0E2034 70%,#0C2A22 130%);overflow:hidden;padding-top:78px;padding-bottom:78px}
.storm-bg{position:absolute;inset:0;pointer-events:none;opacity:.6;background:
  radial-gradient(620px 320px at 84% 8%,rgba(61,220,104,.10),transparent 62%),
  repeating-linear-gradient(0deg,rgba(141,160,185,.05) 0 1px,transparent 1px 52px),
  repeating-linear-gradient(90deg,rgba(141,160,185,.05) 0 1px,transparent 1px 52px)}
.storm-sec .container{position:relative}
.storm-head{max-width:680px;margin-bottom:42px}
.storm-head h2{color:#fff;font-size:clamp(32px,4.4vw,50px)}
.storm-head p{margin-top:14px;font-size:16px;color:#9DB0C5;line-height:1.6}
/* stats row */
.storm-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:40px}
.storm-stats .ss{padding-top:16px;border-top:2px solid var(--orange)}
.storm-stats .ss b{font-family:var(--font-display);font-weight:800;font-size:clamp(34px,4vw,52px);color:#fff;line-height:1;display:block}
.storm-stats .ss b i{font-style:normal;color:var(--orange);font-size:.5em;vertical-align:.2em}
.storm-stats .ss span{display:block;margin-top:8px;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#8FA2B8}
/* live feed table */
.storm-feed{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;backdrop-filter:blur(6px)}
.sf-head{display:flex;align-items:center;justify-content:space-between;padding:15px 22px;border-bottom:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03)}
.sf-live{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.sf-live i{width:8px;height:8px;border-radius:50%;background:#3DDC68;box-shadow:0 0 0 0 rgba(61,220,104,.6);animation:sfPulse 2s infinite}
@keyframes sfPulse{0%{box-shadow:0 0 0 0 rgba(61,220,104,.5)}70%{box-shadow:0 0 0 7px rgba(61,220,104,0)}100%{box-shadow:0 0 0 0 rgba(61,220,104,0)}}
.sf-cols{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#6F84A0}
.sf-rows{max-height:340px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(141,160,185,.3) transparent}
.sf-rows::-webkit-scrollbar{width:6px}
.sf-rows::-webkit-scrollbar-thumb{background:rgba(141,160,185,.3);border-radius:3px}
.sf-row{display:grid;grid-template-columns:96px 1fr auto auto;align-items:center;gap:14px;padding:13px 22px;border-bottom:1px solid rgba(255,255,255,.06);transition:background .15s}
.sf-row:hover{background:rgba(255,255,255,.04)}
.sf-row:last-child{border-bottom:0}
.sf-date{font-size:12.5px;font-weight:700;color:#C4D1E0}
.sf-loc{font-size:13.5px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-type{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:4px 9px;border-radius:99px}
.sf-type.hail{background:rgba(96,165,250,.16);color:#93C5FD}
.sf-type.wind{background:rgba(251,191,36,.16);color:#FCD34D}
.sf-size{font-family:var(--font-display);font-weight:800;font-size:15px;color:#fff;min-width:62px;text-align:right}
.sf-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;border-top:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);flex-wrap:wrap}
.sf-foot span{font-size:12px;color:#8FA2B8}
@media(max-width:920px){
  .storm-stats{grid-template-columns:1fr 1fr;gap:26px 18px}
  .sf-cols{display:none}
  .sf-row{grid-template-columns:74px 1fr auto;gap:10px;padding:12px 16px}
  .sf-type{display:none}
  .sf-head,.sf-foot{padding-left:16px;padding-right:16px}
  .sf-foot .btn{width:100%}
}

.baths{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.baths-art{background:linear-gradient(160deg,#13283F,#0A1622);border-radius:18px;padding:38px;text-align:center;box-shadow:var(--shadow-lg)}
.baths-art > svg{width:96px;height:auto;margin-bottom:22px}
.baths-art .cf{stroke:#fff;stroke-width:4;fill:none}
.baths-art .cf2{stroke:#9DB0C5;stroke-width:1.7;fill:none}
.baths-art .chf{fill:var(--orange);stroke:none}
.baths-range{border-top:1px solid rgba(255,255,255,.14);padding-top:22px}
.br-label{display:block;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#8FA2B8;margin-bottom:8px}
.br-num{font-family:var(--font-display);font-weight:800;font-size:clamp(34px,4.4vw,46px);color:#fff;line-height:1;display:block}
.br-num i{font-style:normal;color:var(--orange);margin:0 4px}
.br-sub{display:block;margin-top:12px;font-size:12.5px;color:#9DB0C5;line-height:1.5}
.baths-copy h2{color:var(--navy)}
.baths-copy p{margin-top:14px;color:var(--steel);font-size:16px;line-height:1.6}
.baths-copy .btn{margin-top:22px}
@media(max-width:920px){.baths{grid-template-columns:1fr;gap:24px}.baths-art{padding:30px}}

/* ===== SERVICE AREAS — clickable map filters City,WI wall ===== */
.areas-sec{background:var(--mist);border-top:1px solid var(--line);padding-top:72px;padding-bottom:72px}

/* map */





/* DESKTOP: map fixed-small in right column, top-aligned, no overlap */
.areas-split{display:flex;flex-direction:column;align-items:center;gap:30px;margin-top:8px}
.area-map-wrap{order:-1;width:100%;max-width:460px;margin:0 auto;position:relative}
.area-map{width:100%;max-width:460px;height:auto;display:block;margin:0 auto;filter:drop-shadow(0 16px 28px rgba(13,27,42,.13))}
.areas{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 18px;text-align:left;width:100%}
.area-map{-webkit-tap-highlight-color:transparent}
.area-map .cty{-webkit-tap-highlight-color:transparent;outline:none;-webkit-user-select:none;user-select:none}
.area-map .cty:focus,.area-map .cty:focus-visible{outline:none}
.area-map .cty{fill:#fff;stroke:#C6D0DC;stroke-width:1;transition:fill .15s,stroke .15s;cursor:pointer}
.area-map .cty:hover{fill:#DCE6F0}
.area-map .cty.active{fill:var(--navy);stroke:var(--navy)}
.area-map.has-active .cty:not(.active){fill:#EAEFF4;stroke:#D4DCE6}
.area-map .cty-lbl{font-family:var(--font-body);font-size:8.5px;font-weight:700;fill:#7A8AA0;text-anchor:middle;pointer-events:none;transition:fill .15s}
.area-map .cty-lbl.active{fill:#fff}
.area-map-cap{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:14px;font-size:12px;font-weight:600;color:var(--steel)}
.amc-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);flex:none}
/* right column */
.areas-right{width:100%;min-width:0}
.areas-bar{display:flex;align-items:center;gap:14px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.areas-now{font-family:var(--font-display);font-size:22px;font-weight:800;text-transform:uppercase;letter-spacing:.02em;color:var(--navy);line-height:1}
.areas-reset{background:none;border:0;color:var(--orange);font:inherit;font-size:13.5px;font-weight:700;cursor:pointer;padding:0}
.areas-reset:hover{text-decoration:underline}
/* list */

.ar a{display:block;font-size:15px;font-weight:800;color:var(--navy);text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:3px;text-decoration-thickness:2px;transition:.13s}
.ar a:hover{color:var(--orange)}
.ar span{display:block;font-size:11px;color:#93A3B7;font-weight:600;margin-top:2px}
.ar.hide{display:none}
.ar.is-hidden{display:none}
.area-more{display:inline-flex;align-items:center;gap:9px;background:none;border:0;cursor:pointer;font-family:var(--font-body);font-size:15px;font-weight:800;letter-spacing:.01em;color:var(--navy);padding:12px 20px;border-radius:99px;transition:.18s}
.area-more span{position:relative}
.area-more span::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2.5px;background:var(--orange);border-radius:2px;transform:scaleX(0);transform-origin:center;transition:transform .2s}
.area-more:hover{background:rgba(255,201,61,.10)}
.area-more:hover span::after{transform:scaleX(1)}
.area-more svg{width:17px;height:17px;stroke:var(--orange);stroke-width:2.6;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.area-more.open svg{transform:rotate(180deg)}
.areas-foot{text-align:center;margin-top:42px}
@media(max-width:900px){.area-map-wrap{max-width:340px}.area-map{max-width:340px}.areas{grid-template-columns:repeat(3,1fr)}}
@media(max-width:540px){
  .areas{grid-template-columns:1fr 1fr;gap:18px 12px}
  .areas-foot .btn{width:100%}
}

@media(max-width:980px){
  
  
  
}
@media(max-width:560px){.areas-foot .btn{width:100%}.areas-now{font-size:18px}}