@font-face{
  font-family:"Montserrat";
  src:url("fonts/montserrat-var.woff2") format("woff2-variations");
  font-weight:100 900;font-style:normal;font-display:swap;
}
:root{
  --white:#FFFFFF;
  --lime:#C6CC2E;
  --grey:#D4D2D2;
  --mid:#A5A8AB;
  --ink:#1A1A1A;
  --gut:clamp(20px,4.4vw,80px);
  --font:"Montserrat",-apple-system,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--white);color:var(--ink);
  font-family:var(--font);font-weight:400;font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
::selection{background:var(--lime);color:var(--ink)}
:focus-visible{outline:2px solid var(--lime);outline-offset:4px}

.eyebrow{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--mid)}

/* ── nav ─────────────────────────────────────────── */
.nav{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;justify-content:space-between;
  padding:clamp(16px,2.2vw,28px) var(--gut);transition:background .3s,box-shadow .3s,padding .3s}
.nav.solid{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);box-shadow:0 1px 0 #EDEDED}
.wordmark{font-weight:800;font-size:clamp(15px,1.5vw,19px);letter-spacing:-.02em;color:var(--lime);line-height:1}
.wordmark small{display:block;font-weight:500;font-size:9px;letter-spacing:.3em;color:var(--mid);margin-top:5px}
.burger{width:34px;height:20px;border:0;background:none;padding:0;cursor:pointer;position:relative}
.burger i{position:absolute;left:0;right:0;height:2px;background:var(--ink);transition:transform .35s cubic-bezier(.6,0,.2,1),opacity .2s}
.burger i:nth-child(1){top:2px}
.burger i:nth-child(2){top:9px}
.burger i:nth-child(3){top:16px}
body.menu-open .burger i:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.menu-open .burger i:nth-child(2){opacity:0}
body.menu-open .burger i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.menu{position:fixed;inset:0;z-index:70;background:var(--white);display:flex;flex-direction:column;justify-content:center;
  padding:0 var(--gut);opacity:0;pointer-events:none;transition:opacity .3s}
body.menu-open .menu{opacity:1;pointer-events:auto}
.menu a{display:block;font-weight:800;font-size:clamp(38px,9vw,120px);line-height:1.02;letter-spacing:-.045em;color:var(--grey);
  transition:color .25s;padding:2px 0}
.menu a:hover,.menu a[aria-current]{color:var(--lime)}
.menu .foot{margin-top:clamp(28px,5vh,60px);display:flex;flex-wrap:wrap;gap:26px;font-size:14px;color:var(--mid)}
.menu .foot a{font-size:14px;font-weight:500;color:var(--mid);letter-spacing:0}
.menu .foot a:hover{color:var(--ink)}

/* ── hero ────────────────────────────────────────── */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:clamp(120px,17vh,180px) var(--gut) clamp(48px,9vh,96px)}
.big{font-weight:800;letter-spacing:-.05em;line-height:.84;color:var(--grey);margin:0}
.hero .big{font-size:clamp(64px,13.4vw,205px)}
.hero .big em{font-style:normal;color:var(--lime);display:block}
.hero-sub{margin:clamp(26px,4vh,44px) 0 0;max-width:26ch;font-weight:300;font-size:clamp(17px,1.9vw,28px);line-height:1.3;color:var(--mid);letter-spacing:-.01em}
.hero-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:clamp(24px,4vw,60px)}
.picks{display:flex;gap:clamp(16px,2vw,28px);flex-wrap:wrap;padding-bottom:10px}
.pick{display:inline-flex;align-items:center;gap:11px;font-size:13px;font-weight:500;color:var(--mid);background:none;border:0;cursor:pointer;padding:0}
.pick b{width:20px;height:20px;border:1.5px solid var(--grey);display:block;transition:.25s}
.pick:hover{color:var(--ink)}
.pick:hover b,.pick.on b{border-color:var(--lime);background:var(--lime)}

/* ── section heads ───────────────────────────────── */
.band{padding:clamp(60px,11vh,150px) var(--gut) clamp(24px,4vh,54px)}
.band h2{font-weight:800;font-size:clamp(42px,8.2vw,132px);line-height:.9;letter-spacing:-.045em;color:var(--grey);margin:16px 0 0}
.band h2 em{font-style:normal;color:var(--lime)}
.band p{max-width:52ch;margin:clamp(18px,3vh,32px) 0 0;font-weight:300;font-size:clamp(16px,1.7vw,22px);color:var(--mid);line-height:1.45}
.rule{height:1px;background:#EDEDED;margin:0 var(--gut)}

/* ── films ───────────────────────────────────────── */
.filmhead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:clamp(34px,6vh,80px) var(--gut) clamp(14px,2vh,22px)}
.filmhead h3{font-weight:800;font-size:clamp(30px,5.4vw,88px);line-height:.9;letter-spacing:-.04em;margin:10px 0 0;color:var(--ink)}
.filmhead .no{font-weight:600;font-size:12px;letter-spacing:.2em;color:var(--lime)}
.filmhead .spec{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--mid);white-space:nowrap}

.stage{position:relative;width:100%;height:100svh;background:var(--white);overflow:hidden}
.stage video,.stage img.poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (orientation:portrait){
  .stage{height:auto;aspect-ratio:16/9}
  .stage video,.stage img.poster{object-fit:cover}
}
@media (orientation:landscape) and (max-height:520px){.stage{height:100svh}}
.stage video{opacity:0;transition:opacity .4s}
.stage.playing video{opacity:1}
.stage.playing img.poster,.stage.playing .cover{opacity:0;pointer-events:none}
.cover{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;transition:opacity .35s;
  background:radial-gradient(130% 95% at 50% 55%,rgba(0,0,0,.10),rgba(0,0,0,.34))}
