/* =============================================================
   PlumberHQ — design system
   Palette sampled from the real brand assets: navy van body,
   #038BD9 logotype blue. Orange is reserved for ACTIONS only.

   Everything is driven by the tokens in :root. Change a token,
   not a component, when you want to resize or recolour.
   ============================================================= */

:root{
  --f-display:"Barlow Semi Condensed","Arial Narrow",system-ui,sans-serif;
  --f-body:"Public Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  /* type scale */
  --t-xs:.75rem;      /* 12px  micro labels */
  --t-sm:.8125rem;    /* 13px  captions, meta */
  --t-base:.9375rem;  /* 15px  card body */
  --t-md:1rem;        /* 16px  body copy */
  --t-lg:1.0625rem;   /* 17px  lead-in */
  --t-xl:1.1875rem;   /* 19px  card headings */
  --t-2xl:1.4375rem;  /* 23px  sub headings */
  --t-3xl:clamp(1.55rem,2.9vw,2.15rem);
  --t-4xl:clamp(2rem,4.1vw,3.15rem);
  --t-hero:clamp(2.2rem,4.4vw,3.4rem);

  /* spacing scale */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:22px;
  --sp-6:30px; --sp-7:44px; --sp-8:64px;
  --sec-pad:clamp(48px,6vw,84px);
  --card-pad:22px;

  /* brand */
  --navy:#0E1F33; --navy-2:#16304E; --navy-deep:#081521;
  --blue:#038BD9; --blue-2:#3AAEEE; --blue-dim:rgba(3,139,217,.12);
  --orange:#FF6A2C; --orange-600:#F2551A;
  --good:#35C46E;
  --inv-bg:#0E1F33; --inv-ink:#E9F2FA; --inv-muted:#9BB3CC; --inv-border:rgba(255,255,255,.14);

  /* light theme */
  --ground:#F4F8FC; --surface:#FFFFFF; --surface-2:#E9F1F8;
  --border:#D5E3F0; --ink:#0E1F33; --ink-2:#33475E; --muted:#5A7186;

  --shadow-sm:0 1px 2px rgba(8,21,33,.06),0 2px 6px rgba(8,21,33,.06);
  --shadow-md:0 6px 20px rgba(8,21,33,.10);
  --shadow-lg:0 20px 50px rgba(8,21,33,.20);

  --r:12px; --r-sm:9px; --maxw:1200px; --gutter:clamp(16px,3.5vw,36px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#071320; --surface:#0D1E2F; --surface-2:#122739;
    --border:#1E3950; --ink:#E9F2FA; --ink-2:#BFD3E5; --muted:#87A1B8;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 8px 24px rgba(0,0,0,.5); --shadow-lg:0 24px 60px rgba(0,0,0,.62);
  }
}
:root[data-theme="dark"]{
  --ground:#071320; --surface:#0D1E2F; --surface-2:#122739;
  --border:#1E3950; --ink:#E9F2FA; --ink-2:#BFD3E5; --muted:#87A1B8;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 8px 24px rgba(0,0,0,.5); --shadow-lg:0 24px 60px rgba(0,0,0,.62);
}

/* ---------------- base ---------------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:120px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.001ms!important;transition-duration:.001ms!important}}
body{margin:0;font-family:var(--f-body);font-size:var(--t-md);background:var(--ground);color:var(--ink);
  line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4,h5{font-family:var(--f-display);line-height:1.08;text-wrap:balance;margin:0;font-weight:800;letter-spacing:-.015em}
p{margin:0}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
img{max-width:100%;display:block}
button{font:inherit;color:inherit}
.tabnum{font-variant-numeric:tabular-nums}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.wrap.narrow{max-width:740px}
.center{text-align:center}
/* grid children must be allowed to shrink below their content width */
.hero-grid>*,.book-grid>*,.split-grid>*,.two-col>*,.map-layout>*,.ph-grid>*,.svc-grid>*,
.guar>*,.steps>*,.rev-grid>*,.post-grid>*,.loc-grid>*,.quickcards .wrap>*{min-width:0}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--orange);color:#fff;padding:10px 18px;border-radius:0 0 8px 0;font-weight:700}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.ico{width:1.15em;height:1.15em;flex:none;display:inline-block;vertical-align:-.19em}
.ph{display:block;position:relative;overflow:hidden}
.ph img{width:100%;height:100%;object-fit:cover;display:block;background-image:var(--lqip);background-size:cover;background-position:center}

/* ---------------- type helpers ---------------- */
.eyebrow{display:inline-flex;align-items:center;gap:var(--sp-2);font-family:var(--f-display);text-transform:uppercase;
  letter-spacing:.15em;font-weight:700;font-size:var(--t-xs);color:var(--blue)}
.eyebrow .ico{color:var(--blue);width:1.25em;height:1.25em}
.section{padding-block:var(--sec-pad)}
.band-surface{background:var(--surface);border-block:1px solid var(--border)}
.section-head{max-width:640px;margin-bottom:var(--sp-6)}
.section-head.center{margin-inline:auto;text-align:center}
.section-head h2{font-size:var(--t-3xl);margin-top:var(--sp-2)}
.section-head p{color:var(--muted);font-size:var(--t-lg);margin-top:var(--sp-3)}
.lead{color:var(--muted);font-size:var(--t-lg);margin-top:var(--sp-3);max-width:60ch}
.accent{color:var(--orange)}

/* ---------------- buttons ---------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--f-display);font-weight:700;
  font-size:.9rem;text-transform:uppercase;letter-spacing:.045em;
  padding:.78em 1.25em;border-radius:var(--r-sm);border:2px solid transparent;cursor:pointer;white-space:nowrap;
  transition:transform .15s,background .15s,box-shadow .15s,border-color .15s}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-sm{font-size:var(--t-sm);padding:.62em 1em}
.btn-lg{font-size:1rem;padding:.9em 1.5em}
.btn-block{width:100%}
.btn-call{background:var(--orange);color:#fff;box-shadow:0 4px 14px rgba(255,106,44,.32)}
.btn-call:hover{background:var(--orange-600)}
.btn-quote{background:var(--blue);color:#fff}
.btn-quote:hover{background:#0277BD}
.btn-solid{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn-solid:hover{background:var(--navy-2)}
.btn-ghost{background:rgba(255,255,255,.07);border-color:var(--inv-border);color:var(--inv-ink)}
.btn-ghost:hover{background:rgba(255,255,255,.15)}
.btn-outline{background:transparent;border-color:var(--border);color:var(--ink)}
.btn-outline:hover{border-color:var(--blue);color:var(--blue)}
.pulse{position:relative}
.pulse::after{content:"";position:absolute;inset:-2px;border-radius:inherit;border:2px solid var(--orange);opacity:0;animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.12)}}

/* ---------------- topbar ---------------- */
.topbar{background:#050D16;color:var(--inv-muted);font-size:var(--t-sm)}
.topbar .wrap{display:flex;align-items:center;gap:var(--sp-2) var(--sp-5);min-height:38px;flex-wrap:wrap}
.tb-badge{display:inline-flex;align-items:center;gap:6px}
.tb-badge .ico{color:var(--blue-2)}
.tb-links{margin-left:auto;display:flex;gap:var(--sp-5)}
.tb-links a{font-weight:600;transition:color .15s}
.tb-links a:hover{color:var(--blue-2)}

/* ---------------- header ---------------- */
header.site{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--navy) 95%,transparent);
  backdrop-filter:saturate(150%) blur(12px);border-bottom:1px solid rgba(255,255,255,.1)}
