/*
 * landing.css — source-of-truth design system for Meridian
 *
 * Extracted from the index.html (the canonical design surface). Everything
 * here defines the shared look of the site outside of the page-chrome that
 * site-shell.css owns: tokens, the index hero/marquee/services/pricing/
 * articles/founder/faq/cta visual language, and the landing-style mobile
 * breakpoint.
 *
 * Pair with site-shell.css. Pages that are not the case-study set should
 * link both. Avoid adding page-specific rules here — promote shared
 * patterns; leave one-off layout inline on the page that owns it.
 */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#F7F7F7;--bg-card:#FFFFFF;--bg-dark:#1C1C1C;
  --border:#E0E0E0;--border-light:#EBEBEB;--border-strong:#C7C7C7;
  --text:#1C1C1C;--text-secondary:#3D3D3D;--text-muted:#6B6B6B;--text-faint:#B8B8B8;
  /* Backwards-compat aliases for legacy --text-primary / --text-tertiary references */
  --text-primary:#1C1C1C;--text-tertiary:#6B6B6B;
  /* --accent-dark darkened from #6B59E8 to pass WCAG AA 4.5 against both #FFF and --accent-soft (#F0EDFF). */
  --accent:#7D6BF9;--accent-dark:#5F4FDE;--accent-soft:#F0EDFF;
  --accent2:#449AFA;--accent3:#CC6BF9;
  --radius:20px;--radius-sm:12px;--radius-lg:20px;--radius-pill:999px;
  --heading:'Inter',sans-serif;--body:'Inter',sans-serif;
  /* Legacy aliases — all resolve to Inter. Retained so existing var(--accent-serif)/var(--display)/var(--serif) references work. */
  --accent-serif:'Inter',sans-serif;
  --display:'Inter',sans-serif;
  --serif:'Inter',sans-serif;
  --sans:'Inter',sans-serif;
  --accent-strong:#5F4FDE;
  --bg-warm:#FAFAFA;
  --bg-panel:#1C1C1C;
  --shadow-lg:0 24px 60px rgba(28,28,28,0.12);
  --shadow-md:0 12px 32px rgba(28,28,28,0.08);
  --shadow-sm:0 4px 12px rgba(28,28,28,0.06);
  --section-pad:5rem;
  --hero-pad-top:8.5rem;
  --fs-title-1:clamp(1.8rem,3.5vw,2.6rem);
  --dark-grad:linear-gradient(180deg,#1C1C1C,#0C0C0C);
  --dark-hairline:rgba(255,255,255,0.06);
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--body);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.bold-em{font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent-dark));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--accent)}

