/* ============================================================
   SPIKE FOR HER · design system
   Tokens first. Every component pulls from these.
   ============================================================ */

:root{
  /* color tokens (semantic) */
  --surface:        #F9F3EB;   /* warm ivory, bright */
  --surface-raised: #F3EADD;
  --surface-dark:   #171310;   /* dusk, warm near-black */
  --surface-dark-2: #211B16;
  --text-primary:   #171310;
  --text-muted:     #6E6355;
  --text-inverse:   #F6EFE3;
  --text-inverse-muted: #B4A894;
  --accent:         #E52A86;   /* jersey pink, deep enough for AA on sand */
  --accent-bright:  #FF5FAD;   /* jersey pink in the sun, for dark surfaces */
  --border:         #171310;
  --border-inverse: #F6EFE3;
  --success:        #23663F;
  --danger:         #A62B1D;
  --focus:          #1D53C4;

  /* type */
  --f-display: 'Anton', 'Arial Narrow', sans-serif;
  --f-serif: 'Newsreader', Georgia, serif;
  --f-mono: 'IBM Plex Mono', 'Courier New', monospace;

  /* fluid type scale */
  --t-xs:   clamp(0.68rem, 0.62rem + 0.2vw, 0.8rem);
  --t-s:    clamp(0.82rem, 0.76rem + 0.25vw, 1rem);
  --t-m:    clamp(1rem, 0.92rem + 0.35vw, 1.2rem);
  --t-l:    clamp(1.25rem, 1.1rem + 0.7vw, 1.7rem);
  --t-xl:   clamp(1.7rem, 1.35rem + 1.6vw, 2.6rem);
  --t-2xl:  clamp(2.3rem, 1.6rem + 3.4vw, 4.4rem);
  --t-big:  clamp(3rem, 1.8rem + 6.5vw, 7.5rem);
  --t-mega: clamp(3.4rem, 1.6rem + 10.5vw, 11rem);

  /* space scale */
  --s-1: 0.25rem; --s-2: 0.5rem; --s-3: 1rem; --s-4: 1.5rem;
  --s-5: 2.5rem; --s-6: 4rem; --s-7: 6.5rem; --s-8: 10rem;

  /* structure */
  --line: 3px;
  --radius: 0;            /* sharp. everywhere. */
  --maxw: 1180px;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);
}

/* ---- reset ---- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  background:var(--surface);
  color:var(--text-primary);
  font-family:var(--f-serif);
  font-size:var(--t-m);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
img,video,canvas{ display:block; max-width:100%; }
img{ height:auto; }
body::after{
  content:""; position:fixed; inset:0; z-index:300; pointer-events:none;
  opacity:.42; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.16'/%3E%3C/svg%3E");
}
a{ color:inherit; }

h1,h2,h3{
  font-family:var(--f-display);
  font-weight:400;
  line-height:0.95;
  text-transform:uppercase;
  letter-spacing:0.01em;
}

/* visible keyboard focus everywhere */
:focus-visible{ outline:var(--line) solid var(--focus); outline-offset:3px; }
::selection{ background:var(--accent); color:var(--text-inverse); }

.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }

.skip-link{
  position:absolute; left:-999px; top:0; z-index:400;
  background:var(--surface-dark); color:var(--text-inverse);
  font-family:var(--f-mono); font-size:var(--t-s); padding:var(--s-3) var(--s-4);
}
.skip-link:focus{ left:0; }

/* mono kicker label */
.kicker{
  font-family:var(--f-mono); font-weight:600;
  font-size:var(--t-xs); letter-spacing:0.22em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:0.7em;
}
.kicker::before{ content:""; width:2.2em; height:var(--line); background:currentColor; }

