/* ============================================================================
   Flight Club Mastermind · site styles
   Tokens override scrollcraft.css. Everything below is this page's own markup;
   nothing here restyles .sc-stage, .sc-copy or any [data-sc-*] selector.
   ========================================================================== */

@font-face { font-family: "Montserrat"; font-weight: 400; font-display: swap; src: url("assets/fonts/Montserrat-Regular.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-weight: 500; font-display: swap; src: url("assets/fonts/Montserrat-Medium.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-weight: 600; font-display: swap; src: url("assets/fonts/Montserrat-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-weight: 400; font-display: swap; src: url("assets/fonts/Raleway-Regular.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-weight: 500; font-display: swap; src: url("assets/fonts/Raleway-Medium.woff2") format("woff2"); }
@font-face { font-family: "Raleway"; font-weight: 600; font-display: swap; src: url("assets/fonts/Raleway-SemiBold.woff2") format("woff2"); }
/* Metric-matched fallbacks so the swap does not move the hero copy. */
@font-face { font-family: "Montserrat Fallback"; src: local("Arial"); size-adjust: 113%; ascent-override: 96.8%; descent-override: 25.1%; line-gap-override: 0%; }
@font-face { font-family: "Raleway Fallback"; src: local("Arial"); size-adjust: 106%; ascent-override: 94%; descent-override: 23.4%; line-gap-override: 0%; }

:root {
  --sc-canvas:      #0a0b0f;
  --sc-surface:     #12141a;
  --sc-ink:         #f3f2ee;
  --sc-ink-soft:    #a2a8b4;
  --sc-accent:      #9ec5ff;
  --sc-accent-ink:  #0a0b0f;
  --sc-font-display: "Montserrat", "Montserrat Fallback", system-ui, sans-serif;
  --sc-font-text:    "Raleway", "Raleway Fallback", system-ui, sans-serif;
  --sc-font-mono:    "Montserrat", "Montserrat Fallback", system-ui, sans-serif;
  --sc-track-wide:   0.12em;
  --sc-r-sm: 4px; --sc-r-md: 8px; --sc-r-lg: 12px;
  --sc-maxw: 88rem;
  --fc-bar-h: 5.25rem;
}

body { font-weight: 400; }
.sc-display { font-weight: 500; }
.sc-display--xl, .sc-display--lg { letter-spacing: -0.03em; }
.sc-lede { font-family: var(--sc-font-text); font-weight: 400; color: var(--sc-ink); }
.sc-body { line-height: 1.6; }
strong { font-weight: 600; }
p { margin: 0; }
figure { margin: 0; }
img { height: auto; }

/* Narrow phones: step long display words down so nothing pushes past 320px. */
.fc-form__trap {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (max-width: 420px) {
  .sc-display--lg { font-size: var(--sc-t-2xl); }
  .sc-display { overflow-wrap: anywhere; }
}

/* Pre-engine geometry. scrollcraft.js sets the pinned act heights and the
   sticky stage on mount; declaring the same shape here means a late script
   causes no layout shift, the rail never widens the mobile viewport, and the
   hero copy is readable before JavaScript runs. The engine's inline styles
   take over afterwards. */
.fc-hero__copy[data-sc-cue] { opacity: 1; }
.sc-grain::before { inset: 0; }
.fc-alone  { height: 260vh; }
.fc-rail   { height: 300vh; }
.fc-values { height: 260vh; }
.fc-alone, .fc-rail, .fc-values { position: relative; }
[data-sc-stage] { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: clip; z-index: var(--sc-z-stage); }

/* Readers without JavaScript, and print, see every cue and reveal settled. */
.no-js [data-sc-cue], .no-js [data-sc-in], .no-js [data-sc-stagger] > * { opacity: 1 !important; transform: none !important; }
@media print {
  [data-sc-cue], [data-sc-in], [data-sc-stagger] > * { opacity: 1 !important; transform: none !important; }
  .fc-panel[hidden] { display: block !important; }
  .fc-pass--fixed, .sc-grain, [data-sc-progress] { display: none !important; }
}

/* In-page anchors land with a breath below the fixed bar. */
#reviews, #whyjoin, #members, #apply, #benefits, #story, #experience, #faq, #onboard { scroll-margin-top: var(--sc-4); }

/* ----------------------------------------------------------------- utility */
.fc-skip {
  position: fixed; top: 0; left: 0; z-index: 100;
  padding: var(--sc-3) var(--sc-4);
  background: var(--sc-accent); color: var(--sc-accent-ink);
  font-weight: 600; transform: translateY(-120%);
}
.fc-skip:focus-visible { transform: none; }
.fc-anchor { position: absolute; top: 0; }
.fc-eyebrow {
  font-family: var(--sc-font-display);
  font-size: var(--sc-t-xs); font-weight: 500;
  letter-spacing: var(--sc-track-wide); text-transform: uppercase;
  color: var(--sc-ink-soft);
}
.fc-head { max-width: 52rem; margin-bottom: var(--sc-8); }
.fc-head .sc-body { margin-top: var(--sc-4); }
.fc-h3 { font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-lg); letter-spacing: var(--sc-track-snug); line-height: 1.2; margin: 0; }

/* ----------------------------------------------------------------- buttons */
.fc-btn {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px;
  padding: 0.85rem 1.5rem;
  background: var(--sc-ink); color: var(--sc-accent-ink);
  font-family: var(--sc-font-display); font-weight: 600; font-size: 0.9rem;
  letter-spacing: 0.01em; line-height: 1.15; text-align: center;
  border: 0; border-radius: var(--sc-r-sm); cursor: pointer;
  text-decoration: none; white-space: nowrap;
  transition: transform 140ms var(--sc-ease-out), background-color 140ms var(--sc-ease-out);
}
.fc-btn small { font-family: var(--sc-font-text); font-weight: 500; font-size: 0.72rem; letter-spacing: 0.02em; opacity: 0.72; }
.fc-btn:hover { background: #ffffff; }
.fc-btn:active { transform: scale(0.97); }
.fc-btn--lg { padding: 1.05rem 1.9rem; font-size: 0.95rem; }
.fc-btn--sm { padding: 0.55rem 1rem; font-size: 0.82rem; }
@media (max-width: 480px) { .fc-btn { white-space: normal; width: 100%; } }

/* --------------------------------------------------------------------- bar */
.fc-bar {
  position: fixed; inset: 0 0 auto 0; z-index: var(--sc-z-chrome);
  height: var(--fc-bar-h);
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--sc-6);
  padding-inline: max(var(--sc-gutter), env(safe-area-inset-left)) max(var(--sc-gutter), env(safe-area-inset-right));
  padding-top: env(safe-area-inset-top);
  height: calc(var(--fc-bar-h) + env(safe-area-inset-top));
  color: var(--sc-ink);
  transition: background-color 240ms var(--sc-ease-out), backdrop-filter 240ms var(--sc-ease-out);
}
.fc-bar.is-solid {
  background: color-mix(in oklab, var(--sc-canvas) 78%, transparent);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 1px 0 var(--sc-hairline);
}
.fc-bar__mark { display: inline-flex; align-items: center; min-height: 44px; }
.fc-bar__mark img { width: auto; height: 2.6rem; }
.fc-bar__nav { display: flex; justify-content: center; gap: var(--sc-6); }
.fc-bar__nav a {
  font-family: var(--sc-font-display); font-size: 0.95rem; font-weight: 500;
  color: var(--sc-ink-soft); text-decoration: none;
  transition: color 140ms var(--sc-ease-out);
}
.fc-bar__nav a:hover, .fc-bar__nav a:focus-visible { color: var(--sc-ink); }
.fc-bar__menu {
  display: none; background: none; border: 1px solid var(--sc-hairline-strong);
  border-radius: var(--sc-r-sm); padding: 0.5rem 0.85rem;
  font-family: var(--sc-font-display); font-size: 0.82rem; font-weight: 500; cursor: pointer;
}
@media (max-width: 980px) {
  .fc-bar { grid-template-columns: auto 1fr auto; gap: var(--sc-3); }
  .fc-bar__menu { justify-self: end; min-height: 44px; padding: 0.6rem 1rem; }
  .fc-bar.is-open { touch-action: none; }
  /* The header's backdrop-filter makes it the containing block for fixed
     descendants, so the open menu is laid out inside a full-height header
     instead of being fixed on its own. */
  .fc-bar.is-open { height: 100svh; height: 100dvh; grid-template-rows: var(--fc-bar-h); align-content: start; overflow: hidden; }
  .fc-bar__nav {
    position: absolute; inset: var(--fc-bar-h) 0 0 0; overflow-y: auto;
    flex-direction: column; justify-content: flex-start; gap: 0;
    padding: var(--sc-6) var(--sc-gutter);
    background: var(--sc-canvas);
    padding-bottom: calc(var(--sc-6) + env(safe-area-inset-bottom));
    touch-action: pan-y; overscroll-behavior: contain;
    opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-6px);
    transition: opacity 200ms var(--sc-ease-out), transform 200ms var(--sc-ease-out), visibility 0s 200ms;
  }
  .fc-bar.is-open .fc-bar__nav { opacity: 1; visibility: visible; pointer-events: auto; transform: none; transition-delay: 0s; }
  .fc-bar__nav a { font-size: var(--sc-t-xl); padding: var(--sc-4) 0; border-bottom: 1px solid var(--sc-hairline); color: var(--sc-ink); }
  .fc-bar__menu { display: inline-block; }
  .fc-bar__cta { display: none; }
  .fc-bar.is-open { background: var(--sc-canvas); }
}

/* -------------------------------------------------------------------- hero */
.fc-hero {
  position: relative; min-height: 100svh;
  display: grid; align-items: end;
  overflow: clip;
  isolation: isolate;
}
.fc-hero__media { position: absolute; inset: -14% 0; z-index: 0; }
.fc-hero__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%;
  transform: scale(calc(1.02 + var(--sc-p, 0.5) * 0.12));
  transform-origin: 50% 60%;
}
/* The hero photograph is bright daylight (the balloon banner), so the scrim
   carries a top band for the bar and a strong base for the copy. */
