/* ═══════════════════════════════════════════════════════════════
   MAGNOLIA DIGITAL — Design System v2.0
   Brand Guide compliant. Linear precision × Orbi energy.
   ═══════════════════════════════════════════════════════════════ */

/* ── Tokens ─────────────────────────────────────────────────── */
:root {
  --deep:#0A0A0F; --surface:#111118; --elevated:#18181F; --hover:#202028;
  --light:#F8F8FC; --light-alt:#EFEFF5; --light-border:rgba(10,10,15,0.08); --white:#FFFFFF;
  --text:#F0F0F5; --text-muted:#9898A8; --text-dim:#55556A;
  --text-on-light:#0A0A0F; --text-muted-on-light:#5A5A70; --text-dim-on-light:#9898A8;
  --accent:#635BFF; --accent-hi:#7C6FFF; --accent-lo:#4A44CC;
  --accent-dim:rgba(99,91,255,0.12); --accent-glow:rgba(99,91,255,0.06); --accent-border:rgba(99,91,255,0.25);
  --cta:#FF6B35; --cta-hi:#FF8255; --cta-dim:rgba(255,107,53,0.12);
  --success:#22C55E; --warning:#FBBF24; --error:#EF4444;
  --display:'Plus Jakarta Sans',-apple-system,sans-serif;
  --body:'Inter',-apple-system,sans-serif;
  --mono:'JetBrains Mono','SF Mono',monospace;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;
  --s6:32px;--s7:48px;--s8:64px;--s9:96px;--s10:128px;
  --r-sm:8px;--r-md:12px;--r-lg:20px;--r-xl:28px;--r-full:9999px;
  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --ease-spring:cubic-bezier(0.34,1.56,0.64,1);
  --dur-fast:150ms;--dur-std:300ms;--dur-slow:500ms;
}

/* ── Reset ──────────────────────────────────────────────────── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--deep);color:var(--text);-webkit-font-smoothing:antialiased;line-height:1.6;overflow-x:hidden;}
img,video{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{cursor:pointer;border:none;background:none;font:inherit;}
ul{list-style:none;}

/* ── Container ──────────────────────────────────────────────── */
.container{max-width:1200px;margin:0 auto;padding:0 var(--s7);}
@media(max-width:768px){.container{padding:0 var(--s5);}}

/* ── Eyebrow ────────────────────────────────────────────────── */
.eyebrow{display:inline-flex;align-items:center;gap:var(--s2);font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--accent);margin-bottom:var(--s5);}
.eyebrow::before{content:'';display:inline-block;width:20px;height:1px;background:var(--accent);}
.eyebrow-center{justify-content:center;}
.eyebrow-center::before{display:none;}
.eyebrow-muted{color:var(--text-dim);}
.eyebrow-muted::before{background:var(--text-dim);}