/* NAV */
.nav{position:fixed;top:1rem;left:50%;transform:translateX(-50%);z-index:100;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:0.65rem 0.65rem 0.65rem 1.5rem;background:rgba(255,255,255,0.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-light);border-radius:999px;box-shadow:0 2px 20px rgba(0,0,0,0.04);max-width:680px;width:calc(100% - 2rem)}
.nav-logo{font-family:var(--heading);font-size:0.85rem;font-weight:700;letter-spacing:0.04em;color:var(--text);text-decoration:none;white-space:nowrap}
.nav-links{display:flex;gap:1.25rem;list-style:none}
.nav-links a{font-size:0.72rem;font-weight:500;color:var(--text-muted);text-decoration:none;transition:color 0.2s;white-space:nowrap}
.nav-links a:hover{color:var(--text)}
.nav-cta{display:inline-flex;align-items:center;padding:0.5rem 1.1rem;border-radius:999px;background:var(--text);color:#fff!important;font-size:0.7rem;font-weight:600;text-decoration:none;transition:background 0.2s;white-space:nowrap}
.nav-cta:hover{background:var(--accent)}

/* HERO */
.hero{padding:9rem 2rem 4rem;text-align:center;position:relative;overflow:hidden}
.hero-inner{max-width:1100px;margin:0 auto;position:relative;z-index:1}
.dot-grid{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(to right, rgba(20,20,20,0.055) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(20,20,20,0.055) 1px, transparent 1px);
  background-size:56px 56px}
.dot-grid::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center, transparent 30%, var(--bg) 95%);pointer-events:none}
.dot-grid-inner{position:absolute;inset:0;display:grid;gap:0;z-index:1}
.dot{width:100%;height:100%;background:transparent}
.hero-eyebrow{display:inline-flex;align-items:center;gap:0.5rem;padding:0.35rem 0.85rem;border-radius:999px;background:var(--bg-card);border:1px solid var(--border-light);font-size:0.7rem;font-weight:700;color:var(--text-secondary);margin-bottom:2rem}
.hero-eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);animation:status-pulse 2.4s ease-in-out infinite;box-shadow:0 0 0 0 rgba(125,107,249,0.32)}
@keyframes status-pulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(125,107,249,0.24)}50%{transform:scale(1.35);box-shadow:0 0 0 5px rgba(125,107,249,0)}}
.hero h1{font-family:var(--heading);font-size:clamp(2.25rem,5.5vw,4.5rem);font-weight:700;line-height:1.04;letter-spacing:-0.035em;color:var(--text);margin-bottom:1.5rem;max-width:900px;margin-left:auto;margin-right:auto}
.hero-dek{font-family:var(--body);font-size:1.2rem;font-weight:500;color:var(--text-secondary);line-height:1.55;max-width:580px;margin:0 auto 2.5rem}
.hero-cta-row{display:flex;gap:0.75rem;justify-content:center;margin-bottom:3.5rem;flex-wrap:wrap}
.btn-primary{display:inline-flex;align-items:center;gap:0.5rem;padding:0.95rem 1.85rem;border-radius:999px;background:var(--text);color:#fff;font-size:0.82rem;font-weight:700;text-decoration:none;transition:transform 0.2s,background 0.2s}
.btn-primary:hover{transform:translateY(-2px);background:var(--accent)}
.btn-secondary{display:inline-flex;align-items:center;padding:0.95rem 1.85rem;border-radius:999px;background:transparent;color:var(--text);border:1px solid var(--border-strong);font-size:0.82rem;font-weight:700;text-decoration:none;transition:background 0.2s}
.btn-secondary:hover{background:var(--bg-card)}

/* HERO STATS — pill cards */
.hero-stats{display:flex;justify-content:center;gap:0.75rem;flex-wrap:wrap}
.stat-pill{display:flex;align-items:center;gap:0.75rem;background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius);padding:1rem 1.25rem;transition:transform 0.2s,box-shadow 0.2s}
.stat-pill:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.06)}
.stat-pill-logo{display:flex;align-items:center;flex-shrink:0}
.stat-pill-logo img{height:16px;width:auto;opacity:0.45}
.stat-pill-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);opacity:0.5;flex-shrink:0}
.stat-pill-value{font-family:var(--heading);font-size:1.15rem;font-weight:700;color:var(--text);letter-spacing:-0.02em;line-height:1}
.stat-pill-label{font-size:0.58rem;color:var(--text-muted);margin-top:0.15rem;line-height:1.3}