.fc-hero__scrim {
  z-index: 1;
  background:
    linear-gradient(to bottom, rgba(10,11,15,0.62) 0%, rgba(10,11,15,0.25) 12%, transparent 24%),
    radial-gradient(78% 95% at 18% 82%, rgba(10,11,15,0.96) 0%, rgba(10,11,15,0.82) 42%, rgba(10,11,15,0.42) 66%, transparent 82%),
    linear-gradient(to top, rgba(10,11,15,0.97) 0%, rgba(10,11,15,0.9) 26%, rgba(10,11,15,0.66) 50%, rgba(10,11,15,0.32) 72%, rgba(10,11,15,0.08) 100%);
}
.fc-hero__copy {
  position: relative; z-index: 2;
  padding-top: calc(var(--fc-bar-h) + var(--sc-8));
  padding-bottom: clamp(2rem, 5vh, 3.5rem);
}
.fc-hero__kicker {
  font-family: var(--sc-font-display); font-size: var(--sc-t-xs); font-weight: 500;
  letter-spacing: var(--sc-track-wide); text-transform: uppercase; color: var(--sc-ink-soft);
  margin-bottom: var(--sc-5);
}
/* The masthead: FLIGHT CLUB in big magazine caps, left-justified, sized by
   viewport so the two words always hold one line above the headline. */
.fc-hero__mast {
  font-family: var(--sc-font-display); font-weight: 600; text-transform: uppercase;
  font-size: clamp(2.5rem, 10vw, 9.75rem);
  line-height: 0.92; letter-spacing: -0.03em; color: var(--sc-ink);
  white-space: nowrap;
}
.fc-hero__title { max-width: 24ch; font-size: var(--sc-t-3xl); margin-top: var(--sc-5); }
.fc-hero__def { max-width: 58ch; margin-top: var(--sc-5); color: var(--sc-ink-soft); font-size: var(--sc-t-sm); line-height: 1.55; text-wrap: pretty; }
.fc-hero__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sc-5) var(--sc-7); margin-top: var(--sc-7); }
.fc-hero__dates { font-size: var(--sc-t-sm); color: var(--sc-ink); font-weight: 500; }
.fc-hero__dates span { display: block; font-family: var(--sc-font-display); font-size: var(--sc-t-xs); letter-spacing: var(--sc-track-wide); text-transform: uppercase; color: var(--sc-ink-soft); margin-bottom: 0.25rem; }
@media (max-width: 700px) {
  .fc-hero__title { font-size: var(--sc-t-2xl); max-width: none; }
  .fc-hero__copy { padding-bottom: var(--sc-7); }
  .fc-hero__def { font-size: var(--sc-t-xs); }
}
@media (max-width: 860px) { .fc-hero__media { inset: -6% 0; } }
@media (max-width: 420px) { .fc-hero__title { font-size: var(--sc-t-xl); } }
/* Mid-height desktop windows (laptop browsers around 700-880px tall): scale
   the hero down so the masthead, headline, definition, CTA and dates all sit
   above the fold. */
