/* ============================================================
   BARLO DIGITAL — main.css · dark premium design system
   Palette: ink #07090F · panel #0E1420 · volt #C6F135
   ============================================================ */

/* self-hosted variable fonts (SIL OFL) — same-origin, preloaded from index.html,
   so text swaps to brand fonts at first paint instead of after a third-party handshake */
@font-face{
  font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;
  src:url("../assets/fonts/inter-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;
  src:url("../assets/fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Space Grotesk";font-style:normal;font-weight:500 700;font-display:swap;
  src:url("../assets/fonts/space-grotesk-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Space Grotesk";font-style:normal;font-weight:500 700;font-display:swap;
  src:url("../assets/fonts/space-grotesk-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* metric-matched fallbacks: the font swap must not repaint text larger
   (late LCP candidate) or shift layout (CLS) */
@font-face{font-family:"Inter Fallback";src:local("Arial");size-adjust:107.34%;ascent-override:90.25%;descent-override:22.5%;line-gap-override:0%}
@font-face{font-family:"Space Grotesk Fallback";src:local("Arial");size-adjust:102.13%;ascent-override:96.35%;descent-override:28.59%;line-gap-override:0%}

:root{
  color-scheme:dark;
  --ink:#07090F; --panel:#0E1420; --panel-2:#111827;
  --volt:#C6F135; --volt-dim:rgba(198,241,53,.14);
  --text:#F4F2EC; --mut:#8A93A6;
  --line:rgba(244,242,236,.09); --line-strong:rgba(244,242,236,.18);
  --line-btn:rgba(244,242,236,.38);
  --font-d:"Space Grotesk","Space Grotesk Fallback",system-ui,sans-serif;
  --font-b:"Inter","Inter Fallback",system-ui,sans-serif;
  --rad:18px; --rad-sm:12px;
  --wrap:1200px;
  --sec-pad:112px; --sec-pad-tight:48px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--ink); color:var(--text);
  font-family:var(--font-b); font-size:16.5px; line-height:1.65;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
::selection{background:var(--volt);color:var(--ink)}
:focus-visible{outline:2px solid var(--volt);outline-offset:3px;border-radius:4px}
.btn:focus-visible,.logo:focus-visible{outline-offset:4px;border-radius:100px}
.skip{position:fixed;top:10px;left:10px;z-index:2001;background:var(--volt);color:var(--ink);font-family:var(--font-d);font-weight:700;padding:11px 22px;border-radius:100px;transform:translateY(-200%)}
.skip:focus-visible{transform:none}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}

/* film grain overlay — layer kept small (-25%), texture static on touch devices.
   overlay blend keeps true blacks black: normal blending added a flat ~3% gray lift
   page-wide, which read as haze/overexposure on bright or low-gamma monitors */
body::after{
  content:""; position:fixed; inset:-25%; pointer-events:none; z-index:2000; opacity:.04;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
  animation:grain 9s steps(10) infinite;
}
@keyframes grain{0%,100%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-4%)}60%{transform:translate(-2%,-3%)}80%{transform:translate(4%,2%)}}
@media(pointer:coarse){body::after{animation:none}}

/* page-wide ambient starfield — canvas painted by JS, sits behind ALL content
   (negative z-index: visible only where section backgrounds are transparent) */
#stars{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}

/* cursor glow */
#cursor-glow{
  position:fixed; width:520px; height:520px; border-radius:50%; pointer-events:none; z-index:1;
  background:radial-gradient(circle,rgba(198,241,53,.045) 0%,transparent 62%);
  left:0; top:0; transform:translate3d(-2000px,-2000px,0) translate(-50%,-50%); transition:opacity .4s;
}

/* ---------- type ---------- */
h1,h2,h3,.display{font-family:var(--font-d);font-weight:700;letter-spacing:-.02em;line-height:1.04}
.h-hero{font-size:clamp(2.4rem,7vw,4.75rem)}
.h-sec{font-size:clamp(2rem,4.6vw,3.4rem);margin-bottom:14px;text-wrap:balance}
.h-card{font-size:1.45rem;letter-spacing:-.01em}
.kicker{
  font-family:var(--font-d); font-size:.8rem; font-weight:500; letter-spacing:.22em;
  text-transform:uppercase; color:var(--volt); display:flex; align-items:center; gap:12px; margin-bottom:20px;
}
.kicker::before{content:"";width:34px;height:1px;background:var(--volt)}
.lead{color:var(--mut);font-size:1.12rem;max-width:640px}
.lead b{color:var(--text)}
.volt{color:var(--volt)}
.mut{color:var(--mut)}
.kicker.center{justify-content:center}
.sec-head.center{text-align:center;margin-inline:auto}
.sec-head.center .kicker{justify-content:center}
.hero-ctas.center{justify-content:center}
.click-trigger.center{text-align:center}
section,header#hero,.offer-sec{scroll-margin-top:86px}

/* ---------- nav ---------- */
nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  background:rgba(7,9,15,.72); border-bottom:1px solid transparent;
  transition:border-color .3s;
}
nav.scrolled{border-color:var(--line)}
.nav-inner{max-width:var(--wrap);margin:0 auto;padding:0 24px;height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--font-d);font-weight:700;font-size:1.18rem;letter-spacing:.01em}
.logo .mark{width:30px;height:30px;border-radius:8px;background:var(--volt);display:grid;place-items:center;color:var(--ink);font-size:1.05rem;font-weight:700}
.logo em{font-style:normal;color:var(--mut);font-weight:500}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a:not(.btn){font-size:.93rem;color:var(--mut);transition:color .2s;position:relative}
.nav-links a:not(.btn):hover{color:var(--text)}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--volt);transition:width .25s}
.nav-links a:not(.btn):hover::after{width:100%}
#nav-burger{display:none;background:none;border:0;color:var(--text);font-size:1.6rem;cursor:pointer;padding:10px;margin:-10px}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-d);font-weight:700;font-size:.98rem;
  padding:15px 28px;border-radius:100px;cursor:pointer;border:0;
  transition:transform .22s ease,box-shadow .25s,background .2s;
  will-change:transform;
}
.btn-volt{background:var(--volt);color:var(--ink)}
.btn-volt:hover{box-shadow:0 0 42px rgba(198,241,53,.35)}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--line-btn)}
.btn-ghost:hover{border-color:var(--volt);color:var(--volt)}
.btn .arr{transition:transform .25s}
.btn:hover .arr{transform:translateX(4px)}
.btn-sm{padding:11px 22px}