/* AI CITED — scrolling marquee */
.ai-strip{padding:2.5rem 0 2rem;border-top:1px solid var(--border);border-bottom:1px solid var(--border);overflow:hidden}
.ai-marquee{display:flex;width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
.ai-track{display:flex;flex-shrink:0;gap:2.85rem;padding-right:2.85rem;animation:ai-scroll 55s linear infinite;will-change:transform}
.ai-track span{--ai-logo:url("brand-assets/ai-logos/google.svg");--ai-logo-w:5.35rem;--ai-logo-h:1.65rem;position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--ai-logo-w);height:var(--ai-logo-h);min-height:var(--ai-logo-h);flex:0 0 auto;overflow:hidden;color:transparent;font-size:0;line-height:1;white-space:nowrap;opacity:0.82}
.ai-track span::before{content:"";display:block;width:100%;height:100%;background-image:var(--ai-logo);background-repeat:no-repeat;background-position:center;background-size:contain}
.ai-track span:nth-child(14n+1){--ai-logo:url("brand-assets/ai-logos/google.svg");--ai-logo-w:5.35rem}
.ai-track span:nth-child(14n+2){--ai-logo:url("brand-assets/ai-logos/chatgpt.svg");--ai-logo-w:1.75rem}
.ai-track span:nth-child(14n+3){--ai-logo:url("brand-assets/ai-logos/claude.svg");--ai-logo-w:6.55rem}
.ai-track span:nth-child(14n+4){--ai-logo:url("brand-assets/ai-logos/perplexity.svg");--ai-logo-w:6.3rem}
.ai-track span:nth-child(14n+5){--ai-logo:url("brand-assets/ai-logos/bing.svg");--ai-logo-w:1.25rem}
.ai-track span:nth-child(14n+6){--ai-logo:url("brand-assets/ai-logos/gemini.svg");--ai-logo-w:4.95rem}
.ai-track span:nth-child(14n+7){--ai-logo:url("brand-assets/ai-logos/reddit.svg");--ai-logo-w:4.8rem}
.ai-track span:nth-child(14n+8){--ai-logo:url("brand-assets/ai-logos/microsoft-copilot.svg");--ai-logo-w:1.9rem}
.ai-track span:nth-child(14n+9){--ai-logo:url("brand-assets/ai-logos/meta.svg");--ai-logo-w:5.95rem}
.ai-track span:nth-child(14n+10){--ai-logo:url("brand-assets/ai-logos/linkedin.svg");--ai-logo-w:5.5rem}
.ai-track span:nth-child(14n+11){--ai-logo:url("brand-assets/ai-logos/yahoo.svg");--ai-logo-w:5.05rem}
.ai-track span:nth-child(14n+12){--ai-logo:url("brand-assets/ai-logos/brave.svg");--ai-logo-w:1.42rem}
.ai-track span:nth-child(14n+13){--ai-logo:url("brand-assets/ai-logos/duckduckgo.svg");--ai-logo-w:1.65rem}
.ai-track span:nth-child(14n+14){--ai-logo:url("brand-assets/ai-logos/deepseek.svg");--ai-logo-w:6.55rem}
.ai-caption{text-align:center;font-size:0.6rem;font-weight:600;text-transform:uppercase;letter-spacing:0.18em;color:var(--text-muted);margin-top:1.5rem}
@keyframes ai-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ai-track{animation:none}}