/* ── Buttons ────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:var(--s2);font-family:var(--body);font-size:14px;font-weight:600;letter-spacing:0.2px;padding:11px 22px;border-radius:var(--r-full);transition:all var(--dur-std) var(--ease-out);white-space:nowrap;}
.btn-lg{font-size:15px;padding:14px 28px;}
.btn svg{width:16px;height:16px;flex-shrink:0;}
.btn-primary{background:var(--cta);color:#fff;}
.btn-primary:hover{background:var(--cta-hi);transform:translateY(-1px);box-shadow:0 8px 24px rgba(255,107,53,0.35);}
.btn-secondary{background:transparent;color:var(--text);border:1px solid rgba(255,255,255,0.12);}
.btn-secondary:hover{background:var(--elevated);border-color:rgba(255,255,255,0.2);transform:translateY(-1px);}
.btn-accent{background:var(--accent);color:#fff;}
.btn-accent:hover{background:var(--accent-hi);transform:translateY(-1px);box-shadow:0 8px 24px rgba(99,91,255,0.4);}
.btn-accent-outline{background:transparent;color:var(--accent);border:1px solid var(--accent-border);}
.btn-accent-outline:hover{background:var(--accent-dim);transform:translateY(-1px);}
.btn-dark-outline{background:transparent;color:var(--text-on-light);border:1px solid var(--light-border);}
.btn-dark-outline:hover{background:var(--light-alt);}

/* ── Nav ────────────────────────────────────────────────────── */
/* 72 × 1.2 = 86 | 48px h-pad × 1.2 = 58px */
#nav{position:fixed;top:0;left:0;right:0;z-index:999;height:86px;display:flex;align-items:center;padding:0 58px;transition:background var(--dur-std),border-color var(--dur-std);}
#nav.scrolled{background:rgba(10,10,15,0.88);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid rgba(255,255,255,0.06);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;width:100%;}
/* 18px × 1.15 = 21px | sub 12px × 1.15 = 14px */
.nav-wordmark{font-family:var(--display);font-weight:800;font-size:21px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text);display:flex;flex-direction:column;line-height:1.1;}
.nav-wordmark .nw-sub{font-size:14px;font-weight:400;letter-spacing:0.28em;color:var(--accent);font-family:var(--mono);}
/* gap 32px × 1.2 = 38px | link font 13px × 1.2 = 16px */
.nav-links{display:flex;align-items:center;gap:38px;}
.nav-links a{font-size:16px;font-weight:500;color:var(--text-dim);transition:color var(--dur-fast);}
.nav-links a:hover{color:var(--text);}
.nav-cta{margin-left:var(--s4);}
@media(max-width:768px){.nav-links,.nav-cta{display:none;}}
@media(max-width:768px){#nav{padding:0 var(--s5);}}

/* ── Hero ───────────────────────────────────────────────────── */
#hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding-top:140px;padding-bottom:var(--s10);position:relative;overflow:hidden;}
#hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(99,91,255,0.18) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse 90% 90% at 50% 50%,#000 30%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 90% 90% at 50% 50%,#000 30%,transparent 100%);pointer-events:none;}
#hero::after{content:'';position:absolute;width:900px;height:700px;background:radial-gradient(ellipse,rgba(99,91,255,0.1) 0%,transparent 65%);top:42%;left:50%;transform:translate(-50%,-50%);pointer-events:none;}
.hero-inner{position:relative;z-index:1;}
.hero-location{font-family:var(--mono);font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--text-dim);margin-bottom:var(--s6);display:flex;align-items:center;gap:var(--s3);}
.hero-location .dot{width:6px;height:6px;background:var(--accent);border-radius:50%;flex-shrink:0;box-shadow:0 0 8px var(--accent);}
.hero-headline{font-family:var(--display);font-size:clamp(52px,7.5vw,100px);font-weight:800;line-height:0.93;letter-spacing:-3.5px;color:var(--text);margin-bottom:var(--s6);max-width:960px;}
.hero-headline .word{display:inline-block;overflow:hidden;vertical-align:bottom;}
.hero-headline .word-inner{display:inline-block;transform:translateY(110%);}
.hero-headline .hi{color:var(--accent);}
.hero-sub{font-size:18px;font-weight:400;color:var(--text-muted);line-height:1.72;max-width:520px;margin-bottom:var(--s7);opacity:0;transform:translateY(16px);}
.hero-actions{display:flex;align-items:center;gap:var(--s4);margin-bottom:var(--s9);opacity:0;transform:translateY(16px);}
.hero-stats{display:flex;align-items:center;gap:var(--s7);padding-top:var(--s7);border-top:1px solid rgba(255,255,255,0.06);opacity:0;}
.hero-stat{display:flex;flex-direction:column;gap:4px;}
.hero-stat-num{font-family:var(--display);font-size:20px;font-weight:700;color:var(--text);letter-spacing:-0.5px;}
.hero-stat-label{font-size:12px;color:var(--text-dim);}
.stat-sep{width:1px;height:32px;background:rgba(255,255,255,0.07);flex-shrink:0;}
@media(max-width:640px){.hero-headline{letter-spacing:-2px;}.hero-actions{flex-direction:column;align-items:flex-start;}.hero-stats{flex-wrap:wrap;gap:var(--s5);}.stat-sep{display:none;}}

/* ── Marquee ────────────────────────────────────────────────── */
#marquee{overflow:hidden;padding:14px 0;background:var(--surface);border-top:1px solid rgba(255,255,255,0.05);border-bottom:1px solid rgba(255,255,255,0.05);}
.marquee-track{display:flex;gap:var(--s7);width:max-content;animation:mq-scroll 35s linear infinite;}
.marquee-item{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;color:var(--text-dim);white-space:nowrap;display:flex;align-items:center;gap:var(--s5);}
.marquee-item::after{content:'·';color:var(--accent);font-size:16px;}
@keyframes mq-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ── Problem ────────────────────────────────────────────────── */
#problem{padding:var(--s10) 0;}
.problem-header{max-width:640px;margin-bottom:var(--s9);}
.section-headline{font-family:var(--display);font-size:clamp(32px,4vw,52px);font-weight:700;line-height:1.05;letter-spacing:-2px;color:var(--text);margin-bottom:var(--s5);}
.section-lead{font-size:17px;color:var(--text-muted);line-height:1.75;max-width:560px;}
.section-headline-light{color:var(--text-on-light);}
.section-lead-light{color:var(--text-muted-on-light);}
.problem-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);}
.problem-card{background:var(--surface);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-lg);padding:var(--s7);position:relative;overflow:hidden;transition:border-color var(--dur-std),transform var(--dur-std) var(--ease-out);}
.problem-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:0;transition:opacity var(--dur-std);}
.problem-card:hover{border-color:rgba(255,255,255,0.1);transform:translateY(-3px);}
.problem-card:hover::before{opacity:1;}
.problem-card:hover .problem-icon{background:var(--accent-dim);border-color:var(--accent-border);}
.problem-num{font-family:var(--mono);font-size:11px;color:var(--text-dim);letter-spacing:2px;margin-bottom:var(--s5);}
.problem-icon{width:44px;height:44px;background:var(--elevated);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;margin-bottom:var(--s5);transition:all var(--dur-std);}
.problem-icon svg{width:22px;height:22px;color:var(--text-dim);}
.problem-card h3{font-family:var(--display);font-size:17px;font-weight:700;color:var(--text);margin-bottom:var(--s3);line-height:1.3;}
.problem-card p{font-size:14px;color:var(--text-muted);line-height:1.7;}
@media(max-width:900px){.problem-grid{grid-template-columns:1fr;}}

