/* Art direction for the hero and the genuine in-game captures. */
.hero{grid-template-columns:1.05fr 1.15fr;gap:26px;padding-block:44px 64px}
.hero-art{width:100%;max-width:570px;min-width:0;border:0;border-radius:0;background:transparent;overflow:visible;box-shadow:none;position:relative}
.hero-render{position:relative;isolation:isolate}
.hero-render::before{content:"";position:absolute;inset:13% 6%;z-index:-1;background:radial-gradient(ellipse,#26719d32,transparent 68%);filter:blur(28px)}
.hero-render img{display:block;width:100%;height:auto;mask-image:linear-gradient(to bottom,transparent,#000 8%,#000 91%,transparent);border-radius:36px}
.hero-art figcaption{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px 10px;padding:8px 0 0;color:#b8d1e4;font-size:10px;letter-spacing:.13em}
.hero-art figcaption>span:last-child{color:#7c90a8;font-size:11px;letter-spacing:0}
.hero-art .art-mark{width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px #78deef66}
.gallery-section{background:radial-gradient(ellipse at 50% 15%,#173650 0%,#0b1a2c 60%);overflow:hidden}
.gallery-inner{padding-block:80px 58px}
.gallery-heading{align-items:center;margin-bottom:46px}
.gallery-heading>p{max-width:220px}
.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;max-width:1030px;margin:auto}
.shot-card{position:relative;padding:24px 24px 27px;border:1px solid #8db5d32b;border-radius:24px;background:linear-gradient(155deg,#162d43cc,#0a1728ed);box-shadow:0 20px 45px #020a132d;isolation:isolate}
.shot-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:10px;font-weight:700;letter-spacing:.14em;color:#a8c3d7}
.shot-tag{font-size:9px;letter-spacing:.1em;padding:5px 9px;border:1px solid #7ba5c22a;border-radius:20px;color:#7395ad;white-space:nowrap}
.shot-stage{position:relative;padding:35px 12px 32px;perspective:1400px}
.shot-stage::before{content:"";position:absolute;inset:20% -10% 0;z-index:-1;background:radial-gradient(ellipse at center,#ff574b20,transparent 65%)}
.match-shot .shot-stage::before{background:radial-gradient(ellipse at center,#26bfff29,transparent 65%)}
.screenshot-link{width:100%;max-width:285px;margin:auto;padding:8px;border-radius:22px;border:1px solid #698195;background:linear-gradient(145deg,#70818e,#213a4f 12%,#101b29 48%,#3c5366);overflow:visible;box-shadow:0 24px 30px -15px #000b,0 0 0 3px #07111e,0 0 0 4px #536d832e;transform:rotateY(5deg) rotateZ(-1deg);transition:transform .25s ease,box-shadow .25s ease}
.match-shot .screenshot-link{transform:rotateY(-5deg) rotateZ(1deg)}
.screen-window{display:block;overflow:hidden;border-radius:15px;background:#061324}
.screenshot-link img{width:100%;height:auto;display:block;margin:0}
.enlarge{display:flex;align-items:center;justify-content:center;right:-12px;bottom:30px;width:40px;height:40px;border-radius:50%;padding:0;background:#e2f4ff;color:#071224;border:1px solid white;box-shadow:0 5px 20px #0005;font-size:23px;line-height:1}
.gallery .shot-card figcaption{padding:8px 3px 0;text-align:center}
.shot-card figcaption h3{font-size:24px;letter-spacing:-.025em;line-height:1.2}
.shot-card figcaption p{font-size:14px;margin:10px 0 17px;color:#9eb2c6}
.gallery .shot-card figcaption .capture-label{display:inline-block;font-size:9px;font-weight:700;letter-spacing:.16em;color:#7799b0;margin:0}
.gallery-note{max-width:660px;margin:30px auto 0;font-size:12px;line-height:1.7;color:#8197ad}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.screenshot-link:hover{transform:translateY(-6px) rotateY(0deg) rotateZ(0deg);box-shadow:0 35px 36px -15px #000c,0 0 0 3px #07111e,0 0 0 4px #8db9d566}}
@media(max-width:950px){.hero{grid-template-columns:1fr 1fr;gap:15px}.shot-card{padding:20px 18px}.shot-heading{font-size:9px}.shot-tag{display:none}.gallery{gap:24px}.shot-stage{padding:30px 12px}.shot-card figcaption h3{font-size:21px}}
@media(max-width:650px){.hero{grid-template-columns:1fr;gap:16px;padding-block:42px 38px}.hero-art{max-width:450px}.hero-art figcaption{font-size:9px}.gallery-inner{padding-block:48px}.gallery-heading{margin-bottom:28px}.gallery-heading>p{max-width:none}.gallery{grid-template-columns:1fr;gap:25px;max-width:390px}.shot-card{padding:23px}.shot-stage{padding:29px 14px 30px}.screenshot-link{max-width:270px}.shot-tag{display:inline}.gallery .shot-card figcaption .capture-label{display:inline-block}.shot-card figcaption h3{font-size:24px}.gallery-note{padding-inline:8px}}
@media(prefers-reduced-motion:reduce){.screenshot-link,.match-shot .screenshot-link,.screenshot-link:hover{transform:none;transition:none}}

.release-badge{display:inline-flex;align-items:center;gap:9px;border:1px solid #78deef40;border-radius:30px;padding:7px 13px;background:#15334799;color:#bfeeff;font-size:12px;font-weight:700;letter-spacing:.03em;margin:0 0 23px}.release-badge>span{width:6px;height:6px;flex-shrink:0;border-radius:50%;background:var(--cyan)}.release-note{max-width:390px;line-height:1.65;color:#b5c4d6}@media(max-width:650px){.release-note{margin-inline:auto}.release-badge{font-size:11px;margin-bottom:21px}}
/* Full mobile captures and a first-party, user-started intro player. */
.mobile-captures{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1160px}
.mobile-captures .shot-card{padding:20px 16px 24px}
.mobile-captures .shot-heading{font-size:9px}
.mobile-captures .shot-tag{display:none}
.mobile-captures .shot-stage{padding:27px 10px 28px}
.mobile-captures .shot-card figcaption h3{font-size:21px}
.mobile-captures .shot-card figcaption p{font-size:13px}
.arcade-shot .shot-stage::before{background:radial-gradient(ellipse at center,#367df530,transparent 65%)}
.arcade-shot .screenshot-link{transform:rotateY(-4deg) rotateZ(1deg)}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:17px 24px}
.secondary-link{display:inline-block;font-size:14px;color:#bddae9;text-decoration:underline;text-underline-offset:5px}
.secondary-link:hover{color:white}
.trailer-section{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding-block:72px 80px;border-top:1px solid var(--line)}
.trailer-copy h2{font-size:clamp(44px,5vw,70px)}
.trailer-copy>p:not(.eyebrow){max-width:415px;color:var(--muted)}
.trailer-copy .trailer-status{font-size:14px;padding-left:16px;border-left:2px solid var(--cyan);margin-block:28px}
.trailer-player{margin:0;justify-self:center;width:min(100%,370px);min-width:0}
.trailer-player video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:#020914;border:1px solid #536d83;border-radius:18px;box-shadow:0 28px 65px #0007}
.trailer-player video:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}
.trailer-player figcaption{margin-top:15px;color:#879eb5;font-size:11px;text-align:center}
@media(max-width:950px){.mobile-captures{gap:16px}.mobile-captures .shot-card{padding:18px 10px}.mobile-captures .shot-card figcaption h3{font-size:18px}.trailer-section{gap:35px}.trailer-player{max-width:310px}}
@media(max-width:760px){.mobile-captures{grid-template-columns:1fr;max-width:390px;gap:25px}.mobile-captures .shot-card{padding:23px}.mobile-captures .shot-tag{display:inline}.mobile-captures .shot-card figcaption h3{font-size:24px}.mobile-captures .shot-card figcaption p{font-size:14px}}
@media(max-width:650px){.hero-actions{justify-content:center}.trailer-section{grid-template-columns:1fr;gap:30px;padding-block:48px}.trailer-copy h2{font-size:44px}.trailer-player{max-width:340px}.trailer-player video{max-height:80svh;width:100%}}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.arcade-shot .screenshot-link:hover{transform:translateY(-6px)}}
@media(prefers-reduced-motion:reduce){.arcade-shot .screenshot-link{transform:none}}
