/* game cards (K3): tall 3:4, square art on top, brand-coloured foot */
.gwall{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:22px}
@media(min-width:480px){.gwall{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media(min-width:768px){.gwall{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1100px){.gwall{grid-template-columns:repeat(6,minmax(0,1fr))}}
.gcard{
  position:relative;display:flex;flex-direction:column;
  background:var(--navy);border-radius:16px;overflow:hidden;text-decoration:none;
  box-shadow:0 6px 16px rgba(1,13,81,.12);
  transition:box-shadow .2s ease,filter .2s ease;
}
.gcard-art{display:block;aspect-ratio:1/1;overflow:hidden;background:#05103f}
.gcard-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.gcard-svg .gcard-art img{object-fit:contain}
.gcard-foot{
  display:flex;align-items:center;min-height:38px;padding:7px 10px;
  background:linear-gradient(180deg,rgba(1,13,81,.9) 0%,var(--navy) 100%);
}
.gcard-studio{font-family:var(--ui);font-size:1.15rem;line-height:1.22;color:#b9c5f6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(min-width:768px){.gcard-studio{font-size:1.25rem}}
.gcard-ribbon{
  position:absolute;left:-30px;top:12px;width:116px;padding:3px 0;
  background:var(--red);color:#fff;font-family:var(--ui);font-size:1.1rem;text-align:center;
  transform:rotate(-38deg);z-index:3;letter-spacing:.04em;
}
.gcard-live{
  position:absolute;right:6px;top:6px;z-index:3;
  display:inline-flex;align-items:center;gap:3px;
  background:rgba(1,13,81,.82);border-radius:999px;padding:3px 8px;
  font-family:var(--ui);font-size:1.2rem;font-variant-numeric:tabular-nums;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
}
.gcard-live-k{color:#c6d2ff;font-size:1.02rem;letter-spacing:.03em}
.gcard-live.is-up{color:#4dff82}
.gcard-live.is-down{color:#ffc34d}
.gcard-tip{
  position:absolute;left:6px;right:6px;top:36px;z-index:4;
  background:#fff;color:var(--navy);border-radius:10px;padding:6px 8px;
  font-size:1.15rem;line-height:1.3;box-shadow:0 10px 24px rgba(1,13,81,.3);
  opacity:0;visibility:hidden;transition:opacity .16s ease;
}
@media(min-width:1024px){
  .gcard:hover{box-shadow:0 14px 30px rgba(1,13,81,.3)}
  .gcard:hover .gcard-tip,.gcard:focus-within .gcard-tip{opacity:1;visibility:visible}
}
.gcard-all{background:var(--green);justify-content:center}
.gcard-all-in{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:100%;min-height:150px;padding:14px;color:var(--navy);font-family:var(--ui);font-size:1.4rem;text-align:center}
.gcard-all:hover{background:#67ff95}

/* rail (Splide) */
.rail-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rail-nav{display:none;gap:8px;margin-left:auto}
@media(min-width:768px){.rail-nav{display:flex}}
.rail-btn{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--navy);color:#fff}
.rail-btn:hover{background:var(--navy2)}
.rail-btn[disabled]{opacity:.35;cursor:default}
.rail{margin-top:18px;visibility:visible}
.rail .splide__list{align-items:stretch}
.rail .splide__slide{height:auto;display:flex}
.rail .splide__slide>.gcard{flex:1 1 auto}
.rail:not(.is-ready) .splide__list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);gap:12px;overflow-x:auto;scrollbar-width:none}
.rail:not(.is-ready) .splide__list::-webkit-scrollbar{display:none}
.rail .splide__track{overflow:hidden}

/* collection cards */
.cgrid{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
@media(min-width:560px){.cgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:900px){.cgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:900px){.cgrid:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.cgrid:has(>:nth-child(3):last-child),.cgrid:has(>:nth-child(5):last-child),.cgrid:has(>:nth-child(6):last-child),.cgrid:has(>:nth-child(9):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:560px) and (max-width:899px){.cgrid:has(>:nth-child(2):last-child),.cgrid:has(>:nth-child(4):last-child),.cgrid:has(>:nth-child(8):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
.ccard{
  position:relative;z-index:2;display:flex;flex-direction:column;background:#fff;
  border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;
  transition:box-shadow .2s ease,border-color .2s ease;
}
.ccard:hover{border-color:var(--green);box-shadow:0 14px 30px rgba(1,13,81,.14)}
.ccard-art{display:block;aspect-ratio:1/1;overflow:hidden;background:#05103f}
.ccard-art img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;padding:4px}
.ccard-txt{display:block;padding:12px 14px 14px}
.ccard-txt h4{color:var(--navy);font-size:1.7rem}
.ccard-txt p{margin-top:3px;font-size:1.35rem;color:var(--muted)}
.ccard-svg .ccard-art img{object-fit:contain;background:#05103f}

/* type tiles */
.type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
@media(min-width:768px){.type-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.type-tile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;background:var(--bg3);border-radius:var(--r);padding:18px 12px;text-decoration:none;transition:background-color .2s ease,box-shadow .2s ease}
.type-tile:hover{background:#dfe5fa;box-shadow:0 10px 24px rgba(1,13,81,.12)}
.type-tile .ic-lg{color:var(--navy)}
.type-tile p:first-of-type{font-family:var(--ui);font-size:1.7rem;color:var(--navy);margin-top:6px}
.type-tile p+p{font-size:1.3rem;color:var(--muted)}

/* game banner (K35) */
.sec-banner{position:relative;overflow:hidden;background:var(--navy);color:#dbe2ff;padding:34px 0}
.sec-banner::before{content:"";position:absolute;inset:-40px;background-image:var(--bn);background-size:cover;background-position:center;filter:blur(14px);opacity:.5}
.sec-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,13,81,.86) 0%,rgba(1,13,81,.7) 100%)}
.bn-row{position:relative;z-index:2;display:grid;gap:18px;align-items:center}
@media(min-width:720px){.bn-row{grid-template-columns:300px minmax(0,1fr);gap:28px}}
.bn-art{display:block;border-radius:20px;overflow:hidden;border:3px solid rgba(255,255,255,.22);background:#05103f;max-width:300px;margin:0 auto;transition:box-shadow .2s ease,border-color .2s ease}
.bn-art:hover{border-color:var(--green);box-shadow:0 18px 40px rgba(0,0,0,.4)}
.bn-art img{display:block;width:100%;height:auto;max-height:200px;object-fit:contain}
@media(min-width:720px){.bn-art img{max-height:none}}
.bn-kicker{font-family:var(--ui);font-size:1.3rem;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}
.sec-banner h2{color:#fff;margin-top:6px}
.bn-prov{font-size:1.5rem;color:#aebaf0;margin-top:6px}
.bn-text .btn{margin-top:18px}

/* About figure + facts strip */
.about-fig{margin:22px 0 0}
.about-fig img{display:block;width:100%;max-width:620px;height:auto;margin:0 auto;border-radius:var(--r)}
.facts-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}
@media(min-width:768px){.facts-strip{grid-template-columns:repeat(4,minmax(0,1fr))}}
.facts-strip div{display:flex;flex-direction:column;gap:2px;background:var(--navy);border-radius:var(--rs);padding:14px}
.facts-strip span{font-size:1.2rem;letter-spacing:.05em;text-transform:uppercase;color:#8e9ddd}
.facts-strip b{font-family:var(--ui);font-size:1.6rem;color:#fff}

/* pros and cons */
.pc-grid{display:grid;gap:14px;margin-top:22px}
@media(min-width:860px){.pc-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
.pc{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px}
.pc h3{font-size:1.9rem}
.pc ul{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.pc li{display:flex;align-items:flex-start;gap:10px;font-size:1.55rem}
.pc li .ic{margin-top:3px;flex:none}
.pc-up li .ic{color:var(--greenD)}
.pc-note li .ic{color:var(--navy)}
.pc-note{background:var(--bg3);border-color:var(--bg3)}

/* why cards */
.why-grid{display:grid;gap:14px;margin-top:22px}
@media(min-width:620px){.why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.why-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.why{display:flex;flex-direction:column;gap:10px;background:var(--bg2);border-radius:var(--r);padding:18px}
.sec-tint .why,.sec-games .why,.sec-pattern .why{background:#fff;box-shadow:0 6px 18px rgba(1,13,81,.06)}
.why .ic-lg{color:var(--navy)}
.why p{font-size:1.55rem}
.why strong{font-family:var(--ui);font-weight:600;color:var(--navy)}