@media (min-width: 701px) and (max-height: 880px) {
  .fc-hero__mast { font-size: clamp(2.5rem, 12svh, 8rem); }
  .fc-hero__title { font-size: var(--sc-t-2xl); max-width: 26ch; margin-top: var(--sc-4); }
  .fc-hero__def { font-size: var(--sc-t-xs); }
  .fc-hero__row { margin-top: var(--sc-5); }
  .fc-hero__copy { padding-top: calc(var(--fc-bar-h) + var(--sc-5)); padding-bottom: clamp(1.5rem, 4vh, 3rem); }
}

/* Short viewports (small phones, landscape phones): keep the CTA in the first
   screen and stop the rail cards from clipping under the bar. */
@media (max-height: 640px) {
  .fc-hero__mast { font-size: 2.2rem; }
  .fc-hero__title { font-size: var(--sc-t-xl); }
  .fc-hero__copy { padding-top: calc(var(--fc-bar-h) + var(--sc-4)); }
  .fc-hero__def { display: none; }
  .fc-pillar__fig { display: none; }
  .fc-rail__stage { padding-top: var(--fc-bar-h); box-sizing: border-box; }
}

/* ------------------------------------------------------------------- alone */
.fc-alone__stage { background: #07080b; }
.fc-alone__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; opacity: 0.9; }
.fc-alone__scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(7,8,11,0.96) 0%, rgba(7,8,11,0.86) 34%, rgba(7,8,11,0.42) 58%, rgba(7,8,11,0.1) 100%),
    linear-gradient(0deg, rgba(7,8,11,0.6) 0%, transparent 40%);
}
.fc-alone__lines { position: absolute; z-index: 2; inset-inline: var(--sc-gutter); top: 50%; translate: 0 -50%; max-width: min(42rem, 88vw); }
.fc-alone__lines p { position: absolute; top: 0; left: 0; right: 0; translate: 0 -50%; margin: 0; }
.fc-alone__lines p:last-child { color: var(--sc-ink); }
/* Scroll ticks on the pinned scenes: one segment per headline, filling with
   the scroll (the engine publishes --sc-p on the section) so every wheel tick
   visibly moves something and the pin never feels stuck. */
.fc-ticks { position: absolute; z-index: 3; left: var(--sc-gutter); display: flex; gap: 0.5rem; }
.fc-alone .fc-ticks { left: auto; right: var(--sc-gutter); bottom: clamp(2.75rem, 9vh, 5rem); }
@media (min-width: 1100px) { .fc-alone .fc-ticks { left: var(--sc-gutter); right: auto; bottom: auto; top: calc(50% + clamp(12rem, 26vh, 15rem)); } }
/* Phones: the play button owns the bottom strip, so the ticks sit above it. */
@media (max-width: 700px) { .fc-alone .fc-ticks { bottom: calc(clamp(2.75rem, 9vh, 5rem) + 7rem); } }
.fc-values .fc-ticks { bottom: clamp(1.25rem, 4vh, 2.25rem); }
.fc-ticks i {
  position: relative; width: clamp(2.25rem, 4vw, 3.5rem); height: 3px; border-radius: 999px;
  background: color-mix(in oklab, var(--sc-ink) 16%, transparent); overflow: hidden;
}
.fc-ticks i::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit;
  background: var(--fc-grad, var(--sc-accent));
  transform-origin: 0 50%;
  transform: scaleX(clamp(0, calc(var(--sc-p, 0) * var(--n, 4) - var(--k, 0)), 1));
}

/* The story's play affordance, pinned through the whole scene. Wide screens
   set it over the window view at right-center (clear of the text lines);
   below 1100px the lines span most of the width, so it drops to bottom-left. */
