/* ==========================================================================
   A777 — "CRIMSON" design system
   ink #0A0A0C · panel #15151A · crimson #E11D48 · champagne #F5C36B
   ivory #F6F1E7 · muted #9A9AA6
   Type: Anton (display) / Sora (ui) / Inter (body)
   Class prefix: a*   (nothing shared with any earlier build)
   ========================================================================== */
:root{
  --ink:#0A0A0C; --ink2:#101014; --pan:#15151A; --pan2:#1D1D24; --line:rgba(246,241,231,.10);
  --line2:rgba(225,29,72,.45);
  --cr:#E11D48; --cr2:#FB5C7D; --cr-d:#9F0F32;
  --ch:#F5C36B; --ch2:#FFE0A6; --ch-d:#B8873A;
  --tx:#F6F1E7; --mu:#9A9AA6; --dim:#6A6A76;
  --gCR:linear-gradient(120deg,#FB5C7D 0%,#E11D48 55%,#9F0F32 100%);
  --gCH:linear-gradient(120deg,#FFE0A6 0%,#F5C36B 55%,#B8873A 100%);
  --gTX:linear-gradient(100deg,#FFE0A6 0%,#F5C36B 40%,#FB5C7D 80%,#E11D48 100%);
  --glCR:0 0 42px rgba(225,29,72,.42); --glCH:0 0 42px rgba(245,195,107,.35);
  --sh1:0 12px 32px rgba(0,0,0,.55); --sh2:0 28px 66px rgba(0,0,0,.65); --sh3:0 44px 96px rgba(0,0,0,.72);
  --d:'Anton',Impact,sans-serif; --u:'Sora',system-ui,sans-serif; --b:'Inter',system-ui,sans-serif;
  --r1:10px; --r2:18px; --r3:26px; --r4:36px; --rp:999px;
  --e:cubic-bezier(.2,.8,.24,1); --f:.2s var(--e); --n:.5s var(--e);
  --nav:72px; --max:1260px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--tx);font-family:var(--b);font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{margin:0;line-height:1.05}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--ch);outline-offset:3px}
::selection{background:rgba(225,29,72,.35)}

/* ---------------- ambient ---------------- */
.aFx{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aFx b{position:absolute;display:block;border-radius:50%;filter:blur(100px);opacity:.5;
  will-change:transform;transition:transform 1.1s var(--e)}
.aFx b.x1{width:46vw;height:46vw;background:rgba(225,29,72,.38);top:-14vw;right:-10vw}
.aFx b.x2{width:38vw;height:38vw;background:rgba(245,195,107,.20);top:46vh;left:-12vw}
.aFx b.x3{width:30vw;height:30vw;background:rgba(159,15,50,.35);bottom:-10vw;right:18vw}
.aGrain{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.45;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .95 0 0 0 0 .9 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
header,main,footer{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.aFx b{transition:none}}

/* ---------------- layout ---------------- */
.aW{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:22px}
.aWide{width:100%;max-width:1520px;margin-inline:auto;padding-inline:22px}
.aS{position:relative;padding-block:clamp(70px,9.5vw,132px)}
.aS--sm{padding-block:clamp(44px,6vw,78px)}
/* diagonal split band */
.aSplit{position:relative;overflow:hidden}
.aSplit::before{content:"";position:absolute;inset:-6% -10%;z-index:-1;transform:skewY(-3deg);
  background:linear-gradient(120deg,rgba(225,29,72,.10),rgba(21,21,26,.85) 45%,rgba(245,195,107,.08))}
.aRule{height:1px;background:linear-gradient(90deg,transparent,var(--line2),rgba(245,195,107,.5),transparent)}
.aDots{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(246,241,231,.14) 1px,transparent 1px);background-size:26px 26px;
  -webkit-mask:radial-gradient(70% 55% at 50% 40%,#000 20%,transparent 78%);
          mask:radial-gradient(70% 55% at 50% 40%,#000 20%,transparent 78%)}

/* ---------------- type ---------------- */
.aKick{display:inline-flex;align-items:center;gap:10px;font-family:var(--u);font-weight:700;font-size:.7rem;
  letter-spacing:.3em;text-transform:uppercase;color:var(--ch);margin-bottom:18px}
.aKick::before{content:"";width:28px;height:2px;background:var(--gCH)}
.aT1{font-family:var(--d);font-weight:400;font-size:clamp(3.4rem,10vw,8rem);line-height:.88;letter-spacing:.005em;
  text-transform:uppercase}
.aT2{font-family:var(--d);font-weight:400;font-size:clamp(2.3rem,5.6vw,4.2rem);line-height:.95;text-transform:uppercase}
.aT3{font-family:var(--u);font-weight:700;font-size:clamp(1.15rem,2.2vw,1.55rem)}
.aGrad{background:var(--gTX);-webkit-background-clip:text;background-clip:text;color:transparent}
.aOut{color:transparent;-webkit-text-stroke:1.6px rgba(246,241,231,.4)}
.aLead{color:var(--mu);font-size:1.05rem;max-width:58ch;line-height:1.85}
.aCen{text-align:center}.aCen .aLead{margin-inline:auto}.aCen .aKick::before{display:none}
.aMu{color:var(--mu)}

/* ---------------- reveal ---------------- */
.aR{opacity:0;transform:translateY(26px);transition:opacity .8s var(--e),transform .8s var(--e)}
.aR.on{opacity:1;transform:none}
.aR[data-d="1"]{transition-delay:.09s}.aR[data-d="2"]{transition-delay:.18s}
.aR[data-d="3"]{transition-delay:.27s}.aR[data-d="4"]{transition-delay:.36s}
@media(prefers-reduced-motion:reduce){.aR{opacity:1;transform:none;transition:none}}

/* ---------------- buttons ---------------- */
.aB{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:11px;
  font-family:var(--u);font-weight:700;font-size:.94rem;letter-spacing:.04em;padding:16px 32px;
  border-radius:var(--rp);overflow:hidden;isolation:isolate;white-space:nowrap;
  transition:transform var(--f),box-shadow var(--f),filter var(--f)}
.aB svg{width:18px;height:18px}
.aB--cr{color:#fff;background:var(--gCR);box-shadow:0 14px 34px rgba(225,29,72,.35)}
.aB--cr::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(112deg,transparent 32%,rgba(255,255,255,.45) 50%,transparent 68%);
  transform:translateX(-140%);transition:transform .85s var(--e)}
.aB--cr:hover{transform:translateY(-2px);box-shadow:0 18px 44px rgba(225,29,72,.5),var(--glCR)}
.aB--cr:hover::after{transform:translateX(140%)}
.aB--ch{color:#241703;background:var(--gCH);box-shadow:0 14px 34px rgba(245,195,107,.3)}
.aB--ch:hover{transform:translateY(-2px);box-shadow:0 18px 44px rgba(245,195,107,.45)}
.aB--gh{color:var(--tx);box-shadow:inset 0 0 0 1.5px var(--line)}
.aB--gh:hover{color:var(--ch2);box-shadow:inset 0 0 0 1.5px var(--ch);transform:translateY(-2px)}
.aB--lg{padding:19px 40px;font-size:1.02rem}
.aB--sm{padding:11px 20px;font-size:.84rem}
.aB--block{width:100%}
@media(prefers-reduced-motion:reduce){.aB--cr::after{display:none}}

/* ---------------- wordmark logo (no image needed) ---------------- */
.aLogo{display:inline-flex;align-items:center;gap:9px;font-family:var(--d);font-size:1.6rem;letter-spacing:.06em;
  text-transform:uppercase;line-height:1}
.aLogo .m{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-size:1rem;
  color:#fff;background:var(--gCR);box-shadow:var(--glCR)}
.aLogo .t{background:var(--gTX);-webkit-background-clip:text;background-clip:text;color:transparent}
.aLogo--lg{font-size:2.1rem}
.aLogo--lg .m{width:44px;height:44px;border-radius:14px;font-size:1.25rem}

/* ---------------- nav ---------------- */
.aNav{position:sticky;top:0;z-index:90;backdrop-filter:blur(16px);
  background:linear-gradient(180deg,rgba(10,10,12,.94),rgba(10,10,12,.62));
  border-bottom:1px solid var(--line)}
.aNav-in{display:flex;align-items:center;gap:16px;height:var(--nav)}
.aMenu{display:none;align-items:center;gap:2px;margin-inline:auto}
.aMenu a{position:relative;padding:10px 15px;font-family:var(--u);font-weight:600;font-size:.86rem;color:var(--mu);
  transition:color var(--f)}
.aMenu a::after{content:"";position:absolute;left:15px;right:15px;bottom:5px;height:2px;border-radius:2px;
  background:var(--gCR);transform:scaleX(0);transform-origin:left;transition:transform var(--n)}
.aMenu a:hover{color:var(--tx)}.aMenu a:hover::after{transform:scaleX(1)}
.aMenu a[aria-current=page]{color:var(--ch2)}
.aMenu a[aria-current=page]::after{transform:scaleX(1);background:var(--gCH)}
.aNav .aB{margin-left:auto}
.aBurg{margin-left:auto;width:44px;height:44px;border-radius:13px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:4px;box-shadow:inset 0 0 0 1.5px var(--line)}
.aBurg i{display:block;width:18px;height:2px;border-radius:2px;background:var(--ch);transition:var(--f)}
.aBurg[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.aBurg[aria-expanded="true"] i:nth-child(2){opacity:0}
.aBurg[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.aSheet{position:fixed;inset:0;z-index:89;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;background:rgba(10,10,12,.97);backdrop-filter:blur(20px);opacity:0;pointer-events:none;
  transition:opacity .34s var(--e)}
.aSheet.on{opacity:1;pointer-events:auto}
.aSheet a{font-family:var(--d);font-size:1.9rem;text-transform:uppercase;color:var(--mu);padding:10px 22px}
.aSheet a:hover{color:var(--ch2)}
.aSheet .aB{margin-top:20px}
@media(min-width:980px){.aMenu{display:flex}.aBurg{display:none}.aNav .aB{margin-left:0}}

/* ---------------- hero ---------------- */
.aHero{position:relative;padding-block:clamp(44px,6vw,84px) clamp(62px,8vw,110px);overflow:clip}
.aHero-g{display:grid;gap:clamp(40px,6vw,68px);align-items:center}
@media(min-width:1020px){.aHero-g{grid-template-columns:1.06fr .94fr}}
.aTag{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:var(--rp);
  font-family:var(--u);font-weight:600;font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mu);
  box-shadow:inset 0 0 0 1.5px var(--line);margin-bottom:22px}
.aTag b{color:var(--ch)}
.aTag .dot{width:7px;height:7px;border-radius:50%;background:var(--cr);box-shadow:0 0 10px var(--cr);
  animation:aPulse 1.7s infinite}
@keyframes aPulse{50%{opacity:.3;transform:scale(.7)}}
.aHero h1 .sub{display:block;font-family:var(--u);font-weight:600;font-size:clamp(1rem,2vw,1.4rem);
  letter-spacing:.02em;text-transform:none;color:var(--mu);margin-top:18px;line-height:1.5}
.aHero .aLead{margin-top:20px;max-width:52ch}
.aHero .aLead strong{color:var(--tx)}
.aCTA{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.aFacts{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.aFact{position:relative;padding:14px 20px;border-radius:var(--r2);background:rgba(21,21,26,.75);
  box-shadow:inset 0 0 0 1.5px var(--line)}
.aFact b{display:block;font-family:var(--d);font-size:1.6rem;line-height:1;letter-spacing:.02em;
  background:var(--gTX);-webkit-background-clip:text;background-clip:text;color:transparent}
.aFact span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.aFact .st{color:var(--ch);letter-spacing:2px;font-size:1rem}
/* hero device */
.aStage{position:relative;display:grid;place-items:center;min-height:min(560px,88vw)}
.aArc{position:absolute;width:min(88%,440px);aspect-ratio:1;border-radius:50%;
  border:1.5px solid rgba(225,29,72,.28);animation:aSpin 26s linear infinite}
.aArc.b{width:min(66%,340px);border-color:rgba(245,195,107,.25);border-style:dashed;
  animation:aSpin 40s linear infinite reverse}
@keyframes aSpin{to{transform:rotate(360deg)}}
.aHalo{position:absolute;width:min(64%,330px);aspect-ratio:1;border-radius:50%;filter:blur(52px);
  background:radial-gradient(circle,rgba(225,29,72,.55),rgba(245,195,107,.18) 55%,transparent 72%);
  animation:aBreath 7.5s ease-in-out infinite}
@keyframes aBreath{50%{transform:scale(1.12)}}
.aDev{position:relative;z-index:4;width:min(57%,256px);aspect-ratio:9/18.4;padding:8px;border-radius:36px;
  background:linear-gradient(165deg,#2A1F24,#0C0C10);
  box-shadow:inset 0 0 0 1.5px rgba(245,195,107,.42),0 0 54px rgba(225,29,72,.3),var(--sh3);
  transition:transform .45s var(--e);transform-style:preserve-3d}
.aDev img{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);object-fit:cover;
  object-position:top;border-radius:28px;opacity:0;transition:opacity .9s var(--e)}
.aDev img.on{opacity:1}
.aDev-pips{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:6px;z-index:5}
.aDev-pips i{width:5px;height:5px;border-radius:50%;background:rgba(246,241,231,.3);transition:var(--f)}
.aDev-pips i.on{width:18px;border-radius:3px;background:var(--gCH)}
.aChip{position:absolute;z-index:6;display:flex;align-items:center;gap:11px;padding:12px 16px;border-radius:var(--r2);
  background:rgba(21,21,26,.9);backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1.5px var(--line),var(--sh1);
  font-family:var(--u);font-weight:600;font-size:.82rem;white-space:nowrap;animation:aFloat 7s ease-in-out infinite}
.aChip small{display:block;font-family:var(--b);font-weight:400;font-size:.72rem;color:var(--mu)}
.aChip .ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:.9rem}
.aChip.c1{top:3%;right:-2%}
.aChip.c1 .ic{background:rgba(225,29,72,.18);color:var(--cr2);box-shadow:inset 0 0 0 1px rgba(225,29,72,.45)}
.aChip.c2{bottom:3%;left:-2%;animation-delay:2.3s}
.aChip.c2 .ic{background:rgba(245,195,107,.16);color:var(--ch);box-shadow:inset 0 0 0 1px rgba(245,195,107,.4)}
@keyframes aFloat{50%{transform:translateY(-13px)}}
@media(max-width:620px){.aStage{min-height:430px}.aChip{font-size:.74rem;padding:10px 13px}
  .aChip.c1{right:0}.aChip.c2{left:0}}
@media(prefers-reduced-motion:reduce){.aArc,.aHalo,.aChip,.aTag .dot{animation:none}.aDev img{transition:none}}

/* ---------------- marquee strip ---------------- */
.aStrip{overflow:hidden;border-block:1px solid var(--line);padding-block:16px;
  -webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
          mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.aStrip-t{display:flex;gap:38px;width:max-content;animation:aMq 32s linear infinite;align-items:center}
.aStrip:hover .aStrip-t{animation-play-state:paused}
@keyframes aMq{to{transform:translateX(-50%)}}
.aStrip-i{display:inline-flex;align-items:center;gap:10px;font-family:var(--u);font-weight:600;font-size:.84rem;
  letter-spacing:.06em;color:var(--mu);white-space:nowrap}
.aStrip-i b{color:var(--ch2)}
.aStrip-i::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cr)}
@media(prefers-reduced-motion:reduce){.aStrip-t{animation:none;flex-wrap:wrap;width:auto}}

/* ---------------- stat ledger ---------------- */
.aLedger{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;
  border:1px solid var(--line);border-radius:var(--r3);overflow:hidden;background:rgba(21,21,26,.55)}
@media(min-width:800px){.aLedger{grid-template-columns:repeat(4,minmax(0,1fr))}}
.aLed{padding:clamp(24px,3.2vw,40px) clamp(16px,2.2vw,28px);text-align:center;position:relative;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background var(--n)}
.aLed:hover{background:linear-gradient(180deg,rgba(225,29,72,.10),transparent)}
.aLed b{display:block;font-family:var(--d);font-size:clamp(2rem,4vw,3rem);line-height:1;
  background:var(--gTX);-webkit-background-clip:text;background-clip:text;color:transparent}
.aLed span{display:block;margin-top:10px;font-family:var(--u);font-size:.68rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--dim)}

/* ---------------- feature stack ---------------- */
.aStack{display:grid;gap:16px;margin-top:clamp(38px,5vw,60px)}
@media(min-width:760px){.aStack{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.aStack{grid-template-columns:repeat(3,1fr)}}
.aCard{position:relative;padding:30px 26px 28px;border-radius:var(--r3);overflow:hidden;
  background:linear-gradient(165deg,rgba(29,29,36,.9),rgba(16,16,20,.85));
  box-shadow:inset 0 0 0 1.5px var(--line);transition:transform var(--n),box-shadow var(--n)}
.aCard::after{content:"";position:absolute;right:-24%;top:-38%;width:64%;height:120%;opacity:0;
  background:radial-gradient(circle,rgba(225,29,72,.3),transparent 62%);transition:opacity var(--n)}
.aCard:hover{transform:translateY(-7px);box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh2)}
.aCard:hover::after{opacity:1}
.aCard .no{position:absolute;right:22px;top:16px;font-family:var(--d);font-size:2.6rem;line-height:1;
  color:rgba(246,241,231,.07)}
.aIco{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;margin-bottom:18px;
  background:linear-gradient(150deg,rgba(225,29,72,.28),rgba(245,195,107,.16));
  box-shadow:inset 0 0 0 1.5px rgba(225,29,72,.35);transition:transform var(--n)}
.aIco svg{width:25px;height:25px;color:#FFD4DE}
.aCard:nth-child(3n+2) .aIco{background:linear-gradient(150deg,rgba(245,195,107,.28),rgba(225,29,72,.14));
  box-shadow:inset 0 0 0 1.5px rgba(245,195,107,.35)}
.aCard:nth-child(3n+2) .aIco svg{color:#FFE9C4}
.aCard:hover .aIco{transform:translateY(-4px) rotate(-4deg)}
.aCard h3{font-family:var(--u);font-weight:700;font-size:1.16rem;margin-bottom:10px}
.aCard p{color:var(--mu);font-size:.96rem}

/* ---------------- games rail ---------------- */
.aFilter{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:28px;scrollbar-width:none}
.aFilter::-webkit-scrollbar{display:none}
.aF{flex:0 0 auto;padding:11px 22px;border-radius:var(--rp);font-family:var(--u);font-weight:600;font-size:.8rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--mu);box-shadow:inset 0 0 0 1.5px var(--line);
  white-space:nowrap;transition:var(--f)}
.aF:hover{color:var(--tx);box-shadow:inset 0 0 0 1.5px var(--line2)}
.aF.on{color:#fff;background:var(--gCR);box-shadow:0 8px 22px rgba(225,29,72,.32)}
.aGames{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(min-width:640px){.aGames{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1080px){.aGames{grid-template-columns:repeat(6,minmax(0,1fr))}}
.aGame{position:relative;border-radius:var(--r2);overflow:hidden;background:var(--pan);
  box-shadow:inset 0 0 0 1.5px var(--line);transition:transform var(--n),box-shadow var(--n)}
.aGame img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .65s var(--e)}
.aGame figcaption{padding:11px 10px 13px;font-family:var(--u);font-weight:600;font-size:.78rem;text-align:center;
  color:var(--mu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aGame .go{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transition:opacity var(--n);
  background:rgba(10,10,12,.55)}
.aGame .go i{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-style:normal;color:#fff;
  background:var(--gCR);box-shadow:var(--glCR)}
.aGame:hover{transform:translateY(-7px);box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh2)}
.aGame:hover img{transform:scale(1.08)}
.aGame:hover figcaption{color:var(--ch2)}
.aGame:hover .go{opacity:1}
.aGame.off{display:none}
@media(hover:none){.aGame .go{opacity:0}}

/* ---------------- screenshot strip (horizontal scroll) ---------------- */
.aShots{display:flex;gap:18px;overflow-x:auto;padding:6px 2px 20px;scroll-snap-type:x mandatory;
  scrollbar-width:thin;scrollbar-color:var(--cr) transparent}
.aShots::-webkit-scrollbar{height:6px}
.aShots::-webkit-scrollbar-thumb{background:var(--gCR);border-radius:99px}
.aShot{flex:0 0 auto;width:min(210px,54vw);aspect-ratio:9/18;padding:7px;border-radius:28px;scroll-snap-align:center;
  background:linear-gradient(165deg,#2A1F24,#0C0C10);
  box-shadow:inset 0 0 0 1.5px rgba(246,241,231,.16),var(--sh1);
  transition:transform var(--n),box-shadow var(--n)}
.aShot img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:22px}
.aShot:hover{transform:translateY(-9px) scale(1.02);
  box-shadow:inset 0 0 0 1.5px rgba(245,195,107,.55),0 0 42px rgba(225,29,72,.28),var(--sh2)}
.aShots-hint{text-align:center;font-family:var(--u);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--dim);margin-top:4px}

/* ---------------- steps ---------------- */
.aSteps{display:grid;gap:0;max-width:900px;margin-inline:auto;border-top:1px solid var(--line)}
.aStep{display:grid;grid-template-columns:auto 1fr;gap:22px;padding:26px 8px;border-bottom:1px solid var(--line);
  transition:background var(--n)}
.aStep:hover{background:linear-gradient(90deg,rgba(225,29,72,.08),transparent 70%)}
.aStep .n{font-family:var(--d);font-size:1.9rem;line-height:1;color:rgba(245,195,107,.55);min-width:52px}
.aStep h3{font-family:var(--u);font-weight:700;font-size:1.08rem;margin-bottom:6px}
.aStep p{color:var(--mu);font-size:.95rem}

/* ---------------- download panel ---------------- */
.aGet{position:relative;border-radius:var(--r4);overflow:hidden;padding:clamp(26px,4vw,50px);
  background:linear-gradient(155deg,rgba(225,29,72,.16),rgba(16,16,20,.94) 48%,rgba(245,195,107,.12));
  box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh3)}
.aGet-top{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:24px}
.aGet-top h2{font-family:var(--d);font-size:clamp(2rem,4vw,3rem);text-transform:uppercase}
.aGet-top .by{color:var(--mu);font-size:.9rem}
.aSpecs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-bottom:24px;
  border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media(min-width:760px){.aSpecs{grid-template-columns:repeat(4,minmax(0,1fr))}}
.aSpec{padding:16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.aSpec span{display:block;font-family:var(--u);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.aSpec b{display:block;margin-top:6px;font-family:var(--u);font-weight:700;font-size:.98rem}
.aSeal{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:24px}
.aSeal span{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:var(--rp);
  font-family:var(--u);font-size:.76rem;color:var(--ch2);box-shadow:inset 0 0 0 1.5px rgba(245,195,107,.35)}
.aSeal svg{width:14px;height:14px}
.aMeter{margin-bottom:24px}
.aMeter-t{height:8px;border-radius:var(--rp);background:rgba(246,241,231,.1);overflow:hidden}
.aMeter-f{display:block;height:100%;width:0;border-radius:inherit;background:var(--gCR);
  box-shadow:0 0 16px rgba(225,29,72,.6);transition:width 1.7s var(--e)}
.aMeter-m{display:flex;justify-content:space-between;margin-top:9px;font-family:var(--u);font-size:.76rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--mu)}
.aMeter-m b{color:var(--ch)}
.aPlat{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:var(--r2);margin-top:12px;
  background:rgba(21,21,26,.7);box-shadow:inset 0 0 0 1.5px var(--line);transition:var(--n)}
.aPlat .ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:var(--cr2);
  background:rgba(225,29,72,.14);box-shadow:inset 0 0 0 1px rgba(225,29,72,.35)}
.aPlat .ic svg{width:21px;height:21px}
.aPlat b{display:block;font-family:var(--u);font-weight:700;font-size:.98rem}
.aPlat span{color:var(--mu);font-size:.84rem}
.aPlat .st{margin-left:auto;padding:6px 13px;border-radius:var(--rp);font-family:var(--u);font-size:.68rem;
  font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--gCR)}
.aPlat.soon{opacity:.62}
.aPlat.soon .ic{background:rgba(246,241,231,.06);color:var(--dim);box-shadow:inset 0 0 0 1px var(--line)}
.aPlat.soon .st{color:var(--dim);background:none;box-shadow:inset 0 0 0 1.5px var(--line)}
.aPlat.live:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh1)}

/* ---------------- reviews ---------------- */
.aScore{display:grid;gap:18px;margin-bottom:22px}
@media(min-width:900px){.aScore{grid-template-columns:.8fr 1.2fr}}
.aScore-c{text-align:center;padding:clamp(26px,4vw,40px);border-radius:var(--r3);
  background:linear-gradient(160deg,rgba(225,29,72,.18),rgba(16,16,20,.9));
  box-shadow:inset 0 0 0 1.5px var(--line2)}
.aScore-c b{display:block;font-family:var(--d);font-size:clamp(3.6rem,8vw,5.4rem);line-height:1;
  background:var(--gTX);-webkit-background-clip:text;background-clip:text;color:transparent}
.aScore-c .stars{color:var(--ch);font-size:1.3rem;letter-spacing:5px;margin:8px 0 6px}
.aScore-c .sub{color:var(--mu);font-size:.9rem}
.aBars{display:grid;gap:13px;align-content:center;padding:clamp(22px,3.4vw,34px);border-radius:var(--r3);
  background:rgba(21,21,26,.6);box-shadow:inset 0 0 0 1.5px var(--line)}
.aBar{display:flex;align-items:center;gap:14px;font-size:.88rem;color:var(--mu)}
.aBar .lb{width:32px;font-family:var(--u);font-weight:700;color:var(--tx)}
.aBar .tr{flex:1;height:9px;border-radius:var(--rp);background:rgba(246,241,231,.09);overflow:hidden}
.aBar .fl{display:block;height:100%;width:0;border-radius:inherit;background:var(--gCH);
  box-shadow:0 0 12px rgba(245,195,107,.5);transition:width 1.2s var(--e)}
.aBar .pc{width:40px;text-align:right;font-variant-numeric:tabular-nums}
.aQuotes{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:720px){.aQuotes{grid-template-columns:1fr 1fr}}
@media(min-width:1080px){.aQuotes{grid-template-columns:repeat(3,1fr)}}
.aQ{position:relative;padding:28px 24px 24px;border-radius:var(--r3);
  background:linear-gradient(165deg,rgba(29,29,36,.9),rgba(16,16,20,.86));
  box-shadow:inset 0 0 0 1.5px var(--line);transition:transform var(--n),box-shadow var(--n)}
.aQ::before{content:"\201C";position:absolute;top:6px;right:20px;font-family:var(--d);font-size:3.4rem;line-height:1;
  color:rgba(225,29,72,.28)}
.aQ:hover{transform:translateY(-6px);box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh2)}
.aQ p{color:var(--mu);font-size:.96rem;margin-bottom:18px}
.aQ-w{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--line)}
.aAv{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-family:var(--d);font-size:1.1rem;
  color:#fff;background:var(--gCR);flex:0 0 auto}
.aQ-w b{font-family:var(--u);font-weight:700;font-size:.95rem;display:block}
.aVf{display:inline-flex;align-items:center;gap:6px;font-family:var(--u);font-size:.66rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ch2);padding:4px 10px;border-radius:var(--rp);
  box-shadow:inset 0 0 0 1px rgba(245,195,107,.32);white-space:nowrap}
.aVf svg{width:11px;height:11px}
.aQ .stars{margin-left:auto;color:var(--ch);letter-spacing:2px;font-size:.84rem}
@media(max-width:430px){.aQ .stars{margin-left:0;width:100%}}

/* ---------------- faq ---------------- */
.aFaq{max-width:880px;margin:clamp(34px,5vw,54px) auto 0;border-top:1px solid var(--line)}
.aQa{border-bottom:1px solid var(--line);transition:border-color var(--f)}
.aQa[open],.aQa:hover{border-color:var(--line2)}
.aQa summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;padding:22px 6px;
  font-family:var(--u);font-weight:700;font-size:1rem;transition:color var(--f)}
.aQa summary::-webkit-details-marker{display:none}
.aQa summary:hover{color:var(--ch2)}
.aQa summary::after{content:"";margin-left:auto;flex:0 0 auto;width:24px;height:24px;
  background:linear-gradient(var(--cr),var(--cr)),linear-gradient(var(--cr),var(--cr));
  background-size:14px 2px,2px 14px;background-position:center,center;background-repeat:no-repeat;
  transition:transform .35s var(--e)}
.aQa[open] summary::after{transform:rotate(135deg)}
.aQa .ans{padding:0 6px 22px;color:var(--mu);max-width:72ch}

/* ---------------- cta + footer ---------------- */
.aBand{position:relative;overflow:hidden;text-align:center;border-radius:var(--r4);
  padding:clamp(44px,7vw,88px) clamp(20px,5vw,58px);
  background:linear-gradient(150deg,rgba(225,29,72,.24),rgba(16,16,20,.92) 48%,rgba(245,195,107,.16));
  box-shadow:inset 0 0 0 1.5px var(--line2)}
.aBand::before{content:"";position:absolute;inset:-38%;z-index:0;filter:blur(78px);opacity:.75;
  background:radial-gradient(28% 34% at 28% 42%,rgba(225,29,72,.5),transparent 60%),
             radial-gradient(26% 32% at 74% 58%,rgba(245,195,107,.35),transparent 60%)}
.aBand>*{position:relative;z-index:1}
.aBand p{color:var(--mu);max-width:52ch;margin:16px auto 30px}
.aBand .aCTA{justify-content:center}
.aNote{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;padding:14px;font-size:.8rem;color:var(--dim)}
.aNote b{color:var(--ch)}

.aFoot{position:relative;margin-top:clamp(56px,8vw,100px);padding:clamp(46px,6vw,80px) 0 28px;
  background:linear-gradient(180deg,rgba(21,21,26,.65),rgba(10,10,12,.98));border-top:1px solid var(--line)}
.aFoot-g{display:grid;gap:32px;grid-template-columns:1fr}
@media(min-width:840px){.aFoot-g{grid-template-columns:1.6fr 1fr 1fr 1.2fr}}
.aFoot-b p{color:var(--mu);font-size:.93rem;max-width:34ch;margin:16px 0 18px}
.aSoc{display:flex;gap:10px}
.aSoc a{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:var(--mu);
  box-shadow:inset 0 0 0 1.5px var(--line);transition:var(--f)}
.aSoc a:hover{color:#fff;background:var(--gCR);box-shadow:var(--glCR)}
.aSoc svg{width:18px;height:18px}
.aFoot h4{font-family:var(--u);font-weight:700;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--dim);margin-bottom:16px}
.aFoot a.l{display:block;color:var(--mu);padding:7px 0;font-size:.94rem;transition:var(--f)}
.aFoot a.l:hover{color:var(--ch2);transform:translateX(4px)}
.aFoot-b2{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;margin-top:40px;
  padding-top:20px;border-top:1px solid var(--line);color:var(--dim);font-size:.84rem}
.aFoot-b2 .pol{display:flex;gap:18px;flex-wrap:wrap}
.aFoot-b2 .pol a:hover{color:var(--ch2)}

/* ---------------- gate / cookie ---------------- */
.aGate{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;
  background:rgba(10,10,12,.9);backdrop-filter:blur(14px)}
.aGate[hidden]{display:none}
.aGate-c{max-width:440px;width:100%;text-align:center;padding:36px 30px;border-radius:var(--r3);
  background:linear-gradient(160deg,rgba(225,29,72,.16),rgba(16,16,20,.96));
  box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh3)}
.aGate-c .seal{width:66px;height:66px;margin:0 auto 18px;border-radius:20px;display:grid;place-items:center;
  font-family:var(--d);font-size:1.3rem;color:#fff;background:var(--gCR);box-shadow:var(--glCR)}
.aGate-c h2{font-family:var(--d);font-size:1.8rem;text-transform:uppercase;margin-bottom:10px}
.aGate-c p{color:var(--mu);font-size:.93rem;margin-bottom:24px}
.aGate-c .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.aCookie{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:150;
  width:min(660px,calc(100% - 24px));display:flex;align-items:center;gap:15px;flex-wrap:wrap;padding:15px 19px;
  border-radius:var(--r2);background:rgba(21,21,26,.95);backdrop-filter:blur(12px);
  box-shadow:inset 0 0 0 1.5px var(--line),var(--sh1);font-size:.88rem;color:var(--mu)}
.aCookie[hidden]{display:none}
.aCookie .aB{margin-left:auto}

/* ---------------- prose ---------------- */
.aProse{max-width:800px;margin-inline:auto;color:#D6D2CA;font-size:1.02rem;line-height:1.9}
.aProse h1{font-family:var(--d);font-size:clamp(2.2rem,5vw,3.4rem);text-transform:uppercase;margin-bottom:20px;color:var(--tx)}
.aProse h2{font-family:var(--u);font-weight:700;font-size:1.35rem;margin:32px 0 12px;color:var(--tx)}
.aProse h3{font-family:var(--u);font-weight:700;font-size:1.12rem;margin:22px 0 10px;color:var(--tx)}
.aProse p{margin-bottom:16px}
.aProse ul,.aProse ol{margin:0 0 16px 22px;list-style:disc}
.aProse li{margin-bottom:8px}
.aProse a{color:var(--ch2);text-decoration:underline}
.aProse strong{color:var(--tx)}

/* ---------------- contact ---------------- */
.aTwo{display:grid;gap:20px}
@media(min-width:940px){.aTwo{grid-template-columns:.9fr 1.1fr}}
.aWays{display:grid;gap:12px;align-content:start}
.aWay{display:flex;align-items:center;gap:15px;padding:18px 20px;border-radius:var(--r2);
  background:rgba(21,21,26,.7);box-shadow:inset 0 0 0 1.5px var(--line);transition:var(--n)}
.aWay:hover{transform:translateX(6px);box-shadow:inset 0 0 0 1.5px var(--line2)}
.aWay .ic{flex:0 0 auto;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:var(--cr2);
  background:rgba(225,29,72,.14);box-shadow:inset 0 0 0 1px rgba(225,29,72,.32)}
.aWay .ic svg{width:21px;height:21px}
.aWay b{display:block;font-family:var(--u);font-weight:700;font-size:.96rem}
.aWay span{color:var(--mu);font-size:.86rem}
.aWay .go{margin-left:auto;color:var(--ch)}
.aForm{padding:clamp(24px,3.4vw,40px);border-radius:var(--r3);background:rgba(21,21,26,.72);
  box-shadow:inset 0 0 0 1.5px var(--line)}
.aForm h2{font-family:var(--d);font-size:1.8rem;text-transform:uppercase;margin-bottom:8px}
.aForm>p{color:var(--mu);font-size:.92rem;margin-bottom:22px}
.aFld{display:grid;gap:8px;margin-bottom:18px}
.aFld label{font-family:var(--u);font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mu)}
.aFld input,.aFld textarea{background:rgba(10,10,12,.7);border:0;border-radius:14px;padding:14px 16px;
  font-family:inherit;font-size:1rem;color:var(--tx);box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow var(--f)}
.aFld input:focus,.aFld textarea:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--cr)}
.aFld textarea{min-height:130px;resize:vertical}
.aMsg{margin-top:12px;font-size:.9rem;color:var(--ch2)}

/* ---------------- RG ---------------- */
.aVow{max-width:880px;margin:clamp(28px,4vw,46px) auto;text-align:center;padding:clamp(28px,4.4vw,46px);
  border-radius:var(--r3);background:linear-gradient(155deg,rgba(245,195,107,.12),rgba(16,16,20,.92));
  box-shadow:inset 0 0 0 1.5px rgba(245,195,107,.32)}
.aVow p{font-family:var(--d);font-size:clamp(1.4rem,3vw,2.2rem);text-transform:uppercase;line-height:1.2}
.aVow .by{margin-top:14px;font-family:var(--u);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ch)}
.aHabits{display:grid;gap:14px;max-width:940px;margin-inline:auto}
@media(min-width:820px){.aHabits{grid-template-columns:1fr 1fr}}
.aHab{display:flex;gap:15px;padding:20px 22px;border-radius:var(--r2);background:rgba(21,21,26,.65);
  box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow var(--f)}
