/* =====================================================
   INLINE SVG BACKGROUNDS & DECORATIVE IMAGES
   Rio Ace Casino PT
   ===================================================== */

/* Hero decorative card element */
.deco-card-float{
  background:var(--bg-card);
  border:1px solid var(--bdr-green);
  border-radius:var(--r-xl);
  padding:1.5rem;
  box-shadow:var(--shadow-green);
  position:relative;
  overflow:hidden;
}
.deco-card-float::after{
  content:'';
  position:absolute;
  width:200px;height:200px;
  background:radial-gradient(circle,var(--green-glow) 0%,transparent 70%);
  top:-60px;right:-60px;
  pointer-events:none;
}

/* Grid pattern background */
.bg-grid{
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:40px 40px;
}

/* Glowing orbs behind sections */
.orb-bg{position:relative;overflow:hidden}
.orb-bg::before,.orb-bg::after{
  content:'';
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  z-index:0;
}
.orb-bg::before{
  width:600px;height:600px;
  background:radial-gradient(circle,rgba(142,169,255,.06) 0%,transparent 70%);
  top:-150px;left:-150px;
}
.orb-bg::after{
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(26,111,255,.05) 0%,transparent 70%);
  bottom:-100px;right:-100px;
}
.orb-bg .container{position:relative;z-index:1}

/* Noise texture overlay */
.noise::before{
  content:'';
  position:absolute;
  inset:0;
  opacity:.02;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:10;
}

/* Slot machine SVG placeholder */
.slot-visual{
  width:100%;
  max-width:320px;
  aspect-ratio:1;
  margin:0 auto;
}

/* Provider logo placeholder */
.provider-logo-box{
  width:100%;
  aspect-ratio:3/1;
  background:var(--bg-secondary);
  border:1px solid var(--bdr);
  border-radius:var(--r-md);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.8rem;
  font-weight:700;
  color:var(--text-3);
  letter-spacing:.06em;
}

/* Gradient card to use for featured items */
.gradient-card-green{
  background:linear-gradient(135deg,var(--bg-card) 0%,rgba(142,169,255,.08) 100%);
  border:1px solid var(--bdr-green);
  border-radius:var(--r-lg);
  padding:1.5rem;
}
.gradient-card-gold{
  background:linear-gradient(135deg,var(--bg-card) 0%,rgba(215,180,106,.08) 100%);
  border:1px solid var(--bdr-gold);
  border-radius:var(--r-lg);
  padding:1.5rem;
}
.gradient-card-blue{
  background:linear-gradient(135deg,var(--bg-card) 0%,rgba(142,169,255,.12) 100%);
  border:1px solid var(--bdr-blue);
  border-radius:var(--r-lg);
  padding:1.5rem;
}

/* Full-width video/promo placeholder */
.media-placeholder{
  width:100%;
  aspect-ratio:16/7;
  background:var(--bg-secondary);
  border:1px solid var(--bdr);
  border-radius:var(--r-xl);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1rem;
  color:var(--text-3);
  font-size:.85rem;
  overflow:hidden;
  position:relative;
}
.media-placeholder::before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse 60% 60% at 50% 50%,rgba(142,169,255,.06) 0%,transparent 100%);
}