.fc-alone__play {
  position: absolute; z-index: 3;
  left: var(--sc-gutter); bottom: clamp(2.5rem, 9vh, 5rem);
  display: inline-flex; align-items: center; gap: var(--sc-5);
  background: none; border: 0; padding: 0; cursor: pointer;
  color: var(--sc-ink); font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-base);
  text-align: left;
}
@media (min-width: 1100px) {
  .fc-alone__play { left: auto; bottom: auto; right: clamp(3rem, 9vw, 8rem); top: 50%; translate: 0 -50%; }
}
.fc-alone__play-icon {
  position: relative; flex: none; width: 7rem; height: 7rem; border-radius: 50%;
  background: var(--fc-grad-btn, var(--sc-accent));
  border: 0;
  box-shadow:
    0 0 44px color-mix(in oklab, var(--sc-accent) 55%, transparent),
    0 14px 34px rgba(0, 0, 0, 0.5);
  transition: transform 180ms var(--sc-ease-out), box-shadow 180ms var(--sc-ease-out);
  animation: fc-play-pulse 2.6s var(--sc-ease-out) infinite;
}
.fc-alone__play-icon::after { content: ""; position: absolute; left: 55%; top: 50%; translate: -50% -50%; border-left: 1.75rem solid #fff; border-top: 1.1rem solid transparent; border-bottom: 1.1rem solid transparent; }
@keyframes fc-play-pulse {
  0%, 100% { box-shadow: 0 0 44px color-mix(in oklab, var(--sc-accent) 55%, transparent), 0 14px 34px rgba(0,0,0,0.5); }
  50% { box-shadow: 0 0 70px color-mix(in oklab, var(--sc-accent) 80%, transparent), 0 14px 34px rgba(0,0,0,0.5); }
}
@media (prefers-reduced-motion: reduce) { .fc-alone__play-icon { animation: none; } }
@media (max-width: 700px) { .fc-alone__play-icon { width: 5rem; height: 5rem; } .fc-alone__play-icon::after { border-left: 1.3rem solid #fff; border-top: 0.82rem solid transparent; border-bottom: 0.82rem solid transparent; } .fc-alone__play { font-size: var(--sc-t-sm); } }
.fc-alone__play:hover .fc-alone__play-icon, .fc-alone__play:focus-visible .fc-alone__play-icon { transform: scale(1.07); filter: brightness(1.1); }
.fc-alone__play-text { display: grid; gap: 2px; }
.fc-alone__play-text small { font-family: var(--sc-font-text); font-weight: 400; font-size: var(--sc-t-xs); color: var(--sc-ink-soft); }
.no-js .fc-alone__play { display: none; }

/* The video modal: dimmed backdrop, one 16:9 frame. */
.fc-modal { border: 0; padding: 0; background: transparent; width: min(72rem, 92vw); max-width: none; overflow: visible; }
.fc-modal::backdrop { background: rgba(4, 5, 9, 0.84); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.fc-modal__frame { aspect-ratio: 16 / 9; background: #000; border-radius: var(--sc-r-md); overflow: clip; box-shadow: var(--sc-e2); }
.fc-modal__frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.fc-modal__close {
  position: absolute; right: 0; top: -3rem;
  background: none; border: 1px solid color-mix(in oklab, var(--sc-ink) 40%, transparent); border-radius: 50%;
  width: 2.4rem; height: 2.4rem; display: grid; place-items: center;
  color: var(--sc-ink); font-size: 1rem; line-height: 1; cursor: pointer;
}
.fc-modal__close:hover { border-color: var(--sc-ink); }
html.fc-noscroll { overflow: hidden; }

/* Cursor glow: site.js wraps every photograph in .fc-glow. The accent light
   sits BEHIND the media and spills around its edges near the cursor; it never
   washes over the picture itself. Very slight scale on hover. Hover-capable
   pointers only (the wrapper is never added otherwise). */
.fc-glow { position: relative; display: block; --fc-glow-pad: 2.25rem; }
.fc-glow > img { position: relative; z-index: 1; display: block; transition: transform 600ms var(--sc-ease-out); }
.fc-glow::after {
  content: ""; position: absolute; inset: calc(var(--fc-glow-pad) * -1); pointer-events: none; z-index: 0;
  background: radial-gradient(24rem 24rem at calc(var(--gx, 50%) + var(--fc-glow-pad)) calc(var(--gy, 50%) + var(--fc-glow-pad)),
    color-mix(in oklab, var(--sc-accent) 45%, transparent), transparent 70%);
  opacity: 0; transition: opacity 300ms var(--sc-ease-out);
}
.fc-glow:hover::after { opacity: 1; }
.fc-glow:hover > img { transform: scale(1.025); }
.fc-video__play .fc-glow, .fc-video__play .fc-glow > img { width: 100%; height: 100%; }
.fc-glimpses .fc-glow { break-inside: avoid; margin-bottom: var(--sc-4); }
.fc-glimpses .fc-glow > img { margin-bottom: 0; }
@media (max-width: 700px) {
  .fc-alone__play { bottom: clamp(2rem, 7vh, 3.5rem); }
  .fc-modal { width: 96vw; }
  .fc-modal__close { top: -2.8rem; }
}
@media (max-width: 700px) {
  .fc-alone__lines p { font-size: var(--sc-t-2xl); }
  .fc-alone__img { object-position: 70% 50%; opacity: 0.8; }
  .fc-alone__scrim {
    background:
      linear-gradient(180deg, rgba(7,8,11,0.5) 0%, rgba(7,8,11,0.9) 28%, rgba(7,8,11,0.92) 70%, rgba(7,8,11,0.75) 100%);
  }
}

/* -------------------------------------------------------------------- turn */
.fc-turn { padding-block: var(--sc-8) var(--sc-section); }
.fc-turn__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: var(--sc-9); align-items: center; }
.fc-turn__copy .sc-body + .sc-body { margin-top: var(--sc-4); }
.fc-turn__fig img { width: 100%; height: auto; border-radius: var(--sc-r-md); }
.fc-turn__fig figcaption { margin-top: var(--sc-3); font-size: var(--sc-t-xs); color: var(--sc-ink-soft); letter-spacing: 0.02em; }
.fc-facts {
  display: flex; flex-wrap: wrap; gap: var(--sc-3) 0;
  margin-top: var(--sc-9); padding-top: var(--sc-5);
  border-top: 1px solid var(--sc-hairline);
  font-family: var(--sc-font-display); font-size: var(--sc-t-sm); font-weight: 500;
}
.fc-facts span { padding-right: var(--sc-6); }
.fc-facts span + span::before { content: "·"; color: var(--sc-ink-soft); padding-right: var(--sc-6); }
@media (max-width: 900px) { .fc-turn__grid { grid-template-columns: 1fr; gap: var(--sc-7); } .fc-facts span + span::before { content: none; } .fc-facts span { padding-right: var(--sc-5); } }

/* -------------------------------------------------------------------- rail */
.fc-rail__stage { display: flex; align-items: center; }
.fc-rail__track { display: flex; align-items: center; gap: clamp(2rem, 5vw, 5rem); padding-inline: var(--sc-gutter); }
.fc-rail__lead { flex: 0 0 auto; width: clamp(18rem, 36vw, 34rem); }
.fc-rail__lead .sc-lede { margin-top: var(--sc-5); }
.fc-pillar { flex: 0 0 auto; width: clamp(16rem, 27vw, 25rem); }
.fc-pillar .sc-body { font-size: var(--sc-t-sm); }
.fc-pillar__fig img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--sc-r-md); }
.fc-pillar__title { font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-xl); letter-spacing: var(--sc-track-snug); line-height: 1.1; margin: var(--sc-5) 0 var(--sc-3); }
.fc-pillar__line { font-weight: 500; color: var(--sc-ink); margin-bottom: var(--sc-3); }
.fc-rail__close { flex: 0 0 auto; width: clamp(16rem, 27vw, 25rem); margin-right: var(--sc-gutter); }
.fc-rail__close .sc-lede { margin-top: var(--sc-5); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .fc-pillar__fig { opacity: clamp(0.55, calc(0.55 + (var(--sc-p, 0) - (var(--i) - 1) * 0.16) * 3), 1); }
}
@media (max-width: 600px) {
  .fc-rail__track { gap: var(--sc-6); }
  .fc-rail__lead { width: min(82vw, 22rem); }
  .fc-pillar { width: min(78vw, 20rem); }
  .fc-pillar .sc-body { font-size: var(--sc-t-sm); }
}
@media (prefers-reduced-motion: reduce) {
  .fc-rail__track { align-items: flex-start; padding-block: calc(var(--fc-bar-h) + var(--sc-5)) var(--sc-7); }
  .fc-rail__stage { align-items: flex-start; }
}

/* --------------------------------------------------------------------- you */
.fc-you { position: relative; min-height: 100svh; display: grid; align-items: center; padding-block: var(--sc-section); overflow: clip; }
.fc-you__bg { position: absolute; inset: 0; z-index: 0; }
.fc-you__img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity 700ms var(--sc-ease-out), transform 1600ms var(--sc-ease-out);
  transform: scale(1.04);
}
.fc-you__img.is-on { opacity: 1; transform: none; }
.fc-you__scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(10,11,15,0.97) 0%, rgba(10,11,15,0.92) 48%, rgba(10,11,15,0.55) 74%, rgba(10,11,15,0.3) 100%),
    linear-gradient(180deg, rgba(10,11,15,0.7) 0%, transparent 30%, transparent 70%, rgba(10,11,15,0.8) 100%);
}
.fc-you__inner { position: relative; z-index: 2; }
.fc-you__head { max-width: 46rem; margin-bottom: var(--sc-8); }
.fc-you__head .sc-lede { margin-top: var(--sc-4); color: var(--sc-ink-soft); }
.fc-you__body { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: var(--sc-9); align-items: start; }
.fc-tabs { display: flex; flex-direction: column; border-top: 1px solid var(--sc-hairline); }
.fc-tab {
  appearance: none; background: none; border: 0; border-bottom: 1px solid var(--sc-hairline);
  padding: var(--sc-5) var(--sc-5) var(--sc-5) var(--sc-6);
  text-align: left; cursor: pointer; position: relative;
  font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-lg);
  line-height: 1.25; letter-spacing: var(--sc-track-snug); color: var(--sc-ink-soft);
  transition: color 160ms var(--sc-ease-out), background-color 160ms var(--sc-ease-out);
}
.fc-tab::before {
  content: ""; position: absolute; left: 0; top: 50%; translate: 0 -50%;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--sc-ink-soft); opacity: 0.4;
  transition: opacity 160ms var(--sc-ease-out), background-color 160ms var(--sc-ease-out), transform 300ms var(--sc-ease-out);
}
.fc-tab:hover { color: var(--sc-ink); }
.fc-tab[aria-selected="true"] { color: var(--sc-ink); }
.fc-tab[aria-selected="true"]::before { background: var(--sc-accent); opacity: 1; transform: scale(1.6); }
.fc-tab:focus-visible { outline-offset: -3px; }
.fc-panel__title { font-family: var(--sc-font-display); font-size: var(--sc-t-xs); font-weight: 500; letter-spacing: var(--sc-track-wide); text-transform: uppercase; color: var(--sc-accent); margin: 0 0 var(--sc-5); }
.fc-panel__steps { display: grid; gap: var(--sc-4); max-width: 58ch; }
.fc-panel__steps p { color: var(--sc-ink-soft); text-wrap: pretty; }
.fc-panel__steps p:first-child { color: var(--sc-ink); font-size: var(--sc-t-lg); line-height: 1.4; font-weight: 500; }
.fc-panel__steps p:last-child { color: var(--sc-ink); }
.fc-panel .fc-btn { margin-top: var(--sc-6); }
.fc-panel { animation: fc-panel-in 420ms var(--sc-ease-out) both; }
@keyframes fc-panel-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (max-width: 900px) {
  .fc-you__body { grid-template-columns: 1fr; gap: var(--sc-7); }
  .fc-tab { font-size: var(--sc-t-base); padding: var(--sc-4) var(--sc-4) var(--sc-4) var(--sc-5); }
  .fc-you__scrim { background: linear-gradient(180deg, rgba(10,11,15,0.92) 0%, rgba(10,11,15,0.9) 60%, rgba(10,11,15,0.96) 100%); }
}

