/* =====================================================================
   ARE YOU ACTUALLY HUNGRY? — FRONT-DOOR COMPONENTS
   Loaded after tokens.css on the front-door pages (Home/Method/Programs/
   Coaching/About/Proof/Podcast/Start). The Living Library uses base.css.
   Bright/high-key always. One warm accent per section. Whitespace is the point.
   ===================================================================== */

.container{ max-width:var(--maxw); margin:0 auto; padding-inline:clamp(20px,5vw,40px); }
.container-narrow{ max-width:780px; margin:0 auto; padding-inline:clamp(20px,5vw,40px); }
.section{ padding-block:clamp(48px,6.5vw,84px); }
.section-sm{ padding-block:clamp(34px,5vw,56px); }
.center{ text-align:center; }
.measure{ max-width:62ch; }
.center .measure{ margin-inline:auto; }
.stack > * + *{ margin-top:1.1rem; }

/* ============================ NAV ============================ */
.site-nav{
  position:sticky; top:0; z-index:50;
  background:rgba(251,248,242,.86); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-inner{ max-width:var(--maxw); margin:0 auto; padding:13px clamp(20px,5vw,40px);
  display:flex; align-items:center; gap:20px; }
.nav-brand{ display:flex; align-items:center; gap:11px; text-decoration:none; margin-right:auto; }
.nav-brand .wm{ font-family:var(--sans); font-size:12.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--sage-deep); font-weight:600; line-height:1.1; max-width:14ch; }
.nav-links{ display:flex; align-items:center; gap:24px; }
.nav-links a{ font-family:var(--sans); font-size:15px; font-weight:500; color:var(--ink); text-decoration:none; letter-spacing:.005em; }
.nav-links a:hover{ color:var(--sage-deep); }
.nav-links a.current{ color:var(--sage-deep); }
.nav-cta{ margin-left:4px; padding:11px 20px; font-size:15px; }
.nav-toggle{ display:none; background:none; border:1.5px solid var(--line); border-radius:10px; padding:8px 10px; cursor:pointer; }
.nav-toggle span{ display:block; width:20px; height:2px; background:var(--ink); margin:4px 0; border-radius:2px; }

@media (max-width:880px){
  .nav-toggle{ display:block; }
  .nav-links{
    position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:stretch; gap:0;
    background:var(--paper); border-bottom:1px solid var(--line);
    padding:8px clamp(20px,5vw,40px) 18px; display:none;
  }
  .site-nav.open .nav-links{ display:flex; }
  .nav-links a{ padding:13px 2px; border-bottom:1px solid var(--line); font-size:17px; }
  .nav-links a:last-child{ border-bottom:none; }
  .nav-cta{ margin-top:12px; align-self:flex-start; }
}

/* ============================ HERO ============================ */
.hero{ position:relative; display:flex; align-items:stretch; overflow:hidden;
  min-height:min(86vh,720px); background:var(--paper); }
.hero-photo{ position:absolute; inset:0; background-position:center 48%; background-size:cover; background-repeat:no-repeat; }
.hero-photo::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(251,248,242,.22) 0%, rgba(251,248,242,0) 40%); mix-blend-mode:screen; }
.hero-panel{ position:relative; z-index:2; width:50%; min-width:480px;
  padding:clamp(40px,6vw,72px) clamp(28px,5vw,64px);
  display:flex; flex-direction:column; justify-content:center;
  background:linear-gradient(90deg, var(--paper) 0%, var(--paper) 76%, rgba(251,248,242,.92) 90%, rgba(251,248,242,0) 100%); }
.hero h1{ font-size:clamp(38px,4.8vw,66px); margin:0 0 .42em; max-width:15ch; }
.hero .hero-sub{ font-family:var(--serif); font-style:italic; font-weight:300;
  font-size:clamp(18px,1.7vw,23px); line-height:1.5; color:var(--ink-soft); max-width:36ch; margin:0 0 2rem; }
.hero .kicker{ margin-bottom:18px; color:var(--clay); }
.cta-row{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.cta-note{ font-size:13.5px; color:var(--ink-soft); line-height:1.45; max-width:21ch; }
.cta-note b{ color:var(--sage-deep); font-weight:600; }
.hero-apex{ position:absolute; bottom:20px; left:clamp(28px,5vw,64px); z-index:3;
  font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); font-weight:600; opacity:.8; }