.nav{display:flex;align-items:center;gap:var(--sp-3);min-height:66px}
.brand{display:flex;align-items:center;gap:var(--sp-2);flex:none}
.brand-mark{width:38px;height:38px;flex:none;display:block;border-radius:10px;
  box-shadow:0 3px 10px rgba(3,139,217,.35);transition:transform .18s ease}
.brand-mark .mark{width:100%;height:100%;display:block}
.brand:hover .brand-mark{transform:translateY(-1px) scale(1.03)}
.brand-lg .brand-mark{width:44px;height:44px}
.brand-word{font-family:var(--f-display);font-weight:800;font-size:1.3rem;letter-spacing:.01em;color:#fff}
.brand-word .hq{color:var(--blue-2)}
.brand-lg .brand-word{font-size:1.45rem}
.nav-main{display:flex;align-items:center;gap:1px;margin-left:var(--sp-3)}
.navlink{display:inline-flex;align-items:center;gap:5px;background:none;border:0;cursor:pointer;padding:8px 10px;border-radius:8px;
  font-family:var(--f-display);font-weight:700;font-size:.95rem;color:rgba(233,242,250,.9);transition:.15s;white-space:nowrap}
.navlink .ico{color:var(--blue-2);width:1.05em;height:1.05em}
.navlink .chev{width:.8em;height:.8em;color:rgba(233,242,250,.5);transition:transform .2s}
.navlink:hover,.navitem:hover .navlink,.navitem.open .navlink{background:rgba(255,255,255,.11);color:#fff}
.navitem:hover .chev,.navitem.open .chev{transform:rotate(180deg)}
.navlink.is-active{color:var(--blue-2)}
.nav-actions{margin-left:auto;display:flex;align-items:center;gap:var(--sp-2)}
.nav-phone{display:flex;flex-direction:column;line-height:1.15;text-align:right}
.np-lbl{font-family:var(--f-display);font-size:.68rem;text-transform:uppercase;letter-spacing:.13em;color:var(--blue-2);font-weight:700}
.np-num{font-family:var(--f-display);font-weight:800;font-size:1.12rem;color:#fff;white-space:nowrap}
.nav-phone:hover .np-num{color:var(--orange)}
.iconbtn{width:38px;height:38px;display:grid;place-items:center;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);border-radius:9px;cursor:pointer;color:var(--inv-ink)}
.iconbtn .ico{width:19px;height:19px}
.iconbtn:hover{border-color:var(--blue-2);color:var(--blue-2);background:rgba(255,255,255,.12)}
.menu-btn{display:none}
.theme-btn .moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .theme-btn .moon{display:block}:root:not([data-theme="light"]) .theme-btn .sun{display:none}}
:root[data-theme="dark"] .theme-btn .moon{display:block}
:root[data-theme="dark"] .theme-btn .sun{display:none}
:root[data-theme="light"] .theme-btn .moon{display:none}
:root[data-theme="light"] .theme-btn .sun{display:block}

/* ---------------- mega menu ---------------- */
.navitem{position:static}
.mega{position:absolute;left:0;right:0;top:100%;background:var(--surface);border-top:1px solid var(--border);
  box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.18s;z-index:55}
.navitem:hover>.mega,.navitem:focus-within>.mega,.navitem.open>.mega{opacity:1;visibility:visible;transform:none}
/* identity rail | 3-column link grid | featured card — same for every menu */
.mega-inner{max-width:var(--maxw);margin-inline:auto;padding:var(--sp-6) var(--gutter);
  display:grid;grid-template-columns:188px minmax(0,1fr) 206px;gap:var(--sp-5);align-items:start}

.mega-lead{display:flex;flex-direction:column;height:100%}
.mega-ico{width:40px;height:40px;border-radius:10px;background:var(--blue-dim);color:var(--blue);
  display:grid;place-items:center;margin-bottom:var(--sp-3)}
.mega-ico .ico{width:23px;height:23px}
.mega-lead h3{font-size:var(--t-2xl);color:var(--ink)}
.mega-lead p{color:var(--muted);font-size:var(--t-base);margin-top:6px}
.mega-all{display:inline-flex;align-items:center;gap:6px;margin-top:var(--sp-3);color:var(--blue);
  font-weight:700;font-size:var(--t-base)}
.mega-all:hover{gap:10px}
.mega-lead-cta{margin-top:auto;padding-top:var(--sp-4)}

.mega-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-5) var(--sp-4);
  padding-inline:var(--sp-4);border-inline:1px solid var(--border)}
.mega-col{min-width:0}
.mega-col-wide{grid-column:span 2}
.mega-col h4{display:flex;align-items:center;gap:7px;font-size:var(--t-xs);text-transform:uppercase;
  letter-spacing:.1em;color:var(--ink);margin-bottom:var(--sp-2);padding-bottom:6px;
  border-bottom:1px solid var(--border);font-weight:700}
.mega-col h4 .ico{color:var(--blue);width:1.3em;height:1.3em}
.mega-col li a{display:flex;align-items:flex-start;gap:6px;padding:5px 8px;margin-left:-8px;border-radius:6px;
  font-size:var(--t-base);line-height:1.35;color:var(--ink-2);transition:background .14s,color .14s}
.mega-col li a>span{flex:1;min-width:0}
.mega-col li a em{font-style:normal;font-size:var(--t-xs);color:var(--muted);font-variant-numeric:tabular-nums}
.mega-col li a .ico{width:.85em;height:.85em;margin-top:.28em;color:var(--blue);opacity:0;transform:translateX(-4px);transition:.14s}
.mega-col li a:hover{background:var(--surface-2);color:var(--blue)}
.mega-col li a:hover .ico{opacity:1;transform:none}
.mega-inline{display:flex;flex-wrap:wrap;gap:5px 12px}
.mega-inline a{font-size:var(--t-base);color:var(--ink-2);transition:color .14s}
.mega-inline a:hover{color:var(--blue);text-decoration:underline}

.mega-feat{display:flex;flex-direction:column;background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--r);overflow:hidden;transition:.18s}
a.mega-feat:hover{border-color:var(--blue);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.mega-feat-media{display:block}
.mega-feat-media .ph{aspect-ratio:16/9}
.mega-feat-media .ph img{transition:transform .35s ease}
a.mega-feat:hover .mega-feat-media .ph img{transform:scale(1.05)}
.mega-feat-body{display:block;padding:var(--sp-4)}
.mega-feat-tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-display);font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;font-size:var(--t-xs);color:var(--orange)}
.mega-feat-tag .ico{width:1.1em;height:1.1em;fill:currentColor;stroke:none}
.mega-feat strong{display:block;font-family:var(--f-display);font-size:var(--t-xl);color:var(--ink);margin-top:5px}
.mega-feat-p{display:block;color:var(--muted);font-size:var(--t-sm);margin-top:5px}
.mega-feat-go{display:inline-flex;align-items:center;gap:6px;margin-top:var(--sp-3);color:var(--blue);
  font-family:var(--f-display);font-weight:700;font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.06em}