.aHab:hover{box-shadow:inset 0 0 0 1.5px rgba(245,195,107,.4)}
.aHab .ic{flex:0 0 auto;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:var(--ch2);
  background:rgba(245,195,107,.12);box-shadow:inset 0 0 0 1px rgba(245,195,107,.3)}
.aHab .ic svg{width:21px;height:21px}
.aHab h3{font-family:var(--u);font-weight:700;font-size:1rem;margin-bottom:4px}
.aHab p{color:var(--mu);font-size:.93rem}

/* ---------------- guides ---------------- */
.aGuides{display:grid;gap:16px;margin-top:28px}
@media(min-width:840px){.aGuides{grid-template-columns:repeat(3,1fr)}}
.aGd{display:flex;flex-direction:column;gap:11px;padding:26px 24px;border-radius:var(--r3);
  background:linear-gradient(165deg,rgba(29,29,36,.88),rgba(16,16,20,.84));
  box-shadow:inset 0 0 0 1.5px var(--line);transition:transform var(--n),box-shadow var(--n)}
.aGd:hover{transform:translateY(-6px);box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh2)}
.aGd .tagx{align-self:flex-start;padding:5px 12px;border-radius:var(--rp);font-family:var(--u);font-weight:700;
  font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cr2);
  box-shadow:inset 0 0 0 1px rgba(225,29,72,.35)}