/* Leaderboard rank styles */
.rank-1 .rank-num{color:var(--gold);text-shadow:0 0 12px var(--gold-glow)}
.rank-2 .rank-num{color:#c0c0c0}
.rank-3 .rank-num{color:#cd7f32}
.rank-num{font-size:1rem;font-weight:900;width:2rem;text-align:center}

/* Tournament card */
.tournament-card{
  background:var(--bg-card);
  border:1px solid var(--bdr);
  border-radius:var(--r-lg);
  overflow:hidden;
  transition:all var(--t-mid);
}
.tournament-card:hover{border-color:var(--bdr-gold);box-shadow:var(--shadow-gold)}
.tournament-card-header{
  background:linear-gradient(135deg,rgba(215,180,106,.1),rgba(142,169,255,.08));
  padding:1.25rem 1.5rem;
  border-bottom:1px solid var(--bdr);
}
.tournament-card-body{padding:1.25rem 1.5rem}

/* Progress bar */
.progress-wrap{margin-bottom:.4rem}
.progress-label{display:flex;justify-content:space-between;font-size:.75rem;color:var(--text-3);margin-bottom:.35rem}
.progress-bar{height:6px;background:var(--bg-secondary);border-radius:var(--r-full);overflow:hidden}
.progress-fill{height:100%;border-radius:var(--r-full);background:linear-gradient(90deg,var(--green-dk),var(--green));transition:width 1s ease}

/* Countdown */
.countdown-row{display:flex;gap:1rem;flex-wrap:wrap}
.countdown-unit{text-align:center;background:var(--bg-secondary);border:1px solid var(--bdr);border-radius:var(--r-md);padding:.6rem .8rem;min-width:64px}
.countdown-num{font-size:1.6rem;font-weight:900;color:var(--text-1);display:block;line-height:1;font-variant-numeric:tabular-nums}
.countdown-lbl{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-3);margin-top:.2rem;display:block}

/* VIP levels visual */
.vip-strip{display:flex;gap:.5rem;overflow-x:auto;padding:.25rem 0;scrollbar-width:none}
.vip-strip::-webkit-scrollbar{display:none}
.vip-level{background:var(--bg-secondary);border:1px solid var(--bdr);border-radius:var(--r-md);padding:.5rem .75rem;text-align:center;flex-shrink:0;min-width:60px;transition:all var(--t-fast)}
.vip-level.active,.vip-level:hover{border-color:var(--bdr-gold);background:rgba(215,180,106,.06)}
.vip-level .lvl-num{font-size:.7rem;color:var(--text-4);display:block}
.vip-level .lvl-name{font-size:.72rem;font-weight:700;color:var(--gold);display:block;margin-top:.2rem}

/* App feature icon row */
.app-features-row{display:flex;gap:1rem;flex-wrap:wrap}
.app-feature{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center;flex:1;min-width:100px}
.app-feature-icon{width:52px;height:52px;background:var(--green-glow);border:1px solid var(--bdr-green);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center}
.app-feature-icon svg{width:24px;height:24px;color:var(--green)}
.app-feature span{font-size:.78rem;color:var(--text-2);font-weight:500}

/* Payment method big card */
.pay-method-card{
  background:var(--bg-card);
  border:1px solid var(--bdr);
  border-radius:var(--r-lg);
  padding:1.25rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.75rem;
  text-align:center;
  transition:all var(--t-mid);
}
.pay-method-card:hover{border-color:var(--bdr-green);transform:translateY(-3px)}
.pay-method-icon{width:56px;height:40px;display:flex;align-items:center;justify-content:center}
.pay-method-icon svg{width:40px;height:28px}
.pay-method-name{font-size:.875rem;font-weight:700;color:var(--text-1)}
.pay-method-time{font-size:.75rem;color:var(--green)}
.pay-method-limit{font-size:.72rem;color:var(--text-3)}

/* Responsive images section */
@media(max-width:768px){
  .media-placeholder{aspect-ratio:16/9}
  .app-features-row{gap:.75rem}
  .countdown-unit{min-width:52px;padding:.5rem .6rem}
  .countdown-num{font-size:1.3rem}
}
@media(max-width:480px){
  .tournament-card-header,.tournament-card-body{padding:1rem}
  .app-feature{min-width:80px}
  .countdown-row{gap:.5rem}
  .countdown-wrap{gap:.5rem}
}

/* ── Missing class aliases (countdown-wrap / countdown-label / page-hero-stats) ── */
.countdown-wrap{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;justify-content:center}
.countdown-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-3);margin-top:.2rem;display:block}
.countdown-sep{font-size:1.6rem;font-weight:900;color:var(--text-3);align-self:flex-start;padding-top:.4rem;line-height:1}

.page-hero-stats{display:flex;gap:2rem;flex-wrap:wrap;margin-top:1.5rem}
.page-hero-stats .stat-num{font-size:1.8rem;font-weight:900;color:var(--green);display:block;line-height:1}
.page-hero-stats .stat-lbl{font-size:.7rem;text-transform:uppercase;letter-spacing:.07em;color:var(--text-3);margin-top:.25rem;display:block}

/* ── Content article images (like granawin) ── */
.article-img{display:block;width:100%;max-width:780px;height:auto;border-radius:var(--r-lg);margin:2rem auto;object-fit:cover;box-shadow:0 4px 24px rgba(0,0,0,.45)}
.img-caption{text-align:center;font-size:.8rem;color:var(--text-3);margin:-1rem auto 2rem;max-width:600px;line-height:1.5}
@media(max-width:768px){.page-hero-stats{gap:1.25rem}.page-hero-stats .stat-num{font-size:1.4rem}}
@media(max-width:480px){.page-hero-stats{gap:1rem}.page-hero-stats .stat-num{font-size:1.2rem}}

/* ── Feature card cover photo ─────────────────────────────────────── */
.feature-card.has-img{padding:0 0 1.5rem;overflow:hidden}
.feature-card.has-img > :not(.feature-card-img){margin-left:1.5rem;margin-right:1.5rem}
.feature-card.has-img .badge{align-self:flex-start;margin-top:auto}
.feature-card-img{width:100%;margin:0 0 1rem;aspect-ratio:16/10;overflow:hidden;flex-shrink:0;background:var(--bg-secondary);border-bottom:1px solid var(--bdr)}
.feature-card-img img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .5s ease}
.feature-card:hover .feature-card-img img{transform:scale(1.04)}

/* ── Page hero image (inner pages) ─────────────────────────────────── */
.page-hero-img{margin:2rem auto 0;border-radius:var(--r-lg);overflow:hidden;max-width:980px;width:100%;aspect-ratio:16/9;box-shadow:0 8px 40px rgba(0,0,0,.55)}
.page-hero-img img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
@media(max-width:768px){.page-hero-img{margin-top:1.5rem;max-width:100%}.feature-card.has-img{padding-bottom:1.25rem}.feature-card.has-img > :not(.feature-card-img){margin-left:1.25rem;margin-right:1.25rem}}
@media(max-width:480px){.feature-card.has-img > :not(.feature-card-img){margin-left:1rem;margin-right:1rem}}