/* ---------- hero ---------- */
#hero{
  min-height:100svh; position:relative; display:flex; flex-direction:column; justify-content:center;
  padding:140px 0 40px; overflow:hidden;
  background:url("../assets/img/hero-field.webp") center bottom/cover no-repeat var(--ink);
}
/* mid-stop raised .18->.34: hero-field highlights blew out the hero's midfield on
   bright monitors; bottom .92 seats the metrics band into ink */
#hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,9,15,.66) 0%,rgba(7,9,15,.34) 55%,rgba(7,9,15,.92) 100%)}
#particles{position:absolute;inset:0;width:100%;height:100%;opacity:.4}
.hero-grid{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:center}
.hero-copy .lead{margin:26px 0 36px}
.hero-ctas{display:flex;gap:16px;flex-wrap:wrap}
/* ---- the obsidian: dimensional object, not a floating square ----
   the image now carries its own baked alpha vignette + rebuilt facet lighting
   (no CSS mask needed). Depth comes from three cues: a dim two-tone atmosphere
   BEHIND it (cool top-light + volt under-glow), a layered contact+ambient
   shadow stack on the silhouette, and a ground shadow that shrinks/fades in
   counter-phase with the float — the classic levitation cue. */
.hero-art{position:relative;display:grid;place-items:center}
.hero-art::before{
  content:"";position:absolute;width:min(470px,88%);aspect-ratio:1;border-radius:50%;
  background:
    radial-gradient(42% 42% at 63% 28%,rgba(244,242,236,.05),transparent 70%),
    radial-gradient(52% 52% at 50% 60%,rgba(198,241,53,.075),transparent 72%);
  filter:blur(8px);pointer-events:none;
}
.hero-art::after{
  content:"";position:absolute;bottom:3%;width:min(280px,56%);height:34px;border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.6),transparent 70%);
  filter:blur(9px);animation:floatShadow 10s ease-in-out infinite;pointer-events:none;
}
.hero-art img{
  position:relative;z-index:1;width:min(400px,80%);
  filter:drop-shadow(0 16px 26px rgba(0,0,0,.55)) drop-shadow(0 46px 90px rgba(0,0,0,.45));
  animation:float 10s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0) rotate(-1.3deg)}50%{transform:translateY(-20px) rotate(1.5deg)}}