/* RESULTS — bento with ABV hero */
.results{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.results-head{text-align:center;margin-bottom:3rem}
.results-head h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text)}
.results-head p{font-size:1.05rem;font-weight:500;color:var(--text-secondary);margin-top:0.75rem;max-width:520px;margin-left:auto;margin-right:auto;line-height:1.55}
.results-bento{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;grid-auto-rows:minmax(100px,auto)}
.results-card{border-radius:var(--radius);padding:1.75rem;display:flex;flex-direction:column;gap:0.75rem;transition:transform 0.25s,box-shadow 0.25s}
.results-card:hover{transform:translateY(-3px)}
.results-white{background:var(--bg-card);border:1px solid var(--border);border-top:2px solid rgba(125,107,249,0.35);box-shadow:0 1px 3px rgba(28,28,28,0.04),0 6px 18px rgba(28,28,28,0.04)}
.results-white:hover{box-shadow:0 1px 3px rgba(28,28,28,0.04),0 12px 32px rgba(28,28,28,0.08)}
.results-dark{grid-column:span 3;grid-row:span 2;padding:2rem;background:#262626;border:1px solid #333;box-shadow:0 4px 20px rgba(28,28,28,0.08)}
.results-dark:hover{box-shadow:0 12px 40px rgba(28,28,28,0.16)}
.results-tag{font-family:var(--heading);font-size:0.62rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em}
.results-white .results-tag{color:var(--text-secondary)}
.results-dark .results-tag{color:rgba(255,255,255,0.7)}
.results-stat{font-family:var(--heading);font-weight:700;letter-spacing:-0.03em;line-height:1;color:var(--text)}
.results-dark .results-stat{color:#fff;font-size:2.5rem}
.results-white .results-stat{font-size:1.75rem}
.results-stat-label{font-size:0.72rem;margin-top:0.25rem;font-weight:500}
.results-white .results-stat-label{color:var(--text-muted)}
.results-dark .results-stat-label{color:rgba(255,255,255,0.7)}
.results-title{font-family:var(--heading);font-size:1rem;font-weight:600;color:var(--text);line-height:1.35}
.results-dark .results-title{color:#fff;font-size:1.05rem}
.results-desc{font-size:0.85rem;line-height:1.55;color:var(--text-secondary);font-weight:500;margin-top:auto}
.results-sub-row{display:flex;gap:1.5rem;padding-top:1rem;border-top:1px solid var(--border-light)}
.results-dark .results-sub-row{border-top-color:rgba(255,255,255,0.08)}
.results-sub-val{font-family:var(--heading);font-size:1.1rem;font-weight:700;color:var(--text)}
.results-dark .results-sub-val{color:#fff}
.results-sub-lbl{font-size:0.62rem;color:var(--text-muted);margin-top:0.15rem;font-weight:500}
.results-dark .results-sub-lbl{color:rgba(255,255,255,0.65)}
.results-abv-logo{display:flex;align-items:center;gap:0.65rem;margin-bottom:0.25rem}
.results-abv-logo img{height:24px;width:auto;opacity:0.85}
.results-dark .results-abv-logo img{opacity:0.75;filter:invert(1)}
.results-quote{font-size:0.88rem;font-weight:400;font-style:italic;line-height:1.55;color:rgba(255,255,255,0.68);letter-spacing:0;padding-top:1rem;margin-top:0.5rem;border-top:1px solid rgba(255,255,255,0.06)}
.results-quote-attr{font-size:0.62rem;font-weight:600;color:rgba(255,255,255,0.45);text-transform:uppercase;letter-spacing:0.08em;margin-top:0.5rem;font-style:normal}

/* POSITIONING — venn bento */
.positioning{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.positioning-head{text-align:center;margin-bottom:2.5rem}
.positioning-head h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text)}
.pos-venn{display:grid;grid-template-columns:repeat(3,1fr);max-width:840px;margin:0 auto;gap:0.75rem}
.pos-venn-card{border-radius:var(--radius);padding:1.5rem;display:flex;flex-direction:column;gap:0.6rem}
.pos-venn-white{background:var(--bg-card);border:1px solid var(--border-light);grid-row:span 2}
.pos-venn-meridian{background:var(--accent-soft);border:1px solid rgba(125,107,249,0.18);grid-row:span 2;box-shadow:0 10px 36px rgba(125,107,249,0.18),0 0 0 1px rgba(125,107,249,0.08)}
.pos-venn-tag{font-family:var(--heading);font-size:0.55rem;font-weight:700;text-transform:uppercase;letter-spacing:0.12em}
.pos-venn-white .pos-venn-tag{color:var(--text-muted)}
.pos-venn-meridian .pos-venn-tag{color:var(--accent-dark)}
.pos-venn-title{font-family:var(--heading);font-size:1rem;font-weight:600;color:var(--text);line-height:1.3}
.pos-venn-meridian .pos-venn-title{color:var(--accent-dark);font-size:1.15rem}
.pos-venn-desc{font-size:0.78rem;line-height:1.55;color:var(--text-secondary)}
.pos-venn-meridian .pos-venn-desc{color:var(--text)}
.pos-venn-stat{font-family:var(--heading);font-size:1.2rem;font-weight:700;letter-spacing:-0.02em;line-height:1;color:var(--text)}
.pos-venn-meridian .pos-venn-stat{color:var(--accent-dark)}
.pos-venn-stat-label{font-size:0.62rem;color:var(--text-muted);margin-top:0.2rem}
/* Dropped opacity:0.7 — it was blending --accent-dark into --accent-soft below WCAG AA. */
.pos-venn-meridian .pos-venn-stat-label{color:var(--accent-dark)}
.pos-venn-benefit{font-size:0.65rem;font-weight:600;padding-top:0.6rem;border-top:1px solid var(--border-light);margin-top:auto;color:var(--text-muted)}
.pos-venn-stats{display:flex;flex-direction:column;gap:0.6rem;margin-top:auto}

/* SERVICES — bento grid with ambient dot grid on flagship */
.services{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.services-head{text-align:center;margin-bottom:2.5rem}
.services-head h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text)}
.services-bento{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(110px,auto);gap:0.75rem}
.svc-b{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius);padding:1.5rem;text-decoration:none;color:inherit;display:flex;flex-direction:column;justify-content:space-between;gap:0.75rem;transition:transform 0.25s,box-shadow 0.25s;position:relative;overflow:hidden}
.svc-b:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(0,0,0,0.05)}
.svc-b h3{font-family:var(--heading);font-size:1rem;font-weight:600;color:var(--text);line-height:1.3}
.svc-b p{font-size:0.8rem;color:var(--text-secondary);line-height:1.55}
/* var(--accent) (#7D6BF9) fails WCAG AA 4.5 on white at this size. Switched to --accent-dark. */
.svc-b-link{font-size:0.62rem;font-weight:600;color:var(--accent-dark);text-transform:uppercase;letter-spacing:0.12em}
.svc-b-flagship{grid-column:span 3;grid-row:span 2}
.svc-b-flagship h3{font-size:1.25rem}
.svc-b-flagship p{font-size:0.85rem}
.svc-dotgrid{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden;
  background-image:
    linear-gradient(to right, rgba(20,20,20,0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(20,20,20,0.04) 1px, transparent 1px);
  background-size:28px 28px}
.svc-dotgrid::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 70% 30%, transparent 20%, var(--bg-card) 85%);pointer-events:none}
.svc-dotgrid-inner{position:absolute;inset:0;display:grid;gap:0;z-index:1}
.svc-b-flagship .svc-b-content{position:relative;z-index:2}
.svc-dot{width:100%;height:100%;background:transparent}