/* ── Plans ──────────────────────────────────────────────────── */
#plans{padding:var(--s10) 0;background:var(--surface);border-top:1px solid rgba(255,255,255,0.04);border-bottom:1px solid rgba(255,255,255,0.04);}
.plans-header{text-align:center;max-width:600px;margin:0 auto var(--s9);}
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);align-items:stretch;}
.plans-grid-4{grid-template-columns:repeat(4,1fr);}
.plan-card{background:var(--deep);border:1px solid rgba(255,255,255,0.06);border-radius:var(--r-xl);padding:var(--s7);position:relative;overflow:hidden;display:flex;flex-direction:column;}
.plan-card.featured{background:var(--elevated);border-color:var(--accent-border);box-shadow:0 0 0 1px var(--accent-border),0 32px 80px rgba(99,91,255,0.14);}
.plan-badge{display:inline-flex;align-items:center;gap:var(--s2);font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--accent);background:var(--accent-dim);border:1px solid var(--accent-border);border-radius:var(--r-full);padding:4px 12px;margin-bottom:var(--s5);}
.plan-name{font-family:var(--display);font-size:19px;font-weight:700;color:var(--text);margin-bottom:var(--s2);letter-spacing:-0.3px;}
.plan-tagline{font-size:13px;color:var(--text-muted);margin-bottom:var(--s6);line-height:1.5;}
.plan-price{display:flex;align-items:baseline;gap:var(--s2);margin-bottom:var(--s6);padding-bottom:var(--s6);border-bottom:1px solid rgba(255,255,255,0.06);}
.plan-amount{font-family:var(--display);font-size:44px;font-weight:800;color:var(--text);letter-spacing:-2.5px;line-height:1;}
.plan-period{font-size:14px;color:var(--text-dim);}
.plan-features{display:flex;flex-direction:column;gap:var(--s3);margin-bottom:var(--s5);flex:1;}
.plan-feature{display:flex;align-items:flex-start;gap:var(--s3);font-size:13px;color:var(--text-muted);line-height:1.5;}
.plan-feature-exclusive{color:var(--text);}
.feat-check{width:18px;height:18px;background:rgba(34,197,94,0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;}
.feat-check svg{width:10px;height:10px;color:var(--success);}
.feat-check-gold{background:rgba(234,179,8,0.12);}
.feat-check-gold svg{color:#EAB308;}
.plan-website-upsell{display:flex;align-items:center;gap:var(--s2);font-size:12px;color:var(--text-muted);background:rgba(99,91,255,0.07);border:1px solid rgba(99,91,255,0.18);border-radius:var(--r-md);padding:var(--s3) var(--s4);margin-bottom:var(--s6);}
.plan-website-upsell svg{width:12px;height:12px;color:var(--accent);flex-shrink:0;}
.plan-website-upsell strong{color:var(--text);}
.upsell-reg{color:var(--text-dim);font-size:11px;}
.plan-cta{display:block;width:100%;text-align:center;}
.plan-note{text-align:center;font-size:11px;color:var(--text-dim);margin-top:var(--s3);}
.plans-footer{text-align:center;margin-top:var(--s8);padding-top:var(--s7);border-top:1px solid rgba(255,255,255,0.05);}
.plans-footer p{font-size:14px;color:var(--text-muted);margin-bottom:var(--s4);}
@media(max-width:1280px){.plans-grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:1024px){.plans-grid{grid-template-columns:1fr;max-width:480px;margin:0 auto;}}
@media(max-width:640px){.plans-grid-4{grid-template-columns:1fr;max-width:480px;margin:0 auto;}}

/* ── Process ────────────────────────────────────────────────── */
#process{padding:var(--s10) 0;}
.process-header{max-width:560px;margin-bottom:var(--s9);}
.process-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s5);position:relative;}
.process-steps::before{content:'';position:absolute;top:24px;left:calc(24px + var(--s5));right:calc(24px + var(--s5));height:1px;background:linear-gradient(90deg,var(--accent-border),rgba(99,91,255,0.08));pointer-events:none;}
.step-num{width:48px;height:48px;background:var(--accent-dim);border:1px solid var(--accent-border);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:13px;font-weight:500;color:var(--accent);margin-bottom:var(--s5);position:relative;z-index:1;}
.process-step h3{font-family:var(--display);font-size:16px;font-weight:700;color:var(--text);margin-bottom:var(--s2);line-height:1.3;}
.process-step p{font-size:13px;color:var(--text-muted);line-height:1.65;}
@media(max-width:900px){.process-steps{grid-template-columns:repeat(2,1fr);}.process-steps::before{display:none;}}
@media(max-width:480px){.process-steps{grid-template-columns:1fr;}}