/* ----------------------------------------------------------------- reviews */
.fc-vgrid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: auto; gap: var(--sc-4); grid-auto-flow: dense; }
.fc-video { grid-column: span 4; position: relative; }
.fc-video--tall { grid-column: span 4; grid-row: span 2; }
.fc-video__play {
  position: relative; display: block; width: 100%; padding: 0; border: 0; cursor: pointer;
  background: none; border-radius: var(--sc-r-md); overflow: visible;
  aspect-ratio: 16 / 9;
}
.fc-video__play img { border-radius: var(--sc-r-md); background: var(--sc-surface); }
.fc-video--tall .fc-video__play { aspect-ratio: 3 / 4; height: 100%; }
.fc-video__play img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--sc-ease-out), opacity 300ms var(--sc-ease-out); }
.fc-video__play:hover img { transform: scale(1.03); }
/* Small and quiet at rest so the tile clearly reads as a video; on hover it
   grows into the primary-gradient play circle. */
.fc-video__icon {
  position: absolute; left: 50%; top: 50%; translate: -50% -50%; z-index: 2;
  width: 2.75rem; height: 2.75rem; border-radius: 50%;
  background: color-mix(in oklab, var(--sc-canvas) 60%, transparent);
  border: 1px solid color-mix(in oklab, var(--sc-ink) 45%, transparent);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  transition: transform 220ms var(--sc-ease-out), background 220ms var(--sc-ease-out), border-color 220ms var(--sc-ease-out), box-shadow 220ms var(--sc-ease-out);
}
.fc-video__icon::after { content: ""; position: absolute; left: 54%; top: 50%; translate: -50% -50%; border-left: 0.7rem solid #fff; border-top: 0.45rem solid transparent; border-bottom: 0.45rem solid transparent; }
.fc-video__play:hover .fc-video__icon, .fc-video__play:focus-visible .fc-video__icon {
  transform: scale(1.65);
  background: var(--fc-grad-btn, var(--sc-accent)); border-color: transparent;
  box-shadow: 0 0 26px color-mix(in oklab, var(--sc-accent) 60%, transparent);
}
.fc-video__time {
  position: absolute; right: 0.6rem; bottom: 0.6rem; z-index: 2;
  font-family: var(--sc-font-display); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.04em;
  color: #fff; background: rgba(5, 6, 10, 0.72); padding: 0.22rem 0.55rem; border-radius: 999px;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.fc-video.is-playing .fc-video__time { visibility: hidden; }
.fc-video figcaption { display: flex; flex-direction: column; gap: 2px; margin-top: var(--sc-3); font-size: var(--sc-t-sm); }
.fc-video figcaption strong { font-family: var(--sc-font-display); font-weight: 500; color: var(--sc-ink); }
.fc-video figcaption span { color: var(--sc-ink-soft); font-size: var(--sc-t-xs); }
.fc-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--sc-r-md); }
.fc-video.is-playing .fc-video__play { visibility: hidden; }
.fc-video__frame { position: absolute; inset: 0; border-radius: var(--sc-r-md); overflow: hidden; z-index: 1; }
.fc-video--tall .fc-video__frame { bottom: 2.6rem; }
@media (max-width: 900px) {
  .fc-video, .fc-video--feature, .fc-video--tall { grid-column: span 6; grid-row: auto; }
  .fc-video--feature { grid-column: span 12; }
  .fc-video--tall .fc-video__play { aspect-ratio: 16 / 9; height: auto; }
  .fc-video--tall .fc-video__frame { bottom: 0; }
}
@media (max-width: 520px) { .fc-video, .fc-video--tall { grid-column: span 12; } }