@keyframes floatShadow{0%,100%{transform:scaleX(1);opacity:.6}50%{transform:scaleX(.8);opacity:.32}}
.hl .swap-stack{display:block;height:1.08em;white-space:nowrap;overflow:visible}
.hl .swap{color:var(--volt)}
.hl .caret{display:inline-block;width:3px;height:.85em;background:var(--volt);margin-left:4px;vertical-align:-6%;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* metrics bar */
.metrics{
  position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--rad);
  overflow:hidden;margin-top:70px;
}
.metric{background:rgba(13,18,29,.9);backdrop-filter:blur(8px);padding:32px 24px 30px;position:relative;transition:background .3s}
.metric::before{content:"";position:absolute;top:24px;left:26px;width:28px;height:3px;background:var(--volt);border-radius:2px}
.metric:hover{background:rgba(22,31,48,.95)}
.metric b{font-family:var(--font-d);font-size:clamp(2.2rem,3.8vw,3.1rem);font-weight:700;display:block;letter-spacing:-.03em;margin:16px 0 8px;color:var(--text)}
.metric b .u{color:var(--volt)}
.metric > span{color:var(--mut);font-size:.75rem;text-transform:uppercase;letter-spacing:.14em}

/* ---------- marquees ---------- */
.marquee-block{padding:64px 0 12px;border-top:1px solid var(--line)}
.marquee-label{text-align:center;color:var(--mut);font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;margin-bottom:26px}
.marquee{overflow:hidden;position:relative;padding:8px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee~.marquee-label{margin-top:34px}
.marquee-track{display:flex;align-items:center;gap:72px;width:max-content;animation:scroll 42s linear infinite}
.marquee:hover .marquee-track,.marquee:focus .marquee-track,
.marquee:focus-within .marquee-track,.marquee.paused .marquee-track{animation-play-state:paused}
.marquee.rev .marquee-track{animation-direction:reverse;animation-duration:52s}
.marquee-track img{height:30px;width:auto;opacity:.5;filter:grayscale(1) brightness(1.32);transition:opacity .25s,filter .25s}
.marquee-track img:hover{opacity:1;filter:none}
.marquee-track img.tall{height:40px}
.marquee-track img.wide{height:22px}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
section{padding:var(--sec-pad) 0;position:relative}
section>.wrap{position:relative}
.sec-glow{background:url("../assets/img/section-glow.webp") center/cover no-repeat var(--ink)}
/* feather the olive haze into ink at both seams */
.sec-glow::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--ink),rgba(7,9,15,0) 140px,rgba(7,9,15,0) calc(100% - 140px),var(--ink));pointer-events:none}
.sec-head{max-width:720px;margin-bottom:60px}

/* problem cards */
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.stat-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--rad);
  padding:32px 30px;transition:transform .3s,border-color .3s;transform-style:preserve-3d;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.stat-card:hover{border-color:rgba(198,241,53,.4)}
.stat-card b{font-family:var(--font-d);font-size:2.6rem;letter-spacing:-.03em;display:block;margin-bottom:8px}
.stat-card b.volt{color:var(--volt)}
.stat-card b .unit{font-size:1.2rem}
.stat-card p{color:var(--mut);font-size:.98rem}

/* services */
.svc-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.svc-card{
  grid-column:span 2; position:relative; border-radius:var(--rad); overflow:hidden;
  border:1px solid var(--line); background:var(--panel); min-height:340px;
  display:flex; flex-direction:column; justify-content:flex-end; padding:28px;
  transition:transform .35s,border-color .35s; isolation:isolate;
}
.svc-card:nth-child(1),.svc-card:nth-child(2),.svc-card:nth-child(6),.svc-card:nth-child(7){grid-column:span 3}
.svc-card::before{content:"";position:absolute;inset:-4%;z-index:-1;background:center/cover no-repeat;opacity:.92;transition:opacity .4s,transform .6s}
/* card art lives here, not in inline custom properties: Chrome resolves url() vars
   against this stylesheet, so inline document-relative paths 404 */