a.mega-feat:hover .mega-feat-go{gap:10px}
.mega-feat-plain{padding:var(--sp-4)}
.mega-feat-plain .mega-feat-body{padding:0}
.mega-feat-plain strong{font-size:var(--t-2xl)}
.mega-feat-plain .btn{margin-top:var(--sp-4)}

/* ---------------- mobile nav ---------------- */
.mobile-nav{position:fixed;inset:0;z-index:90;background:rgba(8,21,33,.55);backdrop-filter:blur(3px)}
.mobile-nav[hidden]{display:none}
.mn-panel{position:absolute;top:0;right:0;bottom:0;width:min(88vw,370px);background:var(--surface);
  display:flex;flex-direction:column;transform:translateX(100%);transition:transform .26s ease}
.mobile-nav.open .mn-panel{transform:none}
.mn-top{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--gutter);
  border-bottom:1px solid var(--border);background:var(--navy)}
.mn-top .iconbtn{color:#fff}
.mn-scroll{flex:1;overflow-y:auto;padding:var(--sp-2) var(--gutter) var(--sp-5)}
.mn-acc{border-bottom:1px solid var(--border)}
.mn-acc summary{display:flex;align-items:center;gap:var(--sp-2);padding:13px 2px;font-family:var(--f-display);
  font-weight:700;font-size:var(--t-md);cursor:pointer;list-style:none}
.mn-acc summary::-webkit-details-marker{display:none}
.mn-acc summary .ico{color:var(--blue)}
.mn-acc summary .chev{margin-left:auto;color:var(--muted);transition:transform .2s}
.mn-acc[open] summary .chev{transform:rotate(180deg)}
.mn-body{padding-bottom:var(--sp-3)}
.mn-group{margin-bottom:var(--sp-3)}
.mn-group h5{display:flex;align-items:center;gap:6px;font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:var(--sp-1)}
.mn-group h5 .ico{color:var(--blue)}
.mn-group li a{display:block;padding:6px 0 6px 20px;font-size:var(--t-base);color:var(--ink-2)}
.mn-flat{display:grid;gap:1px;padding-top:var(--sp-3)}
.mn-flat a{padding:10px 2px;font-family:var(--f-display);font-weight:700;font-size:var(--t-md);border-bottom:1px solid var(--border)}
.mn-foot{padding:var(--sp-3) var(--gutter);border-top:1px solid var(--border)}
.mn-foot .btn{width:100%}

/* ---------------- hero ---------------- */
.hero{position:relative;background:var(--navy);color:var(--inv-ink);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg .ph,.hero-bg img{width:100%;height:100%}
.hero-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(14,31,51,.97) 0%,rgba(14,31,51,.93) 34%,rgba(14,31,51,.70) 60%,rgba(8,21,33,.56) 100%)}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:var(--sp-7);
  align-items:center;padding-block:clamp(36px,4.5vw,64px) clamp(56px,6vw,84px)}
.badge-row{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-4)}
.pill{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.09);border:1px solid var(--inv-border);
  padding:.4em .8em;border-radius:999px;font-size:var(--t-sm);font-weight:600}
.pill .ico{color:var(--blue-2)}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--good);box-shadow:0 0 0 3px rgba(53,196,110,.25)}
.hero h1{font-size:var(--t-hero);letter-spacing:-.025em}
.hero .sub{margin-top:var(--sp-3);font-size:var(--t-lg);color:var(--inv-muted);max-width:48ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-5)}
.hero-trust{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-5);margin-top:var(--sp-4);font-size:var(--t-sm)}
.hero-trust li{display:flex;align-items:center;gap:6px;color:var(--inv-muted)}
.hero-trust .ico{color:var(--good)}

/* what we fix — visible right in the hero */
.hero-services{margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid var(--inv-border)}
.hs-label{display:block;font-family:var(--f-display);text-transform:uppercase;letter-spacing:.15em;
  font-weight:700;font-size:var(--t-xs);color:var(--blue-2);margin-bottom:var(--sp-3)}
.hs-list{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.hs-list a{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.07);
  border:1px solid var(--inv-border);border-radius:999px;padding:.45em .9em;
  font-size:var(--t-sm);font-weight:600;color:var(--inv-ink);transition:.15s}
.hs-list a .ico{color:var(--blue-2);width:1.15em;height:1.15em;transition:color .15s}
.hs-list a:hover{background:var(--blue);border-color:var(--blue);color:#fff;transform:translateY(-2px)}
.hs-list a:hover .ico{color:#fff}

.dispatch{background:rgba(6,16,28,.74);border:1px solid rgba(255,255,255,.18);border-radius:var(--r);
  padding:var(--sp-5);backdrop-filter:blur(14px);box-shadow:var(--shadow-lg)}
.dispatch-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.live{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-display);font-weight:700;font-size:var(--t-xs);
  text-transform:uppercase;letter-spacing:.13em;color:var(--good)}
.live .dot{width:7px;height:7px;border-radius:50%;background:var(--good);animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.35}}
.today{font-size:var(--t-sm);color:var(--inv-muted)}
.dispatch h2{font-size:var(--t-xl);color:#fff}
.dispatch-stats{margin-top:var(--sp-3)}
.dispatch-stats div{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3);
  padding:10px 0;border-bottom:1px dashed var(--inv-border)}
.dispatch-stats div:last-child{border-bottom:0}
.dispatch-stats span{display:inline-flex;align-items:center;gap:7px;color:var(--inv-muted);font-size:var(--t-base)}
.dispatch-stats span .ico{color:var(--blue-2)}
.dispatch-stats b{font-family:var(--f-display);font-weight:800;font-size:1.25rem;color:#fff}
.dispatch-stats b.accent{color:var(--orange)}
.dispatch-note{display:flex;gap:7px;align-items:flex-start;margin-top:var(--sp-3);font-size:var(--t-sm);color:var(--inv-muted)}
.dispatch-note .ico{color:var(--orange)}
.dispatch .btn{margin-top:var(--sp-3)}

/* ---------------- quick cards ---------------- */
/* The row straddles the hero's dark edge, so every card is a light surface —
   a navy card here would lose its top edge against the hero behind it. */
.quickcards{margin-top:-40px;position:relative;z-index:5}
.quickcards .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.qc{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  padding:var(--sp-6) var(--sp-5) var(--sp-5);box-shadow:var(--shadow-lg);transition:.2s;display:block;overflow:hidden}
.qc::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--blue)}
.qc:hover{transform:translateY(-4px);box-shadow:0 26px 60px rgba(8,21,33,.26);border-color:var(--blue)}
.qc-ico{width:46px;height:46px;border-radius:11px;background:var(--blue-dim);color:var(--blue);
  display:grid;place-items:center;margin-bottom:var(--sp-4)}
.qc-ico .ico{width:26px;height:26px}
.qc h3{font-size:var(--t-2xl);color:var(--ink);line-height:1.15}
.qc p{color:var(--muted);font-size:var(--t-base);margin-top:var(--sp-2)}
.qc-go{display:inline-flex;align-items:center;gap:6px;margin-top:var(--sp-4);color:var(--blue);font-weight:700;
  font-size:var(--t-sm);font-family:var(--f-display);text-transform:uppercase;letter-spacing:.05em}