/* ---------------------------------------------------------------- benefits */
.fc-spec { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sc-9); margin: 0; border-top: 1px solid var(--sc-hairline); }
.fc-spec > div { padding: var(--sc-5) 0; border-bottom: 1px solid var(--sc-hairline); }
.fc-spec dt { font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-lg); letter-spacing: var(--sc-track-snug); line-height: 1.2; }
.fc-spec dd { margin: var(--sc-2) 0 0; color: var(--sc-ink-soft); max-width: 48ch; }
.fc-pilot { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--sc-9); align-items: center; margin-top: var(--sc-10); }
.fc-pilot__fig img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; border-radius: var(--sc-r-md); }
.fc-pilot__copy .fc-btn { margin-top: var(--sc-5); }
@media (max-width: 900px) { .fc-spec { grid-template-columns: 1fr; } .fc-pilot { grid-template-columns: 1fr; gap: var(--sc-7); } .fc-pilot__fig img { aspect-ratio: 16 / 10; } }

/* ------------------------------------------------------------------- story */
.fc-story__grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--sc-9); align-items: start; }
.fc-story__fig { position: sticky; top: calc(var(--fc-bar-h) + var(--sc-6)); }
.fc-story__fig img { width: 100%; height: auto; border-radius: var(--sc-r-md); }
.fc-story__fig figcaption { margin-top: var(--sc-3); font-size: var(--sc-t-xs); color: var(--sc-ink-soft); letter-spacing: 0.02em; }
.fc-story__copy .sc-body + .sc-body { margin-top: var(--sc-4); }
@media (max-width: 900px) { .fc-story__grid { grid-template-columns: 1fr; gap: var(--sc-7); } .fc-story__fig { position: static; max-width: 24rem; } }

/* -------------------------------------------------------------- experience */
.fc-exp__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--sc-7) var(--sc-5); }
.fc-exp__item { grid-column: span 2; }
.fc-exp__item--wide { grid-column: span 3; }
.fc-exp__item img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--sc-r-md); }
.fc-exp__item--wide img { aspect-ratio: 16 / 9; }
.fc-exp__item h3 { font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-lg); letter-spacing: var(--sc-track-snug); line-height: 1.2; margin: var(--sc-5) 0 var(--sc-3); }
.fc-exp__item p { color: var(--sc-ink-soft); font-size: var(--sc-t-sm); max-width: 46ch; }
@media (max-width: 900px) { .fc-exp__item, .fc-exp__item--wide { grid-column: span 3; } }
@media (max-width: 560px) { .fc-exp__item, .fc-exp__item--wide { grid-column: span 6; } }
.fc-glimpses { columns: 4; column-gap: var(--sc-4); margin-top: var(--sc-10); }
.fc-glimpses img { width: 100%; height: auto; margin-bottom: var(--sc-4); border-radius: var(--sc-r-sm); break-inside: avoid; }
@media (max-width: 900px) { .fc-glimpses { columns: 3; } }
@media (max-width: 560px) { .fc-glimpses { columns: 2; } }

/* ------------------------------------------------------------------ values */
.fc-values__stage { background: #0b0c11; }
.fc-values__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; opacity: 0.78; }
.fc-values__scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(11,12,17,0.15) 0%, rgba(11,12,17,0.55) 40%, rgba(11,12,17,0.94) 72%, rgba(11,12,17,0.98) 100%); }
.fc-values__list { position: absolute; z-index: 2; inset-inline: var(--sc-gutter); bottom: clamp(3rem, 12vh, 8rem); max-width: min(46rem, 88vw); }
.fc-value { position: absolute; bottom: 0; left: 0; right: 0; }
.fc-value .sc-lede { margin-top: var(--sc-5); color: var(--sc-ink); }
@media (max-width: 700px) { .fc-value h2 { font-size: var(--sc-t-2xl); } .fc-value .sc-lede { font-size: var(--sc-t-base); } }

/* ------------------------------------------------------------------ roster */
.fc-roster__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(7.25rem, 1fr)); gap: var(--sc-5) var(--sc-3); }
.fc-roster__grid li { display: flex; flex-direction: column; gap: var(--sc-2); }
.fc-roster__grid img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--sc-r-sm); }
.fc-roster__grid strong { font-family: var(--sc-font-display); font-weight: 500; font-size: 0.78rem; line-height: 1.2; letter-spacing: -0.01em; }
.fc-roster__grid span { font-size: 0.75rem; line-height: 1.3; color: var(--sc-ink-soft); }
@media (max-width: 480px) { .fc-roster__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sc-4) var(--sc-2); } .fc-roster__grid strong { font-size: 0.7rem; } .fc-roster__grid span { font-size: 0.62rem; } }
/* Roster hover: every member at full colour all the time; the one under the
   cursor grows and takes an accent glow. Hover-capable devices only. */