@media (max-width:860px){
  .hero{ flex-direction:column; min-height:0; }
  .hero-photo{ position:relative; height:46vh; inset:auto; }
  .hero-panel{ width:100%; min-width:0; margin-top:-46px;
    background:linear-gradient(180deg, rgba(251,248,242,0) 0%, var(--paper) 12%);
    padding-top:64px; }
  .hero-apex{ position:static; margin-top:18px; padding-left:0; }
}

/* ===================== STAT-TRIPLET ===================== */
.statbar{ display:flex; gap:clamp(20px,4vw,44px); margin-top:2.4rem; padding-top:1.6rem; border-top:1px solid var(--line); flex-wrap:wrap; }
.stat .n{ font-family:var(--serif); font-weight:400; font-size:clamp(22px,2.4vw,28px); color:var(--sage-deep); line-height:1; }
.stat .l{ font-family:var(--sans); font-size:11.5px; letter-spacing:.05em; color:var(--ink-soft); margin-top:7px; line-height:1.3; max-width:14ch; text-transform:uppercase; }
/* standalone band version */
.statband{ background:var(--sage-wash); border-block:1px solid var(--line); }
.statband .statbar{ justify-content:center; border-top:none; margin:0; padding:clamp(28px,4vw,40px) 0; text-align:center; }
.statband .stat .l{ margin-inline:auto; }

/* ========================= DOORS ========================= */
.doors{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:2.4rem; }
.door{ display:flex; flex-direction:column; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; }
.door-photo{ aspect-ratio:4/5; background-position:center; background-size:cover; }
.door-body{ padding:24px 24px 26px; display:flex; flex-direction:column; flex:1; }
.door-eyebrow{ font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--clay); font-weight:600; margin-bottom:8px; }
.door h3{ margin:0 0 4px; }
.door .door-italic{ font-family:var(--serif); font-style:italic; color:var(--sage-deep); font-size:18px; margin-bottom:10px; }
.door p{ font-size:15.5px; color:var(--ink); margin:0 0 18px; }
.door .door-cta{ margin-top:auto; }
.doors-resolve{ font-family:var(--serif); font-style:italic; font-weight:300; font-size:clamp(19px,2.2vw,25px); color:var(--ink-soft); text-align:center; max-width:46ch; margin:2.2rem auto 0; line-height:1.5; }
@media (max-width:820px){ .doors{ grid-template-columns:1fr; max-width:440px; margin-inline:auto; } }

/* ========================= BANDS ========================= */
.band{ padding-block:clamp(44px,6vw,76px); }
.band-sage{ background:var(--sage-wash); }
.band-clay{ background:var(--clay-wash); }
.band-sky{ background:var(--sky-wash); }
.band-paper2{ background:var(--paper-2); }
.band-line{ border-block:1px solid var(--line); }

/* split image + text */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:center; }
.split.reverse .split-media{ order:2; }
.split-media img, .split-media .split-photo{ border-radius:var(--radius-lg); border:1px solid var(--line); width:100%; display:block; }
.split-photo{ aspect-ratio:16/9; background-position:center; background-size:cover; }
@media (max-width:820px){ .split{ grid-template-columns:1fr; } .split.reverse .split-media{ order:0; } }

