/* LI GAMING — DIGITAL SERVICES HOMEPAGE V15
   One clean service-home layer. No tiled brand marks, no nested logo boxes,
   no service shell, no benefit row, no contact strip, no heavy header surface. */

/* ---------- Header: transparent, compact, premium controls ---------- */
header.top,
header.top .nav,
header.top .brand,
header.top .actions,
header.top .header-actions,
header.top .nav-search-btn,
header.top .profile-nav,
header.top .cart-nav {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
header.top,
header.top::before,
header.top::after,
header.top .nav::before,
header.top .nav::after,
header.top .brand::before,
header.top .brand::after,
header.top .nav-search-btn::before,
header.top .nav-search-btn::after,
header.top .profile-nav::before,
header.top .profile-nav::after,
header.top .cart-nav::before,
header.top .cart-nav::after {
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}
header.top {
  position: relative !important;
  min-height: 66px !important;
  height: 66px !important;
  padding: 0 !important;
  margin: 0 !important;
}
header.top .nav {
  width: min(1460px, calc(100% - 32px)) !important;
  height: 66px !important;
  min-height: 66px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  gap: 18px !important;
}
header.top .brand-logo,
header.top .brand-gaming-text,
header.top .navlinks {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}
header.top .brand-logo::before,
header.top .brand-logo::after,
header.top .brand-gaming-text::before,
header.top .brand-gaming-text::after {
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}
header.top .actions,
header.top .header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-left: auto !important;
}
header.top .nav-search-btn,
header.top .profile-nav,
header.top .cart-nav {
  position: relative !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: #ecfbff !important;
  outline: none !important;
  overflow: visible !important;
  cursor: pointer !important;
  transition: transform .16s ease, filter .16s ease !important;
}
header.top .nav-search-btn:hover,
header.top .profile-nav:hover,
header.top .cart-nav:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.08) !important;
}
header.top .nav-search-icon,
header.top .cart-icon-v15 {
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 34% 28%, rgba(94,222,255,.23), rgba(38,108,170,.10) 62%, rgba(0,0,0,0) 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(94,214,255,.22) !important;
}
header.top .nav-search-icon svg,
header.top .cart-icon-v15 svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
}
header.top .nav-search-label,
header.top .profile-nav-text {
  display: none !important;
}
header.top .nav-avatar {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border: 1px solid rgba(78,204,255,.28) !important;
  background: radial-gradient(circle at 35% 28%, #56bff2, #1b67b5 68%, #12436f 100%) !important;
  box-shadow: none !important;
  font-size: 15px !important;
}
header.top .nav-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
header.top .cart-icon-v15 {
  background: radial-gradient(circle at 35% 28%, rgba(92,255,202,.19), rgba(17,111,93,.11) 62%, rgba(0,0,0,0) 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(79,232,183,.20) !important;
}
header.top .cart-count {
  right: -1px !important;
  top: -2px !important;
  min-width: 15px !important;
  height: 15px !important;
  padding: 0 3px !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  background: linear-gradient(135deg,#ff4a61,#ff8a2c) !important;
  font-size: 7px !important;
}

/* ---------- Compact homepage heading ---------- */
.li-service-home {
  width: 100% !important;
  min-height: 0 !important;
  padding: 6px 16px 26px !important;
  background: transparent !important;
  overflow: visible !important;
}
.li-service-shell {
  width: min(1460px, 100%) !important;
  max-width: 1460px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.li-service-header {
  display: block !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
}
.li-service-brand-row { display: block !important; }
.li-service-kicker { display: none !important; }
.li-service-header h1 {
  display: block !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: clamp(24px, 3.4vw, 46px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: -0.015em !important;
  color: transparent !important;
  background: linear-gradient(100deg,#f8fdff 0%,#ffffff 42%,#7ce5ff 78%,#88b7ff 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none !important;
}
.li-service-header h1::after {
  content: "" !important;
  display: block !important;
  width: min(220px, 28vw) !important;
  height: 2px !important;
  margin-top: 7px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg,#5ddcff 0%,#5388ff 52%,transparent 100%) !important;
  box-shadow: none !important;
}

/* First landing screen must remain service-only. */
#mainSiteContent.service-content-locked[hidden] { display: none !important; }
#mainSiteContent.service-content-locked { display: none !important; }
body.li-service-category-open #mainSiteContent.service-content-locked:not([hidden]) { display: block !important; }

/* ---------- Service cards: solid brand-tinted surfaces, no fake borders/marks ---------- */
.li-service-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 12px !important;
}
.li-service-card,
.li-service-card:hover {
  position: relative !important;
  min-width: 0 !important;
  min-height: 112px !important;
  display: grid !important;
  grid-template-columns: 84px minmax(0,1fr) 12px !important;
  align-items: center !important;
  gap: 15px !important;
  padding: 13px 15px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 18px !important;
  outline: 0 !important;
  color: #f4fbff !important;
  text-align: left !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: filter .16s ease !important;
}
.li-service-card::before,
.li-service-card::after {
  display: none !important;
  content: none !important;
}
.li-service-card:hover { filter: brightness(1.04) !important; }

.service-youtube { background: linear-gradient(135deg,#291015,#1d0d13 52%,#170b10) !important; }
.service-meta { background: linear-gradient(135deg,#0b213e,#0a294e 50%,#071a31) !important; }
.service-vpn { background: linear-gradient(135deg,#171536,#211848 52%,#131229) !important; }
.service-pubg { background: linear-gradient(135deg,#202421,#272a27 52%,#1d201e) !important; }
.service-chatgpt { background: linear-gradient(135deg,#10271f,#123329 52%,#0d211a) !important; }
.service-8ball { background: linear-gradient(135deg,#10273c,#123b5c 52%,#0f273d) !important; }

.li-service-logo {
  width: 84px !important;
  height: 84px !important;
  display: grid !important;
  place-items: center !important;
  position: relative !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.li-service-logo::before,
.li-service-logo::after {
  content: none !important;
  display: none !important;
}
.li-service-logo img {
  width: 72px !important;
  height: 72px !important;
  display: block !important;
  object-fit: contain !important;
  filter: none !important;
  transform: none !important;
}
.li-service-logo.pool-logo img { width: 78px !important; height: 78px !important; border-radius: 12px !important; object-fit: cover !important; }
.li-service-logo.pubg-logo img { width: 78px !important; height: 78px !important; }
.li-service-logo.ai-openai-logo img { width: 78px !important; height: 78px !important; }
.li-service-copy { min-width: 0 !important; display: block !important; }
.li-service-copy b {
  display: block !important;
  color: #ffffff !important;
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.012em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-shadow: none !important;
}
.li-service-copy small {
  display: block !important;
  margin-top: 4px !important;
  color: #94a3b8 !important;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.005em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.li-service-copy em {
  display: block !important;
  margin-top: 5px !important;
  color: #38bdf8 !important;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 11.5px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.li-service-arrow {
  color: rgba(220,248,255,.62) !important;
  font-size: 28px !important;
  line-height: 1 !important;
  text-align: right !important;
  text-shadow: none !important;
}

/* ---------- Catalog: no outer offer shell ---------- */
.offer-box {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  outline: 0 !important;
}
#gameGrid .game[data-game="8ballpool"] { display: none !important; }
#games:has(#gameGrid .game:not([data-game="8ballpool"])) { display: block; }
#games:not(:has(#gameGrid .game:not([data-game="8ballpool"]))) { display: none !important; }

/* ---------- Support: compact branded panel on the catalog page ---------- */
#support .support-box {
  border: 0 !important;
  border-radius: 17px !important;
  background: linear-gradient(135deg,#0e2a36,#102b30 58%,#10241f) !important;
  box-shadow: none !important;
  padding: 14px 16px !important;
}
#support .support-copy strong {
  color: #f4fbff !important;
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 17px !important;
}
#support .support-copy span { color: #92adb9 !important; font-size: 10px !important; }
#support .support-actions { gap: 8px !important; }
#support .support-btn {
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 11px !important;
  min-height: 34px !important;
  padding: 0 12px !important;
}

/* ---------- Footer: large clean line-by-line links, no containers ---------- */
.site-footer {
  padding: 12px 16px 18px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.footer-legal-card,
.footer-legal-heading,
.footer-legal-nav,
.footer-legal-btn,
.footer-legal-icon {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.footer-legal-card { width: min(760px,100%) !important; margin: 0 auto !important; padding: 0 !important; }
.footer-legal-heading { display: none !important; }
.footer-legal-nav { display: grid !important; grid-template-columns: 1fr !important; gap: 0 !important; }
.footer-legal-btn {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 58px !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(85,170,210,.10) !important;
  text-decoration: none !important;
}
.footer-legal-btn:last-child { border-bottom: 0 !important; }
.footer-legal-icon { display: none !important; }
.footer-legal-btn b {
  display: block !important;
  color: #eefaff !important;
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}
.footer-legal-btn small {
  display: block !important;
  margin-top: 4px !important;
  color: #8fa7b6 !important;
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 10px !important;
  line-height: 1.25 !important;
}
.footer-legal-btn i { color: #70d9ff !important; font-size: 20px !important; font-style: normal !important; }
.foot {
  max-width: 760px !important;
  margin: 4px auto 0 !important;
  padding-top: 10px !important;
  border-top: 0 !important;
  color: #667f90 !important;
  font-size: 10px !important;
  text-align: center !important;
}

@media (max-width:1100px) {
  .li-service-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:700px) {
  header.top { min-height: 58px !important; height: 58px !important; }
  header.top .nav {
    width: calc(100% - 14px) !important;
    height: 58px !important;
    min-height: 58px !important;
    gap: 6px !important;
  }
  header.top .actions,
  header.top .header-actions { gap: 6px !important; }
  header.top .nav-search-btn,
  header.top .profile-nav,
  header.top .cart-nav { width: 35px !important; height: 35px !important; min-width: 35px !important; }
  header.top .nav-search-icon,
  header.top .cart-icon-v15 { width: 31px !important; height: 31px !important; }
  header.top .nav-search-icon svg,
  header.top .cart-icon-v15 svg { width: 17px !important; height: 17px !important; }
  header.top .nav-avatar { width: 31px !important; height: 31px !important; font-size: 13px !important; }
  header.top .cart-count { min-width: 14px !important; height: 14px !important; font-size: 6.5px !important; }
  header.top .brand-logo { max-width: 96px !important; }

  .li-service-home { padding: 4px 9px 20px !important; }
  .li-service-header { margin-bottom: 10px !important; }
  .li-service-header h1 {
    font-size: clamp(19px, 6vw, 23px) !important;
    line-height: 1 !important;
    letter-spacing: -0.015em !important;
    white-space: nowrap !important;
  }
  .li-service-header h1::after { width: 155px !important; height: 2px !important; margin-top: 6px !important; }

  .li-service-grid { grid-template-columns: 1fr !important; gap: 9px !important; }
  .li-service-card,
  .li-service-card:hover {
    min-height: 98px !important;
    grid-template-columns: 76px minmax(0,1fr) !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 16px !important;
  }
  .li-service-logo { width: 76px !important; height: 76px !important; }
  .li-service-logo img { width: 64px !important; height: 64px !important; }
  .li-service-logo.pool-logo img { width: 69px !important; height: 69px !important; border-radius: 11px !important; }
  .li-service-logo.pubg-logo img,
.li-service-logo.ai-openai-logo img { width: 69px !important; height: 69px !important; }
.li-service-copy b { font-size: 16px !important; }
  .li-service-copy small { margin-top: 4px !important; font-size: 10px !important; }
  .li-service-copy em { margin-top: 5px !important; font-size: 9.5px !important; }
  .li-service-arrow { display: none !important; }

  #support .support-box { padding: 13px 14px !important; border-radius: 15px !important; }
  #support .support-copy strong { font-size: 15px !important; }
  #support .support-copy span { font-size: 9px !important; }
  #support .support-btn { min-height: 32px !important; font-size: 9px !important; padding: 0 10px !important; }

  .site-footer { padding: 10px 15px 14px !important; }
  .footer-legal-btn { min-height: 62px !important; padding: 10px 0 !important; }
  .footer-legal-btn b { font-size: 17px !important; }
  .footer-legal-btn small { font-size: 10px !important; }
  .footer-legal-btn i { font-size: 19px !important; }
  .foot { font-size: 9px !important; }
}

/* ================================================================
   V16 PREMIUM POLISH — mobile-first refinement
   ================================================================ */
:root {
  --li-surface-1: rgba(255,255,255,.055);
  --li-surface-2: rgba(255,255,255,.018);
  --li-border: rgba(142,210,255,.10);
}

/* Cleaner, more expensive-looking header */
header.top {
  min-height: 64px !important;
  height: 64px !important;
  background: linear-gradient(180deg, rgba(3,10,17,.92), rgba(3,10,17,.54)) !important;
  border-bottom: 1px solid rgba(109,184,229,.055) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
header.top .nav {
  height: 64px !important;
  min-height: 64px !important;
}
header.top .brand-logo {
  transform: translateZ(0);
}
header.top .nav-search-btn,
header.top .profile-nav,
header.top .cart-nav {
  transition: transform .18s ease, opacity .18s ease !important;
}
header.top .nav-search-icon,
header.top .cart-icon-v15,
header.top .nav-avatar {
  transition: box-shadow .18s ease, transform .18s ease, filter .18s ease !important;
}
header.top .nav-search-btn:active,
header.top .profile-nav:active,
header.top .cart-nav:active {
  transform: scale(.96) !important;
}

/* Premium heading rhythm */
.li-service-home {
  padding: 9px 16px 30px !important;
}
.li-service-header {
  margin: 0 0 15px !important;
}
.li-service-header h1 {
  font-size: clamp(25px, 3.15vw, 44px) !important;
  letter-spacing: -0.015em !important;
  line-height: 1.02 !important;
}
.li-service-header h1::after {
  width: min(210px, 27vw) !important;
  margin-top: 8px !important;
  opacity: .9;
}

/* Cards: subtle depth + cleaner proportions without changing the brand system */
.li-service-grid {
  gap: 12px !important;
}
.li-service-card,
.li-service-card:hover {
  isolation: isolate !important;
  min-height: 116px !important;
  grid-template-columns: 72px minmax(0,1fr) 18px !important;
  gap: 13px !important;
  padding: 12px 15px !important;
  border: 1px solid var(--li-border) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045) !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}
.li-service-card::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background: linear-gradient(115deg, rgba(255,255,255,.045), transparent 34%, transparent 72%, rgba(255,255,255,.018)) !important;
}
.li-service-card::after {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  width: 86px !important;
  height: 86px !important;
  right: -36px !important;
  top: -42px !important;
  border-radius: 50% !important;
  background: rgba(103,218,255,.055) !important;
  filter: none !important;
  pointer-events: none !important;
  z-index: -1 !important;
  display: none !important;
}
.li-service-card:hover {
  transform: translateY(-1px) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.li-service-card:active {
  transform: translateY(0) scale(.995) !important;
}

.li-service-logo {
  width: 72px !important;
  height: 72px !important;
}
.li-service-logo img {
  width: 60px !important;
  height: 60px !important;
  filter: none !important;
}
.li-service-logo.pool-logo img,
.li-service-logo.pubg-logo img,
.li-service-logo.ai-openai-logo img {
  width: 63px !important;
  height: 63px !important;
}
.li-service-copy b {
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.012em !important;
  color: #ffffff !important;
}
.li-service-copy small {
  margin-top: 4px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.005em !important;
  color: #94a3b8 !important;
}
.li-service-copy em {
  margin-top: 5px !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  color: #38bdf8 !important;
}
.li-service-arrow {
  display: block !important;
  align-self: center !important;
  color: rgba(190,237,255,.76) !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  transform: translateX(1px) !important;
}

/* Gentle brand-specific glow, kept intentionally restrained */
.service-youtube::after { background: rgba(255,52,67,.045) !important; }
.service-meta::after { background: rgba(34,143,255,.06) !important; }
.service-vpn::after { background: rgba(122,93,255,.06) !important; }
.service-chatgpt::after { background: rgba(78,238,178,.055) !important; }
.service-8ball::after { background: rgba(74,178,255,.055) !important; }

/* Footer finishes like a product site rather than a utility page */
.site-footer {
  padding: 14px 16px 20px !important;
}
.footer-legal-nav {
  border-top: 1px solid rgba(100,164,198,.07) !important;
}
.footer-legal-btn {
  min-height: 56px !important;
}
.footer-legal-btn b { letter-spacing: -.02em !important; }
.footer-legal-btn i { opacity: .82 !important; }
.foot {
  padding-top: 12px !important;
  color: rgba(121,147,164,.78) !important;
}

@media (max-width: 700px) {
  header.top {
    min-height: 60px !important;
    height: 60px !important;
  }
  header.top .nav {
    height: 60px !important;
    min-height: 60px !important;
    width: calc(100% - 14px) !important;
  }
  header.top .brand-logo { max-width: 92px !important; }
  header.top .nav-search-btn,
  header.top .profile-nav,
  header.top .cart-nav {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
  }
  header.top .nav-search-icon,
  header.top .cart-icon-v15 {
    width: 30px !important;
    height: 30px !important;
  }
  header.top .nav-avatar {
    width: 30px !important;
    height: 30px !important;
  }

  .li-service-home {
    padding: 5px 9px 18px !important;
  }
  .li-service-header {
    margin-bottom: 11px !important;
  }
  .li-service-header h1 {
    font-size: clamp(20px, 5.85vw, 24px) !important;
    line-height: 1.02 !important;
  }
  .li-service-header h1::after {
    width: 148px !important;
    height: 2px !important;
    margin-top: 6px !important;
  }
  .li-service-grid { gap: 8px !important; }
  .li-service-card,
  .li-service-card:hover {
    min-height: 105px !important;
    grid-template-columns: 66px minmax(0,1fr) 16px !important;
    gap: 11px !important;
    padding: 9px 12px !important;
    border-radius: 15px !important;
  }
  .li-service-logo {
    width: 66px !important;
    height: 66px !important;
  }
  .li-service-logo img {
    width: 55px !important;
    height: 55px !important;
  }
  .li-service-logo.pool-logo img,
  .li-service-logo.pubg-logo img,
  .li-service-logo.ai-openai-logo img {
    width: 58px !important;
    height: 58px !important;
  }
.li-service-copy b {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;
    color: #ffffff !important;
  }
  .li-service-copy small {
    margin-top: 3px !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    color: #94a3b8 !important;
  }
  .li-service-copy em {
    margin-top: 4px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    color: #38bdf8 !important;
  }
  .li-service-arrow {
    display: block !important;
    font-size: 21px !important;
    color: rgba(188,234,255,.66) !important;
  }
  .site-footer {
    padding: 9px 15px 14px !important;
  }
  .footer-legal-btn {
    min-height: 58px !important;
    padding: 9px 0 !important;
  }
  .footer-legal-btn b { font-size: 16px !important; }
  .footer-legal-btn small { font-size: 9.5px !important; }
  .footer-legal-btn i { font-size: 18px !important; }
  .foot { font-size: 9px !important; }
}

@media (max-width: 420px) {
  header.top .brand-logo { max-width: 86px !important; }
  header.top .actions,
  header.top .header-actions { gap: 4px !important; }
  .li-service-card,
  .li-service-card:hover {
    grid-template-columns: 61px minmax(0,1fr) 14px !important;
    gap: 9px !important;
    min-height: 101px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .li-service-logo { width: 61px !important; height: 61px !important; }
  .li-service-logo img { width: 51px !important; height: 51px !important; }
  .li-service-logo.pool-logo img,
  .li-service-logo.pubg-logo img,
  .li-service-logo.ai-openai-logo img { width: 54px !important; height: 54px !important; }
  .li-service-copy b { font-size: 15px !important; font-weight: 700 !important; line-height: 1.25 !important; }
  .li-service-copy small { font-size: 11px !important; font-weight: 500 !important; line-height: 1.3 !important; }
  .li-service-copy em { font-size: 10.5px !important; font-weight: 600 !important; line-height: 1.3 !important; }
}



/* ================================================================
   V46 — DESKTOP-ONLY HEADER + FULL-WIDTH OFFER AREAS
   Mobile header/layout intentionally kept from V41.
   ================================================================ */
@media (min-width: 701px) {
  /* Header: true full-width desktop bar. */
  header.top .nav {
    width: 100vw !important;
    max-width: none !important;
    height: 66px !important;
    min-height: 66px !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
  }

  header.top .brand {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  header.top .brand-logo {
    width: auto !important;
    max-width: 104px !important;
    margin: 0 !important;
  }

  header.top .navlinks {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
    white-space: nowrap !important;
  }

  header.top .actions,
  header.top .header-actions {
    margin-left: auto !important;
    margin-right: 0 !important;
    padding: 0 !important;
    gap: 8px !important;
    display: flex !important;
    align-items: center !important;
  }

  /* Search: wide, flat, no circular shell or ring. */
  header.top .nav-search-btn {
    width: 128px !important;
    min-width: 128px !important;
    height: 40px !important;
    padding: 0 8px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
  }

  header.top .nav-search-icon {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  header.top .nav-search-icon svg {
    width: 21px !important;
    height: 21px !important;
  }

  header.top .nav-search-label {
    display: inline !important;
    color: #dcecff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
  }

  /* Profile + cart: matched size, no outer ring/border. */
  header.top .profile-nav,
  header.top .cart-nav {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    display: grid !important;
    place-items: center !important;
  }

  header.top .nav-avatar {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  header.top .cart-icon-v15 {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: grid !important;
    place-items: center !important;
  }

  header.top .cart-icon-v15 svg {
    width: 28px !important;
    height: 28px !important;
    filter: none !important;
  }

  /* Desktop: let the offer areas use the full monitor width.
     The hero itself intentionally stays centered/compact. */
  .selected-offers-section,
  #offers {
    width: calc(100vw - 28px) !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw + 14px) !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  #heroHighlights.selected-offers,
  #offerGrid.offers {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #offerGrid.offers {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: start !important;
  }
}

/* V46 mobile restoration: keep the V41 mobile header exactly isolated. */
@media (max-width: 700px) {
  header.top .nav {
    width: calc(100% - 14px) !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  header.top .nav-search-btn,
  header.top .profile-nav,
  header.top .cart-nav {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 50% !important;
  }

  header.top .nav-search-icon,
  header.top .cart-icon-v15 {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
  }

  header.top .nav-search-icon {
    background: radial-gradient(circle at 34% 28%, rgba(94,222,255,.23), rgba(38,108,170,.10) 62%, rgba(0,0,0,0) 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(94,214,255,.22) !important;
  }

  header.top .cart-icon-v15 {
    background: radial-gradient(circle at 35% 28%, rgba(92,255,202,.19), rgba(17,111,93,.11) 62%, rgba(0,0,0,0) 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(79,232,183,.20) !important;
  }

  header.top .nav-avatar {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    border: 1px solid rgba(78,204,255,.28) !important;
    background: radial-gradient(circle at 35% 28%, #56bff2, #1b67b5 68%, #12436f 100%) !important;
    box-shadow: none !important;
  }

  header.top .nav-search-label,
  header.top .profile-nav-text {
    display: none !important;
  }
}

/* ================================================================
   USER REQUESTED OVERRIDES (DESKTOP & MOBILE FIXES)
   ================================================================ */

/* MOBILE FIXES */
@media (max-width: 700px) {
  /* Remove 8 ball pool, games, offers text on mobile */
  header.top .navlinks {
    display: none !important;
  }
  
  /* Fix header so Profile, Search, Cart show up correctly on the right */
  header.top .nav {
    display: flex !important;
    justify-content: space-between !important;
  }
  
  header.top .brand {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  
  header.top .actions,
  header.top .header-actions {
    display: flex !important;
    flex: 0 0 auto !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
}
/* GLOBAL HEADER 3D BUTTON STYLES (Mobile + Desktop) */
header.top .nav-search-btn,
header.top .profile-nav,
header.top .cart-nav {
  background: linear-gradient(135deg, #1f2e3d 0%, #0d1722 100%) !important;
  box-shadow: 
    none !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  transform: perspective(200px) translateZ(0) !important;
  transition: all 0.2s ease !important;
  border-radius: 14px !important;
}

header.top .nav-search-btn:hover,
header.top .profile-nav:hover,
header.top .cart-nav:hover {
  transform: perspective(200px) translateZ(6px) scale(1.03) !important;
  box-shadow: 
    none !important;
}

/* Adjust inner elements to fit the new 3D buttons cleanly */
header.top .nav-search-icon,
header.top .cart-icon-v15,
header.top .nav-avatar {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* MOBILE FIXES */
@media (max-width: 700px) {
  /* Re-enable slider transition on mobile */
  #pool.hero .hero-slide {
    transition: opacity .5s ease-in-out !important;
    visibility: visible !important;
    display: block !important;
    transform: none !important;
    animation: none !important;
  }
  #pool.hero .hero-slide.active {
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 2 !important;
  }
  #pool.hero .hero-slide:not(.active) {
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  /* Nudge header elements upward */
  header.top .brand-logo,
  header.top .actions,
  header.top .header-actions {
    transform: translateY(-4px) !important;
  }

  /* Adjust sizes for mobile 3D buttons */
  header.top .profile-nav,
  header.top .cart-nav {
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
  }
  header.top .nav-search-btn {
    height: 38px !important;
    border-radius: 10px !important;
  }
}

/* DESKTOP FIXES */
@media (min-width: 701px) {
  /* Expand the main wrapper to take the full screen width with a small gap */
  body main > .wrap,
  .wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 60px !important;
    padding-right: 60px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Make header navigation span the full expanded wrapper */
  body header.top .wrap.nav,
  header.top .nav {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 60px !important;
    box-sizing: border-box !important;
  }

  /* Bring Search, Profile, Cart to the absolute far right and increase gap */
  header.top .actions,
  header.top .header-actions {
    margin-right: 0 !important;
    margin-left: auto !important;
    gap: 16px !important;
  }

  /* Give Profile and Cart Navs matching square-ish shapes for balance */
  header.top .profile-nav,
  header.top .cart-nav {
    width: 48px !important;
    height: 48px !important;
  }

  /* Make Search Offer wider */
  header.top .nav-search-btn {
    width: 175px !important;
    min-width: 175px !important;
    height: 48px !important;
  }
  
  /* Remove negative margin hacks as .wrap now handles the spacing naturally */
  .selected-offers-section,
  #offers {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  
  body .selected-offers-section::before,
  body .selected-offers-section::after,
  body #heroHighlights::before,
  body #heroHighlights::after,
  body #offers::before,
  body #offers::after,
  body #heroHighlights .offer::before,
  body #heroHighlights .offer::after,
  body #offers .offer::before,
  body #offers .offer::after {
    display: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* NEW OFFER PRICE 3D LAYOUT (Inline for all devices) */
body #heroHighlights .offer-price-row,
body #offers .offer-price-row,
body .offer-price-row {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  flex-wrap: nowrap !important;
  margin-top: 1px !important;
}

/* Remove crazy price background layers from styles.css */
body #heroHighlights .offer-price-row .price::before,
body #heroHighlights .offer-price-row .price::after,
body #offers .offer-price-row .price::before,
body #offers .offer-price-row .price::after {
  display: none !important;
}

/* 3D styling for main price */
body #heroHighlights .offer-price-row .price,
body #offers .offer-price-row .price,
body .offer-price-row .price {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #fff !important;
  padding: 3px 8px !important;
  background: linear-gradient(135deg, #0e8538, #053b17) !important;
  box-shadow: 
    none !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  display: inline-block !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
  -webkit-background-clip: padding-box !important;
}

/* 3D styling for old price */
body #heroHighlights .offer-price-row .old,
body #offers .offer-price-row .old,
body .offer-price-row .old {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #ff9b9b !important;
  padding: 2px 5px !important;
  background: linear-gradient(135deg, #421b1b, #210d0d) !important;
  box-shadow: 
    none !important;
  border-radius: 6px !important;
  text-decoration: line-through !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  display: inline-block !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
}

/* 3D styling for discount percentage */
body #heroHighlights .offer-price-row .discount-badge,
body #offers .offer-price-row .discount-badge,
body .offer-price-row .discount-badge {
  font-size: 10px !important;
  font-weight: 800 !important;
  color: #fff !important;
  padding: 2px 5px !important;
  background: linear-gradient(135deg, #ff002f, #94001b) !important;
  box-shadow: 
    none !important;
  border-radius: 6px !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  display: inline-block !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  text-shadow: none !important;
}

/* Make offer names slightly bigger and reduce space below image */
body #heroHighlights .offer-body,
body #offers .offer-body,
body .offer-body,
html body #offerGrid .offer .offer-body,
html body #offerGrid .premium-offer .offer-body,
html body #offerGrid .vip-offer-card .offer-body {
  padding: 4px 6px 4px 6px !important;
  background: radial-gradient(ellipse at center top, rgba(90, 170, 255, 0.12) 0%, transparent 60%),
              linear-gradient(180deg, rgba(16, 25, 38, 0.1) 0%, rgba(8, 14, 25, 0.6) 100%) !important;
  position: relative !important;
  border-top: none !important;
  border-radius: 0 0 14px 14px !important;
  box-shadow: none !important;
}
body #heroHighlights .offer-body::before,
body #offers .offer-body::before,
body .offer-body::before,
html body #offerGrid .offer .offer-body::before,
html body #offerGrid .premium-offer .offer-body::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important; left: 10% !important; right: 10% !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.15) 50%, transparent 100%) !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
body #heroHighlights .offer-body h3,
body #offers .offer-body h3,
body .offer-body h3 {
  font-size: 18px !important;
  margin: 0 0 1px 0 !important;
  line-height: 1.25 !important;
  color: #e8f4ff !important;
  text-shadow: none !important;
}
body #heroHighlights .offer-media-wrap,
body #offers .offer-media-wrap,
body .offer-media-wrap {
  margin-bottom: 0 !important;
}

/* SUPER SPECIFIC OVERRIDES FOR GLOWING LIGHTS */
html body #offerGrid .offer,
html body #offerGrid .premium-offer,
html body #offerGrid .vip-offer-card,
html body #heroHighlights .offer,
html body #heroHighlights .premium-offer,
html body #heroHighlights .vip-offer-card,
html body .selected-offer-card,
html body .offer {
  box-shadow: none !important;
  background: linear-gradient(155deg, rgba(25, 38, 55, 0.8) 0%, rgba(8, 14, 22, 0.95) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body #offerGrid .offer:hover,
html body #offerGrid .premium-offer:hover,
html body #offerGrid .vip-offer-card:hover,
html body #heroHighlights .offer:hover,
html body #heroHighlights .premium-offer:hover,
html body #heroHighlights .vip-offer-card:hover,
html body .selected-offer-card:hover,
html body .offer:hover {
  box-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  transform: translateY(-4px) translateZ(0) perspective(800px) !important;
}

html body #offerGrid .offer::before,
html body #offerGrid .offer::after,
html body #heroHighlights .offer::before,
html body #heroHighlights .offer::after,
html body .offer::before,
html body .offer::after {
  display: none !important;
  background: none !important;
  box-shadow: none !important;
  opacity: 0 !important;
}