@media (hover: hover) and (pointer: fine) {
  .fc-roster__grid li { position: relative; }
  .fc-roster__grid li:hover { z-index: 1; }
  .fc-roster__grid img {
    transform: scale(1);
    transition: transform 220ms var(--sc-ease-out), box-shadow 220ms var(--sc-ease-out);
    will-change: transform;
  }
  .fc-roster__grid li:hover img {
    transform: scale(1.12);
    box-shadow:
      0 0 30px color-mix(in oklab, var(--sc-accent) 50%, transparent),
      0 12px 30px rgba(0,0,0,0.45);
  }
  .fc-roster__grid span { transition: color 180ms var(--sc-ease-out); }
  .fc-roster__grid li:hover span { color: var(--sc-accent); }
}
}
@media (prefers-reduced-motion: reduce) {
  .fc-roster__grid li:hover img { transform: none; }
}

/* -------------------------------------------------------------------- love */
.fc-quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sc-8) var(--sc-9); }
.fc-quote--lead { grid-column: 1 / -1; }
.fc-quote blockquote { margin: 0; color: var(--sc-ink); text-wrap: pretty; }
.fc-quote--lead blockquote { max-width: 30ch; font-weight: 500; }
.fc-quote:not(.fc-quote--lead) blockquote { font-size: var(--sc-t-lg); line-height: 1.45; letter-spacing: var(--sc-track-snug); max-width: 40ch; }
.fc-quote figcaption { display: flex; align-items: center; gap: var(--sc-4); margin-top: var(--sc-5); font-size: var(--sc-t-sm); color: var(--sc-ink-soft); }
.fc-quote figcaption img { width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover; }
.fc-quote figcaption strong { display: block; font-family: var(--sc-font-display); font-weight: 500; color: var(--sc-ink); }
@media (max-width: 760px) { .fc-quotes { grid-template-columns: 1fr; gap: var(--sc-7); } }
.fc-steps { margin-top: var(--sc-11); }
.fc-steps__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--sc-hairline); }
.fc-steps__list li { display: grid; grid-template-columns: 5rem minmax(0, 24rem) minmax(0, 1fr); gap: var(--sc-5); align-items: baseline; padding: var(--sc-6) 0; border-bottom: 1px solid var(--sc-hairline); }
.fc-steps__num { font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-xl); letter-spacing: -0.02em; color: var(--sc-accent); font-variant-numeric: tabular-nums; }
.fc-steps__list h3 { margin: 0; font-family: var(--sc-font-display); font-weight: 500; font-size: var(--sc-t-lg); letter-spacing: var(--sc-track-snug); line-height: 1.2; }
.fc-steps__list p { color: var(--sc-ink-soft); max-width: 52ch; }
@media (max-width: 760px) { .fc-steps__list li { grid-template-columns: 3.5rem minmax(0, 1fr); } .fc-steps__list p { grid-column: 2; } }

