/* ==========================================================================
   Accurate Air Solutions, LLC — accurateairsolutionsllc.com
   Hand-coded static site. Component vocabulary matches the DBA sites
   (hawkins-ac-site / callrrplumbing-site).

   Palette and type follow the AAS Brand Guidelines packet:
     primary  #0c1b56 navy · #26408b blue · #d2232a red · #9c1519 dark red
     neutral  #c5c6c8 grey · #ffffff white
     accent   #e1a900 yellow — SPECIAL USE ONLY, minimal and intentional,
              never in the logo and never as a primary brand colour
   Brand fonts are American Typewriter (header, ALL CAPS) / Minion Pro
   (subheads, ALL CAPS) / Avant Garde Demi (body). None are licensed for web,
   so the closest free equivalents stand in: Zilla Slab / Source Serif 4 /
   Poppins. Header type is uppercase per the guide.
   ========================================================================== */

:root{
  /* brand — exact values from the guidelines packet */
  --navy:#0c1b56;
  --blue:#26408b;
  --blue-lite:#3a5bb5;
  --red:#d2232a;
  --red-dark:#9c1519;
  --grey:#c5c6c8;
  --white:#fff;
  --yellow:#e1a900;      /* sparingly */

  /* derived neutrals for text and surfaces */
  --ink:#151d33;
  --slate:#5a6478;
  --slate-lite:#818b9f;
  --line:#dde3ee;
  --paper:#f1f4fa;
  --paper-2:#e6ebf6;
  --sky:#a9c2f0;

  /* metrics */
  --maxw:1240px;
  --radius:14px;
  --radius-lg:20px;
  --shadow:0 20px 50px -22px rgba(12,27,86,.40);
  --shadow-sm:0 10px 28px -14px rgba(12,27,86,.30);
  --shadow-xs:0 3px 12px rgba(12,27,86,.13);
  --ring:0 0 0 4px rgba(38,64,139,.22);
  --ease:cubic-bezier(.2,.8,.2,1);

  --f-disp:"Zilla Slab",Rockwell,"Roboto Slab",Georgia,serif;
  --f-sub:"Source Serif 4",Georgia,"Times New Roman",serif;
  --f-body:"Poppins",system-ui,-apple-system,Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;font-family:var(--f-body);color:var(--ink);background:var(--white);
  font-size:16.5px;line-height:1.68;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}

/* Header type: brand rule is ALL CAPS for the display face */
h1,h2,h3,h4{
  font-family:var(--f-disp);font-weight:700;line-height:1.1;margin:0 0 .5em;
  text-transform:uppercase;letter-spacing:.005em;
}
h1{font-size:clamp(1.95rem,4.2vw,3.15rem)}
h2{font-size:clamp(1.5rem,2.9vw,2.2rem)}
h3{font-size:1.14rem}
p{margin:0 0 1em}
ul{margin:0 0 1em;padding-left:1.15em}
strong{font-weight:600}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:6px}

.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-9999px;top:0;background:var(--white);padding:10px 16px;z-index:200}
.skip:focus{left:8px;top:8px}
.center{text-align:center}
.u{text-decoration:underline}
.fine{font-size:.8rem;color:var(--slate);line-height:1.55}
/* marks content awaiting confirmation before launch — delete the rule once
   every .tbd is gone from the markup */
