/* founders-offer.css: the page-owned system for /founders-offer. Copy and product captures live in
   src/components/founders-offer. Dark is the default and [data-theme='light'] swaps the tokens. Every edit
   here needs a CSS_VERSION bump in constants.js (the page links the file with that query string).

   Spacing sits on an 8px grid (4px for hairline gaps). Type steps: 13 / 15 / 17 / 20 / 24 / 56 / 84.
   Weights: 500 display, 700 controls and labels, 400 body. Hairlines only on frames and dividers.
   Depth: .fz-glow (far, lags the page) > .fz-frame and .fz-shot (glass, lead it) > copy (page speed). */
.founders {
  --fz-bg: #060a14; --fz-bg2: #0a111f; --fz-card: #0f1829; --fz-card2: #172441;
  --fz-ink: #f0f4ff; --fz-muted: #8fa1bf; --fz-accent: #93b5ff; --fz-ring: #adc8ff; --fz-ok: #7fd3b6;
  --fz-line: #94b5f01a; --fz-line2: #97b8fa36; --fz-pill: #a5c7ff10;
  --fz-shadow: #0005; --fz-shadow2: #0009; --fz-plate: #0b1324d6;
  --fz-glass: linear-gradient(135deg, #a4c6ff12, #1b335d22 46%, #11203b3d);
  --fz-grad: linear-gradient(105deg, #d6e7ff 2%, #83b8ff 42%, #888cf6 78%, #b8a0ff);
  --fz-cta: linear-gradient(115deg, #447ce4, #6564de 70%, #8272e8);
  --fz-font: 'Satoshi', 'Helvetica Neue', system-ui, sans-serif;
  position: relative; display: flow-root; min-height: 100%; overflow: clip; isolation: isolate;
  background: var(--fz-bg); color: var(--fz-ink); font-family: var(--fz-font);
  font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
.founders[data-theme='light'] {
  --fz-bg: #f6f8fe; --fz-bg2: #eef2fb; --fz-card: #ffffff; --fz-card2: #e1eafd;
  --fz-ink: #0f1c38; --fz-muted: #56698a; --fz-accent: #3561c0; --fz-ring: #386ade; --fz-ok: #1f7a5c;
  --fz-line: #4265a71a; --fz-line2: #456fb336; --fz-pill: #3561c00c;
  --fz-shadow: #2c498317; --fz-shadow2: #18315d2e; --fz-plate: #f7f9ffe0;
  --fz-glass: linear-gradient(135deg, #ffffffb3, #c1d5ff40 46%, #f7fbff9e);
  --fz-grad: linear-gradient(100deg, #5B8DEF, #7273F3 55%, #8B5CF6);
}

/* ---------- base ---------- */
html:has(#founders), body:has(#founders) { height: auto; }
body:has(#founders) { overflow: visible; }
html:has(#founders) { scroll-behavior: smooth; scroll-padding-top: 88px; }
.founders *, .founders *::before, .founders *::after { box-sizing: border-box; }
.founders :is(a, button, summary, [tabindex]):focus-visible { outline: 2px solid var(--fz-ring); outline-offset: 4px; }
.founders :is(section, [id]) { scroll-margin-top: 0; }
.founders ::selection { background: #416cca; color: #fff; }
.founders img { display: block; max-width: 100%; height: auto; }
.founders ul, .founders ol { list-style: none; margin: 0; padding: 0; }
.founders p, .founders h1, .founders h2, .founders h3, .founders figure { margin: 0; }
.founders a { color: inherit; text-decoration: none; }
.founders :where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.fz-container { width: min(1056px, calc(100% - 112px)); margin-inline: auto; }
.fz-section { position: relative; padding-block: 112px; }
.fz-section > .fz-container { position: relative; z-index: 1; }
.fz-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fz-skip { position: fixed; z-index: 200; top: 12px; left: 16px; transform: translateY(-160%); background: var(--fz-card); padding: 12px 20px; border-radius: 999px; font-weight: 700; }
.fz-skip:focus { transform: none; }
.fz-page-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 100; background: var(--fz-grad); transform-origin: left; }

/* ---------- type ---------- */
.fz-grad { background: var(--fz-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.fz-label { display: inline-flex; align-items: center; gap: 12px; font-size: 13px; line-height: 1.3; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--fz-muted); }
.fz-label b { color: var(--fz-accent); font-weight: 700; }
.fz-label b:empty { display: none; }
.founders .fz-h2 { font-weight: 500; font-size: clamp(36px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -.03em; margin-top: 20px; text-wrap: balance; }
.founders .fz-h2--xl { font-size: clamp(44px, 4.5vw, 64px); line-height: 1.04; }
.fz-h3 { font-size: 22px; line-height: 1.25; font-weight: 500; letter-spacing: -.02em; }
.founders .fz-lede { font-size: 16px; line-height: 1.55; color: var(--fz-muted); max-width: 560px; margin-top: 20px; }
.fz-body { font-size: 15px; line-height: 1.6; }
.fz-micro { font-size: 14px; line-height: 1.5; color: var(--fz-muted); }
.fz-muted { color: var(--fz-muted); }
.fz-word { display: inline-block; }
.fz-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--fz-accent); box-shadow: 0 0 10px #82afff80; flex-shrink: 0; }
.fz-card__label { display: block; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--fz-muted); font-weight: 700; }

/* section opener: label, headline, and a lede or an aside at right on the same baseline */
.fz-head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: end; gap: 56px; margin-bottom: 48px; }
.fz-head > .fz-lede { margin-top: 0; padding-bottom: 8px; }
.fz-head__aside { justify-self: end; padding-bottom: 12px; }
.fz-head.fz-head--center { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 0; }
.fz-head--center .fz-h2 { max-width: 780px; }
.fz-head--center > .fz-lede { margin-top: 24px; padding-bottom: 0; }

/* ---------- controls ---------- */
.fz-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 24px; border-radius: 999px; font: 700 15px/1.2 var(--fz-font); white-space: nowrap; transition: transform .2s, box-shadow .2s, background-color .2s, border-color .2s; }
.fz-btn svg { flex-shrink: 0; transition: transform .2s; }
.fz-btn:hover svg { transform: translate(2px, -2px); }
.fz-btn--lg { min-height: 48px; padding: 0 24px; font-size: 15px; }
.fz-btn--sm { min-height: 40px; padding: 0 18px; font-size: 14px; gap: 8px; }
.fz-btn--primary { color: #fff; background: var(--fz-cta); box-shadow: inset 0 1px 0 #ffffff33, 0 8px 28px -10px #7273f3aa; }
.fz-btn--primary:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 #ffffff33, 0 14px 36px -12px #7273f3cc; }
.fz-btn--ghost { background: transparent; border: 1px solid var(--fz-line2); color: var(--fz-ink); }
.fz-btn--ghost:hover { border-color: var(--fz-accent); background: #729fe212; }
.fz-textlink { display: inline-flex; align-items: center; gap: 8px; color: var(--fz-ink); font-size: 16px; font-weight: 700; }
.fz-textlink:hover { color: var(--fz-accent); }
.fz-iconbtn { display: inline-grid; place-items: center; position: relative; width: 36px; height: 36px; border: 1px solid var(--fz-line2); border-radius: 50%; color: var(--fz-muted); background: transparent; }
.fz-iconbtn:hover { color: var(--fz-ink); background: #7a9fe212; }
.fz-iconbtn svg { position: absolute; transition: opacity .2s; }
.fz-iconbtn [data-on='0'] { opacity: 0; }
.fz-pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--fz-line2); background: var(--fz-pill); color: var(--fz-accent); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.fz-badge { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--fz-line2); background: var(--fz-pill); color: var(--fz-accent); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
/* segmented pills (the demo's three questions) */
.fz-pills { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; border: 1px solid var(--fz-line2); background: var(--fz-plate); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); max-width: 100%; }
.fz-pills button { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 20px; border-radius: 999px; color: var(--fz-muted); font-size: 15px; font-weight: 700; white-space: nowrap; transition: color .2s, background-color .2s; }
.fz-pills button svg { color: var(--fz-accent); flex-shrink: 0; }
.fz-pills button:hover { color: var(--fz-ink); }
.fz-pills button.is-active { color: var(--fz-ink); background: var(--fz-card2); box-shadow: inset 0 1px 0 #ffffff12, 0 8px 20px -10px var(--fz-shadow2); }

/* ---------- glass ---------- */
.fz-frame { position: relative; border: 1px solid var(--fz-line2); border-radius: 24px; background: var(--fz-glass), var(--fz-bg2); box-shadow: inset 0 1px 0 #d1e2ff12, 0 40px 100px -40px var(--fz-shadow2); }
.fz-frame--clip { overflow: hidden; }
.fz-glow { position: absolute; z-index: 0; pointer-events: none; border-radius: 50%; }
.fz-glow--tl { width: 760px; height: 760px; top: -240px; left: -260px; background: radial-gradient(circle, #3b62d436, transparent 66%); }
.fz-glow--br { width: 860px; height: 860px; bottom: -340px; right: -300px; background: radial-gradient(circle, #6d3fd12c, transparent 66%); }
.fz-glow--c { width: 1000px; height: 640px; top: 22%; left: 50%; translate: -50% 0; background: radial-gradient(ellipse, #3b62d42c, transparent 66%); }
[data-theme='light'] .fz-glow { opacity: .55; }
/* a browser-chrome window: the demo, the film and the hero share it */
.fz-window__bar { height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 20px; background: var(--fz-glass); border-bottom: 1px solid var(--fz-line); color: var(--fz-muted); font-size: 13px; font-weight: 700; }
.fz-window__bar > span { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.fz-window__dots { display: flex; gap: 6px; }
.fz-window__dots i { width: 10px; height: 10px; border-radius: 50%; background: #7c8ba74a; }
.fz-window__badge { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--fz-line2); font-size: 12px; letter-spacing: .04em; white-space: nowrap; }

/* ---------- nav ---------- */
.fz-nav { height: 72px; position: fixed; top: 0; left: 0; right: 0; z-index: 50; background: transparent; border-bottom: 1px solid transparent; transition: background .3s, border-color .3s, backdrop-filter .3s; }
.fz-nav[data-stuck='1'] { background: var(--fz-plate); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border-bottom-color: var(--fz-line); }
.fz-nav__inner { width: min(1056px, calc(100% - 112px)); height: 100%; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.fz-lockup { display: inline-flex; align-items: center; gap: 8px; }
.fz-lockup img { width: auto; }
.fz-nav__links { display: flex; align-items: center; gap: 32px; }
.fz-nav__links a { display: inline-flex; align-items: center; gap: 8px; color: var(--fz-muted); font-size: 15px; font-weight: 500; transition: color .2s; }
.fz-nav__links a:hover { color: var(--fz-ink); }
.fz-nav__badge { padding: 2px 8px; border-radius: 999px; border: 1px solid var(--fz-line2); background: var(--fz-pill); color: var(--fz-accent); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.fz-nav__actions { display: flex; align-items: center; gap: 10px; }
.fz-nav__menu { display: none; }
.fz-nav__cta-tight { display: none; }
.fz-nav--centered .fz-nav__inner { display: grid; grid-template-columns: 1fr auto 1fr; }
.fz-nav--centered .fz-nav__brand { justify-self: start; }
.fz-nav--centered .fz-nav__actions { justify-self: end; }
@media (max-width: 767px) {
  .fz-nav--centered .fz-nav__inner { grid-template-columns: 1fr auto; }
  .fz-nav--centered .fz-nav__links.is-open { align-items: center; text-align: center; }
}

/* ---------- hero: the product's own first screen, then the product ---------- */
.fz-hero { position: relative; padding-top: 72px; overflow: clip; }
.fz-hero__bg { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse 50% 36% at 50% 6%, #5b8def30, transparent 70%), radial-gradient(ellipse 44% 30% at 50% 64%, #8b5cf624, transparent 70%); }
[data-theme='light'] .fz-hero__bg { background: radial-gradient(ellipse 50% 36% at 50% 6%, #5b8def22, transparent 70%), radial-gradient(ellipse 44% 30% at 50% 64%, #8b5cf618, transparent 70%); }
.fz-hero__copy { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; }
.fz-hero__mark { display: grid; place-items: center; margin-bottom: 32px; filter: drop-shadow(0 12px 32px #7273f35c); }
.fz-h1 { max-width: 1040px; font-weight: 500; font-size: 76px; line-height: 1.04; letter-spacing: -.035em; text-wrap: balance; }
.fz-h1__line { display: block; }
/* background-clip: text at this size and line height clips a descender, so the gradient word carries
   its own room and takes it back with a negative margin, leaving the line box unchanged. */
.fz-h1 .fz-grad { display: inline-block; padding-bottom: .1em; margin-bottom: -.1em; background-image: linear-gradient(102deg, #e2edff, #9ac3ff 46%, #b3a6ff); }
[data-theme='light'] .fz-h1 .fz-grad { background-image: var(--fz-grad); }
.fz-hero__sub { max-width: 620px; margin-top: 24px; font-size: 18px; line-height: 1.5; color: var(--fz-muted); text-wrap: balance; }
.fz-hero__actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px 24px; margin-top: 40px; }
.fz-hero__offer { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500; color: var(--fz-muted); transition: color .2s; }
.fz-hero__offer strong { color: var(--fz-ink); font-weight: 700; }
.fz-hero__offer:hover { color: var(--fz-muted); }
.fz-hero__offer:hover strong { color: var(--fz-accent); }
.fz-hero__stage { position: relative; z-index: 1; margin-top: 72px; }
.fz-hero__persp { perspective: 1400px; mask-image: linear-gradient(#000 74%, transparent 100%); -webkit-mask-image: linear-gradient(#000 74%, transparent 100%); }
.fz-shot { position: relative; border-radius: 20px; overflow: hidden; border: 1px solid var(--fz-line2); background: var(--fz-bg2); box-shadow: 0 60px 140px -40px var(--fz-shadow2), inset 0 1px 0 #d1e2ff14; transform-origin: 50% 0; }
.fz-loop { width: 100%; }
.fz-loop video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
/* The hero's live demo: the app redrawn as markup (DemoApp) in its own dark theme, driven by a storyboard
   (HeroDemo). Authored at 1440×810 and scaled to the frame; the camera layer zooms on send. Only transform
   and opacity ever animate. --eo arrives, --eio travels; hidden states exist only once JS has armed the board. */
.fz-live { --eo: cubic-bezier(.215, .61, .355, 1); --eio: cubic-bezier(.645, .045, .355, 1); --lv-bg: #0b0b0e; --lv-side: #0e0e12; --lv-line: #1e1e25; --lv-ink: #ececf1; --lv-muted: #8e8e9a; --lv-faint: #5b5b66; --lv-violet: #8f82ff; --lv-surface: #151519; --lv-surface2: #1b1b21; font-family: var(--fz-font); }
.fz-live__stage { position: relative; overflow: hidden; height: calc(630px * var(--k, .82)); background: var(--lv-bg); }
.fz-live__canvas { position: absolute; left: 0; top: 0; width: 1120px; height: 630px; transform: translateX(calc(var(--ox, 0px) * var(--k, .82))) scale(var(--k, .82)); transform-origin: 0 0; }
/* No camera move. The app sits at 1:1 and the interface itself carries every beat. */
.fz-live__cam { position: absolute; inset: 0; display: grid; grid-template-columns: 200px minmax(0, 1fr); background: var(--lv-bg); color: var(--lv-ink); font-size: 14.5px; line-height: 1.45; letter-spacing: .004em; }
.fz-live .notransition, .fz-live .notransition * { transition: none !important; animation: none !important; }
/* sidebar */
.fz-live__side { display: flex; flex-direction: column; padding: 18px 16px; background: var(--lv-side); border-right: 1px solid var(--lv-line); font-size: 13.5px; }
.fz-live__brand { display: flex; align-items: center; gap: 9px; color: var(--lv-violet); font-weight: 600; font-size: 16px; margin-bottom: 22px; }
.fz-live__brand svg:last-child { margin-left: auto; color: var(--lv-muted); }
.fz-live__new { display: flex; align-items: center; gap: 10px; font-weight: 500; margin-bottom: 26px; }
.fz-live__label { display: flex; align-items: center; justify-content: space-between; font-size: 11.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--lv-muted); margin-bottom: 10px; }
.fz-live__hint { color: var(--lv-faint); font-size: 13px; margin: 0 0 22px; padding-bottom: 20px; border-bottom: 1px solid var(--lv-line); }
.fz-live__chats { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; font-size: 13.5px; }
.fz-live__foot { margin-top: auto; display: flex; flex-direction: column; gap: 10px; padding-top: 18px; border-top: 1px solid var(--lv-line); }
.fz-live__row { display: flex; align-items: center; gap: 9px; color: var(--lv-muted); }
.fz-live__credits { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; }
.fz-live__credits b { color: var(--lv-violet); font-weight: 500; }
.fz-live__meter { display: block; height: 3px; border-radius: 2px; background: var(--lv-line); overflow: hidden; }
.fz-live__meter i { display: block; width: 96%; height: 100%; background: var(--lv-violet); opacity: .85; }
.fz-live__foot small { font-size: 11.5px; color: var(--lv-faint); }
.fz-live__me { display: flex; align-items: center; gap: 10px; margin-top: 8px; }
.fz-live__me > span, .fz-live__top > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #6d7cff; color: #fff; font-weight: 600; font-size: 12.5px; }
.fz-live__me div { display: flex; flex-direction: column; font-weight: 500; line-height: 1.25; }
.fz-live__me small { font-weight: 400; font-size: 11.5px; color: var(--lv-faint); }
.fz-live__me svg { margin-left: auto; color: var(--lv-muted); }
/* scenes stack in one cell so the cross fade never shifts layout */
.fz-live__main { position: relative; display: grid; min-width: 0; }
.fz-live__scene { grid-area: 1 / 1; display: flex; flex-direction: column; min-width: 0; opacity: 0; visibility: hidden; transition: opacity .25s var(--eo), visibility 0s linear .25s; }
.fz-live__home { justify-content: center; opacity: 1; visibility: visible; transition: opacity .25s var(--eo); }
.fz-live.sent .fz-live__home { opacity: 0; visibility: hidden; transition: opacity .25s var(--eo), visibility 0s linear .25s; }
.fz-live.sent .fz-live__chat { opacity: 1; visibility: visible; transition: opacity .25s var(--eo) .1s; }
.fz-live:not(.js) .fz-live__home { display: none; }
.fz-live:not(.js) .fz-live__chat { opacity: 1; visibility: visible; }
/* the first screen */
.fz-live__center { width: 588px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; padding-bottom: 80px; }
.fz-live__mark { margin-bottom: 18px; filter: drop-shadow(0 8px 24px #7b6cff3d); }
.fz-live__center h2 { margin: 0 0 30px; font-size: 32px; font-weight: 500; letter-spacing: -.02em; }
.fz-live__chips { display: flex; gap: 8px; width: 100%; margin-bottom: 12px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.fz-live__chips span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--lv-line); background: var(--lv-surface); color: var(--lv-muted); font-size: 12.5px; white-space: nowrap; }
.fz-live__composer { position: relative; display: flex; align-items: center; gap: 10px; width: 100%; height: 48px; padding: 0 8px 0 10px; border-radius: 14px; border: 1px solid var(--lv-line); background: var(--lv-surface2); transition: box-shadow .3s var(--eo), border-color .3s var(--eo); }
.fz-live__composer.armed { border-color: #8f82ff66; box-shadow: 0 0 0 5px #8f82ff1f, 0 0 0 1.5px #8f82ff4d; }
.fz-live__plus, .fz-live__send { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--lv-muted); flex-shrink: 0; }
.fz-live__plus { background: #23232b; }
.fz-live__field { position: relative; flex: 1; min-width: 0; font-size: 15px; white-space: nowrap; overflow: hidden; }
.fz-live__ph { position: absolute; left: 0; top: 0; color: var(--lv-faint); transition: opacity .15s; }
.fz-live__home.typing .fz-live__ph { opacity: 0; }
.fz-live__caret { display: inline-block; width: 1.5px; height: 1.1em; margin-left: 1px; vertical-align: -3px; background: #c9c4ff; opacity: 0; }
.fz-live__home.typing .fz-live__caret { opacity: 1; }
.fz-live__home.done .fz-live__caret { animation: fz-caret 1.06s steps(1) infinite; }
@keyframes fz-caret { 50% { opacity: 0; } }
.fz-live__model { display: inline-flex; align-items: center; gap: 5px; color: var(--lv-muted); font-size: 12.5px; white-space: nowrap; }
.fz-live__mic { color: var(--lv-muted); flex-shrink: 0; }
.fz-live__send { background: #2a2a33; transition: transform .12s var(--eo), background .2s, color .2s; }
.fz-live__home.typing .fz-live__send { background: #7c6cff; color: #fff; }
.fz-live__send.press { transform: scale(.94); }
.fz-live__rows { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.fz-live__conn { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 12px; border-radius: 10px; background: var(--lv-surface); font-size: 13.5px; color: var(--lv-muted); }
.fz-live__conn img { width: 22px; height: 22px; border-radius: 6px; object-fit: contain; }
.fz-live__conn b { color: var(--lv-ink); font-weight: 600; }
.fz-live__conn span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* the chat */
.fz-live__top { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 22px; border-bottom: 1px solid var(--lv-line); color: var(--lv-muted); font-size: 13.5px; }
.fz-live__top > span { width: 22px; height: 22px; font-size: 11px; }
.fz-live__thread { position: relative; width: 800px; margin: 26px auto 0; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; flex: 1; }
.fz-live__bubble { align-self: flex-end; padding: 12px 18px; border-radius: 16px 16px 5px 16px; background: #1c1c22; font-size: 16px; }
.fz-live__thoughts, .fz-live__status { display: flex; align-items: center; gap: 8px; color: var(--lv-muted); font-size: 15px; }
.fz-live__thoughts { margin-top: 6px; }
.fz-live__status b { font-weight: 400; }
.fz-live__answer { display: flex; flex-direction: column; gap: 10px; margin-top: 2px; }
.fz-live__h { margin: 0; font-size: 31px; font-weight: 600; letter-spacing: -.02em; line-height: 1.25; }
.fz-live__p { margin: 0; font-size: 18px; color: #c7c7d1; line-height: 1.55; max-width: 720px; }
.fz-live__card { width: 100%; padding: 14px 16px 16px; border-radius: 14px; border: 1px solid var(--lv-line); background: var(--lv-surface); margin-top: 6px; }
.fz-live__cardhead { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; margin-bottom: 14px; }
.fz-live__cardhead svg { color: var(--lv-violet); }
.fz-live__cardhead em { margin-left: auto; font-style: normal; font-weight: 400; font-size: 11.5px; color: var(--lv-faint); }
.fz-live__tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.fz-live__tile { padding: 12px 14px; border-radius: 10px; background: var(--lv-surface2); border: 1px solid var(--lv-line); transition: box-shadow .3s var(--eo), border-color .3s var(--eo); }
.fz-live__tile small { display: block; font-size: 13px; color: var(--lv-muted); margin-bottom: 5px; }
.fz-live__tile b { font-size: 27px; font-weight: 600; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fz-live__tile.hl { border-color: #8f82ff88; box-shadow: 0 0 0 1.5px #8f82ff55, 0 0 0 5px #8f82ff1f; }
.fz-live__composer--dock { width: 800px; margin: 0 auto 24px; }
/* reveals and streams exist only once the board is armed */
.fz-live.js [data-reveal] { opacity: 0; transform: translateY(8px); transition: opacity .3s var(--eo), transform .3s var(--eo); }
.fz-live [data-reveal].in { opacity: 1; transform: none; }
.fz-live .w { opacity: 0; filter: blur(3px); transition: opacity .18s var(--eo), filter .18s var(--eo); }
.fz-live .w.on { opacity: 1; filter: none; }

/* Ask ferza's three answers, each a board rather than a still (DemoResults). Hidden states exist only
   once JS arms the stage, so no-JS and the first paint both show the finished panel. */
.fz-results__stage { --eo: cubic-bezier(.215, .61, .355, 1); --spring: cubic-bezier(.34, 1.56, .64, 1); }
.fz-results__stage.notransition, .fz-results__stage.notransition * { transition: none !important; animation: none !important; }
.fz-results__stage.js [data-reveal] { opacity: 0; transform: translateY(10px); transition: opacity .35s var(--eo), transform .35s var(--eo); }
.fz-results__stage [data-reveal].in { opacity: 1; transform: none; }
/* the numbers keep their own column while they count, so nothing reflows mid-beat */
.fz-stats strong, .fz-profit > strong { font-variant-numeric: tabular-nums; }
/* the line draws itself, its fill follows, and the head lands last */
.fz-chart__area { opacity: 0; transition: opacity .5s var(--eo); }
.fz-chart__area.in { opacity: 1; }
.fz-chart__head { opacity: 0; transform: scale(.2); transform-origin: center; transform-box: fill-box; transition: opacity .3s var(--eo), transform .4s var(--spring); }
.fz-chart__head.in { opacity: 1; transform: scale(1); }
/* a concept is dealt onto the table, then briefly ringed as it settles */
.fz-results__stage.js .fz-results--designs figure { opacity: 0; transform: translateY(16px) scale(.96) rotate(var(--r, 0deg)); transition: opacity .4s var(--eo), transform .5s var(--spring), box-shadow .45s var(--eo); }
.fz-results--designs figure:nth-child(1) { --r: -1.5deg; }
.fz-results--designs figure:nth-child(3) { --r: 1.5deg; }
.fz-results--designs figure.in { opacity: 1; transform: translateY(0) scale(1) rotate(var(--r, 0deg)); }
.fz-results--designs figure.lit { box-shadow: 0 0 0 1.5px #8fb4ff66, 0 0 0 6px #8fb4ff1c; }
/* the margin bar fills to what she keeps */
.fz-marginbar i { transform: scaleX(var(--p, 1)); transform-origin: left; }

/* --- 05 how it works, steps 02-05: the app doing the work, live (StepBoard) -------------------- */
.fz-sb { --eo: cubic-bezier(.215, .61, .355, 1); --spring: cubic-bezier(.34, 1.56, .64, 1);
  --sb-bg: #0b0b0e; --sb-line: #22222b; --sb-ink: #ececf1; --sb-muted: #8e8e9a; --sb-faint: #5b5b66;
  --sb-surface: #141419; --sb-violet: #8f82ff; --sb-ok: #4ec08d; border-radius: 16px; overflow: hidden; }
.fz-sb__stage { position: relative; height: calc(562px * var(--k, .6)); background: var(--sb-bg); }
.fz-sb__canvas { position: absolute; left: 0; top: 0; width: 1000px; height: 562px; transform: scale(var(--k, .6)); transform-origin: 0 0; }
.fz-sb.notransition, .fz-sb.notransition * { transition: none !important; animation: none !important; }
.fz-sb__body { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 34px 38px; color: var(--sb-ink); font-family: var(--fz-font); font-size: 15px; letter-spacing: .004em; }
.fz-sb.js [data-reveal] { opacity: 0; transform: translateY(10px); transition: opacity .34s var(--eo), transform .34s var(--eo); }
.fz-sb [data-reveal].in { opacity: 1; transform: none; }
/* the opening pair every step shares */
.fz-sb__ask { align-self: flex-end; padding: 11px 17px; border-radius: 16px 16px 5px 16px; background: #1c1c22; font-size: 15.5px; }
.fz-sb__working { display: flex; align-items: center; gap: 9px; margin-top: 16px; color: var(--sb-muted); font-size: 14.5px; }
.fz-sb__badge { position: absolute; left: 38px; bottom: 30px; display: inline-flex; align-items: center; gap: 9px; padding: 8px 14px 8px 9px; border-radius: 999px; border: 1px solid var(--sb-line); background: var(--sb-surface); color: var(--sb-muted); font-size: 13px; font-weight: 500; }
.fz-sb__badge img { border-radius: 5px; object-fit: contain; }
/* a plate is a concept or a product: it arrives as its own frame, then the artwork resolves inside */
.fz-sb__plate { position: relative; display: block; border-radius: 12px; overflow: hidden; background: #17171d; }
.fz-sb__plate::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, #ffffff00 20%, #ffffff14 50%, #ffffff00 80%); background-size: 300% 100%; animation: fz-sb-shim 1.4s linear infinite; }
.fz-sb__plate img { display: block; width: 100%; height: 100%; object-fit: contain; opacity: 0; filter: blur(8px); transform: scale(1.04); transition: opacity .5s var(--eo), filter .6s var(--eo), transform .6s var(--eo); }
figure.done .fz-sb__plate::after { opacity: 0; animation: none; transition: opacity .3s; }
figure.done .fz-sb__plate img { opacity: 1; filter: none; transform: none; }
@keyframes fz-sb-shim { to { background-position: -300% 0; } }
/* 02 design */
.fz-sb__concepts { display: flex; gap: 16px; margin-top: 26px; }
.fz-sb__concepts figure { flex: 1; margin: 0; }
.fz-sb__concepts .fz-sb__plate { height: 300px; background: #101015; }
.fz-sb.js .fz-sb__concepts figure[data-reveal] { transform: translateY(18px) scale(.97); transition: opacity .4s var(--eo), transform .5s var(--spring); }
.fz-sb .fz-sb__concepts figure[data-reveal].in { transform: none; }
/* 03 mockups */
.fz-sb__tiles { display: flex; gap: 13px; margin-top: 26px; }
.fz-sb__tiles figure { flex: 1; margin: 0; text-align: center; }
.fz-sb__tiles .fz-sb__plate { height: 280px; background: #101015; }
.fz-sb.js .fz-sb__tiles figure[data-reveal] { transform: translateY(14px) scale(.9); transition: opacity .35s var(--eo), transform .45s var(--spring); }
.fz-sb .fz-sb__tiles figure[data-reveal].in { transform: none; }
/* 04 publish */
.fz-sb__form { margin-top: 20px; padding: 20px 22px; border: 1px solid var(--sb-line); border-radius: 14px; background: var(--sb-surface); }
.fz-sb__field { display: flex; flex-direction: column; gap: 8px; padding-block: 11px; border-bottom: 1px solid var(--sb-line); }
.fz-sb__field:last-of-type { border-bottom: 0; }
.fz-sb__field > span { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--sb-faint); }
.fz-sb__field em { font-style: normal; font-variant-numeric: tabular-nums; color: var(--sb-violet); }
.fz-sb__field p { margin: 0; font-size: 15.5px; display: inline; }
.fz-sb__caret { display: inline-block; width: 1.5px; height: 1em; margin-left: 2px; vertical-align: -2px; background: var(--sb-violet); opacity: 0; }
.fz-sb__field.typing .fz-sb__caret { opacity: 1; }
.fz-sb__field--row { flex-direction: row; align-items: center; gap: 14px; }
.fz-sb__field--row strong { font-size: 19px; font-weight: 600; font-variant-numeric: tabular-nums; }
.fz-sb__ship { color: var(--sb-ok) !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 13px !important; }
.fz-sb__tags { display: flex; flex-wrap: wrap; gap: 7px; }
.fz-sb__tags i { font-style: normal; padding: 5px 10px; border-radius: 7px; background: #1e1e26; color: #c7c7d1; font-size: 12.5px; opacity: 0; transform: translateY(5px) scale(.9); transition: opacity .2s var(--eo), transform .28s var(--spring); }
.fz-sb__tags i.in { opacity: 1; transform: none; }
.fz-sb__publish-btn { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; padding: 10px 18px; border-radius: 10px; background: var(--sb-violet); color: #fff; font-size: 14px; font-weight: 600; transition: transform .12s var(--eo), box-shadow .25s var(--eo); }
.fz-sb__publish-btn.armed { box-shadow: 0 0 0 5px #8f82ff24; }
.fz-sb__publish-btn.press { transform: scale(.95); }
.fz-sb__live { display: flex; align-items: center; gap: 11px; margin-top: 16px; padding: 13px 16px; border-radius: 12px; border: 1px solid #4ec08d3d; background: #4ec08d12; font-size: 14.5px; font-weight: 500; }
.fz-sb__live em { font-style: normal; margin-left: auto; color: var(--sb-muted); font-weight: 400; font-size: 13.5px; }
.fz-sb__tick { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--sb-ok); color: #06231a; transform: scale(.3); opacity: 0; transition: transform .4s var(--spring), opacity .25s var(--eo); }
.fz-sb__tick.done { transform: none; opacity: 1; }
/* 05 optimize */
.fz-sb__split { display: flex; gap: 4px; height: 16px; margin-top: 30px; border-radius: 8px; overflow: hidden; }
.fz-sb__seg { display: block; height: 100%; border-radius: 6px; transform: scaleX(var(--p, 1)); transform-origin: left; }
.fz-sb__seg--net { flex: 41; background: linear-gradient(90deg, #6f8dff, #8f82ff); }
.fz-sb__seg--cost { flex: 47; background: #2f3350; }
.fz-sb__seg--fee { flex: 12; background: #3c2f4d; }
.fz-sb__rows { margin-top: 22px; }
.fz-sb__rows p { display: flex; align-items: center; gap: 11px; margin: 0; padding: 13px 0; border-bottom: 1px solid var(--sb-line); font-size: 15px; color: var(--sb-muted); }
.fz-sb__rows strong { margin-left: auto; color: var(--sb-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.fz-sb__key { width: 9px; height: 9px; border-radius: 3px; }
.fz-sb__key--net { background: #8f82ff; } .fz-sb__key--cost { background: #2f3350; } .fz-sb__key--fee { background: #3c2f4d; }
.fz-sb__net { display: flex; align-items: baseline; gap: 14px; margin-top: 22px; }
.fz-sb__net > span { font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--sb-faint); }
.fz-sb__net strong { font-size: 44px; font-weight: 600; letter-spacing: -.03em; color: #9db4ff; font-variant-numeric: tabular-nums; }
.fz-sb__net em { display: inline-flex; align-items: center; gap: 6px; font-style: normal; font-size: 13.5px; font-weight: 600; color: var(--sb-ok); }
.fz-profit > p svg { color: var(--fz-ok); }
/* The standalone petal sculpture. Its first-visit bloom accompanies the copy entrance; content
   remains visible when animation is unavailable or reduced. */
.fz-heroMarkSlot { position: relative; }
.fz-sculpture { perspective: 600px; overflow: visible; touch-action: pan-y; }
.fz-sculpture__stage { position: absolute; inset: 0; transform-style: preserve-3d; transform: rotateX(25deg) rotateY(-22deg) rotateZ(-12deg); }
.fz-sculpture__petal { position: absolute; inset: 0; transform-style: preserve-3d; }
.fz-sculpture__slice, .fz-sculpture__face { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.fz-sculpture__face { transform: translateZ(0.5px); }
.fz-sculpture__aura { position: absolute; inset: -45%; pointer-events: none; opacity: var(--fz-mark-glow, .34); background: radial-gradient(ellipse 42% 40% at 50% 48%, #8cbaff80, #7654da24 50%, transparent 100%); }
.fz-sculpture::after { content: ''; position: absolute; z-index: -1; width: 62%; height: 12%; left: 19%; bottom: -5%; border-radius: 50%; background: #03061066; filter: blur(9px); pointer-events: none; }
.fz-splashing .fz-hero__copy > :not(.fz-hero__mark), .fz-splashing .fz-hero__stage { animation: fz-rise 650ms cubic-bezier(.16, 1, .3, 1) both; animation-delay: calc(160ms + var(--i, 5) * 70ms); }
@keyframes fz-rise { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }

/* ---------- founders offer band: the price, one screen from the top ---------- */
.fz-band { position: relative; z-index: 2; padding-block: 8px 72px; }
.fz-band__card { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 24px 48px; flex-wrap: wrap; padding: 30px 36px; border: 1px solid var(--fz-line2); border-radius: 22px;
  background: linear-gradient(118deg, #8ea9ff1f, #7f6ae010 42%, transparent 72%), var(--fz-glass), var(--fz-bg2);
  box-shadow: inset 0 1px 0 #d1e2ff26, 0 34px 80px -46px var(--fz-shadow2), 0 0 70px -30px #5a7cdb2b; }
.fz-band__card::after { content: ''; position: absolute; top: -1px; left: 10%; right: 10%; height: 1px; background: linear-gradient(90deg, transparent, #b6d1ff66, transparent); pointer-events: none; }
.fz-band__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; min-width: 0; }
.fz-band__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; font-size: 19px; font-weight: 500; letter-spacing: -.02em; }
.fz-band__price .fz-grad { font-size: 46px; font-weight: 700; letter-spacing: -.045em; line-height: 1; font-variant-numeric: tabular-nums; }
.founders .fz-band__terms { font-size: 13px; }
.fz-band__items { display: grid; gap: 9px; padding-left: 36px; border-left: 1px solid var(--fz-line2); }
.fz-band__items li { display: flex; align-items: center; gap: 9px; font-size: 14px; color: var(--fz-muted); white-space: nowrap; }
.fz-band__items svg { color: var(--fz-ok); flex-shrink: 0; }
.fz-band__ctas { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }

/* ---------- stack: eight tools on one rail ---------- */
.fz-stackband { position: relative; padding: 56px 0; border-block: 1px solid var(--fz-line); background: var(--fz-bg2); overflow: hidden; }
.fz-stackband__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 32px; }
.fz-stackband__line { font-size: 25px; font-weight: 500; letter-spacing: -.025em; line-height: 1.2; margin-top: 16px; max-width: 520px; }
.founders .fz-stackband__more { max-width: 360px; text-align: right; }
.fz-marquee { mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.fz-marquee__track { display: flex; align-items: center; gap: 46px; width: max-content; animation: fz-marquee 86s linear infinite; }
.fz-marquee:hover .fz-marquee__track { animation-play-state: paused; }
@keyframes fz-marquee { to { transform: translateX(calc(-50% - 23px)); } }
/* No pill around the pair: the logo is the object and the name sits beside it. Every mark shares one
   rounded square so a sharp-cornered PNG (Shopify, Amazon, Etsy) matches a rounded one. */
.fz-tile { display: flex; align-items: center; gap: 13px; font-size: 16px; font-weight: 600; letter-spacing: -.01em; color: var(--fz-ink); white-space: nowrap; }
.fz-tile__logo { display: block; width: 42px; height: 42px; border-radius: 12px; overflow: hidden; flex-shrink: 0; }
.fz-tile__logo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fz-tile__logo--plain { background: #f4f6fb; padding: 7px; box-shadow: inset 0 0 0 1px #0b122414; }
.fz-tile__logo--plain img { object-fit: contain; }

/* ---------- the problem: six tabs gather around one hub ---------- */
.fz-tension__layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 64px; align-items: center; }
.fz-tension__copy .fz-h2 { max-width: 520px; }
.fz-statements { margin-top: 32px; border-top: 1px solid var(--fz-line2); }
.fz-statements p { display: flex; align-items: flex-start; gap: 18px; padding: 18px 0; border-bottom: 1px solid var(--fz-line2); font-size: 16px; line-height: 1.5; color: var(--fz-muted); }
.fz-statements p span { color: var(--fz-accent); font-size: 13px; font-weight: 700; letter-spacing: .06em; padding-top: 4px; min-width: 24px; }
.fz-system { height: 480px; }
.fz-system__grid { position: absolute; inset: 0; border-radius: inherit; background-image: radial-gradient(#7da8f42e 1px, transparent 1px); background-size: 22px 22px; mask-image: radial-gradient(ellipse at center, #000 20%, transparent 72%); -webkit-mask-image: radial-gradient(ellipse at center, #000 20%, transparent 72%); }
.fz-system__ring { position: absolute; top: 50%; left: 50%; width: 360px; height: 360px; margin: -180px; border-radius: 50%; border: 1px solid #83a4e324; box-shadow: 0 0 0 60px #83a4e306, 0 0 0 120px #83a4e303; }
.fz-system__wires { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.fz-system__hub { position: absolute; top: 50%; left: 50%; translate: -50% -50%; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 140px; height: 140px; border-radius: 34px; border: 1px solid #aacaff45; background: var(--fz-plate); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); box-shadow: inset 0 1px 0 #dfebff26, 0 20px 60px #0004, 0 0 60px #6f8eff22; }
.fz-system__hub span { font-size: 22px; font-weight: 700; letter-spacing: -.03em; }
.fz-app-node { position: absolute; width: max-content; translate: -50% -50%; z-index: 4; display: flex; align-items: center; gap: 12px; padding: 10px 18px 10px 10px; border: 1px solid var(--fz-line2); background: var(--fz-plate); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-radius: 999px; box-shadow: 0 14px 30px -10px var(--fz-shadow2); font-size: 15px; font-weight: 700; white-space: nowrap; }
.fz-app-node img { width: 30px; height: 30px; object-fit: contain; flex-shrink: 0; }
.fz-system__caption { position: absolute; bottom: 20px; left: 50%; translate: -50% 0; z-index: 5; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--fz-line2); background: var(--fz-plate); color: var(--fz-muted); font-size: 13px; font-weight: 700; white-space: nowrap; }

/* ---------- ask ferza: the product as one window ---------- */
.fz-demo__pills { display: flex; justify-content: center; margin-bottom: 40px; }
.fz-window__persp, .fz-film-perspective { position: relative; perspective: 1600px; }
.fz-window__persp::before { content: ''; position: absolute; inset: 10% 6%; background: #2c61ca2e; filter: blur(90px); border-radius: 50%; }
.fz-window { position: relative; border-radius: 24px; overflow: hidden; border: 1px solid var(--fz-line2); background: var(--fz-bg); box-shadow: 0 50px 120px -30px var(--fz-shadow2), inset 0 1px 0 #d1e2ff14; transform-origin: center top; }
.fz-window__body { display: grid; grid-template-columns: 220px minmax(0, 1fr); }
.fz-window__side { display: flex; flex-direction: column; gap: 4px; padding: 24px 20px; background: var(--fz-bg2); border-right: 1px solid var(--fz-line); color: var(--fz-muted); font-size: 13px; }
.fz-side__new { display: flex; align-items: center; gap: 8px; margin-top: 24px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--fz-line2); color: var(--fz-ink); font-weight: 700; }
.fz-side__label { margin: 24px 0 8px; text-transform: uppercase; font-size: 11px; letter-spacing: .1em; font-weight: 700; }
.fz-side__space { display: flex; align-items: center; gap: 10px; color: var(--fz-ink); font-weight: 700; }
.fz-side__space b { display: grid; place-items: center; width: 34px; height: 34px; background: var(--fz-glass); border: 1px solid var(--fz-line2); border-radius: 10px; font: 700 16px var(--fz-font); color: var(--fz-accent); }
.fz-side__space small { display: block; font-size: 12px; font-weight: 400; color: var(--fz-muted); }
.fz-side__space > svg { margin-left: auto; }
.fz-side__chat { display: flex; gap: 8px; align-items: center; border-radius: 10px; padding: 8px 10px; margin: 0 -10px; font-size: 13px; min-width: 0; }
.fz-side__chat > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.fz-side__chat svg { flex-shrink: 0; }
.fz-side__chat.is-active { background: #7eabff14; color: var(--fz-ink); }
.fz-side__bottom { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: auto; padding-top: 40px; font-size: 12px; font-weight: 700; }
.fz-side__bottom > div { display: flex; gap: 12px; width: 100%; padding-top: 8px; }
.fz-side__bottom img { width: 20px; height: 20px; object-fit: contain; }
.fz-window__main { padding: 24px 32px 28px; min-width: 0; }
.fz-window__top { display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: 700; color: var(--fz-muted); }
.fz-window__top > span { display: flex; align-items: center; gap: 8px; }
.fz-window__top b { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--fz-accent); border: 1px solid var(--fz-line2); border-radius: 999px; padding: 2px 8px; }
.fz-chat { padding: 24px 0 20px; min-height: 440px; animation: fz-content .3s ease-out; }
@keyframes fz-content { from { opacity: .4; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.fz-chat__user { display: inline-flex; align-items: center; gap: 12px; padding: 8px 16px 8px 8px; border: 1px solid var(--fz-line2); background: var(--fz-glass); border-radius: 999px; font-size: 15px; font-weight: 500; margin-bottom: 28px; }
.fz-chat__user > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #3c5890; color: #d8e6ff; font-size: 12px; font-weight: 700; flex-shrink: 0; }
.fz-chat__head { display: flex; gap: 10px; align-items: center; font-size: 15px; font-weight: 700; }
.founders .fz-chat h3 { font-size: 22px; font-weight: 500; line-height: 1.3; letter-spacing: -.02em; margin: 16px 0 8px; max-width: 640px; }
.fz-chat__body { font-size: 15px; line-height: 1.6; color: var(--fz-muted); max-width: 620px; }
.fz-chat__results { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 28px 0 12px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--fz-muted); }
.fz-chat__results > span { font-size: 13px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.fz-results { border: 1px solid var(--fz-line2); background: var(--fz-glass); border-radius: 16px; overflow: hidden; }
.fz-stats { display: flex; gap: 24px; padding: 24px; }
.fz-stats > div { flex: 1; padding-left: 24px; border-left: 1px solid var(--fz-line); }
.fz-stats > div:first-child { border: 0; padding: 0; }
.fz-stats span { font-size: 13px; color: var(--fz-muted); font-weight: 700; }
.fz-stats strong { display: block; font-size: 32px; line-height: 1.1; letter-spacing: -.03em; font-weight: 500; margin-top: 6px; }
.fz-chart { padding: 16px 24px; border-top: 1px solid var(--fz-line); }
.fz-chart__label { display: flex; justify-content: space-between; color: var(--fz-muted); font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.fz-chart__label > span:last-child { display: inline-flex; gap: 8px; align-items: center; }
.fz-chart svg { width: 100%; height: 88px; }
.fz-chart__axes { display: flex; justify-content: space-between; color: var(--fz-muted); font-size: 12px; margin-top: 8px; }
.fz-results--designs { display: flex; gap: 12px; padding: 0; border: 0; background: transparent; }
.fz-results--designs figure { flex: 1; min-width: 0; padding: 8px; background: var(--fz-glass); border: 1px solid var(--fz-line2); border-radius: 16px; }
.fz-results--designs figure > img { width: 100%; height: 168px; object-fit: cover; object-position: top; border-radius: 10px; }
.fz-results--designs figcaption { font-size: 14px; font-weight: 700; margin: 12px 4px 4px; }
.fz-results--designs figcaption span { display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: 500; color: var(--fz-muted); margin-top: 4px; }
.fz-results--profit { display: flex; gap: 40px; align-items: center; padding: 28px; min-height: 240px; }
.fz-profit > strong { display: block; font-size: 64px; font-weight: 500; line-height: 1.1; letter-spacing: -.05em; color: var(--fz-accent); }
.fz-profit > strong span { color: var(--fz-muted); }
.fz-profit > p { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--fz-accent); margin-top: 6px; }
.fz-costs { flex: 1; }
.fz-costs > p { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--fz-line); padding: 12px 0; font-size: 15px; }
.fz-costs > p > span { color: var(--fz-muted); }
.fz-costs strong { font-weight: 700; }
.fz-marginbar { display: flex; gap: 4px; height: 6px; margin-top: 16px; }
.fz-marginbar i { width: 41%; border-radius: 3px; background: var(--fz-accent); }
.fz-marginbar i:nth-child(2) { width: 47%; background: #5c83c650; }
.fz-marginbar i:nth-child(3) { width: 12%; background: var(--fz-line2); }
.fz-composer { display: flex; align-items: center; gap: 12px; border: 1px solid var(--fz-line2); border-radius: 999px; padding: 8px 8px 8px 18px; background: var(--fz-glass); color: var(--fz-muted); font-size: 15px; }
.fz-composer > svg { color: var(--fz-accent); flex-shrink: 0; }
.fz-composer > a { display: grid; place-items: center; height: 40px; width: 40px; margin-left: auto; color: #fff; background: var(--fz-cta); border-radius: 50%; flex-shrink: 0; }
.fz-demo__foot { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 24px; color: var(--fz-muted); font-size: 15px; }
.fz-demo__foot a { display: inline-flex; align-items: center; gap: 8px; color: var(--fz-ink); font-weight: 700; }
.fz-demo__foot a:hover { color: var(--fz-accent); }

/* ---------- the answer: the real recording, framed like the window ---------- */
.fz-film { padding-top: 0; }
.fz-film-proof { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--fz-line2); background: var(--fz-pill); color: var(--fz-muted); font-size: 13px; font-weight: 700; white-space: nowrap; }
.fz-film-window { border-radius: 24px; overflow: hidden; border: 1px solid var(--fz-line2); background: #060912; box-shadow: 0 50px 120px -30px var(--fz-shadow2), 0 0 80px #2158be14; transform-origin: center top; }
.fz-film-window .fz-window__bar { color: var(--fz-ink); }
.fz-film-window video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; background: #080911; }
.fz-chapters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 24px; }
.fz-chapter { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px 20px 24px; border-radius: 20px; border: 1px solid var(--fz-line); background: var(--fz-glass); text-align: left; color: var(--fz-muted); overflow: hidden; transition: border-color .2s, color .2s; }
.fz-chapter:hover:not(:disabled) { border-color: var(--fz-line2); color: var(--fz-ink); }
.fz-chapter.is-active { border-color: var(--fz-line2); color: var(--fz-ink); background: var(--fz-glass), var(--fz-card); }
.fz-chapter:disabled { cursor: default; }
.fz-chapter__n { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--fz-line2); font-size: 13px; font-weight: 700; color: var(--fz-accent); }
.fz-chapter p { font-size: 15px; line-height: 1.5; }
.fz-chapter__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--fz-grad); transform: scaleX(0); transform-origin: left; transition: transform .35s; }
.fz-chapter.is-active .fz-chapter__bar { transform: scaleX(1); }

/* ---------- how it works: the guide holds at left while five real steps pass ---------- */
.fz-work { background: linear-gradient(180deg, var(--fz-bg2), var(--fz-bg)); border-block: 1px solid var(--fz-line); }
/* 05 how it works: one window, five steps. The section is five screens tall; its stage is pinned. */
/* The pin only exists from tablet up, whatever React believes before it has measured the viewport. */
@media (min-width: 960px) {
  .fz-work--pinned { padding-block: 0; height: calc(var(--fz-n, 5) * 100vh + 60vh); }
  .fz-work--pinned .fz-work__stage { position: sticky; top: 0; height: 100vh; display: flex; align-items: center; padding-top: 72px; }
  .fz-work--pinned .fz-work__panels { height: min(76vh, 700px); perspective: 1400px; }
  .fz-work--pinned .fz-panel { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; will-change: transform, opacity, filter; }
}
.fz-work__layout { position: relative; display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 72px; align-items: center; }
.fz-work__side { display: flex; flex-direction: column; align-items: flex-start; }
.fz-work__side .fz-textlink { margin-top: 24px; }
/* the mark stands on its own: no card, no border, just the sculpture and its index */
.fz-work__mark { display: flex; flex-direction: column; align-items: center; gap: 26px; margin-top: 52px; padding-left: 6px; }
.fz-work__index { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.fz-work__count { font-size: 12px; font-variant-numeric: tabular-nums; letter-spacing: .14em; color: var(--fz-muted); }
.fz-workmark__float, .fz-workmark__lean, .fz-workmark__turn, .fz-workmark__kick { position: absolute; inset: 0; transform-style: preserve-3d; }
.fz-workmark__float { animation: fz-float 6s ease-in-out infinite alternate; }
.fz-workmark__lean { animation: fz-lean 7.5s ease-in-out infinite alternate; }
.fz-workmark__turn { animation: fz-turn 9s linear infinite; }
.fz-workmark__kick { animation: fz-kick 1.1s cubic-bezier(.16, 1, .3, 1) 1; }
.fz-workmark__stage { transform: none; }
.fz-workmark__flare { position: absolute; inset: -34%; border-radius: 50%; pointer-events: none; opacity: 0; background: radial-gradient(circle, #a4c6ff70, #7b64f22e 42%, transparent 68%); animation: fz-flare 1s ease-out 1; }
@keyframes fz-float { from { transform: translateY(-6px); } to { transform: translateY(6px); } }
@keyframes fz-lean { from { transform: rotateX(26deg) rotateY(-24deg); } to { transform: rotateX(18deg) rotateY(24deg); } }
@keyframes fz-turn { from { transform: rotateZ(0); } to { transform: rotateZ(360deg); } }
@keyframes fz-kick { from { transform: rotateZ(0); } to { transform: rotateZ(360deg); } }
@keyframes fz-flare { 0% { opacity: 0; transform: scale(.6); } 25% { opacity: .9; } 100% { opacity: 0; transform: scale(1.35); } }
/* the window at right: the panels stack and pass through it */
.fz-work__panels { position: relative; list-style: none; margin: 0; padding: 0; }
.fz-work:not(.fz-work--pinned) .fz-work__panels { display: flex; flex-direction: column; gap: 56px; }
.fz-panel { position: relative; }
.fz-panel__ghost { position: absolute; top: -.28em; right: -.04em; font-size: clamp(160px, 17vw, 250px); font-weight: 700; letter-spacing: -.06em; line-height: 1; color: transparent; background: linear-gradient(180deg, #9fc3ff, #7273f3 55%, transparent 95%); -webkit-background-clip: text; background-clip: text; opacity: .075; pointer-events: none; user-select: none; }
.fz-panel__frame { position: relative; margin: 0; padding: 10px; border-radius: 24px; overflow: hidden; background: linear-gradient(145deg, #93b8ff12, #7b87eb04), var(--fz-glass), var(--fz-bg2); }
.fz-panel__frame .fz-stepfilm, .fz-panel__frame .fz-shotimg { border-radius: 16px; overflow: hidden; }
.fz-panel__frame .fz-fan, .fz-panel__frame .fz-tiles, .fz-panel__frame .fz-stackshots { padding: 24px; }
.fz-panel__copy { margin-top: 22px; }
.fz-work__progress { position: absolute; right: -36px; top: 6%; bottom: 6%; width: 2px; border-radius: 2px; background: var(--fz-line); overflow: hidden; }
.fz-work__progress i { display: block; width: 100%; height: 100%; transform-origin: top; background: linear-gradient(180deg, #9dc0ff, #8b5cf6); }
.fz-work__step { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--fz-accent); }
.fz-rail { display: flex; gap: 6px; }
.fz-rail i { width: 6px; height: 6px; border-radius: 6px; background: var(--fz-line2); transition: width .3s, background .3s; }
.fz-rail i[data-on='1'] { width: 28px; background: var(--fz-accent); }
.fz-step__head { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.fz-step__n { font-size: 38px; font-weight: 500; letter-spacing: -.04em; line-height: 1; }
.fz-step__partner { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; padding: 6px 12px 6px 6px; border-radius: 999px; border: 1px solid var(--fz-line); color: var(--fz-muted); font-size: 13px; font-weight: 700; white-space: nowrap; }
.fz-step__partner img { width: 22px; height: 22px; object-fit: contain; }
.fz-panel .fz-h3 { font-size: 24px; }
.fz-panel .fz-body { margin-top: 12px; color: var(--fz-muted); max-width: 560px; }
.fz-shotimg { width: 100%; border-radius: 12px; overflow: hidden; box-shadow: 0 14px 34px -10px var(--fz-shadow2); }
.fz-shotimg img { width: 100%; height: auto; }
.fz-stepfilm video { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; background: var(--fz-bg2); }
.fz-stackshots { width: 100%; display: flex; flex-direction: column; gap: 12px; }
.fz-fan { display: flex; align-items: center; padding: 8px 0; }
.fz-fan img { width: 160px; height: auto; border-radius: 14px; box-shadow: 0 20px 40px -10px #0006; }
.fz-tiles { display: flex; align-items: center; gap: 12px; justify-content: center; width: 100%; }
.fz-tiles img { width: min(18%, 96px); height: auto; border-radius: 10px; box-shadow: 0 14px 28px -8px #0005; }
.fz-tiles img:nth-child(2n) { transform: translateY(-16px); }

/* ---------- built around you ---------- */
.fz-principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.fz-principle { padding: 28px; transition: border-color .25s; }
.fz-principle:hover { border-color: var(--fz-accent); }
.fz-principle__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; color: #fff; background: var(--fz-cta); box-shadow: 0 10px 24px -10px #7273f3aa; }
.fz-principle__n { display: none; }
.founders .fz-principle .fz-h3 { font-size: 20px; margin: 24px 0 12px; }
.fz-principle .fz-body { color: var(--fz-muted); }

/* ---------- the offer ---------- */
.fz-offer { background: linear-gradient(180deg, var(--fz-bg), var(--fz-bg2)); border-block: 1px solid var(--fz-line); }
.fz-offer__halo { position: absolute; z-index: 0; width: 900px; height: 900px; left: -260px; top: -80px; border-radius: 50%; border: 1px solid #8cb5ff1a; box-shadow: 0 0 0 80px #8cb5ff05, 0 0 0 160px #8cb5ff03; background: radial-gradient(circle at 60% 40%, #356ddb1c, transparent 60%); pointer-events: none; }
.fz-offer__layout { display: grid; grid-template-columns: minmax(0, 1fr) 424px; align-items: center; gap: 80px; }
.fz-offer__layout > * { min-width: 0; }
.fz-offer__copy { max-width: 560px; }
.fz-offer__sig { display: flex; align-items: center; gap: 14px; color: var(--fz-muted); font-size: 14px; line-height: 1.5; margin-top: 32px; }
.fz-offer__sig span { max-width: 280px; padding-left: 16px; border-left: 1px solid var(--fz-line2); }
.fz-offercard { position: relative; padding: 28px; border-radius: 28px; border: 1px solid #b0ccff4d; background: var(--fz-glass), var(--fz-card); backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px); box-shadow: inset 0 1px 0 #d9e6ff14, 0 50px 120px -30px var(--fz-shadow2); }
.fz-offercard::before { content: ''; position: absolute; top: -1px; left: 20%; width: 60%; height: 1px; background: linear-gradient(90deg, transparent, #bfd8ff, transparent); box-shadow: 0 0 16px #7dacff; }
.fz-offercard__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.fz-offercard__plan { font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.founders .fz-offercard__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; margin-top: 24px; }
.fz-offercard__price > .fz-grad { font-size: 88px; line-height: 1; font-weight: 500; letter-spacing: -.05em; }
.fz-offercard__period { color: var(--fz-muted); font-size: 16px; max-width: 150px; line-height: 1.4; font-weight: 500; }
.fz-offercard .fz-body { margin-top: 12px; font-size: 15px; }
.fz-offercard__rule { height: 1px; background: var(--fz-line2); margin: 24px 0 20px; }
.founders .fz-offercard__items { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.fz-offercard__items li { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; }
.fz-offercard__items svg { color: var(--fz-accent); flex-shrink: 0; }
.fz-offercard__ctas { display: flex; flex-direction: column; gap: 8px; margin-top: 28px; }
.fz-offercard__ctas .fz-btn { width: 100%; }
.founders .fz-offercard__terms { text-align: center; margin-top: 16px; }
.founders .fz-offercard__micro { text-align: center; margin-top: 4px; font-size: 13px; }

/* ---------- good questions ---------- */
.fz-faq__layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; align-items: start; }
.fz-faq__layout .fz-h2 { max-width: 420px; font-size: clamp(32px, 3.2vw, 42px); }
.fz-faq__list { border-top: 1px solid var(--fz-line2); }
.fz-faq__list details { border-bottom: 1px solid var(--fz-line2); }
.fz-faq__list summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 21px 0; font-size: 16px; font-weight: 500; letter-spacing: -.01em; cursor: pointer; list-style: none; }
.fz-faq__list summary::-webkit-details-marker { display: none; }
.fz-faq__list summary > svg { flex-shrink: 0; color: var(--fz-muted); transition: transform .25s; }
.fz-faq__list details[open] summary > svg { transform: rotate(45deg); }
.fz-faq__list details > p { color: var(--fz-muted); padding: 0 40px 24px 0; max-width: 640px; }

/* ---------- footer, dock ---------- */
.fz-footer { position: relative; border-top: 1px solid var(--fz-line); background: var(--fz-bg2); }
.fz-footer__top { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 32px; border-bottom: 1px solid var(--fz-line); }
.fz-footer__top p { font-size: 15px; }
.fz-footer__bottom { display: flex; align-items: center; gap: 24px; color: var(--fz-muted); font-size: 13px; padding-block: 24px; }
.fz-footer__ever { display: inline-flex; align-items: center; gap: 8px; }
.fz-footer__spacer { flex: 1; }
.fz-footer__bottom > a { color: var(--fz-ink); font-weight: 700; }
.fz-dock { display: none; }

/* ---------- optical finish and the shared scroll atmosphere ---------- */
.founders::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: repeating-linear-gradient(90deg, transparent 0, transparent calc(25% - 1px), #8db5ff05 calc(25% - 1px), #8db5ff05 25%); }
.fz-atmosphere { position: absolute; inset: 0; overflow: clip; pointer-events: none; z-index: 0; }
.fz-atmosphere__field { position: absolute; width: 1100px; height: 680px; top: 10%; left: 50%; margin-left: -550px; border: 1px solid #85abfb14; border-radius: 50%; rotate: -18deg; }
.fz-atmosphere__field::before, .fz-atmosphere__field::after { content: ''; position: absolute; inset: 36px; border: 1px solid #85abfb0b; border-radius: inherit; }
.fz-atmosphere__field::after { inset: -50px; border-style: dashed; border-color: #85abfb0b; }
.fz-atmosphere__field i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #a5caff; box-shadow: 0 0 14px 3px #6398ff66; top: 14%; left: 15%; }
.fz-atmosphere__field i:nth-child(2) { top: 81%; left: 89%; width: 3px; height: 3px; }
.fz-atmosphere__field i:nth-child(3) { top: 5%; left: 74%; opacity: .45; }
.fz-atmosphere__light { position: absolute; width: 900px; height: 520px; left: 50%; top: 5%; margin-left: -450px; background: radial-gradient(ellipse, #376fdb16, transparent 66%); }
.fz-atmosphere--hero .fz-atmosphere__field { top: -60px; width: 1520px; height: 850px; margin-left: -760px; rotate: -12deg; border-color: #94b7ff1c; box-shadow: 0 -1px 0 #a5caff09, 0 -22px 70px -40px #7aa9ff38; }
.fz-atmosphere--hero .fz-atmosphere__field::before { inset: 72px; border-color: #7bacff0c; }
.fz-atmosphere--hero .fz-atmosphere__field::after { inset: -100px; border-style: solid; }
/* Full-width illumination, with every glow ending inside its layer. The additional elliptical
   mask makes the outer pixels transparent at every viewport size and parallax position. */
.fz-atmosphere--hero .fz-atmosphere__light { width: auto; height: auto; left: -20%; right: -20%; top: -360px; bottom: 0; margin: 0; border-radius: 50%; background: radial-gradient(ellipse 38% 26% at 50% 28%, #527ee94d, #32559c26 48%, transparent 100%), radial-gradient(ellipse 25% 24% at 68% 39%, #6953bb20, transparent 100%); mask-image: radial-gradient(ellipse closest-side, #000 58%, transparent 100%); -webkit-mask-image: radial-gradient(ellipse closest-side, #000 58%, transparent 100%); }
.fz-atmosphere--portal .fz-atmosphere__field { top: 200px; rotate: 12deg; width: 1420px; height: 820px; margin-left: -710px; }
.fz-atmosphere--quiet .fz-atmosphere__field { left: 0; opacity: .4; }
.fz-atmosphere--quiet .fz-atmosphere__light { left: 0; opacity: .6; }
.fz-atmosphere--workflow .fz-atmosphere__field { left: 18%; top: 100px; width: 850px; height: 850px; margin-left: -425px; }
.fz-atmosphere--workflow .fz-atmosphere__light { left: 18%; height: 1500px; }
.fz-atmosphere--offer .fz-atmosphere__field { left: 75%; top: 0; rotate: 24deg; }
.fz-atmosphere--offer .fz-atmosphere__light { left: 75%; background: radial-gradient(ellipse, #5575ee25, transparent 65%); }
[data-theme='light'] .fz-atmosphere { opacity: .6; }
.fz-section:not(.fz-film)::before { content: ''; position: absolute; top: 0; left: 15%; right: 15%; height: 1px; background: linear-gradient(90deg, transparent, var(--fz-line2), transparent); }
.fz-label b { font-variant-numeric: tabular-nums; font-size: 11px; padding: 5px 8px; border: 1px solid var(--fz-line2); border-radius: 6px; background: var(--fz-pill); }
.fz-nav__links a { position: relative; }
.fz-nav__links a::after { content: ''; position: absolute; bottom: -10px; left: 0; right: 0; height: 1px; background: var(--fz-accent); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
.fz-nav__links a:hover::after { transform: scaleX(1); }
.fz-btn--primary { border: 1px solid #b8d0ff4d; box-shadow: inset 0 1px 1px #fff4, inset 0 -2px 5px #1e266636, 0 4px 8px #0003, 0 0 24px -8px #5f85f578; }
.founders .fz-btn--primary { color: #fff; }
.fz-btn--primary:hover { box-shadow: inset 0 1px 1px #fff6, 0 6px 14px #0003, 0 0 36px -8px #7799ff99; }
.fz-btn--ghost { background: linear-gradient(150deg, #a7c7ff0c, #a7c7ff02); box-shadow: inset 0 1px 0 #b1ceff0a; }
.fz-btn:active { transform: translateY(1px); }
.fz-hero { padding-top: 112px; padding-bottom: 40px; }
.fz-hero__bg { background: radial-gradient(ellipse 42% 30% at 50% 15%, #345daf16, transparent 100%); }
.fz-hero__mark { position: relative; margin-bottom: 24px; filter: drop-shadow(0 16px 11px #03071580) drop-shadow(0 0 20px #738eee40); }
.fz-h1 { font-size: clamp(52px, 5.3vw, 76px); font-weight: 700; letter-spacing: -.05em; line-height: 1.03; }
.fz-hero__sub { max-width: 620px; margin-top: 26px; color: #a4b3ce; }
[data-theme='light'] .fz-hero__sub { color: var(--fz-muted); }
.fz-hero__actions { margin-top: 32px; }
.fz-hero__stage { margin-top: 56px; }
.fz-hero__stage::before { content: ''; position: absolute; top: -70px; left: 8%; right: 8%; height: 200px; border-radius: 50%; background: radial-gradient(ellipse, #7492ff2a, transparent 68%); pointer-events: none; }
.fz-hero__persp { mask-image: none; -webkit-mask-image: none; }
.fz-shot { border-radius: 22px; border-color: #99bdff42; box-shadow: 0 2px 2px #0005, 0 48px 100px -42px #000b, 0 0 90px -24px #5a7cdb29; }
[data-theme='light'] .fz-shot { box-shadow: 0 40px 90px -38px #3655934d, 0 0 60px -20px #789eef1a; }
.fz-shot::after { content: ''; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; box-shadow: inset 0 1px 0 #d8e8ff66, inset 1px 0 0 #d8e8ff0c; }
.fz-hero__motion { display: flex; justify-content: flex-end; margin-top: 18px; }
.fz-motion-toggle { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 12px; color: var(--fz-muted); border: 1px solid var(--fz-line); border-radius: 999px; font-size: 12px; white-space: nowrap; }
.fz-motion-toggle:hover { color: var(--fz-ink); border-color: var(--fz-line2); background: var(--fz-pill); }
.fz-stackband { background: linear-gradient(180deg, var(--fz-bg), var(--fz-bg2)); }
.fz-frame { background: linear-gradient(140deg, #a4c6ff0d, transparent 40%), var(--fz-glass), var(--fz-bg2); box-shadow: inset 0 1px 0 #d1e2ff24, inset 1px 0 0 #d1e2ff08, 0 30px 70px -35px var(--fz-shadow2); }
.fz-frame::after { content: ''; position: absolute; top: -1px; left: 12%; right: 12%; height: 1px; background: linear-gradient(90deg, transparent, #b6d1ff60, transparent); pointer-events: none; }
.fz-window, .fz-film-window { border-color: #8ab2ff3d; box-shadow: inset 0 1px 0 #dbebff33, 0 30px 80px -25px var(--fz-shadow2), 0 0 70px -25px #356adb1f; }
.fz-window__bar { background: linear-gradient(110deg, #b3ceff0c, transparent 65%); }
.fz-window__dots i { width: 8px; height: 8px; background: #9dafcf42; }
.fz-window__dots i:first-child { background: #96b8fa6b; }
.fz-window__badge { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; border-radius: 6px; }
.fz-pills { padding: 6px; }
.fz-pills button.is-active { background: linear-gradient(130deg, #9cbdff19, #768cdd0f), var(--fz-bg2); box-shadow: inset 0 1px 0 #d5e5ff25, 0 2px 6px #0003; }
.fz-step__n { color: var(--fz-muted); font-variant-numeric: tabular-nums; transition: color .4s; }
.fz-panel[data-active='true'] .fz-step__n { color: var(--fz-accent); text-shadow: 0 0 28px #729bfa35; }
.fz-panel__frame { transition: border-color .4s, box-shadow .4s; }
.fz-panel[data-active='true'] .fz-panel__frame { border-color: #a0c1ff66; box-shadow: inset 0 1px 0 #d4e5ff33, 0 25px 70px -40px #417bd35c; }
.fz-principles { gap: 20px; padding-block: 20px; }
.fz-principle { min-height: 256px; overflow: hidden; }
.fz-principle::before { content: ''; position: absolute; width: 200px; height: 200px; top: -60px; right: -60px; background: radial-gradient(circle, #6e87e612, transparent 65%); pointer-events: none; }
.fz-principle__icon { width: 52px; height: 52px; background: linear-gradient(140deg, #8aafff22, #566ad613); color: var(--fz-accent); border: 1px solid #9dbbff3a; box-shadow: inset 0 1px 0 #d5e4ff28, 0 8px 22px -12px #778bff5c; }
.fz-principle__n { display: block; position: absolute; top: 34px; right: 28px; font-size: 12px; letter-spacing: .12em; color: var(--fz-muted); opacity: .6; }
.fz-offercard { background: radial-gradient(ellipse at 80% 0, #769bf522, transparent 60%), var(--fz-glass), var(--fz-card); }
.fz-offercard__price > .fz-grad { font-size: 84px; }
.fz-faq__mark { display: inline-grid; place-items: center; position: relative; width: 210px; height: 210px; margin: 48px 0 0 16px; opacity: .35; }
.fz-faq__mark::before, .fz-faq__mark::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 1px solid var(--fz-line2); }
.fz-faq__mark::after { inset: -20px; border-style: dashed; opacity: .5; }
.fz-faq__list details { padding-inline: 20px; border: 1px solid var(--fz-line); border-radius: 14px; margin-bottom: 10px; background: linear-gradient(120deg, var(--fz-pill), transparent); transition: border-color .2s, background .2s; }
.fz-faq__list { border-top: 0; }
.fz-faq__list details:hover, .fz-faq__list details[open] { border-color: var(--fz-line2); background: var(--fz-glass); }
.fz-faq__list summary { font-size: 16px; }
.fz-faq__list summary > svg { width: 18px; height: 18px; }
.fz-footer { overflow: clip; background: radial-gradient(ellipse at 50% 0, #426dcc14, transparent 68%), var(--fz-bg2); }
.fz-footer__signature { width: min(860px, 76%); margin: 56px auto 20px; opacity: .07; pointer-events: none; }
.fz-footer__signature img { width: 100%; height: auto; }
.fz-footer__top, .fz-footer__bottom { position: relative; }
.fz-footer__bottom { gap: 20px; }
.founders[data-motion='off'] *, .founders[data-motion='off'] *::before, .founders[data-motion='off'] *::after { animation: none !important; transition: none !important; }
/* A stationary target with magnetic lettering and a localized glass highlight. */
.fz-magnetic { position: relative; isolation: isolate; overflow: hidden; }
.fz-magnetic__content { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 10px; }
.fz-magnetic__light { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; }
.fz-footer__cta { min-height: 44px; margin: -10px -14px; padding: 10px 14px; border-radius: 12px; font-size: 17px; }
.fz-footer__cta .fz-magnetic__content::after { content: ''; position: absolute; height: 1px; left: 0; right: 0; bottom: -5px; background: var(--fz-grad); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
.fz-footer__cta:hover .fz-magnetic__content::after, .fz-footer__cta:focus-visible .fz-magnetic__content::after { transform: scaleX(1); }

@media (hover: hover) and (pointer: fine) {
  .fz-principle:hover { border-color: #abc9ff6b; box-shadow: inset 0 1px 0 #e3efff40, 0 20px 50px -25px #436dc93b; }
  .fz-faq__list summary:hover { color: var(--fz-accent); }
}

/* ---------- responsive ---------- */
@media (min-width: 960px) and (max-width: 1199px) {
  .fz-system__hub { width: 112px; height: 112px; border-radius: 28px; }
  .fz-system__hub svg { width: 60px; height: 60px; }
  .fz-app-node { font-size: 13px; gap: 8px; padding: 8px 12px 8px 8px; }
  .fz-app-node img { width: 26px; height: 26px; }
}
@media (max-width: 1199px) {
  .fz-container { width: min(1056px, calc(100% - 96px)); }
  .fz-nav__inner { width: min(1056px, calc(100% - 96px)); }
  .fz-nav__links { gap: 24px; }
  .fz-nav__actions { gap: 12px; }
  .fz-h1 { font-size: 64px; }
  .fz-tension__layout { gap: 56px; }
  .fz-system { height: 440px; }
  .fz-window__body { grid-template-columns: 220px minmax(0, 1fr); }
  .fz-window__main { padding-inline: 28px; }
  .fz-work__layout { gap: 64px; }
  .fz-fan img { width: 140px; }
  .fz-offer__layout { grid-template-columns: minmax(0, 1fr) 400px; gap: 48px; }
  .fz-band__card { padding: 28px 30px; gap: 22px 36px; }
  .fz-band__items { display: none; }
}
@media (max-width: 959px) {
  .fz-container { width: calc(100% - 80px); }
  .fz-section { padding-block: 84px; }
  .fz-nav__badge { display: none; }
  .fz-nav__cta--try { display: none; }
  .fz-nav__inner { width: calc(100% - 80px); }
  .fz-nav__links { gap: 20px; }
  .fz-nav__links a { font-size: 14px; }
  .fz-hero { padding-top: 112px; }
  .fz-h1 { font-size: 54px; }
  .fz-band { padding-bottom: 56px; }
  .fz-band__card { align-items: flex-start; }
  .fz-band__ctas { width: 100%; }
  .fz-hero__sub { font-size: 18px; }
  .fz-hero__stage { margin-top: 56px; }
  .fz-hero { padding-bottom: 32px; }
  .fz-atmosphere--hero .fz-atmosphere__field { width: 1100px; margin-left: -550px; }
  .fz-head { grid-template-columns: 1fr; gap: 20px; margin-bottom: 48px; }
  .fz-head > .fz-lede { padding-bottom: 0; }
  .fz-head__aside { justify-self: start; padding-bottom: 0; }
  .fz-stackband__head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .founders .fz-stackband__more { text-align: left; }
  .fz-tension__layout { grid-template-columns: 1fr; gap: 48px; }
  .fz-system { height: 420px; }
  .fz-app-node { font-size: 14px; padding: 8px 14px 8px 8px; }
  .fz-app-node img { width: 26px; height: 26px; }
  .fz-window__body { grid-template-columns: 190px minmax(0, 1fr); }
  .fz-window__side { padding-inline: 14px; }
  .fz-window__main { padding-inline: 20px; }
  .founders .fz-chat h3 { font-size: 22px; }
  .fz-stats strong { font-size: 30px; }
  .fz-profit > strong { font-size: 56px; }
  .fz-chapters { grid-template-columns: 1fr 1fr; }
  .fz-work__layout { grid-template-columns: 1fr; gap: 40px; }
  .fz-work__mark { display: none; }
  .fz-panel__ghost { display: none; }
  .fz-principles { grid-template-columns: 1fr; gap: 12px; }
  .fz-principle { min-height: 0; }
  .fz-offer__layout { grid-template-columns: 1fr; gap: 48px; }
  .fz-offercard { max-width: 520px; }
  .fz-faq__layout { grid-template-columns: 1fr; gap: 32px; }
  .fz-faq__mark { display: none; }
  .fz-footer__bottom { flex-wrap: wrap; }
}
@media (max-width: 767px) {
  .fz-container { width: calc(100% - 48px); }
  .fz-section { padding-block: 68px; }
  .fz-nav { height: 60px; }
  .fz-nav__inner { width: calc(100% - 48px); gap: 10px; }
  .fz-nav__links { display: none; position: absolute; top: calc(100% + 6px); left: 20px; right: 20px; padding: 12px 20px; background: var(--fz-card); border: 1px solid var(--fz-line2); border-radius: 16px; box-shadow: 0 18px 35px #0004; }
  .fz-nav__links a::after { display: none; }
  .fz-nav__links.is-open { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .fz-nav__links a { padding: 14px 4px; font-size: 16px; }
  .fz-nav__badge { display: inline-flex; }
  .fz-nav__menu { display: inline-grid; }
  .fz-nav__actions { gap: 8px; }
  .fz-nav__cta { min-height: 36px; padding-inline: 14px; font-size: 13px; }
  .fz-nav__cta-wide { display: none; }
  .fz-nav__cta-tight { display: inline; }
  .fz-hero { padding-top: 96px; }
  .fz-hero__mark { margin-bottom: 24px; }
  .fz-h1 { font-size: clamp(30px, 8vw, 46px); letter-spacing: -.035em; }
  .fz-hero__sub { font-size: 16px; margin-top: 20px; }
  .fz-hero__actions { flex-direction: column; width: 100%; margin-top: 28px; gap: 16px; }
  .fz-hero__actions .fz-btn { width: 100%; }
  .fz-hero__offer { text-align: center; text-wrap: balance; }
  .fz-hero__stage { margin-top: 40px; }
  .fz-hero__persp { mask-image: none; -webkit-mask-image: none; }
  .fz-shot { border-radius: 16px; }
  .fz-atmosphere__field { width: 740px; height: 580px; margin-left: -370px; }
  .fz-atmosphere--hero .fz-atmosphere__field { width: 800px; height: 630px; margin-left: -400px; top: -10px; rotate: -20deg; }
  .fz-atmosphere--hero .fz-atmosphere__light { opacity: .8; }
  .fz-hero__motion { margin-top: 12px; }
  .founders .fz-h2 { font-size: clamp(30px, 7.6vw, 40px); }
  .founders .fz-h2--xl { font-size: clamp(36px, 9vw, 46px); }
  .founders .fz-lede { font-size: 16px; }
  .fz-body { font-size: 16px; }
  .fz-h3 { font-size: 20px; }
  .fz-head { margin-bottom: 32px; }
  .fz-band { padding-bottom: 44px; }
  .fz-band__card { flex-direction: column; align-items: stretch; padding: 24px 22px; border-radius: 20px; gap: 20px; }
  .fz-band__price .fz-grad { font-size: 40px; }
  .fz-band__ctas .fz-btn { width: 100%; }
  .fz-stackband { padding-block: 40px; }
  .fz-stackband__line { font-size: 22px; }
  .fz-tile { font-size: 15px; gap: 11px; }
  .fz-tile__logo { width: 36px; height: 36px; border-radius: 10px; }
  .fz-statements p { font-size: 16px; padding: 16px 0; }
  .fz-system { height: 380px; border-radius: 20px; }
  .fz-system__hub { width: 88px; height: 100px; border-radius: 26px; }
  .fz-system__hub svg { width: 54px; height: 54px; }
  .fz-system__hub span { font-size: 18px; }
  .fz-system__ring { width: 240px; height: 240px; margin: -120px; }
  .fz-app-node { font-size: 12px; padding: 6px 10px 6px 6px; gap: 6px; }
  .fz-app-node img { width: 22px; height: 22px; }
  .fz-demo__pills { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; margin-inline: -20px; padding-inline: 20px; }
  .fz-demo__pills::-webkit-scrollbar { display: none; }
  .fz-pills button { min-height: 40px; padding: 0 16px; font-size: 14px; }
  .fz-pills { flex-shrink: 0; max-width: none; }
  .fz-window { border-radius: 16px; }
  .fz-window__bar { height: 44px; padding-inline: 14px; font-size: 12px; }
  .fz-window__bar > span:nth-child(2) { display: block; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .fz-window__bar > span:nth-child(2) > :is(.fz-dot, svg) { display: inline-block; margin-right: 8px; vertical-align: middle; }
  .fz-window__body { display: block; }
  .fz-window__side { display: none; }
  .fz-window__main { padding: 20px 16px; }
  .fz-window__dots { display: none !important; }
  .fz-chat { min-height: 0; padding-top: 20px; }
  .fz-chat__user { font-size: 14px; }
  .founders .fz-chat h3 { font-size: 20px; }
  .fz-chat__body { font-size: 15px; }
  .fz-stats { gap: 12px; padding: 16px 14px; }
  .fz-stats > div { padding-left: 12px; }
  .fz-stats strong { font-size: 24px; }
  .fz-stats span { font-size: 12px; }
  .fz-chart { padding: 12px 14px 14px; }
  .fz-results--designs { gap: 8px; }
  .fz-results--designs figure { padding: 6px; }
  .fz-results--designs figure > img { height: 120px; }
  .fz-results--designs figcaption { font-size: 12px; }
  .fz-results--designs figcaption span { font-size: 11px; }
  .fz-results--profit { flex-direction: column; align-items: stretch; gap: 20px; padding: 20px 16px; min-height: 0; }
  .fz-profit > strong { font-size: 56px; }
  .fz-composer { font-size: 14px; }
  .fz-demo__foot { flex-direction: column; align-items: flex-start; gap: 8px; font-size: 14px; }
  .fz-film-window { border-radius: 16px; }
  .fz-chapters { grid-template-columns: 1fr; gap: 8px; margin-top: 20px; }
  .fz-chapter { flex-direction: row; align-items: flex-start; padding: 16px; gap: 14px; }
  .fz-chapter p { font-size: 14px; }
  .fz-work:not(.fz-work--pinned) .fz-work__panels { gap: 40px; }
  .fz-step__head { flex-wrap: wrap; gap: 12px; }
  .fz-step__n { font-size: 32px; }
  .fz-step__partner { margin-left: 0; }
  .fz-panel__frame { padding: 8px; border-radius: 16px; }
  .fz-panel .fz-h3 { font-size: 20px; }
  .fz-fan img { width: 104px; }
  .fz-principle { padding: 24px; border-radius: 20px; }
  .founders .fz-principle .fz-h3 { margin-top: 24px; }
  .fz-offercard { padding: 22px; border-radius: 24px; }
  .fz-offercard__price > .fz-grad { font-size: 72px; }
  .fz-offercard__period { font-size: 15px; }
  .founders .fz-offercard__items { grid-template-columns: 1fr; }
  .fz-offer__sig { margin-top: 28px; }
  .fz-faq__list summary { font-size: 16px; padding-block: 20px; }
  .fz-faq__list details { padding-inline: 16px; }
  .fz-faq__list details > p { padding-right: 0; }
  .fz-footer { padding-bottom: 80px; }
  .fz-footer__signature { margin-top: 44px; margin-bottom: 8px; }
  .fz-footer__top { flex-wrap: wrap; padding-block: 32px; gap: 20px; }
  .fz-footer__top p { width: 100%; order: 3; }
  .fz-footer__bottom { flex-wrap: wrap; gap: 12px; }
  .fz-footer__spacer { display: none; }
  .fz-dock { display: block; position: fixed; bottom: 0; left: 0; right: 0; z-index: 60; padding: 10px 20px calc(10px + env(safe-area-inset-bottom)); background: var(--fz-plate); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); border-top: 1px solid var(--fz-line2); transition: transform .3s; }
  .fz-dock[data-on='0'] { transform: translateY(115%); }
  .fz-dock .fz-btn { width: 100%; min-height: 44px; }
}
@media (max-width: 374px) {
  .fz-container { width: calc(100% - 32px); }
  .fz-nav__brand .fz-lockup { gap: 5px; }
  .fz-nav__brand .fz-lockup > svg { width: 26px; }
  .fz-nav__cta { padding-inline: 10px; }
  .fz-offercard .fz-btn { font-size: 14px; padding-inline: 12px; }
  .fz-offercard .fz-badge { font-size: 10px; padding-inline: 8px; }
  .fz-hero__offer { font-size: 13px; text-wrap: balance; }
  .fz-h1 { font-size: clamp(26px, 8vw, 30px); }
  .fz-offercard__price > .fz-grad { font-size: 64px; }
}
@media (prefers-reduced-motion: reduce) {
  .fz-journey-petal__spin { animation: none; }
  .fz-channel-switch > button[aria-selected='true']::after { animation: none; transform: scaleX(1); }
  html:has(#founders) { scroll-behavior: auto; }
  .founders *, .founders *::before, .founders *::after { animation: none !important; transition: none !important; }
  .fz-marquee { overflow-x: auto; mask-image: none; -webkit-mask-image: none; }
  /* it cannot scroll, so it wraps into a static grid of the first twelve */
  .fz-marquee__track { width: auto; flex-wrap: wrap; justify-content: center; gap: 26px 30px; padding-inline: 20px; }
  .fz-marquee__track .fz-tile:nth-child(n+13) { display: none; }
}

/* Product story, September 2026. The original glass, palette and typography
   remain the visual system; story motion lives in StoryMotion.jsx. */
.fz-story { --fz-muted: #a0aec6; --fz-story-rule: #9ab8ed24; }
.fz-story .fz-container { width: min(1040px, calc(100% - 128px)); }
.fz-story .fz-nav__inner { width: min(1160px, calc(100% - 96px)); }
.fz-story .fz-nav { z-index: 50; }
.fz-story .fz-btn--primary { background: linear-gradient(115deg, #3868cb, #6255ca 80%); }
.fz-story .fz-btn { min-height: 46px; font-size: 14px; }
.fz-story .fz-h2 { font-size: clamp(32px, 3.35vw, 46px); font-weight: 500; letter-spacing: -.045em; line-height: 1.12; margin-top: 0; }
.fz-story .fz-lede { color: var(--fz-muted); font-size: 16px; line-height: 1.65; max-width: 550px; margin-top: 20px; }
.fz-story p { text-wrap: pretty; }
.fz-story-title > span { display: block; }
.fz-story-section { position: relative; padding-block: clamp(72px, 7.5vw, 108px); }
.fz-story-section > .fz-container { position: relative; z-index: 2; }
.fz-story-section::before { content: ''; position: absolute; top: 0; left: 12%; right: 12%; height: 1px; background: linear-gradient(90deg, transparent, var(--fz-story-rule), transparent); }
.fz-enter { min-width: 0; }
.fz-enter__content { height: 100%; }
.fz-story:not([data-story-ready]) [data-story-reveal], .fz-story[data-motion='off'] [data-story-reveal], .fz-enter:focus-within > [data-story-reveal] { opacity: 1 !important; transform: none !important; }
.fz-overline { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--fz-muted); }
.fz-example-label { font-size: 10px; letter-spacing: .09em; text-transform: uppercase; color: #a4b5d2; white-space: nowrap; }
.fz-story .fz-atmosphere { z-index: 0; opacity: .55; }
.fz-journey-petal { position: fixed; left: 0; top: 0; width: 128px; height: 128px; margin: -64px 0 0 -64px; z-index: 4; pointer-events: none; transform-origin: center; }
/* The journey is decorative and never intercepts a link or gesture. */
.fz-journey-petal__spin { display: block; width: 100%; height: 100%; transform-origin: center; animation: fz-turn 24s linear infinite; }
.fz-journey-petal__spin > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.fz-story[data-journey-ready='true'] .fz-petal-home img { visibility: hidden; }
.fz-petal-home { display: block; width: 116px; height: 116px; margin: 0 auto 18px; }
.fz-petal-waypoint { position: absolute; top: 43%; right: max(12px, calc((100vw - 1240px) / 2)); width: 64px; height: 64px; pointer-events: none; }
.fz-vision-hero { padding-top: 100px; padding-bottom: 64px; }
.fz-vision-hero__type { display: flex; flex-direction: column; align-items: center; }
.fz-story .fz-h1 { font-size: clamp(50px, 5.4vw, 76px); font-weight: 500; line-height: 1.04; letter-spacing: -.055em; }
.fz-story .fz-heritage { display: flex; align-items: center; justify-content: center; gap: 9px; margin-bottom: 25px; font-size: 12px; line-height: 1.6; color: #a9b9d5; }
.fz-heritage > img { padding: 2px; background: #eaf1ff; border-radius: 4px; flex: 0 0 18px; }
.fz-heritage strong { color: #cbd7ec; font-weight: 500; }
.fz-heritage i { display: inline-block; width: 3px; height: 3px; vertical-align: middle; border-radius: 50%; background: #a8b8d3; margin: 0 10px; }
.fz-story .fz-hero__sub { max-width: 500px; font-size: 17px; margin-top: 22px; }
.fz-story .fz-hero__actions { margin-top: 28px; gap: 22px; }
.fz-story .fz-hero-watch { font-size: 13px; font-weight: 500; gap: 8px; }
.fz-story .fz-hero-note { margin-top: 14px; font-size: 11px; color: #a0aec6; }
.fz-vision-preview { margin-top: 56px; position: relative; z-index: 3; }
.fz-canvas-label { display: flex; align-items: center; gap: 7px; font-size: 10px; color: #bed1f2; text-transform: uppercase; letter-spacing: .1em; }
.fz-canvas-label > span { text-transform: none; letter-spacing: 0; margin-left: auto; color: #9daecb; }
.fz-preview__caption { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 15px; font-size: 11px; color: #9baac3; }
.fz-preview__caption .fz-motion-toggle { border: 0; padding-right: 0; font-size: 11px; }
.fz-connections { padding-top: 80px; }
.fz-connections > .fz-container { width: min(1280px, calc(100% - 96px)); }
@media (max-width: 767px) { .fz-connections > .fz-container { width: calc(100% - 40px); } }
.fz-connection-map { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 42px; border-block: 1px solid var(--fz-story-rule); }
.fz-connection-group { padding: 26px 34px; }
.fz-connection-group:first-child { padding-left: 0; }
.fz-connection-group + .fz-connection-group { border-left: 1px solid var(--fz-story-rule); }
.fz-connection-group h3 { color: var(--fz-muted); font-size: 12px; font-weight: 500; }
.fz-connection-group__tools { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 16px; margin-top: 26px; }
.fz-partner { display: flex; align-items: center; gap: 10px; font-size: 13px; white-space: nowrap; }
.fz-partner__image { display: inline-flex; width: 30px; height: 30px; border-radius: 7px; overflow: hidden; background: #f1f4fa; padding: 1px; flex-shrink: 0; align-items: center; justify-content: center; }
.fz-partner__image img { width: 100%; height: 100%; object-fit: contain; }
.fz-partner__image.is-plain { padding: 4px; }
.fz-partner--small { font-size: 10px; gap: 6px; color: #b8c6df; }
.fz-partner--small .fz-partner__image { width: 19px; height: 19px; border-radius: 4px; }
.fz-partner--small .fz-partner__image.is-plain { padding: 2px; }
.fz-connection-note { margin-top: 24px; }
.fz-connection-note > div { display: flex; justify-content: space-between; gap: 32px; font-size: 12px; color: #a3b2cc; }
.fz-connection-note span { text-align: right; max-width: 270px; }
.fz-relationship { padding-block: 96px 110px; background: linear-gradient(120deg, #0b1323, #080d19 70%); }
.fz-relationship__layout { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.fz-relationship .fz-overline { margin-bottom: 20px; }
.fz-relationship .fz-h2 { max-width: 390px; }
.fz-relationship .fz-lede { max-width: 370px; font-size: 15px; }
.fz-delegation-lines p { display: flex; align-items: center; gap: 18px; padding: 24px 0; border-bottom: 1px solid var(--fz-story-rule); font-size: 22px; line-height: 1.3; letter-spacing: -.02em; }
.fz-delegation-lines p > span { width: 34px; height: 34px; border-radius: 50%; background: #96baff0b; color: #aec7ff; display: grid; place-items: center; flex-shrink: 0; }
.fz-task-story { position: relative; height: 248svh; }
.fz-task-story__stage { position: sticky; top: 0; min-height: 100svh; display: flex; align-items: center; padding: 108px 0 60px; overflow: clip; }
.fz-task-story__stage > .fz-container { position: relative; z-index: 2; }
.fz-task-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 36px; }
.fz-task-heading .fz-h2 { font-size: clamp(31px, 3vw, 42px); }
.fz-task-heading .fz-lede { max-width: 480px; font-size: 14px; margin-top: 16px; }
.fz-scene-control { display: flex; gap: 8px; align-items: center; font-size: 11px !important; color: #a8badd !important; min-height: 36px; white-space: nowrap; }
.fz-scene-control:hover, .fz-task-skip:hover { color: #eef3ff !important; }
.fz-task-layout { display: grid; grid-template-columns: .8fr 1.2fr; align-items: start; gap: 58px; }
.fz-task-narrative { padding-top: 6px; }
.fz-task-steps { display: flex; gap: 8px; position: relative; margin-bottom: 34px; }
.fz-task-steps button { display: grid; gap: 9px; width: 25%; text-align: left; font-size: 10px; color: #a7b7d0; padding: 0 0 12px; border-bottom: 1px solid #91b2f02c; }
.fz-task-steps button span { font-size: 11px; font-variant-numeric: tabular-nums; opacity: .8; }
.fz-task-steps button[aria-current='step'] { color: #d5e2ff; border-color: #98b7ff; }
.fz-task-beat { min-height: 210px; }
.fz-task-beat__tag { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: #a9c3f5; margin-bottom: 14px; }
.fz-task-beat h3 { font-size: 27px; font-weight: 500; line-height: 1.2; letter-spacing: -.035em; max-width: 290px; }
.fz-task-beat p { color: #a8b6ce; font-size: 14px; line-height: 1.7; margin-top: 16px; max-width: 320px; }
.fz-task-tool { display: inline-block; margin-top: 24px; font-size: 11px; color: #c1d0eb; }
.fz-task-skip { display: inline-flex; gap: 10px; align-items: center; margin-top: 20px; min-height: 36px; font-size: 12px; color: #adbfdf !important; }
.fz-task-window { border-radius: 16px; background: linear-gradient(145deg, #17233a, #101827 70%); }
.fz-task-window__bar { display: flex; justify-content: space-between; align-items: center; height: 46px; padding: 0 20px; border-bottom: 1px solid var(--fz-story-rule); }
.fz-task-window__bar > span:first-child { display: flex; align-items: center; gap: 9px; font-size: 12px; }
.founders .fz-task-ask { margin: 18px 20px; padding: 12px 16px; border-radius: 12px 12px 3px 12px; background: #9ab4ea0d; border: 1px solid #b2caff13; color: #d2def4; font-size: 12px; line-height: 1.6; }
.fz-task-canvas { padding: 2px 20px 6px; }
.fz-task-canvas > .fz-canvas-label { margin-bottom: 14px; }
.fz-task-output { display: flex; gap: 12px; align-items: center; min-height: 67px; padding: 14px 0; border-top: 1px solid #9ab8ed16; }
.fz-task-output__icon { color: #b7caff; width: 30px; flex-shrink: 0; display: grid; place-items: center; }
.fz-task-output > div:nth-child(2) { min-width: 0; flex: 1; }
.fz-task-output span:not(.fz-review-pill) { display: block; font-size: 10px; color: #a9b7cf; }
.fz-task-output strong { display: block; font-size: 12px; font-weight: 500; margin-top: 3px; }
.fz-task-output > svg { color: #a9c2ef; }
.fz-task-tags { display: flex; gap: 6px; margin-top: 8px; }
.fz-task-tags span { padding: 3px 6px; border: 1px solid #9abaff25; border-radius: 4px; font-size: 9px !important; }
.fz-review-pill { font-size: 9px; border-radius: 4px; color: #c9d9fb; padding: 4px 7px; border: 1px solid #b2ceff38; }
.fz-task-status { display: flex; align-items: center; gap: 8px; padding: 12px 20px; background: #8cacff07; font-size: 10px; color: #b8cced; }
.fz-task-status .fz-dot { width: 4px; height: 4px; }
.fz-task-trace { position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: var(--fz-grad); transform-origin: left; }
.founders .fz-task-caption { font-size: 10px; color: #9dacc5; text-align: right; margin-top: 16px; }
.fz-task-story[data-flat='true'], .fz-story:not([data-story-ready]) .fz-task-story { height: auto; }
.fz-task-story[data-flat='true'] .fz-task-story__stage, .fz-story:not([data-story-ready]) .fz-task-story__stage { position: relative; min-height: 0; padding-block: 80px; }
.fz-task-story[data-flat='true'] .fz-task-output { opacity: 1 !important; transform: none !important; }
.fz-task-story[data-flat='true'] .fz-task-beat { min-height: 0; padding-bottom: 28px; }
.fz-task-story[data-flat='true'] .fz-task-window { position: sticky; top: 96px; }
.fz-story:not([data-story-ready]) .fz-task-output { opacity: 1 !important; transform: none !important; }
.fz-continuity { background: linear-gradient(150deg, #0b1221, #060b16); }
.fz-continuity__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 76px; margin-top: 48px; }
.fz-memory__visual { padding: 26px 28px; background: linear-gradient(120deg, #9fc0ff10, #7c85f504); border: 1px solid #a0b8e32a; border-radius: 16px; box-shadow: inset 0 1px 0 #bbd1ff15, 0 20px 50px -36px #000; position: relative; min-height: 236px; }
.fz-memory__thread { display: flex; gap: 7px; margin-top: 22px; }
.fz-memory__thread i { height: 4px; border-radius: 2px; width: 32px; background: #9fb5df32; }
.fz-memory__thread i:nth-child(2) { width: 62px; background: #9fb5df18; }
.fz-memory__thread i:nth-child(3) { width: 20px; background: #9fb5df0c; }
.fz-memory blockquote { font-size: 22px; font-weight: 500; letter-spacing: -.02em; line-height: 1.45; margin: 18px 0; color: #d9e5ff; }
.fz-memory__saved { display: flex; align-items: center; gap: 8px; font-size: 10px; color: #a2b6d9; }
.fz-continuity__grid h3 { font-size: 24px; font-weight: 500; line-height: 1.2; letter-spacing: -.03em; margin-top: 28px; }
.fz-continuity__grid p { font-size: 14px; color: #aab8d0; line-height: 1.7; margin-top: 14px; max-width: 420px; }
.fz-rhythm__visual { padding-top: 12px; min-height: 236px; }
.fz-rhythm__visual > .fz-enter:first-child { margin-bottom: 14px; }
.fz-schedule-row { display: flex; gap: 14px; align-items: center; padding: 15px 0; border-bottom: 1px solid var(--fz-story-rule); }
.fz-schedule-dot { display: inline-block; width: 7px; height: 7px; border: 1px solid #abc2f2; border-radius: 50%; box-shadow: 0 0 0 4px #abc2f20a; }
.fz-schedule-row > div { flex: 1; }
.fz-schedule-row div > span { display: block; font-size: 10px; color: #a0b1ce; margin-bottom: 5px; }
.fz-schedule-row strong { display: block; font-size: 13px; font-weight: 500; }
.fz-schedule-row > svg { color: #a1b8e8; }
.fz-start-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 52px 92px; align-items: start; }
.fz-start-intro .fz-btn { margin-top: 28px; }
.fz-start-intro .fz-lede { max-width: 370px; }
.fz-start-step { display: flex; align-items: flex-start; gap: 24px; }
.fz-start-steps > .fz-enter + .fz-enter { margin-top: 35px; }
.fz-start-step__number { width: 32px; height: 32px; border-radius: 50%; border: 1px solid #9bbaf238; background: #8eaaff0b; color: #c9dcff; font-size: 12px; display: grid; place-items: center; flex-shrink: 0; }
.fz-start-step h3 { font-size: 21px; font-weight: 500; letter-spacing: -.02em; margin-top: 2px; }
.fz-start-step p { font-size: 14px; color: #a7b6cd; line-height: 1.7; margin-top: 10px; }
.fz-start-tools { display: flex; gap: 12px; margin-top: 18px; }
.fz-start-tools img { width: 26px; height: 26px; object-fit: contain; border-radius: 5px; background: #eef4fc; padding: 2px; }
.fz-start-prompt { display: inline-flex; gap: 14px; align-items: center; padding: 12px 14px; border: 1px solid #adc8fb25; background: #7f9bd909; border-radius: 8px; font-size: 12px; margin-top: 18px; }
.fz-control-note { grid-column: 1 / -1; padding: 24px 0; border-block: 1px solid var(--fz-story-rule); }
.fz-control-note > div > div { display: flex; align-items: flex-start; gap: 18px; }
.fz-control-note svg { color: #b0c8f8; flex-shrink: 0; }
.fz-control-note h3 { font-size: 15px; font-weight: 500; }
.fz-control-note p { color: #a3b3ce; font-size: 13px; line-height: 1.6; margin-top: 8px; max-width: 780px; }
.fz-vision-close { padding-bottom: 56px; background: radial-gradient(ellipse 75% 28% at 50% 14%, #334e9528, transparent); }
.fz-close-heading { text-align: center; }
.fz-close-heading .fz-lede { margin-inline: auto; }
.fz-plan-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 870px; margin: 42px auto 0; }
.fz-plan-row > .fz-enter > div { padding: 30px; border: 1px solid #aac7ff38; background: linear-gradient(130deg, #9bbdff13, #11203b55); border-radius: 18px; box-shadow: inset 0 1px 0 #d2e1ff1a, 0 20px 50px -40px #000; }
.fz-pro-plan > div { background: linear-gradient(130deg, #9bbdff08, #11203b11) !important; border-color: #aac7ff24 !important; }
.fz-plan-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 13px; }
.fz-plan-badge { font-size: 9px; color: #bbcef1; }
.founders .fz-plan-price { font-size: 56px; line-height: 1; letter-spacing: -.055em; margin-top: 32px; }
.fz-plan-price span { font-size: 12px; letter-spacing: 0; color: #a9bbd9; padding-left: 8px; }
.fz-plan-price + p { font-size: 13px; color: #afbdd5; margin-top: 16px; min-height: 40px; }
.fz-plan-row .fz-btn { margin-top: 24px; }
.fz-plan-fine { display: block; font-size: 10px; color: #a8b6cf; margin-top: 16px; }
.fz-vision-faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: 72px; margin-top: 80px; padding-top: 46px; border-top: 1px solid var(--fz-story-rule); }
.fz-vision-faq h3 { font-size: 28px; font-weight: 500; line-height: 1.2; letter-spacing: -.025em; max-width: 270px; }
.fz-vision-faq details { border-bottom: 1px solid var(--fz-story-rule); }
.fz-vision-faq summary { display: flex; justify-content: space-between; gap: 22px; padding-block: 19px; list-style: none; cursor: pointer; font-size: 14px; line-height: 1.5; }
.fz-vision-faq summary > span { flex: 1; min-width: 0; }
.fz-vision-faq summary::-webkit-details-marker { display: none; }
.fz-vision-faq summary svg { flex-shrink: 0; color: #a6bee9; transition: transform .2s; margin-top: 1px; }
.fz-vision-faq details[open] summary svg { transform: rotate(45deg); }
.fz-vision-faq details p { color: #b0bed6; font-size: 13px; line-height: 1.75; padding: 0 28px 22px 0; }
.fz-close-signoff { margin-top: 54px; text-align: center; }
.fz-close-signoff span { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; }
.fz-close-signoff img { padding: 3px; background: #edf4ff; border-radius: 5px; }
.fz-close-signoff p { margin-top: 10px; color: #9dadc8; font-size: 11px; }
.fz-story .fz-footer__signature { opacity: .13; width: min(420px, 55%); max-width: 420px; margin: 28px auto 4px; }
.fz-story .fz-footer { padding-top: 0; }
.fz-story .fz-footer__top { padding-block: 20px; }
.fz-story .fz-footer__top p, .fz-story .fz-footer__cta { font-size: 13px; }
.fz-story .fz-footer__bottom { font-size: 11px; padding-block: 18px; }

@media (min-width: 768px) and (max-height: 830px) {
  .fz-task-story__stage { padding-top: 90px; padding-bottom: 28px; }
  .fz-task-heading { margin-bottom: 22px; }
  .fz-task-heading .fz-h2 { font-size: 34px; }
  .fz-task-heading .fz-lede { font-size: 13px; margin-top: 12px; }
  .fz-task-output { padding-block: 10px; min-height: 58px; }
  .fz-task-ask { margin-block: 12px !important; }
}
@media (max-width: 1100px) {
  .fz-story .fz-container { width: calc(100% - 112px); }
  .fz-story .fz-nav__inner { width: calc(100% - 64px); }
  .fz-connection-group { padding-inline: 24px; }
  .fz-connection-group__tools { grid-template-columns: 1fr; gap: 18px; }
  .fz-relationship__layout { gap: 48px; }
  .fz-delegation-lines p { font-size: 20px; }
  .fz-continuity__grid { gap: 40px; }
  .fz-task-layout { gap: 35px; grid-template-columns: .8fr 1.2fr; }
  .fz-task-heading { align-items: start; }
  .fz-task-heading .fz-lede { max-width: 420px; }
  .fz-task-beat h3 { font-size: 24px; }
  .fz-start-layout { gap: 45px; }
  .fz-petal-waypoint { right: 0; }
}
@media (max-width: 767px) {
  .fz-story .fz-container { width: calc(100% - 48px); }
  .fz-story .fz-nav__inner { width: calc(100% - 40px); }
  .fz-story .fz-nav__cta { font-size: 12px; min-height: 36px; padding-inline: 14px; }
  .fz-story .fz-nav__brand .fz-lockup { gap: 7px; }
  .fz-story .fz-h1 { font-size: clamp(39px, 8.4vw, 56px); line-height: 1.08; letter-spacing: -.052em; }
  .fz-story .fz-h2 { font-size: clamp(29px, 7.4vw, 38px); }
  .fz-story .fz-lede { font-size: 15px; line-height: 1.65; margin-top: 16px; }
  .fz-story-section { padding-block: 62px; }
  .fz-petal-home { width: 88px; height: 88px; margin-bottom: 20px; }
  .fz-petal-waypoint { right: 6px; width: 24px; }
  .fz-vision-hero { padding-top: 88px; padding-bottom: 46px; }
  .fz-story .fz-heritage { margin-bottom: 20px; font-size: 10px; max-width: 285px; gap: 8px; line-height: 1.7; }
  .fz-heritage > img { display: none; }
  .fz-heritage i { margin: 0 6px; }
  .fz-story .fz-hero__sub { max-width: 330px; font-size: 15px; margin-top: 20px; }
  .fz-story .fz-hero__actions { flex-direction: row; gap: 15px; margin-top: 24px; }
  .fz-story .fz-hero__actions .fz-btn { width: auto; font-size: 13px; padding-inline: 18px; }
  .fz-story .fz-hero-watch { font-size: 12px; }
  .fz-vision-preview { margin-top: 44px; }
  .fz-example-label { font-size: 8px; }
  .fz-preview__caption { align-items: flex-start; font-size: 10px; line-height: 1.6; padding-top: 12px; }
  .fz-preview__caption > span { max-width: 195px; }
  .fz-preview__caption .fz-motion-toggle { min-height: 32px; font-size: 10px; }
  .fz-connection-map { grid-template-columns: 1fr; margin-top: 30px; }
  .fz-connection-group, .fz-connection-group:first-child { padding: 22px 0; }
  .fz-connection-group + .fz-connection-group { border-left: 0; border-top: 1px solid var(--fz-story-rule); }
  .fz-connection-group__tools { grid-template-columns: 1fr 1fr; gap: 22px 18px; margin-top: 20px; }
  .fz-partner { font-size: 13px; }
  .fz-partner--small { font-size: 10px; }
  .fz-connection-note > div { flex-direction: column; gap: 10px; font-size: 12px; }
  .fz-connection-note span { text-align: left; max-width: none; font-size: 11px; }
  .fz-relationship__layout { grid-template-columns: 1fr; gap: 28px; }
  .fz-delegation-lines p { font-size: 20px; padding-block: 20px; gap: 14px; }
  .fz-task-story { height: 234svh; }
  .fz-task-story__stage { padding: 82px 0 26px; align-items: flex-start; }
  .fz-task-heading { display: block; margin-bottom: 16px; }
  .fz-task-heading .fz-h2 { font-size: 29px; }
  .fz-task-heading .fz-lede { font-size: 12px; margin-top: 10px; max-width: 330px; }
  .fz-scene-control { font-size: 10px !important; margin-top: 6px; }
  .fz-task-layout { display: flex; flex-direction: column; gap: 18px; }
  .fz-task-narrative { width: 100%; padding: 0; }
  .fz-task-steps { gap: 12px; margin-bottom: 14px; }
  .fz-task-steps button { display: flex; gap: 6px; padding-bottom: 10px; font-size: 10px; min-height: 35px; align-items: center; }
  .fz-task-steps button span { font-size: 10px; }
  .fz-task-story[data-flat='false'] .fz-task-beat { min-height: 34px; }
  .fz-task-story[data-flat='false'] .fz-task-beat__tag, .fz-task-story[data-flat='false'] .fz-task-beat p, .fz-task-story[data-flat='false'] .fz-task-tool { display: none; }
  .fz-task-beat h3 { font-size: 20px; max-width: none; }
  .fz-task-story[data-flat='false'] .fz-task-skip { display: none; }
  .fz-task-window { width: 100%; }
  .fz-task-window__bar { height: 38px; padding-inline: 14px; }
  .fz-task-window__bar > span:first-child { font-size: 11px; }
  .founders .fz-task-ask { font-size: 11px; padding: 9px 12px; margin: 12px 14px; }
  .fz-task-canvas { padding: 0 14px 4px; }
  .fz-task-canvas > .fz-canvas-label { font-size: 9px; margin-bottom: 10px; }
  .fz-task-canvas .fz-canvas-label > span { font-size: 9px; }
  .fz-task-output { min-height: 49px; gap: 8px; padding-block: 10px; }
  .fz-task-output__icon { width: 24px; }
  .fz-task-output span:not(.fz-review-pill) { font-size: 9px; }
  .fz-task-output strong { font-size: 11px; }
  .fz-task-tags { display: none; }
  .fz-review-pill { font-size: 8px; padding: 3px 5px; }
  .fz-task-status { padding: 10px 14px; font-size: 9px; }
  .founders .fz-task-caption { text-align: left; font-size: 9px; margin-top: 12px; }
  .fz-task-story[data-flat='true'] .fz-task-story__stage { padding-block: 62px; }
  .fz-task-story[data-flat='true'] .fz-task-window { position: relative; top: auto; }
  .fz-task-story[data-flat='true'] .fz-task-heading { margin-bottom: 28px; }
  .fz-task-story[data-flat='true'] .fz-task-beat { padding-bottom: 30px; }
  .fz-task-story[data-flat='true'] .fz-task-beat p { font-size: 14px; max-width: none; }
  .fz-task-story[data-flat='true'] .fz-scene-control { display: none; }
  .fz-continuity__grid { grid-template-columns: 1fr; gap: 38px; margin-top: 30px; }
  .fz-memory__visual { padding: 24px; min-height: 0; }
  .fz-memory blockquote { font-size: 21px; }
  .fz-continuity__grid h3 { font-size: 23px; margin-top: 22px; }
  .fz-continuity__grid p { font-size: 14px; margin-top: 12px; }
  .fz-rhythm__visual { min-height: 0; padding-top: 0; }
  .fz-schedule-row strong { font-size: 13px; }
  .fz-start-layout { grid-template-columns: 1fr; gap: 34px; }
  .fz-start-step { gap: 18px; }
  .fz-control-note { padding-block: 22px; }
  .fz-control-note h3 { font-size: 14px; }
  .fz-control-note p { font-size: 12px; }
  .fz-plan-row { grid-template-columns: 1fr; gap: 16px; margin-top: 32px; }
  .fz-plan-row > .fz-enter > div { padding: 26px; }
  .fz-plan-price + p { min-height: 0; }
  .fz-vision-faq { grid-template-columns: 1fr; gap: 22px; margin-top: 50px; padding-top: 34px; }
  .fz-vision-faq h3 { font-size: 26px; max-width: 300px; }
  .fz-vision-faq summary { font-size: 14px; }
  .fz-vision-faq details p { font-size: 13px; }
  .fz-close-signoff { margin-top: 42px; }
  .fz-close-signoff p { line-height: 1.6; }
  .fz-story .fz-footer__signature { width: min(240px, 65%); }
}
@media (max-width: 374px) {
  .fz-story .fz-container { width: calc(100% - 40px); }
  .fz-story .fz-h1 { font-size: 35px; }
  .fz-story .fz-hero__actions { gap: 12px; }
  .fz-story .fz-hero-watch { font-size: 11px; }
  .fz-review-pill { max-width: 60px; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .fz-task-story { height: auto !important; }
  .fz-task-story__stage { position: relative !important; min-height: 0; }
  .fz-task-output, [data-story-reveal] { opacity: 1 !important; transform: none !important; }
}

/* Full product preview: a real responsive layout, never a scaled screenshot. */
.fz-story .fz-vision-preview { width: min(1120px, calc(100% - 128px)); margin-top: 46px; z-index: 5; }
.fz-workspace-channels { position: relative; z-index: 1; margin-bottom: 24px; text-align: center; }
.fz-channel-switch { display: inline-flex; align-items: center; gap: 4px; padding: 5px; border: 1px solid #a2bbf02b; border-radius: 15px; background: linear-gradient(135deg, #152039c9, #0c1222d9); box-shadow: inset 0 1px 0 #d6e4ff09, 0 8px 24px #0002; }
/* Each surface is its own logo, stacked over a Soon badge where the surface is not built yet. The
   button keeps its label as an accessible name, so the row still announces itself to a screen
   reader exactly as it did when the words were visible. */
.fz-channel-switch > button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 40px; padding: 9px 20px; border-radius: 10px; color: #aab6cb; font-size: 12px; font-weight: 500; white-space: nowrap; }
.fz-channel-switch > button[aria-selected='true'] { color: #f1f5ff; background: linear-gradient(120deg, #344971, #343c67); box-shadow: inset 0 1px 0 #c9daff29, 0 2px 5px #0003; }
.fz-channel-switch > button[aria-selected='true'] > svg { color: #bccfff; }
.fz-channel-switch > button:disabled { cursor: default; opacity: 1; }
.fz-channel-switch > button:disabled > img { opacity: .82; }
.fz-channel-soon { color: #bec8df; background: #b0c6ff0b; border: 1px solid #b0c6ff25; border-radius: 5px; padding: 2px 5px; font-size: 9px; font-weight: 500; line-height: 1.3; letter-spacing: .04em; }
/* The row walks itself, so the selected surface carries a bar that fills over one dwell. Without it
   the change reads as the page glitching rather than as the row showing you the next place. */
.fz-channel-switch > button[aria-selected='true']::after { content: ''; position: absolute; left: 20%; right: 20%; bottom: 4px; height: 2px; border-radius: 2px; background: #9fb6ff; transform-origin: left; animation: fz-channel-dwell 3.5s linear forwards; }
@keyframes fz-channel-dwell { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.fz-channel-switch[data-held='true'] > button[aria-selected='true']::after { animation: none; transform: scaleX(1); }
.fz-workspace-reveal { position: relative; }
.fz-workspace-reveal::before { content: none; }
.fz-workspace { --workspace-line: #a8c1ef15; display: grid; grid-template-columns: 208px minmax(0, 1fr); position: relative; overflow: hidden; text-align: left; border: 1px solid #9fbaeb42; border-radius: 20px; background: #0d1320; box-shadow: 0 2px 2px #0003, 0 26px 65px -25px #000b, 0 0 0 5px #8eaafa04, inset 0 1px 0 #c5d6ff14; }
.fz-workspace__sidebar { display: flex; flex-direction: column; padding: 24px 16px 16px; background: linear-gradient(170deg, #111827, #0c111d 62%); border-right: 1px solid var(--workspace-line); }
.fz-workspace__identity { display: flex; align-items: center; justify-content: space-between; padding-inline: 5px; margin-bottom: 25px; color: #8392ae; }
.fz-workspace__identity > span { display: flex; align-items: center; gap: 8px; color: #e0e6ff; font-size: 21px; font-weight: 700; letter-spacing: -.045em; }
.fz-workspace__new { display: flex; align-items: center; gap: 9px; padding: 10px 11px; border: 1px solid #c1d2ff1d; border-radius: 8px; background: #b9ceff06; font-size: 12px; color: #d4def1 !important; transition: background .2s; }
.fz-workspace__new > svg:last-child { margin-left: auto; color: #8d9cbb; }
.fz-workspace__new:hover { background: #b9ceff10; }
.fz-workspace__section-label { color: #8999b6; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; margin: 25px 10px 10px; }
.fz-workspace__space { display: flex; align-items: center; gap: 9px; color: #c5d1e7; font-size: 11px; padding: 0 10px; }
.fz-workspace__space-icon { display: grid; place-items: center; width: 23px; height: 23px; background: #95b5ed0b; border: 1px solid #a7bfe328; border-radius: 6px; font-size: 10px; }
.fz-workspace__space-dot { width: 4px; height: 4px; border-radius: 50%; background: #9eadeb; margin-left: auto; }
.fz-workspace__chats { display: grid; gap: 4px; }
.fz-workspace__chats > button { display: flex; align-items: center; gap: 8px; padding: 11px 9px; min-height: 38px; text-align: left; border-radius: 7px; font-size: 11px; color: #a8b6cf; line-height: 1.4; transition: background .2s, color .2s; }
.fz-workspace__chats > button svg { flex-shrink: 0; opacity: .7; }
.fz-workspace__chats > button[aria-pressed='true'] { color: #dbe6ff; background: linear-gradient(100deg, #829dff1b, #829dff08); box-shadow: inset 2px 0 #8f9bfb; }
.fz-workspace__chats > button:hover { background-color: #b6c8ff09; color: #e7edff; }
.fz-workspace__sidebar-bottom { margin-top: auto; padding-top: 30px; }
.fz-workspace__connectors { display: flex; align-items: center; gap: 9px; padding: 8px 10px; font-size: 11px; color: #acbad3 !important; }
.fz-workspace__connectors > span { margin-left: auto; font-size: 9px; color: #9dabc5; padding: 1px 5px; border: 1px solid #b0c8fb1d; border-radius: 4px; }
.fz-workspace__credits { padding: 19px 10px 16px; }
.fz-workspace__credits > div:first-child { display: flex; align-items: center; justify-content: space-between; font-size: 10px; color: #c6d0e4; }
.fz-workspace__credits a { display: flex; align-items: center; gap: 2px; color: #b7b9ff; }
.fz-workspace__credit-track { height: 3px; background: #819aca20; border-radius: 5px; overflow: hidden; margin: 9px 0 7px; }
.fz-workspace__credit-track > span { display: block; height: 100%; width: 96%; background: linear-gradient(90deg, #669dff, #a98aff); border-radius: inherit; }
.fz-workspace__credits p { font-size: 8px; color: #8d9db9; }
.fz-workspace__profile { display: flex; align-items: center; gap: 8px; padding: 15px 8px 0; border-top: 1px solid var(--workspace-line); color: #c8d3e8; font-size: 11px; }
.fz-workspace__avatar { display: grid; place-items: center; width: 29px; height: 29px; flex: 0 0 29px; border-radius: 50%; background: linear-gradient(140deg, #6d9df6, #8a6de3); box-shadow: inset 0 1px 2px #ffffff50; color: #fff; font-size: 12px; }
.fz-workspace__profile small { display: block; font-size: 9px; color: #8998b3; margin-top: 1px; }
.fz-workspace__profile-status { margin-left: auto; padding: 2px 6px; font-size: 8px; color: #a1aec6; background: #c4d7ff08; border: 1px solid #c4d7ff13; border-radius: 4px; }
.fz-workspace__main { display: flex; flex-direction: column; min-width: 0; background: radial-gradient(ellipse at 80% 0, #718ad109, transparent 48%), #0d1320; }
.fz-workspace__topbar { display: flex; align-items: center; justify-content: space-between; height: 59px; flex-shrink: 0; padding: 0 27px; border-bottom: 1px solid var(--workspace-line); }
.fz-workspace__shop { display: flex; align-items: center; gap: 9px; color: #bfcce3; font-size: 11px; }
.fz-workspace__shop > svg { color: #7e8fac; }
.fz-workspace__shop-icon { width: 22px; height: 22px; display: grid; place-items: center; font-size: 9px; border-radius: 6px; color: #bbc9e7; background: linear-gradient(145deg, #a6bbf71c, #acb9e805); border: 1px solid #a6bbf722; }
.fz-workspace__sample { display: flex; align-items: center; gap: 6px; color: #8c9ab5; font-size: 9px; }
.fz-workspace__sample > span { width: 4px; height: 4px; border-radius: 50%; background: #859bd0; }
.fz-workspace__mobile-picker { display: none; }
.fz-workspace__conversation { padding: 30px 38px 27px; flex: 1; }
.fz-workspace__question { display: flex; justify-content: flex-end; align-items: center; gap: 10px; }
.fz-workspace__question p { padding: 12px 16px; border: 1px solid #b3c6ef15; border-radius: 12px 12px 3px 12px; color: #d5dff0; background: linear-gradient(120deg, #829bde14, #b1a4ed0a); font-size: 13px; line-height: 1.5; }
.fz-workspace__question > .fz-workspace__avatar { width: 26px; height: 26px; flex-basis: 26px; font-size: 10px; }
.fz-workspace__response { padding-top: 28px; }
.fz-workspace__answer-by { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; color: #dce3f4; }
.fz-workspace__sources { display: flex; align-items: center; gap: 5px; margin-left: auto; font-size: 9px; font-weight: 400; color: #9baecf; }
.fz-workspace__sources > img { width: 13px; height: 13px; object-fit: contain; border-radius: 3px; }
.fz-workspace__sources > img:nth-child(2) { margin-right: 2px; background: #dce6fb; padding: 1px; }
.fz-workspace__sources > svg { margin-left: 2px; color: #9bb6c9; }
.founders .fz-workspace__response h2 { margin: 16px 0 13px; font-size: clamp(21px, 2vw, 27px); line-height: 1.22; font-weight: 500; letter-spacing: -.035em; color: #edf2ff; max-width: 590px; }
.fz-workspace__answer { color: #a8b5ce; font-size: 14px; line-height: 1.8; max-width: 690px; }
.fz-workspace__answer strong { color: #d3def2; font-weight: 500; }
.fz-workspace__insights { margin-top: 23px; padding: 17px 18px 0; border: 1px solid #9ebcf72a; border-radius: 11px; background: linear-gradient(125deg, #86abf80a, #9c8fea04); box-shadow: inset 0 1px 0 #c1d6ff08, 0 4px 15px #0001; }
.fz-workspace__insights-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fz-workspace__insights-heading > span:first-child { display: flex; align-items: center; gap: 7px; color: #c6d8f8; font-size: 11px; font-weight: 500; }
.fz-workspace__insights-heading svg { color: #9ba9fd; }
.fz-workspace__insights-heading > span:last-child { color: #8e9fbe; font-size: 9px; }
.fz-workspace__metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; padding: 22px 0 19px; margin: 0; }
.fz-workspace__metrics > div { padding-left: 15px; border-left: 1px solid #a9c2f21a; }
.fz-workspace__metrics > div:first-child { padding-left: 0; border: 0; }
.fz-workspace__metrics dt { color: #9eafcc; font-size: 11px; }
.fz-workspace__metrics dd { margin: 5px 0 3px; color: #eaf0ff; font-size: clamp(21px, 2.1vw, 29px); font-weight: 500; letter-spacing: -.035em; line-height: 1.4; white-space: nowrap; }
.fz-workspace__metrics > div:last-child dd { color: #b1bcff; }
.fz-workspace__metrics dd > span { display: block; font-size: 9px; font-weight: 400; letter-spacing: 0; line-height: 1.5; color: #92a3c1; margin-top: 3px; }
.founders .fz-workspace__next { display: flex; align-items: flex-start; gap: 8px; margin: 0 -18px; padding: 11px 18px; border-top: 1px solid #adc5fa14; background: #799aff04; font-size: 10px; line-height: 1.6; color: #adbddd; }
.fz-workspace__next svg { flex-shrink: 0; color: #a0a8f9; margin-top: 2px; }
.fz-workspace__composer-wrap { margin-top: auto; padding: 0 38px 16px; }
.fz-workspace__composer { display: flex; align-items: center; gap: 12px; border: 1px solid #bbcdff26; border-radius: 11px; padding: 10px 11px 10px 15px; min-height: 51px; background: linear-gradient(110deg, #a2beed0b, #abade80b); box-shadow: inset 0 1px 0 #f0f5ff08, 0 4px 16px #0002; font-size: 12px; color: #8c9dbd !important; transition: border-color .2s, background .2s; }
.fz-workspace__composer:hover { border-color: #b1c5ff66; background: #a2beed12; }
.fz-workspace__model { display: flex; align-items: center; gap: 5px; margin-left: auto; font-size: 9px; color: #acb8d1; }
.fz-workspace__send { display: grid; place-items: center; width: 28px; height: 28px; background: linear-gradient(135deg, #5269ad, #7470bd); border-radius: 8px; box-shadow: inset 0 1px 0 #d5dbff2b; color: #ebefff; flex-shrink: 0; }
.fz-workspace__composer-wrap > p { padding-top: 9px; text-align: center; font-size: 8px; color: #8796b2; }
@media (min-width: 768px) and (max-width: 1100px) {
  .fz-story .fz-vision-preview { width: calc(100% - 96px); }
  .fz-workspace { grid-template-columns: 175px minmax(0, 1fr); }
  .fz-workspace__sidebar { padding-inline: 11px; }
  .fz-workspace__chats > button { font-size: 9px; gap: 6px; }
  .fz-workspace__conversation { padding: 24px; }
  .fz-workspace__composer-wrap { padding-inline: 24px; }
  .fz-workspace__metrics > div { padding-left: 10px; }
  .fz-workspace__metrics dt { font-size: 9px; }
  .fz-workspace__metrics dd > span { font-size: 7px; }
  .fz-workspace__question p { font-size: 12px; }
  .fz-workspace__answer { font-size: 12px; }
  .fz-workspace__insights-heading > span:last-child { display: none; }
}
@media (max-width: 767px) {
  .fz-story .fz-vision-preview { width: calc(100% - 32px); margin-top: 38px; }
  .fz-workspace-channels { margin-bottom: 18px; }
  .fz-channel-switch { width: 100%; max-width: 390px; gap: 1px; padding: 4px; border-radius: 12px; }
  .fz-channel-switch > button { flex: 1; gap: 5px; min-height: 42px; padding: 0 7px; border-radius: 8px; font-size: 11px; }
  .fz-channel-switch > button > svg, .fz-channel-switch > button > img { width: 13px; height: 13px; }
  .fz-channel-switch > button { padding: 7px 10px; }
  .fz-channel-soon { font-size: 8px; padding: 2px 3px; border-radius: 4px; }
  .fz-workspace { display: block; border-radius: 14px; }
  .fz-workspace__sidebar { display: none; }
  .fz-workspace__topbar { padding-inline: 18px; height: 47px; }
  .fz-workspace__shop { font-size: 10px; gap: 7px; }
  .fz-workspace__sample { font-size: 8px; }
  .fz-workspace__mobile-picker { display: block; padding: 12px 18px 0; }
  .fz-workspace__mobile-picker label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .fz-workspace__mobile-picker select { width: 100%; min-height: 36px; border-radius: 6px; border: 1px solid #b2c7f120; padding: 6px 9px; color: #afbdd7; background: #151e30; font: inherit; font-size: 10px; color-scheme: dark; }
  .fz-workspace__mobile-picker select:focus-visible { outline: 2px solid var(--fz-ring); outline-offset: 3px; }
  .fz-workspace__conversation { padding: 19px 18px 20px; }
  .fz-workspace__question { gap: 8px; }
  .fz-workspace__question p { font-size: 11px; padding: 10px 12px; }
  .fz-workspace__question > .fz-workspace__avatar { width: 23px; height: 23px; flex-basis: 23px; }
  .fz-workspace__response { padding-top: 22px; }
  .fz-workspace__answer-by { font-size: 11px; }
  .fz-workspace__sources { font-size: 8px; gap: 4px; }
  .fz-workspace__sources > img { width: 11px; height: 11px; }
  .founders .fz-workspace__response h2 { font-size: 23px; line-height: 1.25; margin-block: 14px 12px; }
  .fz-workspace__answer { font-size: 12px; line-height: 1.75; }
  .fz-workspace__insights { padding: 14px 14px 0; margin-top: 19px; }
  .fz-workspace__insights-heading > span:first-child { font-size: 10px; }
  .fz-workspace__insights-heading > span:last-child { font-size: 8px; max-width: 98px; text-align: right; }
  .fz-workspace__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 7px 0 0; }
  .fz-workspace__metrics > div { padding: 12px 0 13px 14px; }
  .fz-workspace__metrics > div:nth-child(odd) { padding-left: 0; border-left: 0; }
  .fz-workspace__metrics > div:nth-child(n+3) { border-top: 1px solid #a9c2f21a; }
  .fz-workspace__metrics dd { font-size: 26px; line-height: 1.2; margin-top: 6px; }
  .fz-workspace__metrics dd > span { font-size: 8px; }
  .founders .fz-workspace__next { margin-inline: -14px; padding-inline: 14px; font-size: 9px; }
  .fz-workspace__composer-wrap { padding: 0 18px 14px; }
  .fz-workspace__composer { font-size: 11px; gap: 9px; padding-left: 12px; }
  .fz-workspace__composer-wrap > p { font-size: 8px; }
  .fz-workspace__model { display: none; }
  .fz-workspace__send { margin-left: auto; }
  .fz-vision-preview > .fz-preview__caption { padding-inline: 4px; }
}
@media (max-width: 374px) {
  .fz-channel-switch > button { gap: 4px; padding-inline: 5px; font-size: 10px; }
  .fz-channel-switch > button > svg, .fz-channel-switch > button > img { width: 11px; height: 11px; }
  .fz-channel-soon { font-size: 7px; }
  .fz-workspace__sources > img { display: none; }
}

/* One compositor-driven ribbon; equal-width copies make the loop seamless. */
.fz-integrations { margin-top: 38px; }
.fz-integrations__heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.fz-integrations__heading > p { color: #a8b8d2; font-size: 12px; }
.fz-integrations__heading > button { display: flex; align-items: center; gap: 6px; min-height: 32px; padding: 4px 8px; font-size: 10px; color: #a2b3d0; border-radius: 6px; }
.fz-integrations__heading > button:hover { color: #e2eaff; background: #aac4ff0c; }
.fz-integrations__viewport { overflow: hidden; padding-block: 4px; mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.fz-integrations__track { display: flex; width: max-content; animation: fz-integrations-travel 44s linear infinite; animation-play-state: paused; }
.fz-integrations[data-playing='true'] .fz-integrations__track { animation-play-state: running; will-change: transform; }
.founders .fz-integrations__group { display: flex; gap: 14px; padding-right: 14px; flex-shrink: 0; }
.fz-integrations__group > li { display: flex; align-items: center; gap: 11px; width: 150px; height: 60px; padding: 14px 17px; color: #c1cde2; font-size: 12px; border: 1px solid #a9c5ff1c; border-radius: 11px; background: linear-gradient(120deg, #9cbaff08, #a7a0ff04); box-shadow: inset 0 1px 0 #d1dfff04; }
.fz-integrations__group img { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; border-radius: 7px; opacity: .85; }
.fz-integrations__viewport:hover .fz-integrations__track { animation-play-state: paused; }
.fz-integrations[data-paused='true'] .fz-integrations__viewport, .fz-integrations__viewport:focus-visible { overflow-x: auto; mask-image: none; -webkit-mask-image: none; scrollbar-width: thin; scrollbar-color: #596b9a #101727; }
.fz-integrations[data-paused='true'] .fz-integrations__track, .fz-integrations__viewport:focus-visible .fz-integrations__track { animation: none; transform: none; will-change: auto; }
.fz-integrations[data-paused='true'] [aria-hidden='true'].fz-integrations__group, .fz-integrations__viewport:focus-visible [aria-hidden='true'].fz-integrations__group { display: none; }
.fz-integrations[data-static='true'] .fz-integrations__viewport { mask-image: none; -webkit-mask-image: none; }
.fz-integrations[data-static='true'] .fz-integrations__track { animation: none; width: 100%; will-change: auto; }
.fz-integrations[data-static='true'] .fz-integrations__group { flex-wrap: wrap; padding: 0; width: 100%; }
.fz-integrations[data-static='true'] [aria-hidden='true'].fz-integrations__group { display: none; }
@keyframes fz-integrations-travel { to { transform: translate3d(-50%, 0, 0); } }
@media (max-width: 767px) {
  .fz-integrations { margin-top: 28px; }
  .fz-integrations__heading > p { font-size: 11px; }
  .fz-integrations__heading > button { min-height: 40px; }
  .fz-integrations__group > li { width: 134px; height: 54px; padding: 12px 14px; gap: 9px; font-size: 11px; }
  .fz-integrations__group img { width: 25px; height: 25px; flex-basis: 25px; }
  .fz-integrations[data-static='true'] .fz-integrations__group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .fz-integrations[data-static='true'] .fz-integrations__group > li { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .fz-integrations__track { animation: none !important; width: 100%; }
  .fz-integrations__viewport { mask-image: none; -webkit-mask-image: none; }
  .fz-integrations__group { flex-wrap: wrap; width: 100%; }
  .fz-integrations [aria-hidden='true'].fz-integrations__group { display: none; }
}

/* A glimpse of the work: copy and a layered product canvas in the third act. */
.fz-relationship { background: radial-gradient(ellipse at 85% 55%, #6560d519, transparent 57%), linear-gradient(120deg, #0b1323, #080d19 70%); }
.fz-relationship__layout { grid-template-columns: .92fr 1.08fr; gap: 54px; }
.fz-relationship .fz-h2 { max-width: 435px; font-size: clamp(34px, 3.1vw, 44px); line-height: 1.15; }
.fz-teammate-copy .fz-btn { margin-top: 28px; }
.fz-teammate-preview { position: relative; min-width: 0; }
.fz-teammate-preview::before { content: ''; position: absolute; inset: 5% -5%; background: radial-gradient(ellipse, #787cf526, transparent 68%); pointer-events: none; }
.fz-teammate-window { position: relative; border: 1px solid #acbcff3b; border-radius: 17px; background: linear-gradient(135deg, #172037, #101727 65%); box-shadow: inset 0 1px 0 #d5ddff15, 0 28px 60px -30px #000c, 0 0 0 5px #949bff04; overflow: hidden; }
.fz-teammate-window__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 20px; border-bottom: 1px solid #a1bafa1c; background: #b2bbff03; }
.fz-teammate-window__bar > span:first-child { display: flex; align-items: center; gap: 7px; font-size: 15px; font-weight: 600; letter-spacing: -.02em; }
.fz-teammate-window__bar > span:first-child > span:last-child { font-size: 10px; font-weight: 400; color: #a1b1cf; letter-spacing: 0; padding-left: 3px; }
.fz-teammate-window__body { padding: 22px; }
.founders .fz-teammate-request { display: flex; align-items: center; gap: 18px; justify-content: space-between; margin-left: 50px; padding: 11px 13px; background: #a6b5ff0c; border: 1px solid #b0c0ff19; border-radius: 10px 10px 2px 10px; font-size: 12px; color: #cdd9f1; }
.fz-teammate-request > svg { color: #9daee3; flex-shrink: 0; }
.fz-teammate-response { display: flex; align-items: flex-start; gap: 9px; margin-top: 23px; }
.fz-teammate-response p { font-size: 12px; line-height: 1.7; color: #a5b4ce; }
.fz-teammate-response strong { font-weight: 500; color: #e1e9fa; }
.fz-teammate-work { display: grid; grid-template-columns: 1.22fr 1fr; gap: 19px; align-items: center; margin-top: 23px; }
.fz-teammate-checklist { display: grid; gap: 6px; }
.fz-teammate-task { display: flex; gap: 8px; align-items: center; padding: 13px 0; border-bottom: 1px solid #bac9ff13; }
.fz-teammate-checklist > div:last-child .fz-teammate-task { border: 0; }
.fz-teammate-task__tool { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid #b3caff21; background: #eaf0ff; border-radius: 7px; flex-shrink: 0; padding: 3px; }
.fz-teammate-task__tool img { width: 22px; height: 22px; object-fit: contain; }
.fz-teammate-task strong { display: block; font-size: 10px; color: #d8e1f4; font-weight: 500; line-height: 1.45; }
.fz-teammate-task div > span { display: block; font-size: 9px; color: #99acca; margin-top: 4px; }
.fz-teammate-task > svg { color: #abb5ff; margin-left: auto; flex-shrink: 0; }
.fz-teammate-artifact { position: relative; }
.fz-teammate-artifact > div { border: 1px solid #c5c8ff29; border-radius: 9px; padding: 9px; background: linear-gradient(145deg, #b0b8fb17, #7d83c506); box-shadow: 0 10px 24px #0003; }
.fz-teammate-print { position: relative; padding: 13px 13px 9px; border-radius: 3px; background: #e7e4ed; color: #504b6b; overflow: hidden; aspect-ratio: .77; }
.fz-teammate-print > span { display: block; font-size: 5px; letter-spacing: .12em; position: relative; z-index: 1; }
.fz-teammate-print > svg { width: 88%; height: 80%; position: absolute; right: -5%; bottom: 0; }
.fz-teammate-print > strong { display: block; position: relative; margin-top: 22px; font: 500 25px/.95 Georgia, serif; letter-spacing: -.05em; }
.fz-teammate-print > strong em { font-weight: 400; }
.fz-teammate-print > span:last-child { position: absolute; bottom: 10px; font-size: 4px; }
.fz-teammate-artifact__caption { display: flex; justify-content: space-between; align-items: center; gap: 5px; margin-top: 9px; color: #bac9e3; font-size: 8px; }
.fz-teammate-artifact__caption > span:last-child { font-size: 7px; padding: 1px 4px; background: #b6aff515; border-radius: 3px; color: #c0bfff; }
.fz-teammate-delivery { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0 0; margin-top: 22px; border-top: 1px solid #b6c8ff1a; }
.fz-teammate-delivery > span:first-child { display: flex; align-items: center; gap: 9px; color: #a5b8f2; }
.fz-teammate-delivery strong { display: block; color: #d8e3f8; font-size: 11px; font-weight: 500; }
.fz-teammate-delivery small { display: block; color: #96a9c8; font-size: 9px; margin-top: 3px; }
.fz-teammate-delivery__badge { display: flex; align-items: center; gap: 4px; font-size: 8px; color: #c2c8fb; border: 1px solid #b4baff29; background: #a0a3ff08; border-radius: 5px; padding: 5px 6px; white-space: nowrap; }
.founders .fz-teammate-caption { text-align: center; color: #9aaaca; font-size: 10px; margin-top: 18px; }
@media (min-width: 768px) and (max-width: 1000px) {
  .fz-relationship__layout { gap: 38px; grid-template-columns: 1fr; }
  .fz-teammate-preview { width: 100%; max-width: 520px; margin-inline: auto; }
  .fz-relationship .fz-h2 { font-size: 40px; max-width: 540px; }
  .fz-teammate-window__body { padding: 17px; }
  .fz-teammate-work { grid-template-columns: 1.22fr 1fr; }
  .fz-teammate-window__bar > span:first-child > span:last-child { display: none; }
  .founders .fz-teammate-request { margin-left: 0; font-size: 11px; }
  .fz-teammate-delivery__badge { display: none; }
}
@media (max-width: 767px) {
  .fz-relationship__layout { grid-template-columns: 1fr; gap: 38px; }
  .fz-relationship .fz-h2 { max-width: 360px; font-size: 35px; }
  .fz-teammate-copy .fz-btn { margin-top: 24px; }
  .fz-teammate-window__bar { padding: 14px 16px; }
  .fz-teammate-window__bar > span:first-child > span:last-child { font-size: 9px; }
  .fz-teammate-window__body { padding: 17px; }
  .founders .fz-teammate-request { margin-left: 24px; font-size: 11px; gap: 8px; }
  .fz-teammate-work { gap: 13px; grid-template-columns: 1.1fr 1fr; }
  .fz-teammate-task { gap: 6px; }
  .fz-teammate-task__tool { width: 23px; height: 23px; padding: 2px; }
  .fz-teammate-task strong { font-size: 10px; }
  .fz-teammate-task div > span { font-size: 8px; }
  .fz-teammate-task > svg { display: none; }
  .fz-teammate-print { padding: 10px 8px; }
  .fz-teammate-print > strong { font-size: 22px; margin-top: 16px; }
  .fz-teammate-print > span { font-size: 4px; }
  .fz-teammate-artifact__caption { flex-wrap: wrap; }
  .fz-teammate-delivery { gap: 7px; }
  .fz-teammate-delivery strong { font-size: 10px; }
  .fz-teammate-delivery small { font-size: 8px; }
  .fz-teammate-delivery__badge { font-size: 7px; padding: 4px; }
}

/* Horizontal product walkthrough: one generous reading column, one full app stage. */
.fz-showcase { position: relative; background: radial-gradient(ellipse at 15% 70%, #535fbd12, transparent 55%), #080d19; }
.fz-showcase[data-mode='pinned'] { height: 390svh; }
.fz-showcase__stage { position: relative; padding: 96px 0 64px; overflow: clip; }
.fz-showcase[data-mode='pinned'] .fz-showcase__stage { position: sticky; top: 0; height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 100px 0 34px; }
.fz-showcase__layout { position: relative; z-index: 2; display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: 64px; width: min(1376px, calc(100% - 128px)); margin-inline: auto; }
.fz-showcase__intro { min-width: 0; }
.fz-showcase__intro > .fz-overline { margin-bottom: 24px; }
.founders .fz-showcase__intro h2 { font-size: clamp(38px, 3.65vw, 58px); font-weight: 500; line-height: 1.08; letter-spacing: -.045em; max-width: 480px; }
.fz-showcase__intro h2 > span { display: block; }
.founders .fz-showcase__lede { font-size: 16px; line-height: 1.7; color: #a8b6ce; max-width: 410px; margin-top: 25px; }
.fz-showcase__intro > .fz-textlink { margin-top: 25px; font-size: 16px; gap: 9px; }
.fz-showcase__mark { height: 102px; margin: 22px 0 16px; }
.fz-showcase__mark .fz-petal-waypoint { position: relative; display: block; top: auto; right: auto; width: 82px; height: 82px; margin-left: 20px; }
.fz-showcase__steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: start; gap: 10px; width: 100%; max-width: 380px; }
.fz-showcase__steps button { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 10px; padding: 0; text-align: left; min-height: 44px; font-size: 11px; line-height: 1.4; white-space: nowrap; color: #8f9fbd; }
.fz-showcase__steps button > span { display: block; height: 3px; flex-shrink: 0; border-radius: 2px; background: #a4bfff22; margin: 0; transition: background .25s; }
.fz-showcase__steps button[aria-current='step'] { color: #d6e2ff; }
.fz-showcase__steps button[aria-current='step'] > span { background: linear-gradient(90deg, #a8d1ff, #a193f3); box-shadow: 0 0 10px #8c9dff33; }
.fz-showcase__controls { display: flex; align-items: center; gap: 8px; margin-top: 14px; max-width: 380px; }
.fz-showcase__controls > span { margin-right: auto; color: #d4e0f7; font-size: 16px; font-variant-numeric: tabular-nums; }
.fz-showcase__controls i { font-style: normal; color: #8495b4; padding-left: 4px; }
.fz-showcase__controls button { width: 37px; height: 37px; border: 1px solid #afc6ff2b; border-radius: 50%; display: grid; place-items: center; background: #9ebaff08; color: #c4d4f2; }
.fz-showcase__controls button:hover:not(:disabled) { background: #9ebaff20; border-color: #afc6ff66; }
.fz-showcase__controls button:disabled { opacity: .3; cursor: default; }
.fz-showcase__viewport { min-width: 0; overflow: hidden; }
.fz-showcase__track { display: flex; width: 500%; }
.fz-showcase__slide { width: 20%; flex: 0 0 20%; min-width: 0; padding-inline: 4px; }
.fz-showcase__step-heading { display: flex; align-items: center; gap: 13px; margin-bottom: 21px; min-height: 48px; }
.fz-showcase__step-heading > span:first-child { font-size: 47px; font-weight: 400; line-height: 1; letter-spacing: -.05em; color: #a7baff; }
.fz-showcase__step-heading > strong { text-transform: uppercase; font-size: 11px; letter-spacing: .06em; color: #c1cff0; border: 1px solid #a9bfff2e; background: #929af00e; padding: 7px 12px; border-radius: 99px; font-weight: 500; }
.fz-showcase__frame { border: 1px solid #bacdff66; border-radius: 20px; padding: 9px; background: linear-gradient(145deg, #8094ce1c, #131a2b); box-shadow: inset 0 1px 0 #d9e5ff20, 0 20px 55px -35px #000; overflow: hidden; }
.fz-showcase__frame > * { aspect-ratio: 16 / 10; width: 100%; border-radius: 12px; overflow: hidden; }
.fz-showcase__frame .fz-stepfilm { padding: 0; background: #0a0a0a; }
.fz-showcase__frame .fz-stepfilm video { width: 100%; height: 100%; object-fit: contain; display: block; }
.fz-showcase__capture { object-fit: contain; background: #0a0a0a; }
.fz-showcase__description { padding-top: 24px; }
.founders .fz-showcase__description h3 { font-size: clamp(26px, 2.1vw, 34px); font-weight: 500; line-height: 1.2; letter-spacing: -.025em; }
.founders .fz-showcase__description p { font-size: 15px; line-height: 1.7; margin-top: 14px; max-width: 650px; color: #a4b4cf; min-height: 52px; }
.founders .fz-showcase__caption { position: relative; z-index: 2; text-align: right; width: min(1376px, calc(100% - 128px)); margin: 20px auto 0; font-size: 9px; color: #8e9fbe; }
.fz-showcase-app { display: flex; flex-direction: column; background: #0b101c; }
.fz-showcase-app__bar { display: flex; align-items: center; justify-content: space-between; padding: 13px 17px; border-bottom: 1px solid #b2c6f61a; font-size: 11px; color: #9eafd0; }
.fz-showcase-app__bar > span:first-child { display: flex; align-items: center; gap: 7px; color: #dce5fb; font-size: 14px; }
.fz-showcase-app__bar i { font-size: 10px; font-style: normal; color: #93a4c4; margin-left: 6px; }
.fz-showcase-research { padding: 22px 25px; flex: 1; min-height: 0; }
.fz-showcase-research p, .fz-showcase-design > p { font-size: 17px; color: #dfe7fa; letter-spacing: -.02em; }
.fz-showcase-research > span { display: block; font-size: 10px; color: #8fa4c8; margin: 6px 0 18px; }
.fz-showcase-research img { width: 100%; max-height: 240px; object-fit: contain; object-position: top left; }
.fz-showcase-design { display: flex; flex-direction: column; padding: 22px 25px 16px; flex: 1; min-height: 0; }
.fz-showcase-design > div { display: flex; gap: 14px; min-height: 0; flex: 1; margin-top: 18px; align-items: center; justify-content: center; }
.fz-showcase-design figure { width: 29%; height: 100%; max-height: 235px; min-height: 0; padding: 7px; background: #b2c5ff0c; border: 1px solid #b2c5ff25; border-radius: 8px; }
.fz-showcase-design figure:first-child { transform: rotate(-4deg) translateY(5px); }
.fz-showcase-design figure:last-child { transform: rotate(4deg) translateY(5px); }
.fz-showcase-design img { width: 100%; height: calc(100% - 20px); object-fit: contain; border-radius: 3px; }
.fz-showcase-design figcaption { text-align: center; font-size: 9px; color: #a8bbdc; margin-top: 5px; }
.fz-showcase-review { flex: 1; min-height: 0; padding: 27px; display: grid; grid-template-columns: .75fr 1.25fr; gap: 24px; align-items: center; }
.fz-showcase-review > img { max-height: 250px; height: 100%; width: 100%; object-fit: contain; border: 1px solid #b7caff24; border-radius: 6px; background: #a1b3ef0a; padding: 8px; }
.fz-showcase-draft { display: block; color: #aab8ff; font-size: 9px; letter-spacing: .1em; }
.fz-showcase-review h4 { font-size: 22px; font-weight: 500; line-height: 1.2; letter-spacing: -.03em; margin: 10px 0; }
.fz-showcase-review p { font-size: 11px; line-height: 1.7; color: #9dacce; }
.fz-showcase-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-block: 15px; }
.fz-showcase-tags span { padding: 4px 6px; font-size: 8px; border: 1px solid #a8bbff24; border-radius: 5px; color: #b2c3e4; }
.founders .fz-showcase-review-note { display: flex; gap: 6px; align-items: center; color: #c8d4fd; }
.fz-showcase-approval { display: block; font-size: 9px; color: #92a3c3; margin-top: 6px; }
.fz-showcase-app__status { display: flex; align-items: center; gap: 7px; padding: 10px 17px; border-top: 1px solid #b5c8ff18; font-size: 9px; color: #bac9e6; margin-top: auto; }
.fz-showcase-app__status > span:last-child { margin-left: auto; color: #8699ba; font-size: 8px; }
.fz-showcase[data-mode='swipe'] .fz-showcase__viewport { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.fz-showcase[data-mode='swipe'] .fz-showcase__track { width: 100%; }
.fz-showcase[data-mode='swipe'] .fz-showcase__slide { flex-basis: 100%; width: 100%; scroll-snap-align: start; }
.fz-showcase[data-mode='stack'] .fz-showcase__track { width: 100%; display: grid; gap: 54px; }
.fz-showcase[data-mode='stack'] .fz-showcase__slide { width: 100%; }
.fz-showcase[data-mode='stack'] .fz-showcase__layout { align-items: start; }
.fz-showcase[data-mode='stack'] .fz-showcase__intro { position: sticky; top: 110px; }
@media (min-width: 1100px) and (max-height: 850px) {
  .fz-showcase__layout { width: calc(100% - 112px); gap: 46px; grid-template-columns: .82fr 1.18fr; }
  .fz-showcase__intro > .fz-overline { margin-bottom: 17px; }
  .founders .fz-showcase__intro h2 { font-size: 43px; }
  .fz-showcase__mark { height: 82px; margin: 16px 0 10px; }
  .fz-showcase__mark .fz-petal-waypoint { width: 68px; height: 68px; }
  .fz-showcase__frame > * { aspect-ratio: 16 / 9; }
  .fz-showcase__description { padding-top: 18px; }
}
@media (max-width: 1099px) {
  .fz-showcase__layout { grid-template-columns: 1fr; gap: 32px; width: min(740px, calc(100% - 64px)); }
  .fz-showcase__intro { position: static !important; }
  .fz-showcase__mark { position: absolute; right: -18px; top: 70px; width: 30px; height: 30px; margin: 0; }
  .fz-showcase__mark .fz-petal-waypoint { width: 30px; height: 30px; margin: 0; }
  .fz-showcase__intro > .fz-overline { margin-bottom: 18px; }
  .fz-showcase__steps { margin-top: 25px; max-width: none; }
  .fz-showcase__controls { max-width: none; }
  .fz-showcase__caption { width: calc(100% - 64px) !important; }
}
@media (max-width: 767px) {
  .fz-showcase__stage { padding: 70px 0 54px; }
  .fz-showcase__layout { width: calc(100% - 40px); gap: 26px; }
  .founders .fz-showcase__intro h2 { font-size: 38px; max-width: 350px; }
  .founders .fz-showcase__lede { font-size: 14px; margin-top: 18px; }
  .fz-showcase__intro > .fz-textlink { font-size: 14px; margin-top: 20px; }
  .fz-showcase__step-heading { gap: 8px; margin-bottom: 15px; }
  .fz-showcase__step-heading > span:first-child { font-size: 36px; }
  .fz-showcase__step-heading > strong { font-size: 9px; padding: 5px 8px; }
  .fz-showcase__frame { padding: 5px; border-radius: 13px; }
  .fz-showcase__frame > * { border-radius: 8px; aspect-ratio: 1.3; }
  .fz-showcase__frame .fz-stepfilm, .fz-showcase__capture { aspect-ratio: 16 / 10; }
  .fz-showcase__description { padding-top: 20px; }
  .founders .fz-showcase__description h3 { font-size: 25px; }
  .founders .fz-showcase__description p { font-size: 13px; margin-top: 12px; }
  .fz-showcase__caption { text-align: left !important; font-size: 8px !important; width: calc(100% - 48px) !important; }
  .fz-showcase-app__bar { padding: 10px; }
  .fz-showcase-app__bar > span:first-child { font-size: 12px; }
  .fz-showcase-app__bar i { font-size: 8px; margin-left: 0; }
  .fz-showcase-research { padding: 14px 12px; }
  .fz-showcase-research p, .fz-showcase-design > p { font-size: 12px; }
  .fz-showcase-research > span { font-size: 8px; margin-bottom: 12px; }
  .fz-showcase-design { padding: 15px 12px 12px; }
  .fz-showcase-design > div { gap: 8px; margin-top: 12px; }
  .fz-showcase-design figure { padding: 4px; }
  .fz-showcase-design figcaption { font-size: 7px; }
  .fz-showcase-review { padding: 12px; gap: 13px; grid-template-columns: .8fr 1.2fr; }
  .fz-showcase-review > img { padding: 4px; }
  .fz-showcase-review h4 { font-size: 17px; margin-block: 7px; }
  .fz-showcase-review p { font-size: 9px; }
  .fz-showcase-draft, .fz-showcase-approval { font-size: 7px; }
  .fz-showcase-tags { gap: 4px; margin-block: 9px; }
  .fz-showcase-tags span { font-size: 6px; padding: 3px 4px; }
  .fz-showcase-app__status { padding: 8px 10px; font-size: 7px; }
  .fz-showcase-app__status > span:last-child { display: none; }
}

/* Editorial feature cards with original report, network and context illustrations. */
.fz-story .fz-value-container { width: min(1140px, calc(100% - 112px)); }
.fz-value-heading { text-align: center; max-width: 670px; margin: 0 auto 45px; }
.fz-value-heading .fz-overline { justify-content: center; margin-bottom: 18px; font-size: 10px; letter-spacing: .14em; color: #a2b6fa; }
.founders .fz-value-heading .fz-h2 { font-size: clamp(36px, 3.5vw, 50px); line-height: 1.1; }
.fz-value-heading h2 > span { display: block; }
.founders .fz-value-heading .fz-lede { margin: 21px auto 0; max-width: 580px; font-size: 15px; }
.fz-hire-benefits { background: radial-gradient(ellipse at 50% 90%, #7572da0f, transparent 65%), #080d19; }
.fz-value-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.fz-value-card { height: 100%; border: 1px solid #a9bff72c; border-radius: 20px; overflow: hidden; background: linear-gradient(140deg, #172037, #101728); box-shadow: inset 0 1px 0 #d7e2ff0a, 0 20px 35px -30px #000a; transition: border-color .3s; }
.fz-value-card:hover { border-color: #bccbff66; }
.fz-value-card__copy { padding: 28px 25px 24px; min-height: 207px; }
.fz-value-card__copy .fz-overline { font-size: 9px; letter-spacing: .11em; color: #a8afff; margin-bottom: 12px; }
.founders .fz-value-card h3 { font-size: 21px; font-weight: 500; letter-spacing: -.025em; line-height: 1.25; }
.fz-value-card__copy > p:last-child { margin-top: 13px; font-size: 12px; line-height: 1.8; color: #aab8d2; }
.fz-value-art { position: relative; height: 285px; overflow: hidden; isolation: isolate; }
.fz-value-art::after { content: ''; position: absolute; inset: 0; border-top: 1px solid #ccd6ff30; border-bottom: 1px solid #ffffff09; pointer-events: none; z-index: 5; }
.fz-report-art { background: radial-gradient(ellipse at 0 0, #d8e6ff, transparent 65%), linear-gradient(135deg, #9aacfa, #7973de 72%, #484d96); }
.fz-art-grid { position: absolute; inset: 0; background-image: linear-gradient(#f5f7ff22 1px, transparent 1px), linear-gradient(90deg, #f5f7ff22 1px, transparent 1px); background-size: 25px 25px; transform: perspective(450px) rotateX(30deg) rotateZ(-20deg) scale(1.4); opacity: .45; }
.fz-report-paper { position: absolute; left: 8%; right: 8%; top: 29px; padding: 17px; border: 1px solid #fff9; border-radius: 12px; background: linear-gradient(150deg, #fff, #edf0ff); color: #243154; box-shadow: 0 15px 30px #34337830, inset 0 1px 0 #fff; rotate: -4deg; transition: rotate .45s; }
.fz-value-card:hover .fz-report-paper { rotate: -1deg; }
.fz-report-paper__heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fz-report-paper__heading > span:first-child { display: flex; align-items: center; gap: 6px; font-size: 9px; font-weight: 600; }
.fz-report-paper__heading > span:last-child { font-size: 6px; color: #7382a3; letter-spacing: .05em; }
.fz-report-paper__title { font-size: 17px; line-height: 1.25; margin-top: 15px; letter-spacing: -.035em; color: #657394; }
.fz-report-paper__title strong { font-weight: 500; color: #283655; }
.fz-report-chart { height: 68px; display: flex; gap: 11px; align-items: flex-end; margin-top: 17px; padding-bottom: 1px; background: repeating-linear-gradient(to top, #6575a112 0, #6575a112 1px, transparent 1px, transparent 23px); }
.fz-report-chart > i { display: block; flex: 1; height: var(--bar); border-radius: 4px 4px 0 0; background: linear-gradient(0deg, #7560d8, #a398fa); box-shadow: inset 0 1px 0 #ffffff66; }
.fz-report-chart > i:last-child { background: linear-gradient(0deg, #4e7be3, #9ec7ff); }
.fz-report-days { display: flex; justify-content: space-around; font-size: 6px; color: #7c89a5; margin-top: 6px; }
.fz-report-file { position: absolute; left: 14%; right: 3%; bottom: 27px; display: flex; align-items: center; gap: 9px; padding: 13px; background: #ffffffed; border: 1px solid #fff; border-radius: 10px; color: #495675; box-shadow: 0 12px 26px #32247732; rotate: 3deg; }
.fz-report-file > span { display: grid; place-items: center; width: 31px; height: 34px; border-radius: 6px; background: linear-gradient(145deg, #e0e4ff, #cfcefb); color: #6d5fc3; }
.fz-report-file strong { display: block; font-size: 10px; font-weight: 600; }
.fz-report-file small { display: block; font-size: 8px; color: #8490ab; margin-top: 3px; }
.fz-report-file > svg { margin-left: auto; color: #6e7fc1; }
.fz-art-caption { position: absolute; bottom: 9px; right: 15px; font-size: 6px; letter-spacing: .1em; color: #e5e8ffb3; }
.fz-network-art { background: radial-gradient(ellipse at 50% 46%, #b4acff 0, #8f8ee9 34%, #5059ad 76%, #354582); }
.fz-network-wires { position: absolute; inset: 0; width: 100%; height: 100%; color: #e3dfff9c; }
.fz-network-core { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; z-index: 2; }
.fz-network-core::before { content: ''; position: absolute; inset: -20px; z-index: -1; background: radial-gradient(circle, #f6f4ff88, #b9b5ff33 40%, transparent 70%); }
.fz-network-node { position: absolute; width: 43px; height: 43px; margin: -21.5px 0 0 -21.5px; }
.fz-value-brand { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 12px; background: linear-gradient(135deg, #fff, #e9edff); border: 1px solid #fff9; box-shadow: 0 7px 14px #27296326, inset 0 1px 0 #fff; }
.fz-value-brand img { width: 28px; height: 28px; object-fit: contain; border-radius: 5px; }
.fz-network-node--0 { left: 18.25%; top: 33.3%; rotate: -8deg; }
.fz-network-node--1 { left: 50%; top: 19.3%; rotate: 5deg; }
.fz-network-node--2 { left: 81.75%; top: 33.3%; rotate: 8deg; }
.fz-network-node--3 { left: 81.75%; top: 69.3%; rotate: -5deg; }
.fz-network-node--4 { left: 50%; top: 83.3%; rotate: 5deg; }
.fz-network-node--5 { left: 18.25%; top: 69.3%; rotate: -7deg; }
.fz-network-status { display: grid; place-items: center; position: absolute; right: -3px; bottom: -3px; width: 14px; height: 14px; border: 2px solid #e2e4ff; border-radius: 50%; background: #6779cd; color: #fff; }
.fz-network-caption { position: absolute; bottom: 12px; width: 100%; left: 0; text-align: center; font-size: 7px; letter-spacing: .12em; color: #eff0ff; }
.fz-context-art { background: radial-gradient(ellipse at 100% 0, #dde9ff, transparent 75%), linear-gradient(135deg, #a2b2dc, #8590cf 55%, #6470b7); }
.fz-context-rings { position: absolute; inset: -20px; transform: rotate(-28deg); }
.fz-context-rings > i { position: absolute; inset: 10% -20%; border: 1px solid #eef3ff3d; border-radius: 50%; }
.fz-context-rings > i:nth-child(2) { inset: 23% -20%; }
.fz-context-rings > i:nth-child(3) { inset: 36% -20%; }
.fz-context-stack { position: absolute; top: 34px; left: 8%; right: 8%; }
.fz-context-note { position: relative; background: linear-gradient(130deg, #fcfdff, #ecf0ff); border: 1px solid #fff9; border-radius: 9px; padding: 12px 15px; box-shadow: 0 8px 19px #293b7420; margin-top: 10px; }
.fz-context-note:first-child { rotate: -5deg; margin-right: 14px; }
.fz-context-note:nth-child(2) { rotate: 1deg; margin-left: 6px; }
.fz-context-note:last-child { rotate: 5deg; margin-left: 13px; }
.fz-context-note > span { color: #7b87a9; font-size: 6px; letter-spacing: .13em; display: block; margin-bottom: 4px; }
.fz-context-note p { color: #384967; font-size: 12px; font-weight: 500; letter-spacing: -.015em; }
.fz-context-note > svg { position: absolute; right: 12px; top: 14px; color: #7c85c5; }
.fz-context-footer { position: absolute; bottom: 25px; left: 12%; right: 12%; color: #f3f4ff; }
.fz-context-footer > span { display: flex; align-items: center; gap: 7px; font-size: 8px; }
.fz-context-footer > i { display: block; height: 3px; background: linear-gradient(90deg, #f2f4ff 75%, #f2f4ff44 75%); border-radius: 2px; margin-top: 8px; }
.fz-value-cta { margin-top: 34px; text-align: center; }
.fz-value-cta > div { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.fz-value-cta > div > span { display: flex; justify-content: center; align-items: center; gap: 7px; color: #9caecc; font-size: 11px; }

/* Honest, scenario-based comparison, with a tangible delivered artifact. */
.fz-difference { background: radial-gradient(ellipse at 80% 55%, #5e4e9c10, transparent 70%), #060a14; }
.fz-difference .fz-value-heading { margin-bottom: 28px; }
.fz-difference-tabs { display: flex; width: fit-content; max-width: 100%; margin: 0 auto; gap: 4px; padding: 5px; border: 1px solid #a4b8e524; border-radius: 12px; background: #a1b6ff06; }
.fz-difference-tabs button { min-height: 40px; padding: 9px 20px; border-radius: 8px; font-size: 12px; color: #a4b4d0; transition: color .2s, background .2s; white-space: nowrap; }
.fz-difference-tabs button[aria-selected='true'] { background: linear-gradient(110deg, #415897, #675da6); color: #f1f4ff; box-shadow: inset 0 1px 0 #dde5ff26; }
.fz-difference-tabs button:hover { color: #f0f4ff; }
.fz-difference-panel { margin-top: 22px; }
.founders .fz-difference-prompt { text-align: center; font-size: 13px; color: #bbc8e1; margin-bottom: 25px; }
.fz-difference-grid { display: grid; grid-template-columns: 1fr 1fr 1.12fr; gap: 18px; }
.fz-comparison-card { position: relative; height: 100%; padding: 25px; border: 1px solid #a1b8e728; border-radius: 18px; background: linear-gradient(140deg, #18203488, #101625); }
.fz-comparison-brand { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; color: #d1dbef; }
.fz-comparison-brand > img { border-radius: 7px; object-fit: contain; width: 26px; height: 26px; }
.fz-comparison-brand > span:last-child { margin-left: auto; font-size: 8px; font-weight: 400; color: #99a9c7; }
.founders .fz-comparison-card h3 { font-size: 21px; font-weight: 500; line-height: 1.3; letter-spacing: -.025em; margin-top: 23px; min-height: 83px; color: #c7d3e9; }
.fz-answer-graphic { height: 118px; padding: 16px; margin: 18px 0 23px; border: 1px solid #becfff14; border-radius: 9px; background: linear-gradient(125deg, #bbd0ff08, #bbd0ff02); }
.fz-answer-graphic > span { display: flex; gap: 7px; align-items: center; color: #8b9fbe; font-size: 9px; margin-bottom: 14px; }
.fz-answer-graphic > i { display: block; height: 4px; background: #aec1e425; border-radius: 2px; margin-top: 7px; }
.fz-answer-graphic > i:nth-of-type(2) { width: 88%; }
.fz-answer-graphic > i:nth-of-type(3) { width: 66%; }
.fz-answer-graphic > div { display: flex; gap: 7px; margin-top: 12px; }
.fz-answer-graphic > div > span { display: block; height: 8px; width: 38px; border-radius: 3px; background: #a6b8e512; }
.fz-comparison-card ul { display: grid; gap: 12px; }
.fz-comparison-card li { display: flex; align-items: flex-start; gap: 8px; font-size: 11px; line-height: 1.5; color: #9eb0ce; }
.fz-comparison-card li > svg { flex-shrink: 0; margin-top: 2px; color: #8498bd; }
.fz-comparison-card--ferza { background: radial-gradient(ellipse at 95% 0, #ac9fff26, transparent 65%), linear-gradient(135deg, #27375c, #343065 65%, #34285a); border-color: #c2bdff59; box-shadow: inset 0 1px 0 #eeedff20, 0 24px 45px -30px #8070e65c; }
.founders .fz-comparison-card--ferza h3 { color: #f0f1ff; }
.fz-comparison-card--ferza li { color: #cad4ef; }
.fz-comparison-card--ferza li > svg { color: #b6b9ff; }
.fz-delivery-graphic { position: relative; height: 118px; padding: 17px 15px; margin: 18px 0 23px; background: linear-gradient(125deg, #f8faff, #e2e4fc); border-radius: 9px; box-shadow: 0 6px 18px #0c09283d, inset 0 1px 0 #fff; rotate: -2deg; }
.fz-delivery-graphic > div:first-child { display: flex; align-items: center; gap: 9px; color: #6876b5; }
.fz-delivery-graphic strong { display: block; font-size: 11px; font-weight: 600; color: #334260; }
.fz-delivery-graphic small { display: block; font-size: 8px; margin-top: 3px; color: #7b86a5; }
.fz-delivery-seal { display: grid; place-items: center; width: 23px; height: 23px; margin-left: auto; color: #7375c4; background: #7772cc17; border: 1px solid #9290d534; border-radius: 50%; }
.fz-delivery-tags { display: flex; gap: 5px; margin-top: 17px; padding-top: 12px; border-top: 1px solid #8390ba26; }
.fz-delivery-tags > span { font-size: 7px; color: #7a83a4; background: #8995c410; border: 1px solid #8995c422; border-radius: 4px; padding: 3px 6px; }
.founders .fz-comparison-note { color: #8396b7; font-size: 9px; line-height: 1.7; text-align: center; margin: 22px auto 0; max-width: 790px; }
.fz-comparison-note a { text-decoration: underline; text-underline-offset: 3px; color: #a8b9d7; }

/* Two illustrated setup cards; the prompt choices are a working preview. */
.fz-illustrated-setup { background: radial-gradient(ellipse at 50% 60%, #5067ac13, transparent 65%), #0a101d; }
.fz-setup-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 940px; margin-inline: auto; }
.fz-setup-card { border: 1px solid #a8bdf132; border-radius: 21px; overflow: hidden; background: linear-gradient(140deg, #172038, #101829); height: 100%; }
.fz-setup-card .fz-value-art { height: 265px; }
.fz-network-art--setup { background: radial-gradient(ellipse at 50% 40%, #d5e7ff 0, #afc3f5 30%, #8499e2 64%, #6b79c9); }
.fz-network-art--setup .fz-network-wires { color: #f3f7ffb0; }
.fz-network-art--setup .fz-network-caption { color: #f3f6ff; }
.fz-setup-card__copy { padding: 26px 30px 29px; }
.fz-setup-card__copy > span { display: block; color: #a4b9ed; font-size: 12px; letter-spacing: .08em; margin-bottom: 11px; }
.founders .fz-setup-card h3 { font-size: 25px; font-weight: 500; line-height: 1.2; letter-spacing: -.03em; }
.fz-setup-card__copy p { font-size: 13px; line-height: 1.8; color: #a4b5d0; margin-top: 13px; }
.fz-setup-small { display: flex; gap: 7px; align-items: center; color: #a3b6da; font-size: 10px; margin-top: 20px; padding-top: 15px; border-top: 1px solid #a7c0f41a; }
.fz-task-art { background: radial-gradient(ellipse at 90% 0, #a19cff, transparent 65%), linear-gradient(135deg, #5554a7, #7770c4 65%, #5b67b6); padding-top: 57px; }
.fz-task-art__halo { position: absolute; width: 130%; height: 190%; border: 1px solid #e7e4ff36; border-radius: 50%; top: -30%; left: -15%; rotate: -25deg; box-shadow: 0 0 0 27px #e4e4ff09, 0 0 0 55px #e4e4ff05; }
.fz-task-art__prompt { display: flex; align-items: center; gap: 10px; position: relative; margin-inline: 23px; padding: 17px; min-height: 76px; border: 1px solid #fff8; border-radius: 12px; background: linear-gradient(125deg, #fff, #ecedff); color: #344060; box-shadow: 0 17px 24px #35265d2b, inset 0 1px 0 #fff; rotate: -3deg; }
.fz-task-art__prompt > p { font-size: 12px; line-height: 1.5; flex: 1; }
.fz-task-art__prompt > span:last-child { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; background: linear-gradient(140deg, #7b8ce7, #8772d4); color: white; box-shadow: 0 4px 9px #6b66aa30; flex-shrink: 0; }
.fz-task-art__options { display: flex; gap: 6px; justify-content: center; position: relative; margin: 21px 14px 0; }
.fz-task-art__options > button { min-height: 31px; font-size: 9px; padding: 6px 10px; color: #f1f0ff; background: #e5e2ff10; border: 1px solid #e5e2ff44; border-radius: 99px; }
.fz-task-art__options > button[aria-pressed='true'] { background: #f5f4ffed; color: #605b98; border-color: #fff9; box-shadow: 0 3px 6px #41327415; }
.fz-task-art__route { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 8px; color: #e4e3ff; margin-top: 14px; }
@media (max-width: 1100px) and (min-width: 768px) {
  .fz-story .fz-value-container { width: calc(100% - 80px); }
  .fz-value-grid { gap: 14px; }
  .fz-value-card__copy { padding: 22px 19px; min-height: 237px; }
  .founders .fz-value-card h3 { font-size: 19px; }
  .fz-value-card__copy > p:last-child { font-size: 11px; }
  .fz-value-art { height: 260px; }
  .fz-report-paper { padding: 13px; }
  .fz-report-paper__heading > span:last-child { display: none; }
  .fz-report-paper__title { font-size: 15px; }
  .fz-report-file { padding: 10px; gap: 5px; }
  .fz-report-file strong { font-size: 8px; }
  .fz-report-file small { font-size: 7px; }
  .fz-context-note { padding: 11px; }
  .fz-context-note p { font-size: 10px; }
  .fz-context-stack { left: 5%; right: 5%; }
  .fz-context-note > svg { display: none; }
  .fz-difference-grid { gap: 14px; }
  .fz-comparison-card { padding: 20px 16px; }
  .fz-comparison-brand { flex-wrap: wrap; }
  .fz-comparison-brand > span:last-child { flex-basis: 100%; margin: 0; }
  .founders .fz-comparison-card h3 { font-size: 19px; min-height: 99px; }
  .fz-comparison-card li { font-size: 10px; }
  .fz-answer-graphic, .fz-delivery-graphic { padding: 13px 10px; }
  .fz-answer-graphic > span { font-size: 8px; }
  .fz-delivery-graphic strong { font-size: 9px; }
  .fz-delivery-graphic small { font-size: 7px; }
  .fz-delivery-seal { display: none; }
  .fz-delivery-tags { gap: 3px; }
  .fz-delivery-tags > span { padding-inline: 3px; font-size: 6px; }
  .fz-task-art__prompt { margin-inline: 17px; padding: 13px; }
  .fz-task-art__prompt > p { font-size: 11px; }
  .fz-task-art__options { gap: 4px; margin-inline: 8px; }
  .fz-task-art__options > button { font-size: 8px; padding-inline: 7px; }
}
@media (max-width: 767px) {
  .fz-story .fz-value-container { width: calc(100% - 40px); }
  .fz-value-heading { margin-bottom: 30px; text-align: left; }
  .fz-value-heading .fz-overline { justify-content: flex-start; font-size: 9px; }
  .founders .fz-value-heading .fz-h2 { font-size: 35px; }
  .founders .fz-value-heading .fz-lede { font-size: 14px; margin-top: 17px; }
  .fz-value-grid, .fz-setup-grid, .fz-difference-grid { grid-template-columns: 1fr; gap: 22px; }
  .fz-value-card__copy { min-height: 0; padding: 25px; }
  .fz-value-art { height: 285px; }
  .fz-value-card { max-width: 460px; margin-inline: auto; }
  .fz-value-cta { margin-top: 28px; }
  .fz-value-cta > div > span { font-size: 10px; line-height: 1.7; max-width: 290px; align-items: flex-start; }
  .fz-value-cta > div > span > svg { flex-shrink: 0; margin-top: 2px; }
  .fz-difference-tabs { width: 100%; gap: 3px; padding: 4px; }
  .fz-difference-tabs button { flex: 1; min-height: 43px; padding: 7px 5px; font-size: 10px; white-space: normal; }
  .founders .fz-difference-prompt { font-size: 12px; }
  .fz-comparison-card { padding: 25px; }
  .founders .fz-comparison-card h3 { min-height: 0; font-size: 23px; max-width: 300px; }
  .fz-comparison-card li { font-size: 12px; }
  .fz-comparison-note { text-align: left !important; }
  .fz-setup-card__copy { padding: 25px; }
  .fz-setup-card .fz-value-art { height: 265px; }
  .fz-task-art__prompt { margin-inline: 18px; padding: 14px; }
  .fz-task-art__prompt > p { font-size: 11px; }
  .fz-task-art__options { gap: 5px; }
  .fz-task-art__options > button { font-size: 9px; padding-inline: 8px; min-height: 35px; }
}
@media (prefers-reduced-motion: reduce) {
  .fz-report-paper { transition: none; }
}

/* Founder access: one clear offer, a luminous price plane, and a persistent invitation. */
.fz-nav-founder { display: inline-flex; align-items: center; gap: 9px; white-space: nowrap; border: 1px solid #a4aaff55; border-radius: 999px; padding: 7px 10px 7px 13px; background: linear-gradient(115deg, #658dff19, #a07bf724); box-shadow: inset 0 1px 0 #d7dfff16, 0 0 22px #777cff0a; font-size: 12px; color: #d7e2ff; transition: border-color .2s, background .2s; }
.fz-nav-founder:hover { border-color: #c0b2ff; background: linear-gradient(115deg, #658dff35, #a07bf738); }
.fz-nav-founder__dot { width: 5px; height: 5px; border-radius: 50%; background: #bbb0ff; box-shadow: 0 0 9px #a899ff; }
.fz-nav-founder strong { font-size: 12px; padding: 4px 7px; border-radius: 6px; background: #b7bcff1c; color: #f0edff; font-weight: 700; }
.fz-story .fz-nav__links { gap: 22px; }
.fz-story .fz-nav__links a { font-size: 13px; }
.fz-founder-wrap { max-width: 1000px; margin: 44px auto 0; position: relative; z-index: 3; }
.fz-founder-card { position: relative; display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(0, 1fr); border: 1px solid #b0c2ff42; border-radius: 24px; overflow: hidden; background: linear-gradient(125deg, #111c31, #0d1425 62%, #1f2247); box-shadow: inset 0 1px 0 #e2e8ff18, 0 32px 100px -50px #4c58c759; }
.fz-founder-card::before { content: ''; position: absolute; top: 0; left: 10%; right: 10%; height: 1px; background: linear-gradient(90deg, transparent, #b9caffb0, transparent); }
.fz-founder-benefits { padding: 42px; }
.fz-founder-label { display: flex; gap: 10px; align-items: center; font-size: 10px; letter-spacing: .14em; color: #bfcded; font-weight: 700; }
.fz-founder-spark { display: grid; place-items: center; width: 29px; height: 29px; background: linear-gradient(145deg, #769bff40, #9b78ef26); border: 1px solid #b5b5ff3b; border-radius: 9px; color: #d1ceff; }
.founders .fz-founder-benefits h3 { font-weight: 500; letter-spacing: -.035em; line-height: 1.15; font-size: 32px; margin-top: 25px; }
.founders .fz-founder-benefits > p { font-size: 13px; line-height: 1.75; color: #aabbd5; margin-top: 16px; max-width: 350px; }
.founders .fz-founder-features { display: grid; gap: 23px; margin-top: 31px; }
.fz-founder-features li { display: flex; gap: 14px; align-items: flex-start; }
.fz-founder-features svg { flex-shrink: 0; color: #a9bcff; margin-top: 2px; }
.fz-founder-features strong { font-size: 13px; font-weight: 500; color: #e0e7fc; display: block; }
.fz-founder-features li > span > span { display: block; font-size: 11px; color: #9cadca; line-height: 1.7; margin-top: 5px; }
.fz-founder-price-panel { position: relative; padding: 36px 34px; border-left: 1px solid #b6c6ff26; background: radial-gradient(ellipse at 85% 5%, #9c82ff30, transparent 65%), linear-gradient(135deg, #819eff19, #7673d50d); }
.fz-founder-plan { display: flex; align-items: center; gap: 9px; font-size: 17px; letter-spacing: -.025em; }
.fz-founder-plan strong { font-weight: 500; color: #c1bbff; }
.fz-founder-access { margin-left: auto; font-size: 9px; letter-spacing: .02em; color: #d2ccff; border: 1px solid #b7acff3a; border-radius: 999px; padding: 6px 9px; }
.founders .fz-founder-price { display: flex; align-items: baseline; font-size: 112px; font-weight: 500; letter-spacing: -.075em; line-height: 1; margin: 28px 0 10px; color: #f0f3ff; text-shadow: 0 4px 42px #ada0ff22; }
.fz-founder-price > span:first-child { font-size: 45px; letter-spacing: -.04em; align-self: flex-start; margin-top: 12px; margin-right: 5px; color: #c5d3ff; }
.fz-founder-price .fz-founder-currency { font-size: clamp(17px, 1.6vw, 23px); letter-spacing: -.025em; color: #c5d3ff; margin-left: 14px; }
.fz-founder-period { font-size: 15px; color: #d2dcf5; }
.fz-founder-months { display: flex; gap: 6px; margin-top: 25px; }
.fz-founder-months span { flex: 1; padding-top: 11px; border-top: 2px solid #91afff; color: #a4b7da; font-size: 8px; letter-spacing: .13em; }
.fz-founder-months span:nth-child(2) { border-color: #a7a6ff; }
.fz-founder-months span:nth-child(3) { border-color: #b6a0f9; }
.founders .fz-founder-equivalent { font-size: 14px; color: #aab9d7; margin-top: 19px; line-height: 1.6; }
.fz-founder-equivalent strong { font-weight: 500; color: #e0e7ff; }
.fz-founder-price-panel .fz-founder-claim { width: 100%; margin-top: 25px; font-size: 14px; min-height: 48px; background: linear-gradient(105deg, #547ee2, #8874e7); border: 1px solid #b7c1ff65; }
.founders .fz-founder-terms { color: #a8b7d4; font-size: 10px; line-height: 1.8; text-align: center; margin-top: 14px; }
.fz-founder-free { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 24px; font-size: 12px; color: #b0bfd8; }
.fz-founder-free .fz-btn { font-size: 12px; min-height: 36px; padding: 0 16px; }
.fz-founder-free > span:last-child { font-size: 10px; color: #8396b7; }
@media (min-width: 768px) and (max-width: 1150px) {
  .fz-nav-founder__dot, .fz-nav-founder > svg { display: none; }
  .fz-story .fz-nav__inner { gap: 16px; }
  .fz-story .fz-nav__links { gap: 15px; }
  .fz-story .fz-nav__cta--try { display: none; }
  .fz-founder-benefits { padding: 32px; }
  .fz-founder-price-panel { padding: 32px 26px; }
}
@media (max-width: 900px) and (min-width: 768px) {
  .fz-story .fz-nav__actions > .fz-btn--primary { display: inline-flex; }
  .fz-founder-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .founders .fz-founder-benefits h3 { font-size: 27px; }
}
@media (max-width: 767px) {
  .fz-story .fz-nav__actions > .fz-btn--primary { display: inline-flex; min-height: 38px; padding: 9px 12px; font-size: 12px; }
  .fz-nav-founder { gap: 7px; font-size: 11px; padding: 5px 8px 5px 10px; }
  .fz-nav-founder__dot, .fz-nav-founder > span:not(.fz-nav-founder__dot) { display: none; }
  .fz-nav-founder strong { font-size: 11px; }
  .fz-founder-wrap { margin-top: 30px; }
  .fz-founder-card { grid-template-columns: minmax(0, 1fr); border-radius: 19px; }
  .fz-founder-benefits { padding: 27px 25px 29px; }
  .founders .fz-founder-benefits h3 { font-size: 29px; }
  .fz-founder-price-panel { border-left: 0; border-top: 1px solid #b6c6ff26; padding: 27px 25px; }
  .founders .fz-founder-price { font-size: 100px; margin-top: 26px; }
  .fz-founder-free { flex-wrap: wrap; gap: 12px; }
  .fz-founder-free > span:last-child { flex-basis: 100%; text-align: center; }
}

/* Alternate the sculpture's resting places; the crossing path uses section gaps. */
.fz-petal-waypoint[data-petal-side='left'] { right: auto; left: max(12px, calc((100vw - 1240px) / 2)); }
.fz-story .fz-footer__signature { position: relative; opacity: 1; }
.fz-story .fz-footer__signature > img { opacity: .16; }
.fz-petal-dock { position: absolute; left: 88%; top: calc(29% - 48px); width: 44px; height: 44px; transform: translateX(-50%); }
.fz-petal-dock > img { width: 100%; height: 100%; filter: drop-shadow(0 4px 16px #987bff44); }

@media (max-width: 1199px) {
  .fz-petal-waypoint[data-petal-side='left'] { left: 0; }
}
@media (max-width: 767px) {
  .fz-petal-waypoint[data-petal-side='left'] { left: 6px; }
  .fz-petal-dock { width: 30px; height: 30px; top: calc(29% - 34px); }
}

/* Final editorial pass: readable supporting copy and a concrete approval moment. */
.fz-value-card__copy > p:last-child { font-size: 13px; line-height: 1.7; }
.fz-comparison-card li { font-size: 12px; color: #b7c5de; }
.founders .fz-comparison-note { font-size: 10px; color: #9badcb; }
.fz-task-art__options > button { min-height: 36px; font-size: 10px; background: #201b583b; }
.fz-task-art__route { font-size: 10px; }
.founders .fz-founder-terms { font-size: 11px; color: #bcc9e3; }
.fz-approval-band { max-width: 940px; margin: 28px auto 0; }
.fz-approval-band > .fz-enter__content { display: grid; grid-template-columns: 1.15fr 1fr; gap: 40px; align-items: center; padding: 30px; border: 1px solid #a9bbf12a; border-radius: 18px; background: linear-gradient(115deg, #1b27402e, #6864b410); }
.fz-approval-band__copy .fz-overline { color: #a5bafa; font-size: 10px; letter-spacing: .1em; }
.founders .fz-approval-band__copy h3 { font-size: 25px; font-weight: 500; letter-spacing: -.025em; margin-top: 12px; }
.founders .fz-approval-band__copy p { font-size: 13px; color: #adbed9; line-height: 1.75; margin-top: 12px; }
.fz-approval-example { border: 1px solid #b1c7ff32; border-radius: 12px; padding: 21px; background: linear-gradient(130deg, #34415f75, #25254180); box-shadow: inset 0 1px 0 #d4dfff14, 0 15px 30px -22px #0009; }
.fz-approval-example > div { display: flex; align-items: center; gap: 8px; font-size: 11px; color: #bacdf4; }
.fz-approval-example > div > span:last-child { margin-left: auto; font-size: 8px; letter-spacing: .08em; color: #90a1c2; }
.fz-approval-example > strong { display: block; margin-top: 19px; font-size: 14px; font-weight: 500; }
.founders .fz-approval-example > p { font-size: 11px; color: #a2b3d0; margin-top: 8px; }
.fz-approval-status { display: inline-flex; align-items: center; gap: 7px; margin-top: 19px; padding: 7px 10px; border-radius: 6px; border: 1px solid #c4b7ff38; background: #b3a5ff0a; color: #cbc3f4; font-size: 10px; }
.fz-approval-status > span { width: 5px; height: 5px; border-radius: 50%; background: #c0adff; box-shadow: 0 0 9px #ab92ff6b; }
.fz-vision-faq .fz-faq-more { border-bottom: 0; }
.fz-vision-faq .fz-faq-more > summary { color: #b7c8fc; font-size: 12px; }
.fz-vision-faq .fz-faq-more[open] > div { padding: 0 16px 12px; border: 1px solid #adc5ff22; border-radius: 12px; background: #adc5ff04; }
.fz-vision-faq .fz-faq-more[open] > summary svg { transform: rotate(45deg); }
.fz-vision-faq .fz-faq-more details:not([open]) > summary svg { transform: none; }
@media (max-width: 767px) {
  .fz-approval-band > .fz-enter__content { grid-template-columns: 1fr; gap: 23px; padding: 25px; }
  .fz-approval-example { padding: 18px; }
  .fz-approval-example > div { font-size: 10px; }
  .fz-task-art__options { gap: 4px; margin-inline: 8px; }
  .fz-task-art__options > button { padding-inline: 8px; }
  .fz-task-art__route { font-size: 9px; }
}
.fz-showcase-context { background: linear-gradient(145deg, #17233b, #0e1424); min-height: 100%; }
.fz-showcase-context__body { padding: 22px 20px; }
.fz-showcase-context__body .fz-overline { color: #a6bafa; font-size: 8px; }
.founders .fz-showcase-context__body h4 { font-size: 23px; line-height: 1.2; font-weight: 500; letter-spacing: -.035em; margin: 12px 0 20px; }
.fz-showcase-context__row { display: flex; align-items: center; gap: 11px; padding: 12px 0; border-top: 1px solid #b1c4ff1a; }
.fz-showcase-context__row > img { width: 26px; height: 26px; object-fit: contain; border-radius: 5px; background: #f0f4fc; padding: 2px; }
.fz-showcase-context__row > span { flex: 1; }
.fz-showcase-context__row strong { display: block; font-size: 11px; font-weight: 500; color: #d8e2f6; }
.fz-showcase-context__row small { display: block; font-size: 9px; margin-top: 4px; color: #a1b3d1; }
.fz-showcase-context__row > svg { color: #a5bdf3; }
@media (max-width: 767px) {
  .fz-showcase__frame > .fz-showcase-context { aspect-ratio: auto; min-height: 0; height: auto; }
}
.fz-page-progress { pointer-events: none; }
.fz-vision-faq summary { scroll-margin-top: 96px; scroll-margin-bottom: 90px; }

/* Ferza takes the visual lead in the connected-tools card. */
.fz-value-card--featured { position: relative; border-color: #a2a5f995; background: radial-gradient(ellipse at 50% 0, #7164d329, transparent 70%), linear-gradient(145deg, #202a45, #171a35); box-shadow: inset 0 1px 0 #e0ddff36, 0 0 0 1px #a09aff10, 0 16px 45px -14px #6558df36; }
.fz-value-card--featured:hover { border-color: #d3cdffd0; }
.fz-value-card--featured .fz-value-card__copy .fz-overline { color: #c3bcff; }
.founders .fz-value-card--featured h3 { color: #f4f2ff; }
.fz-value-card--featured .fz-network-art { background: radial-gradient(ellipse at 50% 49%, #778ae354 0, #3a427357 34%, transparent 63%), radial-gradient(ellipse at 95% 0, #9580fc32, transparent 65%), linear-gradient(135deg, #182440, #242449 65%, #111a32); }
.fz-value-card--featured .fz-network-art::before { content: ''; position: absolute; inset: 8% 6%; border: 1px solid #a5bbff14; border-radius: 50%; transform: rotate(-23deg); box-shadow: 0 0 45px #9594ff09, inset 0 0 45px #9594ff09; }
.fz-value-card--featured .fz-network-wires { color: #adbeff8a; filter: drop-shadow(0 0 5px #8499ff33); }
.fz-value-card--featured .fz-network-core { width: 112px; height: 112px; margin: -56px 0 0 -56px; filter: drop-shadow(0 0 15px #9a8dff55); }
.fz-value-card--featured .fz-network-core::before { inset: -18px; border-radius: 50%; border: 1px solid #c5cfff24; background: radial-gradient(circle, #9aa6ff22, #b1a5ff08 60%, transparent 72%); box-shadow: inset 0 1px 0 #f2f0ff19, 0 0 32px #738bff1f; }
.fz-value-card--featured .fz-network-node { z-index: 3; }
.fz-value-card--featured .fz-value-brand { box-shadow: 0 8px 0 -4px #6a71a0, 0 13px 17px -4px #02091daa, inset 0 1px 0 #fff; }
.fz-value-card--featured .fz-network-caption { bottom: 13px; font-size: 8px; letter-spacing: .13em; color: #cbd8ff; }
@media (min-width: 1001px) {
  .fz-hire-benefits .fz-value-grid { grid-template-columns: 1fr 1.06fr 1fr; align-items: center; }
  .fz-value-card--featured .fz-value-art { height: 309px; }
}

/* Four task-specific artifacts, with Ferza's identity leading the result. */
.fz-difference-grid { grid-template-columns: 1fr 1fr 1.16fr; }
.fz-comparison-brand { min-height: 56px; }
.fz-comparison-brand--ferza { gap: 9px; }
.fz-comparison-brand--ferza > strong { color: #faf8ff; font-size: 23px; font-weight: 700; letter-spacing: -.055em; }
.fz-comparison-brand--ferza > span:last-child { max-width: 86px; font-size: 9px; line-height: 1.5; text-align: right; color: #c4c8f1; }
.fz-comparison-mark { position: relative; flex-shrink: 0; width: 56px; height: 56px; margin-left: -5px; filter: drop-shadow(0 5px 5px #100c434d) drop-shadow(0 0 12px #b2a7ff55); }
.fz-comparison-mark::before { content: ''; position: absolute; inset: -9px; border-radius: 50%; background: radial-gradient(circle, #b5baff30, transparent 68%); }
.fz-comparison-card--ferza { border-color: #b6b6ff85; background: radial-gradient(ellipse at 90% 0, #a096ff32, transparent 64%), linear-gradient(135deg, #263556, #302958); box-shadow: inset 0 1px 0 #e1deff38, 0 0 0 1px #afa7ff0b, 0 22px 50px -30px #8c74f688; }
.founders .fz-comparison-card h3 { min-height: 78px; margin-top: 17px; }
.fz-advice-art, .fz-result-art { position: relative; height: 224px; margin: 12px 0 25px; border-radius: 12px; overflow: hidden; isolation: isolate; }
.fz-advice-art { --advice-rgb: 126, 211, 192; padding: 15px 13px; background: radial-gradient(ellipse at 0 0, rgba(var(--advice-rgb), .15), transparent 75%), #101d24; border: 1px solid rgba(var(--advice-rgb), .18); }
.fz-advice-art--claude { --advice-rgb: 229, 171, 144; background: radial-gradient(ellipse at 0 0, rgba(var(--advice-rgb), .14), transparent 75%), #231e26; }
.fz-advice-art__label { display: flex; align-items: center; gap: 7px; color: rgba(var(--advice-rgb), .9); font-size: 10px; }
.fz-advice-art__sheet { position: relative; margin-top: 14px; padding: 15px 13px 10px; border-radius: 8px; background: linear-gradient(130deg, #eef7ff08, #eef7ff02); border: 1px solid rgba(var(--advice-rgb), .16); box-shadow: 0 8px 15px #0002; }
.fz-advice-art__number { font-size: 8px; color: rgba(var(--advice-rgb), .8); letter-spacing: .12em; }
.fz-advice-art__sheet strong { display: block; color: #dce7f0; font-size: 12px; font-weight: 500; margin-top: 5px; }
.founders .fz-advice-art__sheet p { font-size: 9px; line-height: 1.7; color: #9eafc5; margin-top: 5px; }
.fz-advice-art__lines { display: grid; gap: 5px; margin-top: 12px; }
.fz-advice-art__lines > i { height: 3px; width: 93%; border-radius: 5px; background: rgba(var(--advice-rgb), .16); }
.fz-advice-art__lines > i:nth-child(2) { width: 74%; }
.fz-advice-art__lines > i:last-child { width: 83%; }
.fz-advice-art__footer { display: flex; justify-content: space-between; align-items: center; margin-top: 11px; font-size: 8px; color: rgba(var(--advice-rgb), .8); }
.fz-result-art { padding: 18px 15px 29px; border: 1px solid #e2d6ff55; background: radial-gradient(ellipse at 0 0, #e4ceff, transparent 62%), linear-gradient(130deg, #b5a6f5, #7d83d3 70%, #858ddd); box-shadow: inset 0 1px 0 #fff5, 0 12px 24px -12px #140d4f77; }
.fz-result-art--1 { background: radial-gradient(ellipse at 0 0, #adf0e4, transparent 75%), linear-gradient(125deg, #7dbed6, #6a8fd3 75%, #707bc6); }
.fz-result-art--2 { background: radial-gradient(ellipse at 0 0, #ffe1c2, transparent 75%), linear-gradient(140deg, #eab6c7, #a08bdd 85%); }
.fz-result-art--3 { background: radial-gradient(ellipse at 0 0, #d1f6e5, transparent 80%), linear-gradient(130deg, #8ed2c7, #7aabd4 75%, #8d9de0); }
.fz-result-art__grid { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(#ffffff24 1px, transparent 1px), linear-gradient(90deg, #ffffff24 1px, transparent 1px); background-size: 24px 24px; transform: rotate(-19deg) scale(1.4); opacity: .6; mask-image: linear-gradient(110deg, transparent, #000); }
.fz-result-art__caption { position: absolute; bottom: 9px; left: 9px; right: 9px; color: #242b57; font-size: 8px; font-weight: 500; text-align: center; line-height: 1.4; }
.fz-result-floating { position: absolute; bottom: -12px; right: -4px; display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; border: 1px solid #fff9; border-radius: 7px; color: #494471; font-size: 8px; font-weight: 500; background: linear-gradient(125deg, #fff, #eeeaff); box-shadow: 0 7px 13px #40377830; rotate: 2deg; }
.fz-result-listing { position: relative; display: grid; grid-template-columns: 39% 1fr; height: 158px; background: #faf9ff; border-radius: 9px; border: 1px solid #fff; box-shadow: 0 10px 22px #45418f40; rotate: -3deg; }
.fz-result-listing__product { position: relative; padding: 17px 11px 20px; display: grid; place-items: center; background: linear-gradient(140deg, #edeadf, #d4dbcb); border-radius: 8px 0 0 8px; }
.fz-art-print { position: relative; width: 77px; height: 105px; padding: 5px; background: #fbfaf4; border: 3px solid #d0bda4; box-shadow: 3px 6px 7px #49463230, inset 0 0 0 1px #fff; }
.fz-art-print > svg { width: 100%; height: 88%; }
.fz-art-print > span { position: absolute; left: 0; right: 0; bottom: 7px; font-size: 3px; letter-spacing: .1em; text-align: center; color: #828574; }
.fz-result-listing__draft { position: absolute; bottom: 9px; left: 0; right: 0; font-size: 6px; letter-spacing: .1em; text-align: center; color: #78866f; }
.fz-result-listing__details { padding: 15px 11px; }
.fz-result-listing__details > span { font-size: 6px; letter-spacing: .09em; color: #8b78a8; }
.fz-result-listing__details > strong { display: block; font-size: 12px; line-height: 1.4; color: #343e60; margin-top: 6px; font-weight: 600; }
.founders .fz-result-listing__details p { color: #838ba4; font-size: 8px; line-height: 1.6; margin-top: 5px; }
.fz-result-checks { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 10px; }
.fz-result-checks > span { display: inline-flex; align-items: center; gap: 2px; font-size: 6px; color: #75629e; }
.fz-result-campaign { position: relative; border: 1px solid #efffff; background: linear-gradient(140deg, #fff, #eaf6ff); border-radius: 9px; padding: 13px 12px 0; height: 164px; box-shadow: 0 10px 22px #264e7338; rotate: -2deg; }
.fz-result-campaign__head { display: flex; align-items: center; justify-content: space-between; gap: 5px; margin-bottom: 15px; }
.fz-result-campaign__head > span:first-child { display: flex; align-items: center; gap: 5px; font-size: 9px; font-weight: 600; color: #335b72; }
.fz-result-campaign__head > span:last-child { color: #8699ad; font-size: 6px; }
.fz-result-campaign__row { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.fz-result-campaign__row > img { flex-shrink: 0; object-fit: contain; border-radius: 5px; }
.fz-result-campaign__row > div { flex: 1; min-width: 0; }
.fz-result-campaign__row strong { display: block; font-size: 8px; font-weight: 500; color: #53627a; }
.fz-result-campaign__row div > span { display: block; height: 5px; margin-top: 5px; background: #cfdeee; border-radius: 5px; }
.fz-result-campaign__row i { display: block; height: 5px; border-radius: 5px; background: linear-gradient(90deg, #f1b190, #dc879b); }
.fz-result-campaign__row:nth-child(3) i { background: linear-gradient(90deg, #7c8be7, #83cdd6); }
.fz-result-campaign__row em { font-style: normal; font-size: 7px; color: #797c9b; width: 31px; }
.fz-result-campaign__footer { display: flex; gap: 6px; align-items: center; margin-top: 15px; border-top: 1px solid #d9e6ef; padding-top: 8px; color: #7387a1; font-size: 7px; }
.fz-result-campaign__footer > svg:last-child { margin-left: auto; }
.fz-result-product { position: relative; height: 165px; display: flex; align-items: center; }
.fz-result-product__signals { position: relative; width: 57%; padding: 14px 12px; background: linear-gradient(120deg, #fffdf9, #fff1ee); border: 1px solid #fff; border-radius: 9px; rotate: -5deg; box-shadow: 0 9px 18px #76597824; }
.fz-result-product__signals > span { display: flex; align-items: center; gap: 5px; font-size: 6px; color: #a9818f; }
.fz-result-product__signals > strong { display: block; color: #6f516d; font-size: 16px; line-height: 1.25; font-weight: 500; letter-spacing: -.03em; margin-block: 10px; }
.fz-result-product__signals > div { display: flex; flex-wrap: wrap; gap: 4px; }
.fz-result-product__signals > div > span { padding: 3px 4px; border: 1px solid #d6bccb66; border-radius: 4px; font-size: 6px; color: #9a798f; }
.fz-result-product__board { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; position: absolute; right: 0; width: 46%; height: 161px; background: linear-gradient(140deg, #e3e9d3, #b0c2ae); border: 1px solid #f8ffea; border-radius: 9px; rotate: 5deg; box-shadow: 0 13px 20px #45594338; }
.fz-result-product__board > span { font-size: 4px; letter-spacing: .05em; color: #4b6654; }
.fz-result-product .fz-result-floating { left: 7px; right: auto; bottom: -7px; }
.fz-result-report { position: relative; height: 164px; padding: 13px 13px 10px; background: linear-gradient(135deg, #fff, #eff8ff); border: 1px solid #fff; border-radius: 9px; box-shadow: 0 10px 20px #34657830; rotate: -3deg; }
.fz-result-report__heading { display: flex; align-items: center; justify-content: space-between; gap: 5px; }
.fz-result-report__heading > span:first-child { display: flex; align-items: center; gap: 5px; font-size: 9px; font-weight: 500; color: #395971; }
.fz-result-report__heading > span:last-child { font-size: 5px; color: #899db2; white-space: nowrap; }
.fz-result-report__chart { display: flex; align-items: flex-end; height: 86px; gap: 8px; margin-top: 12px; padding-bottom: 11px; background: repeating-linear-gradient(to top, #dae6ef70 0, #dae6ef70 1px, transparent 1px, transparent 24px); }
.fz-result-report__chart > span { display: flex; align-items: flex-end; position: relative; height: 100%; flex: 1; }
.fz-result-report__chart i { display: block; width: 100%; border-radius: 3px 3px 0 0; background: linear-gradient(0deg, #797fd3, #b3baff); }
.fz-result-report__chart > span:nth-child(2n) i { background: linear-gradient(0deg, #56a6b8, #a7dcd9); }
.fz-result-report__chart small { position: absolute; bottom: -11px; left: 0; right: 0; text-align: center; font-size: 6px; color: #8e9aab; }
.fz-result-report__tags { display: flex; gap: 10px; margin-top: 10px; font-size: 7px; color: #7b8da4; }
.fz-result-report__tags > span::before { content: ''; display: inline-block; width: 3px; height: 3px; margin-right: 3px; vertical-align: middle; border-radius: 50%; background: #8d8ce4; }
.fz-result-report .fz-result-floating { bottom: -9px; }
.fz-result-art > div:not(.fz-result-art__grid), .fz-advice-art__sheet { transition: translate .3s ease; }
@media (hover: hover) {
  .fz-comparison-card:hover .fz-result-art > div:not(.fz-result-art__grid), .fz-comparison-card:hover .fz-advice-art__sheet { translate: 0 -3px; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  .fz-comparison-brand { min-height: 66px; align-content: center; row-gap: 2px; }
  .fz-comparison-brand--ferza > span:last-child { flex-basis: auto; margin-left: auto; max-width: 66px; font-size: 8px; }
  .fz-comparison-mark { width: 44px; height: 44px; margin-right: 0; }
  .fz-comparison-mark > .fz-page-mark { width: 100% !important; height: 100% !important; }
  .fz-comparison-brand--ferza > strong { font-size: 20px; }
  .fz-advice-art, .fz-result-art { height: 224px; padding-inline: 9px; }
  .fz-advice-art__sheet { padding-inline: 9px; }
  .fz-advice-art__sheet strong { font-size: 11px; }
  .fz-result-listing__details { padding-inline: 7px; }
  .fz-result-listing__product { padding-inline: 6px; }
  .fz-result-listing .fz-art-print { width: 57px; height: 91px; }
  .fz-result-listing__details > strong { font-size: 10px; }
  .fz-result-listing__details > span { font-size: 5px; }
  .fz-result-checks { gap: 4px; }
  .fz-result-campaign { padding-inline: 9px; }
  .fz-result-campaign__head > span:first-child, .fz-result-report__heading > span:first-child { font-size: 8px; }
  .fz-result-campaign__head > span:last-child, .fz-result-report__heading > span:last-child { display: none; }
  .fz-result-campaign__footer { font-size: 6px; }
  .fz-result-floating { font-size: 7px; padding-inline: 7px; }
  .fz-result-art__caption { font-size: 7px; }
  .fz-result-product__signals { padding-inline: 9px; }
  .fz-result-product__signals > strong { font-size: 14px; }
  .fz-result-product__signals > span { font-size: 5px; }
  .fz-result-product__board .fz-art-print { width: 62px; height: 99px; }
}
@media (max-width: 767px) {
  .fz-difference-grid { grid-template-columns: 1fr; }
  .fz-comparison-brand { min-height: 49px; }
  .founders .fz-comparison-card h3 { min-height: 0; }
  .fz-advice-art, .fz-result-art { height: 224px; }
  .fz-comparison-brand--ferza > span:last-child { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .fz-result-art > div:not(.fz-result-art__grid), .fz-advice-art__sheet { transition: none; }
}
.founders[data-motion='off'] .fz-result-art > div:not(.fz-result-art__grid), .founders[data-motion='off'] .fz-advice-art__sheet { transition: none; }

/* Onboarding: a connected workspace, a tangible result, and a clear handoff. */
.fz-setup-grid, .fz-approval-band { max-width: 1040px; }
.fz-setup-grid { gap: 25px; }
.fz-setup-card { position: relative; border-color: #a9b7ed45; border-radius: 22px; background: linear-gradient(145deg, #192238, #101726); box-shadow: inset 0 1px 0 #e1e8ff14, 0 19px 40px -25px #02061399; }
.fz-onboard-art { position: relative; isolation: isolate; height: 345px; overflow: hidden; }
.fz-onboard-art::after { content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 5; border-bottom: 1px solid #c6d5ff19; box-shadow: inset 0 1px 0 #edf0ff13; }
.fz-onboard-art__topline { position: absolute; top: 21px; left: 24px; right: 24px; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fz-onboard-art__topline > span:first-child { display: flex; align-items: center; gap: 6px; color: #b7c7ed; font-size: 8px; font-weight: 500; letter-spacing: .09em; }
.fz-onboard-art__topline > span:last-child { color: #8495b9; font-size: 7px; letter-spacing: .09em; }
.fz-connect-board { background: radial-gradient(ellipse at 50% 55%, #4c54a443, transparent 67%), linear-gradient(125deg, #101d37, #242443 67%, #151c35); }
.fz-connect-board__light { position: absolute; left: 15%; right: 15%; top: 32%; height: 45%; background: radial-gradient(ellipse, #839cff45, #8174e020 42%, transparent 71%); transform: rotate(-30deg); }
.fz-connect-board__paths { position: absolute; width: 100%; height: 320px; top: 13px; left: 0; color: #acb7ff62; }
.fz-connect-board__paths > path { stroke: currentColor; stroke-width: 1; }
.fz-connect-board__paths > ellipse { stroke: #9baef719; stroke-width: .8; }
.fz-connect-board__paths > ellipse:last-child { stroke-dasharray: 2 7; }
.fz-connect-board__hub { position: absolute; left: 50%; top: 124px; width: 100px; margin-left: -50px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.fz-connect-board__glass { width: 100px; height: 98px; display: grid; place-items: center; position: relative; border-radius: 25px; border: 1px solid #d0cfff68; background: linear-gradient(140deg, #bcb7ff4f, #687cce21 50%, #4342759c); box-shadow: inset 0 1px 0 #fff6, inset 1px 0 0 #d2d5ff26, 0 8px 0 -3px #272b5299, 0 17px 27px #03092188, 0 0 38px #9285ef1a; rotate: -7deg; }
.fz-connect-board__glass > .fz-page-mark { rotate: 7deg; }
.fz-connect-board__hub > span { font-size: 17px; color: #e5eaff; letter-spacing: -.04em; font-weight: 600; }
.fz-connect-tile { position: absolute; width: 78px; height: 53px; margin-left: -39px; display: flex; align-items: center; gap: 5px; padding: 9px 7px; border-radius: 11px; background: linear-gradient(135deg, #fff, #e5e9ff); border: 1px solid #fff; box-shadow: 0 5px 0 -2px #7384b08c, 0 10px 17px #040b265c; }
.fz-connect-tile > img { width: 27px; height: 27px; object-fit: contain; border-radius: 5px; flex-shrink: 0; }
.fz-connect-tile > span:not(.fz-connect-tile__check) { color: #52617e; font-size: 8px; font-weight: 500; }
.fz-connect-tile__check { position: absolute; right: -4px; bottom: -3px; display: grid; place-items: center; width: 14px; height: 14px; border: 2px solid #d5e0f4; border-radius: 50%; color: #edfff8; background: #587d85; }
.fz-connect-tile--0, .fz-connect-tile--1, .fz-connect-tile--2 { left: 18.1%; rotate: -5deg; }
.fz-connect-tile--3, .fz-connect-tile--4, .fz-connect-tile--5 { left: 81.9%; rotate: 5deg; }
.fz-connect-tile--0, .fz-connect-tile--3 { top: 77px; }
.fz-connect-tile--1, .fz-connect-tile--4 { top: 144px; }
.fz-connect-tile--2, .fz-connect-tile--5 { top: 211px; }
/* OpoShop sits centered above the hub, wired straight down into it. */
.fz-connect-tile--6 { left: 50%; top: 0; }
.fz-connect-board__status { position: absolute; left: 50%; bottom: 24px; translate: -50% 0; display: flex; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid #99c7d32b; border-radius: 99px; background: #a9bfec07; color: #b9cadf; font-size: 9px; white-space: nowrap; }
.fz-connect-board__status > span:first-child { width: 4px; height: 4px; border-radius: 50%; background: #a8d9cb; box-shadow: 0 0 9px #c5ffe384; }
.fz-connect-board__status > svg { color: #9ac9ba; }
.fz-assign-board { background: radial-gradient(ellipse at 95% 0, #c1afff77, transparent 65%), linear-gradient(135deg, #353563, #5b5798 65%, #414a7d); }
.fz-assign-board .fz-onboard-art__topline > span { color: #dbd8f8; }
.fz-assign-board__glow { position: absolute; width: 105%; height: 185%; top: -38%; left: -5%; border: 1px solid #e3dfff17; border-radius: 50%; rotate: -30deg; box-shadow: 0 0 0 29px #e4dcff08, 0 0 0 59px #e4dcff04; }
.fz-assign-board__scene { position: absolute; top: 65px; left: 27px; right: 27px; }
.fz-assign-board__prompt { display: flex; align-items: center; gap: 10px; min-height: 68px; padding: 12px; position: relative; z-index: 2; border: 1px solid #fff9; border-radius: 12px; background: linear-gradient(120deg, #fff, #eeedff); box-shadow: 0 10px 22px #22204940, inset 0 1px 0 #fff; rotate: -3deg; }
.founders .fz-assign-board__prompt p { color: #435073; font-size: 11px; line-height: 1.65; flex: 1; }
.fz-assign-board__prompt > span:last-child { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 8px; background: linear-gradient(145deg, #8e91ee, #6d5bc4); color: #fff; box-shadow: inset 0 1px 0 #fff5, 0 4px 8px #6758a942; flex-shrink: 0; }
.fz-assign-board__result { position: relative; width: 89%; margin: -3px 0 0 auto; padding: 17px 16px 11px; border: 1px solid #e9e8ff62; border-radius: 0 0 12px 12px; background: linear-gradient(125deg, #e5e9ffe8, #d3d9ffe8); box-shadow: 0 14px 23px #24244744; rotate: 2deg; }
.fz-assign-board__result-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #72669b; font-size: 8px; }
.fz-assign-board__result-head > span { display: flex; align-items: center; gap: 5px; }
.fz-assign-board__result > strong { display: block; margin-top: 8px; color: #354467; font-size: 12px; font-weight: 500; letter-spacing: -.015em; }
.fz-assign-board__file { display: flex; align-items: center; gap: 9px; margin-top: 12px; }
.fz-assign-board__file > span { width: 35px; height: 37px; display: grid; place-items: center; border-radius: 7px; border: 1px solid #fff9; background: linear-gradient(130deg, #fff, #dbd0ff); color: #8a77ba; box-shadow: 0 3px 7px #64518e1c; flex-shrink: 0; }
.fz-assign-board__file strong { display: block; color: #445473; font-size: 10px; font-weight: 500; }
.fz-assign-board__file small { display: block; color: #7e8aaa; font-size: 8px; margin-top: 3px; }
.fz-assign-board__file > svg { color: #7d84bb; margin-left: auto; flex-shrink: 0; }
.fz-assign-board__route { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin-top: 12px; border-top: 1px solid #a6acc936; padding-top: 8px; }
.fz-assign-board__route > span { display: flex; gap: 5px; color: #7d84a3; font-size: 7px; }
.fz-assign-board__route i { font-style: normal; color: #9ba4c1; }
.fz-assign-board__choices { display: flex; align-items: center; justify-content: center; gap: 5px; position: absolute; bottom: 17px; left: 15px; right: 15px; }
.fz-assign-board__choices > button { min-height: 40px; padding: 8px 12px; border-radius: 99px; border: 1px solid #dddbff44; background: #27255044; color: #d0d2ef; font-size: 9px; transition: background .2s, border-color .2s, color .2s; }
.fz-assign-board__choices > button[aria-pressed='true'] { color: #53477e; background: linear-gradient(130deg, #fff, #e5e0ff); border-color: #fff; box-shadow: 0 3px 10px #1c12342b; }
.fz-assign-board__choices > button:hover { border-color: #f1ecff; color: #fff; }
.fz-assign-board__choices > button[aria-pressed='true']:hover { color: #53477e; }
.fz-assign-board__choices > button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.fz-setup-card__copy { padding: 25px 29px 27px; }
.fz-setup-card__copy > .fz-setup-step { display: flex; align-items: center; gap: 9px; font-size: 8px; letter-spacing: .13em; color: #a8b8da; margin-bottom: 16px; }
.fz-setup-step > b { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 7px; border: 1px solid #aec4ff32; background: linear-gradient(130deg, #9bade019, #a49bff0d); box-shadow: inset 0 1px 0 #e1e6ff0e; color: #c2ccf0; font-size: 10px; font-weight: 500; letter-spacing: .03em; }
.fz-setup-small { margin-top: 19px; padding-top: 14px; }
.fz-approval-band { margin-top: 25px; }
.fz-approval-band > .fz-enter__content { grid-template-columns: 1.03fr 1fr; gap: 45px; position: relative; overflow: hidden; padding: 32px 38px; border: 1px solid #b7c9f93b; border-radius: 22px; background: radial-gradient(ellipse at 100% 40%, #7894bc19, transparent 60%), linear-gradient(115deg, #162138, #17243a 62%, #252b46); box-shadow: inset 0 1px 0 #e0eaff12, 0 16px 40px -28px #020615a6; }
.fz-approval-band__copy { position: relative; z-index: 2; }
.founders .fz-approval-band__copy h3 { font-size: 28px; max-width: 320px; line-height: 1.2; }
.fz-review-scene { position: relative; padding: 4px 14px 15px 0; max-width: 420px; width: 100%; justify-self: end; }
.fz-review-scene__back { position: absolute; inset: 3px 7px 20px 8px; background: linear-gradient(150deg, #9cd4d343, #8385bc63); border: 1px solid #c3e9ed59; border-radius: 13px; transform: rotate(5deg); box-shadow: 0 10px 26px #080c2033; }
.fz-review-sheet { position: relative; padding: 17px 18px 0; background: linear-gradient(130deg, #faffff, #e7edf9); border: 1px solid #f6ffff; border-radius: 12px; box-shadow: 0 14px 25px #09102350, inset 0 1px 0 #fff; rotate: -2deg; }
.fz-review-sheet__heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #688292; }
.fz-review-sheet__heading > span:first-child { display: flex; align-items: center; gap: 7px; font-size: 10px; }
.fz-review-sheet__heading > span:last-child { color: #95a3b5; font-size: 7px; letter-spacing: .08em; }
.fz-review-sheet > strong { display: block; color: #324562; font-size: 16px; font-weight: 500; margin-top: 14px; margin-bottom: 8px; letter-spacing: -.02em; }
.fz-review-sheet__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #c7d7e544; padding: 7px 0; font-size: 10px; color: #76889d; }
.fz-review-sheet__row > span:last-child { display: flex; align-items: center; gap: 6px; color: #689388; font-size: 9px; }
.fz-review-sheet__footer { display: flex; align-items: center; gap: 6px; padding: 10px 18px; margin: 4px -18px 0; border-top: 1px solid #ced8eb; border-radius: 0 0 11px 11px; background: #e2e7f9; color: #7771a8; font-size: 9px; }
.fz-review-sheet__footer > span:first-child { width: 4px; height: 4px; background: #aa8bdd; border-radius: 50%; }
.fz-review-sheet__footer > svg { margin-left: auto; }
.fz-review-scene__seal { position: absolute; right: -13px; bottom: -6px; display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; border: 1px solid #bcdfdc75; background: linear-gradient(140deg, #e5faf4, #c9e5e6); color: #60908a; box-shadow: 0 7px 17px #0b182c55; rotate: 3deg; }
.fz-review-scene__seal > span { font-size: 8px; line-height: 1.5; }
.fz-review-scene__seal strong { color: #3c706d; font-size: 10px; font-weight: 600; }
@media (min-width: 768px) and (max-width: 1000px) {
  .fz-setup-grid { gap: 18px; }
  .fz-onboard-art__topline { left: 17px; right: 17px; }
  .fz-onboard-art__topline > span:first-child { font-size: 6px; gap: 4px; }
  .fz-onboard-art__topline > span:last-child { font-size: 6px; }
  .fz-connect-tile { width: 64px; margin-left: -32px; flex-direction: column; height: 58px; gap: 3px; padding: 6px; }
  .fz-connect-tile > img { width: 24px; height: 24px; }
  .fz-connect-tile > span:not(.fz-connect-tile__check) { font-size: 7px; }
  .fz-connect-board__hub { scale: .82; }
  .fz-assign-board__scene { left: 16px; right: 16px; }
  .fz-assign-board__prompt { gap: 6px; padding: 10px; }
  .founders .fz-assign-board__prompt p { font-size: 10px; }
  .fz-assign-board__result { width: 94%; padding-inline: 11px; }
  .fz-assign-board__result > strong { font-size: 11px; }
  .fz-assign-board__file { gap: 6px; }
  .fz-assign-board__file strong { font-size: 9px; }
  .fz-assign-board__file small { font-size: 7px; }
  .fz-assign-board__choices { left: 8px; right: 8px; gap: 4px; }
  .fz-assign-board__choices > button { padding-inline: 8px; font-size: 8px; }
  .fz-setup-card__copy { padding: 23px; }
  .fz-approval-band > .fz-enter__content { padding: 28px; gap: 27px; }
  .founders .fz-approval-band__copy h3 { font-size: 26px; }
  .fz-review-sheet { padding-inline: 13px; }
  .fz-review-sheet__footer { margin-inline: -13px; padding-inline: 13px; font-size: 8px; }
}
@media (max-width: 767px) {
  .fz-onboard-art { height: 345px; }
  .fz-onboard-art__topline { left: 19px; right: 19px; }
  .fz-onboard-art__topline > span:first-child { font-size: 7px; }
  .fz-connect-tile { flex-direction: column; width: 65px; height: 59px; margin-left: -32.5px; gap: 3px; padding: 6px; }
  .fz-connect-tile > img { width: 25px; height: 25px; }
  .fz-connect-tile > span:not(.fz-connect-tile__check) { font-size: 7px; }
  .fz-connect-board__hub { scale: .9; }
  .fz-assign-board__scene { left: 18px; right: 18px; }
  .fz-assign-board__prompt { gap: 7px; padding: 10px; }
  .founders .fz-assign-board__prompt p { font-size: 10px; }
  .fz-assign-board__result { width: 94%; padding-inline: 12px; }
  .fz-assign-board__result > strong { font-size: 11px; }
  .fz-assign-board__file strong { font-size: 9px; }
  .fz-assign-board__file small { font-size: 7px; }
  .fz-assign-board__choices > button { min-height: 42px; padding-inline: 9px; font-size: 9px; }
  .fz-setup-card__copy { padding: 25px; }
  .fz-approval-band > .fz-enter__content { grid-template-columns: 1fr; gap: 28px; padding: 27px 25px 35px; }
  .fz-review-scene { justify-self: center; padding-right: 7px; }
  .fz-review-sheet { padding-inline: 14px; }
  .fz-review-sheet__footer { margin-inline: -14px; padding-inline: 14px; }
  .fz-review-scene__seal { right: -4px; bottom: -8px; }
}
@media (prefers-reduced-motion: reduce) { .fz-assign-board__choices > button { transition: none; } }
.founders[data-motion='off'] .fz-assign-board__choices > button { transition: none; }
.fz-assign-board__file > .fz-task-thumbnail { width: 40px; height: 43px; background: linear-gradient(135deg, #f9fcf3, #d3e3c7); }
.fz-task-thumbnail > svg { width: 29px; height: 35px; }
.fz-assign-board__file > .fz-task-thumbnail--1 { background: linear-gradient(135deg, #edfaff, #cbe4ee); }
.fz-assign-board__file > .fz-task-thumbnail--2 { background: linear-gradient(135deg, #fff, #d6d9fc); }
.fz-task-thumbnail__bars { display: flex; align-items: flex-end; gap: 3px; height: 24px; }
.fz-task-thumbnail__bars i { width: 5px; height: 50%; border-radius: 2px; background: #8aa4d6; }
.fz-task-thumbnail__bars i:nth-child(2) { height: 76%; background: #79b9c0; }
.fz-task-thumbnail__bars i:last-child { height: 100%; background: #aaa4e2; }
.fz-task-thumbnail__calendar { display: flex; align-items: center; flex-direction: column; gap: 3px; color: #7874ac; }
.fz-task-thumbnail__calendar small { font-size: 6px; letter-spacing: .08em; margin: 0; color: #9391b8; }
.fz-task-thumbnail__calendar b { font-size: 10px; font-weight: 500; }
.fz-assign-board[data-task='1'] .fz-assign-board__result { background: linear-gradient(125deg, #e2f3ffe8, #cbddece8); }
.fz-assign-board[data-task='2'] .fz-assign-board__result { background: linear-gradient(125deg, #eaf4efe8, #d2e4f5e8); }
.fz-review-sheet__heading { color: #60798c; }
.fz-review-sheet__row { color: #63778e; }

/* Leave paint room for Satoshi descenders on every gradient heading. */
.founders :is(h1, h2, h3) .fz-grad { padding-bottom: .12em; margin-bottom: -.12em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
/* The single journey sculpture docks over each step along this reserved rail. */
.fz-showcase__mark { position: relative; width: 100%; max-width: 380px; }
.fz-showcase__mark .fz-petal-waypoint { position: absolute; left: 0; right: auto; top: 50%; width: 100%; height: 0; margin: 0; }
@media (max-width: 1099px), (max-height: 719px) {
  .fz-showcase__mark { position: relative; top: auto; right: auto; width: 100%; max-width: none; height: 84px; margin: 22px 0 0; }
  .fz-showcase__mark .fz-petal-waypoint { width: 100%; height: 0; margin: 0; }
  .fz-showcase__steps { margin-top: 10px; }
}
.fz-showcase[data-mode='stack'] .fz-showcase__mark { display: none; }

/* The personal story gives each idea a short, readable measure. */
.fz-story .fz-vision-hero .fz-h1 { max-width: 940px; font-size: clamp(40px, 5vw, 68px); line-height: 1.12; letter-spacing: -.045em; }
.fz-story .fz-hero__sub { max-width: 610px; font-size: 17px; line-height: 1.7; }
.fz-story .fz-hero-founder-note { display: inline-flex; align-items: center; gap: 6px; margin-top: 13px; color: #b8c8ee; font-size: 12px; }
.fz-story .fz-h2 { line-height: 1.16; }
.fz-story .fz-lede { line-height: 1.75; }
.fz-story .fz-story-section { padding-block: 82px; }
.fz-showcase__steps { gap: 7px; }
.fz-showcase__steps button { font-size: 11px; min-width: 0; }
.fz-story .fz-founder-features { gap: 15px; }
.fz-story .fz-founder-features strong { font-size: 14px; }
.fz-story .fz-founder-features li > span > span { font-size: 12px; }
[data-theme='light'] .fz-hero-founder-note { color: #445b94; }
@media (max-width: 767px) {
  .fz-story .fz-story-section { padding-block: 58px; }
  .fz-story .fz-vision-hero .fz-h1 { font-size: clamp(37px, 8vw, 52px); max-width: 550px; }
  .fz-story .fz-hero__sub { max-width: 380px; font-size: 15px; }
  .fz-story .fz-hero-founder-note { font-size: 10px; }
}

/* Founder hero: a calm hierarchy that leaves the flower, promise and action room to breathe. */
.fz-story .fz-nav { height: 76px; }
.fz-story .fz-nav__inner { width: calc(100% - clamp(48px, 6vw, 120px)); }
.fz-story .fz-nav__brand .fz-lockup { gap: 9px; }
.fz-story .fz-nav__links { gap: clamp(20px, 2vw, 32px); }
.fz-story .fz-nav__links a { font-size: clamp(14px, .86vw, 16px); }
.fz-story .fz-nav__actions > .fz-btn--primary {
  min-height: 46px;
  padding-inline: 22px;
  font-size: 15px;
}
.fz-story .fz-vision-hero {
  /* One rhythm unit for the whole hero, scaled by screen height: 24px at 900px tall, 14px to 32px.
     Gaps are multiples of it, so the first fold always shows the top of the demo, and the tabs,
     tagline and panel fit one screen under the 76px nav once scrolled to. */
  --hero-nav: 76px; --hero-tabs: 66px; --hero-tagline: 28px;
  --hero-space: clamp(14px, calc(7.2svh - 41px), 32px);
  --hero-gap-demo: calc(var(--hero-space) * .75);
  --hero-chrome: calc(var(--hero-nav) + var(--hero-tabs) + var(--hero-tagline));
  /* 100svh less: nav, a unit above the tabs, tab row, tagline row and its two gaps, a unit below. */
  --hero-preview-h: clamp(480px, calc(100svh - var(--hero-chrome) - var(--hero-space) * 3.5), 720px);
  /* How much of the panel the first fold shows. The copy block below is sized to land the panel
     top exactly here; on screens too short for that, the copy simply flows and the peek shrinks. */
  --hero-peek: clamp(40px, 8svh, 96px);
  padding-top: calc(var(--hero-nav) + var(--hero-space));
  padding-bottom: 64px;
  background: radial-gradient(ellipse 52% 49% at 50% 40%, #202b47 0%, #151d31 47%, #0d121d 100%);
}
.fz-story .fz-vision-hero > .fz-hero__copy { width: min(1280px, calc(100% - 64px)); }
/* Copy box = 100svh less the nav and unit above it, the demo chrome above the panel (note gap,
   tabs, tagline row) and the peek. Bottom-aligned: spare height goes above the mark, so the
   offer line always sits the same short gap above the tabs. */
.fz-story .fz-vision-hero > .fz-hero__copy { justify-content: flex-end; min-height: calc(100svh - var(--hero-chrome) - var(--hero-space) * 3.75 - var(--hero-peek)); }
/* The mark also scales with height (112px at 900px tall) so short laptops keep the peek. */
.fz-story .fz-vision-hero .fz-petal-home { --mark: max(72px, min(clamp(84px, 9vw, 112px), 12.4svh)); width: var(--mark); height: var(--mark); margin-bottom: var(--hero-space); }
.fz-story .fz-vision-hero .fz-petal-home img { width: 100%; height: 100%; }
.fz-story .fz-hero-kicker {
  display: inline-flex;
  align-items: center;
  padding: 9px 18px;
  border: 1px solid #b6c4ff45;
  border-radius: 999px;
  background: linear-gradient(110deg, #8caaff1c, #ac8eff1c);
  box-shadow: inset 0 1px 0 #ffffff0d;
  margin-bottom: var(--hero-space, 24px);
  color: #edf0ff;
  font-size: clamp(14px, .96vw, 17px);
  line-height: 1.45;
  font-weight: 500;
  letter-spacing: .01em;
}
.fz-story .fz-vision-hero .fz-h1 {
  max-width: 1200px;
  font-size: clamp(44px, 4.45vw, 82px);
  line-height: 1.13;
  letter-spacing: -.047em;
  font-weight: 500;
}
.fz-story .fz-vision-hero .fz-h1 .fz-grad {
  background-image: linear-gradient(100deg, #e0ebff 2%, #a5c8ff 44%, #b7a6ff 100%);
}
.fz-story .fz-vision-hero .fz-hero__sub {
  max-width: 790px;
  margin-top: var(--hero-space);
  color: #b3bfd3;
  font-size: clamp(17px, 1.15vw, 22px);
  line-height: 1.55;
}
.fz-story .fz-vision-hero .fz-hero__actions { margin-top: calc(var(--hero-space) * 1.25); }
.fz-story .fz-vision-hero .fz-hero__actions .fz-btn {
  min-height: 56px;
  padding-inline: 28px;
  font-size: 17px;
}
.fz-story .fz-vision-hero .fz-hero-note {
  margin-top: calc(var(--hero-space) * .5);
  color: #bdc8dd;
  font-size: 14px;
  line-height: 1.6;
}
.fz-hero-offer-line { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 0 6px; }
.fz-hero-offer-prices { display: inline-flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.fz-hero-offer-prices del { color: #9eacc5; text-decoration-thickness: 1px; }
.fz-hero-offer-prices strong { color: #f2f4ff; font-size: 16px; font-weight: 600; }
/* The hero stays dark in both themes (like the $36 beside it), so the green is the dark-theme --fz-ok. */
.fz-hero-offer-save { align-self: center; padding: 2px 8px; border: 1px solid #7fd3b661; border-radius: 999px; background: #7fd3b621; color: #7fd3b6; font-size: 11.5px; font-weight: 600; line-height: 1.4; letter-spacing: .01em; }
.fz-hero-offer-monthly { display: block; margin-top: 2px; color: #a8b6ce; font-size: 12px; }
.fz-story .fz-vision-hero .fz-vision-preview { margin-top: calc(var(--hero-space) * 1.25); }
.fz-story .fz-vision-hero .fz-workspace-channels { margin-bottom: 0; }

@media (max-width: 767px) {
  .fz-story .fz-nav { height: 60px; }
  .fz-story .fz-nav__inner { width: calc(100% - 40px); }
  .fz-story .fz-nav__brand .fz-lockup { gap: 7px; }
  .fz-story .fz-nav__brand .fz-page-mark { width: 27px !important; height: 27px !important; }
  .fz-story .fz-nav__brand .fz-lockup > img { height: 22px !important; }
  .fz-story .fz-nav__actions > .fz-btn--primary { min-height: 38px; padding-inline: 12px; font-size: 12px; }
  /* Phone: 60px nav, 15px tagline; the same rhythm on a smaller unit. */
  .fz-story .fz-vision-hero { --hero-nav: 60px; --hero-tagline: 23px; --hero-space: clamp(12px, calc(5svh - 20px), 20px); --hero-peek: clamp(32px, 7svh, 64px); --hero-preview-h: clamp(460px, calc(100svh - var(--hero-chrome) - var(--hero-space) * 3.5), 680px); padding-bottom: 46px; }
  .fz-story .fz-vision-hero > .fz-hero__copy { width: calc(100% - 40px); }
  .fz-story .fz-vision-hero .fz-petal-home { width: 72px; height: 72px; }
  .fz-story .fz-hero-kicker { font-size: 13px; }
  .fz-story .fz-vision-hero .fz-h1 { max-width: 550px; font-size: clamp(32px, 8vw, 48px); line-height: 1.13; }
  .fz-story .fz-vision-hero .fz-hero__sub { max-width: 380px; font-size: 15px; line-height: 1.55; }
  .fz-story .fz-vision-hero .fz-hero__actions .fz-btn { min-height: 50px; padding-inline: 25px; font-size: 15px; }
  .fz-story .fz-vision-hero .fz-hero-note { font-size: 12px; line-height: 1.6; }
}
/* Under 600px the tab row stacks over "More soon". */
@media (max-width: 599px) { .fz-story .fz-vision-hero { --hero-tabs: 100px; } }

/* Mobile marks rotate in reserved space rather than crossing the copy. */
.fz-petal-waypoint > img { display: none; }
@media (max-width: 767px) {
  .fz-journey-petal { display: none; }
  .fz-story .fz-petal-home img { visibility: visible; animation: fz-turn 16s linear infinite; }
  .fz-story .fz-vision-hero .fz-petal-home { width: 88px; height: 88px; }
  .fz-showcase__mark .fz-petal-waypoint { height: 72px; width: 72px; top: 50%; left: calc(50% - 36px); transform: translateY(-50%); }
  .fz-showcase__mark .fz-petal-waypoint > img { display: block; width: 100%; height: 100%; animation: fz-turn 16s linear infinite; }
}
@media (prefers-reduced-motion: reduce) {
  .fz-story .fz-petal-home img, .fz-showcase__mark .fz-petal-waypoint > img { animation: none; }
}

/* The active step owns the main heading, with no duplicated caption or number. */
.fz-showcase--dynamic .fz-showcase__layout { grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: clamp(36px, 4vw, 68px); }
.fz-showcase--dynamic .fz-showcase__heading-stack { display: grid; }
.fz-showcase--dynamic .fz-showcase__heading-stack .fz-showcase__copy { grid-area: 1 / 1; align-self: center; pointer-events: none; }
.fz-showcase--dynamic .fz-showcase__eyebrow { display: block; margin-bottom: 20px; color: #a99bf7; font-size: 12px; font-weight: 500; letter-spacing: .06em; }
.founders .fz-showcase--dynamic .fz-showcase__copy h2 { font-size: clamp(34px, 3.3vw, 52px); line-height: 1.1; letter-spacing: -.045em; text-wrap: balance; }
.founders .fz-showcase--dynamic .fz-showcase__lede { margin-top: 22px; max-width: 460px; font-size: 15px; line-height: 1.7; }
.fz-showcase--dynamic .fz-showcase__intro > .fz-textlink { margin-top: 28px; }
.fz-showcase--dynamic .fz-showcase__navigation { margin-top: 44px; }
.fz-showcase--dynamic .fz-showcase__controls { justify-content: flex-end; }
.fz-showcase--dynamic .fz-showcase__viewport { padding-block: 42px; margin-block: -42px; }
.fz-showcase--dynamic .fz-showcase__frame { padding: 8px; border-color: #bacdff40; border-radius: 24px; box-shadow: inset 0 1px 0 #d9e5ff15, 0 22px 50px -30px #0007; }
.fz-showcase--dynamic .fz-showcase__frame > * { border-radius: 17px; aspect-ratio: 16 / 10; }
.fz-showcase--dynamic :is(button, a, [tabindex]):focus-visible { outline: 2px solid #b6a7ff; outline-offset: 5px; }
.fz-showcase--dynamic[data-mode='stack'] .fz-showcase__layout { display: block; width: min(900px, calc(100% - 48px)); }
.fz-showcase--dynamic[data-mode='stack'] .fz-showcase__track { gap: 90px; }
.fz-showcase--dynamic[data-mode='stack'] .fz-showcase__copy { max-width: 660px; margin: 0 auto 30px; text-align: center; }
.fz-showcase--dynamic[data-mode='stack'] .fz-showcase__lede { margin-inline: auto; max-width: 580px; }
.fz-showcase--dynamic .fz-showcase__end-cta { margin-top: 38px; text-align: center; }
@media(max-width:767px) {
  .fz-showcase--dynamic .fz-showcase__stage { padding-block: 64px; }
  .fz-showcase--dynamic[data-mode='stack'] .fz-showcase__layout { width: calc(100% - 36px); }
  .fz-showcase--dynamic[data-mode='stack'] .fz-showcase__track { gap: 72px; }
  .founders .fz-showcase--dynamic .fz-showcase__copy h2 { font-size: 34px; }
  .founders .fz-showcase--dynamic .fz-showcase__lede { font-size: 14px; margin-top: 18px; }
  .fz-showcase--dynamic .fz-showcase__eyebrow { margin-bottom: 14px; font-size: 11px; }
  .fz-showcase--dynamic .fz-showcase__frame { padding: 5px; border-radius: 20px; }
  .fz-showcase--dynamic .fz-showcase__frame > * { border-radius: 14px; }
}
@media(prefers-reduced-motion:reduce) {
  .fz-showcase--dynamic .fz-showcase__steps button > span { transition: none; }
}
.fz-founder-price-context { display: inline-flex; flex-direction: column; gap: 8px; margin-left: 16px; padding-bottom: 4px; white-space: nowrap; }
.fz-founder-price-context del { color: #a9b7d4; font-size: 30px; font-weight: 400; line-height: 1; letter-spacing: -.03em; text-decoration-thickness: 2px; text-shadow: none; }
.fz-founder-price .fz-founder-price-context .fz-founder-currency { margin-left: 0; }
.fz-founder-was { display: inline-flex; align-items: center; gap: 10px; }
/* Same pill as the hero's saving, a step larger to sit beside the struck price. */
.founders .fz-founder-save { padding: 4px 10px; border: 1px solid #7fd3b661; border-radius: 999px; background: #7fd3b621; color: #7fd3b6; font-size: 13px; font-weight: 600; line-height: 1.3; letter-spacing: .01em; text-shadow: none; }

/* The inline brand is the reliable home on tablets, phones and reduced-motion layouts. */
@media (max-width: 1099px), (max-height: 649px), (prefers-reduced-motion: reduce) {
  .fz-journey-petal { display: none; }
  .fz-story[data-journey-ready] .fz-petal-home img { visibility: visible; }
}
@media (prefers-reduced-motion: reduce) {
  .fz-journey-petal__spin { animation: none; }
}

/* Keep the price and CTA inside equal card padding on narrow phones. */
.fz-founder-benefits, .fz-founder-price-panel { min-width: 0; }
.fz-founder-plan { flex-wrap: wrap; }
@media (max-width: 374px) {
  .founders .fz-founder-price { font-size: 88px; }
  .fz-founder-price-context { margin-left: 12px; }
  .fz-founder-price-context del { font-size: 26px; }
  .fz-founder-price .fz-founder-currency { font-size: 16px; }
}