.svc-card[href="#svc-paid-ads"]::before{background-image:url("../assets/img/offer-paid-ads.webp")}
.svc-card[href="#svc-tracking"]::before{background-image:url("../assets/img/offer-tracking.webp")}
.svc-card[href="#svc-appointments"]::before{background-image:url("../assets/img/offer-appointments.webp")}
.svc-card[href="#svc-leadresponse"]::before{background-image:url("../assets/img/offer-leadresponse.webp")}
.svc-card[href="#svc-storm"]::before{background-image:url("../assets/img/offer-storm.webp")}
.svc-card[href="#svc-webdesign"]::before{background-image:url("../assets/img/offer-web.webp")}
.svc-card[href="#svc-seo"]::before{background-image:url("../assets/img/offer-seo.webp")}
.svc-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,9,15,.45) 0%,rgba(7,9,15,0) 30%,rgba(7,9,15,.3) 52%,rgba(7,9,15,.86) 78%)}
/* square-ish cards (03/04) crop landscape art hard — aim the crop at each piece's lit region */
.svc-card[href="#svc-appointments"]::before{background-position:20% 50%}
.svc-card[href="#svc-leadresponse"]::before{background-position:72% 50%}
.svc-card:hover{border-color:rgba(198,241,53,.45);transform:translateY(-6px)}
.svc-card:hover::before{opacity:1;transform:scale(1.04)}
.svc-card.hot{border-color:rgba(198,241,53,.5)}
.svc-card h3{margin-bottom:8px}
.svc-card p{color:var(--mut);font-size:.95rem;margin-bottom:14px}
.svc-card .from{font-family:var(--font-d);font-size:.9rem;color:var(--volt);letter-spacing:.04em}
.svc-card .num{position:absolute;top:26px;left:28px;font-family:var(--font-d);font-size:.78rem;letter-spacing:.2em;color:rgba(198,241,53,.85)}
.svc-card .go{position:absolute;top:22px;right:22px;width:40px;height:40px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;font-size:1.1rem;transition:all .3s;background:rgba(7,9,15,.4)}
.svc-card:hover .go{background:var(--volt);color:var(--ink);border-color:var(--volt);transform:rotate(45deg)}