.tbd{
  font-style:normal;font-size:.86em;font-weight:600;color:var(--red-dark);
  background:#fdecec;border:1px dashed #e9a9ab;border-radius:6px;padding:.05em .45em;
  text-transform:none;letter-spacing:0;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--f-disp);font-weight:700;font-size:.95rem;
  text-transform:uppercase;letter-spacing:.03em;
  padding:.8em 1.5em;border-radius:999px;border:2px solid transparent;
  background:var(--blue);color:var(--white);cursor:pointer;text-align:center;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease);
}
.btn:hover{background:var(--blue-lite);text-decoration:none;transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.btn-blaze{background:var(--red)}
.btn-blaze:hover{background:#e4353c}
.btn-blue{background:var(--navy)}
.btn-blue:hover{background:var(--blue)}
.btn-gold{background:var(--yellow);color:var(--navy)}
.btn-gold:hover{background:#f0bb1f}
.btn-line{background:transparent;border-color:currentColor;color:inherit}
.btn-line:hover{background:rgba(255,255,255,.14);box-shadow:none}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--blue)}
.btn-ghost:hover{background:var(--paper);box-shadow:none}
.btn-lg{font-size:1.02rem;padding:.92em 1.8em}
.btn-block{width:100%}

/* ---------- topbar ---------- */
.topbar{background:var(--navy);color:#c3d0ea;font-size:.84rem}
.topbar .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.4rem;min-height:40px}
.tb-item{display:inline-flex;align-items:center;gap:.45em;white-space:nowrap}
.tb-right{margin-left:auto;display:flex;gap:1.2rem;align-items:center}
.topbar a{color:var(--sky)}

/* ---------- header / nav ---------- */
/* nowrap on purpose: .nav uses margin-left:auto, and in a wrapping flex row that
   auto margin absorbs the free space and pushes .header-cta onto a second line.
   The <=470px block below opts back into wrapping, where two rows are intended. */
.site-header{position:sticky;top:0;z-index:100;background:var(--white);border-bottom:1px solid var(--line);box-shadow:var(--shadow-xs)}
.site-header .wrap{display:flex;flex-wrap:nowrap;align-items:center;gap:.5rem 1.1rem;min-height:78px;padding-top:.4rem;padding-bottom:.4rem}
/* every header child holds its intrinsic size; see the .nav note below */
.brand-logo{display:flex;align-items:center;gap:.7rem;flex:0 0 auto}
.brand-logo:hover{text-decoration:none}
.brand-logo img{width:54px;height:54px;flex:0 0 auto}
.brand-logo .bl-txt{display:flex;flex-direction:column;line-height:1.02;font-family:var(--f-disp);color:var(--navy)}
.brand-logo b{font-size:1.12rem;font-weight:700;text-transform:uppercase;letter-spacing:.005em;white-space:nowrap}
.brand-logo span{
  font-family:var(--f-body);font-size:.62rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--slate);white-space:nowrap;margin-top:.15rem;
}

/* flex:0 0 auto, NOT min-width:0 — allowing the nav to shrink below its content
   width made it silently overlap the phone number instead of overflowing, which
   meant scrollWidth checks reported the header as fine when it wasn't. */
.nav{margin-left:auto;display:flex;align-items:center;gap:.2rem;flex:0 0 auto}
.nav>li{position:relative;list-style:none}
.nav ul{list-style:none;margin:0;padding:0}
.nav>li>a{
  display:block;padding:.6em .6em;border-radius:9px;font-family:var(--f-disp);
  font-weight:600;font-size:.86rem;color:var(--ink);text-transform:uppercase;
  letter-spacing:.01em;white-space:nowrap;
}
.nav>li>a:hover{background:var(--paper);text-decoration:none;color:var(--navy)}
.nav .has-menu>a::after{content:"";display:inline-block;margin-left:.4em;border:4px solid transparent;border-top-color:currentColor;transform:translateY(2px)}
.nav .menu{
  position:absolute;left:0;top:calc(100% + 6px);min-width:262px;background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:.45rem;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s var(--ease);
}
.nav .has-menu:hover .menu,.nav .has-menu:focus-within .menu{opacity:1;visibility:visible;transform:none}
.nav .menu a{
  display:block;padding:.55em .8em;border-radius:8px;font-size:.88rem;color:var(--ink);
  font-family:var(--f-disp);text-transform:uppercase;letter-spacing:.02em;font-weight:600;
}
.nav .menu a:hover{background:var(--paper);text-decoration:none;color:var(--navy)}

