/* ═══════════════════════════════════════════════════════════════════════════
   ITV — home.css  ·  editorial dark landing page
   Scoped under .itv-home so it never touches the SPA sub-pages.
   Sections: hero · stat strip · sticky stack cards · the descent
             (horizontal pinned) · experiences · CTA · news.
   Scroll/cursor/parallax behaviour lives in app.js (initItvHome).
   ═══════════════════════════════════════════════════════════════════════════ */

.itv-home {
  background: #191A21;
  color: #CDD1C4;
  font-family: 'Space Grotesk', sans-serif;
  overflow-x: clip;
}
.itv-home * { box-sizing: border-box; }

/* shared bits */
.itv-eyebrow { font-family:'Geist Mono',monospace; font-size:clamp(11px,1.1vw,13px); letter-spacing:4px; text-transform:uppercase; }
.itv-eyebrow--gold { color:#E8C547; }
.itv-eyebrow--blue { color:#5C80BC; letter-spacing:3px; }

.itv-btn {
  display:inline-flex; align-items:center; justify-content:center;
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:16px;
  padding:17px 34px; border-radius:9px; border:none; cursor:pointer;
  text-decoration:none; transition:transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s, background .2s;
}
.itv-btn--gold  { background:#E8C547; color:#30323D; box-shadow:0 16px 40px -12px rgba(232,197,71,.5); }
.itv-btn--gold:hover  { color:#30323D; transform:translateY(-2px); box-shadow:0 22px 52px -12px rgba(232,197,71,.6); }
.itv-btn--ghost { background:rgba(205,209,196,.06); border:1px solid rgba(205,209,196,.22); color:#CDD1C4; font-weight:600; backdrop-filter:blur(6px); }
.itv-btn--ghost:hover { background:rgba(205,209,196,.12); color:#CDD1C4; transform:translateY(-2px); }

/* ── HERO ────────────────────────────────────────────────────────────────── */
.itv-hero { position:relative; min-height:96vh; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.itv-hero-bg { position:absolute; inset:-12%; background-position:center 46%; background-size:cover; background-repeat:no-repeat; will-change:transform; }
.itv-hero-fade { position:absolute; inset:0; }
.itv-hero-fade--radial { background:radial-gradient(110% 82% at 50% 44%, rgba(25,26,33,.32), rgba(25,26,33,.74) 78%); }
.itv-hero-fade--linear { background:linear-gradient(0deg,#191A21 1%, transparent 26%, transparent 84%, rgba(25,26,33,.35)); }
.itv-hero-inner { position:relative; text-align:center; padding:0 24px; z-index:2; }
.itv-hero-logo {
  width:clamp(300px,42vw,560px); height:auto;
  filter:brightness(0) invert(1) drop-shadow(0 0 18px rgba(232,197,71,.18));
  animation:itvFloat 7s ease-in-out infinite;
}
.itv-eyebrow--gold { margin-bottom:38px; display:block; }
.itv-hero-tag { font-size:clamp(16px,1.6vw,20px); color:rgba(205,209,196,.8); margin:34px auto 40px; max-width:480px; line-height:1.5; }
.itv-hero-cta { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
@keyframes itvFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-9px)} }

/* ── STAT STRIP ──────────────────────────────────────────────────────────── */
.itv-stats {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  border-top:1px solid rgba(205,209,196,.1); border-bottom:1px solid rgba(205,209,196,.1);
  font-family:'Geist Mono',monospace; background:#383b47;
}
.itv-stat { padding:30px clamp(20px,3vw,40px); border-right:1px solid rgba(205,209,196,.1); }
.itv-stat:last-child { border-right:none; }
.itv-stat-num { font-size:clamp(30px,3vw,40px); font-weight:600; color:#CDD1C4; letter-spacing:-1px; font-variant-numeric:tabular-nums; }
.itv-stat-lbl { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:rgba(205,209,196,.5); margin-top:8px; }
.itv-stat-lbl--blue { color:#5C80BC; }

/* ── STICKY STACK CARDS ──────────────────────────────────────────────────── */
.itv-stack-wrap { max-width:1180px; margin:0 auto; padding:clamp(70px,9vw,120px) clamp(20px,4vw,40px) clamp(30px,4vw,50px); }
.itv-stack { display:flex; flex-direction:column; gap:26px; padding-bottom:40px; }
.itv-card {
  position:sticky; min-height:72vh; border-radius:24px; overflow:hidden;
  box-shadow:0 -12px 50px rgba(0,0,0,.45); display:grid; grid-template-columns:1.1fr .9fr;
  cursor:pointer; transition:transform .3s cubic-bezier(.2,.7,.2,1);
}
.itv-card:hover { transform:translateY(-4px); }
.itv-card--gold  { top:84px;  background:#E8C547; color:#30323D; }
.itv-card--blue  { top:104px; background:#5C80BC; color:#CDD1C4; }
.itv-card--slate { top:124px; background:#4D5061; color:#CDD1C4; }
.itv-card--sage  { top:144px; background:#CDD1C4; color:#30323D; }
.itv-card-body { padding:clamp(28px,4vw,52px); display:flex; flex-direction:column; justify-content:space-between; }
.itv-card-meta { display:flex; align-items:center; justify-content:space-between; font-family:'Geist Mono',monospace; font-size:13px; letter-spacing:1px; text-transform:uppercase; }
.itv-card-title { font-size:clamp(40px,5.4vw,76px); line-height:.95; letter-spacing:-2px; margin:0 0 16px; text-transform:uppercase; font-weight:700; }
.itv-card-desc { font-size:clamp(15px,1.5vw,19px); max-width:380px; margin:0; opacity:.78; }
.itv-card-link { font-family:'Geist Mono',monospace; font-size:14px; letter-spacing:1px; text-transform:uppercase; font-weight:600; }
.itv-card-art { position:relative; overflow:hidden; }
.itv-card-img { position:absolute; inset:0; background-size:cover; background-position:center; }
.itv-card-img-fade { position:absolute; inset:0; }
.itv-fade--gold  { background:linear-gradient(90deg,#E8C547 0%, rgba(232,197,71,.1) 55%, transparent); }
.itv-fade--blue  { background:linear-gradient(90deg,#5C80BC 0%, rgba(92,128,188,.1) 55%, transparent); }
.itv-fade--slate { background:linear-gradient(90deg,#4D5061 0%, rgba(77,80,97,.1) 55%, transparent); }
.itv-fade--sage  { background:linear-gradient(90deg,#CDD1C4 0%, rgba(205,209,196,.1) 55%, transparent); }

/* ── THE DESCENT — HORIZONTAL PINNED ─────────────────────────────────────── */
.itv-descent { position:relative; height:360vh; background:#191A21; }
.itv-descent-pin { position:sticky; top:0; height:100vh; overflow:hidden; display:flex; align-items:center; }
.itv-descent-head { position:absolute; top:clamp(28px,5vh,54px); left:clamp(20px,4vw,48px); z-index:5; pointer-events:none; }
.itv-descent-title { font-weight:700; font-size:clamp(30px,4vw,52px); letter-spacing:-1.6px; margin:0; text-transform:uppercase; }
.itv-descent-sub { font-family:'Geist Mono',monospace; font-size:12px; letter-spacing:2px; text-transform:uppercase; color:rgba(205,209,196,.5); margin-top:8px; }
.itv-descent-count { position:absolute; top:clamp(28px,5vh,54px); right:clamp(20px,4vw,48px); z-index:5; font-family:'Geist Mono',monospace; font-size:13px; letter-spacing:2px; color:#E8C547; }
.itv-descent-track { display:flex; gap:26px; padding:0 clamp(20px,6vw,90px); will-change:transform; }
.itv-tier { position:relative; flex:0 0 auto; width:min(560px,76vw); height:68vh; border-radius:20px; overflow:hidden; }
.itv-tier--wide { width:min(640px,80vw); }
.itv-tier-img { position:absolute; inset:-8%; background-size:cover; background-position:center; will-change:transform; }
.itv-tier-fade { position:absolute; inset:0; background:linear-gradient(180deg,transparent 42%,rgba(48,50,61,.92)); }
.itv-tier-label { position:absolute; left:28px; bottom:28px; }
.itv-tier-tag { font-family:'Geist Mono',monospace; font-size:12px; letter-spacing:2px; margin-bottom:8px; }
.itv-tier-name { font-size:clamp(26px,3vw,38px); font-weight:700; }
.itv-tier-name--big { font-size:clamp(28px,3.4vw,44px); }
.itv-descent-rail { position:absolute; left:clamp(20px,4vw,48px); right:clamp(20px,4vw,48px); bottom:clamp(26px,4vh,44px); height:3px; background:rgba(205,209,196,.14); border-radius:2px; overflow:hidden; }
.itv-descent-prog { position:absolute; inset:0; background:#E8C547; transform:scaleX(0); transform-origin:left; }

/* ── EXPERIENCES ─────────────────────────────────────────────────────────── */
.itv-exp { position:relative; background:#191A21; }
.itv-exp-head { max-width:1180px; margin:0 auto; padding:clamp(70px,9vw,110px) clamp(20px,4vw,40px) clamp(30px,4vw,44px); display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.itv-exp-h2 { font-weight:700; font-size:clamp(34px,4.8vw,60px); letter-spacing:-1.8px; margin:14px 0 0; text-transform:uppercase; line-height:.98; }
.itv-exp-intro { font-size:clamp(14px,1.3vw,17px); color:rgba(205,209,196,.62); max-width:340px; margin:0; line-height:1.55; }
.itv-exp-stage { height:92vh; display:flex; align-items:center; justify-content:center; padding:0 clamp(16px,4vw,48px); }
.itv-exp-card { position:relative; width:min(1100px,96%); height:80vh; border-radius:26px; overflow:hidden; box-shadow:0 40px 90px -34px rgba(0,0,0,.7); will-change:transform,opacity; }
.itv-exp-img { position:absolute; inset:-9%; background-size:cover; background-position:center; will-change:transform; }
.itv-exp-grad { position:absolute; inset:0; background:linear-gradient(180deg,rgba(20,21,27,.18),rgba(20,21,27,.45) 55%,rgba(20,21,27,.9)); }
.itv-exp-text { position:absolute; left:clamp(28px,4vw,56px); right:clamp(28px,4vw,56px); bottom:clamp(36px,6vh,64px); }
.itv-exp-num { font-family:'Geist Mono',monospace; font-size:13px; letter-spacing:4px; text-transform:uppercase; margin-bottom:14px; }
.itv-exp-title { font-size:clamp(40px,6vw,92px); font-weight:700; margin:0; letter-spacing:-2.5px; text-transform:uppercase; line-height:.94; }
.itv-exp-desc { font-size:clamp(15px,1.5vw,20px); color:rgba(205,209,196,.82); margin:16px 0 0; max-width:520px; line-height:1.5; }

/* ── CTA ─────────────────────────────────────────────────────────────────── */
.itv-cta { position:relative; max-width:1240px; margin:clamp(50px,7vw,90px) auto clamp(40px,5vw,60px); padding:clamp(60px,8vw,90px) clamp(30px,5vw,60px); border-radius:20px; overflow:hidden; text-align:center; }
.itv-cta-bg { position:absolute; inset:-12%; background-size:cover; background-position:center; opacity:.3; will-change:transform; }
.itv-cta-tint { position:absolute; inset:0; background:linear-gradient(180deg, rgba(48,50,61,.6), rgba(48,50,61,.88)); }
.itv-cta-inner { position:relative; }
.itv-cta-logo { width:120px; height:auto; filter:brightness(0) invert(1) drop-shadow(0 0 12px rgba(232,197,71,.2)); margin-bottom:26px; }
.itv-cta-h2 { font-weight:700; font-size:clamp(40px,6vw,68px); line-height:.96; letter-spacing:-2px; margin:0 0 28px; text-transform:uppercase; }
.itv-cta-row { display:inline-flex; gap:14px; align-items:center; flex-wrap:wrap; justify-content:center; }
.itv-cta-visit { font-family:'Geist Mono',monospace; padding:16px 24px; border:1px solid rgba(205,209,196,.28); color:#CDD1C4; font-size:15px; border-radius:9px; }

/* ── NEWS ────────────────────────────────────────────────────────────────── */
.itv-news { max-width:1180px; margin:0 auto; padding:clamp(40px,6vw,80px) clamp(20px,4vw,40px) clamp(70px,9vw,110px); }
.itv-news-h2 { font-weight:700; font-size:clamp(30px,4vw,52px); letter-spacing:-1.6px; margin:14px 0 28px; text-transform:uppercase; }

/* ── REVEAL GROUPS (JS toggles inline styles; this is the resting state) ──── */
.itv-home [data-rg] > * { will-change:opacity,transform; }

/* ── RESPONSIVE ──────────────────────────────────────────────────────────── */
@media (max-width:820px) {
  .itv-card { grid-template-columns:1fr; min-height:auto; position:relative; top:0 !important; }
  .itv-card-art { min-height:240px; }
  .itv-descent { height:auto; }
  .itv-descent-pin { position:relative; height:auto; display:block; padding:60px 0; }
  .itv-descent-track { flex-wrap:wrap; transform:none !important; }
  .itv-tier, .itv-tier--wide { width:100%; height:60vh; }
  .itv-descent-rail { display:none; }
  .itv-exp-stage { height:auto; padding:40px clamp(16px,4vw,48px); }
  .itv-exp-card { height:60vh; transform:none !important; opacity:1 !important; }
}

/* ── REDUCED MOTION ──────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .itv-hero-logo { animation:none; }
  .itv-home [data-rg] > * { opacity:1 !important; transform:none !important; }
}