/* AQR Dumpster Rental Anderson — styles.css
   Palette: real colors sampled directly from the client's supplied logo file — navy #183860
   (the "AQR" / "ANDERSON" wordmark fill) and blue #2080b8 (the "DUMPSTER RENTAL" text / dumpster
   icon fill). THEME_BLUE_DARK (#0f2440) is a derived, further-darkened blend of the sampled navy
   for structural/CTA backgrounds, and THEME_BLUE_MID/THEME_BLUE_LIGHT are derived blends toward
   white for accents and section washes — every dark and light tone here stays traceable back to
   the two real logo samples, the same discipline every build in this lineage follows. NEW to this
   build: a pine/emerald green accent — #1f7a4d, dark #12502f, light tint #d7ecdf — not sampled
   from the logo, but genuinely grounded in the real Blue Ridge foothills greenery and Lake
   Hartwell country around Anderson County. Gold/amber and orange accent families are already used
   elsewhere in this lineage; pine green is genuinely new here.

   Shape/motif system: a "circuit-bolt" line — a right-angled circuit-trace stroke ending in a
   small spark dot — grounded in Anderson's real "Electric City" history (one of the first
   Southern cities with electric streetlights, 1897, powered by hydroelectric generation on the
   Seneca River). It is drawn once, small, wherever `common.py`'s `eyebrow()` needs it (inline SVG,
   sized/aligned here) and echoed faintly as a repeating trace-and-node rule under every page hero
   — never as a literal lightning-bolt graphic, never plastered across every component. Everywhere
   else the shape language is a modest, confident rectangle: corners round just enough to feel
   built rather than stamped (10px cards, 8px controls), never the full stadium-pill rounding the
   previous sibling used for every button and chip. Cards and panels carry a thin rule on the
   *left* edge in the accent color — a single trace line running down the side, not a top bar or a
   bevel — and the trust-bar "chip" reads as a small IC-style component: a rounded-square (not a
   circle) with a pine ring and a single corner "pin" dot, nodding to circuit hardware without
   spelling it out. No parallelogram tick, keystone trapezoid, shield, rail-tie, wave, chevron,
   steel-plate corner, medallion/chord-band, mesa/plateau or stepped-mesa shape appears anywhere in
   this build — those belong to other builds in this lineage.

   Headings run in Barlow Semi Condensed, a sturdy, slightly condensed grotesque with real
   trucking/industrial signage character — legible at large display sizes without the heaviness of
   a full display face. Body copy runs in Nunito Sans, a warm, highly rounded, highly legible
   humanist sans that keeps long-form prose and legal copy comfortable to read. 12th distinct font
   pairing in this lineage — not used by any prior sibling (Janesville: Archivo/Instrument Sans;
   Frederick: Zilla Slab/Inter; Spartanburg: Oswald/Work Sans; Reading: Poppins/Source Sans 3;
   Beaufort: Fraunces/Public Sans; Blue Bull Buffalo: Archivo Black/Manrope; Big Barry's: Anton/
   Work Sans; MCK: Bebas Neue/DM Sans; Steele Bros: Big Shoulders Display/Inter; Herbert Bros:
   Urbanist/Karla). Both the font pairing and the circuit-bolt/trace-rule motif system are new to
   this build family — no prior sibling site uses them. */
