/* ===========================================================
   50% FILM — shared site chassis
   Loaded by every page. Page-specific CSS stays in the page.
   =========================================================== */

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --black:#0a0a0a; --white:#f0ece4; --cream:#e8e2d6;
  --red:#c8341a; --gray:#2a2a2a; --mid:#888; --line:#1a1a1a;
  --safe-top: env(safe-area-inset-top, 0px);
  --ticker-h: calc(38px + var(--safe-top));
}

html { scroll-behavior:smooth; }
html { overflow-x:hidden; max-width:100%; }
body { background:var(--black); color:var(--white); font-family:'Space Mono',monospace; cursor:none; overflow-x:hidden; max-width:100%; position:relative; }
a { text-decoration:none; color:inherit; }
img { display:block; width:100%; height:100%; object-fit:cover; }

.shell { max-width:1240px; margin:0 auto; padding:0 40px; }
@media (max-width:720px){ .shell{padding:0 22px} }

/* grain + cursor ------------------------------------------ */
/* layered background: warm depth, a faint grid and two slow red glows */
body { background:
    radial-gradient(ellipse 90% 60% at 12% -6%, rgba(200,52,26,.10), transparent 62%),
    radial-gradient(ellipse 80% 55% at 92% 42%, rgba(200,52,26,.07), transparent 60%),
    linear-gradient(178deg, #0d0b0a 0%, #0a0a0a 42%, #080807 100%);
  background-attachment: fixed;
}
body::after { content:''; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(rgba(240,236,228,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(240,236,228,.022) 1px, transparent 1px);
  background-size: 92px 92px;
  mask-image: radial-gradient(ellipse 120% 90% at 50% 30%, #000 20%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 120% 90% at 50% 30%, #000 20%, transparent 78%);
}
body > * { position:relative; z-index:1; }

body::before { content:''; position:fixed; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E"); pointer-events:none; z-index:9998; opacity:.35; }
.cursor { position:fixed; width:10px; height:10px; background:var(--red); border-radius:50%; pointer-events:none; z-index:9999; transform:translate(-50%,-50%); transition:width .2s,height .2s; mix-blend-mode:difference; }
.cursor.big { width:40px; height:40px; }
@media (hover:none){ body{cursor:auto} .cursor{display:none} }

/* reveal on scroll ---------------------------------------- */
.rv { opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.rv.in { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .rv{opacity:1;transform:none;transition:none} }

/* release ticker ------------------------------------------ */
.release-ticker { position:fixed; top:0; left:0; right:0; z-index:101; background:var(--red); padding:calc(11px + var(--safe-top)) 22px 11px; text-align:center; font-size:10px; letter-spacing:.3em; color:var(--white); text-transform:uppercase; height:var(--ticker-h); display:flex; align-items:center; justify-content:center; cursor:none; }
.release-ticker-dot { display:inline-block; width:6px; height:6px; background:var(--white); border-radius:50%; margin:0 12px; vertical-align:middle; animation:pulse 1.8s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }
.ticker-watch { text-decoration:underline; text-underline-offset:4px; }
@media (max-width:720px){ .release-ticker{font-size:9px;letter-spacing:.2em;padding:calc(10px + var(--safe-top)) 14px 10px} .release-ticker-detail{display:none} }
@media (prefers-reduced-motion:reduce){ .release-ticker-dot{animation:none} }

/* nav ------------------------------------------------------ */
nav.site-nav { position:fixed; top:var(--ticker-h); left:0; right:0; z-index:100; display:flex; justify-content:space-between; align-items:flex-start; padding:28px 40px; mix-blend-mode:difference; }
.nav-logo { font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:.15em; }
.nav-left { display:flex; align-items:center; }
.nav-inline { display:flex; gap:26px; align-items:center; margin-left:40px; }
.nav-inline a { font-size:10px; letter-spacing:.2em; text-transform:uppercase; padding-bottom:4px; border-bottom:1px solid transparent; transition:border-color .2s; }
.nav-inline a:hover, .nav-inline a:focus-visible { border-color:var(--white); outline:none; }
.nav-inline a.here { border-color:var(--red); }
@media (max-width:980px){ .nav-inline{display:none} }
@media (max-width:720px){ nav.site-nav{padding:20px 22px} }

.menu-toggle { display:flex; align-items:center; gap:12px; background:none; border:none; cursor:none; padding:0; z-index:101; color:var(--white); }
.menu-toggle-label { font-size:10px; letter-spacing:.2em; text-transform:uppercase; }
.menu-toggle-bars { display:flex; flex-direction:column; justify-content:center; gap:5px; width:26px; height:18px; }
.menu-toggle-bars span { display:block; width:100%; height:2px; background:var(--white); transition:transform .3s,opacity .3s; }
.menu-toggle.open .menu-toggle-bars span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.open .menu-toggle-bars span:nth-child(2){opacity:0}
.menu-toggle.open .menu-toggle-bars span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.nav-dropdown { position:fixed; top:0; right:0; width:min(420px,100%); height:100vh; background:var(--black); border-left:1px solid var(--line); z-index:102; transform:translateX(100%); transition:transform .45s cubic-bezier(.65,0,.35,1); overflow-y:auto; display:flex; flex-direction:column; justify-content:flex-start; padding:110px 48px 60px; }
.nav-dropdown.open { transform:translateX(0); }
.nav-dropdown-eyebrow { font-size:9px; letter-spacing:.3em; text-transform:uppercase; color:var(--red); margin-bottom:20px; }
.nav-dropdown-list { list-style:none; border-top:1px solid var(--line); }
.nav-dropdown-list li { border-bottom:1px solid var(--line); }
.nav-dropdown-list a { display:flex; justify-content:space-between; align-items:center; padding:17px 0; font-family:'DM Serif Display',serif; font-style:italic; font-size:24px; transition:padding-left .3s,color .3s; }
.nav-dropdown-list a:hover, .nav-dropdown-list a:focus-visible { color:var(--red); padding-left:12px; outline:none; }
.nav-dropdown-num { font-family:'Space Mono',monospace; font-style:normal; font-size:10px; letter-spacing:.2em; color:var(--mid); transition:color .3s; }
.nav-dropdown-list a:hover .nav-dropdown-num { color:var(--red); }
.nav-dropdown-sep { padding:26px 0 10px; font-size:9px; letter-spacing:.3em; text-transform:uppercase; color:var(--mid); }
.nav-dropdown-footer { margin-top:40px; display:flex; gap:26px; flex-wrap:wrap; }
.nav-dropdown-footer a { font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--mid); transition:color .2s; }
.nav-dropdown-footer a:hover { color:var(--white); }
.nav-backdrop { position:fixed; inset:0; background:rgba(10,10,10,.6); backdrop-filter:blur(2px); z-index:101; opacity:0; pointer-events:none; transition:opacity .4s; }
.nav-backdrop.open { opacity:1; pointer-events:auto; }
body.nav-locked { overflow:hidden; }
@media (max-width:600px){ .nav-dropdown{padding:90px 28px;width:100%} .nav-dropdown-list a{font-size:21px} .menu-toggle-label{display:none} }
@media (prefers-reduced-motion:reduce){ .nav-dropdown,.nav-backdrop{transition:none} }

/* shared page furniture ------------------------------------ */
.page-head { padding-top: calc(var(--ticker-h) + 150px); padding-bottom: 40px; }
.page-eyebrow { font-size:9px; letter-spacing:.3em; text-transform:uppercase; color:var(--red); margin-bottom:22px; }
.page-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(58px,12vw,150px); line-height:.8; font-weight:400; }
.page-title span { color:var(--red); }
.page-sub { max-width:340px; font-size:10px; line-height:2.1; color:var(--mid); }
.col-head { font-family:'Bebas Neue',sans-serif; font-size:30px; line-height:1; font-weight:400; }
.col-sub { font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:var(--mid); margin:8px 0 0; padding-bottom:18px; border-bottom:1px solid var(--line); }
.more { display:inline-block; margin-top:24px; font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:var(--red); border-bottom:1px solid var(--red); padding-bottom:4px; }

.card-rating { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.card-rating .stars { display:inline-flex; gap:3px; line-height:1; }
.card-rating .st { position:relative; display:inline-block; font-size:15px; line-height:1; }
.card-rating .st-base { color:#24211d; display:block; }
.card-rating .st-fill { position:absolute; top:0; left:0; overflow:hidden; white-space:nowrap; color:var(--red); }
.card-rating .rating-num { font-size:9px; letter-spacing:.15em; color:var(--mid); }
.card-rating .denom { color:#444; }

footer.site-footer { border-top:1px solid var(--line); padding:34px 0 46px; margin-top:20px; }
.footer-inner { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--mid); }
.footer-inner a:hover { color:var(--white); }
