/* Slotexo Italia - small additions loaded after style.css */

/* Back-to-top button (injected by /assets/js/site.js).
   Colours: --panel (#10202b, header) and --accent (#c6f432, lime). */
.scroll-top{
  position:fixed;
  right:16px;
  /* below 1024px the fixed .bottom nav bar (~56px + safe area) occupies the bottom edge */
  bottom:calc(72px + env(safe-area-inset-bottom, 0px));
  z-index:40; /* above .top (20) and .bottom (30), below .skip (99) */
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  padding:0;
  margin:0;
  border:2px solid #c6f432;
  border:2px solid var(--accent, #c6f432);
  border-radius:50%;
  background:#10202b;
  background:var(--panel, #10202b);
  color:#fff;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.4);
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:opacity .2s ease, transform .2s ease, visibility 0s linear .2s, background-color .15s ease, color .15s ease;
  -webkit-tap-highlight-color:transparent;
}
.scroll-top.is-visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  transition:opacity .2s ease, transform .2s ease, visibility 0s linear 0s, background-color .15s ease, color .15s ease;
}
.scroll-top svg{width:22px;height:22px;display:block;pointer-events:none}
.scroll-top:hover,
.scroll-top:focus-visible{
  background:#c6f432;
  background:var(--accent, #c6f432);
  color:#10202b;
  color:var(--panel, #10202b);
}
.scroll-top:focus{outline:none}
.scroll-top:focus-visible{
  outline:3px solid #fff;
  outline-offset:3px;
  border-radius:50%;
}

@media (min-width:768px){
  .scroll-top{right:20px;width:48px;height:48px}
  .scroll-top svg{width:24px;height:24px}
}
@media (min-width:1024px){
  /* .bottom nav is hidden from here up */
  .scroll-top{bottom:20px}
}
@media (prefers-reduced-motion:reduce){
  .scroll-top,
  .scroll-top.is-visible{transition:none;transform:none}
}

/* Home hero background (assets/img/background-main.webp) */
.hero-main{
  background:
    radial-gradient(70% 90% at 50% 50%, rgba(11,24,32,.82) 0%, rgba(11,24,32,.55) 60%, rgba(11,24,32,.35) 100%),
    url(/assets/img/background-main.webp) center/cover no-repeat,
    var(--bg, #0b1820);
}
.hero-main::before{display:none}

/* Game artwork (400x600 tiles) */
.game{margin:0}
img.thumb{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;padding:0;background:var(--card, #142633)}
.game figcaption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-grid{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.game-grid.is-collapsed>li:nth-child(n+13){display:none}
.grid-more{margin-top:14px}
@media (min-width:768px){.game-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1024px){.game-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* Promotion banners (2:1) */
.promo-img,.tile-img{display:block;width:100%;height:auto;aspect-ratio:2/1;object-fit:cover;border-radius:10px;background:var(--card-2, #183040)}
.promo-img{margin:10px 0 16px}
.tile-img{margin:0 0 14px;border-radius:8px}

/* Screenshots */
.shot{margin:18px 0 22px}
.shot img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--line, #1f3644)}
.shot figcaption{font-size:13px;color:var(--muted, #93a7b2);margin-top:6px}
.shot-phone{max-width:260px;margin-left:auto;margin-right:auto;text-align:center}
.shot-phone img{border:0}

/* Payment logos */
.pay-logos{display:inline-flex;gap:6px;vertical-align:middle;margin-left:6px}
.pay-logos img{height:18px;width:auto}