/* PROCESS - left rail timeline */
.process{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.process-head{text-align:center;margin-bottom:2.5rem}
.process-head h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text)}
.process-rail{max-width:660px;margin:0 auto;display:flex;flex-direction:column;gap:0.75rem}
.process-rail-item{display:grid;grid-template-columns:90px 1fr;gap:1.5rem;align-items:stretch}
.process-rail-phase{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;padding-right:1.25rem;border-right:2px solid var(--border-light);position:relative}
.process-rail-phase-name{font-family:var(--heading);font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-muted);text-align:right}
.process-rail-dot{position:absolute;right:-7px;top:50%;transform:translateY(-50%);width:12px;height:12px;border-radius:50%;background:var(--bg);border:2px solid var(--border-strong)}
.process-rail-item.last .process-rail-dot{border-color:var(--accent);background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.process-rail-item.last .process-rail-phase-name{color:var(--accent-dark)}
.process-rail-item.last .process-rail-phase{border-right-color:var(--accent)}
.process-rail-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius);padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:0.4rem;transition:transform 0.25s,box-shadow 0.25s}
.process-rail-card:hover{transform:translateX(3px);box-shadow:0 8px 24px rgba(0,0,0,0.04)}
.process-rail-card h3{font-family:var(--heading);font-size:1.05rem;font-weight:600;color:var(--text);line-height:1.3}
.process-rail-card p{font-size:0.8rem;color:var(--text-secondary);line-height:1.55}
/* Switched to --accent-dark so the uppercase outcome label passes AA on white. */
.process-rail-outcome{font-size:0.6rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:var(--accent-dark);padding-top:0.6rem;border-top:1px solid var(--border-light);margin-top:0.25rem}
.process-rail-item.last .process-rail-card{background:var(--accent-soft);border-color:transparent}
.process-rail-item.last .process-rail-card h3{color:var(--accent-dark)}
.process-rail-item.last .process-rail-card p{color:var(--text)}
.process-rail-item.last .process-rail-outcome{color:var(--accent-dark);border-top-color:rgba(125,107,249,0.15)}

