:root{
  --bg:#0e1418;
  --bg-2:#141b20;
  --surface:#f7f4ee;
  --ink:#0e1418;
  --ink-soft:#3a4148;
  --muted:#6c727a;
  --line:rgba(14,20,24,0.08);
  --line-dark:rgba(255,255,255,0.08);
  --accent:#ff6a3d;
  --accent-2:#f4b860;
  --brand-red:#e8262d;
  --brand-red-dark:#b9151c;
  --brand-red-deeper:#8a0b11;
  --ok:#2ecc71;
  --radius:14px;
  --maxw:1180px;
  --pad:clamp(20px, 4vw, 56px);
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color:var(--ink);
  background:var(--surface);
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
}
.display{
  font-family:'Fraunces', Georgia, serif;
  font-weight:500;
  letter-spacing:-0.02em;
  line-height:1.04;
}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.row{display:flex;gap:24px;align-items:center}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 22px;border-radius:999px;
  font-weight:600;font-size:15px;
  text-decoration:none;border:1px solid transparent;
  transition:transform .15s ease, background .2s ease, color .2s ease;
  cursor:pointer;
}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{transform:translateY(-1px);background:#ff5527}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{background:rgba(14,20,24,0.04)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#1c252b}
.btn-red{background:var(--brand-red);color:#fff}
.btn-red:hover{background:var(--brand-red-dark);transform:translateY(-1px)}
.btn-white{background:#fff;color:var(--brand-red-dark)}
.btn-white:hover{background:#fff5f5;transform:translateY(-1px)}
.chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px;border-radius:999px;
  background:rgba(14,20,24,0.05);font-size:13px;color:var(--ink-soft);font-weight:500;
}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--ok)}

/* ───── nav ───── */
header.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(247,244,238,0.85);backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-row{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand-logo{display:block;height:36px;width:auto;flex-shrink:0}
.brand-logo.invert{filter:brightness(0) invert(1);opacity:.88}
/* legacy fallback (kept in case any unmigrated markup remains) */
.brand-mark{
  width:34px;height:34px;border-radius:9px;background:var(--ink);
  display:grid;place-items:center;color:#fff;font-family:'Fraunces',serif;font-size:18px;font-weight:600;
  letter-spacing:-0.04em;
}
.brand-name{font-weight:700;letter-spacing:-0.01em}
nav.links{display:flex;gap:28px}
nav.links a{text-decoration:none;font-size:14px;color:var(--ink-soft);font-weight:500}
nav.links a:hover{color:var(--ink)}
.nav-cta{display:flex;align-items:center;gap:12px}
.phone{font-weight:600;font-size:14px;text-decoration:none;color:var(--ink)}
@media (max-width:780px){ nav.links{display:none} .phone{display:none} }

/* ───── hero ───── */
.hero{padding:clamp(56px,8vw,110px) 0 40px}
.hero-grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:end}
@media (max-width:960px){ .hero-grid{grid-template-columns:1fr;gap:36px} }
.hero h1{
  font-size:clamp(40px, 6.4vw, 84px);
  margin:18px 0 22px;
}
.hero h1 em{font-style:italic;color:var(--accent);font-weight:500}
.hero p.lede{
  font-size:18px;color:var(--ink-soft);max-width:46ch;margin:0 0 28px;
}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.rating{
  display:flex;align-items:center;gap:14px;margin-top:30px;
  padding-top:24px;border-top:1px dashed var(--line);
}
.stars{color:var(--accent-2);letter-spacing:2px;font-size:18px}
.rating-num{font-weight:600}
.rating-meta{color:var(--muted);font-size:14px}

/* quote card (legacy wizard + new iframe wrapper share the same look) */
.quote, .quote-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:28px;box-shadow:0 30px 60px -30px rgba(14,20,24,0.18);
}
.quote-card h3{
  margin:0 0 6px;
  font-family:'Fraunces',Georgia,serif;
  font-size:24px;font-weight:500;letter-spacing:-0.02em;
  color:var(--ink);
}
.quote-card h3 em{font-style:italic;color:var(--brand-red);font-weight:500}
.quote-card .sub{color:var(--ink-soft);font-size:14px;margin:0 0 18px;line-height:1.5}
#msai-quote-widget, .msai-quote-widget{
  display:block;min-height:520px;
}
#msai-quote-widget iframe{
  display:block;width:100%;border:none;border-radius:8px;
}
.quote h3{
  margin:0 0 6px;
  font-family:'Fraunces',Georgia,serif;
  font-size:24px;font-weight:500;letter-spacing:-0.02em;
  color:var(--ink);
}
.quote h3 em{font-style:italic;color:var(--brand-red);font-weight:500}
.quote .sub{color:var(--ink-soft);font-size:14px;margin-bottom:20px;line-height:1.5}
.quote label{display:block;font-size:12px;color:var(--ink-soft);font-weight:500;margin:14px 0 6px;text-transform:uppercase;letter-spacing:0.06em}
.quote input, .quote select, .quote textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;
  font:inherit;background:#fff;color:var(--ink);
}
.quote textarea{min-height:72px;resize:vertical}
.quote input:focus, .quote select:focus, .quote textarea:focus{outline:2px solid var(--brand-red);outline-offset:1px;border-color:transparent}
.sizes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px}
.size{
  padding:10px 0;text-align:center;border:1px solid var(--line);border-radius:10px;
  font-size:13px;font-weight:500;cursor:pointer;background:#fff;transition:all .15s ease;
}
.size:hover{border-color:var(--ink)}
.size.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.quote .btn{width:100%;justify-content:center;margin-top:20px}