.header-cta{display:flex;align-items:center;gap:.8rem;flex:0 0 auto}
.header-call{font-family:var(--f-disp);font-weight:700;font-size:1.08rem;color:var(--navy);white-space:nowrap}
.header-call:hover{text-decoration:none;color:var(--blue)}
.header-call small{
  display:block;font-family:var(--f-body);font-size:.6rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--slate);
}
.nav-toggle{display:none;background:var(--navy);color:#fff;border:0;border-radius:10px;padding:.6em .8em;font-size:1.1rem;cursor:pointer}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--navy);color:#fff;overflow:hidden}
.hero-bg{
  position:absolute;inset:0;
  background-image:
    radial-gradient(880px 620px at 92% 116%,rgba(210,35,42,.34),transparent 64%),
    linear-gradient(100deg,rgba(12,27,86,.97) 0%,rgba(12,27,86,.90) 42%,rgba(26,48,112,.74) 100%),
    url("../img/bg-blue.webp");
  background-size:auto,auto,cover;background-position:center,center,center;
}
/* two-column hero: copy left, real job photography right */
.hero-grid{
  position:relative;display:grid;grid-template-columns:1.06fr .94fr;
  gap:3.4rem;align-items:center;padding:4rem 0 4.4rem;
}
.hero-copy{max-width:37rem}
.hero h1::after{
  content:"";display:block;width:104px;height:5px;background:var(--red);
  margin-top:1.15rem;border-radius:3px;
}
.hero-art{position:relative}
.ha-main{
  margin:0;border-radius:20px;overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 34px 74px -22px rgba(0,0,0,.62);
}
.ha-main img{width:100%;display:block}
.ha-inset{
  position:absolute;left:-40px;bottom:-30px;width:43%;margin:0;
  border-radius:15px;overflow:hidden;border:5px solid var(--navy);
  box-shadow:0 24px 52px -14px rgba(0,0,0,.66);
}
.ha-inset img{width:100%;display:block}
.hero-inner{position:relative;padding:4.4rem 0 4rem;max-width:1000px}
.kicker{
  display:inline-flex;align-items:center;gap:.5em;font-family:var(--f-disp);
  font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:#fff;background:var(--red);padding:.45em 1em;border-radius:999px;margin-bottom:1.2rem;
}
.hero h1{color:#fff;margin-bottom:.55em;letter-spacing:-.005em}
.hero .hl{color:var(--sky)}
.lead{
  font-size:clamp(1.03rem,1.6vw,1.22rem);color:#ccd9f2;max-width:64ch;margin-bottom:1.7rem;
}
.hero-cta{display:flex;flex-wrap:wrap;gap:.85rem;margin-bottom:1.8rem}
.hero-chips{display:flex;flex-wrap:wrap;gap:.55rem}
.chip{
  display:inline-flex;align-items:center;gap:.45em;font-size:.83rem;font-weight:500;
  color:#dce7f8;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);
  padding:.42em .9em;border-radius:999px;
}
.chip b{color:#fff;font-weight:600}

/* ---------- cert strip ---------- */
.certstrip{background:var(--paper);border-bottom:1px solid var(--line)}
.certstrip .wrap{display:flex;flex-wrap:wrap;gap:.7rem 2rem;padding:.95rem 20px;align-items:center;justify-content:center}
.cert{
  font-family:var(--f-disp);font-size:.82rem;font-weight:700;color:var(--navy);
  display:inline-flex;align-items:center;gap:.5em;text-transform:uppercase;letter-spacing:.03em;
}
.cert span{font-family:var(--f-body);font-weight:500;color:var(--slate);text-transform:none;letter-spacing:0}

/* ---------- stats ---------- */
.stats{background:var(--navy);color:#fff}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:2.1rem 20px}
.stat{text-align:center}
.num{font-family:var(--f-disp);font-size:clamp(1.7rem,3.4vw,2.45rem);font-weight:700;line-height:1;color:#fff}
.lbl{
  display:block;margin-top:.45rem;font-size:.76rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--sky);font-weight:500;
}

/* ---------- sections ---------- */
.section{padding:4.2rem 0}
/* The AAS wallpaper is a real brand asset, but at full strength the monogram
   competes with body copy. A white wash knocks it back to texture, and text on
   these sections is set heavier and darker so it sits clearly on top. */
.section.alt{
  background-color:var(--paper);
  background-image:linear-gradient(rgba(255,255,255,.66),rgba(255,255,255,.66)),url("../img/bg-white.webp");
  background-size:cover,cover;background-position:center,center;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.sec-head{max-width:74ch;margin-bottom:2.3rem}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head p{color:var(--slate);font-size:1.04rem;margin-bottom:0}
.tag{
  display:inline-block;font-family:var(--f-sub);font-size:.78rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;color:var(--red);margin-bottom:.6rem;
}

/* Type sitting on a patterned background needs more weight and contrast than the
   same type on flat white — mid-grey at 400 disappears into the monogram. */
.section.alt p,.leadblock p,
.section.alt li,.leadblock li,
.section.alt .sec-head p,.leadblock .sec-head p{
  color:var(--ink);font-weight:500;
}
/* …but anything inside a solid white card is already on a clean backdrop, so it
   keeps the lighter secondary treatment. FAQ answers and process steps sit
   directly on the pattern, so they are deliberately NOT in this list. */
.section.alt .svc .bd,.leadblock .svc .bd,
.section.alt .svc p,.leadblock .svc p,
.section.alt .svc li,.leadblock .svc li,
.section.alt .famcard p,.leadblock .famcard p,
.section.alt .loc address,.leadblock .loc address,
.section.alt .leadform .sub,.leadblock .leadform .sub,
.section.alt .fine,.leadblock .fine{
  color:var(--slate);font-weight:400;
}
.section.alt .checks li,.leadblock .checks li{font-weight:500}

/* thin brand-pattern divider — the bold red/blue AAS tile, used sparingly */
/* native-scale slice of the bold red/blue AAS tile, repeated horizontally */
.band-blend{height:64px;background:url("../img/bg-blend-strip.webp") center top repeat-x;border-block:1px solid var(--line)}

.grid{display:grid;gap:1.4rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

/* service / content cards */
.svc{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xs);display:flex;flex-direction:column;overflow:hidden;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease);
}
.svc:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--blue-lite)}
.svc-img{aspect-ratio:3/2;overflow:hidden;background:var(--paper-2)}
.svc-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.svc:hover .svc-img img{transform:scale(1.04)}
.svc-body{padding:1.4rem 1.5rem 1.55rem;display:flex;flex-direction:column;flex:1}
.svc h3{margin-bottom:.45em;color:var(--navy)}
.svc .bd{color:var(--slate);font-size:.94rem;margin-bottom:1rem;flex:1}
.svc .more{
  font-family:var(--f-disp);font-weight:700;font-size:.86rem;color:var(--red);
  text-transform:uppercase;letter-spacing:.04em;
}
.svc .more::after{content:" →"}
/* padded card with no image (sidebars, link lists) */
.svc.plain{padding:1.5rem}
.svc.plain h3{margin-bottom:.7em}
.svc.plain ul{margin-bottom:0}

/* checklists */
.checks{list-style:none;padding:0;margin:0 0 1.5rem}
.checks li{position:relative;padding-left:1.9em;margin-bottom:.6em;color:var(--ink)}
.checks li::before{
  content:"";position:absolute;left:0;top:.42em;width:1.1em;height:.6em;
  border-left:3px solid var(--red);border-bottom:3px solid var(--red);
  transform:rotate(-45deg);border-radius:1px;
}

/* ---------- lead block + form ---------- */
.leadblock{
  background-color:var(--paper);
  background-image:linear-gradient(rgba(255,255,255,.66),rgba(255,255,255,.66)),url("../img/bg-white.webp");
  background-size:cover,cover;background-position:center,center;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:4rem 0;
}
.leadblock .split{align-items:start}
.leadform{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.8rem;box-shadow:var(--shadow)}
.leadform h3{color:var(--navy);margin-bottom:.35em}
.leadform .sub{color:var(--slate);font-size:.92rem;margin-bottom:1.3rem}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin-bottom:1rem}
.field{display:flex;flex-direction:column;gap:.3rem}
.field.full{grid-column:1/-1}
.field label{
  font-family:var(--f-sub);font-size:.78rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--slate);
}
.field input,.field select,.field textarea{
  font-family:var(--f-body);font-size:.98rem;color:var(--ink);
  padding:.7em .85em;border:1px solid var(--line);border-radius:10px;background:var(--white);
  transition:border-color .16s,box-shadow .16s;width:100%;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:var(--ring)}