/* PRICING */
.pricing{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.pricing-head{text-align:center;margin-bottom:2.5rem}
.pricing-head h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text)}
.pricing-head p{font-size:1.05rem;font-weight:500;color:var(--text-secondary);margin-top:0.75rem}
.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0.75rem}
.tier{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius);padding:2rem 1.5rem;display:flex;flex-direction:column;position:relative;transition:transform 0.25s,box-shadow 0.25s}
.tier:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.06)}
.tier-featured{background:var(--accent-soft);border-color:transparent}
/* Background switched to --accent-dark so "Most Popular" white text passes AA. */
.tier-badge{position:absolute;top:-0.65rem;left:50%;transform:translateX(-50%);background:var(--accent-dark);color:#fff;font-size:0.5rem;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;padding:0.3rem 0.8rem;border-radius:999px;white-space:nowrap}
.tier-name{font-family:var(--heading);font-size:0.65rem;font-weight:600;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-muted);margin-bottom:0.5rem}
.tier-price{font-family:var(--heading);font-size:1.8rem;font-weight:700;color:var(--text);letter-spacing:-0.03em;line-height:1;margin-bottom:0.2rem}
.tier-price-sub{font-size:0.65rem;color:var(--text-muted);margin-bottom:1rem}
.tier-desc{font-size:0.75rem;color:var(--text-secondary);line-height:1.5;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border-light)}
.tier-features{list-style:none;flex:1;margin-bottom:1.25rem}
.tier-features li{font-size:0.72rem;color:var(--text-secondary);padding:0.3rem 0 0.3rem 1.1rem;position:relative;line-height:1.45}
.tier-features li::before{content:'';position:absolute;left:0;top:0.5em;width:0.4rem;height:0.4rem;border-radius:50%;background:var(--accent)}
.tier-cta{display:block;text-align:center;padding:0.65rem;border-radius:var(--radius-sm);font-size:0.65rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;text-decoration:none;transition:background 0.2s,color 0.2s}
.tier-cta-default{background:var(--bg);border:1px solid var(--border);color:var(--text)}
.tier-cta-default:hover{background:var(--text);color:#fff}
/* Featured CTA uses --accent-dark by default so white text passes AA on idle. */
.tier-cta-featured{background:var(--accent-dark);color:#fff}
.tier-cta-featured:hover{background:#4A3CC9}

/* ARTICLES */
.articles{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.articles-head{text-align:center;margin-bottom:2.5rem}
.articles-head h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text)}
/* "View all articles →" link bumped to --accent-dark for AA on light gray bg. */
.articles-head a{display:inline-block;margin-top:1rem;font-size:0.8rem;font-weight:700;color:var(--accent-dark);text-decoration:none}
.articles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0.75rem}
.article-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius);padding:1.75rem;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform 0.25s,box-shadow 0.25s}
.article-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.06)}
.article-topline{font-size:0.56rem;font-weight:600;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-muted);margin-bottom:1rem;display:flex;gap:0.65rem}
.article-card h3{font-family:var(--heading);font-size:0.98rem;font-weight:600;color:var(--text);line-height:1.3;margin-bottom:0.5rem}
.article-card p{font-size:0.8rem;color:var(--text-secondary);line-height:1.55;flex:1}
/* "Read →" uppercase mini-link bumped to --accent-dark for AA on white card. */
.article-read{margin-top:1.25rem;font-size:0.62rem;font-weight:600;color:var(--accent-dark);text-transform:uppercase;letter-spacing:0.12em}

/* FOUNDER */
.founder{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.founder-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius);padding:2.5rem;display:grid;grid-template-columns:auto 1fr auto;gap:2rem;align-items:center}
.founder-content h3{font-family:var(--heading);font-size:1rem;font-weight:600;color:var(--text);margin-bottom:0.5rem}
.founder-content p{font-size:0.88rem;color:var(--text-secondary);line-height:1.6;max-width:680px}
.founder-content strong{color:var(--text);font-weight:600}
.founder-cta{display:inline-flex;align-items:center;gap:0.4rem;padding:0.85rem 1.5rem;border-radius:999px;background:var(--text);color:#fff;font-size:0.78rem;font-weight:700;text-decoration:none;white-space:nowrap;transition:background 0.2s,transform 0.2s,box-shadow 0.2s}
.founder-cta:hover{background:var(--accent);transform:translateY(-2px);box-shadow:0 8px 24px rgba(125,107,249,0.25)}

/* FAQ */
.faq{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.faq-head{text-align:center;margin-bottom:2.5rem}
.faq-head h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text)}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem}
.faq-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius);padding:1.75rem}
.faq-card h3{font-family:var(--heading);font-size:0.92rem;font-weight:600;color:var(--text);margin-bottom:0.6rem;line-height:1.3}
.faq-card p{font-size:0.8rem;color:var(--text-secondary);line-height:1.6}

