/* ============================================================
   Start animation — homepage only (js/intro.js decides).
   The <head> script adds html.is-intro before first paint; while it is set
   the preloader is skipped and the hero holds its entrance, which then plays
   straight away (html.intro-done) when the video ends or is skipped.
   ============================================================ */
.intro{ position:fixed; inset:0; z-index:10003; background:#000; transition:opacity .45s ease }
.intro[hidden]{ display:none }
.intro.is-out{ opacity:0; pointer-events:none }
/* contain, not cover: the video's studio is pure black, so letterbox bars disappear into it and the
   lock-up is never cropped (iPad landscape, 21:9 monitors, tall phones) */
.intro__video{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; display:block; background:#000 }
/* phones: the tall video is rendered at 1080x2340 (phone aspect) with its safe area at 12-88% height,
   so it fills the screen edge to edge; tablets and desktops keep contain */
@media (max-aspect-ratio: 3/5){ .intro__video{ object-fit:cover } }
/* top-right on purpose: Instagram's iOS browser draws fixed-bottom elements mid-screen */
.intro__skip{ position:absolute; top:max(16px, env(safe-area-inset-top)); right:16px; z-index:2;
  font:600 .72rem/1 "Satoshi",system-ui,sans-serif; letter-spacing:.18em; text-transform:uppercase;
  color:#f3ead2; background:rgba(8,8,10,.42); border:1px solid rgba(230,178,78,.45); border-radius:100px;
  padding:10px 16px; cursor:pointer; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px) }
.intro__skip:hover{ border-color:#E6B24E; color:#fff }

html.is-intro{ overflow:hidden }
html.is-intro .preloader{ display:none }
html.is-intro .hero .reveal{ opacity:0 !important; transform:translateY(26px) !important; transition:none !important }
html.is-intro .hero-title.reveal{ opacity:1 !important; transform:none !important }
html.is-intro .hero-title .line-i{ transform:translateY(118%) !important; transition:none !important }
html.intro-done .hero .eyebrow.reveal{ transition-delay:0s }
html.intro-done .hero-title .line:nth-child(1) .line-i{ transition-delay:.06s }
html.intro-done .hero-title .line:nth-child(2) .line-i{ transition-delay:.2s }
html.intro-done .hero-sub.reveal{ transition-delay:.34s }
html.intro-done .hero-cta.reveal{ transition-delay:.46s }