/* results / proof vault */
#results{background:radial-gradient(44% 30% at 10% 3%,rgba(198,241,53,.045),transparent 70%),url("../assets/img/proof-vault.webp") center/cover no-repeat var(--ink)}
#results::before{content:"";position:absolute;left:0;right:0;bottom:0;height:280px;background:linear-gradient(180deg,rgba(7,9,15,0),var(--ink) 92%);pointer-events:none}
#results .hero-ctas.center{margin-top:54px}
#problem .hero-ctas.center{margin-top:44px}
.disclose{font-size:.9rem;color:var(--mut);background:rgba(14,20,32,.66);border:1px solid var(--line);border-left:2px solid var(--volt);border-radius:var(--rad-sm);padding:16px 20px;margin:-34px 0 54px;max-width:640px}
.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.case{
  background:rgba(14,20,32,.9);border:1px solid var(--line);border-radius:var(--rad);
  overflow:hidden;transition:border-color .3s,transform .3s;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.case:hover{border-color:rgba(198,241,53,.4);transform:translateY(-4px)}
.case-shot{position:relative;background:#0A0D14;border-bottom:1px solid var(--line)}
.case-shot .chrome{display:flex;gap:6px;padding:11px 14px;border-bottom:1px solid var(--line)}
.case-shot .chrome i{width:10px;height:10px;border-radius:50%;background:var(--line-strong)}
.case-shot .chrome i:first-child{background:rgba(198,241,53,.5)}
.case-shot .shot-clip{overflow:hidden;max-height:250px}
.case-shot img{width:100%;height:250px;object-fit:cover;object-position:50% 0;transition:transform .5s}
.case-shot img.pos-b{object-position:50% 100%} /* money rows live at the table bottom */
.case-shot img.h-int{height:auto} /* short strip screenshots keep intrinsic ratio */
.case:hover .case-shot img{transform:scale(1.03)}
.case-body{padding:24px}
.case-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:14px}
.case-nums div b{font-family:var(--font-d);font-size:1.75rem;letter-spacing:-.02em;display:block}
.case-nums div span{font-size:.8rem;color:var(--mut);text-transform:uppercase;letter-spacing:.08em}
.case-body h3{font-size:1.12rem;margin-bottom:8px}
.case-body p{color:var(--mut);font-size:.93rem}

/* speed / stopwatch */
.speed-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
.stopwatch{position:relative;width:min(320px,80vw);aspect-ratio:1;margin:0 auto}
.stopwatch svg{width:100%;height:100%;transform:rotate(-90deg)}
.stopwatch .ring-bg{fill:none;stroke:var(--line);stroke-width:6}
.stopwatch .ring{fill:none;stroke:var(--volt);stroke-width:6;stroke-linecap:round;stroke-dasharray:880;stroke-dashoffset:880;filter:drop-shadow(0 0 8px rgba(198,241,53,.6))}
.stopwatch .sw-num{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.stopwatch .sw-num b{font-family:var(--font-d);font-size:3.4rem;letter-spacing:-.03em;display:block}
.stopwatch .sw-num span{color:var(--mut);font-size:.85rem}
.checklist{list-style:none;margin-top:26px}
.checklist li{padding:11px 0 11px 34px;position:relative;color:var(--mut);border-bottom:1px solid var(--line)}
.checklist li::before{content:"";position:absolute;left:2px;top:16px;width:16px;height:16px;border-radius:50%;background:var(--volt-dim);border:1px solid var(--volt)}
.checklist li::after{content:"";position:absolute;left:7px;top:20px;width:6px;height:9px;border:solid var(--volt);border-width:0 2px 2px 0;transform:rotate(40deg) scale(.9)}
.checklist li b{color:var(--text)}
.speed-wrap .btn{margin-top:26px}

/* offer detail sections */
#offers{padding-top:var(--sec-pad-tight)}
.offer-sec{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:80px 0;border-top:1px solid var(--line)}
.offer-sec.flip .offer-art{order:2}
.offer-art{border-radius:var(--rad);overflow:hidden;border:1px solid var(--line);position:relative;aspect-ratio:3/2}
.offer-art img{width:100%;height:calc(100% + 36px);margin-top:-18px;object-fit:cover;transition:transform .6s}
.offer-sec:hover .offer-art img{transform:scale(1.03)}
.offer-copy .kicker{margin-bottom:12px}
.offer-copy h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:14px}
.offer-copy .price-line{font-family:var(--font-d);color:var(--volt);margin:18px 0 8px;font-size:1.05rem}
.offer-copy ul{list-style:none;margin:16px 0}
.offer-copy ul li{padding:8px 0 8px 26px;position:relative;color:var(--mut);font-size:.97rem}
.offer-copy ul li::before{content:"→";position:absolute;left:0;color:var(--volt);font-family:var(--font-d)}

/* pricing wedges */
.wedges{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1240px;margin:0 auto}
.wedge{
  background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--rad);
  padding:44px 38px;text-align:center;position:relative;
  transition:transform .3s,border-color .3s;
  display:flex;flex-direction:column;align-items:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.wedge:hover{transform:translateY(-6px);border-color:var(--volt)}
.wedge .tag{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}
.wedge .price{font-family:var(--font-d);font-size:4rem;font-weight:700;letter-spacing:-.04em;margin:14px 0 4px}
.wedge.hot{border-color:rgba(198,241,53,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 70px -28px rgba(198,241,53,.4)}
.wedge .flag{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:var(--volt);color:var(--ink);font-family:var(--font-d);font-weight:700;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;padding:7px 18px;border-radius:100px;white-space:nowrap}
.wedge p{color:var(--mut);font-size:.95rem;margin:12px 0 24px}
.wedge .credit{display:inline-block;background:var(--volt-dim);border:1px solid rgba(198,241,53,.35);color:var(--volt);font-size:.8rem;border-radius:100px;padding:6px 14px;margin-bottom:24px}
.pricing-note{text-align:center;color:var(--mut);margin-top:34px;font-size:.95rem;max-width:72ch;margin-inline:auto}
.pricing-note b{color:var(--text)}

/* founder */
.founder{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center}
.founder-body .btn{margin-top:30px}
.founder-img{border-radius:var(--rad);overflow:hidden;border:1px solid var(--line);position:relative;aspect-ratio:3/4;max-height:680px}
.founder-img::after{content:"";position:absolute;inset:0;box-shadow:inset 0 -80px 80px -40px var(--ink)}
.founder-img img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.founder-body h2{margin-bottom:18px}
.founder-body p{color:var(--mut);margin-bottom:16px}
.founder-body p b{color:var(--text)}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.badge{font-size:.8rem;font-family:var(--font-d);border:1px solid var(--line-strong);border-radius:100px;padding:7px 16px;color:var(--mut)}
.badge.v{border-color:rgba(198,241,53,.4);color:var(--volt)}

/* partners strip */
#partners{padding-top:0}
.partners-strip .h-sec{font-size:clamp(1.6rem,3.4vw,2.4rem)}
.partners-strip p.mut{max-width:520px}
.partners-cta{text-align:right}
.partners-strip{
  background:url("../assets/img/partners-panel.webp") center/cover no-repeat var(--panel);
  border-radius:var(--rad);border:1px solid var(--line);padding:60px;position:relative;overflow:hidden;
  display:grid;grid-template-columns:1.3fr .7fr;gap:30px;align-items:center;
}
.partners-strip::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,9,15,.9),rgba(7,9,15,.4))}
.partners-strip>*{position:relative}

