/* ═══════════════════════════════════════════════════════════════
   LOLBOOST SERVICES HUB
   Rebuilt to match the site's indigo/violet premium visual language
   (same palette + glow language as the shop hero headers and the
   coming-soon empty states). Structure, IDs and classes referenced
   by JS are all preserved 1:1 — this is a full visual rebuild, not
   a functional rewrite.
═══════════════════════════════════════════════════════════════ */
.services-hub-page{
    --gm-bg:#05050f;
    --gm-bg2:#090b16;
    --gm-panel:rgba(20,21,36,.72);
    --gm-panel2:rgba(12,13,24,.78);
    --gm-stroke:rgba(255,255,255,.09);
    --gm-stroke2:rgba(129,140,248,.30);
    --gm-text:#f5f6fb;
    --gm-muted:rgba(229,231,255,.60);
    --gm-muted2:rgba(229,231,255,.40);
    --gm-indigo:#6366f1;
    --gm-violet:#8b5cf6;
    --gm-lilac:#a78bfa;
    background:
      radial-gradient(1100px 620px at 8% -4%, rgba(99,102,241,.20), transparent 58%),
      radial-gradient(900px 560px at 92% 6%, rgba(139,92,246,.14), transparent 58%),
      linear-gradient(180deg,#050510 0%,#080a18 52%,#05050f 100%);
    color:var(--gm-text);
}
.services-hub-page main{position:relative;overflow:visible;background:transparent;}
.services-hub-page main::after{
    content:"";position:fixed;inset:auto -15% -35% -15%;height:520px;z-index:0;pointer-events:none;
    background:radial-gradient(closest-side at 50% 50%, rgba(99,102,241,.16), transparent 70%);
    filter:blur(18px);
}

/* ── Topbar ── */
.sh-topbar{
    padding-top:calc(var(--lb-content-top, 110px) + 44px);
    padding-bottom:52px;
    padding-left:max(8vw, 24px);
    padding-right:max(8vw, 24px);
    min-height:270px;
    background:
      radial-gradient(820px 440px at 22% 12%, rgba(99,102,241,.22), transparent 58%),
      radial-gradient(760px 420px at 84% 30%, rgba(139,92,246,.13), transparent 60%),
      linear-gradient(180deg, rgba(10,10,24,.9), rgba(7,7,17,.72));
    border-bottom:1px solid rgba(255,255,255,.07);
    position:relative;
    z-index:20;
    overflow:visible;
    isolation:isolate;
}
.sh-topbar::before{
    content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
    background-image:
      linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255,255,255,.032) 1px, transparent 1px);
    background-size:72px 72px;
    mask-image:radial-gradient(ellipse 72% 72% at 42% 20%, black, transparent 78%);
}
.sh-topbar::after{
    content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
    background:
      radial-gradient(440px 230px at 26% 28%, rgba(129,140,248,.14), transparent 70%),
      linear-gradient(180deg, transparent 0%, rgba(0,0,0,.26) 100%);
}
.sh-topbar__inner{
    position:relative;z-index:1;
    width:min(1500px,100%);
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    flex-wrap:wrap;
}
.sh-topbar__brand{display:flex;align-items:center;gap:20px;min-width:0;}
.sh-topbar__icon{
    position:relative;
    width:68px;height:68px;border-radius:22px;
    background:linear-gradient(135deg, #6366f1, #8b5cf6);
    border:1px solid rgba(167,139,250,.5);
    display:inline-flex;align-items:center;justify-content:center;
    font-size:27px;color:#fff;flex-shrink:0;
    box-shadow:0 22px 55px rgba(99,102,241,.32), inset 0 1px 0 rgba(255,255,255,.22);
}
.sh-topbar__icon::before{
    content:"";position:absolute;inset:-9px;border-radius:28px;
    border:1px dashed rgba(167,139,250,.32);
    animation:sh-spin-slow 20s linear infinite;
}
@keyframes sh-spin-slow{to{transform:rotate(360deg);}}
.sh-topbar__eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    margin-bottom:8px;
    font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;
    color:#a5b4fc;
}
.sh-topbar__eyebrow::before{
    content:"";width:7px;height:7px;border-radius:50%;
    background:linear-gradient(90deg,var(--gm-indigo),var(--gm-violet));
    box-shadow:0 0 0 6px rgba(99,102,241,.14);
}
.sh-topbar__h1{
    margin:0;
    font-size:clamp(34px,3.2vw,58px);
    line-height:1.02;
    letter-spacing:-.045em;
    font-weight:950;
    color:#fff;
    text-shadow:0 16px 50px rgba(0,0,0,.35);
}
.sh-topbar__sub{
    margin:8px 0 0;
    font-size:15px;
    line-height:1.55;
    color:var(--gm-muted);
    font-weight:700;
}

