/* One material language: graphite, platinum light and deep red lacquer. */
:root{--red:#dc304a;--silver:#d5dce4;--ease:cubic-bezier(.22,1,.36,1)}
.nav-surface{background:linear-gradient(120deg,rgb(33 37 43 / .94),rgb(16 19 24 / .96));border-color:rgb(220 231 242 / .12);box-shadow:inset 0 1px 0 rgb(255 255 255 / .07),0 12px 35px rgb(0 0 0 / .12)}
.button{background:linear-gradient(160deg,#bd2941,#921c31);box-shadow:inset 0 1px 0 rgb(255 255 255 / .26),inset 0 -1px 0 rgb(35 1 8 / .2),0 5px 22px rgb(127 18 36 / .13)}
.button b{background:rgb(255 255 255 / .035);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .13)}
.button:hover b{transform:translate(2px,-2px)}
.button:active{transform:scale(.985)}
.hero h1{font-family:Manrope,sans-serif;font-size:clamp(64px,6.5vw,94px);font-weight:700;line-height:1.07;letter-spacing:-4.8px;text-shadow:none}
.hero .eyebrow{font-size:10px;letter-spacing:2.1px;color:#aeb7c3}
.hero-copy>p:not(.eyebrow){letter-spacing:-.15px}
.hero .red-text{color:#df344d}
.hero .metal-text{background-image:linear-gradient(180deg,#fff 10%,#d4dbe3 85%)}
.games{padding-block:72px 70px}
.section-heading{margin-bottom:33px}
.section-heading h2{font-size:52px;line-height:1.06;letter-spacing:-2.5px}
.section-heading h2>span{color:#98a2b0}
.section-heading>p{margin-top:21px;color:#a7b3c2}

/* A single physical display keeps art, information and controls on one plane. */
.game-gallery{display:grid;grid-template-columns:232px minmax(0,1fr);padding:3px;border-radius:19px;background:linear-gradient(140deg,#2b313a 0%,#171c23 24%,#11151c 60%,#222932);box-shadow:inset 0 1px 0 rgb(255 255 255 / .085),0 22px 65px rgb(0 0 0 / .14);isolation:isolate}
.game-selector{display:grid;grid-template-rows:repeat(4,1fr);padding:20px 11px;background:linear-gradient(180deg,#1a1f27,#10151c);border-radius:16px 0 0 16px}
.game-tab{position:relative;display:grid;grid-template-columns:27px 1fr 14px;align-items:center;gap:12px;min-height:108px;text-align:left;background:transparent;padding:16px 14px;border-radius:8px;color:#8997a9;transition:background .5s var(--ease),color .5s var(--ease)}
.game-tab:before{content:'';position:absolute;left:0;top:calc(50% - 22px);height:44px;width:2px;background:var(--red);opacity:0;transform:scaleY(.4);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.game-tab[aria-selected=true]{background:linear-gradient(110deg,rgb(255 255 255 / .06),transparent);color:#eef2f7}
.game-tab[aria-selected=true]:before{opacity:1;transform:scaleY(1)}
.game-tab:hover{color:#e1e7ef;background-color:rgb(255 255 255 / .025)}
.format-suit{font-size:25px;line-height:1;color:#aab7c6}
.game-tab:nth-child(even) .format-suit{color:#c43b50}
.game-tab strong{display:block;font-size:14px;line-height:1.4;letter-spacing:-.3px}
.game-tab small{display:block;font-size:11px;font-weight:400;color:#94a1b3;margin-top:7px;line-height:1.4}
.game-tab i{font-size:16px;font-style:normal;opacity:.5}
.game-tab[aria-selected=true] i{color:#e2586d;opacity:1}
.gallery-scene{position:relative;isolation:isolate;min-height:500px;overflow:hidden;border-radius:0 16px 16px 0;background:radial-gradient(ellipse at 82% 75%,#252c34,transparent 58%),#0e1218}
.gallery-art{position:absolute;inset:0 0 0 auto;z-index:-3;width:auto;max-width:100%;height:100%;object-fit:contain;object-position:right bottom;mask-image:linear-gradient(90deg,transparent,#000 20%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 20%)}
.gallery-scene[data-format=aof] .gallery-art{filter:saturate(.4)}
.gallery-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgb(14 18 24 / .97),rgb(14 18 24 / .7) 25%,transparent 59%),linear-gradient(0deg,rgb(14 18 24 / .25),transparent 20%);pointer-events:none}
.gallery-copy{position:relative;padding:50px 0 36px 40px;max-width:310px}
.gallery-copy h3{font:800 74px/.96 Barlow,sans-serif;min-height:143px;letter-spacing:-.3px;text-transform:uppercase;color:#eef1f6}
.gallery-copy p{font-size:14px;line-height:1.85;color:#b3bfce;max-width:258px;min-height:79px;margin-top:19px}
.gallery-open{display:inline-flex;align-items:center;gap:26px;min-height:44px;padding:5px 6px 5px 18px;margin-top:24px;border-radius:99px;background:linear-gradient(165deg,#333d49,#1c2530);color:#dce5ef;font-size:12px;font-weight:700;box-shadow:inset 0 1px 0 rgb(235 244 255 / .24),inset 0 -1px 0 rgb(6 10 17 / .4);transition:transform .4s var(--ease),filter .4s var(--ease)}
.gallery-open b{font-size:20px;font-weight:400;display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:rgb(255 255 255 / .05);box-shadow:inset 0 0 0 1px rgb(235 244 255 / .12);transition:transform .4s var(--ease)}
.gallery-open:hover{filter:brightness(1.15)}
.gallery-open:hover b{transform:translate(2px,-2px)}
.gallery-open:active{transform:scale(.98)}
.availability{font-size:11px;color:#8c9bad;margin-top:19px}

/* Keep the native screenshot true, mounted inside a shallow metal recess. */
.experience{padding-block:77px;background:radial-gradient(ellipse at 30% 54%,rgb(85 99 116 / .12),transparent 65%);border:0}
.lobby-layout{gap:100px}
.lobby-proof{max-width:460px;padding:6px 6px 0;border-radius:22px;background:linear-gradient(145deg,#4d5764,#161e28 37%,#293543);box-shadow:inset 0 1px 0 rgb(232 242 255 / .3),0 23px 65px rgb(0 0 0 / .17);transform:perspective(1300px) rotateY(7deg) rotateX(3deg) rotateZ(-1deg)}
.lobby-window{border:0;border-radius:16px;box-shadow:inset 0 1px 0 #fff}
.lobby-proof figcaption{font-size:10px;letter-spacing:.35px;margin:0;padding:15px 10px;color:#b4c2d3}
.lobby-copy h2{font-size:46px;letter-spacing:-2px}
.lobby-copy>p{font-size:15px;color:#aebdcd}
.product-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:27px 0 0;padding-top:18px;border-top:1px solid rgb(230 240 255 / .12);max-width:390px}
.product-fields dt{font-size:12px;font-weight:700;color:#dbe3ed}
.product-fields dd{margin:6px 0 0;font-size:12px;color:#91a2b7;line-height:1.6}
.lobby-facts{margin-top:28px;border-color:#a82b40}
.lobby-facts h3{font-size:17px}
.lobby-facts p{font-size:13px;color:#96a8be}

.tournaments{padding-top:40px;padding-bottom:0}
.tournament-banner{background:transparent;border-radius:0;min-height:350px}
.tournament-banner>img{left:auto;right:0;width:auto;max-width:80%;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 96%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 96%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 96%,transparent);mask-composite:intersect;-webkit-mask-composite:source-in}
.tournament-banner:after{background:linear-gradient(90deg,#0c0f13,rgb(12 15 19 / .7) 27%,transparent 62%),linear-gradient(0deg,#0c0f13,transparent 14%)}
.campaign-copy{padding:34px 0;max-width:570px}
.campaign-copy h2{font-family:Manrope,sans-serif;font-size:47px;font-weight:700;line-height:1.12;letter-spacing:-2px;text-shadow:none}
.campaign-copy h2 span{color:#aebaca}
.campaign-copy p{font-size:14px;color:#9dacc0}
.status-tag{font-size:10px;color:#bca7b0;letter-spacing:1.4px}
.clubs{position:relative;gap:95px;padding-top:30px;padding-bottom:49px}
.clubs:before{content:'';position:absolute;left:7%;right:7%;height:1px;top:0;background:linear-gradient(90deg,transparent,rgb(209 225 245 / .13),transparent)}
.club-visual{mask-image:linear-gradient(90deg,transparent,#000 10%,#000 94%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 94%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 96%,transparent);mask-composite:intersect;-webkit-mask-composite:source-in}
.club-visual img{object-fit:contain;object-position:center bottom}
.club-copy h2{font-size:45px;letter-spacing:-1.8px}
.club-copy p{font-size:14px;color:#9dacc0}
.support{padding-top:43px;padding-bottom:80px}
.support h2{font-size:36px}
.faq details{border-left:2px solid transparent;padding-inline:16px;transition:background .4s var(--ease),border-color .4s var(--ease)}
.faq details[open]{border-left-color:var(--red);background:rgb(230 240 255 / .025);border-radius:0 9px 9px 0}
.faq details[open] summary span{color:var(--red)}
.faq summary{font-size:14px;min-height:62px}
.faq details:first-child summary{padding-top:20px}
.faq details p{font-size:13px}
.download{background:radial-gradient(ellipse at 1% 120%,rgb(158 23 45 / .19),transparent 64%),linear-gradient(140deg,#1b242e,#101720);isolation:isolate}
.download:before{content:'MAVO';position:absolute;right:-18px;bottom:-20px;z-index:-1;font:800 300px/.85 Barlow,sans-serif;letter-spacing:-8px;color:rgb(221 233 250 / .026);text-shadow:0 -1px 0 rgb(255 255 255 / .018);pointer-events:none}
.download-layout{padding-block:64px;position:relative}
.download h2{font-size:49px;letter-spacing:-2px}
.release-status{font-size:10px!important;color:#cb8d9b!important}
.store{background:linear-gradient(150deg,#2e3a49,#182332);box-shadow:inset 0 1px 0 rgb(231 243 255 / .12)}
.store-google{background:linear-gradient(145deg,#dce3ec,#b8c4d3);color:#152131}
.footer{padding-block:32px}

@media(min-width:1600px){.hero h1{font-size:94px}}
@media(min-width:768px) and (max-width:1050px){
  .game-gallery{grid-template-columns:202px minmax(0,1fr)}
  .game-tab{padding-inline:12px;gap:9px;grid-template-columns:23px 1fr 12px}
  .game-tab strong{font-size:13px}
  .gallery-copy{padding-left:28px;max-width:270px}
  .gallery-copy h3{font-size:65px;min-height:126px}
  .gallery-copy p{font-size:13px;max-width:216px}
  .gallery-shade{background:linear-gradient(90deg,rgb(14 18 24 / .96),rgb(14 18 24 / .7) 25%,transparent 75%)}
  .lobby-layout{gap:48px}
  .lobby-copy h2{font-size:39px}
  .product-fields{gap:12px}
  .product-fields dt,.product-fields dd{font-size:11px}
  .campaign-copy h2{font-size:41px}
  .clubs{gap:45px}
  .club-copy h2{font-size:39px}
}
@media(min-width:768px) and (max-width:959px){
  .hero h1{font-size:clamp(49px,6.6vw,64px);letter-spacing:-3px}
  .game-gallery{grid-template-columns:180px minmax(0,1fr)}
  .game-tab{grid-template-columns:21px 1fr;gap:10px;padding-inline:11px}
  .game-tab i{display:none}
  .gallery-scene{min-height:465px}
  .gallery-copy{padding-left:24px;max-width:240px}
  .gallery-copy h3{font-size:57px;min-height:110px}
  .gallery-copy p{max-width:196px;min-height:100px}
  .gallery-open{font-size:11px;gap:15px;padding-left:15px}
  .gallery-art{height:79%;top:auto;bottom:0}
  .lobby-copy h2{font-size:35px}
  .lobby-copy>p{font-size:14px}
  .lobby-facts p{font-size:12px}
  .product-fields{gap:8px}
}
@media(max-width:767px){
  .hero h1{font-size:clamp(38px,12vw,66px);line-height:1.08;letter-spacing:-2.4px}
  .hero .eyebrow{font-size:9px;letter-spacing:1.7px}
  .games{padding-block:45px 39px}
  .section-heading{margin-bottom:26px}
  .section-heading h2{font-size:37px;letter-spacing:-1.6px;line-height:1.09}
  .section-heading>p{font-size:14px;margin-top:18px}
  .game-gallery{display:flex;flex-direction:column;padding:4px;border-radius:17px}
  .game-selector{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:4px;padding:9px;background:linear-gradient(160deg,#1c232c,#111821);border-radius:13px 13px 0 0}
  .game-tab{min-height:80px;grid-template-columns:20px 1fr;gap:10px;padding:13px 11px;border-radius:7px}
  .game-tab:before{height:37px;top:calc(50% - 18px)}
  .game-tab strong{font-size:13px;letter-spacing:-.3px}
  .game-tab small{font-size:10px;margin-top:5px}
  .game-tab i{display:none}
  .format-suit{font-size:21px}
  .gallery-scene{min-height:475px;border-radius:0 0 13px 13px;background:linear-gradient(180deg,#0e1218 0%,#14171b 55%,#18191a 100%)}
  .gallery-copy{max-width:270px;padding:28px 0 0 25px}
  .gallery-copy h3{font-size:55px;min-height:107px;max-width:225px}
  .gallery-copy p{font-size:13px;max-width:229px;min-height:66px;margin-top:15px}
  .gallery-open{font-size:11px;min-height:41px;gap:20px;margin-top:19px;padding-left:16px}
  .gallery-open b{width:29px;height:29px;font-size:19px}
  .gallery-art{inset:auto 0 0 auto;width:auto;max-width:100%;height:auto;max-height:64%;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 12%),linear-gradient(180deg,transparent,#000 8%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%),linear-gradient(180deg,transparent,#000 8%);mask-composite:intersect;-webkit-mask-composite:source-in}
  .gallery-shade{background:linear-gradient(180deg,#0e1218 0%,rgb(14 18 24 / .97) 23%,rgb(14 18 24 / .4) 55%,transparent 81%)}
  .availability{font-size:11px;line-height:1.8;margin-top:17px}
  .experience{padding-block:45px}
  .lobby-layout{gap:30px}
  .lobby-proof{max-width:445px;transform:none;border-radius:18px;padding:5px 5px 0}
  .lobby-window{border-radius:13px}
  .lobby-copy h2{font-size:35px;letter-spacing:-1.4px}
  .lobby-copy>p{font-size:14px}
  .product-fields{gap:16px;margin-top:23px;padding-top:16px}
  .product-fields dt{font-size:12px}
  .product-fields dd{font-size:11px}
  .lobby-facts{margin-top:23px}
  .lobby-facts h3{font-size:17px}
  .lobby-facts p{font-size:13px}
  .lobby-proof figcaption{font-size:9px;padding-block:12px}
  .tournaments{padding-top:27px}
  .tournament-banner{min-height:435px}
  .tournament-banner>img{left:0;right:0;width:100%;max-width:100%;height:62%;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 97%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 97%,transparent),linear-gradient(180deg,transparent,#000 7%,#000 96%,transparent);object-fit:contain}
  .tournament-banner:after{background:linear-gradient(180deg,#0c0f13 0%,rgb(12 15 19 / .96) 27%,transparent 64%),linear-gradient(0deg,#0c0f13,transparent 12%)}
  .campaign-copy{padding:15px 8px;max-width:none}
  .campaign-copy h2{font-size:37px;letter-spacing:-1.5px;line-height:1.13}
  .campaign-copy p{font-size:13px;margin-top:18px}
  .campaign-copy .text-link{font-size:12px}
  .status-tag{font-size:9px;letter-spacing:1.2px;margin-bottom:18px}
  .clubs{gap:0;padding-top:30px;padding-bottom:20px}
  .club-copy h2{font-size:35px;letter-spacing:-1.4px}
  .club-copy p{font-size:13px}
  .club-visual{aspect-ratio:1.85;margin-top:17px}
  .support{padding-top:32px;padding-bottom:44px}
  .support h2{font-size:31px;letter-spacing:-1.2px}
  .faq{margin-top:24px}
  .faq details{padding-inline:10px}
  .faq summary{font-size:13px;min-height:59px;gap:12px}
  .faq details p{font-size:13px}
  .download-layout{padding-block:42px}
  .download h2{font-size:36px;letter-spacing:-1.3px}
  .download:before{font-size:200px;bottom:-5px;right:-20px}
}
@media(max-width:360px){
  .hero h1{font-size:38px;letter-spacing:-2.2px}
  .game-tab{padding-inline:9px;gap:8px;grid-template-columns:17px 1fr}
  .game-tab strong{font-size:12px}
  .game-tab small{font-size:10px}
  .format-suit{font-size:19px}
  .gallery-copy{padding-left:21px;max-width:246px}
  .gallery-copy h3{font-size:50px;min-height:97px}
  .gallery-copy p{max-width:212px}
  .gallery-open{gap:15px}
}
@media(prefers-reduced-motion:reduce){.gallery-art,.game-tab:before,.button b{transition:none}}