/* ── Proof ──────────────────────────────────────────────────── */
#proof{background:var(--light);padding:var(--s10) 0;}
.proof-inner{display:grid;grid-template-columns:1fr 1fr;gap:var(--s10);align-items:center;}
.proof-headline{font-family:var(--display);font-size:clamp(28px,3.5vw,44px);font-weight:700;line-height:1.1;letter-spacing:-1.5px;color:var(--text-on-light);margin-bottom:var(--s5);}
.proof-body{font-size:16px;color:var(--text-muted-on-light);line-height:1.75;}
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);}
.stat-block{background:var(--white);border:1px solid var(--light-border);border-radius:var(--r-lg);padding:var(--s6);box-shadow:0 2px 12px rgba(10,10,15,0.05);}
.stat-block.full{grid-column:span 2;background:var(--accent);border-color:transparent;}
.stat-value{font-family:var(--display);font-size:clamp(30px,3vw,42px);font-weight:800;color:var(--text-on-light);letter-spacing:-2px;line-height:1;margin-bottom:var(--s2);}
.stat-block.full .stat-value{color:#fff;}
.stat-label{font-size:13px;color:var(--text-muted-on-light);line-height:1.4;}
.stat-block.full .stat-label{color:rgba(255,255,255,0.7);}
@media(max-width:768px){.proof-inner{grid-template-columns:1fr;}.stats-grid{grid-template-columns:repeat(2,1fr);}}

/* ── Serve ──────────────────────────────────────────────────── */
#serve{padding:var(--s10) 0;}
.serve-header{max-width:560px;margin-bottom:var(--s9);}
.serve-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);}
.serve-card{background:var(--surface);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-lg);padding:var(--s6);transition:border-color var(--dur-std),transform var(--dur-std) var(--ease-out);}
.serve-card:hover{border-color:rgba(255,255,255,0.1);transform:translateY(-2px);}
.serve-icon{width:44px;height:44px;background:var(--elevated);border:1px solid rgba(255,255,255,0.06);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;margin-bottom:var(--s5);}
.serve-icon svg{width:22px;height:22px;color:var(--text-dim);stroke:currentColor;}
.serve-card h3{font-family:var(--display);font-size:17px;font-weight:700;color:var(--text);margin-bottom:var(--s3);}
.serve-card p{font-size:13px;color:var(--text-muted);line-height:1.65;margin-bottom:var(--s4);}
.serve-tags{display:flex;flex-wrap:wrap;gap:var(--s2);}
.serve-tag{font-family:var(--mono);font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--text-dim);background:var(--elevated);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-full);padding:3px 10px;}
@media(max-width:1100px){.serve-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.serve-grid{grid-template-columns:1fr;max-width:480px;}}

/* ── Quiz CTA band ──────────────────────────────────────────── */
#quiz-cta{padding:var(--s10) 0;background:var(--surface);border-top:1px solid rgba(255,255,255,0.04);border-bottom:1px solid rgba(255,255,255,0.04);}
.quiz-band{border:1px solid rgba(99,91,255,0.2);border-radius:var(--r-xl);padding:var(--s9);display:grid;grid-template-columns:1fr auto;gap:var(--s7);align-items:center;background:linear-gradient(135deg,rgba(99,91,255,0.06) 0%,transparent 60%);position:relative;overflow:hidden;}
.quiz-band::before{content:'';position:absolute;top:-80px;right:-80px;width:300px;height:300px;background:radial-gradient(circle,rgba(99,91,255,0.12),transparent 70%);pointer-events:none;}
.quiz-band-headline{font-family:var(--display);font-size:clamp(22px,3vw,36px);font-weight:700;color:var(--text);letter-spacing:-1px;margin-bottom:var(--s3);line-height:1.2;}
.quiz-band-body{font-size:15px;color:var(--text-muted);line-height:1.65;max-width:520px;}
.quiz-band-cta{flex-shrink:0;}
.qsp-list{display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s5);}
.qsp{display:flex;align-items:center;gap:var(--s3);font-size:13px;color:var(--text-muted);}
.qsp-num{width:22px;height:22px;background:var(--accent-dim);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10px;color:var(--accent);flex-shrink:0;}
@media(max-width:768px){.quiz-band{grid-template-columns:1fr;padding:var(--s7) var(--s6);}}

/* ── Local ──────────────────────────────────────────────────── */
#local{padding:var(--s10) 0;text-align:center;}
.local-inner{max-width:680px;margin:0 auto;}
.local-badge{display:inline-flex;align-items:center;gap:var(--s2);font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--text-dim);background:var(--elevated);border:1px solid rgba(255,255,255,0.06);border-radius:var(--r-full);padding:6px 14px;margin-bottom:var(--s6);}
.local-badge .live{width:6px;height:6px;background:var(--success);border-radius:50%;flex-shrink:0;box-shadow:0 0 0 2px rgba(34,197,94,0.2);}
.local-headline{font-family:var(--display);font-size:clamp(28px,3.5vw,44px);font-weight:700;line-height:1.1;letter-spacing:-1.5px;color:var(--text);margin-bottom:var(--s5);}
.local-body{font-size:16px;color:var(--text-muted);line-height:1.75;margin-bottom:var(--s7);}
.local-actions{display:flex;align-items:center;justify-content:center;gap:var(--s4);flex-wrap:wrap;}