.aGd h3{font-family:var(--u);font-weight:700;font-size:1.12rem}
.aGd p{color:var(--mu);font-size:.93rem;flex:1}
.aGd .go{font-family:var(--u);font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ch2)}

/* ---------------- utils ---------------- */
.mtA{margin-top:clamp(36px,5vw,60px)}
@media(max-width:560px){
  .aT1{font-size:clamp(2.8rem,14vw,4rem)}
  .aBand,.aGet{padding:32px 20px}
  .aFact{flex:1 1 44%}
}


/* ---------------- brand logo (image) ---------------- */
.aLogo--img{gap:0}
.aLogo--img img{height:30px;width:auto;display:block}
.aLogo--img.aLogo--lg img{height:42px}
@media(max-width:520px){.aLogo--img img{height:26px}}

/* ---------------- app key highlights ---------------- */
.aHl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media(max-width:820px){.aHl{grid-template-columns:1fr;gap:16px}}
.aHlC{position:relative;display:block;border-radius:var(--r3);overflow:hidden;isolation:isolate;
  cursor:pointer;box-shadow:inset 0 0 0 1px var(--line),var(--sh1);
  transition:transform var(--n),box-shadow var(--n)}
.aHlC img{width:100%;height:auto;aspect-ratio:71/32;object-fit:cover;
  transition:transform .8s var(--e)}
