:root{color-scheme:dark;--red:#f01e2b;--white:#f7f7f7}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;background:#11100f}
body{overflow:hidden;font-family:Arial,Helvetica,sans-serif}
.landing{position:relative;display:grid;place-items:center;width:100%;height:100svh;min-height:100%;overflow:hidden;background:radial-gradient(ellipse at 50% 48%,#252321 0%,#151413 55%,#0e0e0d 100%)}
.poster{position:relative;width:100vw;height:100svh;flex:none;overflow:hidden}
.hero-art,.hero-art img{position:absolute;inset:0;display:block;width:100%;height:100%}
.hero-art img{object-fit:cover;object-position:center;user-select:none;-webkit-user-drag:none}
.mobile-brand{display:none}
.desktop-brand{position:absolute;z-index:3;left:clamp(32px,7.2vw,112px);top:clamp(26px,4.5vh,54px);color:var(--white);text-decoration:none;font-weight:750;font-size:clamp(22px,2.1vw,30px);letter-spacing:-1.2px}
.desktop-brand span{color:var(--red)}
.headline{position:absolute;z-index:2;left:8.5%;top:32%;width:50%;margin:0;color:var(--white);text-align:left;font-size:clamp(48px,6.5vw,102px);line-height:.98;letter-spacing:-.06em;font-weight:750;text-shadow:0 2px 30px #0005}
.headline span{color:var(--red)}
.headline-support{position:absolute;z-index:2;left:8.7%;top:51.2%;width:45%;margin:0;color:#f7f7f7d9;font-size:clamp(16px,1.45vw,21px);line-height:1.35;letter-spacing:.01em;text-shadow:0 2px 20px #0007}
.start-button{position:absolute;z-index:3;left:8.7%;top:60.5%;display:flex;width:clamp(230px,27vw,400px);height:clamp(62px,7.2vw,92px);align-items:center;justify-content:center;gap:24px;border-radius:999px;background:linear-gradient(100deg,#f32632,#ed1725);box-shadow:0 16px 38px #f01e2b27;color:white;text-decoration:none;font-size:clamp(17px,1.7vw,24px);letter-spacing:.01em;transition:transform .2s ease,filter .2s ease;cursor:pointer}
.start-button span{font-size:1.4em;font-weight:300;line-height:1}
.start-button:hover{transform:translateY(-2px);filter:brightness(1.08)}
.start-button:focus-visible{outline:2px solid white;outline-offset:5px}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:760px){
  .landing{background:radial-gradient(ellipse at 50% 48%,#252321 0%,#151413 55%,#0e0e0d 100%)}
  .desktop-brand{display:none}
  .poster{width:min(100vw,46.27svh);height:min(100svh,216.18vw);aspect-ratio:853/1844;container-type:inline-size}
  .hero-art img{object-fit:cover;object-position:center top}
  .mobile-brand{position:absolute;z-index:3;left:7.5%;top:2%;display:block;color:var(--white);text-decoration:none;font-size:4.2cqw;line-height:1;font-weight:750;letter-spacing:-.055em;text-shadow:0 1px 12px #0008}
  .mobile-brand span{color:var(--red)}
  .headline{left:7%;top:59%;width:86%;font-size:10.1cqw;line-height:1.02;letter-spacing:-.05em;text-align:center;text-shadow:none}
  .headline-support{left:10%;top:69.1%;width:80%;text-align:center;font-size:3.25cqw;line-height:1.25;letter-spacing:0;text-shadow:0 1px 10px #0008}
  .start-button{left:16.55%;top:73.63%;width:66.9%;height:5.9%;gap:16px;border-radius:999px;background:linear-gradient(100deg,#f32632,#ed1725);box-shadow:0 12px 30px #f01e2b22;color:#fff;font-size:4.2cqw}
  .start-button span{display:inline;font-size:1.35em}
  .start-button:hover{transform:none;filter:brightness(1.04)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