/* ── Footer ─────────────────────────────────────────────────── */
#footer{background:var(--surface);border-top:1px solid rgba(255,255,255,0.05);padding:var(--s9) 0 var(--s7);}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--s7);margin-bottom:var(--s8);padding-bottom:var(--s8);border-bottom:1px solid rgba(255,255,255,0.05);}
.footer-wordmark{font-family:var(--display);font-weight:800;font-size:13px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text);display:flex;flex-direction:column;line-height:1.1;margin-bottom:var(--s5);}
.footer-wordmark .fw-sub{font-size:9px;font-weight:400;letter-spacing:0.28em;color:var(--accent);font-family:var(--mono);}
.footer-brand-desc{font-size:13px;color:var(--text-muted);line-height:1.65;max-width:260px;margin-bottom:var(--s5);}
.footer-nap{font-family:var(--mono);font-size:11px;color:var(--text-dim);letter-spacing:0.5px;line-height:2;}
.footer-col h4{font-size:10px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--text-dim);margin-bottom:var(--s5);}
.footer-col ul{display:flex;flex-direction:column;gap:var(--s3);}
.footer-col ul a{font-size:13px;color:var(--text-muted);transition:color var(--dur-fast);}
.footer-col ul a:hover{color:var(--text);}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);}
.footer-legal{font-size:12px;color:var(--text-dim);}
.footer-locale{font-family:var(--mono);font-size:10px;color:var(--text-dim);letter-spacing:2px;text-transform:uppercase;}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr;}.footer-bottom{flex-direction:column;text-align:center;}}

/* ── GSAP initial states ────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(28px);}
.reveal-left{opacity:0;transform:translateX(-28px);}
.reveal-right{opacity:0;transform:translateX(28px);}
.reveal-scale{opacity:0;transform:scale(0.94);}

/* ── Page hero (inner pages) ────────────────────────────────── */
.page-hero{padding:140px 0 var(--s9);}
.page-headline{font-family:var(--display);font-size:clamp(36px,5vw,64px);font-weight:800;letter-spacing:-2.5px;line-height:0.97;color:var(--text);margin-bottom:var(--s5);}
.page-subhead{font-size:17px;color:var(--text-muted);line-height:1.75;max-width:540px;}

/* ── Breadcrumb ─────────────────────────────────────────────── */
.breadcrumb{display:flex;align-items:center;gap:var(--s2);font-family:var(--mono);font-size:11px;color:var(--text-dim);letter-spacing:0.5px;padding:100px 0 var(--s6);}
.breadcrumb a{color:var(--text-dim);transition:color var(--dur-fast);}
.breadcrumb a:hover{color:var(--accent);}
.breadcrumb .bc-sep{color:var(--text-dim);}

/* ── Contact ────────────────────────────────────────────────── */
.contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:var(--s9);padding:var(--s7) 0 var(--s10);align-items:start;}
.contact-form{display:flex;flex-direction:column;gap:var(--s4);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);}
.form-group{display:flex;flex-direction:column;gap:var(--s2);}
.form-group label{font-size:11px;font-weight:600;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;}
.form-group input,.form-group select,.form-group textarea{background:var(--elevated);border:1px solid rgba(255,255,255,0.07);border-radius:var(--r-md);padding:12px 16px;font-family:var(--body);font-size:14px;color:var(--text);outline:none;transition:border-color var(--dur-fast);width:100%;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent-border);}
.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-dim);}
.form-group select{appearance:none;}
.form-group select option{background:var(--elevated);}
.form-group textarea{resize:vertical;min-height:120px;}
.contact-aside{}
.contact-info-block{background:var(--surface);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-lg);padding:var(--s6);margin-bottom:var(--s4);}
.contact-info-block h3{font-family:var(--display);font-size:14px;font-weight:700;color:var(--text);margin-bottom:var(--s3);}
.contact-info-block p{font-size:13px;color:var(--text-muted);line-height:1.65;}
.contact-info-block .info-detail{font-family:var(--mono);font-size:12px;color:var(--accent);margin-top:var(--s2);}
@media(max-width:768px){.contact-wrap{grid-template-columns:1fr;}.form-row{grid-template-columns:1fr;}}

/* ── FAQ ────────────────────────────────────────────────────── */
.faq-section{padding:var(--s9) 0 var(--s10);}
.faq-list{max-width:720px;}
.faq-item{border-bottom:1px solid rgba(255,255,255,0.06);}
.faq-q{width:100%;text-align:left;padding:var(--s5) 0;display:flex;align-items:center;justify-content:space-between;gap:var(--s4);font-family:var(--display);font-size:16px;font-weight:600;color:var(--text);cursor:pointer;transition:color var(--dur-fast);}
.faq-q:hover{color:var(--accent);}
.faq-q svg{width:18px;height:18px;flex-shrink:0;color:var(--text-dim);transition:transform var(--dur-std) var(--ease-out);}
.faq-item.open .faq-q svg{transform:rotate(45deg);color:var(--accent);}
.faq-item.open .faq-q{color:var(--accent);}
.faq-a{max-height:0;overflow:hidden;transition:max-height var(--dur-slow) var(--ease-out);}
.faq-a-inner{padding-bottom:var(--s5);font-size:15px;color:var(--text-muted);line-height:1.75;}
.faq-item.open .faq-a{max-height:400px;}