/* CTA */
.cta{padding:5rem 2rem;max-width:1100px;margin:0 auto}
.cta-card{background:var(--bg-dark);border-radius:var(--radius);padding:4rem 2rem;text-align:center;position:relative;overflow:hidden}
.cta h2{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;color:#fff;margin-bottom:1rem;letter-spacing:-0.03em;line-height:1.1}
.cta p{font-size:1.05rem;font-weight:500;color:rgba(255,255,255,0.6);margin-bottom:2.5rem;max-width:520px;margin-left:auto;margin-right:auto;line-height:1.55}
/* CTA pill bg switched to --accent-dark so "Get Free Audit →" white text passes AA. */
.cta .btn-primary{background:var(--accent-dark)}
.cta .btn-primary:hover{background:#4A3CC9}

.footer{padding:2.5rem 2rem;text-align:center;font-size:0.7rem;color:var(--text-muted)}

@media(max-width:900px){
  .nav{max-width:calc(100% - 1rem);gap:1rem}
  .nav-links{display:none}
  .results-bento,.services-bento,.articles-grid,.process-rail-item{grid-template-columns:1fr;gap:0.5rem}
  .process-rail-phase{flex-direction:row;border-right:none;border-bottom:2px solid var(--border-light);padding-right:0;padding-bottom:0.5rem;justify-content:flex-start}
  .process-rail-dot{position:relative;right:auto;top:auto;transform:none;display:inline-block;margin-left:0.5rem}
  .results-bento>*,.svc-b-flagship{grid-column:span 1!important;grid-row:span 1!important}
  .results-dark .results-stat{font-size:2rem}
  .results-sub-row{flex-wrap:wrap;gap:1rem}
  .pricing-grid{grid-template-columns:1fr}
  .faq-grid{grid-template-columns:1fr}
  .founder-card{grid-template-columns:1fr;gap:1.5rem}
  .pos-venn{grid-template-columns:1fr}
}

/* =====================================================================
   SECONDARY PAGE PATTERNS
   Long-form content surface (legal pages) + centered single-action page
   surface (404, thank-you). Lifted from per-page inline blocks so every
   page can rely on the same fonts, color tokens, and rhythm.
   ===================================================================== */

/* Long-form content surface — privacy, terms */
.content{max-width:750px;margin:0 auto;padding:5rem 4rem 8rem}
.content h1{font-family:var(--heading);font-size:2rem;font-weight:700;color:var(--text);margin-bottom:0.5rem;letter-spacing:-0.02em}
.content .updated{font-size:0.7rem;font-weight:400;color:var(--text-muted);margin-bottom:3rem}
.content h2{font-family:var(--heading);font-size:1.2rem;font-weight:600;color:var(--text);margin-top:2.5rem;margin-bottom:0.75rem;letter-spacing:-0.01em}
.content p,.content ul li{font-size:0.85rem;font-weight:400;color:var(--text-secondary);line-height:1.8}
.content p{margin-bottom:1rem}
.content ul{list-style:none;margin-bottom:1rem;padding-left:1rem}
.content ul li{position:relative;padding-left:1rem}
.content ul li::before{content:'\2014';position:absolute;left:0;color:var(--accent)}
/* Article links use --accent-dark by default so inline links pass AA in body copy. */
.content a{color:var(--accent-dark);text-decoration:none;border-bottom:1px solid var(--accent-dark)}
.content a:hover{color:#4A3CC9;border-color:#4A3CC9}

/* Centered single-action page — 404, thank-you */
.error-page,.thankyou-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8rem 4rem 4rem;text-align:center}
.error-page h1,.thankyou-page h1{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:700;color:var(--text);margin-bottom:1rem;line-height:1.25;letter-spacing:-0.02em}
.error-page p,.thankyou-page p{font-family:var(--body);font-size:0.9rem;font-weight:400;color:var(--text-muted);max-width:420px;margin-bottom:2.5rem}
/* Mirrors `.btn-primary` typography so 404 and thank-you CTAs match the canonical landing-page pill. */
.error-cta,.thankyou-cta{display:inline-flex;align-items:center;justify-content:center;min-height:52px;font-family:var(--sans);font-size:0.82rem;font-weight:700;letter-spacing:normal;text-transform:none;color:#FFFFFF;background:var(--bg-dark);border:1px solid var(--bg-dark);border-radius:999px;padding:0 1.85rem;text-decoration:none;transition:background 0.3s ease,border-color 0.3s ease,color 0.3s ease}
.error-cta:hover,.thankyou-cta:hover{background:var(--accent);border-color:var(--accent);color:#FFFFFF}
.error-cta:active,.thankyou-cta:active{background:var(--accent-dark);border-color:var(--accent-dark);color:#FFFFFF}

@media (max-width:900px){
  .error-page,.thankyou-page{padding:7rem 2rem 3rem}
}
@media (max-width:480px){
  .content{padding:3rem 1.5rem 5rem}
  .content h1{font-size:1.8rem}
  .error-page,.thankyou-page{padding:6rem 1.5rem 2.5rem}
}

/* =====================================================================
   HUB PAGE SHARED PATTERNS
   Lifted from services/process/about/contact/free-audit inline blocks
   so every hub page renders the same hero shell, eyebrow/section header,
   topo SVG animation, form card, italic-serif accent, scroll reveal,
   and screen-reader utility off a single source of truth.
   ===================================================================== */

/* Topo SVG animation (services, process, about hero backgrounds) */
.topo-line{stroke-dasharray:var(--dash);stroke-dashoffset:var(--dash);animation:topo-draw var(--dur) var(--del) cubic-bezier(0.4,0,0.2,1) forwards}
@keyframes topo-draw{to{stroke-dashoffset:0}}

/* Hero wrapper (relative container that holds .hero-bg-svg + .page-hero) */
.hero-wrapper{position:relative;overflow:hidden}
.hero-bg-svg{position:absolute;top:-10%;left:-5%;width:110%;height:120%;pointer-events:none;opacity:0.32;mask-image:linear-gradient(to right,rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.3) 15%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.6) 65%,rgba(0,0,0,1) 80%);-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.3) 15%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.6) 65%,rgba(0,0,0,1) 80%)}
.hero-bg-svg path{fill:none;stroke-linecap:round;stroke-linejoin:round}