.qc:hover .qc-go{gap:10px}
/* emergency card: same surface, orange accent so it still leads the row */
.qc-urgent::before{background:var(--orange)}
.qc-urgent .qc-ico{background:rgba(255,106,44,.14);color:var(--orange)}
.qc-urgent h3{color:var(--ink)}
.qc-urgent .qc-go{color:var(--orange)}
.qc-urgent:hover{border-color:var(--orange)}

/* ---------------- trust strip ---------------- */
.stripbar{background:var(--surface);border-block:1px solid var(--border)}
.stripbar .wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-3);padding-block:var(--sp-5)}
.stat-b{display:flex;align-items:center;gap:var(--sp-2);justify-content:center}
.stat-b .ico{width:24px;height:24px;color:var(--blue)}
.stat-b b{display:block;font-family:var(--f-display);font-weight:800;font-size:1.35rem;color:var(--ink);line-height:1.05}
.stat-b span{font-size:var(--t-sm);color:var(--muted)}

/* ---------------- emergency band ---------------- */
.emergency{background:linear-gradient(100deg,var(--navy),var(--navy-2));color:#fff}
.emergency .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3) var(--sp-5);padding-block:var(--sp-3)}
.em-ico{width:34px;height:34px;border-radius:9px;background:rgba(255,106,44,.2);color:var(--orange);display:grid;place-items:center;flex:none}
.em-ico .ico{width:20px;height:20px}
.emergency strong{font-family:var(--f-display);font-weight:800;font-size:var(--t-lg)}
.em-txt{color:rgba(255,255,255,.82);font-size:var(--t-base)}
.em-call{margin-left:auto;background:var(--orange);color:#fff;font-family:var(--f-display);font-weight:800;
  font-size:var(--t-md);padding:.55em 1.1em;border-radius:var(--r-sm);display:inline-flex;gap:7px;align-items:center;
  white-space:nowrap;transition:.15s}
.em-call:hover{background:var(--orange-600);transform:translateY(-1px)}

/* ---------------- service cards ---------------- */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:var(--sp-3)}
.svc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  transition:.18s;display:flex;flex-direction:column;overflow:hidden}
.svc:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--blue)}
.svc-media{display:block;position:relative;background:var(--surface-2)}
.svc-media .ph{aspect-ratio:16/9}
.svc-media .ph img{transition:transform .35s ease}
.svc:hover .svc-media .ph img{transform:scale(1.05)}
.svc-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(14,31,51,.28))}
.svc-body{display:flex;flex-direction:column;flex:1;padding:var(--card-pad)}
.svc-media + .svc-body{padding-top:var(--sp-4)}
.svc-media + .svc-body .svc-ico{margin-top:-40px;position:relative;z-index:2;border:3px solid var(--surface)}
.svc-ico{width:42px;height:42px;border-radius:10px;background:var(--surface-2);color:var(--blue);
  display:grid;place-items:center;margin-bottom:var(--sp-3)}
.svc-ico .ico{width:23px;height:23px}
.svc:hover .svc-ico{background:var(--blue);color:#fff}
.svc h3{font-size:var(--t-xl);color:var(--ink)}
.svc p{color:var(--muted);font-size:var(--t-base);margin-top:6px;flex:1}
.svc-go{display:inline-flex;align-items:center;gap:6px;margin-top:var(--sp-3);padding-top:var(--sp-3);
  border-top:1px solid var(--border);color:var(--muted);font-size:var(--t-xs);font-weight:700;
  font-family:var(--f-display);text-transform:uppercase;letter-spacing:.06em}
.svc-go .ico{margin-left:auto;color:var(--blue)}
.svc:hover .svc-go .ico{transform:translateX(3px)}
.svc-all{background:var(--navy);border-color:var(--navy)}
.svc-all h3{color:#fff}.svc-all p{color:var(--inv-muted)}
.svc-all .svc-ico{background:rgba(255,255,255,.1);color:var(--blue-2);border-color:var(--navy)}
.svc-all .svc-body{padding:var(--card-pad)}
.svc-all .svc-go{border-top-color:var(--inv-border);color:var(--inv-muted)}
.cat-block{margin-top:var(--sp-6)}
.cat-title{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--t-2xl);color:var(--ink);
  margin-bottom:var(--sp-4);padding-bottom:var(--sp-2);border-bottom:2px solid var(--border)}
.cat-title .ico{color:var(--blue);width:1.2em;height:1.2em}

/* ---------------- work gallery ---------------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3)}
.gal{margin:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--border);background:var(--surface-2)}
.gal .ph{aspect-ratio:1}
.gal .ph img{transition:transform .4s ease}
.gal:hover .ph img{transform:scale(1.06)}
.gal-wide{grid-column:span 2;grid-row:span 2}
.gal-wide .ph{aspect-ratio:auto;height:100%}

/* ---------------- steps ---------------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5)}
.step{position:relative}
.step-num{position:relative;width:52px;height:52px;border-radius:13px;background:var(--navy);color:#fff;
  display:grid;place-items:center;margin-bottom:var(--sp-3);box-shadow:var(--shadow-sm)}
.step-num .ico{width:25px;height:25px;color:var(--blue-2)}
.step-num span{position:absolute;top:-7px;right:-7px;width:23px;height:23px;border-radius:50%;background:var(--orange);
  color:#fff;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:var(--t-xs)}
.step h3{font-size:var(--t-2xl);color:var(--ink)}
.step p{color:var(--muted);margin-top:7px;font-size:var(--t-base)}
.step:not(:last-child)::after{content:"";position:absolute;top:26px;left:64px;right:-10px;height:2px;
  background:linear-gradient(90deg,var(--blue),transparent);opacity:.45}

/* ---------------- split ---------------- */
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-7);align-items:center}
.split-media{position:relative;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-md)}
.split-media .ph{aspect-ratio:4/3}
.split-badge{position:absolute;left:var(--sp-4);bottom:var(--sp-4);display:flex;align-items:center;gap:var(--sp-2);
  background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 13px;box-shadow:var(--shadow-md)}
.split-badge .ico{width:23px;height:23px;color:var(--blue)}
.split-badge b{display:block;font-family:var(--f-display);font-size:var(--t-md);color:var(--ink);line-height:1.1}
.split-badge span{font-size:var(--t-xs);color:var(--muted)}
.split-copy h2{font-size:var(--t-3xl);margin-top:var(--sp-2)}
.split-copy>p{color:var(--muted);margin-top:var(--sp-3);font-size:var(--t-lg)}
.split-cats{display:grid;gap:var(--sp-3);margin:var(--sp-5) 0}
.sc{display:flex;gap:var(--sp-3);align-items:flex-start}
.sc>span{width:38px;height:38px;border-radius:9px;background:var(--surface-2);color:var(--blue);display:grid;place-items:center;flex:none}
.sc>span .ico{width:20px;height:20px}
.sc b{font-family:var(--f-display);font-size:var(--t-md);color:var(--ink)}
.sc p{color:var(--muted);font-size:var(--t-base)}

