/* Landing presentation layer on top of the preserved legacy document.
   Loaded after the legacy <style>, so it aligns the page with the brand
   system (/assets/fp/brand.css) without touching the editorial markup. */
:root{--bg:var(--fp-bg);--ink:var(--fp-ink);--muted:var(--fp-muted);--faint:var(--fp-faint);--line:var(--fp-line);--hot:var(--fp-accent-fill);--card:rgba(245,242,235,.035)}
body[data-fp-surface="landing"]{background:var(--fp-bg);font-family:var(--fp-sans);text-rendering:optimizeLegibility}
body[data-fp-surface="landing"] .wrap{max-width:var(--fp-wrap);padding-inline:var(--fp-gutter)}
html{scroll-padding-top:calc(var(--fp-header-h) + 16px)}
h1,h2{letter-spacing:-.045em}
section.blk h2{font-size:clamp(2.1rem,5vw,4rem);line-height:.95;font-weight:780;max-width:16ch;text-wrap:balance}
.eyebrow{font-family:var(--fp-mono);color:var(--fp-faint)}
.eyebrow::before{content:"";display:inline-block;width:18px;height:1px;margin:0 10px 3px 0;vertical-align:middle;background:var(--fp-accent)}
.lead{color:var(--fp-muted)}

/* Legacy buttons speak the brand button language. */
.btn{min-height:46px;padding:0 22px;font:650 15px/1 var(--fp-sans);letter-spacing:-.005em;gap:9px}
.btn-hot{background:var(--fp-accent-fill);box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 10px 30px -12px rgba(220,68,5,.65)}
.btn-hot:hover{background:var(--fp-accent-hover);filter:none}
.btn-primary{background:var(--fp-ink);color:#0c0b09}
.btn-ghost{border-color:var(--fp-line-strong);background:rgba(245,242,235,.02)}

/* Hero: copy on the left, the product film on the right. */
.hero[data-variant="film"]{padding-block:clamp(40px,6vw,84px) clamp(36px,5vw,64px);border-bottom:1px solid var(--fp-line)}
.hero[data-variant="film"] .hero-strip{opacity:.42;filter:saturate(.9)}
.hero[data-variant="film"] .hero-fade{background:radial-gradient(120% 90% at 70% 20%,rgba(12,11,9,.35),rgba(12,11,9,.86) 55%,var(--fp-bg) 100%),linear-gradient(90deg,var(--fp-bg) 0%,rgba(12,11,9,.82) 42%,rgba(12,11,9,.5) 100%)}
.fpx-hero-grid{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(28px,4vw,64px);align-items:center}
.fpx-hero-copy{display:flex;flex-direction:column;align-items:flex-start;text-align:left}
.hero[data-variant="film"] h1{margin:22px 0 0;font-size:clamp(2.7rem,5.6vw,5.4rem);line-height:.92;letter-spacing:-.05em;font-weight:800;max-width:11ch}
.hero[data-variant="film"] .sub{margin-top:20px;max-width:40ch;color:var(--fp-muted);font-size:clamp(16px,1.5vw,19px);font-weight:450}
.hero[data-variant="film"] .cta-row{justify-content:flex-start;margin-top:28px}
.hero[data-variant="film"] .cta-row .fp-btn svg{width:16px;height:16px}
.hero[data-variant="film"] .cta-note{color:var(--fp-faint)}
.hero[data-variant="film"] .stats{justify-content:flex-start;max-width:none;margin-top:26px;padding-top:22px;border-top:1px solid var(--fp-line)}
.hero[data-variant="film"] .stat{padding:0 26px 0 0;text-align:left}
.hero[data-variant="film"] .stat+.stat{border-left:0;padding-left:26px;box-shadow:inset 1px 0 0 var(--fp-line)}
.hero[data-variant="film"] .stat .v{font-size:24px;letter-spacing:-.04em}
.fpx-pill{display:inline-flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border:1px solid var(--fp-line-strong);border-radius:999px;background:rgba(12,11,9,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--fp-ink);font-size:13px;font-weight:550;text-decoration:none;transition:border-color .2s,background .2s}
.fpx-pill b{padding:4px 9px;border-radius:999px;background:var(--fp-accent-fill);color:#fff;font:650 10.5px/1 var(--fp-mono);letter-spacing:.08em;text-transform:uppercase}
.fpx-pill svg{width:14px;height:14px;color:var(--fp-accent-text);transition:transform .25s var(--fp-ease)}
.fpx-pill:hover{border-color:rgba(245,242,235,.34);background:rgba(31,28,22,.8)}
.fpx-pill:hover svg{transform:translateX(3px)}
.fpx-film{margin:0}
.fpx-film-frame{position:relative;aspect-ratio:16/9;border-radius:var(--fp-radius-lg);overflow:hidden;background:#000;border:1px solid var(--fp-line-strong);box-shadow:0 50px 120px -40px rgba(0,0,0,.9),0 0 0 6px rgba(245,242,235,.025),0 30px 90px -50px rgba(220,68,5,.55)}
.fpx-film-frame video{display:block;width:100%;height:100%;object-fit:cover}
.fpx-film-sound{position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 14px 0 8px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(12,11,9,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font:600 13px var(--fp-sans);cursor:pointer;transition:background .2s}
.fpx-film-sound svg{width:24px;height:24px;padding:6px;border-radius:50%;background:#fff;color:#0c0b09}
.fpx-film-sound small{color:rgba(255,255,255,.62);font:500 11px var(--fp-mono)}
.fpx-film-sound:hover{background:rgba(12,11,9,.82)}
.fpx-film figcaption{margin-top:12px;color:var(--fp-faint);font:500 11px/1.4 var(--fp-mono);letter-spacing:.12em;text-transform:uppercase}
.fpx-hero-foot{position:relative;z-index:3;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 40px;margin-top:clamp(28px,4vw,48px)}
.hero[data-variant="film"] .answer{margin:0;max-width:70ch;font-size:13.5px;color:var(--fp-faint)}
.hero[data-variant="film"] .trust{margin:0;font-size:13px;color:var(--fp-muted);align-self:flex-end}
.fpx-film-dialog{width:min(1180px,94vw);padding:0;border:0;border-radius:18px;background:#000;overflow:visible}
.fpx-film-dialog::backdrop{background:rgba(8,7,6,.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.fpx-film-dialog video{display:block;width:100%;aspect-ratio:16/9;border-radius:18px;background:#000}
.fpx-film-x{position:absolute;top:-52px;right:0;width:40px;height:40px;border-radius:50%;border:1px solid var(--fp-line-strong);background:var(--fp-raised);color:var(--fp-ink);font-size:22px;cursor:pointer}
@media(max-width:980px){.fpx-hero-grid{grid-template-columns:1fr}.hero[data-variant="film"] h1{max-width:13ch}}
@media(max-width:680px){.hero[data-variant="film"] .cta-row{width:100%}.hero[data-variant="film"] .cta-row .fp-btn{flex:1 1 100%}.hero[data-variant="film"] .stats{flex-direction:row;flex-wrap:nowrap}.hero[data-variant="film"] .stat{padding:0 14px 0 0}.hero[data-variant="film"] .stat+.stat{padding-left:14px}.hero[data-variant="film"] .stat .v{font-size:19px}.hero[data-variant="film"] .stat .l{font-size:9px}.hero[data-variant="film"] .answer{display:none}.fpx-film-x{top:-48px}}

/* One studio, three ways in. */
.fpx-ways{padding-block:clamp(44px,6vw,72px);border-bottom:1px solid var(--fp-line)}
.fpx-ways-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px}
.fpx-way{position:relative;display:flex;flex-direction:column;gap:10px;min-height:236px;padding:24px;border:1px solid var(--fp-line);border-radius:var(--fp-radius-lg);background:linear-gradient(180deg,rgba(245,242,235,.045),rgba(245,242,235,.01));text-decoration:none;color:var(--fp-ink);overflow:hidden;transition:border-color .3s,transform .4s var(--fp-ease),background .3s}
.fpx-way::after{content:"";position:absolute;inset:auto -30% -60% auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(220,68,5,.22),transparent 65%);opacity:0;transition:opacity .4s}
.fpx-way:hover{border-color:var(--fp-line-strong);transform:translateY(-3px)}
.fpx-way:hover::after{opacity:1}
.fpx-way-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--fp-accent-soft);color:var(--fp-accent-text)}
.fpx-way-ic svg{width:22px;height:22px}
.fpx-way .mono{margin-top:auto;font-size:10.5px;letter-spacing:.16em;color:var(--fp-faint)}
.fpx-way h2{margin:0;font-size:clamp(20px,2vw,24px);line-height:1.08;letter-spacing:-.03em;font-weight:750}
.fpx-way p{margin:0;color:var(--fp-muted);font-size:14.5px;line-height:1.5;max-width:34ch}
.fpx-way-go{position:absolute;top:22px;right:22px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--fp-line-strong);color:var(--fp-ink);transition:background .25s,color .25s}
.fpx-way-go svg{width:16px;height:16px}
.fpx-way:hover .fpx-way-go{background:var(--fp-ink);color:#0c0b09}
@media(max-width:860px){.fpx-ways-grid{grid-template-columns:1fr}.fpx-way{min-height:0}.fpx-way .mono{margin-top:6px}}

/* Line icons replacing emoji in the marketing studio cards. */
.scard .ic{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--fp-accent-soft);color:var(--fp-accent-text);font-size:0}
.scard .ic svg{width:21px;height:21px}
.trust-item{display:inline-flex;align-items:center;gap:7px}
.trust-item svg,.plan .feats svg,.fpx-checks svg{width:15px;height:15px;flex:none;color:var(--fp-accent-text)}

/* Academy band. */
.fpx-academy{background:radial-gradient(80% 120% at 100% 0%,rgba(220,68,5,.09),transparent 60%),var(--fp-bg)}
.fpx-academy-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:center}
.fpx-academy .lead{max-width:46ch}
.fpx-checks{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px;color:var(--fp-ink);font-size:15px}
.fpx-checks li{display:flex;align-items:center;gap:10px}
.fpx-academy .cta-row{justify-content:flex-start;margin-top:28px}
.fpx-academy .fp-btn svg{width:16px;height:16px}
.fpx-lessons{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fpx-lessons li:nth-child(even){transform:translateY(28px)}
.fpx-lessons a{position:relative;display:block;aspect-ratio:4/3;border-radius:var(--fp-radius-lg);overflow:hidden;border:1px solid var(--fp-line);background:var(--fp-surface);color:#fff;text-decoration:none}
.fpx-lessons img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--fp-ease)}
.fpx-lessons a:hover img{transform:scale(1.05)}
.fpx-lessons a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(8,7,6,.88))}
.fpx-lessons span{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;display:flex;flex-direction:column;gap:5px}
.fpx-lessons small{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.fpx-lessons b{font-size:clamp(15px,1.5vw,19px);line-height:1.15;letter-spacing:-.02em}
.fpx-lessons em{position:absolute;top:12px;left:12px;z-index:1;padding:4px 9px;border-radius:999px;background:var(--fp-accent-fill);font:650 10px/1.2 var(--fp-mono);letter-spacing:.08em;text-transform:uppercase;font-style:normal}
@media (prefers-reduced-motion:no-preference){.fp-js .fpx-lessons .fp-reveal{transition-delay:var(--d,0ms)}}
@media(max-width:900px){.fpx-academy-grid{grid-template-columns:1fr}.fpx-lessons li:nth-child(even){transform:none}}

/* Plans from the live catalog. */
.plan .feats span{display:flex;align-items:flex-start;gap:8px}
.plan .feats svg{margin-top:2px}
.plan.feat{border-color:rgba(220,68,5,.45);background:linear-gradient(180deg,rgba(220,68,5,.12),rgba(220,68,5,.02))}
.plan .fp-btn{width:100%;margin-top:auto}
.plan .fp-btn svg{width:16px;height:16px}

/* Quiet the cookie card so it does not cover the hero film. */
.cookie-banner{max-width:420px;left:auto;right:16px;bottom:16px;transform:none;border-radius:18px;border:1px solid var(--fp-line-strong);background:rgba(20,18,14,.96);font-family:var(--fp-sans)}
@media(max-width:520px){.cookie-banner{left:12px;right:12px;max-width:none}}
.plan .feats span:before{content:none}
.channels{background:var(--fp-bg-2)}
.hero[data-variant="film"] .hero-fade,.hero[data-variant="film"] .hero-strip{pointer-events:none}