:root {
  --ink: #f4ead5;
  --paper: #d9caa7;
  --night: #07101c;
  --night-2: #0d1b28;
  --panel: rgba(10, 22, 32, 0.91);
  --red: #ef4d3d;
  --amber: #f2b84b;
  --mint: #93d7bd;
  --line: rgba(244, 234, 213, 0.19);
  --shadow: 0 22px 70px rgba(0, 0, 0, 0.46);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    radial-gradient(circle at 20% -10%, rgba(50, 85, 102, .32), transparent 32rem),
    linear-gradient(180deg, var(--night), #050a10 70%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1rem;
  line-height: 1.65;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .12;
  z-index: 10;
  background-image: repeating-linear-gradient(0deg, transparent 0 3px, rgba(255,255,255,.05) 3px 4px);
  mix-blend-mode: screen;
}

a { color: inherit; }
img { display: block; max-width: 100%; }
button { font: inherit; }
.skip-link { position: absolute; left: -999px; top: 1rem; z-index: 99; }
.skip-link:focus { left: 1rem; background: var(--ink); color: #111; padding: .6rem 1rem; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .8rem clamp(1rem, 4vw, 4rem);
  border-bottom: 1px solid var(--line);
  background: rgba(5, 12, 19, .9);
  backdrop-filter: blur(16px);
}

.brand { display: flex; align-items: center; gap: .75rem; text-decoration: none; }
.brand-mark {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border: 2px solid var(--amber);
  border-radius: 50% 50% 46% 54%;
  color: var(--amber);
  font-size: 1.2rem;
  box-shadow: 0 0 22px rgba(242,184,75,.22);
}
.brand-copy { line-height: 1; }
.brand-copy strong { display: block; font-family: Impact, "Arial Black", sans-serif; letter-spacing: .055em; font-size: 1.05rem; }
.brand-copy span { color: var(--mint); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; }

.nav-toggle { display: none; color: var(--ink); background: transparent; border: 1px solid var(--line); padding: .5rem .75rem; border-radius: 999px; }
.site-nav { display: flex; align-items: center; gap: .2rem; }
.site-nav a {
  padding: .48rem .72rem;
  border-radius: 999px;
  color: #d5d7d4;
  font-size: .9rem;
  text-decoration: none;
}
.site-nav a:hover, .site-nav a[aria-current="page"] { color: #07101c; background: var(--amber); }

main { min-height: 75vh; }
.hero {
  position: relative;
  min-height: 76vh;
  display: grid;
  align-items: end;
  overflow: hidden;
  isolation: isolate;
}
.hero::after { content:""; position:absolute; inset:0; z-index:-1; background: linear-gradient(90deg, rgba(3,7,11,.92) 0%, rgba(3,7,11,.44) 48%, rgba(3,7,11,.08)), linear-gradient(0deg, #07101c 0%, transparent 45%); }
.hero-media { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-content { width: min(1180px, 92vw); margin: 0 auto; padding: 7rem 0 5rem; }
.eyebrow { color: var(--mint); font-size: .78rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; }
h1, h2, h3 { margin: 0; line-height: 1.05; }
h1 { max-width: 850px; font-family: Impact, "Arial Black", sans-serif; font-size: clamp(4rem, 13vw, 9.5rem); font-weight: 900; letter-spacing: -.025em; text-transform: uppercase; text-shadow: .04em .04em 0 var(--red), -.02em -.02em 0 rgba(255,255,255,.2); }
.hero-deck { max-width: 640px; margin: 1rem 0 1.6rem; font-size: clamp(1.05rem, 2vw, 1.3rem); color: #e9e2d4; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.creator-credit { display:inline-flex; flex-wrap:wrap; align-items:center; gap:.38rem; margin:1.4rem 0 0; padding:.48rem .72rem; border:1px solid rgba(242,184,75,.45); background:rgba(3,7,11,.72); color:var(--ink); font-weight:800; letter-spacing:.03em; transform:rotate(-1deg); }
.creator-credit span { color:var(--mint); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; }
.creator-credit em { color:var(--amber); font-family:Georgia,serif; font-weight:400; }
.button { display: inline-flex; align-items:center; gap:.5rem; padding: .72rem 1rem; border: 1px solid var(--ink); text-decoration: none; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; font-size: .83rem; }
.button.primary { background: var(--red); border-color: var(--red); color: #fff; }
.button:hover { transform: translateY(-2px); box-shadow: 5px 5px 0 var(--amber); }

.ticker { overflow:hidden; border-block: 1px solid var(--line); background: var(--amber); color:#101418; }
.ticker-inner { display:flex; gap:2.5rem; width:max-content; padding:.52rem 1rem; font-weight:900; text-transform:uppercase; letter-spacing:.12em; font-size:.78rem; animation: crawl 24s linear infinite; }
@keyframes crawl { to { transform: translateX(-50%); } }

.wrap { width: min(1180px, 92vw); margin-inline: auto; }
.section { padding: clamp(4rem, 8vw, 7rem) 0; }
.section-tight { padding: 2.5rem 0; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:1.5rem; margin-bottom:2rem; }
.section-heading h2 { max-width: 760px; font-family: Impact, "Arial Black", sans-serif; font-size: clamp(2.3rem, 6vw, 5rem); letter-spacing:.01em; text-transform: uppercase; }
.section-heading p { max-width: 430px; margin:0; color:#b9c0bd; }

.stat-strip { display:grid; grid-template-columns: repeat(4, 1fr); border:1px solid var(--line); box-shadow: var(--shadow); }
.stat { padding:1.5rem; background:var(--panel); border-right:1px solid var(--line); }
.stat:last-child { border-right:0; }
.stat strong { display:block; color:var(--amber); font-family:Impact,"Arial Black",sans-serif; font-size:2.1rem; letter-spacing:.04em; }
.stat span { color:#b9c0bd; font-size:.82rem; text-transform:uppercase; letter-spacing:.12em; }

.case-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:1rem; }
.case-card { position:relative; min-height:260px; padding:1.5rem; overflow:hidden; border:1px solid var(--line); background:linear-gradient(145deg, rgba(18,36,48,.96), rgba(8,16,24,.94)); box-shadow: var(--shadow); text-decoration:none; }
.case-card::before { content:attr(data-number); position:absolute; right:-.05em; bottom:-.28em; color:rgba(255,255,255,.035); font: 900 9rem Impact,sans-serif; }
.case-card .tag { color:var(--mint); font-size:.75rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.case-card h3 { margin:.85rem 0 .7rem; font-family:Impact,"Arial Black",sans-serif; font-size:2rem; text-transform:uppercase; }
.case-card p { max-width:31ch; margin:0; color:#bfc6c2; }
.case-card:hover { border-color:var(--amber); transform:translateY(-4px) rotate(-.3deg); }

.feature-image { position:relative; margin:2.5rem 0; border:1px solid var(--line); background:#111; box-shadow:var(--shadow); }
.feature-image img { width:100%; max-height:640px; object-fit:cover; }
.feature-image figcaption { position:absolute; right:1rem; bottom:1rem; padding:.5rem .7rem; background:rgba(3,7,10,.82); color:#ded7c8; font-size:.76rem; letter-spacing:.08em; text-transform:uppercase; }

.page-hero { padding: clamp(5rem, 9vw, 8rem) 0 3rem; border-bottom:1px solid var(--line); background:radial-gradient(circle at 82% 10%, rgba(239,77,61,.2), transparent 28rem); }
.page-hero h1 { max-width:1000px; font-size:clamp(3.4rem, 10vw, 7.8rem); }
.page-hero p { max-width:730px; margin:1rem 0 0; color:#c9cfca; font-size:1.15rem; }
.breadcrumb { margin-bottom:1rem; color:var(--mint); font-size:.8rem; font-weight:800; text-transform:uppercase; letter-spacing:.14em; }

.story-grid { display:grid; grid-template-columns: minmax(0,1.3fr) minmax(260px,.7fr); gap:3rem; align-items:start; }
.prose h2 { margin:2.5rem 0 .8rem; font-family:Impact,"Arial Black",sans-serif; font-size:2.4rem; text-transform:uppercase; }
.prose h2:first-child { margin-top:0; }
.prose p { color:#c6cdc9; }
.notice { padding:1rem 1.2rem; border-left:4px solid var(--red); background:rgba(239,77,61,.1); color:#f4d6d1; }
.sidebar-card { position:sticky; top:6rem; padding:1.5rem; border:1px solid var(--line); background:var(--panel); }
.sidebar-card h3 { margin-bottom:1rem; color:var(--amber); font-size:.86rem; letter-spacing:.15em; text-transform:uppercase; }
.mini-list { list-style:none; margin:0; padding:0; }
.mini-list li { display:flex; justify-content:space-between; gap:1rem; padding:.65rem 0; border-bottom:1px dashed var(--line); color:#c3cac6; }
.mini-list li:last-child { border:0; }
.mini-list strong { color:var(--ink); text-align:right; }

.cast-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.cast-card { padding:1.4rem; border:1px solid var(--line); background:var(--panel); }
.cast-card .actor { color:var(--amber); font-family:Impact,"Arial Black",sans-serif; font-size:1.65rem; text-transform:uppercase; }
.cast-card .role { display:block; margin:.15rem 0 1rem; color:var(--mint); font-weight:800; }
.cast-card p { margin:0; color:#bdc5c1; }

.cast-photo-section { padding-bottom: 1rem; }
.cast-photo-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:1rem; }
.photo-card, .gallery-card { margin:0; border:1px solid var(--line); background:var(--panel); box-shadow:var(--shadow); }
.photo-card img { width:100%; height:clamp(290px, 43vw, 520px); object-fit:cover; object-position:center 24%; }
.photo-card figcaption { display:flex; justify-content:space-between; gap:1rem; padding:1rem 1.1rem; }
.photo-card figcaption strong { font-family:Impact,"Arial Black",sans-serif; font-size:1.2rem; letter-spacing:.035em; text-transform:uppercase; }
.photo-card figcaption span { max-width:48%; color:#aeb8b4; font-size:.82rem; text-align:right; }
.photo-card figcaption a, .gallery-card figcaption a { color:var(--mint); }

.film-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.gallery-card { overflow:hidden; box-shadow:none; }
.gallery-open { display:block; width:100%; padding:0; border:0; background:#030608; cursor:zoom-in; }
.gallery-open img { width:100%; height:230px; object-fit:cover; transition:transform .35s ease, opacity .35s ease; }
.gallery-open:hover img, .gallery-open:focus-visible img { transform:scale(1.035); opacity:.82; }
.gallery-card figcaption { display:flex; justify-content:space-between; gap:.75rem; padding:.85rem 1rem; color:#d4d8d5; font-size:.83rem; }
.gallery-card figcaption a { white-space:nowrap; }

.gallery-lightbox { width:min(1080px,94vw); max-height:92vh; padding:0; border:1px solid var(--line); background:#050a10; color:var(--ink); box-shadow:0 30px 100px #000; }
.gallery-lightbox::backdrop { background:rgba(0,0,0,.86); backdrop-filter:blur(6px); }
.gallery-lightbox img { width:100%; max-height:78vh; object-fit:contain; background:#020406; }
.gallery-lightbox p { margin:0; padding:1rem 1.25rem; color:#d7ddd9; font-weight:700; }
.lightbox-close { position:absolute; top:.7rem; right:.7rem; display:grid; place-items:center; width:2.7rem; height:2.7rem; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:rgba(3,7,10,.82); color:white; font-size:1.7rem; line-height:1; cursor:pointer; }

.timeline { position:relative; margin-left:.7rem; padding-left:2rem; border-left:2px solid rgba(242,184,75,.32); }
.timeline-item { position:relative; padding:0 0 2.3rem; }
.timeline-item::before { content:""; position:absolute; left:-2.45rem; top:.25rem; width:.78rem; height:.78rem; border-radius:50%; background:var(--red); box-shadow:0 0 0 5px #07101c, 0 0 0 6px rgba(239,77,61,.35); }
.timeline-item time { color:var(--mint); font-size:.77rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.timeline-item h3 { margin:.25rem 0 .55rem; font-size:1.35rem; }
.timeline-item p { margin:0; color:#bdc5c1; }

.facts-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.85rem; counter-reset:fact; }
.fact { position:relative; padding:1.35rem 1.35rem 1.35rem 4.2rem; min-height:120px; border:1px solid var(--line); background:rgba(12,25,35,.82); counter-increment:fact; }
.fact::before { content:counter(fact, decimal-leading-zero); position:absolute; left:1rem; top:.75rem; color:var(--red); font:1.6rem Impact,"Arial Black",sans-serif; }
.fact h3 { margin-bottom:.45rem; font-size:1.05rem; }
.fact p { margin:0; color:#bbc4c0; font-size:.95rem; }

.source-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.source { display:block; padding:1.2rem; border:1px solid var(--line); background:var(--panel); text-decoration:none; }
.source strong { color:var(--amber); }
.source span { display:block; color:#aeb8b4; font-size:.9rem; }
.source:hover { border-color:var(--mint); }

.site-footer { border-top:1px solid var(--line); padding:2.5rem 0; color:#929e99; }
.footer-grid { display:flex; justify-content:space-between; align-items:end; gap:2rem; }
.footer-note { max-width:660px; margin:0; font-size:.86rem; }
.footer-stamp { padding:.5rem .75rem; border:2px solid var(--red); color:var(--red); font-family:Impact,"Arial Black",sans-serif; letter-spacing:.09em; text-transform:uppercase; transform:rotate(-2deg); }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .55s ease, transform .55s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 850px) {
  .nav-toggle { display:block; }
  .site-nav { display:none; position:absolute; left:1rem; right:1rem; top:calc(100% + .5rem); flex-direction:column; align-items:stretch; padding:.6rem; border:1px solid var(--line); background:#07101c; box-shadow:var(--shadow); }
  .site-nav.open { display:flex; }
  .site-nav a { padding:.8rem 1rem; border-radius:.2rem; }
  .stat-strip { grid-template-columns:repeat(2,1fr); }
  .stat:nth-child(2) { border-right:0; }
  .stat:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .case-grid, .cast-grid { grid-template-columns:repeat(2,1fr); }
  .film-gallery { grid-template-columns:repeat(2,1fr); }
  .story-grid { grid-template-columns:1fr; }
  .sidebar-card { position:static; }
}

@media (max-width: 560px) {
  .brand-copy span { display:none; }
  .hero { min-height:70vh; }
  .hero-content { padding-bottom:3rem; }
  h1 { font-size:clamp(3.4rem,22vw,6rem); }
  .section-heading, .footer-grid { align-items:start; flex-direction:column; }
  .case-grid, .cast-grid, .facts-grid, .source-grid { grid-template-columns:1fr; }
  .cast-photo-grid, .film-gallery { grid-template-columns:1fr; }
  .photo-card figcaption { flex-direction:column; }
  .photo-card figcaption span { max-width:none; text-align:left; }
  .stat { padding:1rem; }
  .stat strong { font-size:1.65rem; }
  .feature-image figcaption { position:static; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
}