.field textarea{min-height:104px;resize:vertical}
.form-note{margin-top:.9rem}
.form-status{display:none;margin-top:1rem;padding:.85em 1em;border-radius:10px;font-size:.93rem}
.form-status.ok{display:block;background:#e7f6ec;color:#146b30;border:1px solid #b6e2c4}
.form-status.err{display:block;background:#fdecec;color:var(--red-dark);border:1px solid #f3c4c4}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.step{position:relative;padding-top:.4rem}
.step .sn{
  width:46px;height:46px;border-radius:50%;background:var(--red);color:#fff;
  display:grid;place-items:center;font-family:var(--f-disp);font-weight:700;font-size:1.1rem;
  margin-bottom:.9rem;
}
.step h3{color:var(--navy)}
.step p{color:var(--slate);margin-bottom:0}

/* ---------- split / media ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:2.8rem;align-items:center}
.split.media-right .media{order:2}
.media .frame{
  border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);
  box-shadow:var(--shadow);background:var(--paper-2);
}
.media .frame img{width:100%}
.media figcaption{
  font-size:.82rem;color:var(--slate);margin-top:.7rem;text-align:center;font-style:italic;
}
.badge{
  display:inline-flex;flex-direction:column;background:var(--white);border:1px solid var(--line);
  border-radius:var(--radius);padding:.9rem 1.15rem;box-shadow:var(--shadow-sm);
}
.badge .bn{font-family:var(--f-disp);font-weight:700;font-size:1.35rem;color:var(--navy);line-height:1}
.badge .bt{font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--slate);margin-top:.3rem}

/* ---------- financing ---------- */
.finance{display:grid;grid-template-columns:1.14fr .86fr;gap:3.2rem;align-items:start}
.finance .eyebrow{
  display:inline-block;font-family:var(--f-sub);font-size:.78rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;color:var(--red);margin-bottom:.6rem;
}
/* definition rows read as terms, not as a marketing tick-list */
.fin-facts{margin:1.7rem 0 1.9rem;border-top:1px solid var(--line)}
.fin-facts>div{
  display:grid;grid-template-columns:9rem 1fr;gap:1.2rem;
  padding:.9rem 0;border-bottom:1px solid var(--line);
}
.fin-facts dt{
  font-family:var(--f-sub);font-weight:700;font-size:.76rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--red);padding-top:.15em;
}
.fin-facts dd{margin:0;color:var(--ink);font-weight:500}

.fin-panel{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow);
}
.fin-panel-head{
  background:var(--navy);color:#fff;padding:.95rem 1.4rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  font-family:var(--f-disp);font-weight:700;font-size:.9rem;
  text-transform:uppercase;letter-spacing:.06em;
}
.fin-panel-head .fph-secure{
  font-family:var(--f-body);font-size:.68rem;font-weight:600;letter-spacing:.1em;
  color:var(--sky);white-space:nowrap;
}
.fin-panel-body{padding:1.5rem 1.4rem 1.4rem}
.fin-lender{
  font-family:var(--f-disp);font-size:1.14rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.01em;color:var(--navy);margin-bottom:.15em;line-height:1.2;
}
.fin-fdic{
  font-size:.68rem;letter-spacing:.11em;text-transform:uppercase;color:var(--slate-lite);
  margin-bottom:1.1rem;
}
.fin-panel-body p{color:var(--slate);font-size:.94rem}
.fin-panel-body .btn{margin:.4rem 0 1rem}
.fin-panel-body .fc-sub{font-size:.75rem;color:var(--slate-lite);margin-bottom:0;line-height:1.55}
/* inline emphasis, not a display-face shout mid-sentence */
.finance-partner{font-weight:600;color:var(--navy)}