/* ── Quiz page ──────────────────────────────────────────────── */
.quiz-page{max-width:640px;margin:0 auto;padding:140px var(--s5) var(--s10);}
.quiz-progress{display:flex;gap:var(--s2);margin-bottom:var(--s9);}
.qp-bar{height:3px;flex:1;background:rgba(255,255,255,0.08);border-radius:var(--r-full);transition:background var(--dur-std);}
.qp-bar.done{background:var(--accent);}
.quiz-step-block{display:none;}
.quiz-step-block.active{display:block;animation:qFadeIn 0.3s var(--ease-out) forwards;}
@keyframes qFadeIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.quiz-step-label{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--text-dim);margin-bottom:var(--s4);}
.quiz-q-text{font-family:var(--display);font-size:clamp(22px,3vw,32px);font-weight:700;color:var(--text);letter-spacing:-1px;line-height:1.2;margin-bottom:var(--s7);}
.quiz-options{display:flex;flex-direction:column;gap:var(--s3);}
.quiz-option{width:100%;text-align:left;background:var(--surface);border:1px solid rgba(255,255,255,0.07);border-radius:var(--r-lg);padding:var(--s4) var(--s6);font-size:15px;color:var(--text-muted);transition:all var(--dur-std) var(--ease-out);cursor:pointer;display:flex;align-items:center;gap:var(--s4);}
.quiz-option:hover{border-color:var(--accent-border);color:var(--text);background:var(--elevated);transform:translateX(4px);}
.quiz-option.selected{border-color:var(--accent);background:var(--accent-dim);color:var(--text);}
.opt-key{width:28px;height:28px;background:var(--elevated);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:var(--text-dim);flex-shrink:0;}
.quiz-option.selected .opt-key{background:var(--accent);color:#fff;}
.quiz-result{display:none;text-align:center;}
.quiz-result.active{display:block;animation:qFadeIn 0.4s var(--ease-out) forwards;}
.result-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:var(--s4);}
.result-plan-name{font-family:var(--display);font-size:clamp(32px,5vw,52px);font-weight:800;color:var(--text);letter-spacing:-2px;margin-bottom:var(--s3);}
.result-price{font-size:24px;color:var(--text-muted);font-weight:600;margin-bottom:var(--s5);}
.result-price span{color:var(--accent);}
.result-body{font-size:16px;color:var(--text-muted);line-height:1.75;max-width:480px;margin:0 auto var(--s7);}
.result-features{display:flex;flex-direction:column;gap:var(--s3);text-align:left;max-width:420px;margin:0 auto var(--s7);}
.result-feat{display:flex;align-items:center;gap:var(--s3);font-size:14px;color:var(--text-muted);}
.result-feat::before{content:'';width:6px;height:6px;background:var(--success);border-radius:50%;flex-shrink:0;}
.result-actions{display:flex;align-items:center;justify-content:center;gap:var(--s4);flex-wrap:wrap;}
.quiz-calendar-wrap{margin-top:var(--s9);padding-top:var(--s8);border-top:1px solid rgba(255,255,255,0.06);text-align:center;}
.quiz-cal-headline{font-family:var(--display);font-size:clamp(20px,2.5vw,28px);font-weight:700;color:var(--text);letter-spacing:-0.5px;margin-bottom:var(--s3);}
.quiz-cal-body{font-size:15px;color:var(--text-muted);line-height:1.7;max-width:440px;margin:0 auto var(--s7);}
.ghl-calendar-placeholder{background:rgba(255,255,255,0.02);border:1px dashed rgba(255,255,255,0.1);border-radius:var(--r-xl);padding:var(--s9);color:var(--text-dim);font-family:var(--mono);font-size:12px;}

/* ── Service page ───────────────────────────────────────────── */
.service-page-hero{padding:130px 0 var(--s9);}
.service-price-badge{display:inline-flex;align-items:baseline;gap:var(--s2);font-family:var(--display);font-size:36px;font-weight:800;color:var(--accent);letter-spacing:-1.5px;margin-bottom:var(--s7);}
.service-price-badge .sp-mo{font-size:16px;font-weight:400;color:var(--text-muted);letter-spacing:0;}
.service-features-section{padding:var(--s9) 0;}
.service-features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);}
.sf-item{display:flex;align-items:flex-start;gap:var(--s4);background:var(--surface);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-md);padding:var(--s5);}
.sf-check{width:24px;height:24px;background:rgba(34,197,94,0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.sf-check svg{width:12px;height:12px;color:var(--success);}
.sf-text{font-size:14px;color:var(--text-muted);line-height:1.5;}
@media(max-width:640px){.service-features-grid{grid-template-columns:1fr;}}

/* ── City page ──────────────────────────────────────────────── */
.city-services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin:var(--s8) 0;}
.city-svc-card{background:var(--surface);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-lg);padding:var(--s6);transition:all var(--dur-std) var(--ease-out);}
.city-svc-card:hover{border-color:var(--accent-border);transform:translateY(-2px);}
.city-svc-card h3{font-family:var(--display);font-size:17px;font-weight:700;color:var(--text);margin-bottom:var(--s3);}
.city-svc-card p{font-size:13px;color:var(--text-muted);line-height:1.6;margin-bottom:var(--s5);}
@media(max-width:768px){.city-services-grid{grid-template-columns:1fr;}}