/* FAQ */
#faq{padding-top:var(--sec-pad-tight)}
.faq{max-width:780px;margin:0 auto}
.faq details{border-bottom:1px solid var(--line);padding:6px 0}
.faq summary{
  font-family:var(--font-d);font-weight:500;font-size:1.08rem;padding:20px 44px 20px 0;
  cursor:pointer;list-style:none;position:relative;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+" / "";position:absolute;right:4px;top:50%;transform:translateY(-50%);color:var(--volt);font-size:1.5rem;transition:transform .3s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq details p{color:var(--mut);padding:0 0 22px;max-width:660px}

/* CTA band */
#book{
  background:url("../assets/img/cta-band.webp") center bottom/cover no-repeat var(--ink);
  text-align:center;padding:calc(var(--sec-pad)*1.5) 0;position:relative;
}
#book::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 85% at 50% 42%,rgba(7,9,15,.94) 0%,rgba(7,9,15,.6) 62%,rgba(7,9,15,0) 100%);
  pointer-events:none;
}
#book .wrap{position:relative}
#book h2{font-size:clamp(2.4rem,5.5vw,4rem);margin-bottom:18px}
#book .lead{margin:0 auto 40px}
.mail-fallback{text-align:center;margin-top:14px;font-size:.85rem}
.mail-fallback a{text-decoration:underline;text-underline-offset:3px}

/* footer */
footer{border-top:1px solid var(--line);padding:56px 0 40px;color:var(--mut);font-size:.9rem}
.foot-grid a.volt{text-decoration:underline;text-underline-offset:3px}
.foot-grid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:center}
.foot-note{margin-top:26px;font-size:.8rem;max-width:72ch}

.click-trigger{display:block;font-size:.8rem;color:var(--mut);margin-top:12px;letter-spacing:.02em}
.wedge .stack{list-style:none;text-align:left;margin:18px auto 8px;max-width:300px;font-size:.85rem;color:var(--mut)}
.wedge .stack li{padding:5px 0 5px 24px;position:relative}
.wedge .stack li::before{content:"✓";position:absolute;left:0;color:var(--volt);font-family:var(--font-d);font-weight:700}
.wedge .chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:auto}

/* reveal animation base state */
.rv{opacity:0;transform:translateY(34px)}

/* ambient light for sections without hero-grade artwork — CSS glows as the base layer */
#audit{background:radial-gradient(52% 44% at 82% 8%,rgba(198,241,53,.05),transparent 70%)}
#process{background:radial-gradient(50% 46% at 12% 88%,rgba(198,241,53,.045),transparent 70%),url("../assets/img/process-current.webp") center top/100% auto no-repeat}
#services{background:radial-gradient(56% 40% at 85% 97%,rgba(198,241,53,.05),transparent 70%),radial-gradient(38% 26% at 90% 4%,rgba(198,241,53,.035),transparent 70%)}
#offers{background:radial-gradient(50% 22% at 50% 0%,rgba(198,241,53,.045),transparent 72%)}
#founder{background:radial-gradient(46% 40% at 90% 18%,rgba(198,241,53,.035),transparent 70%)}
#testimonials{background:radial-gradient(48% 42% at 14% 5%,rgba(198,241,53,.045),transparent 70%)}
#stay{background:radial-gradient(50% 62% at 88% 46%,rgba(198,241,53,.05),transparent 70%)}
/* constellation texture layer (v2 art) — above the glow, below content; flipped
   per section so one file reads as three different skies */