/* ── Search ── */
.sh-search{
    display:flex;align-items:center;gap:11px;
    width:min(360px,100%);
    height:52px;
    padding:0 20px;
    border-radius:999px;
    cursor:text;
    color:#fff;
    background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.035));
    border:1px solid rgba(255,255,255,.13);
    box-shadow:0 18px 55px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.08);
    transition:border-color .18s ease, box-shadow .18s ease, background .18s ease, transform .18s ease;
}
.sh-search:hover,
.sh-search:focus-within{
    transform:translateY(-1px);
    border-color:rgba(129,140,248,.5);
    background:linear-gradient(180deg, rgba(99,102,241,.14), rgba(255,255,255,.05));
    box-shadow:0 20px 60px rgba(0,0,0,.38), 0 0 0 4px rgba(99,102,241,.12);
}
.sh-search i{font-size:14px;color:#a5b4fc;flex-shrink:0;}
.sh-search input{
    flex:1;min-width:0;background:transparent;border:0;outline:0;
    color:#fff;font-size:14px;font-weight:800;
}
.sh-search input::placeholder{color:rgba(229,231,255,.42);}

.sh-search-wrap{
    position:relative;
    width:min(360px,100%);
    z-index:9999;
}
.sh-search-wrap .sh-search{
    width:100%;
}
.sh-dg-dropdown{
    position:absolute;
    top:calc(100% + 10px);
    left:0;
    right:0;
    z-index:10000;
    display:none;
    max-height:min(520px,calc(100vh - 180px));
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    border-radius:20px;
    background:linear-gradient(180deg, rgba(19,19,36,.98), rgba(8,8,17,.98));
    border:1px solid rgba(129,140,248,.42);
    box-shadow:0 24px 70px rgba(0,0,0,.58), 0 0 0 1px rgba(255,255,255,.06);
}
.sh-dg-dropdown.is-open{
    display:block;
}
.sh-dg-result{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px;
    text-decoration:none;
    color:#fff;
    border-bottom:1px solid rgba(255,255,255,.06);
    transition:background .16s ease;
}
.sh-dg-result:last-child{
    border-bottom:0;
}
.sh-dg-result:hover{
    background:rgba(99,102,241,.16);
}
.sh-dg-result__icon{
    width:38px;
    height:38px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    background:rgba(99,102,241,.16);
    border:1px solid rgba(255,255,255,.09);
    overflow:hidden;
    color:#c7b9ff;
}
.sh-dg-result__icon img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
    padding:6px;
}
.sh-dg-result__brand-initial{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:14px;
    font-weight:950;
    color:#e0d9ff;
    background:linear-gradient(180deg, rgba(99,102,241,.32), rgba(139,92,246,.14));
}
.sh-dg-result__body{
    min-width:0;
    flex:1;
}
.sh-dg-result__title{
    display:block;
    font-size:13px;
    font-weight:950;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.sh-dg-result__meta{
    display:block;
    margin-top:3px;
    font-size:11px;
    font-weight:800;
    color:rgba(229,231,255,.55);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.sh-dg-result__price{
    font-size:13px;
    font-weight:950;
    color:#fff;
    flex-shrink:0;
}
.sh-dg-empty{
    padding:14px;
    font-size:13px;
    font-weight:800;
    color:rgba(229,231,255,.6);
}
/* Heading shown above the focus suggestions ("Popular right now") */
.sh-dg-head{
    padding:10px 14px 8px;
    font-size:10.5px;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:rgba(167,180,255,.72);
    border-bottom:1px solid rgba(255,255,255,.06);
    margin-bottom:4px;
}


/* ── Content ── */
.sh-content{
    position:relative;z-index:1;
    width:min(1500px,calc(100vw - 48px));
    margin:0 auto;
    padding:56px 0 110px;
}
.sh-sec{margin-bottom:64px;}
.sh-sec-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:28px;}
.sh-sec-head h2{font-size:clamp(24px,2.1vw,36px);font-weight:950;margin:0;letter-spacing:-.035em;color:#fff;}
.sh-count{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:32px;padding:0 14px;border-radius:999px;
    font-size:12px;font-weight:900;color:rgba(229,231,255,.68);
    background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);
}

/* ── Card grid ── */
.sh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;}
.sh-grid--dg{grid-template-columns:repeat(4,minmax(0,1fr));}