/* ---------------- why / guarantees ---------------- */
.why{background:var(--inv-bg);color:var(--inv-ink);position:relative;overflow:hidden}
.why::before{content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:40px 40px;mask-image:radial-gradient(680px 400px at 50% 0%,black,transparent 75%)}
.why .section-head h2{color:#fff}
.why .section-head p{color:var(--inv-muted)}
.why .eyebrow,.why .eyebrow .ico{color:var(--blue-2)}
.guar{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.g{background:rgba(255,255,255,.055);border:1px solid var(--inv-border);border-radius:var(--r);padding:var(--card-pad)}
.g-ico{width:42px;height:42px;border-radius:10px;background:rgba(3,139,217,.2);color:var(--blue-2);
  display:grid;place-items:center;margin-bottom:var(--sp-3)}
.g-ico .ico{width:23px;height:23px}
.g h3{font-size:var(--t-xl);color:#fff}
.g p{color:var(--inv-muted);font-size:var(--t-base);margin-top:6px}
.guar-light .g{background:var(--surface);border-color:var(--border)}
.guar-light .g h3{color:var(--ink)}
.guar-light .g p{color:var(--muted)}
.guar-light .g-ico{background:var(--blue-dim);color:var(--blue)}

/* ---------------- coverage map ---------------- */
.area{background:var(--surface);border-block:1px solid var(--border)}
.map-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--sp-5);align-items:stretch}
.map-panel{margin:0;position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--border);
  box-shadow:var(--shadow-md);background:#0A1A2C}
.gta-map{display:block;width:100%;height:auto}
.map-cap{position:absolute;left:0;right:0;bottom:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px var(--sp-4);
  padding:10px var(--sp-4);background:linear-gradient(transparent,rgba(5,13,24,.92));font-size:var(--t-sm);
  color:rgba(233,242,250,.72);font-weight:500}
.map-legend{display:inline-flex;align-items:center;gap:6px}
.map-legend i{width:8px;height:8px;border-radius:50%;display:inline-block}
.lg-hub{background:var(--blue-2);box-shadow:0 0 0 3px rgba(58,174,238,.28)}
.lg-city{background:#EAF1FA}
.map-hint{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-family:var(--f-display);font-weight:700;
  text-transform:uppercase;letter-spacing:.11em;font-size:var(--t-xs);color:var(--blue-2)}
.city{cursor:pointer}
.city:focus{outline:none}
.halo{fill:var(--blue-2);opacity:.1;transform-box:fill-box;transform-origin:center;transition:opacity .2s,transform .2s}
.ring{fill:none;stroke:var(--blue-2);stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.dot{--s:1;fill:#EAF1FA;stroke:#0A1A2C;stroke-width:2;transform-box:fill-box;transform-origin:center;
  transform:scale(var(--s));transition:transform .2s,fill .2s}
.lbl{fill:rgba(233,242,250,.82);font-family:var(--f-display);font-weight:600;font-size:15px;paint-order:stroke;
  stroke:rgba(5,13,24,.82);stroke-width:3.5px;stroke-linejoin:round;pointer-events:none;transition:fill .2s,opacity .2s}
.city.hub .lbl{font-size:19px;font-weight:800;fill:#fff}
.city:hover .dot{--s:1.35;fill:var(--blue-2)}
.city:hover .lbl{fill:#fff}
.city:hover .halo{opacity:.24}
.city:focus-visible .dot{--s:1.45;fill:var(--blue-2)}
.city:focus-visible .ring{opacity:1;stroke-dasharray:4 3}
.city.active .dot{--s:1.55;fill:var(--blue-2)}
.city.active .lbl{fill:#fff;font-weight:800}
.city.active .halo{opacity:.32;transform:scale(1.25)}
.city.active .ring{opacity:.9;animation:ringOut 2.2s ease-out infinite}
@keyframes ringOut{0%{transform:scale(1);opacity:.85}100%{transform:scale(3);opacity:0}}
@media (prefers-reduced-motion:reduce){.city.active .ring{animation:none;opacity:.55}}
.shield rect{fill:rgba(233,242,250,.1);stroke:rgba(233,242,250,.2);stroke-width:1}
.shield text{fill:rgba(233,242,250,.58);font-family:var(--f-display);font-weight:700;font-size:14px;text-anchor:middle}

.map-info{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r);padding:var(--sp-5);
  display:flex;flex-direction:column}
.mi-eyebrow{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-display);text-transform:uppercase;
  letter-spacing:.14em;font-weight:700;font-size:var(--t-xs);color:var(--muted)}
.mi-eyebrow .ico{color:var(--blue)}
.map-info h3{font-size:var(--t-2xl);color:var(--ink);margin-top:5px}
.mi-eta{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-3);padding:var(--sp-3);
  border-radius:10px;background:var(--surface);border:1px solid var(--border)}
.mi-eta .ico{width:23px;height:23px;color:var(--blue)}
.mi-eta strong{display:block;font-family:var(--f-display);font-weight:800;font-size:var(--t-xl);color:var(--ink);line-height:1.15}
.mi-eta span{font-size:var(--t-sm);color:var(--muted)}
.mi-block{margin-top:var(--sp-4)}
.mi-lbl{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.11em;font-weight:700;font-size:var(--t-xs);color:var(--muted)}
.mi-block p{margin-top:4px;color:var(--ink-2);font-size:var(--t-base)}
.mi-feats{margin:var(--sp-4) 0;display:grid;gap:7px}
.mi-feats li{display:flex;gap:8px;align-items:flex-start;font-size:var(--t-base);color:var(--ink-2)}
.mi-feats .ico{color:var(--blue);margin-top:.15em}
.map-info .btn{width:100%}
.map-info .btn-outline{margin-top:auto;margin-bottom:var(--sp-2)}

.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:var(--sp-4)}
.chip{font-family:var(--f-body);background:var(--surface-2);border:1px solid var(--border);color:var(--ink-2);
  padding:.42em .85em;border-radius:999px;font-weight:600;font-size:var(--t-sm);cursor:pointer;
  display:inline-flex;gap:6px;align-items:center;transition:background .15s,border-color .15s,color .15s}
.chip .ico{color:var(--blue);width:1em;height:1em}
.chips:not(.chips-static) .chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--muted);flex:none;transition:.15s}
.chip:hover{border-color:var(--blue);color:var(--ink)}
.chip.active{background:var(--navy);border-color:var(--navy);color:#fff}
.chip.active::before{background:var(--blue-2);box-shadow:0 0 0 3px rgba(58,174,238,.3)}
.chips-static .chip{cursor:default}
.area-more{margin-top:var(--sp-3);font-size:var(--t-sm);color:var(--muted);text-align:center;line-height:1.9}
.area-more a{color:var(--blue);font-weight:600}
.loc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--sp-2)}
.loc{display:flex;align-items:center;gap:var(--sp-2);background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:11px 13px;transition:.16s}
.loc:hover{border-color:var(--blue);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.loc b{font-family:var(--f-display);font-size:var(--t-md);color:var(--ink)}
.loc>span{display:inline-flex;align-items:center;gap:4px;font-size:var(--t-xs);color:var(--muted);margin-left:auto}
.loc>span .ico{color:var(--blue)}
.loc>.ico{color:var(--blue);width:1.05em;height:1.05em}

/* ---------------- reviews ---------------- */
.rev-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-6)}
.rev-head .section-head{margin-bottom:0}
.rev-score{display:flex;align-items:center;gap:var(--sp-3)}
.rev-big{font-family:var(--f-display);font-weight:800;font-size:2.6rem;color:var(--ink);line-height:1}
.rev-score span{font-size:var(--t-sm);color:var(--muted)}
.stars{display:inline-flex;gap:2px;color:#FFB000}
.stars .ico{width:17px;height:17px;fill:currentColor;stroke:none}
.rev-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-3)}
.review{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:var(--card-pad);box-shadow:var(--shadow-sm)}
.review .stars{margin-bottom:var(--sp-2)}
.review p{color:var(--ink-2);font-size:var(--t-base);line-height:1.6}
.who{display:flex;align-items:center;gap:var(--sp-2);margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:1px solid var(--border)}
.av{width:34px;height:34px;border-radius:50%;background:linear-gradient(150deg,var(--navy-2),var(--navy));color:#fff;
  display:grid;place-items:center;font-family:var(--f-display);font-weight:800;flex:none;font-size:var(--t-sm)}
