/* Full card photographs, shared by the homepage lineup and viewer. */
.native-card{display:block;position:relative;aspect-ratio:491 / 686;overflow:hidden;background:#080d0f;border-radius:6px;box-shadow:0 14px 30px #0009}
.native-card img{width:100%;height:auto;display:block}
.card-lineup{position:relative;width:100%;max-width:590px;min-height:430px;isolation:isolate;justify-self:center}
.card-lineup:before{content:'';position:absolute;inset:8% -5%;z-index:-1;background:radial-gradient(ellipse at center,#5f90bb4d,transparent 66%)}
.card-lineup .native-card{position:absolute;width:37%;transition:transform .2s,box-shadow .2s;outline:1px solid #b7dbef70;outline-offset:1px}
.card-lineup .left-card{left:0;top:80px;transform:rotate(-12deg)}
.card-lineup .center-card{left:31.5%;top:25px;transform:rotate(1deg);z-index:3}
.card-lineup .right-card{right:0;top:105px;transform:rotate(12deg);z-index:2}
.card-lineup .native-card:hover,.card-lineup .native-card:focus-visible{transform:translateY(-12px) rotate(0);z-index:5;box-shadow:0 18px 35px #000b;outline:2px solid var(--gold)}
.lineup-caption{position:absolute;bottom:-12px;left:0;right:0;text-align:center;font:10px/1.6 Consolas,monospace;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.game-showcase{--accent:var(--blue);--edge:var(--line);padding:45px 0 55px;border-top:1px solid var(--edge)}
.media-heading{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:26px}
.media-heading h2{font-size:36px;line-height:1.12;letter-spacing:-1px;margin:12px 0 0;max-width:540px}
.media-heading p{font-size:14px;line-height:1.8;max-width:310px;margin:0;color:var(--muted)}
.media-label{font:10px Consolas,monospace;letter-spacing:2px;color:var(--accent);text-transform:uppercase}
.client-gallery{display:grid;grid-template-columns:1.45fr 1fr;gap:25px;align-items:start}
.client-gallery figure{margin:0;min-width:0}
.client-gallery .screen-link{display:block;border:1px solid var(--edge);padding:7px;background:#0b2334;transition:border-color .2s}
.client-gallery .screen-link:hover{border-color:var(--accent)}
.client-gallery img{display:block;width:100%;height:auto}
.client-gallery figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font:10px/1.6 Consolas,monospace;color:var(--muted);letter-spacing:.4px}
.client-gallery figcaption strong{color:var(--accent);font-weight:400}
.gallery-note{border-left:2px solid var(--accent);padding:3px 0 3px 18px;margin-top:27px}
.gallery-note h3{font-size:22px;margin:0 0 10px;line-height:1.2;letter-spacing:-.5px}
.gallery-note p{font-size:13px;color:var(--muted);line-height:1.8;margin:0}
@media(prefers-reduced-motion:reduce){.card-lineup .native-card{transition:none}}
@media(max-width:800px){.card-lineup{width:88%;max-width:460px;min-height:410px}.hero .card-lineup{margin-top:8px;margin-bottom:32px}.media-heading{display:block}.media-heading p{max-width:none;margin-top:18px}.media-heading h2{font-size:30px}.client-gallery{grid-template-columns:1fr;gap:32px}.game-showcase{padding-top:32px}.gallery-note{margin-top:20px}.lineup-caption{font-size:9px;letter-spacing:1px}}
@media(max-width:500px){.card-lineup{width:90%;min-height:315px}.card-lineup .left-card{top:60px}.card-lineup .center-card{top:15px}.card-lineup .right-card{top:78px}.lineup-caption{bottom:4px}.hero .card-lineup{margin-bottom:5px}.media-heading h2{font-size:28px}}

/* Shared card and screenshot photobox. The native dialog keeps focus inside. */
.viewing-photo{overflow:hidden}
.media-viewer{color:var(--text);background:#0c2233;border:1px solid #7697ad;border-radius:5px;padding:20px;max-width:95vw;max-height:94vh;overflow:auto;text-align:center;box-shadow:0 20px 80px #000b}
.media-viewer::backdrop{background:#020c16e8;backdrop-filter:blur(8px)}
.media-viewer h2{font-size:20px;line-height:1.3;margin:0 0 17px;letter-spacing:-.4px}
.card-viewer{width:min(540px,95vw)}
.card-viewer .native-card{cursor:zoom-out;width:min(440px,75vw,52vh);margin:0 auto 20px}
.photo-viewer{width:fit-content}
.full-photo{cursor:zoom-out;display:block;width:auto;height:auto;max-width:calc(95vw - 44px);max-height:calc(94vh - 150px);margin:0 auto 18px;object-fit:contain}
.close-viewer{font-size:12px;padding:8px 18px}
@media(max-width:600px){.media-viewer{padding:14px}.media-viewer h2{font-size:17px}.full-photo{max-width:calc(95vw - 32px)}}