/* ---------- blog ---------- */
.postgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.post{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow-xs);display:flex;flex-direction:column;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease);
}
.post:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--blue-lite)}
.post-img{aspect-ratio:3/2;overflow:hidden;background:var(--paper-2)}
.post-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.post:hover .post-img img{transform:scale(1.04)}
.post-body{padding:1.35rem 1.5rem 1.5rem;display:flex;flex-direction:column;flex:1}
.post-meta{
  display:flex;flex-wrap:wrap;gap:.4rem .8rem;align-items:center;margin-bottom:.7rem;
  font-family:var(--f-sub);font-size:.72rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;
}
.post-cat{color:var(--red)}
.post-date{color:var(--slate-lite)}
.post h3{margin-bottom:.5em;color:var(--navy);font-size:1.08rem;line-height:1.22}
.post h3 a{color:inherit}
.post h3 a:hover{color:var(--blue);text-decoration:none}
.post .dek{color:var(--slate);font-size:.93rem;flex:1;margin-bottom:1rem}
.post .more{
  font-family:var(--f-disp);font-weight:700;font-size:.84rem;color:var(--red);
  text-transform:uppercase;letter-spacing:.04em;
}
.post .more::after{content:" →"}

/* single post */
.article{max-width:none}
.article-head{max-width:52rem}
.article-body{max-width:44rem;font-size:1.04rem}
.article-body h2{margin-top:2.5rem;font-size:clamp(1.3rem,2.2vw,1.7rem)}
.article-body h3{margin-top:1.9rem;font-size:1.08rem}
.article-body ul,.article-body ol{margin-bottom:1.3rem}
.article-body li{margin-bottom:.55em}
.article-body .callout{
  border-left:4px solid var(--red);background:var(--paper);
  padding:1.1rem 1.3rem;border-radius:0 var(--radius) var(--radius) 0;margin:1.8rem 0;
}
.article-body .callout p:last-child{margin-bottom:0}
.article-body .callout strong{color:var(--navy)}
.article-figure{margin:2rem 0}
.article-figure img{border-radius:var(--radius);border:1px solid var(--line)}
.article-figure figcaption{font-size:.82rem;color:var(--slate);margin-top:.6rem;font-style:italic}
.byline{
  display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;align-items:center;
  padding:1rem 0;border-block:1px solid var(--line);margin-bottom:2rem;
  font-size:.86rem;color:var(--slate);
}
.byline b{color:var(--navy);font-family:var(--f-disp);text-transform:uppercase;letter-spacing:.02em}
.sources{font-size:.84rem;color:var(--slate);border-top:1px solid var(--line);padding-top:1.2rem;margin-top:2.4rem}
.sources h3{font-size:.78rem;letter-spacing:.1em;color:var(--slate);margin-bottom:.6em}
.sources ul{padding-left:1.1em;margin-bottom:0}