.who .nm{font-weight:700;font-size:var(--t-base);color:var(--ink)}
.who .rev-city{display:flex;align-items:center;gap:4px;font-size:var(--t-xs);color:var(--muted)}
.who .rev-city .ico{color:var(--blue)}

/* ---------------- book / form ---------------- */
.book-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-7);align-items:start}
.book-copy h2{font-size:var(--t-3xl);margin-top:var(--sp-2)}
.book-copy>p{color:var(--muted);font-size:var(--t-lg);margin-top:var(--sp-3)}
.book-list{display:grid;gap:var(--sp-3);margin-top:var(--sp-5)}
.book-list li{display:flex;gap:var(--sp-2);align-items:flex-start;font-size:var(--t-base)}
.book-list .ico{color:var(--blue);margin-top:.18em}
.book-callout{margin-top:var(--sp-5);padding:var(--sp-4);border:1px dashed var(--border);border-radius:10px;
  background:var(--surface-2);display:flex;gap:var(--sp-3);align-items:center}
.bc-ico{width:40px;height:40px;border-radius:10px;background:var(--orange);color:#fff;display:grid;place-items:center;flex:none}
.bc-ico .ico{width:21px;height:21px}
.bc-num{display:block;font-family:var(--f-display);font-weight:800;font-size:var(--t-2xl);color:var(--ink);line-height:1.15}
.bc-num:hover{color:var(--orange)}
.bc-sub{font-size:var(--t-sm);color:var(--muted)}
.book-photo{margin-top:var(--sp-5);border-radius:var(--r);aspect-ratio:16/9}
.mini-areas{margin-top:var(--sp-5);font-size:var(--t-sm);color:var(--muted);display:flex;flex-wrap:wrap;align-items:center;gap:6px var(--sp-3)}
.mini-areas b{flex-basis:100%;display:flex;align-items:center;gap:6px;color:var(--ink);font-family:var(--f-display);font-size:var(--t-md);margin-bottom:2px}
.mini-areas b .ico{color:var(--blue)}
.mini-areas a{color:var(--blue);font-weight:600}
.mini-areas a:hover{text-decoration:underline}
.mini-areas .more{display:inline-flex;align-items:center;gap:3px;white-space:nowrap}

.quote{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:var(--sp-5);box-shadow:var(--shadow-md)}
.quote h3{display:flex;align-items:center;gap:8px;font-size:var(--t-2xl);color:var(--ink)}
.quote h3 .ico{color:var(--blue)}
.quote .fp{font-size:var(--t-sm);color:var(--muted);margin-top:4px;margin-bottom:var(--sp-4)}
.field{margin-bottom:var(--sp-3)}
.field label{display:block;font-family:var(--f-display);font-weight:700;font-size:var(--t-sm);margin-bottom:4px;color:var(--ink)}
.field .req{color:var(--orange)}
.field input,.field select,.field textarea{width:100%;padding:.68em .8em;border:1.5px solid var(--border);border-radius:8px;
  background:var(--ground);color:var(--ink);font-family:var(--f-body);font-size:var(--t-md);
  transition:border-color .15s,box-shadow .15s}
.field textarea{min-height:82px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(3,139,217,.16)}
.field input:invalid:not(:placeholder-shown){border-color:var(--orange)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.form-note{display:flex;align-items:center;justify-content:center;gap:5px;font-size:var(--t-xs);color:var(--muted);margin-top:var(--sp-2)}
.form-ok{display:none;align-items:flex-start;gap:8px;text-align:left;padding:var(--sp-4);border-radius:10px;margin-top:var(--sp-3);
  background:rgba(53,196,110,.13);border:1px solid rgba(53,196,110,.4);color:var(--ink);font-weight:600;font-size:var(--t-base)}
.form-ok.show{display:flex}
.form-ok .ico{color:var(--good);margin-top:.15em}
.form-ok a{color:var(--orange);font-weight:800}

/* checkbox grids (partner application) */
.chk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px 10px;
  max-height:190px;overflow-y:auto;padding:var(--sp-3);border:1.5px solid var(--border);
  border-radius:8px;background:var(--ground)}
.chk-stack{display:grid;gap:6px}
.chk{display:flex;align-items:flex-start;gap:8px;font-size:var(--t-base);color:var(--ink-2);
  cursor:pointer;padding:4px 2px;line-height:1.35}
.chk input{appearance:none;width:17px;height:17px;flex:none;margin-top:2px;border:1.5px solid var(--border);
  border-radius:5px;background:var(--surface);cursor:pointer;transition:.14s;position:relative}
.chk input:checked{background:var(--blue);border-color:var(--blue)}
.chk input:checked::after{content:"";position:absolute;left:5px;top:1.5px;width:4px;height:9px;
  border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
.chk input:focus-visible{outline:3px solid var(--orange);outline-offset:1px}
.chk:hover{color:var(--ink)}
.form-err{display:none;align-items:flex-start;gap:8px;padding:var(--sp-4);border-radius:10px;margin-top:var(--sp-3);
  background:rgba(226,58,46,.12);border:1px solid rgba(226,58,46,.4);color:var(--ink);
  font-weight:600;font-size:var(--t-base)}
.form-err.show{display:flex}
.form-err .ico{color:#E23A2E;margin-top:.15em}

/* ---------------- faq ---------------- */
.faq-list{display:grid;gap:var(--sp-2);max-width:820px;margin-inline:auto}
.faq{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.faq summary{cursor:pointer;list-style:none;padding:var(--sp-4) var(--sp-5);font-family:var(--f-display);font-weight:700;
  font-size:var(--t-lg);color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4)}
.faq summary::-webkit-details-marker{display:none}
.plus{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:7px;background:var(--surface-2);color:var(--blue);transition:.2s}
.plus .ico{width:15px;height:15px}
.faq[open] .plus{transform:rotate(45deg);background:var(--blue);color:#fff}
.faq-body{padding:0 var(--sp-5) var(--sp-4);color:var(--muted);font-size:var(--t-base)}

/* ---------------- page hero / crumbs / prose ---------------- */
.page-hero{background:linear-gradient(160deg,var(--navy-2),var(--navy) 60%,var(--navy-deep));color:var(--inv-ink);
  position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;opacity:.45;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:40px 40px;mask-image:linear-gradient(180deg,black,transparent 85%)}
.page-hero .wrap{position:relative;z-index:2;padding-block:var(--sp-5) clamp(34px,4.5vw,56px)}
.page-hero h1{font-size:var(--t-4xl);color:#fff}
.page-hero .lead{color:var(--inv-muted)}
.page-hero-plain .lead{max-width:64ch}
.ph-sub{color:var(--inv-muted);font-weight:600}
.ph-tag{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.09);border:1px solid var(--inv-border);
  padding:.38em .8em;border-radius:999px;font-size:var(--t-sm);font-weight:600;margin-bottom:var(--sp-3)}
.ph-tag .ico{color:var(--blue-2)}
.ph-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp-7);align-items:center}
.ph-media{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-lg)}
.ph-media .ph{aspect-ratio:4/3}
.ph-meta{display:flex;flex-wrap:wrap;gap:7px var(--sp-5);margin-top:var(--sp-4);padding-top:var(--sp-3);border-top:1px solid var(--inv-border)}
.ph-meta span{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-base);color:var(--inv-muted)}
.ph-meta .ico{color:var(--blue-2)}
.ph-meta b{color:#fff}
.crumbs{margin-bottom:var(--sp-3)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:var(--t-sm);color:var(--inv-muted)}
.crumbs li{display:inline-flex;align-items:center;gap:4px}
.crumbs a:hover{color:var(--blue-2)}
.crumbs .ico{width:.9em;height:.9em;opacity:.55}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-7);align-items:start}
.signs{display:grid;gap:var(--sp-2)}
.signs li{display:flex;gap:var(--sp-2);align-items:flex-start;background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:13px 15px;font-size:var(--t-base)}
.signs .ico{color:var(--orange);margin-top:.15em}
.process{display:grid;gap:var(--sp-2)}
.process li{display:flex;gap:var(--sp-3);align-items:flex-start;background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:13px 15px;font-size:var(--t-base)}
.pn{width:26px;height:26px;border-radius:7px;background:var(--blue);color:#fff;display:grid;place-items:center;flex:none;
  font-family:var(--f-display);font-weight:800;font-size:var(--t-sm)}

