*{box-sizing:border-box}
html,body{margin:0;background:#000;color:#f3efe9;font-family:Georgia,"Times New Roman",serif}
.hero{min-height:100svh;display:grid;grid-template-columns:minmax(340px,36%) minmax(0,64%);background:#000}
.hero-copy{padding:48px 34px;display:flex;flex-direction:column;justify-content:center;text-align:center;z-index:5;background:#020202}
.small{text-transform:uppercase;letter-spacing:.13em;line-height:1.65;font-size:clamp(.72rem,.95vw,.98rem);margin:3px 0}
.rule{width:175px;max-width:65%;height:1px;margin:16px auto;background:linear-gradient(90deg,transparent,#aaa,transparent)}
h1{margin:24px 0 10px;font-weight:400;font-size:clamp(4rem,7vw,7.4rem);line-height:.9;letter-spacing:.12em}
.tag{margin:9px 0 18px;color:#f02222;text-transform:uppercase;font-size:clamp(1rem,1.5vw,1.42rem);letter-spacing:.21em}
.production,.release{text-transform:uppercase;letter-spacing:.13em}
.production{margin:2px 0 14px}
.release{color:#e01b1b;margin:0 0 24px}
.actions{display:grid;gap:13px;width:min(370px,100%);margin:0 auto}
.btn{min-height:58px;display:flex;align-items:center;justify-content:center;border:1px solid #555;background:#090909;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font:inherit;cursor:pointer}
.primary{background:linear-gradient(#a70b0b,#690000);border-color:#d71919}
.lower-links{width:min(370px,100%);margin:17px auto 0;display:flex;flex-direction:column;align-items:flex-start;gap:9px;text-align:left}
.lower-links a,.lower-links button{color:#d5d5d5;text-decoration:none;font:inherit;font-size:.95rem;background:none;border:0;padding:0;cursor:pointer}
.lower-links a:hover,.lower-links button:hover{text-decoration:underline}

.hero-art{min-width:0;min-height:100svh;display:flex;align-items:center;justify-content:center;background:#000;overflow:hidden}
.image-wrap{position:relative;width:100%;max-width:100%;aspect-ratio:998/730;flex:0 0 auto}
.image-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.lightning{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 10%,rgba(245,250,255,.95),rgba(186,218,255,.28) 24%,transparent 58%),linear-gradient(180deg,rgba(225,240,255,.20),transparent 60%);mix-blend-mode:screen}
.lightning.flash{animation:flash .65s ease-out}
@keyframes flash{0%{opacity:0}7%{opacity:.9}13%{opacity:.08}23%{opacity:.62}31%{opacity:.04}43%{opacity:.30}100%{opacity:0}}

.modal{display:none;position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.93);place-items:center;padding:24px}
.modal.open{display:grid}
.close{position:fixed;right:22px;top:10px;border:0;background:none;color:#fff;font-size:48px;cursor:pointer;z-index:101}
.poster{max-width:95vw;max-height:94vh;width:auto;height:auto;object-fit:contain}
.about-box{position:relative;width:min(760px,92vw);max-height:84vh;overflow:auto;padding:46px 44px 34px;background:#090909;border:1px solid rgba(255,255,255,.28);box-shadow:0 18px 70px rgba(0,0,0,.85)}
.about-box h2{margin:0 0 24px;text-transform:uppercase;letter-spacing:.14em;font-weight:400;font-size:clamp(1.7rem,3vw,2.5rem)}
.about-box p{margin:0 0 22px;line-height:1.8;font-size:clamp(1rem,1.4vw,1.15rem);color:#eeeae4}
.about-x{position:absolute;right:12px;top:6px;border:0;background:none;color:#fff;font-size:38px;cursor:pointer}

@media(max-width:900px){
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero-copy{padding:42px 22px 36px}
  .hero-art{min-height:0;height:auto}
  .image-wrap{width:100%;aspect-ratio:998/730}
  .lower-links{align-items:center;text-align:center}
}
@media(max-width:620px){
  h1{font-size:clamp(3.1rem,17vw,4.8rem);letter-spacing:.08em}
  .tag{font-size:.92rem}
  .about-box{padding:44px 24px 28px}
}
@media(prefers-reduced-motion:reduce){.lightning{display:none}}