/* ── Cards ── */
.sh-card{
    display:flex;flex-direction:column;text-decoration:none;color:#fff;
    border-radius:22px;overflow:hidden;position:relative;
    background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.022));
    border:1px solid rgba(255,255,255,.10);
    box-shadow:0 18px 60px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
    transition:transform .20s cubic-bezier(.22,1,.36,1), box-shadow .20s ease, border-color .20s ease, filter .20s ease;
}
.sh-card::before{
    content:"";position:absolute;inset:-1px;z-index:1;pointer-events:none;opacity:0;
    background:
      radial-gradient(500px 180px at 18% 0%, rgba(99,102,241,.20), transparent 62%),
      radial-gradient(500px 180px at 88% 0%, rgba(139,92,246,.20), transparent 64%);
    transition:opacity .20s ease;
}
.sh-card:hover{
    transform:translateY(-5px);
    border-color:rgba(129,140,248,.42);
    box-shadow:0 28px 80px rgba(0,0,0,.42), 0 0 0 1px rgba(129,140,248,.14), 0 0 52px rgba(99,102,241,.16);
}
.sh-card:hover::before{opacity:1;}

.sh-card__img-wrap{
    position:relative;
    aspect-ratio:3/4;
    overflow:hidden;
    background:
      radial-gradient(360px 180px at 50% 18%, rgba(99,102,241,.26), transparent 62%),
      linear-gradient(180deg, rgba(139,92,246,.08), rgba(99,102,241,.10) 45%, rgba(5,5,15,.92));
}
.sh-grid--dg .sh-card__img-wrap,
.sh-grid--dg .sh-card__img-wrap--placeholder,
.sh-grid--dg .sh-card__fa-wrap{
    aspect-ratio:16/7;
    min-height:150px;
}
.sh-card__img{
    width:100%;height:100%;object-fit:cover;display:block;
    transition:transform .32s ease, filter .32s ease;
}
.sh-card:hover .sh-card__img{transform:scale(1.055);filter:saturate(1.06) contrast(1.02);}
.sh-card__img-wrap::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:62%;z-index:1;pointer-events:none;
    background:linear-gradient(to top, rgba(5,5,15,.94) 0%, rgba(5,5,15,.55) 48%, transparent 100%);
}
.sh-card__img-wrap--placeholder{
    display:flex;align-items:center;justify-content:center;
    font-size:36px;color:rgba(199,185,255,.5);
}
.sh-card__icon-fallback{
    width:56px;height:56px;object-fit:contain;opacity:.68;
    filter:drop-shadow(0 0 22px rgba(129,140,248,.35));
}
.sh-card__fa-wrap{
    width:100%;display:flex;align-items:center;justify-content:center;
    background:
      radial-gradient(320px 160px at 50% 16%, rgba(139,92,246,.22), transparent 62%),
      linear-gradient(180deg, rgba(99,102,241,.24), rgba(8,7,18,.94));
}
.sh-card__fa-wrap i{
    font-size:clamp(38px,3.8vw,58px);
    color:#a78bfa;
    filter:drop-shadow(0 0 28px rgba(129,140,248,.5));
    transition:transform .24s ease, filter .24s ease;
}
.sh-card:hover .sh-card__fa-wrap i{transform:scale(1.08) rotate(-3deg);filter:drop-shadow(0 0 42px rgba(139,92,246,.68));}


