/* ===== Page: Home (main.html) ===== */

/* section wrapper */
.section-block{scroll-margin-top:80px}

/* section head */
.section-head{display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.75rem}
.section-head h2{
    font-family:'Baloo 2',cursive; font-weight:900; margin:0; font-size:1.4rem; position:relative; padding-left:.55rem
}
.section-head h2:before{
    content:""; position:absolute; left:0; top:.5rem; bottom:.5rem; width:6px; border-radius:6px;
    background:linear-gradient(180deg,var(--brand),var(--brand-2))
}

/* grid & cards */
.games-grid .game-card,
.games-carousel .game-card{border-radius:var(--tile-r); overflow:hidden; background:#fff}
.thumb-wrap{position:relative; overflow:hidden}
.thumb-wrap::after{
    content:""; position:absolute; inset:0;
    background:radial-gradient(140px 70px at -15% -15%, rgba(255,255,255,.55), rgba(255,255,255,0) 70%);
    transform:translateX(-20%); transition:transform .35s ease
}
.game-card:hover .thumb-wrap::after{transform:translateX(20%)}

/* meta badge (playcount) */
.meta-badge{
    display:inline-flex; align-items:center; gap:.25rem;
    font-size:.72rem; font-weight:800; padding:.2rem .5rem; border-radius:999px;
    background:rgba(15,23,42,.85); color:#fff
}

/* spotlight caption */
.spot-card .caption{
    padding:.55rem .7rem; display:flex; align-items:center; justify-content:space-between; gap:.6rem
}
.line-2{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}

/* hover elevate */
.game-card{box-shadow:0 6px 14px rgba(13,38,76,.08); transition:transform .12s ease, box-shadow .12s ease}
.game-card:hover{transform:translateY(-2px); box-shadow:0 12px 26px rgba(13,38,76,.16)}