/* ---- buttons: every state designed ---- */
.btn{
  display:inline-flex; align-items:center; gap:0.6em;
  font-family:var(--f-display); font-weight:400; font-size:var(--t-l);
  letter-spacing:0.03em; text-transform:uppercase; line-height:1;
  padding:0.55em 1em 0.5em; border:0;
  background:var(--text-primary); color:var(--surface);
  cursor:pointer; text-decoration:none; position:relative; overflow:hidden;
  transition:color .25s ease, transform .12s ease;
}
.btn::before{
  content:""; position:absolute; inset:0; background:var(--accent);
  transform:translateX(-101%); transition:transform .3s cubic-bezier(.6,0,.2,1);
  z-index:0;
}
.btn:hover::before{ transform:translateX(0); }
.btn > *{ position:relative; z-index:1; }
.btn:hover{ color:#fff; }
.btn:active{ transform:translateY(2px); }
.btn[disabled], .btn[aria-disabled="true"]{
  opacity:.45; cursor:not-allowed; transform:none;
}
.btn[disabled]:hover{ color:var(--surface); }
.btn[disabled]::before{ display:none; }
.btn--accent{ background:var(--accent); color:#fff; }
.btn--accent::before{ background:var(--text-primary); }
.btn--accent:hover{ color:var(--surface); }
.btn.is-loading{ pointer-events:none; }
.btn.is-loading .btn-label{ visibility:hidden; }
.btn.is-loading::after{
  content:""; position:absolute; inset:0; margin:auto;
  width:1em; height:1em; border:2px solid currentColor; border-right-color:transparent;
  animation:spin .7s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

/* ============================================================
   HEADER
   ============================================================ */
.site-head{
  position:fixed; inset:0 0 auto 0; z-index:200;
  display:flex; justify-content:space-between; align-items:center;
  padding:var(--s-3) var(--gutter);
  mix-blend-mode:normal; pointer-events:none;
}
.site-head > *{ pointer-events:auto; }
.brand-mark{ display:flex; align-items:center; gap:.7em; text-decoration:none; }
.brand-mark img{ height:46px; width:auto; }
.brand-mark .logo-cream{ display:none; }
.on-dark .brand-mark .logo-cream{ display:block; }
.on-dark .brand-mark .logo-ink{ display:none; }

.visually-hidden{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap;
}
.head-cta{
  font-family:var(--f-display); font-size:var(--t-m); letter-spacing:.04em;
  text-transform:uppercase; text-decoration:none; color:var(--text-primary);
  padding-bottom:.15em; border-bottom:var(--line) solid var(--accent);
  transition:color .2s ease, border-color .2s ease;
}
.head-cta:hover{ color:var(--accent); }
.on-dark .head-cta{ color:var(--text-inverse); border-bottom-color:var(--accent-bright); }
.on-dark .head-cta:hover{ color:var(--accent-bright); }


/* ============================================================
   ACT I · the story (dark, quiet)
   ============================================================ */
.story{ background:var(--surface-dark); color:var(--text-inverse); position:relative; }
.story-stage{ display:grid; place-items:center; padding:var(--s-7) 0 var(--s-5); }
.story-inner{ max-width:56rem; padding-inline:var(--gutter); width:100%; }
.story-place{
  color:var(--text-inverse); opacity:.55; margin-bottom:var(--s-6);
}
.story-line{
  font-family:var(--f-serif); font-weight:300;
  font-size:var(--t-xl); line-height:1.35;
  margin-block:.85em;
  opacity:.14; transform:translateY(12px);
  transition:opacity .7s ease, transform .7s ease;
}
.story-line.in{ opacity:1; transform:none; }
.story-line em{ font-style:italic; color:var(--accent-bright); }
.story-line strong{ font-weight:600; }
.story-photo{
  margin:var(--s-5) auto; max-width:27rem;
  opacity:0; transform:translateY(18px) rotate(-1.5deg);
  transition:opacity .9s ease, transform .9s ease;
}
.story-photo.in{ opacity:1; transform:rotate(-1.5deg); }
.story-photo img{ border:var(--line) solid var(--border-inverse); width:100%; }
.story-photo figcaption{
  font-family:var(--f-mono); font-size:var(--t-xs); letter-spacing:.14em;
  text-transform:uppercase; opacity:.6; margin-top:var(--s-2);
}
.story-beat{
  text-align:center; font-family:var(--f-serif); font-style:italic;
  font-size:var(--t-l); opacity:.55; padding-bottom:var(--s-5);
}

/* ============================================================
   THE BOOM · scrub film sections
   ============================================================ */
.film{ position:relative; }
.film-track{ height:560vh; position:relative; }
.film-track--short{ height:460vh; }
.film-stick{
  position:sticky; top:0; height:100vh; height:100svh;
  overflow:hidden; background:var(--surface-dark);
}
.film-canvas{ position:absolute; inset:0; width:100%; height:100%; }
.film-fallback{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.film-scrim{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to bottom, rgba(23,19,16,.28), rgba(23,19,16,0) 40%, rgba(23,19,16,.34));
}
.film-title{
  position:absolute; inset:0; display:grid; place-content:center;
  text-align:center; pointer-events:none; padding-inline:var(--gutter);
}
.film-title .t1, .film-title .t2{
  display:block; font-family:var(--f-display); text-transform:uppercase;
  color:var(--text-inverse); font-size:var(--t-mega); line-height:.88;
}
.film-title .t2{ color:var(--accent-bright); }
.film-title .t-sub{
  margin-top:var(--s-4);
  font-family:var(--f-mono); font-weight:600; color:var(--text-inverse);
  font-size:var(--t-s); letter-spacing:.22em; text-transform:uppercase;
}
.film-words{ position:absolute; inset:0; display:grid; place-content:center; pointer-events:none; }
.film-words span{
  display:none; font-family:var(--f-display); text-transform:uppercase;
  font-size:var(--t-mega); color:var(--text-inverse); text-align:center; line-height:.9;
  padding-inline:var(--gutter);
}
.film-words span.on{ display:block; }
.film-loading{
  position:absolute; inset:auto var(--gutter) var(--s-4) auto;
  font-family:var(--f-mono); font-size:var(--t-xs); letter-spacing:.2em;
  text-transform:uppercase; color:var(--text-inverse); opacity:.7;
}
.film-loading[hidden]{ display:none; }

/* marquee */
.marquee{
  background:var(--surface-dark); color:var(--text-inverse);
  border-block:1px solid rgba(246,239,227,.35);
  overflow:hidden; white-space:nowrap; padding:1.1rem 0;
}
.marquee-track{ display:inline-flex; align-items:baseline; will-change:transform; }
.marquee-track span{
  font-family:var(--f-display); font-size:var(--t-xl); text-transform:uppercase;
  padding-inline:1.4rem; line-height:1;
}
.marquee-track span:nth-child(4n+3){
  font-family:var(--f-serif); font-style:italic; text-transform:none;
  color:var(--accent-bright); letter-spacing:0;
}
.marquee-track .sep{ color:var(--accent-bright); font-family:var(--f-serif); }

/* ============================================================
   ACT II · the event (sand, loud)
   ============================================================ */
.section{ padding-block:var(--s-8); position:relative; }
.section-head{ max-width:44rem; }
.section-head h2{ font-size:var(--t-2xl); margin-top:var(--s-3); }
.section-head h2 em, .voice-copy h2 em{ font-family:var(--f-serif); font-style:italic; text-transform:none; font-weight:400; letter-spacing:0; }
.section-head p{ margin-top:var(--s-4); font-size:var(--t-l); line-height:1.5; }

.statgrid{
  margin-top:var(--s-7);
  display:flex; flex-wrap:wrap; gap:var(--s-5) var(--s-7);
  align-items:flex-end;
}
.stat{ flex:1 1 200px; }
.stat b{
  display:block; font-family:var(--f-display); font-weight:400;
  font-size:var(--t-big); line-height:.9; color:var(--accent);
  -webkit-text-stroke:1px var(--accent);
}
.stat span{
  display:block; margin-top:var(--s-2); max-width:22ch;
  font-family:var(--f-serif); font-style:italic; font-size:var(--t-m);
  color:var(--text-primary); line-height:1.4;
}

/* scattered photos */
.snapshots{
  margin-top:var(--s-6); position:relative;
  display:grid; gap:var(--s-4);
  grid-template-columns:repeat(12, 1fr);
  align-items:start;
}
.snap{ position:relative; z-index:1; background:#FDFBF7; padding:10px 10px 14px; outline:1px solid rgba(23,19,16,.22); }
.snap img{ width:100%; height:auto; }
.snap figcaption{
  font-family:var(--f-serif); font-style:italic; font-size:var(--t-s);
  color:var(--text-muted); margin-top:10px; padding-inline:2px;
}
.snap--a{ grid-column:1 / span 5; transform:rotate(-2deg); }
.snap--b{ grid-column:6 / span 7; transform:rotate(1.2deg); margin-top:var(--s-7); margin-left:-4%; }
.snap--c{ grid-column:2 / span 6; transform:rotate(1deg); margin-top:-6%; }
.snap--d{ grid-column:8 / span 4; transform:rotate(-2.4deg); margin-top:var(--s-5); }
@media (max-width:760px){
  .snap--a,.snap--b,.snap--c,.snap--d{ grid-column:1 / -1; margin:0; }
  .snap--b,.snap--c,.snap--d{ margin-top:var(--s-4); }
}

.section--lume{
  background:linear-gradient(180deg, #FFFEFC 0%, #FBF4EC 55%, #F7ECDF 100%);
  position:relative;
}
.section--lume::before{
  content:""; position:absolute; left:50%; top:34%; width:min(70vw,900px); aspect-ratio:1;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(229,42,134,.10) 0%, rgba(229,42,134,.045) 42%, rgba(229,42,134,0) 68%);
  pointer-events:none;
}
.section--lume > .wrap{ position:relative; }

/* ============================================================
   FILM STRIP · horizontal scroll
   ============================================================ */
.strip{ position:relative; background:var(--accent); color:var(--surface-dark); }
.strip-track{ height:420vh; }
.strip-stick{
  position:sticky; top:0; height:100vh; height:100svh; overflow:hidden;
  display:flex; flex-direction:column; justify-content:center;
}
.strip-head{ padding:0 var(--gutter) var(--s-5); }
.strip-head .kicker{ color:#fff; }
.strip-rail{
  display:flex; gap:var(--s-5); padding-inline:var(--gutter);
  will-change:transform; width:max-content; align-items:center;
}
.clip{ flex:0 0 auto; width:min(64vw, 420px); }
.clip video, .clip img{
  width:100%; aspect-ratio:var(--ar, 4 / 5); object-fit:cover;
  border:0; outline:1px solid rgba(23,19,16,.35); background:var(--surface-dark-2);
  box-sizing:border-box;
}
.clip{ background:#FDFBF7; padding:9px 9px 12px; }
.clip figcaption{
  font-family:var(--f-serif); font-style:italic; font-size:var(--t-s);
  color:var(--text-primary); opacity:.8; margin-top:var(--s-2);
}
@media (prefers-reduced-motion: reduce){
  .strip-track{ height:auto; }
  .strip-stick{ position:static; height:auto; padding-block:var(--s-7); }
  .strip-rail{ overflow-x:auto; width:auto; }
}

/* ============================================================
   HER VOICE (dark, quiet again)
   ============================================================ */
.voice{ background:var(--surface-dark); color:var(--text-inverse); }
.voice .kicker{ color:var(--accent-bright); }
.voice-grid{
  display:grid; gap:var(--s-6); grid-template-columns:1.1fr .9fr; align-items:center;
  margin-top:var(--s-6);
}
@media (max-width:860px){ .voice-grid{ grid-template-columns:1fr; } }
.voice-copy h2{ font-size:var(--t-2xl); }
.voice-copy p{ margin-top:var(--s-4); font-size:var(--t-m); line-height:1.75; opacity:.92; }
.voice-copy .why{ font-family:var(--f-serif); font-style:italic; font-size:var(--t-l); margin-top:var(--s-5); }
.voice-player{ position:relative; }
.voice-player video{ width:100%; border:var(--line) solid var(--border-inverse); }
.voice-play{
  position:absolute; inset:0; width:100%; height:100%;
  display:grid; place-content:center; gap:var(--s-2);
  background:rgba(23,19,16,.35); border:0; cursor:pointer;
  color:var(--text-inverse); font-family:var(--f-mono); font-weight:700;
  font-size:var(--t-s); letter-spacing:.18em; text-transform:uppercase;
  transition:background-color .2s ease;
}
.voice-play:hover{ background:rgba(23,19,16,.15); }
.voice-play .ring{
  width:76px; height:76px; margin-inline:auto;
  border:var(--line) solid var(--text-inverse); display:grid; place-content:center;
}
.voice-play[hidden]{ display:none; }
.voice-note{
  font-family:var(--f-serif); font-style:italic; font-size:var(--t-s);
  opacity:.75; margin-top:var(--s-2);
}

/* ============================================================
   FOUNDER LETTER
   ============================================================ */
.letter-sheet{
  max-width:46rem; margin-inline:auto;
  background:var(--surface-raised); border:var(--line) solid var(--border);
  padding:clamp(1.6rem, 5vw, 4rem); position:relative;
}
.letter-sheet::after{
  content:""; position:absolute; inset:0; transform:translate(10px,10px);
  border:var(--line) solid var(--border); z-index:-1;
}
.letter-sheet p{ margin-top:var(--s-4); line-height:1.85; }
.letter-open{ font-size:var(--t-l); font-style:italic; }
.letter-sig{ margin-top:var(--s-5); }
.letter-sig .hand{ font-family:var(--f-serif); font-style:italic; font-weight:600; font-size:var(--t-xl); letter-spacing:.01em; display:inline-block; }
.letter-sig .role{
  font-family:var(--f-mono); font-size:var(--t-xs); letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-muted); margin-top:var(--s-2);
}
.letter-photo{ max-width:34rem; margin:var(--s-7) auto 0; transform:rotate(1.2deg); background:#FDFBF7; padding:10px 10px 14px; outline:1px solid rgba(23,19,16,.22); }
.letter-photo img{ aspect-ratio:5/4; object-fit:cover; object-position:center 24%; width:100%; }
.letter-photo figcaption{
  font-family:var(--f-serif); font-style:italic; font-size:var(--t-s);
  color:var(--text-muted); margin-top:var(--s-2);
}

/* ============================================================
   JOIN (pink)
   ============================================================ */
.join{ background:var(--accent); color:#fff; position:relative; overflow:hidden; }
.join > .wrap{ position:relative; }
.join h2{ font-size:var(--t-big); max-width:16ch; }
.join h2 em{ font-family:var(--f-serif); font-style:italic; text-transform:none; font-weight:400; letter-spacing:0; }
.join .lead{ margin-top:var(--s-4); font-family:var(--f-serif); font-size:var(--t-l); max-width:38rem; }
.join-grid{
  margin-top:var(--s-6); display:grid; gap:var(--s-6);
  grid-template-columns:1.2fr .8fr;
}
@media (max-width:860px){ .join-grid{ grid-template-columns:1fr; } }

.field{ margin-top:var(--s-5); }
.field label{
  display:block; font-family:var(--f-serif); font-style:italic;
  font-size:var(--t-m); margin-bottom:var(--s-1); color:#fff;
}
.field input{
  width:100%; font-family:var(--f-serif); font-size:var(--t-xl);
  padding:.15em 0 .25em; border:0; border-bottom:var(--line) solid rgba(255,255,255,.6);
  background:transparent; color:#fff; border-radius:0;
  transition:border-color .2s ease;
}
.field input:hover{ border-bottom-color:#fff; }
.field input:focus{ outline:none; border-bottom-color:var(--text-primary); }
.field input:focus-visible{ outline:none; border-bottom-color:var(--text-primary); }
.field input[aria-invalid="true"]{ border-bottom-style:dashed; border-bottom-color:#FFD9CE; }
.field-error{
  display:none; font-family:var(--f-mono); font-size:var(--t-xs);
  letter-spacing:.08em; margin-top:var(--s-2);
  background:var(--surface-dark); color:#FFB4A6; padding:.5em .8em;
}
.field-error.show{ display:inline-block; }
.form-status{ margin-top:var(--s-4); font-family:var(--f-mono); font-size:var(--t-s); }
.form-status[data-state="success"]{ background:var(--surface-dark); color:#9FE3B8; padding:.8em 1em; }
.form-status[data-state="error"]{ background:var(--surface-dark); color:#FFB4A6; padding:.8em 1em; }
.form-status a{ color:inherit; }

.give-card{ border-top:1px solid rgba(255,255,255,.6); padding-top:var(--s-5); color:#fff; }
.give-card h3{ font-size:var(--t-xl); }
.give-card p{ margin-top:var(--s-3); font-family:var(--f-serif); font-size:var(--t-m); line-height:1.7; }
.give-card .btn{ margin-top:var(--s-4); }
.give-fine{
  margin-top:var(--s-3); font-family:var(--f-serif); font-style:italic;
  font-size:var(--t-s); color:rgba(255,255,255,.85);
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-foot{ background:var(--surface-dark); color:var(--text-inverse); padding-block:var(--s-7) var(--s-5); }
.foot-grid{ display:flex; flex-wrap:wrap; gap:var(--s-6); justify-content:space-between; }
.foot-brand img{ height:64px; }
.foot-brand p{ max-width:32ch; margin-top:var(--s-3); font-size:var(--t-s); opacity:.8; }
.foot-col h4{
  font-family:var(--f-mono); font-weight:700; font-size:var(--t-xs);
  letter-spacing:.2em; text-transform:uppercase; color:var(--accent-bright);
}
.foot-col ul{ list-style:none; margin-top:var(--s-3); }
.foot-col li{ margin-top:var(--s-2); }
.foot-col a{ text-decoration:none; border-bottom:1px solid transparent; }
.foot-col a:hover{ border-bottom-color:var(--accent-bright); }
.foot-legal{
  margin-top:var(--s-6); padding-top:var(--s-4);
  border-top:1px solid rgba(246,239,227,.25);
  display:flex; flex-wrap:wrap; gap:var(--s-3); justify-content:space-between;
  font-family:var(--f-mono); font-size:var(--t-xs); letter-spacing:.1em; opacity:.75;
}

/* sticky mobile CTA */
.mobile-cta{
  display:none; position:fixed; inset:auto 0 0 0; z-index:210;
  background:var(--accent); border-top:var(--line) solid var(--border);
}
.mobile-cta a{
  display:block; text-align:center; padding:.8em;
  font-family:var(--f-display); font-size:var(--t-l);
  letter-spacing:.04em; text-transform:uppercase; color:#fff; text-decoration:none;
}
@media (max-width:700px){ .mobile-cta{ display:block; } body{ padding-bottom:3.4rem; } }

/* ============================================================
   SUBPAGES (privacy, terms, 404, thanks)
   ============================================================ */
.page{ min-height:70vh; padding-block:calc(var(--s-8) + 2rem) var(--s-8); }
.page h1{ font-size:var(--t-2xl); margin-top:var(--s-3); }
.page .prose{ max-width:42rem; margin-top:var(--s-5); }
.page .prose h2{ font-size:var(--t-l); margin-top:var(--s-6); font-family:var(--f-mono); font-weight:700; letter-spacing:.1em; }
.page .prose p{ margin-top:var(--s-3); line-height:1.8; }
.page .prose a{ color:var(--accent); }
.lost{ text-align:center; }
.lost h1{ font-size:var(--t-mega); }
.lost p{ margin-top:var(--s-4); font-size:var(--t-l); }
.lost .clip{ margin:var(--s-6) auto 0; }
.lost .btn{ margin-top:var(--s-5); }

/* reduced motion: no scrubs, no marquee slide */
@media (prefers-reduced-motion: reduce){
  .story-line, .story-photo{ transition:none; opacity:1; transform:none; }
  .film-track{ height:auto !important; }
  .film-stick{ position:static; height:70vh; }
  .marquee-track{ animation:none !important; }
}

@media print{
  .site-head, .mobile-cta{ display:none; }
}

@media (max-width:700px){
  .head-cta{ display:none; }
  .brand-mark img{ height:38px; }
}

/* ============================================================
   v2 · award-layer
   ============================================================ */

/* preloader: a real loading state, then the curtain lifts */
.preloader{
  position:fixed; inset:0; z-index:500;
  background:var(--surface-dark); color:var(--text-inverse);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--s-4);
  transition:transform .8s cubic-bezier(.76,0,.24,1);
}
.preloader img{ width:86px; height:auto; }
.pre-count{ font-family:var(--f-display); font-size:var(--t-2xl); line-height:1; color:var(--accent-bright); }
.pre-pct{ font-size:.5em; vertical-align:.5em; margin-left:.1em; }
.preloader.gone{ transform:translateY(-100%); pointer-events:none; }
body.holding{ overflow:hidden; }

/* scroll progress hairline */
.scroll-progress{
  position:fixed; top:0; left:0; right:0; height:3px; z-index:400;
  background:var(--accent); transform-origin:0 50%; transform:scaleX(0);
  pointer-events:none;
}

/* custom cursor */
.cursor{
  position:fixed; left:-21px; top:-21px; width:42px; height:42px; z-index:600;
  pointer-events:none; mix-blend-mode:difference;
  display:none;
}
.cursor::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:#fff; transform:scale(.28);
  transition:transform .25s cubic-bezier(.2,.8,.2,1);
}
body.has-cursor .cursor{ display:block; }
.cursor.big::before{ transform:scale(1); }
.cursor.press::before{ transform:scale(.55); }

/* split-line heading reveal */
[data-split] .sw{ display:inline-block; overflow:hidden; vertical-align:top; }
[data-split] .swi{
  display:inline-block; transform:translateY(115%);
  transition:transform .7s cubic-bezier(.2,.75,.15,1);
}
[data-split].split-in .swi{ transform:translateY(0); }

/* parallax hook */
.snap, .letter-photo{ transform:translateY(var(--plx, 0px)) rotate(var(--rot, 0deg)); }
.snap--a{ --rot:-2deg; transform:translateY(var(--plx,0px)) rotate(var(--rot)); }
.snap--b{ --rot:1.2deg; transform:translateY(var(--plx,0px)) rotate(var(--rot)); }
.snap--c{ --rot:1deg; transform:translateY(var(--plx,0px)) rotate(var(--rot)); }
.snap--d{ --rot:-2.4deg; transform:translateY(var(--plx,0px)) rotate(var(--rot)); }
.letter-photo{ --rot:1.2deg; transform:translateY(var(--plx,0px)) rotate(var(--rot)); }

/* film strip clips: lift on hover */
.clip{ transition:transform .35s cubic-bezier(.2,.8,.2,1); }
.clip:hover{ transform:translateY(-8px) rotate(-.5deg); }

/* footer giant type */
.foot-mega{
  font-family:var(--f-display); text-transform:uppercase;
  font-size:clamp(2.4rem, 8.2vw, 8.6rem); line-height:.95;
  text-align:center; color:var(--text-inverse);
  padding:0 var(--gutter) var(--s-6); margin:0 auto;
  white-space:nowrap; overflow:hidden;
}
.foot-mega .mchar{
  display:inline-block; transform:translateY(110%);
  transition:transform .6s cubic-bezier(.2,.75,.15,1), color .25s ease;
}
.foot-mega .msp{ width:.3em; }
.foot-mega.in .mchar{ transform:translateY(0); }
.foot-mega .mchar:hover{ color:var(--accent-bright); transform:translateY(-6%); transition-delay:0ms !important; }
@media (max-width:900px){ .foot-mega{ font-size:clamp(1.6rem, 9vw, 4rem); } }

/* buttons/header links get transform from magnetics; keep transitions civil */
.btn, .head-cta{ will-change:transform; }

@media (prefers-reduced-motion: reduce){
  .preloader{ display:none; }
  .cursor{ display:none !important; }
  [data-split] .swi, .foot-mega .mchar{ transform:none; transition:none; }
  .snap, .letter-photo{ transform:rotate(var(--rot,0deg)); }
}

body.has-cursor, body.has-cursor a, body.has-cursor button,
body.has-cursor .clip, body.has-cursor .voice-play{ cursor:none; }