/* Page hero (shared by services/process/about/contact/free-audit/blog) */
.page-hero{position:relative;padding:var(--hero-pad-top,8.5rem) 4rem 2.5rem;max-width:1100px;margin:0 auto;text-align:center}
.hero-subtitle{font-family:var(--body);font-size:1.05rem;font-weight:500;color:var(--text-secondary);margin-top:1.5rem;max-width:580px;margin-left:auto;margin-right:auto;line-height:1.55}

/* Bold emphasis (h1 em on hub pages — weight contrast, no serif italic) */
.page-hero h1 em,.section-header em,.cta h2 em{font-family:inherit;font-style:normal;font-weight:800;color:var(--text);letter-spacing:-0.035em}

/* Section header (centered h2 with bold-em) */
.section-header{display:flex;align-items:center;justify-content:center;gap:0.75rem;margin-bottom:2.5rem;text-align:center}
.section-title{font-family:var(--heading);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.1;letter-spacing:-0.03em;color:var(--text);text-transform:none}

/* Form card (contact + free-audit dark intake card with purple gradient border) */
.form-wrapper{position:relative;min-width:0;max-width:100%}
.form-wrapper::before{content:'';position:absolute;inset:-40px;background:radial-gradient(ellipse at center,rgba(125,107,249,0.08) 0%,transparent 70%);pointer-events:none;z-index:0}
.form-card{background:var(--bg-dark);border-radius:var(--radius);box-shadow:0 1px 2px rgba(28,28,28,0.08),0 8px 24px rgba(28,28,28,0.12),0 24px 60px rgba(28,28,28,0.16);padding:1.5rem;position:relative;z-index:1}
.form-card::before{content:'';position:absolute;inset:-1px;border-radius:var(--radius);padding:1px;background:linear-gradient(180deg,rgba(125,107,249,0.3) 0%,rgba(125,107,249,0) 50%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.form-header{text-align:center;padding-bottom:1rem;margin-bottom:0.25rem;border-bottom:1px solid rgba(255,255,255,0.06)}
.form-header h3{font-family:var(--heading);font-size:1rem;font-weight:600;color:rgba(255,255,255,0.88);letter-spacing:-0.01em}
.form-header p{font-size:0.72rem;color:rgba(255,255,255,0.72);margin-top:0.25rem}
.form-card iframe{display:block;min-height:520px;border:0;width:100%}
.response-time{display:block;margin-top:1rem;padding-top:0.9rem;border-top:1px solid rgba(255,255,255,0.12);font-size:0.72rem;color:rgba(255,255,255,0.72);text-align:center;letter-spacing:0.02em}

/* Screen-reader-only utility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* Scroll reveal — opacity/translate driven by IntersectionObserver in site-shell.js */
.reveal{opacity:0;transform:translateY(18px);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.stagger-parent.visible .stagger-child{opacity:1;transform:translateY(0)}

@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero-eyebrow::before{animation:none;box-shadow:none}
  .topo-line{animation:none;stroke-dashoffset:0}
  html{scroll-behavior:auto}
}

@media (max-width:900px){
  .page-hero{padding-left:2rem;padding-right:2rem;padding-top:8rem;padding-bottom:3rem}
}
@media (max-width:480px){
  .page-hero{padding:6.5rem 1.5rem 2.5rem}
}