/* ───── quote form (2-step wizard) ───── */
.quote-form{position:relative}
.qf-progress{
  display:flex;gap:6px;margin:0 0 18px;
  transition:opacity .2s ease;
}
.qf-progress.hidden{display:none}
.qf-progress .qf-dot{
  flex:1;height:4px;border-radius:999px;background:rgba(14,20,24,.10);
  transition:background .3s ease;
}
.qf-progress .qf-dot.current,
.qf-progress .qf-dot.done{background:var(--brand-red)}
.qf-step{display:none}
.qf-step.active{display:block;animation:qfFade .35s cubic-bezier(.2,.7,.2,1)}
@keyframes qfFade{ from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }

.qf-hint{
  font-size:13px;color:var(--ink-soft);margin:0 0 18px;line-height:1.5;
}
.qf-trust{
  font-size:12px;color:var(--muted);margin:14px 0 0;line-height:1.5;
}
.qf-trust a{color:var(--muted);text-decoration:underline}

.qf-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:20px;
}
.qf-link{
  background:transparent;border:0;cursor:pointer;
  font:inherit;font-size:13px;font-weight:600;color:var(--ink-soft);
  padding:8px 0;
}
.qf-link:hover{color:var(--brand-red)}
.qf-submit{flex:1}
.qf-row .qf-submit{margin-top:0}

.qf-step .btn{margin-top:20px}
.qf-step .qf-row .btn{margin-top:0}