/* ======================== FIGURE ========================= */
.figure{ margin:2.2rem auto; text-align:center; max-width:760px; }
.figure-frame{ font-family:var(--serif); font-style:italic; font-weight:300; font-size:clamp(18px,2vw,22px); color:var(--ink-soft); line-height:1.5; max-width:54ch; margin:0 auto 1.4rem; }
.figure img{ width:100%; border-radius:var(--radius-lg); border:1px solid var(--line); background:#fff; }
.figure svg{ width:100%; height:auto; display:block; border-radius:var(--radius-lg); border:1px solid var(--line); background:#fff; }
.figure figcaption{ font-size:13px; color:var(--ink-soft); margin-top:.8rem; font-style:italic; }

/* ======================= FEATURE/TEASER ================== */
.teaser{ text-align:center; }
.teaser .bell{ font-family:var(--serif); font-weight:300; font-size:clamp(26px,3.6vw,42px); line-height:1.12; max-width:18ch; margin:0 auto .8rem; }
.teaser .bell em{ font-style:italic; color:var(--sage-deep); }

.callout{ border-left:3px solid var(--sage); padding:6px 0 6px 22px; margin:1.6rem 0; }
.callout.clay{ border-left-color:var(--clay); }
blockquote.pull{ font-family:var(--serif); font-weight:300; font-style:italic; font-size:clamp(20px,2.6vw,28px);
  line-height:1.34; color:var(--ink); border-left:3px solid var(--sage); padding-left:24px; margin:1.8rem 0; max-width:30ch; }

/* evidence tiers (Method honesty spine) */
.tier-row{ display:grid; gap:14px; margin:1.4rem 0; }
.tier-item{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; }
.tier-badge{ display:inline-block; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  padding:.16rem .5rem; border-radius:5px; margin-bottom:8px; }
.tier-strong{ background:#e3f1e4; color:#1f5d2c; border:1px solid #b6dcb9; }
.tier-moderate{ background:#fbf1da; color:#8a6400; border:1px solid #efd9a4; }
.tier-spec{ background:#f3edf8; color:#5e3c87; border:1px solid #d9c8ec; }

/* ======================== PRICING ======================== */
.pricing-toggle{ display:inline-flex; align-items:center; gap:0; background:var(--paper-2); border:1px solid var(--line);
  border-radius:999px; padding:4px; margin:1.4rem auto 0; }
.pricing-toggle button{ font:inherit; font-weight:600; font-size:14.5px; border:none; background:none; color:var(--ink-soft);
  padding:8px 20px; border-radius:999px; cursor:pointer; }
.pricing-toggle button.active{ background:var(--sage-deep); color:var(--paper); }
.toggle-save{ font-size:12.5px; color:var(--sage-deep); font-weight:600; margin-left:10px; }

.tiers{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:2.2rem; align-items:start; }
.tier{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px 26px; display:flex; flex-direction:column; }
.tier-featured{ border:2px solid var(--sage); box-shadow:0 18px 40px -26px rgba(92,122,96,.5); position:relative; }
.tier-flag{ position:absolute; top:-12px; left:26px; background:var(--sage-deep); color:var(--paper);
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:5px 12px; border-radius:999px; }
.tier .tier-name{ font-family:var(--serif); font-weight:400; font-size:23px; margin:0 0 2px; }
.tier .tier-for{ font-size:14px; color:var(--ink-soft); font-style:italic; margin-bottom:14px; }
.tier .tier-price{ font-family:var(--serif); font-weight:400; font-size:30px; color:var(--sage-deep); margin:6px 0 2px; }
.tier .tier-price .per{ font-family:var(--sans); font-size:14px; color:var(--ink-soft); font-weight:400; }
.tier .tier-meta{ font-size:13px; color:var(--ink-soft); margin-bottom:16px; }
.tier ul{ list-style:none; padding:0; margin:0 0 20px; }
.tier li{ font-size:15px; padding:7px 0 7px 24px; position:relative; border-bottom:1px dotted var(--line); }
.tier li:last-child{ border-bottom:none; }
.tier li::before{ content:""; position:absolute; left:2px; top:15px; width:8px; height:8px; border-radius:50%; background:var(--sage); }
.tier .tier-honest{ font-size:13.5px; color:var(--ink-soft); background:var(--paper-2); border-radius:10px; padding:12px 14px; margin-bottom:18px; }
.tier .btn{ margin-top:auto; width:100%; }
@media (max-width:760px){ .tiers{ grid-template-columns:1fr; } }

/* ===================== PROOF / BELL-LINES ================ */
.belllines{ display:grid; gap:14px; margin:1.6rem 0; }
.belllines li{ list-style:none; font-family:var(--serif); font-weight:300; font-style:italic; font-size:clamp(19px,2.3vw,25px);
  line-height:1.35; color:var(--ink); padding-left:22px; border-left:3px solid var(--clay); }
.proof-block{ margin:2rem 0; }
.proof-block h3{ margin-bottom:.4rem; }
.testimonial-empty{ background:var(--paper-2); border:1px dashed var(--line); border-radius:var(--radius-lg);
  padding:28px 30px; text-align:center; color:var(--ink-soft); font-family:var(--serif); font-style:italic; font-weight:300; font-size:19px; line-height:1.5; }

/* ====================== EMAIL CAPTURE ==================== */
.capture{ display:flex; gap:10px; flex-wrap:wrap; max-width:480px; margin-top:1.2rem; }
.capture input[type=email]{ flex:1 1 220px; font:inherit; font-size:16px; padding:14px 16px; border:1.5px solid var(--line);
  border-radius:999px; background:var(--paper); color:var(--ink); }
.capture input[type=email]:focus{ border-color:var(--sage); }
.capture .btn{ flex:0 0 auto; }
.capture-note{ font-size:13px; color:var(--ink-soft); margin-top:.7rem; }
.center .capture{ margin-inline:auto; }

/* ======================= CTA BAND ======================= */
.cta-band{ text-align:center; }
.cta-band h2{ max-width:20ch; margin-inline:auto; }
.cta-band .lede{ margin:0 auto 1.6rem; max-width:48ch; }

/* ======================== FOOTER ======================== */
.site-footer{ background:var(--paper-2); border-top:1px solid var(--line); padding-block:clamp(40px,6vw,64px) 32px; margin-top:0; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:36px; align-items:start; }
.footer-brand .wm{ font-family:var(--serif); font-weight:300; font-size:24px; }
.footer-disclaimer{ font-size:13.5px; color:var(--ink-soft); line-height:1.6; max-width:54ch; margin-top:14px; }
.footer-disclaimer em{ color:var(--sage-deep); font-style:italic; }
.footer-links{ display:flex; flex-wrap:wrap; gap:10px 26px; }
.footer-links a{ font-size:14.5px; color:var(--ink); text-decoration:none; }
.footer-links a:hover{ color:var(--sage-deep); }
.footer-base{ margin-top:30px; padding-top:18px; border-top:1px solid var(--line); font-size:12.5px; color:var(--ink-soft);
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; }
@media (max-width:680px){ .footer-grid{ grid-template-columns:1fr; gap:24px; } }

/* gentle scroll-in (respects reduced-motion via tokens.css) */
.reveal{ opacity:0; transform:translateY(14px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }

/* =====================================================================
   BOOK-COMPANION ADDITIONS (2026-06-10 re-architecture)
   Home video hero · the book cover · the chapter-one reader · the
   quiet Work-With-Gabe door. Bright/high-key, never a dark overlay.
   ===================================================================== */

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ---------------- HOME — full-bleed video hero (the question, as video) ----------------
   The video carries the headline (burned in, bright). The page adds only the
   book-forward layer at the bottom, on a paper scrim (lifts, never darkens). */
.hero--video{ position:relative; display:block; min-height:min(92vh,840px); overflow:hidden; background:var(--paper); }
.hero--video .hero-media{ position:absolute; inset:0; }
.hero--video .hero-vid{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:var(--paper); }
.hero-vid--tall{ display:none; }
.hero--video .hero-vcontent{ position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding-top:clamp(48px,9vh,96px);
  background:linear-gradient(to top, rgba(251,248,242,.95) 0%, rgba(251,248,242,.62) 48%, rgba(251,248,242,0) 100%); }
.hero-vinner{ max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,40px) clamp(34px,5vw,58px); }
.hero-vinner .kicker{ color:var(--clay); margin-bottom:12px; }
.hero-vlede{ font-family:var(--serif); font-weight:300; font-style:italic; font-size:clamp(18px,2vw,24px);
  line-height:1.45; color:var(--ink); max-width:34ch; margin:0 0 1.6rem; }
.hero-vinner .cta-row{ gap:14px 20px; }
@media (max-width:700px){
  .hero-vid--wide{ display:none; }
  .hero-vid--tall{ display:block; }
  .hero--video{ min-height:86vh; }
}

/* ---------------- THE BOOK — the cover is the hero AND the proof ---------------- */
.book-hero{ display:grid; grid-template-columns:minmax(0,340px) 1fr; gap:clamp(30px,6vw,72px); align-items:center; }
.book-cover-shot{ position:relative; }
/* book-hero.png is a 3-D book object (transparent PNG with its own soft shadow) — no extra chrome */
.book-cover-shot img{ width:100%; display:block; }
.book-meta .kicker{ color:var(--clay); }
.book-meta h1{ margin:.3rem 0 .5rem; }
.book-subtitle{ font-family:var(--serif); font-weight:300; font-style:italic; font-size:clamp(17px,1.8vw,21px);
  color:var(--ink-soft); line-height:1.5; max-width:40ch; margin:0 0 1.4rem; }
@media (max-width:760px){ .book-hero{ grid-template-columns:1fr; justify-items:center; text-align:center; }
  .book-cover-shot{ max-width:280px; } .book-subtitle{ margin-inline:auto; } .book-meta .cta-row{ justify-content:center; } }

/* the 3–5 key ideas */
.ideas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px; margin-top:2.2rem; }
.idea{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:24px 24px 26px; }
.idea .idea-n{ font-family:var(--serif); font-style:italic; font-size:20px; color:var(--sage-deep); }
.idea h3{ margin:.5rem 0 .4rem; font-size:19px; }
.idea p{ font-size:15px; color:var(--ink); margin:0; }

/* ---------------- THE READER (Chapter One, free) ---------------- */
.reader{ max-width:680px; margin:0 auto; padding-inline:clamp(20px,5vw,40px); }
.reader .reader-kicker{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--clay); font-weight:600; }
.reader h1{ font-size:clamp(32px,4.4vw,52px); margin:.4rem 0 1.6rem; line-height:1.08; }
.reader h2{ font-family:var(--serif); font-weight:400; font-size:clamp(22px,2.6vw,30px); color:var(--ink);
  margin:2.6rem 0 1rem; line-height:1.2; }
.reader p{ font-size:1.13rem; line-height:1.76; color:var(--ink); margin:0 0 1.25rem; }
.reader p.lead-line{ font-family:var(--serif); font-style:italic; font-size:1.3rem; color:var(--sage-deep); }
.reader blockquote{ font-family:var(--serif); font-weight:300; font-style:italic; font-size:clamp(20px,2.5vw,27px);
  line-height:1.4; color:var(--ink); border-left:3px solid var(--sage); padding:.2rem 0 .2rem 24px; margin:2rem 0; max-width:34ch; }
.reader .reader-end{ margin-top:3rem; padding-top:2rem; border-top:1px solid var(--line); }

/* ---------------- ABOUT — Gabe portrait, two-column ---------------- */
.about-hero{ display:grid; grid-template-columns:minmax(0,300px) 1fr; gap:clamp(28px,5vw,60px); align-items:center; }
.about-portrait img{ width:100%; display:block; border-radius:16px; border:1px solid var(--line);
  box-shadow:0 26px 54px -30px rgba(46,42,38,.5); }
@media (max-width:720px){ .about-hero{ grid-template-columns:1fr; justify-items:start; } .about-portrait{ max-width:300px; } }

/* ---------------- WORK WITH GABE — one quiet door ---------------- */
.quiet-door{ max-width:680px; margin:0 auto; }
.quiet-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px 30px; margin-top:1.6rem; }
.quiet-card h3{ margin:0 0 .5rem; }
.contact-form{ display:grid; gap:14px; max-width:520px; margin-top:1.2rem; }
.contact-form input, .contact-form textarea{ font:inherit; font-size:16px; padding:13px 15px; border:1.5px solid var(--line);
  border-radius:12px; background:var(--paper); color:var(--ink); width:100%; }
.contact-form textarea{ min-height:120px; resize:vertical; }
.contact-form input:focus, .contact-form textarea:focus{ border-color:var(--sage); outline:none; }

/* =====================================================================
   v6 (2026-06-10) — gentle "alive" motion. Restrained + bright; never flashy.
   Reduced-motion is honored globally by tokens.css (anim/transition → ~0ms).
   ===================================================================== */
/* hero crossfade carousel + slow Ken Burns drift */
.hero--video .hero-slide{ opacity:0; transition:opacity 1.6s ease; will-change:opacity; }
.hero--video .hero-slide.is-active{ opacity:1; animation:kenburns 8s ease-out both; }
@keyframes kenburns{ from{ transform:scale(1.005); } to{ transform:scale(1.065); } }

/* subtle life on in-page photos (hover) */
.split-media{ overflow:hidden; border-radius:var(--radius-lg); }
.split-media .split-photo{ transition:transform 1.4s cubic-bezier(.16,1,.3,1); }
.split-media:hover .split-photo{ transform:scale(1.05); }
.book-cover-shot img{ transition:transform .9s cubic-bezier(.16,1,.3,1); }
.book-cover-shot:hover img{ transform:translateY(-7px); }

/* reveal: add a soft stagger + a gentle scale so it reads as "settling in" */
.reveal{ transform:translateY(16px) scale(.995); }
.reveal.in{ transform:none; }

/* mobile hero — bias the crop so the subject stays in frame on tall phones */
@media (max-width:700px){ .hero--video .hero-slide{ object-position:center 44% !important; } }

/* ---- launch-list scroll bar (gentle, dismissible; slides up past ~55% scroll) ---- */
.launchbar{ position:fixed; left:0; right:0; bottom:0; z-index:60; transform:translateY(112%);
  transition:transform .55s cubic-bezier(.16,1,.3,1); background:rgba(251,248,242,.95);
  backdrop-filter:blur(10px); border-top:1px solid var(--line); box-shadow:0 -10px 34px -20px rgba(46,42,38,.45); }
.launchbar.up{ transform:translateY(0); }
.launchbar-inner{ max-width:var(--maxw); margin:0 auto; padding:11px clamp(16px,4vw,40px);
  display:flex; align-items:center; gap:12px 20px; flex-wrap:wrap; }
.launchbar-msg{ font-size:15px; color:var(--ink); margin:0; flex:1 1 240px; line-height:1.4; }
.launchbar-msg b{ color:var(--sage-deep); }
.launchbar-form{ display:flex; gap:8px; align-items:center; flex:0 1 auto; }
.launchbar-form input[type=email]{ font:inherit; font-size:15px; padding:9px 14px; border:1.5px solid var(--line);
  border-radius:999px; background:var(--paper); color:var(--ink); min-width:190px; }
.launchbar-form input[type=email]:focus{ border-color:var(--sage); outline:none; }
.launchbar-form .btn{ padding:9px 18px; font-size:15px; white-space:nowrap; }
.launchbar-x{ background:none; border:none; font-size:22px; line-height:1; color:var(--ink-soft); cursor:pointer; padding:2px 6px; border-radius:8px; }
.launchbar-x:hover{ color:var(--ink); }
@media (max-width:600px){ .launchbar-msg{ flex-basis:100%; font-size:13.5px; } .launchbar-form{ flex:1 1 100%; }
  .launchbar-form input[type=email]{ flex:1; min-width:0; } .launchbar-x{ position:absolute; top:8px; right:10px; } .launchbar-inner{ position:relative; padding-top:30px; } }

/* ---- video theater: the Noise Map explainer + the engine-metaphor reel ----
   A framed "stage" with a soft listening-halo (the video's own honey bloom) and a
   sigil-like play ring. Native controls stay; the ring is a progressive enhancement. */
.video-figure{ margin:0; display:flex; flex-direction:column; align-items:center; }
.video-stage{ position:relative; display:inline-block; line-height:0; border-radius:18px; isolation:isolate; }
.video-stage::before{ content:""; position:absolute; inset:-6% -3%; z-index:0; border-radius:50%;
  background:radial-gradient(58% 58% at 50% 44%, rgba(232,176,75,.22), rgba(124,154,126,.13) 46%, transparent 72%);
  filter:blur(16px); pointer-events:none; }
.video-stage video{ position:relative; z-index:1; display:block; width:100%; height:auto; border-radius:18px;
  border:1px solid var(--line); background:var(--paper);
  box-shadow:0 26px 64px -26px rgba(46,42,38,.45), 0 6px 16px -8px rgba(46,42,38,.16); }
.video-wide video{ width:min(820px,88vw); aspect-ratio:16/9; }
.video-tall video{ width:min(322px,76vw); aspect-ratio:9/16; }
.video-play{ position:absolute; inset:0; z-index:2; display:grid; place-items:center; cursor:pointer;
  border:0; border-radius:18px; background:transparent; transition:opacity .5s ease; -webkit-tap-highlight-color:transparent; }
.video-play.is-hidden{ opacity:0; pointer-events:none; }
.video-ring{ width:78px; height:78px; border-radius:50%; display:grid; place-items:center;
  background:rgba(251,248,242,.94); color:var(--sage-deep);
  box-shadow:0 12px 30px -8px rgba(46,42,38,.5), 0 0 0 1.5px rgba(124,154,126,.55) inset;
  transition:transform .3s ease, box-shadow .3s ease; }
.video-ring svg{ margin-left:5px; }
.video-play:hover .video-ring, .video-play:focus-visible .video-ring{ transform:scale(1.07);
  box-shadow:0 16px 38px -8px rgba(46,42,38,.55), 0 0 0 2.5px rgba(232,176,75,.75) inset; }
.video-play:focus-visible{ outline:none; }
.video-cap{ margin:1.3rem auto 0; color:var(--ink-soft); }
@media (prefers-reduced-motion: reduce){ .video-ring, .video-play{ transition:none; } }