.sh-offer-badge{
    position:absolute;right:12px;top:12px;z-index:3;
    display:inline-flex;align-items:center;gap:6px;
    min-height:30px;padding:0 11px;border-radius:999px;
    font-size:11px;font-weight:950;color:#fff;
    background:linear-gradient(135deg, rgba(99,102,241,.92), rgba(139,92,246,.82));
    border:1px solid rgba(255,255,255,.20);
    box-shadow:0 14px 34px rgba(0,0,0,.34), 0 0 28px rgba(99,102,241,.26);
    backdrop-filter:blur(10px);
}
.sh-offer-badge i{font-size:10px;color:#fff;}
.sh-offer-badge--soon{background:linear-gradient(135deg,rgba(251,191,36,.92),rgba(249,115,22,.86));box-shadow:0 14px 34px rgba(0,0,0,.34),0 0 28px rgba(251,191,36,.22);}
.sh-card--coming-soon{border-color:rgba(251,191,36,.20);}
.sh-card--coming-soon .sh-card__img{filter:saturate(.75) brightness(.74);}
.sh-card--coming-soon .sh-card__img-wrap::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(8,7,18,.08),rgba(8,7,18,.34));pointer-events:none;}
.sh-card__offers-inline--soon{color:#fde68a;background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.24);}
.sh-card__offers-inline{
    flex-shrink:0;
    display:inline-flex;align-items:center;gap:5px;
    padding:4px 8px;border-radius:999px;
    font-size:10px;font-weight:950;color:#c7b9ff;
    background:rgba(99,102,241,.12);border:1px solid rgba(129,140,248,.24);
}

/* Footer row */
.sh-card__foot{
    position:relative;z-index:2;
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:10px 12px;
    min-height:46px;
    background:rgba(6,6,16,.76);
    border-top:1px solid rgba(255,255,255,.06);
}
.sh-card__name{
    font-size:13px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    flex:1;min-width:0;letter-spacing:-.015em;color:#fff;
    text-shadow:0 10px 28px rgba(0,0,0,.45);
}
.sh-card__game-icon{
    width:24px;height:24px;border-radius:8px;object-fit:contain;flex-shrink:0;
    background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
}
.sh-card__dg-icon{
    width:28px;height:28px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
    background:linear-gradient(180deg, rgba(99,102,241,.26), rgba(139,92,246,.14));
    border:1px solid rgba(129,140,248,.36);
}
.sh-card__dg-icon i{font-size:13px;color:#c7b9ff;}
.sh-card__arrow{
    width:28px;height:28px;border-radius:10px;flex-shrink:0;
    display:inline-flex;align-items:center;justify-content:center;
    font-size:11px;color:#e0d9ff;
    background:rgba(99,102,241,.20);border:1px solid rgba(129,140,248,.35);
    transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.sh-card:hover .sh-card__arrow{
    transform:translateX(2px);
    background:linear-gradient(135deg, rgba(99,102,241,.75), rgba(139,92,246,.6));
    border-color:rgba(255,255,255,.20);
    box-shadow:0 0 22px rgba(129,140,248,.3);
}
.sh-card:hover .sh-card__game-icon{background:rgba(255,255,255,.08);}

/* NEW badge */
.sh-badge-new{
    position:absolute;top:10px;left:10px;z-index:3;
    display:inline-flex;align-items:center;gap:5px;
    padding:5px 10px;border-radius:999px;
    font-size:10px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;
    color:#fff;background:linear-gradient(90deg,#6366f1,#8b5cf6,#a78bfa);
    box-shadow:0 12px 28px rgba(99,102,241,.28);
    pointer-events:none;
}

/* Empty / no-results */
.sh-empty,.sh-no-results{
    color:var(--gm-muted);font-size:15px;padding:42px 0;text-align:center;
}
.sh-card[data-hidden="1"]{display:none;}

/* Coming soon empty state */
.sh-coming-soon{
  display:flex;align-items:center;gap:20px;max-width:720px;
  padding:26px;border-radius:24px;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.024));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 20px 70px rgba(0,0,0,.28);
}
.sh-cs-icon,.sh-cs-chat__icon{
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  background:rgba(99,102,241,.16);border:1px solid rgba(129,140,248,.28);color:#c7b9ff;
}
.sh-cs-icon{width:58px;height:58px;border-radius:18px;font-size:22px;}
.sh-cs-body{display:flex;flex-direction:column;gap:4px;flex:1;}
.sh-cs-title{font-size:18px;font-weight:950;color:#fff;letter-spacing:-.02em;}
.sh-cs-sub{font-size:14px;color:var(--gm-muted);font-weight:600;line-height:1.5;}
.sh-cs-chat{
  display:inline-flex;align-items:center;gap:12px;flex-shrink:0;text-decoration:none;color:#fff;
  padding:12px 18px;border-radius:16px;
  background:rgba(99,102,241,.14);border:1px solid rgba(129,140,248,.28);
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
}
.sh-cs-chat:hover{transform:translateY(-2px);background:rgba(99,102,241,.24);border-color:rgba(129,140,248,.48);}
.sh-cs-chat__icon{width:36px;height:36px;border-radius:12px;font-size:16px;}
.sh-cs-chat__text{display:flex;flex-direction:column;gap:1px;}
.sh-cs-chat__text span:first-child{font-size:11px;color:rgba(255,255,255,.55);font-weight:800;text-transform:uppercase;letter-spacing:.08em;}
.sh-cs-chat__text span:last-child{font-size:14px;font-weight:950;color:#fff;}

/* Responsive */
@media (max-width:1100px){
    .sh-grid--dg{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (max-width:900px){
    .sh-topbar{padding-left:16px;padding-right:16px;min-height:auto;padding-bottom:34px;}
    .sh-topbar__inner{flex-direction:column;align-items:flex-start;gap:20px;}
    .sh-search{width:100%;min-width:0;}
    .sh-search-wrap{width:100%;}
    .sh-content{width:calc(100vw - 28px);padding:34px 0 90px;}
    .sh-grid{grid-template-columns:repeat(2,1fr);gap:16px;}
    .sh-grid--dg{grid-template-columns:repeat(2,1fr);}
    .sh-grid--dg .sh-card__img-wrap,
    .sh-grid--dg .sh-card__img-wrap--placeholder,
    .sh-grid--dg .sh-card__fa-wrap{min-height:128px;}
    .sh-coming-soon{flex-direction:column;align-items:flex-start;}
}
@media (max-width:520px){
    .sh-topbar__brand{align-items:flex-start;}
    .sh-topbar__icon{width:54px;height:54px;border-radius:18px;font-size:22px;}
    .sh-grid{grid-template-columns:1fr;}
    .sh-grid--dg{grid-template-columns:1fr;}
    .sh-sec-head{align-items:flex-start;flex-direction:column;}
}



/* ═══════════════════════════════════════════════════════
   Mobile game hub, desktop-like mini cards, 3 per row
═══════════════════════════════════════════════════════ */
@media (max-width:520px){
    .sh-content{
        width:calc(100vw - 28px)!important;
        padding:32px 0 86px!important;
    }
    .sh-sec-head{
        flex-direction:row!important;
        align-items:center!important;
        margin-bottom:18px!important;
    }
    .sh-count{
        min-height:28px!important;
        padding:0 10px!important;
        font-size:11px!important;
    }

    .sh-grid:not(.sh-grid--dg){
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:14px 10px!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card{
        border-radius:14px!important;
        overflow:hidden!important;
        background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.024))!important;
        border:1px solid rgba(255,255,255,.10)!important;
        box-shadow:0 12px 32px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.045)!important;
        min-width:0!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card::before{
        display:block!important;
        opacity:.65!important;
        background:radial-gradient(170px 90px at 45% 0%,rgba(99,102,241,.16),transparent 68%)!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card:hover{
        transform:none!important;
        box-shadow:0 12px 32px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.045)!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card__img-wrap{
        aspect-ratio:3 / 4!important;
        border-radius:0!important;
        overflow:hidden!important;
        border:0!important;
        background:rgba(255,255,255,.04)!important;
        box-shadow:none!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card__img-wrap::after{
        display:block!important;
        height:54%!important;
        background:linear-gradient(to top,rgba(5,5,15,.88) 0%,rgba(5,5,15,.42) 50%,transparent 100%)!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card__img{
        width:100%!important;
        height:100%!important;
        object-fit:cover!important;
        object-position:center!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-offer-badge{
        display:inline-flex!important;
        right:6px!important;
        top:6px!important;
        min-height:21px!important;
        max-width:calc(100% - 12px)!important;
        padding:0 7px!important;
        gap:4px!important;
        font-size:8px!important;
        line-height:1!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        border-radius:999px!important;
        box-shadow:0 8px 18px rgba(0,0,0,.30),0 0 18px rgba(99,102,241,.18)!important;
    }
    .sh-grid:not(.sh-grid--dg) .sh-offer-badge i{font-size:8px!important;}

    .sh-grid:not(.sh-grid--dg) .sh-card__foot{
        min-height:39px!important;
        padding:7px 7px!important;
        border-top:1px solid rgba(255,255,255,.07)!important;
        background:rgba(6,6,16,.82)!important;
        display:grid!important;
        grid-template-columns:18px minmax(0,1fr) auto!important;
        gap:5px!important;
        align-items:center!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card__game-icon{
        display:block!important;
        width:18px!important;
        height:18px!important;
        border-radius:6px!important;
        background:rgba(255,255,255,.06)!important;
        border:1px solid rgba(255,255,255,.08)!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card__name{
        display:block!important;
        min-width:0!important;
        width:100%!important;
        font-size:10px!important;
        line-height:1.12!important;
        font-weight:950!important;
        color:#fff!important;
        text-shadow:0 8px 20px rgba(0,0,0,.45)!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-card__offers-inline{
        display:inline-flex!important;
        min-width:0!important;
        max-width:38px!important;
        height:22px!important;
        padding:0 6px!important;
        gap:3px!important;
        font-size:9px!important;
        line-height:1!important;
        overflow:hidden!important;
        white-space:nowrap!important;
    }
    .sh-grid:not(.sh-grid--dg) .sh-card__offers-inline i{font-size:8px!important;}

    .sh-grid:not(.sh-grid--dg) .sh-card__arrow{
        display:none!important;
    }

    .sh-grid:not(.sh-grid--dg) .sh-badge-new{
        top:6px!important;
        left:6px!important;
        padding:4px 7px!important;
        font-size:8px!important;
    }
}

@media (max-width:380px){
    .sh-grid:not(.sh-grid--dg){
        gap:12px 8px!important;
    }
    .sh-grid:not(.sh-grid--dg) .sh-card{
        border-radius:13px!important;
    }
    .sh-grid:not(.sh-grid--dg) .sh-card__foot{
        min-height:36px!important;
        padding:6px!important;
        grid-template-columns:17px minmax(0,1fr)!important;
    }
    .sh-grid:not(.sh-grid--dg) .sh-card__offers-inline{
        display:none!important;
    }
    .sh-grid:not(.sh-grid--dg) .sh-card__game-icon{
        width:17px!important;
        height:17px!important;
    }
    .sh-grid:not(.sh-grid--dg) .sh-card__name{
        font-size:9.5px!important;
    }
}

/* Flat shop-style hub header */
.services-hub-page{
    --gm-bg:#030817;
    --gm-bg2:#030817;
    --gm-panel:#090d1d;
    --gm-panel2:#090d1d;
    --gm-indigo:#4f6ef7;
    --gm-violet:#637cff;
    --gm-lilac:#8ea5ff;
    background:#030817;
}
.services-hub-page main::after{display:none;}
.sh-topbar{
    background:#030817;
    border-bottom:1px solid rgba(255,255,255,.07);
}
.sh-topbar::before,
.sh-topbar::after{display:none;}
.sh-topbar__icon{
    width:62px;
    height:62px;
    border-radius:18px;
    background:#10162d;
    border:1px solid rgba(124,159,255,.24);
    color:#7187ff;
    box-shadow:none;
}
.sh-topbar__icon::before{display:none;}
.sh-topbar__eyebrow{
    color:#8ea5ff;
    letter-spacing:.13em;
}
.sh-topbar__eyebrow::before{
    width:6px;
    height:6px;
    background:#637cff;
    box-shadow:none;
}
.sh-topbar__h1{
    font-size:clamp(32px,3vw,50px);
    letter-spacing:-.035em;
    font-weight:900;
    text-shadow:none;
}
.sh-topbar__sub{
    color:rgba(196,205,239,.68);
    font-weight:600;
}
.sh-search{
    height:50px;
    border-radius:16px;
    background:#0b1022;
    border:1px solid rgba(255,255,255,.11);
    box-shadow:none;
}
.sh-search:hover,
.sh-search:focus-within{
    transform:none;
    background:#0d1328;
    border-color:rgba(124,159,255,.32);
    box-shadow:0 0 0 3px rgba(79,110,247,.08);
}
.sh-search i{color:#8ea5ff;}
.sh-dg-dropdown{
    background:#090d1d;
    border-color:rgba(124,159,255,.24);
    box-shadow:0 22px 58px rgba(0,0,0,.48);
}