/* error states */
.qf-err{outline:2px solid #e8262d;outline-offset:1px;border-color:transparent !important;background:rgba(232,38,45,.04) !important}
.qf-err-msg{font-size:12px;color:#b9151c;font-weight:500;margin-top:6px;display:flex;align-items:center;gap:4px}
.qf-err-msg::before{content:"⚠";font-size:13px}

/* success state */
.qf-success{text-align:center;padding:18px 4px 4px}
.qf-check{
  width:60px;height:60px;border-radius:50%;
  background:var(--ok);color:#fff;
  display:grid;place-items:center;
  font-size:28px;font-weight:700;
  margin:0 auto 18px;
  box-shadow:0 0 0 6px rgba(46,204,113,.15);
  animation:qfPop .5s cubic-bezier(.2,.8,.2,1.2);
}
@keyframes qfPop{ from{transform:scale(0);opacity:0} to{transform:scale(1);opacity:1} }
.qf-success code{
  font-family:'Menlo',monospace;background:rgba(14,20,24,.06);
  padding:2px 6px;border-radius:4px;font-size:12px;
}

/* ───── brand-styled date picker ───── */
.qf-date-wrap{position:relative}
/* hide the native date input but keep it focusable for accessibility / form submit */
.qf-date-wrap input[type="date"]{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.qf-date-trigger{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;padding:12px 14px;
  border:1px solid var(--line);border-radius:10px;
  font:inherit;font-size:14px;color:var(--muted);
  background:#fff;cursor:pointer;text-align:left;
  transition:border-color .15s ease, background .15s ease;
}
.qf-date-trigger:hover{border-color:var(--ink-soft)}
.qf-date-trigger.has-value{color:var(--ink);font-weight:500}
.qf-date-trigger:focus,
.qf-date-wrap:focus-within .qf-date-trigger{
  outline:2px solid var(--brand-red);outline-offset:1px;border-color:transparent;
}
.qf-date-ico{font-size:15px;opacity:.7}

.qf-dp-popup{
  position:fixed;z-index:9999;
  background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 30px 60px -20px rgba(14,20,24,.25);
  padding:14px;width:300px;max-width:calc(100vw - 16px);
  animation:qfDp .18s cubic-bezier(.2,.7,.2,1);
}
@keyframes qfDp{ from{opacity:0;transform:translateY(-4px) scale(.98)} to{opacity:1;transform:none} }

.qf-dp-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:10px;gap:8px;
}
.qf-dp-title{
  font-family:'Fraunces',serif;font-size:16px;font-weight:500;letter-spacing:-0.01em;
  color:var(--ink);
}
.qf-dp-nav{
  background:transparent;border:1px solid var(--line);border-radius:8px;
  width:32px;height:32px;cursor:pointer;
  font-size:18px;color:var(--ink-soft);
  display:grid;place-items:center;
  transition:all .15s ease;
}
.qf-dp-nav:hover{border-color:var(--brand-red);color:var(--brand-red)}

.qf-dp-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:2px;
}
.qf-dp-dow{
  text-align:center;font-size:11px;font-weight:600;
  color:var(--muted);text-transform:uppercase;letter-spacing:.06em;
  padding:6px 0;
}
.qf-dp-day{
  background:transparent;border:0;border-radius:8px;
  font:inherit;font-size:13px;color:var(--ink);font-weight:500;
  height:36px;cursor:pointer;
  transition:all .12s ease;
}
.qf-dp-day:hover{background:rgba(232,38,45,.10);color:var(--brand-red)}
.qf-dp-day.qf-dp-out{color:rgba(14,20,24,.25);font-weight:400}
.qf-dp-day.qf-dp-today{
  position:relative;
  font-weight:700;color:var(--brand-red);
}
.qf-dp-day.qf-dp-today::after{
  content:"";position:absolute;left:50%;bottom:3px;transform:translateX(-50%);
  width:4px;height:4px;border-radius:50%;background:var(--brand-red);
}
.qf-dp-day.qf-dp-sel{
  background:var(--brand-red);color:#fff;font-weight:600;
  box-shadow:0 8px 20px -10px rgba(232,38,45,.6);
}
.qf-dp-day.qf-dp-sel:hover{background:var(--brand-red-dark);color:#fff}
.qf-dp-day.qf-dp-sel.qf-dp-today::after{background:#fff}
.qf-dp-day.qf-dp-disabled{
  color:rgba(14,20,24,.20);cursor:not-allowed;pointer-events:none;
}

.qf-dp-foot{
  display:flex;gap:6px;margin-top:10px;padding-top:10px;
  border-top:1px solid var(--line);
}
.qf-dp-link{
  flex:1;background:transparent;border:1px solid var(--line);
  border-radius:8px;padding:8px 10px;
  font:inherit;font-size:12px;font-weight:600;
  color:var(--ink-soft);cursor:pointer;
  transition:all .15s ease;
}
.qf-dp-link:hover{border-color:var(--brand-red);color:var(--brand-red);background:rgba(232,38,45,.05)}

/* marquee strip */
.strip{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  margin-top:60px;padding:18px 0;overflow:hidden;
}
.marquee{display:flex;gap:60px;white-space:nowrap;animation:scroll 38s linear infinite}
.marquee span{font-family:'Fraunces',serif;font-size:18px;color:var(--ink-soft);letter-spacing:-0.01em}
.marquee span::before{content:"✦";color:var(--accent);margin-right:60px}
@keyframes scroll{ to{ transform:translateX(-50%) } }

/* ───── section helpers ───── */
section{padding:clamp(70px,9vw,120px) 0}
.eyebrow{
  display:inline-block;font-size:12px;font-weight:600;
  text-transform:uppercase;letter-spacing:0.14em;
  color:var(--accent);margin-bottom:14px;
}
.section-title{font-size:clamp(34px,4.6vw,56px);margin:0 0 18px;max-width:18ch}
.section-sub{color:var(--ink-soft);font-size:17px;max-width:56ch;margin:0}

/* ───── services ───── */
.services-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:50px}
@media (max-width:820px){.services-head{grid-template-columns:1fr}}
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:980px){.services{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.services{grid-template-columns:1fr}}
.service{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px;display:flex;flex-direction:column;gap:14px;
  min-height:260px;transition:transform .2s ease, border-color .2s ease;
  position:relative;overflow:hidden;
}
.service:hover{transform:translateY(-3px);border-color:rgba(14,20,24,0.2)}
.service .icon{
  width:42px;height:42px;border-radius:11px;background:#0e1418;color:#fff;
  display:grid;place-items:center;font-size:20px;
}
.service h4{font-size:20px;margin:6px 0 0;font-weight:600;letter-spacing:-0.01em}
.service p{color:var(--ink-soft);font-size:14.5px;margin:0;flex:1}
.service .more{font-size:13px;font-weight:600;color:var(--accent);text-decoration:none}
.service .more:hover{text-decoration:underline}

/* ───── pillars ───── */
.dark{background:var(--bg);color:#f0ede6}
.dark .eyebrow{color:var(--accent-2)}
.dark .section-sub{color:#b6bbc1}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:60px;border-top:1px solid var(--line-dark)}
@media (max-width:820px){.pillars{grid-template-columns:repeat(2,1fr)}}
.pillar{padding:36px 24px 32px 0;border-right:1px solid var(--line-dark)}
.pillar:last-child{border-right:0}
.pillar .num{font-family:'Fraunces',serif;font-size:14px;color:var(--muted);margin-bottom:18px}
.pillar h5{font-family:'Fraunces',serif;font-size:30px;margin:0 0 10px;font-weight:500;letter-spacing:-0.02em}
.pillar p{color:#b6bbc1;font-size:14.5px;margin:0;max-width:30ch}

/* ───── tracking feature ───── */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
@media (max-width:880px){.feature{grid-template-columns:1fr}}
.feature-vis{
  background:linear-gradient(160deg,#1c252b,#0e1418);
  border-radius:var(--radius);padding:36px;color:#f0ede6;
  border:1px solid var(--line-dark);
  aspect-ratio:1.05/1;display:flex;flex-direction:column;justify-content:space-between;
  position:relative;overflow:hidden;
}
.feature-vis::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(600px 200px at 100% 0%, rgba(255,106,61,.18), transparent 60%);
  pointer-events:none;
}
.barcode{display:flex;gap:2px;height:60px;align-items:end;margin-bottom:12px;position:relative;z-index:1}
.barcode span{display:block;width:3px;background:#f0ede6}
.scan-rows{display:flex;flex-direction:column;gap:14px;position:relative;z-index:1}
.scan{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:rgba(255,255,255,0.04);border:1px solid var(--line-dark);border-radius:10px}
.scan .where{font-weight:500;font-size:14px}
.scan .when{color:var(--muted);font-size:12px}
.scan .ok{width:8px;height:8px;border-radius:50%;background:var(--ok)}

/* ───── stats ───── */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
@media (max-width:820px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{padding:48px 28px;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat .n{font-family:'Fraunces',serif;font-size:clamp(40px,5vw,64px);letter-spacing:-0.03em;line-height:1}
.stat .n em{font-style:normal;color:var(--accent)}
.stat .l{margin-top:10px;color:var(--ink-soft);font-size:14px}

/* ───── testimonials ───── */
.tcards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:50px}
@media (max-width:880px){.tcards{grid-template-columns:1fr}}
.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px}
.tcard .stars{font-size:14px;letter-spacing:1px}
.tcard blockquote{
  font-family:'Fraunces',serif;font-size:20px;line-height:1.4;
  margin:14px 0 22px;letter-spacing:-0.01em;
}
.tcard .who{display:flex;align-items:center;gap:12px}
.av{width:38px;height:38px;border-radius:50%;background:#0e1418;color:#fff;display:grid;place-items:center;font-weight:600;font-size:13px}
.tcard .name{font-weight:600;font-size:14px}
.tcard .meta{color:var(--muted);font-size:12px}

/* ───── cta band ───── */
.ctaband{
  background:var(--ink);color:#fff;border-radius:18px;
  padding:clamp(40px,6vw,72px);
  display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center;
  position:relative;overflow:hidden;
}
.ctaband::before{
  content:"";position:absolute;right:-100px;top:-100px;width:400px;height:400px;border-radius:50%;
  background:radial-gradient(closest-side, rgba(255,106,61,.35), transparent);
}
@media (max-width:820px){.ctaband{grid-template-columns:1fr}}
.ctaband h2{font-size:clamp(32px,4vw,52px);margin:0;position:relative;z-index:1}
.ctaband .cta-meta{position:relative;z-index:1}
.ctaband .phone-big{
  display:block;font-family:'Fraunces',serif;font-size:clamp(34px,4vw,48px);
  color:#fff;text-decoration:none;letter-spacing:-0.02em;margin-bottom:8px;
}
.ctaband small{color:#b6bbc1;font-size:13px}

/* ───── footer ───── */
footer{padding:60px 0 30px;background:var(--bg);color:#b6bbc1}
.ft-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:36px;margin-bottom:50px}
@media (max-width:980px){.ft-grid{grid-template-columns:1fr 1fr 1fr;gap:32px}}
@media (max-width:680px){.ft-grid{grid-template-columns:1fr 1fr;gap:28px}}
footer h6{color:#f0ede6;font-size:13px;text-transform:uppercase;letter-spacing:0.1em;margin:0 0 14px;font-weight:600}
footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
footer a{color:#b6bbc1;text-decoration:none;font-size:14px}
footer a:hover{color:#fff}
.ft-brand p{font-size:14px;max-width:38ch;margin:14px 0 20px}
.social{display:flex;gap:10px}
.social a{
  width:36px;height:36px;border-radius:50%;border:1px solid var(--line-dark);
  display:grid;place-items:center;font-size:13px;
}
.social a:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.ft-bottom{
  border-top:1px solid var(--line-dark);padding-top:24px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--muted)
}

/* ───── motion ───── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* hero stagger on load */
.hero .chip,.hero h1,.hero p.lede,.hero-ctas,.rating,.quote{
  opacity:0;transform:translateY(14px);
  animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards;
}
.hero .chip      {animation-delay:.05s}
.hero h1         {animation-delay:.18s}
.hero p.lede     {animation-delay:.32s}
.hero-ctas       {animation-delay:.44s}
.rating          {animation-delay:.56s}
.quote           {animation-delay:.30s; animation-duration:1.1s}
@keyframes rise{ to{opacity:1;transform:none} }

/* split-word reveal for h1 */
.h1-word{display:inline-block;overflow:hidden;vertical-align:bottom}
.h1-word > span{
  display:inline-block;transform:translateY(110%);
  animation:wordup .85s cubic-bezier(.2,.8,.2,1) forwards;
}
.h1-word:nth-child(1) > span{animation-delay:.18s}
.h1-word:nth-child(2) > span{animation-delay:.30s}
.h1-word:nth-child(3) > span{animation-delay:.42s}
.h1-word:nth-child(4) > span{animation-delay:.54s}
@keyframes wordup{ to{transform:none} }

/* ambient hero glow that breathes */
.hero{position:relative;overflow:hidden}
.hero::before{
  content:"";position:absolute;z-index:-1;
  width:780px;height:780px;border-radius:50%;
  right:-260px;top:-260px;
  background:radial-gradient(closest-side, rgba(255,106,61,.16), transparent 70%);
  animation:drift 14s ease-in-out infinite alternate;
  filter:blur(20px);
}
@keyframes drift{
  from{transform:translate(0,0) scale(1)}
  to  {transform:translate(-60px,40px) scale(1.1)}
}

/* scroll-triggered reveal */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal-delay="1"].in{transition-delay:.08s}
[data-reveal-delay="2"].in{transition-delay:.16s}
[data-reveal-delay="3"].in{transition-delay:.24s}
[data-reveal-delay="4"].in{transition-delay:.32s}

/* CTA button shimmer */
.btn-primary,.btn-red,.btn-white{position:relative;overflow:hidden}
.btn-primary::after,.btn-red::after,.btn-white::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%);
  transform:translateX(-120%);
}
.btn-primary:hover::after,.btn-red:hover::after,.btn-white:hover::after{animation:shine .9s ease forwards}
@keyframes shine{ to{ transform:translateX(120%) } }

.service:hover .more{ letter-spacing:.02em }

/* pulse dot for live scan */
.scan .ok{position:relative}
.scan .ok::after{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  box-shadow:0 0 0 0 rgba(46,204,113,.6);
  animation:pulse 2s ease-out infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(46,204,113,.55)}
  70%{box-shadow:0 0 0 12px rgba(46,204,113,0)}
  100%{box-shadow:0 0 0 0 rgba(46,204,113,0)}
}
.scan-rows .scan:not(:last-child) .ok::after{animation:none}

/* barcode shimmer scan */
.feature-vis{position:relative}
.feature-vis .scanline{
  position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg, transparent, rgba(255,106,61,.9), transparent);
  animation:scanmove 3.4s ease-in-out infinite;
  pointer-events:none;opacity:.85;
}
@keyframes scanmove{
  0%{transform:translateY(40px);opacity:0}
  20%{opacity:1}
  80%{opacity:1}
  100%{transform:translateY(360px);opacity:0}
}

.stat .n{display:inline-block}

/* truck cruise across strip */
.strip{position:relative}
.truck{
  position:absolute;left:-90px;bottom:6px;font-size:22px;
  animation:cruise 22s linear infinite;
  filter:grayscale(1) contrast(1.1);opacity:.85;
}
.truck-emoji{display:inline-block;transform:scaleX(-1);animation:jiggle .35s ease-in-out infinite alternate}
@keyframes cruise{ 0%{transform:translateX(0)} 100%{transform:translateX(calc(100vw + 120px))} }
@keyframes jiggle{ from{transform:scaleX(-1) translateY(0)} to{transform:scaleX(-1) translateY(-1px)} }
.puff{position:absolute;left:14px;bottom:14px;width:6px;height:6px;border-radius:50%;background:rgba(180,180,180,.55);animation:puff 1.6s ease-out infinite;pointer-events:none}
@keyframes puff{0%{transform:translate(0,0) scale(.6);opacity:.9}100%{transform:translate(-20px,-14px) scale(2.2);opacity:0}}

.service .icon{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.service:hover .icon{transform:rotate(-6deg) scale(1.06)}

.pillar h5{background:linear-gradient(90deg,#f0ede6 50%,#f0ede6 50%);background-clip:text;-webkit-background-clip:text}

.section-title{position:relative;display:inline-block}
.section-title::after{
  content:"";position:absolute;left:0;bottom:-10px;height:3px;width:0;
  background:var(--accent);transition:width 1s cubic-bezier(.2,.7,.2,1) .2s;
}
[data-reveal].in .section-title::after{width:64px}

.size{transition:transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease}
.size.active{transform:scale(1.03)}

/* ───────── MOUSE INTERACTIVITY ───────── */

/* video-backed hero (homepage) */
.hero.video{background:var(--bg);color:#f0ede6}
.hero.video::before{display:none}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg video{
  position:absolute;inset:-2%;width:104%;height:104%;
  object-fit:cover;filter:saturate(.85) contrast(1.05) brightness(.55);
  will-change:transform;transition:transform .6s cubic-bezier(.2,.7,.2,1);
}
.hero-bg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(14,20,24,.55) 0%, rgba(14,20,24,.35) 40%, rgba(14,20,24,.85) 100%),
    radial-gradient(800px 500px at var(--mx,50%) var(--my,30%), rgba(255,106,61,.22), transparent 60%);
  pointer-events:none;
}
.hero.video .wrap{position:relative;z-index:1}
.hero.video p.lede{color:#cfd2d6}
.hero.video .chip{background:rgba(255,255,255,.08);color:#f0ede6}
.hero.video .chip .dot{background:var(--ok);box-shadow:0 0 0 4px rgba(46,204,113,.15)}
.hero.video .btn-ghost{border-color:rgba(255,255,255,.18);color:#f0ede6}
.hero.video .btn-ghost:hover{background:rgba(255,255,255,.06)}
.hero.video .rating{border-top-color:rgba(255,255,255,.14)}
.hero.video .rating-meta{color:#9aa0a6}

/* ───── RED hero variant for service pages ───── */
.hero.red{
  background:
    radial-gradient(900px 600px at 15% 10%, rgba(255,255,255,.10), transparent 60%),
    radial-gradient(900px 600px at 85% 90%, rgba(0,0,0,.18), transparent 60%),
    linear-gradient(160deg, #e8262d 0%, #c41820 50%, #8a0b11 100%);
  color:#fff;
}
.hero.red::before{
  background:radial-gradient(closest-side, rgba(255,255,255,.16), transparent 70%);
}
.hero.red h1{color:#fff}
.hero.red h1 em{color:#ffd166}
.hero.red p.lede{color:rgba(255,255,255,.92)}
.hero.red .chip{background:rgba(255,255,255,.14);color:#fff}
.hero.red .chip .dot{background:#7ce58a;box-shadow:0 0 0 4px rgba(124,229,138,.18)}
.hero.red .btn-ghost{border-color:rgba(255,255,255,.4);color:#fff}
.hero.red .btn-ghost:hover{background:rgba(255,255,255,.1)}
.hero.red .rating{border-top-color:rgba(255,255,255,.22)}
.hero.red .rating-meta{color:rgba(255,255,255,.7)}
.hero.red .stars{color:#ffd166}

/* sub-nav on service pages */
.subnav{
  background:#fff;border-bottom:1px solid var(--line);
  position:sticky;top:68px;z-index:40;
}
.subnav-row{display:flex;gap:10px;padding:14px 0;overflow-x:auto;align-items:center}
.subnav a{
  flex-shrink:0;
  text-decoration:none;font-size:13px;font-weight:600;
  color:var(--ink-soft);padding:8px 14px;border-radius:999px;
  border:1px solid var(--line);transition:all .15s ease;
}
.subnav a:hover{border-color:var(--brand-red);color:var(--brand-red)}
.subnav a.active{background:var(--brand-red);color:#fff;border-color:var(--brand-red)}
.subnav .crumbs{margin-right:auto;font-size:12px;color:var(--muted);font-weight:500;letter-spacing:0.04em}
.subnav .crumbs a{display:inline;padding:0;border:0;font-size:12px;color:var(--muted);font-weight:500}
.subnav .crumbs a:hover{color:var(--brand-red)}

/* ───── inclusions list ───── */
.inclusions{
  display:grid;grid-template-columns:repeat(2,1fr);gap:16px;
  margin-top:40px;
}
@media (max-width:760px){.inclusions{grid-template-columns:1fr}}
.incl{
  display:flex;gap:14px;align-items:flex-start;
  padding:20px;background:#fff;border:1px solid var(--line);border-radius:12px;
}
.incl .ck{
  flex-shrink:0;width:30px;height:30px;border-radius:50%;
  background:var(--brand-red);color:#fff;
  display:grid;place-items:center;font-weight:700;font-size:14px;
}
.incl h6{margin:0 0 4px;font-size:15px;font-weight:600}
.incl p{margin:0;font-size:14px;color:var(--ink-soft)}

/* ───── pricing rows ───── */
.pricing{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px;
}
@media (max-width:880px){.pricing{grid-template-columns:1fr}}
.price{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:30px;display:flex;flex-direction:column;gap:8px;
  position:relative;transition:transform .2s ease, border-color .2s ease;
}
.price:hover{transform:translateY(-3px);border-color:var(--brand-red)}
.price.featured{border-color:var(--brand-red);box-shadow:0 30px 60px -30px rgba(232,38,45,.2)}
.price.featured::before{
  content:"Most popular";position:absolute;top:-10px;right:20px;
  background:var(--brand-red);color:#fff;font-size:11px;font-weight:700;
  padding:4px 10px;border-radius:999px;letter-spacing:.08em;text-transform:uppercase;
}
.price .label{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft);font-weight:600}
.price .amount{font-family:'Fraunces',serif;font-size:44px;letter-spacing:-0.03em;line-height:1;margin:6px 0 4px}
.price .amount small{font-size:14px;color:var(--muted);font-family:'Inter',sans-serif;font-weight:500;letter-spacing:0}
.price .note{color:var(--ink-soft);font-size:14px;margin:4px 0 18px}
.price ul{list-style:none;padding:0;margin:0 0 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.price li{font-size:14px;padding-left:22px;position:relative;color:var(--ink-soft)}
.price li::before{
  content:"";position:absolute;left:0;top:8px;
  width:8px;height:8px;border-radius:50%;background:var(--brand-red);opacity:.9;
}
.price .btn{width:100%;justify-content:center}

/* ───── how-it-works steps ───── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:50px}
@media (max-width:880px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.step{
  padding:28px;background:#fff;border:1px solid var(--line);border-radius:14px;
  position:relative;
}
.step .n{
  font-family:'Fraunces',serif;font-size:48px;line-height:1;color:var(--brand-red);
  letter-spacing:-0.04em;margin-bottom:14px;
}
.step h6{font-size:17px;margin:0 0 6px;font-weight:600}
.step p{margin:0;color:var(--ink-soft);font-size:14.5px}

/* ───── FAQ accordion ───── */
.faq{display:grid;grid-template-columns:1.2fr 2fr;gap:60px;margin-top:50px}
@media (max-width:880px){.faq{grid-template-columns:1fr;gap:30px}}
.faq-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line)}
.faq-list details{border-bottom:1px solid var(--line);padding:22px 0}
.faq-list summary{
  cursor:pointer;font-weight:600;font-size:17px;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:20px;
}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{
  content:"+";font-size:24px;font-weight:400;color:var(--brand-red);transition:transform .25s ease;line-height:1;
}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list details p{margin:14px 0 0;color:var(--ink-soft);font-size:15px;max-width:64ch}

/* ───── trust band (red) ───── */
.trustband{
  background:linear-gradient(160deg, var(--brand-red) 0%, var(--brand-red-dark) 100%);
  color:#fff;padding:clamp(40px,5vw,72px) 0;
}
.trustband .stats{border:0}
.trustband .stat{border-right-color:rgba(255,255,255,.15)}
.trustband .stat .n{color:#fff}
.trustband .stat .n em{color:#ffd166}
.trustband .stat .l{color:rgba(255,255,255,.78)}

/* ───── coverage area chips ───── */
.coverage{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.coverage span{
  background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:6px 12px;font-size:13px;color:var(--ink-soft);font-weight:500;
}

/* ───── spotlight on dark sections ───── */
.dark, #tracking, .ctaband{position:relative;overflow:hidden}
.dark::before, #tracking::before, .ctaband::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 420px at var(--mx,50%) var(--my,50%),
    rgba(255,106,61,.16), transparent 60%);
  transition:opacity .3s ease;opacity:0;z-index:0;
}
.dark.lit::before, #tracking.lit::before, .ctaband.lit::before{opacity:1}
.dark .wrap, #tracking .wrap, .ctaband > *{position:relative;z-index:1}
.ctaband::before{
  right:-100px;top:-100px;left:auto;bottom:auto;
  width:400px;height:400px;border-radius:50%;
  background:radial-gradient(closest-side, rgba(255,106,61,.35), transparent);
  opacity:1;inset:auto -100px auto auto;
}
.ctaband::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(360px 360px at var(--mx,50%) var(--my,50%),
    rgba(244,184,96,.18), transparent 60%);
  opacity:0;transition:opacity .3s ease;
}
.ctaband.lit::after{opacity:1}

/* magnetic CTA wrapper */
.magnet{display:inline-block;transition:transform .25s cubic-bezier(.2,.8,.2,1);will-change:transform}

/* service card cursor tilt */
.service{transform-style:preserve-3d;will-change:transform;transition:transform .3s cubic-bezier(.2,.8,.2,1), border-color .2s ease, box-shadow .3s ease}
.service .icon, .service h4, .service p, .service .more{transform:translateZ(20px)}
.service:hover{box-shadow:0 30px 60px -30px rgba(14,20,24,.25)}

/* parallax dots in services */
#services{position:relative;overflow:hidden}
.float-blob{
  position:absolute;width:280px;height:280px;border-radius:50%;
  filter:blur(80px);opacity:.35;pointer-events:none;z-index:0;
  will-change:transform;transition:transform .5s cubic-bezier(.2,.7,.2,1);
}
.float-blob.a{background:#ff6a3d;top:5%;left:-80px}
.float-blob.b{background:#f4b860;bottom:5%;right:-80px}
#services .wrap{position:relative;z-index:1}

/* trail of dots following cursor */
.trail{position:fixed;width:8px;height:8px;border-radius:50%;background:var(--accent);pointer-events:none;z-index:9998;mix-blend-mode:screen;opacity:0;transform:translate(-50%,-50%)}

/* native cursor — custom dot/ring + trail disabled */
.cursor-dot, .cursor-ring, .trail{ display:none !important; }

/* ───────── SHINY RED ABC MOVERS BOXES ───────── */
.box-field{position:fixed;inset:0;pointer-events:none;z-index:2;overflow:hidden}
@media (max-width:780px){ .box-field{display:none} }
.box{
  --w:140px;
  --tx:0px; --ty:0px; --sy:0px;
  --rot:0deg;
  position:absolute;
  width:var(--w); height:auto;
  transform: translate3d(var(--tx), calc(var(--ty) + var(--sy)), 0) rotate(var(--rot));
  will-change:transform;
  pointer-events:none;
  filter: drop-shadow(0 22px 24px rgba(80,8,12,.32));
  transition: filter .3s ease;
}
.box img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.box .bob{display:block;animation: bob var(--bob,7s) ease-in-out infinite}
@keyframes bob{
  0%,100%{ transform: translateY(0) rotate(0deg) }
  50%   { transform: translateY(-6px) rotate(.6deg) }
}
.box.xs    { --w:90px;  }
.box.sm    { --w:120px; }
.box.md    { --w:160px; }
.box.lg    { --w:200px; }
.box.xl    { --w:240px; }

/* ───────── CITY PAGE EXTRAS ───────── */

/* huge background-type city name in hero */
.hero.city{
  background:
    radial-gradient(900px 600px at 15% 10%, rgba(255,255,255,.10), transparent 60%),
    radial-gradient(1000px 700px at 85% 90%, rgba(0,0,0,.22), transparent 60%),
    linear-gradient(160deg, #e8262d 0%, #c41820 50%, #8a0b11 100%);
  color:#fff;
  padding:clamp(60px,9vw,120px) 0 30px;
}
.hero.city .bg-type{
  position:absolute; left:0; right:0; bottom:-2vw;
  text-align:center;
  font-family:'Fraunces',serif; font-weight:500;
  font-size:clamp(140px, 22vw, 360px);
  line-height:.85; letter-spacing:-0.05em;
  color:rgba(255,255,255,.10);
  pointer-events:none; user-select:none;
  z-index:0;
  white-space:nowrap;
  text-transform:uppercase;
}
.hero.city .wrap{position:relative;z-index:1}
.hero.city .chip{background:rgba(255,255,255,.14);color:#fff}
.hero.city .chip .dot{background:#7ce58a;box-shadow:0 0 0 4px rgba(124,229,138,.18)}
.hero.city h1{color:#fff}
.hero.city h1 em{color:#ffd166}
.hero.city p.lede{color:rgba(255,255,255,.92)}
.hero.city .btn-ghost{border-color:rgba(255,255,255,.4);color:#fff}
.hero.city .btn-ghost:hover{background:rgba(255,255,255,.1)}
.hero.city .rating{border-top-color:rgba(255,255,255,.22)}
.hero.city .rating-meta{color:rgba(255,255,255,.7)}
.hero.city .stars{color:#ffd166}

/* city meta strip (population, branch addr) */
.cityband{
  background:#fff;border-bottom:1px solid var(--line);
  padding:24px 0;
}
.cityband-row{
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px; align-items:center;
}
@media (max-width:820px){.cityband-row{grid-template-columns:repeat(2,1fr)}}
.cityband .item{display:flex;flex-direction:column;gap:2px}
.cityband .item small{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.cityband .item strong{font-weight:600;font-size:14px}

/* neighborhood cloud */
.hood-cloud{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.hood-cloud span{
  background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:8px 14px;font-size:13px;color:var(--ink-soft);font-weight:500;
  transition:all .15s ease;
}
.hood-cloud span:hover{border-color:var(--brand-red);color:var(--brand-red)}
.hood-cloud a.hood-link{text-decoration:none;display:inline-block}
.hood-cloud a.hood-link span{cursor:pointer}
.hood-cloud a.hood-link:hover span{background:var(--brand-red);color:#fff;border-color:var(--brand-red)}

/* neighborhood-page-specific tweaks */
.hero.neighborhood h1 small{
  display:block;font-family:'Inter',sans-serif;font-weight:600;font-size:.32em;
  letter-spacing:.02em;color:rgba(255,255,255,.7);margin-bottom:8px;text-transform:uppercase;
}
.intent-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px;
}
@media (max-width:880px){.intent-grid{grid-template-columns:1fr}}
.intent{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:24px;display:flex;flex-direction:column;gap:8px;
}
.intent h6{margin:0;font-size:16px;font-weight:600;letter-spacing:-0.01em}
.intent p{margin:0;color:var(--ink-soft);font-size:14px}
.intent .meta{font-size:12px;color:var(--muted);font-weight:500;text-transform:uppercase;letter-spacing:.08em}

.nearby-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:30px;
}
@media (max-width:880px){.nearby-grid{grid-template-columns:repeat(2,1fr)}}
.nearby{
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 16px;
  text-decoration:none;color:var(--ink);transition:all .15s ease;
  display:flex;flex-direction:column;gap:2px;
}
.nearby:hover{border-color:var(--brand-red);transform:translateY(-2px)}
.nearby strong{font-size:14px;font-weight:600}
.nearby small{font-size:12px;color:var(--muted)}

.breadcrumb-trail{
  font-size:13px;color:var(--muted);margin:0 0 8px;font-weight:500;
}
.breadcrumb-trail a{color:var(--muted);text-decoration:none}
.breadcrumb-trail a:hover{color:var(--brand-red)}

/* services grid linked from city page */
.city-services{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:50px}
@media (max-width:980px){.city-services{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.city-services{grid-template-columns:1fr}}

/* zip codes coverage block */
.zip-coverage{
  background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:24px;margin-top:30px;
}
.zip-coverage h6{margin:0 0 12px;font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft);font-weight:600}
.zip-list{display:flex;flex-wrap:wrap;gap:6px}
.zip-list code{
  font-family:'JetBrains Mono','Menlo',monospace;
  background:#fff;padding:4px 8px;border-radius:6px;border:1px solid var(--line);
  font-size:12px;color:var(--ink-soft);
}

/* map embed */
.map-frame{
  border-radius:14px;overflow:hidden;border:1px solid var(--line);
  aspect-ratio:16/9;background:#0e1418;
  position:relative;
}
.map-frame iframe{width:100%;height:100%;border:0;display:block}

/* feature grid for USPs */
.usp-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:50px;
}
@media (max-width:780px){.usp-grid{grid-template-columns:1fr}}
.usp{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:30px;display:flex;flex-direction:column;gap:8px;
  position:relative;overflow:hidden;
  transition:transform .2s ease, border-color .2s ease;
}
.usp:hover{transform:translateY(-3px);border-color:var(--brand-red)}
.usp::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--brand-red);
}
.usp h5{margin:0 0 6px;font-size:18px;font-weight:600;letter-spacing:-0.01em}
.usp p{margin:0;color:var(--ink-soft);font-size:15px}

/* cities grid (homepage section) */
.cities-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:50px;
}
@media (max-width:880px){.cities-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.cities-grid{grid-template-columns:1fr}}
.city-card{
  position:relative;overflow:hidden;border-radius:14px;
  background:linear-gradient(160deg, var(--brand-red) 0%, var(--brand-red-dark) 100%);
  color:#fff;padding:30px;min-height:200px;
  text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;
  border:1px solid transparent;
  transition:transform .25s ease, box-shadow .25s ease;
}
.city-card:hover{
  transform:translateY(-4px);
  box-shadow:0 30px 60px -30px rgba(232,38,45,.4);
}
.city-card::before{
  content:attr(data-name);
  position:absolute;right:-2vw;bottom:-2.5vw;
  font-family:'Fraunces',serif;font-weight:500;
  font-size:clamp(80px,12vw,180px);line-height:.85;letter-spacing:-0.05em;
  color:rgba(255,255,255,.10); white-space:nowrap;text-transform:uppercase;
  pointer-events:none;
}
.city-card h3{
  position:relative;z-index:1;margin:0;font-family:'Fraunces',serif;
  font-size:32px;letter-spacing:-0.02em;font-weight:500;
}
.city-card .city-meta{
  position:relative;z-index:1;font-size:13px;color:rgba(255,255,255,.78);
}
.city-card .city-arrow{
  position:relative;z-index:1;align-self:flex-end;
  font-size:18px;font-weight:600;
}