/* Tiny Galaxy Studios — mobile first. Base = phone. Media queries scale UP. */
@font-face{font-family:"Fraunces";src:url("fonts/fraunces-var.woff2") format("woff2");font-weight:100 900;font-display:swap;}
:root{--sky:#07080C;--ink:#EDEBE4;--dim:#8B8F99;--line:#171B23;--gold:#E8C87A;--soft:#B9B7B0;--gut:22px;}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;color-scheme:dark;-webkit-text-size-adjust:100%;}
::selection{background:rgba(232,200,122,.28);}
body{background:var(--sky);color:var(--ink);line-height:1.55;overflow-x:hidden;
  font-family:"Fraunces","Iowan Old Style",Palatino,Georgia,serif;-webkit-font-smoothing:antialiased;}
img,video{display:block;max-width:100%;}
.lbl{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:10px;letter-spacing:.3em;text-transform:uppercase;}

/* ── nav: same on every page ── */
.nav{position:absolute;top:0;left:0;right:0;z-index:5;padding:20px var(--gut);
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;}
.nav.solid{position:relative;border-bottom:1px solid var(--line);padding-top:22px;padding-bottom:22px;}
.nav a{text-decoration:none;}
.nav .brand{color:var(--gold);text-indent:.3em;white-space:nowrap;}
.nav .links{display:flex;gap:18px;align-items:baseline;}
.nav .links a{color:rgba(237,235,228,.58);text-indent:.3em;position:relative;padding-bottom:3px;transition:color .3s;}
.nav .links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1);}
.nav .links a:hover,.nav .links a[aria-current]{color:var(--ink);}
.nav .links a:hover::after,.nav .links a[aria-current]::after{transform:scaleX(1);}
.nav .mail{display:none;}

/* ── hero ── */
.hero{position:relative;min-height:92svh;overflow:hidden;background:#05060A;display:flex;align-items:flex-end;}
.hero video,.hero .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero .poster{object-position:50% 34%;}
.hero video{opacity:0;transition:opacity 1.4s ease;}
.hero video.on{opacity:1;}
.hero::after{content:"";position:absolute;inset:0;background:
  linear-gradient(to top,rgba(5,6,10,.97) 0%,rgba(5,6,10,.74) 34%,rgba(5,6,10,.3) 64%,rgba(5,6,10,.6) 100%);}
.grain{position:absolute;inset:0;opacity:.07;mix-blend-mode:overlay;z-index:2;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.hbody{position:relative;z-index:3;width:100%;padding:0 var(--gut) 46px;}
.hbody .in{max-width:1400px;margin:0 auto;}
h1{font-size:clamp(30px,8.2vw,72px);font-weight:300;font-variation-settings:"opsz" 144;
  line-height:1.05;letter-spacing:-.02em;max-width:15ch;text-wrap:balance;}
.lede{margin-top:20px;font-size:16px;font-weight:400;color:rgba(237,235,228,.84);max-width:46ch;line-height:1.6;}
.cue{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:3;width:1px;height:30px;
  background:linear-gradient(to bottom,transparent,rgba(237,235,228,.5));animation:cue 2.4s ease-in-out infinite;}
@keyframes cue{0%,100%{opacity:.25;transform:translateX(-50%) scaleY(.6);}50%{opacity:1;transform:translateX(-50%) scaleY(1);}}

/* ── filmstrip ── */
.strip{display:grid;grid-template-columns:1fr;background:#05060A;}
.pane{position:relative;overflow:hidden;cursor:pointer;background:#05060A;aspect-ratio:9/13;}
.pane img,.pane video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform 1.1s cubic-bezier(.2,.7,.2,1),opacity .9s ease,filter .7s ease;}
.pane img{filter:saturate(.85) brightness(.78);}
.pane video{opacity:0;}
.pane.on video{opacity:1;}
.pane.on img{opacity:0;}
.pane::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(5,6,10,.9) 0%,rgba(5,6,10,.25) 34%,transparent 62%);}
.pane + .pane{box-shadow:0 -1px 0 rgba(237,235,228,.07);}
.pmeta{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px var(--gut);}
.pmeta a{display:block;color:var(--ink);text-decoration:none;font-size:19px;font-weight:400;
  font-variation-settings:"opsz" 72;letter-spacing:-.01em;transition:color .35s;}
.pmeta a:hover{color:var(--gold);}
.pmeta .s{display:block;margin-top:6px;color:rgba(237,235,228,.5);}

/* ── sections ── */
section{padding:56px var(--gut);border-top:1px solid var(--line);}
section .in{max-width:1400px;margin:0 auto;}
.eyebrow{color:var(--dim);margin-bottom:26px;}
h2{font-size:clamp(24px,6vw,42px);font-weight:300;font-variation-settings:"opsz" 144;
  line-height:1.1;letter-spacing:-.02em;margin-bottom:10px;}

.names{padding-left:0;padding-right:0;}
.names .in{padding:0 var(--gut);}
.names .eyebrow{text-align:center;margin-bottom:30px;}
.names .rows{display:flex;flex-direction:column;gap:8px;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent);
          mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent);}