.playbtn{display:inline-flex;align-items:center;gap:14px;background:rgba(255,255,255,.94);border:0;cursor:pointer;
  padding:16px 26px;font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);transition:.28s}
.playbtn svg{width:12px;height:14px;fill:var(--lime);transition:fill .28s}
.playbtn:hover{background:var(--lime);color:var(--ink)}
.playbtn:hover svg{fill:var(--ink)}

/* ── logo marquee ────────────────────────────────── */
.marquee{border-top:1px solid #EDEDED;border-bottom:1px solid #EDEDED;padding:clamp(30px,5vh,54px) 0;overflow:hidden;margin-top:clamp(50px,9vh,120px)}
.marquee .eyebrow{padding:0 var(--gut);display:block;margin-bottom:clamp(22px,4vh,42px)}
.track{display:flex;width:max-content;align-items:center;animation:scroll 46s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.track img{height:clamp(28px,3vw,40px);width:auto;opacity:.42;transition:opacity .3s;margin-right:clamp(46px,7vw,110px)}
.track img:hover{opacity:1}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── cta ─────────────────────────────────────────── */
.cta{padding:clamp(80px,15vh,200px) var(--gut) clamp(50px,8vh,100px)}
.cta h2{font-weight:800;font-size:clamp(52px,13vw,210px);line-height:.86;letter-spacing:-.05em;color:var(--grey);margin:0}
.cta h2 em{font-style:normal;color:var(--lime)}
.cta .lines{display:flex;flex-wrap:wrap;gap:clamp(18px,4vw,56px);margin-top:clamp(30px,5vh,60px);font-size:15px;font-weight:500}
.cta .lines a{color:var(--mid);border-bottom:1.5px solid transparent;transition:.25s;padding-bottom:2px}
.cta .lines a:hover{color:var(--ink);border-color:var(--lime)}

footer{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;padding:26px var(--gut) 40px;border-top:1px solid #EDEDED;
  font-size:12px;letter-spacing:.04em;color:var(--mid)}
footer ul{display:flex;gap:22px;list-style:none;margin:0;padding:0}
footer a:hover{color:var(--ink)}

/* ── prose (about, contact) ──────────────────────── */
.prose{padding:0 var(--gut) clamp(60px,10vh,130px);max-width:60ch}
.prose p{color:var(--mid);font-weight:300;font-size:clamp(16px,1.7vw,20px);margin:0 0 22px}
.prose h3{font-weight:700;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);margin:44px 0 12px}
.prose a{color:var(--ink);border-bottom:1.5px solid var(--lime)}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}

.track img.tall{height:clamp(40px,4.6vw,62px)}

/* narrow screens: film titles stack, nothing runs off the edge */
@media(max-width:720px){
  .filmhead{display:block;padding-bottom:16px}
  .filmhead h3{font-size:clamp(28px,8.4vw,46px);line-height:.95}
  .filmhead .spec{display:block;margin-top:12px;font-size:11px}
  .hero-row{display:block}
  .picks{margin-top:30px}
  .cta .lines{gap:14px 26px;font-size:14px}
}

/* ── why ai films ────────────────────────────────── */
.reasons{padding:0 var(--gut) clamp(50px,9vh,110px);display:grid;gap:0;grid-template-columns:1fr}
@media(min-width:860px){.reasons{grid-template-columns:1fr 1fr;column-gap:clamp(40px,6vw,110px)}}
.reason{border-top:1px solid #EDEDED;padding:clamp(24px,4vh,40px) 0}
.reason h3{font-weight:700;font-size:clamp(21px,2.4vw,32px);letter-spacing:-.025em;margin:0;color:var(--ink)}
.reason h3 span{color:var(--lime)}
.reason p{margin:12px 0 0;font-weight:300;font-size:clamp(15px,1.5vw,18px);line-height:1.5;color:var(--mid);max-width:46ch}

/* ── packages ────────────────────────────────────── */
.packs{padding:0 var(--gut) clamp(30px,5vh,60px)}
.pack{display:grid;grid-template-columns:1fr;gap:14px;border-top:1px solid #EDEDED;padding:clamp(26px,4.5vh,46px) 0}
@media(min-width:900px){.pack{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) auto;gap:clamp(30px,5vw,70px);align-items:baseline}}
.pack .name{font-weight:800;font-size:clamp(30px,4.6vw,68px);line-height:.92;letter-spacing:-.04em;color:var(--grey);margin:0}
.pack .name span{color:var(--lime)}
.pack ul{list-style:none;margin:0;padding:0}
.pack li{font-weight:300;font-size:clamp(15px,1.5vw,18px);color:var(--mid);line-height:1.5}
.pack li b{font-weight:500;color:var(--ink)}
.pack .price{font-weight:800;font-size:clamp(26px,3.6vw,54px);letter-spacing:-.035em;color:var(--lime);white-space:nowrap;margin:0}
.packs .note{border-top:1px solid #EDEDED;padding-top:22px;margin:0;font-weight:300;font-size:14px;color:var(--mid)}
.packs .note span{display:block;max-width:60ch}
.singles{display:grid;grid-template-columns:1fr;gap:0}
@media(min-width:860px){.singles{grid-template-columns:1fr 1fr;column-gap:clamp(40px,6vw,110px)}}
.single{border-top:1px solid #EDEDED;padding:clamp(24px,4vh,38px) 0}
.single h4{font-weight:700;font-size:clamp(19px,2.1vw,26px);letter-spacing:-.02em;margin:0;color:var(--ink)}
.single .price{font-weight:800;font-size:clamp(22px,2.8vw,38px);letter-spacing:-.03em;color:var(--lime);margin:10px 0 0}
.single p{margin:8px 0 0;font-weight:300;font-size:15px;color:var(--mid)}