.prose{color:var(--ink-2);font-size:var(--t-lg)}
.prose h2{font-size:var(--t-2xl);color:var(--ink);margin:var(--sp-6) 0 var(--sp-3)}
.prose p{margin-bottom:var(--sp-3)}
.prose ul{list-style:disc;padding-left:20px;margin-bottom:var(--sp-3)}
.prose li{margin-bottom:6px}
.prose code{background:var(--surface-2);padding:.14em .4em;border-radius:4px;font-size:.9em}
.prose-cta{margin-top:var(--sp-6);padding:var(--sp-5);border-radius:var(--r);background:var(--surface-2);border:1px solid var(--border);text-align:center}
.prose-cta h3{display:flex;align-items:center;justify-content:center;gap:8px;font-size:var(--t-2xl);color:var(--ink)}
.prose-cta h3 .ico{color:var(--orange)}
.prose-cta p{color:var(--muted);margin:7px 0 var(--sp-4);font-size:var(--t-base)}

.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:var(--sp-3)}
.post{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  transition:.18s;display:flex;flex-direction:column;overflow:hidden;padding:0}
.post>time,.post>h2,.post>p,.post>.post-go{margin-inline:var(--card-pad)}
.post>.post-go{margin-bottom:var(--card-pad)}
.post-media{display:block;background:var(--surface-2)}
.post-media .ph{aspect-ratio:16/9}
.post-media .ph img{transition:transform .35s ease}
.post:hover .post-media .ph img{transform:scale(1.05)}
.post-hero{margin:0 0 var(--sp-5);border-radius:var(--r);overflow:hidden;border:1px solid var(--border)}
.post:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--blue)}
.post-ico{width:42px;height:42px;border-radius:10px;background:var(--blue-dim);color:var(--blue);display:grid;place-items:center;
  margin:-40px 0 var(--sp-3) var(--card-pad);position:relative;z-index:2;border:3px solid var(--surface)}
.post-ico .ico{width:23px;height:23px}
.post time{display:block;font-size:var(--t-xs);color:var(--muted);font-weight:600}
.post h2{font-size:var(--t-xl);color:var(--ink);margin-top:5px}
.post p{color:var(--muted);font-size:var(--t-base);margin-top:6px;flex:1}
.post-go{display:inline-flex;align-items:center;gap:6px;margin-top:var(--sp-3);color:var(--blue);font-weight:700;
  font-size:var(--t-sm);font-family:var(--f-display);text-transform:uppercase;letter-spacing:.05em}