.names .row{overflow:hidden;}
.names .rail{display:flex;gap:8px;width:max-content;animation:drift 62s linear infinite;}
.names .row.rev .rail{animation-direction:reverse;}
.names .row:nth-child(2) .rail{animation-duration:78s;}
.names .row:nth-child(3) .rail{animation-duration:70s;}
.names .tile{width:208px;flex:0 0 auto;border:1px solid var(--line);padding:18px 16px;min-height:98px;
  display:flex;flex-direction:column;justify-content:flex-end;background:rgba(255,255,255,.012);
  transition:border-color .45s ease,background .45s ease;}
.names .tile b{display:block;font-weight:400;font-size:15px;color:var(--ink);line-height:1.28;letter-spacing:-.01em;}
.names .tile em{font-style:normal;display:block;margin-top:8px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim);}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(-33.3333%)}}
@media(hover:hover) and (pointer:fine){
  .names .rows:hover .rail{animation-play-state:paused;}
  .names .tile:hover{border-color:rgba(232,200,122,.5);background:rgba(232,200,122,.05);}
}
@media(prefers-reduced-motion:reduce){ .names .rail{animation:none;} }

.big{font-size:clamp(28px,7.5vw,58px);font-weight:300;font-variation-settings:"opsz" 144;
  line-height:1.1;letter-spacing:-.02em;}
.big em{font-style:normal;color:var(--gold);}
.reach .txt{margin-top:24px;}
.reach p{font-size:16px;color:var(--soft);line-height:1.65;max-width:48ch;}
.reach .tag{color:var(--gold);margin-bottom:12px;}

/* ── the pitch page ── */
.cols{display:grid;grid-template-columns:1fr;gap:44px;}
.col h3{color:var(--gold);margin-bottom:20px;}
.col li{list-style:none;font-size:16px;color:var(--soft);line-height:1.6;padding:14px 0;border-top:1px solid var(--line);}
.col li:first-of-type{border-top:0;padding-top:0;}
.col li b{color:var(--ink);font-weight:500;display:block;margin-bottom:4px;}
.col p{font-size:16px;color:var(--soft);line-height:1.68;}
.col p + p{margin-top:14px;}
.col p b{color:var(--ink);font-weight:500;}
.places{margin-top:26px;font-style:italic;color:var(--soft);font-size:16px;max-width:44ch;}

/* ── contact ── */
.end{padding:78px var(--gut) 68px;border-top:1px solid var(--line);text-align:center;}
.end .lbl{color:var(--dim);margin-bottom:26px;}
.end a.m{font-size:clamp(24px,7vw,62px);font-weight:300;font-variation-settings:"opsz" 144;
  color:var(--ink);text-decoration:none;letter-spacing:-.02em;transition:color .35s;word-break:break-word;}
.end a.m:hover{color:var(--gold);}
.end p{margin-top:22px;font-size:16px;color:var(--soft);max-width:40ch;margin-inline:auto;}
.foot{margin-top:52px;display:flex;justify-content:center;gap:20px;flex-wrap:wrap;color:var(--dim);}
.foot a{color:var(--dim);text-decoration:none;}
.foot a:hover{color:var(--ink);}

/* ── tablet ── */
@media(min-width:700px){
  :root{--gut:32px;}
  .lbl{font-size:10.5px;letter-spacing:.34em;}
  .nav{padding:28px var(--gut);}
  .nav .mail{display:inline;}
  .hbody{padding-bottom:54px;}
  .lede{font-size:17px;}
  .strip{grid-template-columns:repeat(2,1fr);}
  .pane + .pane{box-shadow:none;}
  .pane{box-shadow:inset 1px 0 0 rgba(237,235,228,.07);}
  section{padding:76px var(--gut);}
  .cols{grid-template-columns:repeat(2,1fr);gap:48px;}
  .names .rows{gap:10px;}
  .names .rail{gap:10px;}
  .names .tile{width:246px;padding:22px 20px;min-height:112px;}
  .names .tile b{font-size:16.5px;}
  .reach .in{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;}
  .reach .txt{margin-top:0;}
}