/* ── About ──────────────────────────────────────────────────── */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s9);padding:var(--s8) 0;align-items:center;}
.about-values{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin-top:var(--s8);}
.value-card{background:var(--surface);border:1px solid rgba(255,255,255,0.05);border-radius:var(--r-lg);padding:var(--s6);}
.value-card h3{font-family:var(--display);font-size:15px;font-weight:700;color:var(--text);margin-bottom:var(--s2);}
.value-card p{font-size:13px;color:var(--text-muted);line-height:1.65;}
@media(max-width:768px){.about-grid{grid-template-columns:1fr;}.about-values{grid-template-columns:1fr;}}

/* ── Logo integration ───────────────────────────────────────── */
/* gap 14px × 1.15 = 16px */
.nav-logo {
  display: flex;
  align-items: center;
  gap: 16px;
  text-decoration: none;
  flex-shrink: 0;
}
.nav-logo .nav-wordmark { margin-bottom: 0; }
.nav-mark { display: block; flex-shrink: 0; }

/* Hero decorative M mark */
.hero-mark-deco {
  position: absolute;
  right: -40px;
  top: 50%;
  transform: translateY(-52%);
  width: 500px;
  height: 500px;
  opacity: 0.055;
  pointer-events: none;
  z-index: 0;
}
.hero-mark-deco svg { width: 100%; height: 100%; }
@media (max-width:1200px) { .hero-mark-deco { opacity:0.035; width:380px; height:380px; } }
@media (max-width:900px)  { .hero-mark-deco { display:none; } }

/* Footer logo container */
.footer-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  margin-bottom: var(--s5);
}
.footer-logo .footer-wordmark { margin-bottom: 0; }

/* ── Precision spacing refinements ──────────────────────────── */

/* Bigger hero stat numbers */
.hero-stat-num { font-size: 22px; }

/* Big accent stat value */
.stat-block.full .stat-value {
  font-size: clamp(42px, 4.5vw, 58px);
  letter-spacing: -3px;
}

/* Slightly slower marquee = more premium */
.marquee-track { animation-duration: 42s; }

/* Section header eyebrow → headline rhythm */
.problem-header .section-headline,
.process-header .section-headline,
.serve-header .section-headline,
.plans-header .section-headline,
.proof-headline {
  margin-top: 0;
}

/* Plan card hover elevation */
.plan-card {
  transition: transform var(--dur-std) var(--ease-out),
              box-shadow var(--dur-std) var(--ease-out),
              border-color var(--dur-std);
}
.plan-card:not(.featured):hover {
  transform: translateY(-3px);
  border-color: rgba(255,255,255,0.1);
  box-shadow: 0 16px 48px rgba(0,0,0,0.3);
}
.plan-card.featured:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 0 1px var(--accent-border), 0 40px 100px rgba(99,91,255,0.2);
}

/* Featured plan — accent gradient top line */
.plan-card.featured::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%);
}

/* Serve card initial state for GSAP */
.serve-card { opacity: 0; transform: translateY(24px); }

/* Process step initial state for GSAP */
.process-step { opacity: 0; transform: translateY(20px); }

/* Proof stat block initial state */
.stat-block { opacity: 0; transform: translateY(16px); }

/* Plan card initial state */
.plan-card { opacity: 0; transform: translateY(24px); }

/* ── Precision micro-details ────────────────────────────────── */

/* Hero: tighter dot grid visible area  */
#hero::before { background-size: 44px 44px; }

/* Hero location dot pulse */
@keyframes pulse-dot {
  0%, 100% { box-shadow: 0 0 0 0 rgba(99,91,255,0.6); }
  50%       { box-shadow: 0 0 0 6px rgba(99,91,255,0); }
}
.hero-location .dot { animation: pulse-dot 2.4s ease-in-out infinite; }

/* Live dot pulse (local section) */
@keyframes pulse-live {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0.5); }
  50%       { box-shadow: 0 0 0 5px rgba(34,197,94,0); }
}
.local-badge .live { animation: pulse-live 2.4s ease-in-out infinite; }

/* Plan card: stagger-friendly initial state handled by GSAP */
/* Remove duplicate opacity:0 conflict from .reveal on plan cards */
.plan-card.reveal { opacity: 0; transform: translateY(24px); }

/* Section eyebrow — slight opacity on the line */
.eyebrow::before { opacity: 0.6; }

/* 8px × 1.2 = 10px | 18px × 1.2 = 22px | 13px × 1.2 = 16px */
.nav-cta { padding: 10px 22px; font-size: 16px; }