.contact-cards{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.cc{display:flex;gap:var(--sp-3);align-items:center;background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:var(--sp-4);transition:.16s}
a.cc:hover{border-color:var(--blue);transform:translateY(-2px)}
.cc>span{width:38px;height:38px;border-radius:9px;background:var(--blue-dim);color:var(--blue);display:grid;place-items:center;flex:none}
.cc b{display:block;font-family:var(--f-display);font-size:var(--t-md);color:var(--ink)}
.cc div>span{font-size:var(--t-base);color:var(--muted);word-break:break-word}

/* ---------------- final CTA ---------------- */
.final{background:radial-gradient(760px 400px at 78% 118%,rgba(3,139,217,.28),transparent 62%),
  linear-gradient(160deg,var(--navy-2),var(--navy-deep));color:var(--inv-ink);text-align:center;position:relative;overflow:hidden}
.final .wrap{padding-block:clamp(48px,6.5vw,84px)}
.final .eyebrow,.final .eyebrow .ico{color:var(--orange)}
.final h2{font-size:var(--t-4xl);color:#fff;margin-top:var(--sp-2)}
.final p{color:var(--inv-muted);font-size:var(--t-lg);margin:var(--sp-3) auto 0;max-width:56ch}
.final-cta{display:flex;flex-wrap:wrap;gap:var(--sp-3);justify-content:center;margin-top:var(--sp-5)}
.final-note{display:inline-flex;align-items:center;gap:8px;margin-top:var(--sp-4);font-family:var(--f-display);
  font-weight:700;font-size:var(--t-md);color:#fff}
.final-note .ico{color:var(--blue-2);width:1.25em;height:1.25em}

/* ---------------- footer ---------------- */
footer.site{background:var(--inv-bg);color:var(--inv-muted);border-top:1px solid var(--inv-border)}
.foot-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr) 1.05fr;gap:var(--sp-6) var(--sp-5);padding-block:var(--sp-7) var(--sp-6)}
.foot-brand .brand-word{color:#fff}
.foot-brand>p{font-size:var(--t-base);margin-top:var(--sp-3);max-width:34ch}
.foot-trust{display:grid;gap:6px;margin-top:var(--sp-4)}
.foot-trust span{display:inline-flex;align-items:center;gap:7px;font-size:var(--t-sm)}
.foot-trust .ico{color:var(--blue-2)}
.foot-social{display:flex;gap:7px;margin-top:var(--sp-4)}
.foot-social a{width:33px;height:33px;border-radius:8px;background:rgba(255,255,255,.07);border:1px solid var(--inv-border);
  display:grid;place-items:center;color:var(--inv-muted);transition:.15s}
.foot-social a:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.foot-social .ico{width:16px;height:16px}
.foot-col h4{display:flex;align-items:center;gap:7px;font-family:var(--f-display);color:#fff;font-size:var(--t-sm);
  text-transform:uppercase;letter-spacing:.09em;margin-bottom:var(--sp-3);font-weight:700}
.foot-col h4 .ico{color:var(--blue-2)}
.foot-col a,.foot-col>span{display:flex;align-items:center;gap:6px;color:var(--inv-muted);font-size:var(--t-base);
  margin-bottom:6px;transition:color .15s}
.foot-col a:hover{color:var(--blue-2)}
.foot-col .more{color:var(--blue-2);font-weight:700}
.foot-phone{font-family:var(--f-display);font-weight:800;font-size:var(--t-2xl);color:var(--orange)!important;margin-bottom:2px!important}
.foot-sub{font-size:var(--t-xs);margin-bottom:var(--sp-3)!important}
.foot-addr,.foot-col .ico{flex:none}
.foot-bottom{border-top:1px solid var(--inv-border);padding-block:var(--sp-4);display:flex;flex-wrap:wrap;
  gap:var(--sp-2) var(--sp-5);justify-content:space-between;align-items:center;font-size:var(--t-sm)}
.foot-legal{display:flex;gap:var(--sp-4)}
.foot-legal a:hover{color:var(--blue-2)}
.foot-live{display:inline-flex;align-items:center;gap:6px}
.foot-live .ico{color:var(--good)}

/* footer: service-area + company bands */
.foot-areas{display:grid;grid-template-columns:1fr 240px;gap:var(--sp-6);padding-block:var(--sp-5);
  border-top:1px solid var(--inv-border)}
.fa-block h4{display:flex;align-items:center;gap:7px;font-family:var(--f-display);color:#fff;font-size:var(--t-sm);
  text-transform:uppercase;letter-spacing:.09em;margin-bottom:var(--sp-3);font-weight:700}
.fa-block h4 .ico{color:var(--blue-2)}
.fa-links{display:flex;flex-wrap:wrap;gap:6px var(--sp-4)}
.fa-links a{color:var(--inv-muted);font-size:var(--t-sm);transition:color .14s}
.fa-links a:hover{color:var(--blue-2);text-decoration:underline}
.fa-company .fa-links{flex-direction:column;gap:7px}

/* html sitemap */
.sm-group{margin-bottom:var(--sp-5)}
.sm-group h4{display:flex;align-items:center;gap:7px;font-size:var(--t-xs);text-transform:uppercase;
  letter-spacing:.1em;color:var(--muted);margin-bottom:var(--sp-3);font-weight:700}
.sm-group h4 .ico{color:var(--blue);width:1.3em;height:1.3em}
.sm-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2px var(--sp-4)}
.sm-links a{display:flex;align-items:center;gap:7px;padding:7px 9px;margin-left:-9px;border-radius:7px;
  color:var(--ink-2);font-size:var(--t-base);transition:background .14s,color .14s}
.sm-links a .ico{width:.85em;height:.85em;color:var(--blue);flex:none}
.sm-links a:hover{background:var(--surface-2);color:var(--blue)}

/* ---------------- mobile sticky call ---------------- */
.mobile-call{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;gap:8px;padding:8px 10px;
  background:color-mix(in srgb,var(--ground) 94%,transparent);backdrop-filter:blur(10px);
  border-top:1px solid var(--border);box-shadow:0 -6px 22px rgba(8,21,33,.14)}
.mobile-call a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:9px;
  padding:.8em;font-family:var(--f-display);font-weight:800;font-size:var(--t-md)}
.m-call{background:var(--orange);color:#fff;flex:1.5}
.m-quote{background:var(--surface-2);color:var(--ink);border:1px solid var(--border)}

/* ---------------- responsive ---------------- */
@media (max-width:1300px){ .navlink-flat{display:none} }
@media (max-width:1180px){
  .navlink{font-size:.88rem;padding:8px 7px;gap:4px}
  .navlink .ico{display:none}
  .nav-actions{gap:6px}
}
@media (max-width:1040px){
  .nav-main{display:none}
  .menu-btn{display:grid}
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr;gap:var(--sp-5)}
  .foot-areas{grid-template-columns:1fr;gap:var(--sp-5)}
}
@media (max-width:960px){
  /* stacked cards no longer straddle the hero edge — drop the overlap */
  .quickcards{margin-top:0;padding-top:var(--sp-5)}
  .quickcards .wrap{gap:var(--sp-3)}
  .qc{padding:var(--sp-5)}
  .gallery{grid-template-columns:repeat(3,1fr)}
  .gal-wide{grid-column:span 2;grid-row:span 1}
  .gal-wide .ph{aspect-ratio:16/9}
  .hero-grid,.ph-grid,.split-grid,.book-grid,.two-col{grid-template-columns:1fr;gap:var(--sp-6)}
  .map-layout{grid-template-columns:1fr}
  .steps,.guar{grid-template-columns:1fr 1fr}
  .quickcards .wrap{grid-template-columns:1fr}
  .stripbar .wrap{grid-template-columns:repeat(3,1fr);gap:var(--sp-4) var(--sp-3)}
  .step:not(:last-child)::after{display:none}
  .dispatch{max-width:460px}
  .map-info .btn-outline{margin-top:var(--sp-4)}
}
@media (max-width:720px){
  .topbar .wrap{justify-content:center;gap:6px var(--sp-3);font-size:var(--t-xs)}
  .tb-hide-sm,.tb-links{display:none}
  .nav-phone{display:none}
  .btn-quote{display:none}
  .steps,.guar,.row2,.contact-cards{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .stripbar .wrap{grid-template-columns:repeat(2,1fr)}
  .stat-b{justify-content:flex-start}
  .foot-grid{grid-template-columns:1fr}
  .fa-company .fa-links{flex-direction:row}
  .em-call{margin-left:0;width:100%;justify-content:center}
  .btn{white-space:normal;text-align:center}
  .btn-block{line-height:1.25}
  .mobile-call{display:flex}
  body{padding-bottom:64px}
  /* photo cards: shorter media and tighter padding, so ~2 fit a screen */
  .svc-media .ph{aspect-ratio:2.5/1}
  .svc-body{padding:var(--sp-4)}
  .svc-media + .svc-body{padding-top:var(--sp-3)}
  .svc-media + .svc-body .svc-ico{margin-top:-36px;width:38px;height:38px}
  .svc-media + .svc-body .svc-ico .ico{width:21px;height:21px}
  .svc h3{font-size:var(--t-lg)}
  .svc-go{margin-top:var(--sp-2);padding-top:var(--sp-2)}
  .post-media .ph{aspect-ratio:2.5/1}
  .post>time,.post>h2,.post>p,.post>.post-go{margin-inline:var(--sp-4)}
  .post>.post-go{margin-bottom:var(--sp-4)}
  .post-ico{margin:-34px 0 var(--sp-2) var(--sp-4);width:38px;height:38px}
  .post-ico .ico{width:21px;height:21px}
  .foot-bottom{flex-direction:column;text-align:center}
  .map-cap{position:static;background:rgba(5,13,24,.9)}
  .lbl{opacity:0}
  .city.active .lbl{opacity:1;font-size:30px}
  .dot{--s:1.5}
  .city.active .dot{--s:2.2}
  .rev-head{flex-direction:column;align-items:flex-start}
}