#audit::before,#testimonials::before,#stay::before{content:"";position:absolute;inset:0;background:url("../assets/img/ambient-constellation.webp") center/cover no-repeat;opacity:.55;pointer-events:none}
#testimonials::before{background-size:100% auto;background-position:top;transform:scaleX(-1)}
#stay::before{transform:scale(-1)}

/* ---------- trust rail / guarantee rail ---------- */
.trust-band{padding:48px 0 42px}
.trust-band .marquee-label{margin-bottom:22px}
.rail{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:12px 36px;padding:0}
.rail li{font-family:var(--font-d);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);display:flex;align-items:center;gap:10px}
.rail li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--volt);flex:none}
.rail.tight{margin-top:46px}
.sec-head.center .lead{margin-inline:auto}

/* ---------- audit deliverables ---------- */
.deliv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.deliv-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--rad);padding:28px 26px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04);transition:border-color .3s}
.deliv-card:hover{border-color:rgba(198,241,53,.4)}
.deliv-card .ix{font-family:var(--font-d);font-size:.72rem;letter-spacing:.2em;color:rgba(198,241,53,.85);display:block;margin-bottom:14px}
.deliv-card h3{font-size:1.06rem;margin-bottom:8px}
.deliv-card p{color:var(--mut);font-size:.93rem}
#audit .hero-ctas.center{margin-top:44px}

/* ---------- process ---------- */
.process{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.step{background:var(--panel);border:1px solid var(--line);border-radius:var(--rad);padding:28px 26px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.step-day{font-family:var(--font-d);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--volt);background:var(--volt-dim);border:1px solid rgba(198,241,53,.35);border-radius:100px;padding:5px 13px;display:inline-block;margin-bottom:16px}
.step h3{font-size:1.06rem;margin-bottom:8px}
.step p{color:var(--mut);font-size:.93rem}
#process .click-trigger{margin-top:26px}

/* ---------- anonymized testimonials + client stories ---------- */
.tsm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tsm-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--rad);padding:28px 26px;margin:0;display:flex;flex-direction:column;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.tsm-card blockquote{margin:0}
.tsm-card blockquote::before{content:"\201C";display:block;color:var(--volt);font-family:var(--font-d);font-size:2.4rem;font-weight:700;line-height:.6;margin-bottom:14px}
.tsm-card blockquote p{color:var(--text);font-size:.96rem;line-height:1.62}
.tsm-card figcaption{margin-top:auto;padding-top:18px;color:var(--mut);font-size:.76rem;text-transform:uppercase;letter-spacing:.14em}
.stories-label{text-align:center;color:var(--mut);font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;margin:72px 0 26px}
.stories{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.story{background:var(--panel);border:1px solid var(--line);border-radius:var(--rad);padding:28px 26px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.story h3{font-size:1.06rem;margin-bottom:16px}
.story dl{margin:0;display:grid;gap:12px}
.story dt{font-family:var(--font-d);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--volt);margin-bottom:3px}
.story dd{margin:0;color:var(--mut);font-size:.92rem}

/* ---------- why clients stay ---------- */
.stay-body{max-width:780px}
.stay-body p{color:var(--mut);margin-bottom:16px}
.stay-body p b{color:var(--text)}
.path-line{font-family:var(--font-d);color:var(--volt);font-size:.98rem;letter-spacing:.02em;margin:22px 0 8px}
.stay-body .hero-ctas{margin-top:26px}

/* ---------- booking calendar embed (renders when CONFIG.CAL_EMBED is set) ---------- */
.cal-embed{display:none;margin:0 auto 44px;max-width:860px}
.cal-embed.on{display:block;background:var(--panel);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden}
.cal-embed iframe{width:100%;height:680px;border:0;display:block}

/* ---------- responsive ---------- */
@media(max-width:1000px){
  .hero-grid{grid-template-columns:1fr}
  .hero-art{display:none}
  .metrics{grid-template-columns:repeat(2,1fr)}
  .cards-3{grid-template-columns:1fr}
  .svc-grid{grid-template-columns:1fr 1fr}
  .svc-card,.svc-card:nth-child(1),.svc-card:nth-child(2),
  .svc-card:nth-child(6){grid-column:span 1}
  .svc-card:nth-child(7){grid-column:span 2}
  .case-grid{grid-template-columns:1fr}
  .speed-wrap,.offer-sec,.founder,.partners-strip{grid-template-columns:1fr}
  .offer-sec.flip .offer-art{order:0}
  .wedges{grid-template-columns:1fr}
  .nav-links{display:none;position:fixed;inset:76px 0 auto 0;background:rgba(7,9,15,.97);flex-direction:column;padding:30px;gap:22px;border-bottom:1px solid var(--line)}
  .nav-links.open{display:flex}
  #nav-burger{display:block}
  .partners-cta{text-align:left}
  .partners-strip{padding:44px}
  .wedge .stack{max-width:420px}
  .speed-wrap .stopwatch{order:2;margin-top:44px}
  .offer-art{aspect-ratio:21/9}
  .svc-card:nth-child(7){min-height:240px}
  .deliv-grid,.process,.tsm-grid{grid-template-columns:1fr 1fr}
  .stories{grid-template-columns:1fr}
}
@media(max-width:1000px) and (min-width:561px){
  .stat-card{display:grid;grid-template-columns:minmax(150px,auto) 1fr;column-gap:32px;align-items:center}
  .stat-card b{margin-bottom:0}
}
@media(max-width:560px){
  /* big case numbers overflow three rigid columns on phones — flex lets them
     size to content and wrap gracefully instead of clipping at the card edge */
  .case-nums{display:flex;flex-wrap:wrap;gap:12px 28px}
  .case-nums div b{font-size:1.35rem}
  .case-nums div span{font-size:.72rem}
  .svc-grid{grid-template-columns:1fr}
  .svc-card:nth-child(n){grid-column:span 1}
  #book{padding:90px 0 110px}
  .metrics{grid-template-columns:1fr 1fr}
  .partners-strip{padding:36px 24px}
  .deliv-grid,.process,.tsm-grid{grid-template-columns:1fr}
  .rail{gap:10px 22px}
}

/* reduced motion: kill everything; frozen marquees become scrollable so no logo is unreachable */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  html{scroll-behavior:auto}
  .marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
}