/* ── desktop ── */
@media(min-width:1000px){
  :root{--gut:40px;}
  .nav{padding:34px var(--gut);}
  .nav .links{gap:26px;}
  .hero{min-height:100svh;}
  .hbody{padding-bottom:62px;}
  .hbody .in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:end;}
  .lede{margin-top:0;padding-bottom:9px;font-size:18px;max-width:38ch;}
  .strip{grid-template-columns:repeat(4,1fr);height:82svh;min-height:520px;}
  .pane{aspect-ratio:auto;}
  .pmeta{padding:26px 24px;}
  .pmeta a{font-size:21px;}
  section{padding:92px var(--gut);}
  .cols{grid-template-columns:repeat(3,1fr);gap:64px;}
  .end{padding:84px var(--gut) 96px;}
  .foot{margin-top:74px;gap:26px;}
}
@media(hover:hover) and (pointer:fine){
  .pane:hover img,.pane:hover video{transform:scale(1.035);}
  .pane:hover img{filter:saturate(1) brightness(.92);}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;}
}

/* ── hero with nothing on it: the video is the whole point, so the heavy
   bottom gradient that existed to make headline text readable is gone.
   Only enough darkening at the very top to keep the nav legible. ── */
.hero.clean{align-items:stretch;}
.hero.clean::after{background:
  linear-gradient(to bottom,rgba(5,6,10,.55) 0%,rgba(5,6,10,.12) 16%,rgba(5,6,10,0) 34%,rgba(5,6,10,0) 78%,rgba(5,6,10,.45) 100%);}
.hero.clean .poster{object-position:50% 42%;}

/* ── the headline band: the line that used to sit on the video, centred ── */
.statement{border-top:0;padding-top:64px;padding-bottom:64px;text-align:center;}
.statement h1{max-width:24ch;margin:0 auto;}

/* ── the closing line: a pull quote, not body copy ── */
.reason{text-align:center;padding-top:56px;padding-bottom:56px;position:relative;
  background:radial-gradient(120% 90% at 50% 50%,rgba(232,200,122,.055) 0%,rgba(232,200,122,0) 62%);}
.reason .in{position:relative;}
.reason .in::before{content:"";display:block;width:80px;height:1px;margin:0 auto 30px;
  background:linear-gradient(to right,transparent,rgba(232,200,122,.85),transparent);}
.reason p{font-family:"Fraunces","Iowan Old Style",Palatino,Georgia,serif;
  font-size:clamp(24px,5.6vw,34px);font-weight:300;font-variation-settings:"opsz" 144;
  line-height:1.32;letter-spacing:-.015em;color:var(--ink);max-width:26ch;margin:0 auto;text-wrap:balance;}
.reason p em{font-style:normal;color:var(--gold);}

.reach .tag a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(232,200,122,.4);padding-bottom:2px;transition:border-color .3s;}
.reach .tag a:hover{border-bottom-color:var(--gold);}

@media(min-width:700px){
  .statement{padding-top:92px;padding-bottom:92px;}
  .reason{padding-top:52px;padding-bottom:52px;}
  .reason p{max-width:30ch;}
}
@media(min-width:1000px){
  .statement{padding-top:128px;padding-bottom:124px;}
  .statement h1{max-width:26ch;}
  .reason{padding-top:48px;padding-bottom:48px;}
  .reason .in::before{width:96px;margin-bottom:34px;}
  .reason p{font-size:clamp(34px,3.1vw,46px);max-width:31ch;}
}

/* ── the places line, under the centred headline ── */
.statement .places{margin:30px auto 0;max-width:40ch;font-style:italic;
  font-size:16px;line-height:1.75;color:rgba(185,183,176,.8);text-wrap:balance;}
@media(min-width:700px){ .statement .places{margin-top:36px;font-size:17px;max-width:52ch;} }
@media(min-width:1000px){ .statement .places{margin-top:42px;font-size:18px;max-width:58ch;} }