/* Proof section — left column text flow */
.proof-left .eyebrow-muted { margin-bottom: var(--s4); }

/* Quiz band — ensure CTA doesn't shrink on mobile */
.quiz-band-cta a { min-width: 160px; justify-content: center; }

/* Footer NAP links */
.footer-nap a:hover { color: var(--accent); }

/* Refined hero stat label */
.hero-stat-label { letter-spacing: 0.1px; }

/* Subtle section background alternation */
#serve { background: var(--deep); }
#local { background: var(--surface); border-top: 1px solid rgba(255,255,255,0.04); border-bottom: 1px solid rgba(255,255,255,0.04); }

/* Better link underline for inline body links */
.inline-link {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-color: rgba(99,91,255,0.3);
  text-underline-offset: 3px;
  transition: text-decoration-color var(--dur-fast);
}
.inline-link:hover { text-decoration-color: var(--accent); }

/* ── Business OS row ───────────────────────────────────────── */
.business-os-addon {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--s8);
  align-items: center;
  margin-bottom: var(--s4);
  padding: var(--s7);
  background: var(--deep);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--r-xl);
  position: relative;
  overflow: hidden;
}
.business-os-addon::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: linear-gradient(180deg, var(--cta), #FF9A6C);
  border-radius: var(--r-full) 0 0 var(--r-full);
}
.bos-badge {
  display: inline-flex;
  align-items: center;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--cta);
  background: var(--cta-dim);
  border: 1px solid rgba(255,107,53,0.25);
  border-radius: var(--r-full);
  padding: 3px 10px;
  margin-bottom: var(--s4);
}
.bos-headline {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.5px;
  margin-bottom: var(--s3);
}
.bos-body {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.7;
  max-width: 560px;
  margin-bottom: var(--s5);
}
.bos-features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s2) var(--s5);
  list-style: none;
  padding: 0;
  margin: 0;
}
.bos-features li {
  display: flex;
  align-items: center;
  gap: var(--s2);
  font-size: 13px;
  color: var(--text-muted);
}
.bos-right { flex-shrink: 0; }
.bos-price-block {
  background: var(--elevated);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--r-lg);
  padding: var(--s6);
  min-width: 200px;
  text-align: center;
}
@media (max-width: 900px) {
  .business-os-addon { grid-template-columns: 1fr; }
  .bos-price-block { min-width: 0; }
  .bos-features { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .bos-features { grid-template-columns: 1fr; }
}

/* ── Website Add-On row ─────────────────────────────────────── */
.website-addon {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--s8);
  align-items: center;
  margin-top: var(--s4);
  padding: var(--s7);
  background: var(--deep);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--r-xl);
  position: relative;
  overflow: hidden;
}
/* Subtle accent gradient on left edge */
.website-addon::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
  background: linear-gradient(180deg, var(--accent), var(--cta));
  border-radius: var(--r-full) 0 0 var(--r-full);
}

.wa-badge {
  display: inline-flex;
  align-items: center;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--cta);
  background: var(--cta-dim);
  border: 1px solid rgba(255,107,53,0.25);
  border-radius: var(--r-full);
  padding: 3px 10px;
  margin-bottom: var(--s4);
}
.wa-headline {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.5px;
  margin-bottom: var(--s3);
}
.wa-body {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.7;
  max-width: 560px;
  margin-bottom: var(--s5);
}
.wa-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2);
}
.wa-tags span {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text-dim);
  background: var(--elevated);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: var(--r-full);
  padding: 3px 10px;
}

.wa-right { flex-shrink: 0; }
.wa-price-block {
  background: var(--elevated);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--r-lg);
  padding: var(--s6);
  min-width: 260px;
  text-align: center;
}
.wa-price-group {
  margin-bottom: var(--s4);
  padding-bottom: var(--s4);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.wa-price {
  display: flex;
  align-items: baseline;
  gap: var(--s2);
  justify-content: center;
}
.wa-price-bundled { margin-bottom: var(--s2); }
.wa-price-standalone { opacity: 0.5; }
.wa-price-divider {
  font-size: 11px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: var(--s2) 0;
}
.wa-amount {
  font-family: var(--display);
  font-size: 36px;
  font-weight: 800;
  color: var(--text);
  letter-spacing: -2px;
  line-height: 1;
}
.wa-amount-dim {
  font-size: 28px;
  text-decoration: line-through;
  color: var(--text-dim);
}
.wa-period {
  font-size: 12px;
  color: var(--text-dim);
  max-width: 120px;
  line-height: 1.3;
  text-align: left;
}
.wa-hosting {
  display: flex;
  align-items: center;
  gap: var(--s2);
  justify-content: center;
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: var(--s5);
}
.wa-hosting svg {
  width: 14px; height: 14px;
  flex-shrink: 0;
  color: var(--success);
}
.wa-hosting strong { color: var(--success); }
.wa-note {
  font-size: 11px;
  color: var(--text-dim);
  margin-top: var(--s3);
  letter-spacing: 0.2px;
}

@media (max-width: 900px) {
  .website-addon { grid-template-columns: 1fr; }
  .wa-price-block { min-width: 0; }
}