/* sticky mobile CTA + tighter mobile rhythm */
.mcta{display:none}
@media(max-width:720px){
  :root{--sec-pad:80px}
  .offer-sec{padding:56px 0}
  .sec-head{margin-bottom:44px}
  .trust-band{padding:38px 0 32px}
  .stories-label{margin:56px 0 22px}
  .rail.tight{margin-top:36px}
  .mcta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(7,9,15,.92);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .mcta .btn{width:100%;justify-content:center}
  .mcta.off{display:none}
  body{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
}

/* self-serve payment */
.paybtn{margin-top:10px}
.wedge .paybtn{width:100%;justify-content:center}
.paymethods{display:block;margin-top:12px;color:var(--mut,#9aa6b8);font-size:.72rem;letter-spacing:.04em}
.pay-overlay{position:fixed;inset:0;z-index:200;background:rgba(4,6,11,.82);backdrop-filter:blur(6px);display:grid;place-items:center;padding:20px}
.pay-modal{background:var(--panel,#0E1420);border:1px solid var(--line,#1c2636);border-radius:16px;max-width:440px;width:100%;padding:30px;position:relative}
.pay-x{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--mut,#9aa6b8);font-size:1.1rem;cursor:pointer;line-height:1}
.pay-h{font-family:var(--font-d,inherit);font-size:1.25rem;font-weight:700;margin-bottom:8px;color:var(--text,#fff)}
.pay-sub{color:var(--mut,#9aa6b8);font-size:.9rem;margin-bottom:20px;line-height:1.5}
.pay-methods{display:flex;flex-direction:column;gap:10px}
.pay-opt{width:100%;justify-content:center}
.pay-foot{margin-top:18px;font-size:.8rem;color:var(--mut,#9aa6b8)}
.pay-foot a,.pay-sub a{color:var(--volt,#C6F135)}
@media(prefers-reduced-motion:no-preference){.pay-modal{animation:payin .2s ease}}
@keyframes payin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}