@media (max-width:1000px){
  .postgrid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:880px){
  .finance{grid-template-columns:1fr;gap:2rem}
  .fin-facts>div{grid-template-columns:1fr;gap:.15rem}
  .hero-grid{grid-template-columns:1fr;gap:2.6rem;padding:3.2rem 0 3.6rem}
  .hero-copy{max-width:none}
  .ha-inset{left:auto;right:-14px;bottom:-20px;width:38%}
}
@media (max-width:560px){
  .postgrid{grid-template-columns:1fr}
  .ha-inset{display:none}
}

/* ---------- gallery ---------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.gallery figure{margin:0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-xs);background:var(--paper-2)}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .4s var(--ease)}
.gallery figure:hover img{transform:scale(1.05)}
.gallery .wide{grid-column:span 2}
.gallery .wide img{aspect-ratio:2/1}

/* ---------- bands ---------- */
.band-blue{background:var(--navy);color:#fff;padding:3.4rem 0}
.band-blue h2{color:#fff}
.band-blue p{color:#ccd9f2}
.band-blue a{color:var(--sky)}

/* ---------- locations ---------- */
.loc{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1.7rem;box-shadow:var(--shadow-xs);display:flex;flex-direction:column;
}
.loc h3{color:var(--navy);margin-bottom:.15em}
.loc h3 small{font-size:.6em;color:var(--slate);font-weight:600}
.loc .who{
  font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red);
  font-weight:700;margin-bottom:.9rem;font-family:var(--f-sub);
}
.loc address{font-style:normal;color:var(--slate);font-size:.94rem;margin-bottom:.9rem}
.loc .scope{list-style:none;padding:0;margin:0 0 1.2rem}
.loc .scope li{font-size:.9rem;color:var(--ink);padding-left:1.4em;position:relative;margin-bottom:.32em}
.loc .scope li::before{content:"▪";position:absolute;left:0;color:var(--blue);font-size:1.1em;line-height:1}
.loc .tel{font-family:var(--f-disp);font-weight:700;font-size:1.24rem;color:var(--navy);margin-bottom:.9rem;display:inline-block}
.loc .tel:hover{text-decoration:none;color:var(--blue)}
.town-links{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.town-links a{font-size:.86rem;background:var(--white);border:1px solid var(--line);border-radius:999px;padding:.38em .9em;color:var(--ink)}
.town-links a:hover{background:var(--blue);color:#fff;border-color:var(--blue);text-decoration:none}

/* ---------- brand family / DBA cards ---------- */
.fam{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem}
.famcard{border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.6rem;background:var(--white);box-shadow:var(--shadow-xs)}
.famcard h3{color:var(--navy);margin-bottom:.2em}
.famcard .who{
  font-family:var(--f-sub);font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--slate);font-weight:700;margin-bottom:.8rem;
}
.famcard p{color:var(--slate);font-size:.94rem}

/* ---------- faq ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:1.1rem 0}
.faq summary{
  cursor:pointer;font-family:var(--f-disp);font-weight:700;font-size:1.02rem;color:var(--navy);
  list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;
  text-transform:uppercase;letter-spacing:.01em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;line-height:1;color:var(--red);flex:0 0 auto}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:.9rem 0 0;color:var(--slate)}

/* ---------- cta ---------- */
.cta-blaze{
  position:relative;color:#fff;padding:3.6rem 0;
  background-image:linear-gradient(120deg,rgba(156,21,25,.94),rgba(210,35,42,.80)),url("../img/bg-red.webp");
  background-size:cover,cover;background-position:center,center;
}
.cta-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:2.4rem;align-items:center}
.cta-left h2{color:#fff;margin-bottom:.4em}
.cta-sub{color:#f8dcdd;font-size:1.05rem;margin-bottom:1.3rem}
.cta-trust{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;font-size:.86rem;color:#f2d2d3}
.cta-card{background:rgba(0,0,0,.24);border:1px solid rgba(255,255,255,.24);border-radius:var(--radius-lg);padding:1.6rem;text-align:center}
.cta-card .num{font-size:1.95rem;margin-bottom:.2rem}
.cta-card .lbl{color:#f8dcdd}
.cta-card .btn{margin-top:1.1rem}

/* ---------- footer ---------- */
.site-footer{background:var(--navy);color:#a6b5d2;padding:3.4rem 0 1.6rem;font-size:.93rem}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2rem;margin-bottom:2.4rem}
.site-footer h4{
  font-family:var(--f-sub);font-size:.8rem;letter-spacing:.13em;text-transform:uppercase;
  color:#fff;margin-bottom:1rem;font-weight:700;
}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.5em}
.site-footer a{color:#a6b5d2}
.site-footer a:hover{color:#fff}
.fbrand img{width:78px;height:78px;margin-bottom:.9rem}
.site-footer .fbrand b{
  display:block;font-family:var(--f-disp);font-size:1.14rem;font-weight:700;color:#fff;
  margin-bottom:.35rem;text-transform:uppercase;
}
.site-footer address{font-style:normal;margin-bottom:1rem}
.lic{font-size:.82rem;color:#8697b8;line-height:1.7}
.foot-bot{border-top:1px solid rgba(255,255,255,.13);padding-top:1.3rem;display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;font-size:.84rem;color:#8697b8}
.foot-bot .tb-right{margin-left:auto}

/* ---------- page header (interior) ---------- */
.pagehead{
  position:relative;color:#fff;padding:3.1rem 0 2.8rem;overflow:hidden;
  background-image:linear-gradient(105deg,rgba(12,27,86,.95) 0%,rgba(12,27,86,.82) 55%,rgba(38,64,139,.66) 100%),url("../img/bg-blue.webp");
  background-size:cover,cover;background-position:center,center;
}
.pagehead .wrap{position:relative}
.pagehead h1{color:#fff;margin-bottom:.35em;font-size:clamp(1.75rem,3.7vw,2.75rem)}
.pagehead p{color:#ccd9f2;max-width:64ch;margin-bottom:0;font-size:1.04rem}
.crumbs{font-size:.83rem;color:var(--sky);margin-bottom:.9rem}
.crumbs a{color:var(--sky)}
.crumbs span{color:#7d93bd;margin:0 .4em}

/* ---------- prose ---------- */
.prose{max-width:72ch}
.prose h2{margin-top:2.4rem}
.prose h3{margin-top:1.8rem;color:var(--navy)}
.prose ul li{margin-bottom:.5em}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .grid-4,.gallery{grid-template-columns:repeat(2,1fr)}
  .gallery .wide{grid-column:span 2}
  .stats .wrap{grid-template-columns:repeat(2,1fr);gap:1.6rem}
  .cta-grid{grid-template-columns:1fr}
}
/* Six nav tabs plus the wordmark, phone and button need ~1400px to coexist, which
   is wider than most laptops. So between the breakpoints we shed the least
   valuable elements first — the Request Service button (the phone is the real
   conversion), then the tagline and some wordmark size — and only fall back to
   the hamburger when the tabs themselves stop fitting. */
@media (max-width:1330px){
  .header-cta .btn{display:none}
}
@media (max-width:1200px){
  .brand-logo b{font-size:1rem}
  .brand-logo span{display:none}
  .brand-logo img{width:48px;height:48px}
}
@media (max-width:1140px){
  .nav{
    display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;
    align-items:stretch;background:var(--white);border-bottom:1px solid var(--line);
    box-shadow:var(--shadow);padding:.6rem;max-height:76vh;overflow:auto;
  }
  .nav.open{display:flex}
  .nav>li>a{padding:.75em .9em}
  .nav .menu{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;border-left:2px solid var(--line);border-radius:0;margin:0 0 .4rem .9rem;padding:0 0 0 .4rem;
  }
  .nav-toggle{display:block}
  .header-cta{margin-left:auto}
  .header-cta .btn{display:none}
}
@media (max-width:880px){
  .split,.grid-2,.grid-3,.fam,.steps{grid-template-columns:1fr}
  .split.media-right .media{order:0}
  .tb-hide{display:none}
  .hero-inner{padding:3.2rem 0 3rem}
  .section{padding:3.2rem 0}
}
@media (max-width:700px){
  .brand-logo span{display:none}
  .brand-logo b{font-size:1rem}
  .brand-logo img{width:46px;height:46px}
  /* let the topbar strapline wrap instead of forcing the page wide */
  .tb-item{white-space:normal}
}
@media (max-width:470px){
  /* header becomes two rows: wordmark, then phone + menu button */
  .site-header .wrap{flex-wrap:wrap}
  .header-cta{width:100%;margin-left:0;justify-content:space-between}
  .header-call{font-size:1.02rem}
}
@media (max-width:560px){
  body{font-size:16px}
  .grid-4,.foot-grid,.gallery{grid-template-columns:1fr}
  .gallery .wide{grid-column:span 1}
  .fgrid{grid-template-columns:1fr}
  .hero-cta .btn{width:100%}
  .stats .wrap{grid-template-columns:1fr;gap:1.3rem}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

@media print{
  .site-header,.topbar,.nav,.cta-blaze,.leadblock,.site-footer,.band-blend{display:none}
  body{font-size:12pt;color:#000}
  .hero-bg,.pagehead{background:none!important}
  .hero h1,.pagehead h1,.pagehead p{color:#000!important}
}