:root{
  /* ---- brand: exact hex values from common.py (THEME_NAVY / THEME_BLUE / THEME_BLUE_DARK /
     THEME_BLUE_MID / THEME_BLUE_LIGHT), sampled from the real AQR logo file ---- */
  --blue-dark:#0f2440;   /* THEME_BLUE_DARK — deep ink, section panels */
  --navy:#183860;        /* THEME_NAVY — sampled navy, buttons, borders, brand marks */
  --navy-mid:#1a5187;    /* derived mid-tone between navy and blue — links, labels, hover states */
  --blue:#2080b8;        /* THEME_BLUE — sampled blue — primary brand color */
  --blue-mid:#5aa8d0;    /* THEME_BLUE_MID — hover states, rules */
  --ice:#a9cfe4;         /* derived light blue — icon tint on dark backgrounds */
  --blue-light:#e7f2f8;  /* THEME_BLUE_LIGHT — soft section backgrounds/washes */
  /* ---- accent: pine/emerald green, new to this lineage — exact hex values from common.py
     THEME_ACCENT / THEME_ACCENT_DARK / THEME_ACCENT_LIGHT ---- */
  --accent:#1f7a4d; --accent-dark:#12502f; --accent-light:#d7ecdf;
  /* ---- neutrals ---- */
  --ink:#1c2430; --ink-2:#4b5262; --muted:#6c7689;
  --bg:#ffffff; --bg-soft:#e7f2f8; --bg-tint:#d9e9f2;
  --line:#dde3ea; --line-soft:#eceff4;
  --white:#fff;
  --sans:'Nunito Sans',-apple-system,system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --head:'Barlow Semi Condensed',-apple-system,system-ui,'Segoe UI',Roboto,Arial,sans-serif;
  --wrap:1200px; --gut:20px;
  /* ---- shape motif: modest, confident rectangles — corners round just enough to feel built,
     not stamped. No full-pill rounding on buttons/cards/chips (that language belongs to the
     previous sibling); --r-pill is kept only for small dot/rule details ---- */
  --r-sm:6px; --r:10px; --r-lg:16px; --r-card:10px; --r-btn:8px; --r-pill:999px;
  /* circuit-trace tile: a thin repeating trace-and-node line — echoes the eyebrow's circuit-bolt
     tick, used once as a section-break rule under every page hero */
  --circuit-tile:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 14'%3E%3Cpath d='M0 7H10V3H24V11H38V7H48' fill='none' stroke='%231f7a4d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' opacity='.55'/%3E%3Ccircle cx='24' cy='11' r='1.7' fill='%23d7ecdf'/%3E%3Ccircle cx='10' cy='3' r='1.3' fill='%23d7ecdf' opacity='.8'/%3E%3C/svg%3E");
  --sh-1:0 1px 0 rgba(15,36,64,.07),0 2px 8px rgba(15,36,64,.09);
  --sh-2:0 8px 22px rgba(15,36,64,.18);
  --sh-3:0 18px 46px rgba(15,36,64,.26);
  --t:.16s cubic-bezier(.4,0,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
body{margin:0;font-family:var(--sans);font-size:17px;line-height:1.65;color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,iframe{max-width:100%}
img{height:auto;display:block}
h1,h2,h3{font-family:var(--head);color:var(--navy);line-height:1.1;margin:0 0 .5em;letter-spacing:-.005em;
  font-weight:700;text-transform:none}
h4{font-family:var(--head);font-weight:700;text-transform:none;letter-spacing:-.005em;line-height:1.28;color:var(--navy);margin:0 0 .5em}
h1{font-size:clamp(2.2rem,1.45rem + 2.9vw,3.65rem);line-height:1.04;font-weight:800}
h2{font-size:clamp(1.6rem,1.2rem + 1.55vw,2.4rem);font-weight:700}
h3{font-size:clamp(1.18rem,1.05rem + .5vw,1.42rem);line-height:1.2;font-weight:700}
h4{font-size:1.08rem}
p{margin:0 0 1.05em}
a{color:var(--navy-mid);text-decoration:none;transition:color var(--t)}
a:hover{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
ul,ol{margin:0 0 1.15em;padding-left:1.25em}
li{margin:0 0 .45em}
strong{font-weight:700;color:var(--navy)}
hr{border:0;border-top:1px solid var(--line);margin:2.4rem 0}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--navy);color:#fff;padding:12px 18px;border-radius:0 0 var(--r) 0;font-weight:700}
.skip:focus{left:0}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.ico{width:22px;height:22px;flex:0 0 auto}

/* ---------- buttons (modest rounded rectangle, not a pill — a thin trace-line grows in from
   the left on hover, a small nod to the circuit motif without literal iconography) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--head);
  font-weight:700;font-size:1.04rem;letter-spacing:.02em;text-transform:uppercase;padding:.78em 1.6em;border-radius:var(--r-btn);
  border:2px solid transparent;cursor:pointer;transition:transform var(--t),box-shadow var(--t),background var(--t),color var(--t),border-color var(--t);
  text-decoration:none;line-height:1.15;text-align:center;position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:rgba(255,255,255,.85);transition:width var(--t)}
.btn:hover::after{width:100%}
.btn:hover{text-decoration:none;transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn .ico{width:19px;height:19px}
/* white text on the pine-green fill clears ~5.1:1 default, ~7.3:1 on the darker hover fill —
   verified against WCAG, comfortable for bold uppercase button text */
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 4px 13px rgba(31,122,77,.35)}
.btn-primary:hover{background:var(--accent-dark);color:#fff;box-shadow:0 9px 20px rgba(31,122,77,.42)}
.btn-primary:active{box-shadow:0 2px 7px rgba(31,122,77,.32)}
.btn-red{background:var(--accent);color:#fff;box-shadow:0 4px 13px rgba(31,122,77,.35)}
.btn-red:hover{background:var(--accent-dark);color:#fff;box-shadow:0 9px 20px rgba(31,122,77,.42)}
.btn-red:active{box-shadow:0 2px 7px rgba(31,122,77,.32)}
.btn-navy{background:var(--navy);color:#fff;box-shadow:0 4px 13px rgba(24,56,96,.34)}
.btn-navy:hover{background:var(--navy-mid);color:#fff;box-shadow:0 9px 20px rgba(24,56,96,.4)}
.btn-navy:active{box-shadow:0 2px 7px rgba(24,56,96,.34)}
.btn-white{background:#fff;color:var(--navy);box-shadow:0 4px 13px rgba(15,36,64,.18)}
.btn-white:hover{background:var(--blue-light);color:var(--blue-dark);box-shadow:0 9px 20px rgba(15,36,64,.22)}
.btn-white:active{box-shadow:0 2px 7px rgba(15,36,64,.18)}
.btn-white::after{background:var(--accent)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn-ghost:hover{background:rgba(255,255,255,.14);color:#fff;border-color:#fff;transform:translateY(-2px)}
.btn-ghost:active{transform:translateY(0)}
.sec .btn-ghost{color:var(--navy);border-color:var(--navy)}
.sec .btn-ghost:hover{background:var(--navy);color:#fff}
.btn-lg{font-size:1.12rem;padding:.88em 1.9em}
.btnrow{display:flex;flex-wrap:wrap;gap:14px;margin:1.4rem 0 0;align-items:stretch}

/* ---------- eyebrow (signature motif: circuit-bolt tick — a right-angled trace line ending in
   a spark dot, drawn inline by common.py's eyebrow() as an <svg class="tick"> in the pine-green
   accent — sized/aligned here, no fill/background of our own layered behind it) ---------- */
.eyebrow{display:flex;align-items:center;gap:.6em;font-family:var(--head);font-weight:700;
  text-transform:uppercase;letter-spacing:.09em;font-size:.83rem;color:var(--navy-mid);margin:0 0 .75em}
.eyebrow .tick{display:inline-block;width:22px;height:10px;flex:0 0 auto}
.hero .eyebrow,.ctaband .eyebrow{color:var(--ice)}

/* ---------- topbar / header ---------- */
.topbar{background:var(--blue-dark);color:#c3d7ee;font-size:.83rem}
.topbar-in{display:flex;gap:26px;align-items:center;justify-content:space-between;min-height:38px;flex-wrap:wrap}
.tb-item{display:inline-flex;align-items:center;gap:.5em}
.tb-item .ico{width:15px;height:15px;color:var(--ice)}
.site-head{position:sticky;top:0;z-index:60;background:#fff;border-bottom:3px solid var(--navy);box-shadow:var(--sh-1)}
.head-in{display:flex;align-items:center;gap:14px;min-height:78px;flex-wrap:nowrap;min-width:0}
.brand{display:flex;align-items:center;gap:11px;flex:0 1 auto;text-decoration:none;min-width:0;overflow:hidden}
.brand:hover{text-decoration:none}
.brand img{height:58px;width:auto;flex:0 0 auto}
.brand-word{font-family:var(--head);font-weight:700;font-size:.86rem;line-height:1.15;color:var(--navy);
  text-transform:uppercase;letter-spacing:.03em;padding-left:13px;border-left:4px solid var(--blue);white-space:nowrap}
.brand-word small{display:block;font-family:var(--sans);font-weight:700;font-size:.6rem;letter-spacing:.08em;
  color:var(--muted);text-transform:uppercase;margin-top:4px}
.mainnav{margin-left:auto}
.navlist{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.navlist>li{position:relative;margin:0}
.navlist>li>a{display:block;padding:11px 13px;font-family:var(--head);font-weight:700;font-size:.9rem;white-space:nowrap;
  text-transform:uppercase;letter-spacing:.02em;color:var(--navy);border-radius:var(--r-sm);transition:background var(--t),color var(--t);position:relative}
.navlist>li>a:hover{background:var(--bg-tint);color:var(--navy-mid);text-decoration:none}
.navlist>li>a[aria-current="page"],.navlist>li>a.is-active{color:var(--navy-mid)}
.navlist>li>a[aria-current="page"]::after,.navlist>li>a.is-active::after{content:"";position:absolute;left:13px;right:13px;
  bottom:5px;height:3px;border-radius:1px;background:var(--accent)}
.has-sub>a::after{content:"";display:inline-block;width:6px;height:6px;margin-left:7px;vertical-align:2px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px)}
.sub{position:absolute;top:100%;left:0;min-width:268px;max-height:70vh;overflow-y:auto;background:#fff;border:1px solid var(--line);border-top:3px solid var(--blue);
  border-radius:0 0 var(--r) var(--r);box-shadow:var(--sh-3);padding:8px;list-style:none;margin:6px 0 0;opacity:0;visibility:hidden;
  transform:translateY(8px);transition:opacity var(--t),transform var(--t),visibility var(--t);z-index:70}
.has-sub:hover>.sub,.has-sub:focus-within>.sub{opacity:1;visibility:visible;transform:translateY(0)}
.sub li{margin:0}
.sub a{display:block;padding:9px 12px;border-radius:var(--r-sm);font-size:.9rem;font-weight:600;color:var(--ink-2);text-transform:none;font-family:var(--sans)}
.sub a:hover{background:var(--bg-tint);color:var(--navy-mid);text-decoration:none}
.sub-toggle{display:none}
.head-call{flex:0 0 auto;white-space:nowrap}
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:46px;height:44px;padding:0 10px;
  background:var(--navy);border:0;border-radius:var(--r-sm);cursor:pointer;margin-left:auto}
.burger span{display:block;height:3px;background:#fff;border-radius:1px;transition:transform var(--t),opacity var(--t)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.navscrim{position:fixed;inset:0;background:rgba(15,36,64,.5);z-index:58;backdrop-filter:blur(2px)}

/* ---------- hero (deep navy field, a faint circuit-trace rule at the base instead of a mesa
   tideline or a glowing sun disc) ---------- */
.hero{position:relative;background:linear-gradient(155deg,var(--blue-dark) 0%,var(--navy) 55%,var(--navy-mid) 100%);
  color:#e7edfa;overflow:hidden;isolation:isolate;border-top:10px solid var(--blue)}
.hero::before{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;z-index:0;pointer-events:none;
  background:linear-gradient(var(--blue),var(--navy-mid))}
.hero::after{content:"";position:absolute;right:-8%;top:-18%;width:min(420px,50vw);aspect-ratio:1;
  background:
    linear-gradient(rgba(31,122,77,.16) 2px,transparent 2px) 0 0/100% 34px,
    linear-gradient(90deg,rgba(31,122,77,.16) 2px,transparent 2px) 0 0/34px 100%;
  -webkit-mask-image:radial-gradient(circle,#000 55%,transparent 78%);mask-image:radial-gradient(circle,#000 55%,transparent 78%);
  z-index:0;pointer-events:none}
.hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center;padding-block:clamp(46px,6vw,84px)}
.hero-copy{min-width:0}
.hero h1{color:#fff;margin-bottom:.42em;text-wrap:balance}
.hero .lede{font-size:clamp(1.03rem,.97rem + .34vw,1.22rem);color:#d3e2f6;max-width:60ch;margin-bottom:0}
.hero-ticks{list-style:none;padding:0;margin:1.6rem 0 0;display:flex;flex-wrap:wrap;gap:10px 26px}
.hero-ticks li{display:flex;align-items:center;gap:.55em;margin:0;font-weight:700;font-size:.94rem;color:#e0eafb}
.hero-ticks .ico{width:18px;height:18px;flex:0 0 18px;padding:2px;background:var(--accent-light);color:var(--navy);border-radius:4px}
.hero-media{position:relative}
.hero-media img{border-radius:var(--r-lg);box-shadow:0 24px 56px rgba(6,16,28,.55);border:5px solid #fff;object-fit:cover;width:100%;height:auto;min-height:min(520px,50vw);aspect-ratio:1408/768}
.hero-badge{position:absolute;left:-14px;bottom:-18px;background:var(--blue-dark);color:#fff;border-radius:var(--r) var(--r-lg) var(--r-lg) var(--r);
  padding:14px 22px 14px 18px;box-shadow:var(--sh-3);display:flex;align-items:center;gap:12px;max-width:78%;border-left:6px solid var(--accent)}
@media (max-width:1000px){.hero-badge{position:static;max-width:none;margin-top:14px;left:auto;bottom:auto}}
.hero-badge .ico{width:28px;height:28px;color:var(--ice)}
.hero-badge strong{display:block;font-family:var(--head);font-weight:800;font-size:1.1rem;line-height:1.15;letter-spacing:-.005em}
.hero-badge span{font-size:.83rem;color:#b9cbe6}
.hero-page .hero-in{padding-block:clamp(36px,4.4vw,60px)}
.hero-page h1{font-size:clamp(1.95rem,1.35rem + 2.2vw,2.95rem)}
.hero-tideline{position:relative;height:16px;z-index:1;background-color:var(--navy);background-image:var(--circuit-tile);
  background-repeat:repeat-x;background-position:bottom left;background-size:48px 14px}
.hero-tideline::after{content:"";display:block;height:6px;background:var(--blue-dark)}

/* ---------- crumbs ---------- */
.crumbs{background:var(--bg-soft);border-bottom:1px solid var(--line-soft);font-size:.845rem}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.45em;padding:11px 0;margin:0;color:var(--muted)}
.crumbs li{margin:0;display:flex;align-items:center}
.crumbs li+li::before{content:"/";margin-right:.55em;color:#b7c0d0}
.crumbs a{color:var(--ink-2);font-weight:700}

/* ---------- trust bar (signature motif: an IC-style chip — rounded square, not a circle — navy
   fill, thin pine ring, one small "pin" dot at the top-left corner) ---------- */
.trust{background:var(--bg-soft);border-bottom:1px solid var(--line-soft)}
.trust-list{list-style:none;margin:0;padding:26px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.trust-list>*{min-width:0}
.trust-item>div{min-width:0}
.trust-item{display:flex;align-items:flex-start;gap:14px;margin:0}
.trust-chip{position:relative;width:50px;height:50px;flex:0 0 50px;display:flex;align-items:center;justify-content:center;
  border-radius:14px;background:var(--navy);border:2px solid var(--accent);
  box-shadow:0 4px 10px rgba(15,36,64,.22)}
.trust-chip::before{content:"";position:absolute;top:-3px;left:-3px;width:6px;height:6px;border-radius:50%;
  background:var(--accent-light);box-shadow:0 0 0 2px var(--navy)}
.trust-chip .ico{width:21px;height:21px;color:var(--accent-light)}
.trust-item strong{display:block;font-family:var(--sans);font-weight:800;font-size:1rem;color:var(--navy);line-height:1.25}
.trust-item span{display:block;font-size:.87rem;color:var(--muted);line-height:1.45;margin-top:2px}

/* ---------- sections ---------- */
.sec{padding-block:clamp(44px,5.4vw,76px)}
.sec-alt{background:var(--bg-soft)}
.sec-head{max-width:74ch;margin-bottom:2.1rem}
.sec-head h2{margin-bottom:.35em;text-wrap:balance}
.sec-sub{color:var(--ink-2);font-size:1.04rem;margin:0}
.sec-narrow .wrap{max-width:900px}
.sec-faq{background:var(--bg-soft)}
.sec-contact{padding-top:clamp(36px,4.6vw,64px)}
.sec-links{background:var(--bg-soft)}
.prose{max-width:76ch}
.prose a{overflow-wrap:anywhere}
.prose h2{margin-top:1.9em}
.prose h3{margin-top:1.5em}
.prose>:first-child{margin-top:0}
.prose ul li,.prose ol li{margin-bottom:.55em}

/* ---------- cards (modest rounded rectangle, thin border, a single pine trace rule down the
   LEFT edge — not a top bar, not a bevel — that thickens slightly on hover) ---------- */
.cards{list-style:none;margin:0;padding:0;display:grid;gap:22px}
.cards>*{min-width:0}
.cards-2{grid-template-columns:repeat(2,1fr)}
.cards-3{grid-template-columns:repeat(3,1fr)}
.cards-4{grid-template-columns:repeat(4,1fr)}
.card{position:relative;margin:0;background:#fff;border:1px solid var(--line);border-left:4px solid var(--accent);
  border-radius:var(--r-card);
  padding:26px 22px 22px;box-shadow:var(--sh-1);
  transition:transform var(--t),box-shadow var(--t),border-color var(--t);display:flex;flex-direction:column;min-width:0}
.card:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-left-color:var(--navy)}
.card-ico{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;
  border-radius:10px;background:var(--navy);color:var(--accent-light);margin-bottom:14px}
.card-ico .ico{width:23px;height:23px}
.card h3{margin-bottom:.4em}
.card h3 a{color:var(--navy)}
.card h3 a:hover{color:var(--navy-mid);text-decoration:none}
.card p{color:var(--ink-2);font-size:.95rem;margin-bottom:1em}
.card-link{margin-top:auto;display:inline-flex;align-items:center;gap:.45em;font-family:var(--sans);
  font-weight:800;font-size:.9rem;text-transform:uppercase;letter-spacing:.03em;color:var(--navy-mid)}
.card-link .ico{width:17px;height:17px;transition:transform var(--t)}
.card-link:hover{text-decoration:none}
.card-link:hover .ico{transform:translateX(4px)}
.sec-alt .card{background:#fff}

/* ---------- steps (a squared-off number tile, not a circle medallion — echoes the trust chip) ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:s}
.step{margin:0;position:relative;padding-top:6px}
.step-n{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:10px;background:var(--accent);color:#fff;font-family:var(--head);font-weight:800;font-size:1.3rem;margin-bottom:13px;
  box-shadow:0 4px 10px rgba(31,122,77,.4)}
.step h3{margin-bottom:.35em}
.step p{color:var(--ink-2);font-size:.95rem;margin:0}

/* ---------- split / feature ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.split>*{min-width:0}
.split-media img{border-radius:var(--r-lg);box-shadow:var(--sh-2);width:100%;aspect-ratio:1408/768;object-fit:cover}
.split-copy>:last-child{margin-bottom:0}
.checklist{list-style:none;padding:0;margin:1.1rem 0}
.checklist li{display:flex;gap:.7em;align-items:flex-start;margin-bottom:.7em;font-size:.98rem}
.checklist .ico{width:20px;height:20px;flex:0 0 20px;margin-top:2px;padding:3px;background:var(--blue-light);color:var(--navy);border-radius:6px}
.fig{margin:1.8rem 0}
.fig img{border-radius:var(--r);box-shadow:var(--sh-1);width:100%}
.fig figcaption{font-size:.85rem;color:var(--muted);margin-top:.6em;text-align:center;font-style:italic}

/* ---------- team grid (rounded photo cards, thin pine rule under the photo) ---------- */
.team-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.team-card{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);
  box-shadow:var(--sh-1);overflow:hidden;transition:transform var(--t),box-shadow var(--t)}
.team-card:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.team-photo{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;background:var(--bg-tint)}
.team-body{padding:16px 18px 20px;border-top:3px solid var(--accent)}
.team-name{font-family:var(--sans);font-weight:800;font-size:1.05rem;color:var(--navy);margin:0}
.team-role{display:block;font-family:var(--sans);font-weight:700;font-size:.8rem;text-transform:uppercase;
  letter-spacing:.07em;color:var(--navy-mid);margin:.25em 0 .6em}
.team-bio{color:var(--ink-2);font-size:.92rem;margin:0}

/* ---------- tables ---------- */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.5rem 0;border-radius:var(--r);
  border:1px solid var(--line);background:#fff}
table{border-collapse:collapse;width:100%;font-size:.94rem}
.tbl-compare{min-width:640px}
th,td{padding:12px 15px;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:top}
thead th{background:var(--blue-dark);color:#fff;font-family:var(--head);font-weight:700;font-size:.9rem;
  text-transform:uppercase;letter-spacing:.05em;border-bottom:3px solid var(--accent)}
tbody tr:nth-child(even){background:var(--bg-soft)}
tbody tr:last-child td{border-bottom:0}
td a{font-weight:700}

/* ---------- FAQ ---------- */
.faqs{display:grid;gap:12px;max-width:56rem}
.faq{background:#fff;border:1px solid var(--line);border-left:4px solid var(--line);border-radius:var(--r-card);overflow:hidden;transition:box-shadow var(--t),border-color var(--t)}
.faq[open]{box-shadow:var(--sh-2);border-left-color:var(--accent)}
.faq summary{cursor:pointer;list-style:none;padding:17px 56px 17px 20px;font-family:var(--sans);font-weight:800;
  font-size:1.02rem;color:var(--navy);position:relative;line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before,.faq summary::after{content:"";position:absolute;right:23px;top:26px;background:var(--navy-mid);
  transition:transform var(--t),background var(--t)}
.faq summary::before{width:14px;height:3px}
.faq summary::after{width:3px;height:14px;right:29px;top:20px}
.faq[open] summary::after{transform:rotate(90deg)}
.faq[open] summary::before,.faq[open] summary::after{background:var(--accent)}
.faq summary:hover{background:var(--bg-soft)}
.faq-a{padding:0 20px 18px;color:var(--ink-2)}
.faq-a p:last-child{margin-bottom:0}

/* ---------- CTA band ---------- */
.ctaband{background:linear-gradient(120deg,var(--blue-dark),var(--navy) 72%);color:#fff;position:relative;overflow:hidden;
  border-top:7px solid var(--accent)}
.ctaband::before{content:"";position:absolute;left:0;top:0;right:0;height:7px;
  background:linear-gradient(90deg,var(--blue-mid),var(--ice) 50%,var(--blue-mid))}
.ctaband-in{display:flex;align-items:center;justify-content:space-between;gap:34px;flex-wrap:wrap;
  padding-block:clamp(34px,4vw,54px)}
.ctaband h2{color:#fff;margin-bottom:.3em}
.ctaband p{color:#d3e2f6;margin:0;max-width:62ch}
.ctaband-act{display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.ctaband-note{font-size:.83rem;color:#9fbcdc}

/* ---------- reviews ---------- */
.revs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rev{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:22px;box-shadow:var(--sh-1)}
.stars{display:flex;gap:2px;margin-bottom:12px}
.stars .ico{width:17px;height:17px;color:var(--accent)}
.rev blockquote{margin:0 0 14px}
.rev blockquote p{margin:0;color:var(--ink-2);font-size:.96rem}
.rev-by{margin:0;font-size:.87rem}
.rev-by strong{display:block;color:var(--navy)}
.rev-by span{color:var(--muted)}

/* ---------- link grid ---------- */
.linkgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:11px}
.linkgrid li{margin:0}
.linkgrid a{display:flex;align-items:center;gap:.6em;padding:13px 16px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-sm);font-weight:700;font-size:.94rem;color:var(--navy);transition:all var(--t);min-width:0}
.linkgrid a:hover{border-color:var(--accent);background:var(--bg-tint);text-decoration:none;transform:translateX(3px)}
.linkgrid .ico{width:16px;height:16px;color:var(--navy-mid);flex:0 0 16px}
.linkgrid span{min-width:0;overflow-wrap:anywhere}

/* ---------- resources ---------- */
.sec-res{background:var(--bg-soft)}
.res-intro{max-width:74ch;color:var(--ink-2)}
.reslist{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.reslist li{margin:0;padding:14px 17px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--accent);
  border-radius:var(--r-sm);font-size:.94rem}
.reslist a{font-weight:700}
.res-note{color:var(--muted);display:block;font-size:.86rem;margin-top:2px}

/* ---------- location / area chips (small rounded-square tag, not a full pill, with a square
   pine "node" dot — echoes the trust-chip / circuit-node language rather than the previous
   sibling's full-pill chip) ---------- */
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:9px;padding:0;margin:0}
.chips li{margin:0}
.chips a{display:inline-flex;align-items:center;gap:.55em;padding:8px 16px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-sm);font-size:.9rem;font-weight:700;color:var(--navy);transition:all var(--t)}
.chips a::before{content:"";width:8px;height:8px;flex:0 0 8px;border-radius:2px;background:var(--accent);
  box-shadow:inset 0 1px 1px rgba(15,36,64,.35)}
.chips a:hover{background:var(--navy);border-color:var(--navy);color:#fff;text-decoration:none}
.chips a:hover::before{background:var(--accent-light)}
.factgrid{list-style:none;padding:0;margin:1.4rem 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.factgrid li{margin:0;background:#fff;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--r);padding:17px 19px;min-width:0;overflow-wrap:anywhere}
.factgrid strong{display:block;font-family:var(--sans);font-size:.79rem;text-transform:uppercase;
  letter-spacing:.08em;font-weight:800;color:var(--navy-mid);margin-bottom:4px}

/* ---------- blog ---------- */
.postgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.post{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;
  box-shadow:var(--sh-1);transition:transform var(--t),box-shadow var(--t);display:flex;flex-direction:column}
.post:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.post-img img{width:100%;aspect-ratio:16/9;object-fit:cover}
.post-body{padding:20px;display:flex;flex-direction:column;flex:1;border-top:3px solid var(--accent)}
.post-meta{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-weight:700;margin-bottom:.6em}
.post h3{font-size:1.13rem;margin-bottom:.45em}
.post h3 a{color:var(--navy)}
.post p{font-size:.93rem;color:var(--ink-2);margin-bottom:1em}
.post .card-link{margin-top:auto}
.article{max-width:76ch;margin-inline:auto}
.article-head{max-width:76ch;margin-inline:auto}
.article h2{margin-top:2em;padding-top:.15em}
.article h3{margin-top:1.6em}
.article table{font-size:.9rem}
.article .table-scroll{max-width:100%}
.prose img{max-width:100%;height:auto}
.article pre,.article code{overflow-wrap:anywhere}
.article-meta{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:.88rem;color:var(--muted);
  padding-bottom:1.3rem;border-bottom:1px solid var(--line);margin-bottom:1.8rem}
.article-meta span{display:inline-flex;align-items:center;gap:.4em}
.article-hero{margin:0 0 2rem}
.article-hero img{border-radius:var(--r-lg);box-shadow:var(--sh-2);width:100%;aspect-ratio:1408/768;object-fit:cover}
.pullbox{background:var(--bg-tint);border-left:4px solid var(--navy-mid);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:20px 22px;margin:1.9rem 0}
.pullbox p:last-child{margin-bottom:0}
.article ul,.article ol{padding-left:1.35em}
.article a{font-weight:700}

/* ---------- contact (call card: navy panel, pine trace rule down the left edge) ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.contact-grid>*{min-width:0}
.callcard{min-width:0}
.nap-block li{min-width:0;overflow-wrap:anywhere}
.callcard{background:linear-gradient(150deg,var(--blue-dark),var(--navy));color:#fff;border-radius:var(--r-card);
  padding:32px;box-shadow:var(--sh-3);border-left:6px solid var(--accent)}
.callcard h2{color:#fff}
.callcard p{color:#d3e2f6}
.callcard .btn{width:100%}
.nap-block{list-style:none;padding:0;margin:1.4rem 0 0}
.nap-block li{display:flex;gap:.8em;align-items:flex-start;margin-bottom:1em;color:#e3ecfa}
.nap-block .ico{color:var(--ice);margin-top:3px}
.nap-block a{color:#fff;font-weight:700}
.mapwrap{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);line-height:0;background:var(--bg-soft)}
.mapwrap iframe{display:block;width:100%;border:0}

/* ---------- footer ---------- */
.site-foot{background:var(--blue-dark);color:#b9cbe6;padding-top:clamp(40px,5vw,62px);margin-bottom:64px;border-top:6px solid var(--accent)}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.25fr;gap:34px;padding-bottom:38px}
.foot-grid>*{min-width:0}
.foot-col{min-width:0}
.foot-brand img{height:60px;width:auto;background:#fff;border-radius:var(--r-sm);padding:7px 10px;margin-bottom:14px}
.foot-blurb{font-size:.9rem;line-height:1.6;color:#9bb4d4}
.foot-h{font-family:var(--head);font-size:1rem;text-transform:uppercase;letter-spacing:.05em;color:#fff;font-weight:700;
  margin:0 0 14px;padding-bottom:9px;border-bottom:3px solid var(--accent);display:inline-block}
.foot-h2{margin-top:24px}
.foot-list{list-style:none;padding:0;margin:0}
.foot-list li{margin-bottom:.5em}
.foot-list a,.foot-more a{color:#b9cbe6;font-size:.9rem;transition:color var(--t),padding var(--t)}
.foot-list a:hover,.foot-more a:hover{color:#fff;text-decoration:none;padding-left:4px}
.foot-locs{column-count:1}
.foot-nap{margin:16px 0 0;font-size:.9rem}
.nap-line{display:flex;gap:.65em;align-items:flex-start;margin-bottom:.7em}
.nap-line .ico{width:17px;height:17px;color:var(--ice);margin-top:3px;flex:0 0 17px}
.nap-line a{color:#eaf1fb;font-weight:700}
.foot-mail{overflow-wrap:anywhere}
.socials{display:flex;gap:10px;margin:18px 0 0}
.socials a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;
  background:rgba(255,255,255,.09);color:#e3ecfa;transition:background var(--t),color var(--t)}
.socials a:hover{background:var(--accent);color:#fff}
.socials svg{width:19px;height:19px}
.foot-more{margin:12px 0 0}
.foot-more a{display:inline-flex;align-items:center;gap:.4em;font-weight:700;color:var(--ice)}
.foot-more .ico{width:15px;height:15px}
.foot-res{font-size:.82rem;color:#7f97bd;margin:12px 0 0;line-height:1.55}
.foot-res a{color:#b9cbe6}
.foot-bottom{border-top:1px solid rgba(255,255,255,.14);padding:18px 0}
.foot-bottom-in{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.85rem;color:#8ea3c6}
.foot-bottom p{margin:0}
.foot-legal a{color:#b9cbe6}
.foot-legal span{margin:0 4px;color:#50658e}

/* ---------- sticky call bar ---------- */
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:80;display:none}
.callbar a{display:flex;align-items:center;justify-content:center;gap:.6em;background:var(--accent);color:#fff;
  font-family:var(--head);font-weight:700;font-size:1.1rem;text-transform:uppercase;letter-spacing:.02em;
  padding:15px 12px;box-shadow:0 -4px 18px rgba(15,36,64,.3)}
.callbar a:hover{background:var(--accent-dark);color:#fff;text-decoration:none}
.callbar .ico{width:21px;height:21px}

/* ---------- 404 ---------- */
.err{text-align:center;padding-block:clamp(60px,8vw,110px)}
.err h1{font-size:clamp(3.4rem,2rem + 6vw,6rem);color:var(--navy-mid);margin-bottom:.1em}

/* ---------- responsive ---------- */
@media (max-width:1200px){
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr;}
  .foot-map{grid-column:1/-1}
}
@media (max-width:1100px){
  .head-in{min-height:70px}
  .mainnav{position:fixed;top:0;right:0;bottom:0;width:min(360px,86vw);max-width:100vw;background:#fff;z-index:59;
    display:none;overflow-y:auto;overflow-x:hidden;
    padding:84px 18px 32px;box-shadow:-10px 0 40px rgba(15,36,64,.24);margin-left:0}
  .mainnav.open{display:block;animation:navslide .24s cubic-bezier(.4,0,.2,1) both}
  @keyframes navslide{from{transform:translateX(100%)}to{transform:translateX(0)}}
  .navlist{flex-direction:column;align-items:stretch;gap:2px}
  .navlist>li>a{padding:13px 14px;font-size:1.02rem;border-bottom:1px solid var(--line-soft);border-radius:0}
  .has-sub{display:grid;grid-template-columns:1fr auto}
  .has-sub>a::after{display:none}
  .sub-toggle{display:flex;align-items:center;justify-content:center;width:46px;background:none;border:0;
    border-bottom:1px solid var(--line-soft);cursor:pointer;color:var(--navy)}
  .sub-toggle svg{width:18px;height:18px;transition:transform var(--t)}
  .sub-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
  .sub{position:static;grid-column:1/-1;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;
    border-radius:0;padding:0 0 0 14px;margin:0;display:none;background:var(--bg-soft)}
  .sub.open{display:block}
  .burger{display:flex;position:relative;z-index:62}
  .head-call{margin-left:auto;order:2;position:relative;z-index:62}
  .burger{order:3;margin-left:8px}
  .brand{order:1;position:relative;z-index:62}
  .tb-hours{display:none}
  .brand-word{display:none}
  .navlist>li{position:static}
}
@media (max-width:1000px){
  .hero-in{grid-template-columns:1fr;gap:34px}
  .hero-media img{min-height:0}
  .hero-media{order:-1}
  .trust-list{grid-template-columns:repeat(2,1fr)}
  .cards-4{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .revs{grid-template-columns:1fr;gap:16px}
  .postgrid{grid-template-columns:repeat(2,1fr)}
  .linkgrid{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr;gap:30px}
  .split-media{order:-1}
  .contact-grid{grid-template-columns:1fr;gap:28px}
  .foot-grid{grid-template-columns:1fr 1fr;gap:28px}
  .factgrid{grid-template-columns:repeat(2,1fr)}
  .foot-locs{column-count:2;column-gap:20px}
}
@media (max-width:820px){
  body{font-size:16.5px}
  .cards-3,.cards-2{grid-template-columns:1fr}
  .team-grid{grid-template-columns:repeat(2,1fr)}
  .reslist{grid-template-columns:1fr}
  .callbar{display:block}
  .site-foot{margin-bottom:60px}
}
@media (max-width:640px){
  :root{--gut:16px}
  .postgrid{grid-template-columns:1fr}
  .cards-4{grid-template-columns:1fr}
  .team-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr;gap:16px}
  .linkgrid{grid-template-columns:1fr}
  .factgrid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .foot-locs{column-count:1}
  .foot-bottom-in{flex-direction:column;gap:8px}
  .btnrow .btn{width:100%}
  .hero-ticks{flex-direction:column;gap:8px}
  .ctaband-act{width:100%}
  .ctaband-act .btn{width:100%}
  .topbar-in{justify-content:center;font-size:.78rem}
}
@media (max-width:520px){
  .head-in{gap:10px}
  .brand-word{display:none}
}
@media (max-width:430px){
  .head-call-txt{display:none}
  .head-call{padding:.8em .95em}
  .brand img{height:46px}
  .head-in{gap:8px}
  .brand img{height:44px}
  .callbar a{font-size:.98rem}
}
@media print{
  .site-head,.topbar,.callbar,.ctaband,.navscrim,.site-foot .mapwrap{display:none!important}
  body{font-size:11pt}
}