.aHlC::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,12,0) 30%,rgba(10,10,12,.55) 62%,
    rgba(10,10,12,.94) 100%)}
.aHlC:hover{transform:translateY(-8px);box-shadow:inset 0 0 0 1.5px var(--line2),var(--sh2)}
.aHlC:hover img{transform:scale(1.06)}
.aHlC-b{position:absolute;left:24px;right:24px;bottom:20px;z-index:2;display:block}
.aHlC-b b{display:block;font-family:var(--u);font-weight:700;font-size:1.16rem;
  letter-spacing:-.01em;color:var(--tx)}
.aHlC-b span{display:block;color:var(--mu);font-size:.9rem;margin-top:3px;line-height:1.5}
.aHlC-go{position:absolute;top:16px;right:16px;z-index:2;display:inline-flex;align-items:center;gap:7px;
  padding:9px 15px;border-radius:var(--rp);font-family:var(--u);font-weight:700;font-size:.7rem;
  letter-spacing:.12em;text-transform:uppercase;background:var(--gCR);color:#fff;
  box-shadow:var(--glCR);opacity:0;transform:translateY(-8px);transition:var(--f)}
.aHlC-go i{font-style:normal}
.aHlC:hover .aHlC-go{opacity:1;transform:none}
@media(hover:none){.aHlC-go{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .aHlC,.aHlC img,.aHlC-go{transition:none}
  .aHlC:hover{transform:none}.aHlC:hover img{transform:none}
}

/* ---------------- games page grid ---------------- */
.aGames--all{grid-template-columns:repeat(auto-fill,minmax(148px,1fr))}
@media(max-width:520px){.aGames--all{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}}