/* ------------------------------------------------------------------- close */
.fc-close { position: relative; padding-top: var(--sc-section); background: #08090c; isolation: isolate; }
.fc-close__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: var(--sc-9); align-items: center; padding-bottom: var(--sc-section); }
.fc-close__pass { display: flex; justify-content: center; }
.fc-form { margin-top: var(--sc-6); display: grid; gap: var(--sc-5); max-width: 40rem; }
.fc-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sc-4); }
.fc-field { display: grid; gap: var(--sc-2); }
.fc-field span { font-family: var(--sc-font-display); font-size: var(--sc-t-xs); font-weight: 500; letter-spacing: var(--sc-track-wide); text-transform: uppercase; color: var(--sc-ink-soft); }
.fc-field input {
  width: 100%; padding: 0.9rem 1rem;
  background: var(--sc-surface); color: var(--sc-ink);
  border: 1px solid var(--sc-hairline-strong); border-radius: var(--sc-r-sm);
  transition: border-color 140ms var(--sc-ease-out);
}
.fc-field input:focus { border-color: var(--sc-accent); outline: none; }
.fc-field input:focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 2px; }
.fc-field input[aria-invalid="true"] { border-color: #ff8a80; }
.fc-check { display: grid; grid-template-columns: auto 1fr; gap: var(--sc-3); align-items: start; font-size: var(--sc-t-sm); color: var(--sc-ink-soft); cursor: pointer; }
.fc-check input { margin: 0.1rem 0 0; width: 1.4rem; height: 1.4rem; }
.fc-form .fc-btn { justify-self: start; }
.fc-form__note { font-size: var(--sc-t-sm); color: var(--sc-ink-soft); min-height: 1.5em; }
.fc-form__note.is-error { color: #ffb3ad; }
.fc-form__note.is-ok { color: var(--sc-ink); }
@media (max-width: 900px) { .fc-close__grid { grid-template-columns: 1fr; gap: var(--sc-8); } .fc-close__pass { justify-content: flex-start; } }
@media (max-width: 560px) { .fc-form__row { grid-template-columns: 1fr; } .fc-form .fc-btn { justify-self: stretch; } }

/* -------------------------------------------------------------------- pass */
.fc-pass--fixed {
  position: fixed; right: clamp(1rem, 2.5vw, 2.5rem); bottom: clamp(1rem, 2.5vw, 2.5rem);
  z-index: calc(var(--sc-z-chrome) - 1);
  width: 17.5rem;
  opacity: 0; transform: translateY(12px) scale(0.98);
  transition: opacity 320ms var(--sc-ease-out), transform 320ms var(--sc-ease-out);
  pointer-events: none;
}
.fc-pass--fixed:not(.is-on) { visibility: hidden; transition: opacity 320ms var(--sc-ease-out), transform 320ms var(--sc-ease-out), visibility 0s 320ms; }
.fc-pass--fixed.is-on { opacity: 1; transform: none; pointer-events: auto; }
.fc-pass--fixed[hidden] { display: none; }
/* Compact by default so it never sits on top of copy; the full card opens on
   hover, focus, click, or for a moment when something new lands on it. */
.fc-pass--fixed .fc-pass__card {
  position: absolute; right: 0; bottom: 0; width: 17.5rem;
  opacity: 0; transform: translateY(8px) scale(0.98); transform-origin: 100% 100%;
  pointer-events: none;
  transition: opacity 260ms var(--sc-ease-out), transform 260ms var(--sc-ease-out);
}
.fc-pass--fixed.is-expanded .fc-pass__card { opacity: 1; transform: none; pointer-events: auto; }
.fc-pass__mini {
  display: flex; align-items: center; gap: 0.7rem;
  margin-left: auto;
  padding: 0.55rem 0.8rem 0.55rem 0.9rem;
  background: linear-gradient(160deg, #f6f4ee, #e9e6dd);
  color: #14161c; border: 0; border-radius: var(--sc-r-sm);
  box-shadow: var(--sc-e2), var(--sc-edge);
  font-family: var(--sc-font-display); cursor: pointer;
  transition: opacity 200ms var(--sc-ease-out), transform 200ms var(--sc-ease-out);
}
.fc-pass--fixed.is-expanded .fc-pass__mini { opacity: 0; pointer-events: none; transform: translateY(6px); }
.fc-pass__mini-type { font-size: 0.58rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #1e2452; }
.fc-pass__mini-alt { font-size: 0.78rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.fc-pass__mini-dots { display: flex; gap: 4px; }
.fc-pass__mini-dots i { width: 6px; height: 6px; border-radius: 50%; background: #c8c4b8; transition: background-color 300ms var(--sc-ease-out); }
.fc-pass__mini-dots i.is-stamped { background: #1e2452; }
.fc-pass--fixed { display: flex; justify-content: flex-end; width: 17.5rem; }
@media (max-width: 1100px), (max-height: 640px) { .fc-pass--fixed { display: none !important; } }
.fc-pass--dock { width: min(100%, 22rem); }
.fc-pass__card {
  position: relative;
  background: linear-gradient(160deg, #f6f4ee 0%, #e9e6dd 100%);
  color: #14161c;
  border-radius: var(--sc-r-md);
  padding: var(--sc-4) var(--sc-5) var(--sc-4);
  box-shadow: var(--sc-e3), var(--sc-edge);
  font-family: var(--sc-font-display);
  overflow: hidden;
}
.fc-pass__card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 4px;
  background: linear-gradient(90deg, #1e2452, #3a4aa8 55%, #9ec5ff);
}
.fc-pass__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sc-3); margin-top: 2px; }
.fc-pass__brand { font-size: 0.62rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #1e2452; }
.fc-pass__type { font-size: 0.6rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: #5b6070; white-space: nowrap; }
.fc-pass__fields { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sc-3) var(--sc-4); margin: var(--sc-4) 0 0; }
.fc-pass__fields div { min-width: 0; }
.fc-pass__fields dt { font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: #565c6c; font-weight: 500; }
.fc-pass__fields dd { margin: 2px 0 0; font-size: 0.9rem; font-weight: 600; letter-spacing: -0.01em; color: #14161c; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fc-pass__fields dd.is-empty { color: #8a90a0; font-weight: 500; }
.fc-pass__stamps { list-style: none; margin: var(--sc-4) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.fc-pass__stamps li {
  font-size: 0.58rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 4px 8px; border-radius: 3px;
  border: 1px solid #c8c4b8; color: #9a9688;
  transition: color 300ms var(--sc-ease-out), border-color 300ms var(--sc-ease-out), transform 420ms var(--sc-ease-out), background-color 300ms var(--sc-ease-out);
}
.fc-pass__stamps li.is-stamped { color: #1e2452; border-color: #1e2452; background: color-mix(in oklab, #9ec5ff 26%, transparent); transform: rotate(-2deg); }
.fc-pass__stamps li.is-stamped:nth-child(even) { transform: rotate(1.5deg); }
.fc-pass__tear { margin: var(--sc-4) calc(var(--sc-5) * -1) var(--sc-3); border-top: 2px dashed #cfcabe; position: relative; }
.fc-pass__tear::before, .fc-pass__tear::after { content: ""; position: absolute; top: -9px; width: 16px; height: 16px; border-radius: 50%; background: var(--sc-canvas); }
.fc-pass__tear::before { left: -8px; } .fc-pass__tear::after { right: -8px; }
.fc-pass__stub { display: flex; align-items: center; justify-content: space-between; gap: var(--sc-3); }
.fc-pass__barcode {
  flex: 0 0 5.5rem; height: 1.6rem;
  background: repeating-linear-gradient(90deg, #14161c 0 2px, transparent 2px 4px, #14161c 4px 5px, transparent 5px 8px, #14161c 8px 11px, transparent 11px 13px);
  opacity: 0.85;
}
.fc-pass__note { font-size: 0.62rem; letter-spacing: 0.05em; text-transform: uppercase; color: #565c6c; text-align: right; line-height: 1.3; }

/* ------------------------------------------------------------------ footer */
.fc-foot { border-top: 1px solid var(--sc-hairline); padding-block: var(--sc-8) var(--sc-6); }
.fc-foot__grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); gap: var(--sc-8); }
.fc-foot__brand img { height: 1.8rem; width: auto; }
.fc-foot__brand p { margin-top: var(--sc-4); color: var(--sc-ink-soft); font-size: var(--sc-t-sm); max-width: 36ch; }
.fc-foot__social { display: flex; gap: var(--sc-5); }
.fc-foot__social a { display: inline-block; padding-block: 0.6rem; color: var(--sc-ink); font-weight: 500; text-decoration: none; }
.fc-foot__social a:hover { text-decoration: underline; }
.fc-foot__col { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.fc-foot__title { margin: 0 0 var(--sc-2); font-family: var(--sc-font-display); font-size: var(--sc-t-xs); font-weight: 500; letter-spacing: var(--sc-track-wide); text-transform: uppercase; color: var(--sc-ink-soft); }
.fc-foot__col a { display: inline-block; padding-block: 0.65rem; font-size: var(--sc-t-sm); color: var(--sc-ink); text-decoration: none; }
.fc-foot__col a:hover { text-decoration: underline; }
.fc-foot__legal { margin-top: var(--sc-8); font-size: var(--sc-t-xs); color: var(--sc-ink-soft); }
@media (max-width: 760px) { .fc-foot__grid { grid-template-columns: 1fr; gap: var(--sc-6); } }

/* ---------------------------------------------------------- reduced motion */
@media (prefers-reduced-motion: reduce) {
  .fc-hero__media img { transform: none; }
  .fc-you__img { transition: opacity 200ms; transform: none; }
  .fc-panel { animation: none; }
  .fc-video__play img, .fc-video__play:hover img { transform: none; }
  .fc-pass--fixed { transition: none; }
}

/* --------------------------------------------------------------------- faq */
.fc-faq__list dd { max-width: 62ch; }

/* Notched phones in landscape: keep text out of the insets. */
.sc-wrap { padding-inline: max(var(--sc-gutter), env(safe-area-inset-left)) max(var(--sc-gutter), env(safe-area-inset-right)); }