@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;900&family=Outfit:wght@400;500;600;700;800;900&display=swap");

/* ═══════════════════════════════════════════════════
   DARK · WARM · FANCY — Burgundy + Aged Gold
═══════════════════════════════════════════════════ */
:root {
  --d: 3200ms;
  --angle: 90deg;

  /* Aged gold — warm, never bright */
  --gold-1: #c8860a;
  --gold-2: #e5a020;
  --gold-3: #f0c040;
  --gold-4: #f8dfa0;

  /* Burgundy red */
  --red-1:  #7a1010;
  --red-2:  #9e2020;
  --red-3:  #c03030;

  /* Dark warm backgrounds */
  --bg:        #1c0a06;
  --bg2:       #150705;
  --bg3:       #250e08;
  --bg-card:   rgba(32,10,6,.88);
  --bg-panel:  rgba(26,8,4,.82);

  /* Text — warm cream, never cold white */
  --text:      #f0dfc0;
  --text-2:    #d8b888;
  --text-dim:  #a07848;
  --muted:     #806040;

  /* Glass tint */
  --glass-warm:  rgba(30,10,4,.7);
  --glass-gold:  rgba(180,120,20,.15);
  --border-gold: rgba(180,130,20,.28);
  --border-warm: rgba(120,60,20,.35);

  /* Kept for JS */
  --neon-gold:   #c8860a;
  --neon-orange: #cc4400;
  --neon-blue:   #00d4ff;
  --neon-purple: #bf5fff;
  --neon-green:  #39ff85;
  --neon-pink:   #ff3cac;
}

@property --angle { syntax:'<angle>'; initial-value:90deg; inherits:true; }

/* ── KEYFRAMES ── */
@keyframes borderRotate { 100%{ --angle:420deg; } }
@keyframes floatUp    { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
@keyframes shimmerGold{ 0%{background-position:-300% center} 100%{background-position:300% center} }
@keyframes rankPop    { 0%,100%{transform:scale(1)} 50%{transform:scale(1.14)} }
@keyframes countUp    { from{opacity:0;transform:scale(.5)} to{opacity:1;transform:scale(1)} }
@keyframes cardIn     { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
@keyframes btnPulse   {
  0%,100%{ box-shadow:0 3px 14px rgba(122,16,16,.32), 0 0 0 2px rgba(122,16,16,.07); }
  50%    { box-shadow:0 5px 22px rgba(122,16,16,.48), 0 0 0 3px rgba(122,16,16,.11); }
}
@keyframes goldPulse  { 0%,100%{opacity:.55} 50%{opacity:.9} }
@keyframes ldp        { 0%,100%{opacity:1} 50%{opacity:.15;transform:scale(.45)} }
@keyframes pulseRing  { 0%{box-shadow:0 0 0 0 rgba(200,134,10,.45)} 70%{box-shadow:0 0 0 14px rgba(200,134,10,0)} 100%{box-shadow:0 0 0 0 rgba(200,134,10,0)} }
@keyframes pf         { 0%{opacity:.9;transform:scale(1)} 100%{opacity:0;transform:translateY(-100px) translateX(var(--dx)) scale(0)} }

/* ── BASE ── */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:'Outfit', sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{ text-decoration:none; color:inherit; }
ul{ list-style:none; }

/* ── DISCLAIMER ── */
.header-disclamer{
  width:100%; padding:8px 20px;
  text-align:center; font-size:11px; font-weight:500;
  color:rgba(200,160,80,.55);
  background:rgba(10,2,0,.6);
  border-bottom:1px solid rgba(150,90,10,.2);
  letter-spacing:.04em;
}

/* ── BACKGROUND ── */
.background-image{ width:100%; height:100%; }

.background-gradient{
  position:relative; width:100%; overflow:hidden;
  /* Very light warm veil — image dominates, fades to dark bg */
  background:
    linear-gradient(180deg,
      rgba(10,2,0,.0)   0%,
      rgba(10,2,0,.08)  300px,
      rgba(10,2,0,.35)  520px,
      rgba(18,6,2,.8)   700px,
      var(--bg)         880px
    );
}

.bg-orb{ display:none; }
.background-gradient-bottom{ background:var(--bg); width:100%; }

/* ── CONTENT ── */
.content-cover{
  width:100%; max-width:1160px;
  padding:0 20px; box-sizing:border-box;
  margin:0 auto; position:relative; z-index:2;
}

/* ── LOGO ── */
.logo-cover{ width:100%; max-width:180px; padding:16px 0 8px; display:none; }
.logo-cover img{ width:100%; }

/* ── HEADER ── */
.header{ padding-bottom:14px; }
.header::before{
  content:''; display:block; width:100%; height:1px;
  background:linear-gradient(90deg,
    transparent 0%, var(--gold-1) 20%,
    var(--gold-3) 50%, var(--gold-1) 80%, transparent 100%
  );
  animation:goldPulse 4s ease-in-out infinite;
}

.top-headline{
  width:100%; max-width:1080px; padding:34px 16px 0;
  box-sizing:border-box;
  display:flex; justify-content:center; align-items:center; gap:16px;
  margin:0 auto; animation:floatUp .8s ease both;
}
.top-headline h1{
  text-align:center;
  font-family:'Cinzel', serif;
  font-size:40px; font-weight:900;
  letter-spacing:.05em; line-height:1.18;
  color:var(--gold-3);
  text-shadow:
    0 2px 8px rgba(0,0,0,.7),
    0 4px 24px rgba(80,0,0,.5),
    0 0 50px rgba(0,0,0,.4);
  animation:floatUp .8s ease both;
}

.header-flags{
  width:64px; height:64px; border-radius:50%; object-fit:contain; flex-shrink:0;
  border:2px solid rgba(180,130,20,.45);
  box-shadow:0 0 16px rgba(180,130,20,.22), 0 0 40px rgba(60,0,0,.3);
}

.sub-headline{
  width:100%; max-width:740px;
  margin:14px auto 0; padding:6px 20px; box-sizing:border-box;
  color:rgba(245,225,175,.9);
  text-shadow:
    0 1px 3px rgba(0,0,0,.9),
    0 2px 12px rgba(0,0,0,.8),
    0 4px 24px rgba(0,0,0,.6);
  text-align:center; font-size:15px; font-weight:500; line-height:1.72;
  animation:floatUp .8s .1s ease both;
}

/* ── DATE ── */
.highlited-date{
  border-radius:20px;
  border:1px solid rgba(180,130,20,.4);
  background:rgba(20,6,2,.7);
  color:var(--gold-3); font-size:11px; font-weight:700;
  padding:3px 12px; margin:0 8px; letter-spacing:.05em;
  backdrop-filter:blur(6px);
}
.highlited-date-mobile{ display:none; text-align:center; margin:10px auto 5px 0; width:fit-content; min-width:100px; }

/* ── TRUST BAR ── */
.sub-header{
  width:100%; max-width:820px;
  margin:18px auto 0; padding:0; box-sizing:border-box;
  display:flex; justify-content:center; flex-wrap:wrap; gap:8px;
  animation:floatUp .8s .18s ease both;
}
.sub-header li{
  color:var(--text); font-size:12px; font-weight:600;
  display:flex; align-items:center; gap:7px;
  background:rgba(20,6,2,.72);
  border:1px solid var(--border-gold);
  border-radius:40px; padding:7px 16px; white-space:nowrap;
  box-shadow:0 2px 14px rgba(0,0,0,.3), inset 0 1px 0 rgba(200,140,20,.08);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:border-color .2s, background .2s;
}
.sub-header li:hover{
  border-color:rgba(200,150,30,.55);
  background:rgba(35,10,4,.8);
}
.sub-header li img{ opacity:.6; width:15px; height:15px; filter:sepia(.4) saturate(2) hue-rotate(10deg); }

/* ── STATS STRIP ── */
.stats-strip{
  display:flex; justify-content:center; align-items:stretch; flex-wrap:wrap; gap:0;
  width:100%; max-width:820px; margin:20px auto 0;
  border:1px solid var(--border-gold); border-radius:14px; overflow:hidden;
  background:rgba(18,5,2,.78);
  box-shadow:0 4px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(180,130,20,.1);
  animation:floatUp .8s .25s ease both; position:relative;
  backdrop-filter:blur(10px);
}
.stats-strip::before{
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, var(--red-1), var(--gold-2), var(--red-1));
}
.stats-strip-item{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  flex:1; min-width:110px; padding:16px 10px; gap:4px;
  border-right:1px solid rgba(150,90,10,.18);
}
.stats-strip-item:last-child{ border-right:none; }
.stats-strip-item .stat-val{
  font-family:'Cinzel', serif; font-size:20px; font-weight:700;
  color:var(--gold-2); line-height:1;
  text-shadow:0 0 18px rgba(180,120,10,.4);
}
.stats-strip-item .stat-label{
  font-size:10px; font-weight:600; color:var(--text-dim);
  text-transform:uppercase; letter-spacing:.1em;
}

/* ── TABLE HEADER ── */
.table-header-cover{ position:relative; margin:32px auto 0; height:36px; }
.table-header-back{
  width:100%; border-radius:100px;
  background:rgba(18,5,2,.82);
  border:1px solid var(--border-gold);
  height:36px; position:absolute; z-index:1;
  box-shadow:0 2px 14px rgba(0,0,0,.3);
  backdrop-filter:blur(10px);
}
.table-header{
  width:100%; display:flex; justify-content:space-around; align-items:center;
  padding:5px 40px 5px 75px; position:absolute; z-index:2;
}
.table-header h5:first-child{ width:10%; }
.table-header h5{
  color:var(--gold-2); font-family:'Cinzel', serif;
  font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.16em;
}

/* ═══════════════════════════════════════════
   OFFER CARDS — DESKTOP
═══════════════════════════════════════════ */
.offers-cover-desktop{ width:100%; padding:0 0 0 22px; box-sizing:border-box; }

.offer-cover{
  width:100%; height:136px; margin:20px 0 0;
  display:flex; justify-content:space-between; align-items:center;
  border-radius:16px;
  border:1px solid var(--border-gold);
  background:rgba(20,6,2,.55);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 4px 28px rgba(0,0,0,.35), inset 0 1px 0 rgba(180,130,20,.1);
  position:relative; overflow:visible;
  transition:transform .28s cubic-bezier(.22,1,.36,1), box-shadow .28s ease;
  animation:cardIn .6s ease both;
}

/* Warm dark panel for content area — NOT white */
.offer-cover::before{
  content:''; position:absolute;
  left:198px; top:0; right:0; bottom:0;
  background:rgba(24,7,3,.85);
  border-radius:0 15px 15px 0;
  border-left:1px solid rgba(150,90,10,.2);
  pointer-events:none; z-index:1;
}

/* Gold accent bar on left edge */
.offer-cover::after{
  content:''; position:absolute; left:0; top:10%; bottom:10%;
  width:3px; border-radius:0 3px 3px 0;
  background:linear-gradient(180deg, var(--red-1), var(--gold-2), var(--red-1));
  pointer-events:none; z-index:5;
}

.offer-cover:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 44px rgba(0,0,0,.45), 0 0 0 1px rgba(180,130,20,.35), inset 0 1px 0 rgba(180,130,20,.15);
}

/* Desktop — label must show above card */
.offers-cover-desktop .offer-cover{ overflow:visible; }

/* ── Per-rank animated borders ── */
.offers-cover-desktop .offer-cover:first-child,
.offers-cover-mobile  .offer-cover:first-child{
  border:2px solid;
  border-image:conic-gradient(from var(--angle),
    rgba(100,60,0,.4), var(--gold-1) .08turn,
    var(--gold-3) .12turn, var(--gold-2) .17turn,
    rgba(100,60,0,.4) .25turn) 2;
  animation:borderRotate var(--d) linear infinite forwards, cardIn .6s ease both;
  border-radius:14px;
  box-shadow:0 4px 28px rgba(0,0,0,.4), 0 0 20px rgba(180,130,10,.18);
}
.offers-cover-desktop .offer-cover:nth-child(2),
.offers-cover-mobile  .offer-cover:nth-child(2){
  border-top:2px solid var(--red-1);
  box-shadow:0 4px 22px rgba(0,0,0,.35), 0 0 12px rgba(100,10,10,.2);
}
.offers-cover-desktop .offer-cover:nth-child(3),
.offers-cover-mobile  .offer-cover:nth-child(3){
  border-top:2px solid var(--gold-1);
  box-shadow:0 4px 22px rgba(0,0,0,.35), 0 0 12px rgba(150,90,0,.18);
}
.offers-cover-desktop .offer-cover:nth-child(4),
.offers-cover-mobile  .offer-cover:nth-child(4){
  border-top:2px solid rgba(150,30,30,.7);
  box-shadow:0 4px 22px rgba(0,0,0,.3);
}
.offers-cover-desktop .offer-cover:nth-child(5),
.offers-cover-mobile  .offer-cover:nth-child(5){
  border-top:2px solid rgba(160,100,0,.7);
  box-shadow:0 4px 22px rgba(0,0,0,.3);
}

/* Stagger */
.offer-cover:nth-child(1){ animation-delay:.04s; }
.offer-cover:nth-child(2){ animation-delay:.10s; }
.offer-cover:nth-child(3){ animation-delay:.16s; }
.offer-cover:nth-child(4){ animation-delay:.22s; }
.offer-cover:nth-child(5){ animation-delay:.28s; }
.offer-cover:nth-child(6){ animation-delay:.34s; }
.offer-cover:nth-child(7){ animation-delay:.40s; }

/* ── RANK BADGE ── */
.order-count{
  position:absolute; left:-17px; z-index:20;
  font-family:'Cinzel', serif; font-size:13px; font-weight:900;
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  animation:rankPop 3s ease-in-out infinite, countUp .6s ease both;
  flex-shrink:0;
}
.order-count[data-rank="1"]{
  color:var(--gold-3);
  background:radial-gradient(circle, rgba(180,120,10,.3), rgba(80,5,5,.4));
  border:2px solid var(--gold-2);
  box-shadow:0 0 18px rgba(180,120,10,.5), 0 0 40px rgba(180,120,10,.15);
  animation:pulseRing 2.2s ease-out infinite, countUp .6s ease both;
}
.order-count[data-rank="2"]{
  color:var(--text); background:rgba(90,10,10,.6);
  border:2px solid rgba(140,30,30,.6);
  box-shadow:0 0 10px rgba(100,10,10,.4); animation-delay:.3s;
}
.order-count[data-rank="3"]{
  color:var(--bg); background:var(--gold-2);
  border:2px solid rgba(180,130,10,.5);
  box-shadow:0 0 10px rgba(160,110,0,.35); animation-delay:.6s;
}
.order-count[data-rank="4"]{
  color:var(--text); background:rgba(110,15,15,.6);
  border:2px solid rgba(150,30,30,.5);
  box-shadow:0 0 8px rgba(100,10,10,.3); animation-delay:.9s;
}
.order-count[data-rank="5"]{
  color:var(--bg); background:var(--gold-1);
  border:2px solid rgba(160,100,0,.45);
  box-shadow:0 0 8px rgba(140,90,0,.3); animation-delay:1.2s;
}

/* ── LABEL RIBBON ── */
.label{ position:absolute; top:-14px; left:16px; z-index:50; }
.label-right{ display:none; }
.label-bottom{ display:none; }

.label-center{
  display:flex; position:relative;
  width:auto; min-width:140px; height:32px;
  /* Premium ribbon: rounded left cap + curved double-notch arrow on right */
  clip-path: polygon(
    0 50%,
    8px 0,
    calc(100% - 22px) 0,
    calc(100% - 8px) 16px,
    100% 50%,
    calc(100% - 8px) 16px,
    calc(100% - 22px) 100%,
    8px 100%
  );
  background:linear-gradient(135deg, #8a1212 0%, var(--red-1) 40%, #6b0000 100%);
  z-index:5;
  justify-content:center; align-items:center;
  color:var(--gold-3); font-size:11px; font-weight:900;
  padding:0 28px 0 20px;
  text-transform:uppercase; letter-spacing:.1em;
  box-shadow:0 4px 18px rgba(80,10,10,.7), 0 2px 6px rgba(0,0,0,.4);
  font-family:'Outfit', sans-serif; white-space:nowrap;
  position:relative;
}
/* Gold shimmer line on top */
.label-center::before{
  content:'';
  position:absolute; top:0; left:10%; right:20%;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(240,192,64,.6), transparent);
  pointer-events:none;
}

.offer-cover:nth-child(3) .label-center{
  background:linear-gradient(135deg, var(--gold-1) 0%, #c07800 50%, #8a5c00 100%);
  color:#1c0a02;
  box-shadow:0 4px 18px rgba(140,80,0,.55), 0 2px 6px rgba(0,0,0,.3);
}
.offer-cover:nth-child(3) .label-center::before{
  background:linear-gradient(90deg, transparent, rgba(255,230,100,.5), transparent);
}
.offer-cover:nth-child(5) .label-center{
  background:linear-gradient(135deg, #b02020 0%, var(--red-2) 50%, #6a0808 100%);
  color:var(--gold-4);
  box-shadow:0 4px 18px rgba(100,15,15,.55), 0 2px 6px rgba(0,0,0,.3);
}

/* ── OFFER LOGO ── */
.offer-logo{
  max-width:200px; height:100%;
  display:flex; justify-content:center; align-items:center;
  border-radius:14px 0 0 14px; width:100%;
  background:rgba(50,8,4,.6);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border-right:1px solid rgba(150,80,10,.2);
  flex-shrink:0; overflow:hidden; position:relative; z-index:3;
  animation:logoPulse 3s ease-in-out infinite;
}
@keyframes logoPulse{
  0%,100%{ box-shadow:inset 0 0 22px rgba(180,120,10,.08), inset 0 0 8px rgba(100,10,10,.1); }
  50%     { box-shadow:inset 0 0 44px rgba(180,120,10,.22), inset 0 0 18px rgba(160,20,10,.18); }
}
.offer-logo img{
  width:100%; max-width:150px;
  transition:transform .3s ease, filter .3s ease;
}
.offer-cover:hover .offer-logo img{
  transform:scale(1.08);
  filter:drop-shadow(0 0 12px rgba(200,140,20,.35));
}

/* ── BONUS TEXT ── */
.offer-message{
  flex:1; max-width:220px; text-align:center;
  padding:0 10px; position:relative; z-index:3;
}
.offer-message .welcome-1{
  color:var(--text-2); font-size:12px; font-weight:700;
  line-height:1.5; text-transform:uppercase; letter-spacing:.1em; margin-bottom:4px;
  text-shadow:0 0 12px rgba(180,130,10,.2);
}
.offer-message .welcome-2{
  font-family:'Outfit', sans-serif;
  font-size:18px; font-weight:900; line-height:1.2; padding-bottom:4px;
  color:var(--gold-3);
  text-shadow:0 0 20px rgba(180,130,10,.3);
}
.offer-message .welcome-3{
  color:var(--text-2); font-size:13px; font-weight:700; letter-spacing:.02em;
}

/* ── PAYMENT METHODS ── */
.offer-payment{
  display:flex; flex-flow:wrap; justify-content:center;
  align-items:center; gap:3px; position:relative; z-index:3;
}
.offer-payment img{
  opacity:.65; transition:opacity .2s, transform .2s; border-radius:4px;
  filter:brightness(.9) contrast(1.1);
}
.offer-payment img:hover{ opacity:.95; transform:scale(1.12); }
.offers-cover-desktop .offer-payment{ max-width:120px; margin-right:8px; }
.offers-cover-desktop .offer-payment img{ width:28px; height:18px; object-fit:contain; }

.show-more-btn{ text-align:center; width:100%; }
.show-more-btn button{
  font-size:11px; width:30px; font-weight:700;
  color:var(--gold-2); background:rgba(150,90,10,.12);
  border:1px solid rgba(150,90,10,.3); border-radius:20px;
  padding:1px 2px; cursor:pointer; transition:all .2s;
}
.show-more-btn button:hover{
  background:rgba(150,90,10,.22);
  box-shadow:0 0 8px rgba(150,90,10,.3);
}

/* ── RATING ── */
.offer-rate{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-width:80px; padding:0 8px; position:relative; z-index:3;
}
.score,.votes{
  color:var(--text-dim); text-align:center; font-size:11px;
  font-weight:600; line-height:1.4; margin-bottom:4px;
}
.votes{ display:none; }
.score span{
  color:var(--gold-3); font-size:30px; font-weight:900; display:block; line-height:1;
  text-shadow:0 0 16px rgba(180,130,10,.35);
}
.votes span{ color:var(--text); font-size:15px; }

.stars-container{
  position:relative; display:inline-block;
  color:transparent; font-size:17px; margin-bottom:6px; letter-spacing:2px;
}
.stars-container::before{
  position:absolute; top:0; left:0;
  content:"★★★★★"; color:rgba(180,130,10,.18);
}
.stars-container::after{
  position:absolute; top:0; left:0;
  content:"★★★★★"; color:var(--gold-2); overflow:hidden;
  text-shadow:0 0 8px rgba(180,130,10,.4);
}
.star-100::after{width:100%} .star-90::after{width:90%}
.star-80::after{width:80%}  .star-70::after{width:70%}
.star-50::after{width:50%}

/* ── CTA BUTTONS ── */
.offer-buttons{
  display:flex; justify-content:center; align-items:center;
  flex-direction:column; position:relative; z-index:3;
}
.offers-cover-desktop .offer-buttons{ min-width:188px; }
.offer-buttons a{
  display:flex; justify-content:center; align-items:center;
  flex-direction:column; margin-right:18px;
}

.offer-buttons .get-bonus{
  color:var(--gold-4); text-align:center;
  font-family:'Outfit', sans-serif;
  font-size:14px; font-weight:800; letter-spacing:.07em; text-transform:uppercase;
  width:152px; height:52px; border-radius:100px; flex-shrink:0;
  display:flex; justify-content:center; align-items:center;
  background:linear-gradient(135deg, var(--red-1) 0%, var(--red-2) 55%, var(--red-1) 100%);
  background-size:200% auto;
  box-shadow:0 4px 24px rgba(100,10,10,.55), 0 0 0 2px rgba(180,130,20,.18);
  margin-bottom:10px; margin-left:auto; margin-right:auto;
  transition:all .24s cubic-bezier(.22,1,.36,1);
  position:relative; overflow:hidden;
  border:1px solid rgba(180,130,20,.25);
}
.offer-buttons .get-bonus::before{
  content:''; position:absolute; top:0; left:-100%;
  width:55%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(240,200,80,.18), transparent);
  transform:skewX(-20deg); transition:left .6s ease;
}
.offer-buttons .get-bonus:hover::before{ left:170%; }
.offers-cover-desktop .offer-buttons .get-bonus{ margin-bottom:10px; margin-top:10px; }
.offer-buttons .get-bonus:hover{
  background:linear-gradient(135deg, var(--red-2) 0%, #b83030 55%, var(--red-2) 100%);
  box-shadow:0 8px 36px rgba(100,10,10,.7), 0 0 0 3px rgba(180,130,20,.25);
  transform:scale(1.06) translateY(-2px); animation:none;
}

.offer-buttons .visit-site{
  color:rgba(180,130,40,.4); text-align:center;
  font-size:12px; font-weight:500; line-height:24px; display:none; transition:color .2s;
}
.offer-buttons .visit-site:hover{ color:var(--gold-2); text-decoration:underline; }

/* ── BOTTOM DIVIDER ── */
.offer-bottom{ width:99%; margin:0 auto 16px; }
.offer-bottom .terms{
  color:rgba(150,100,40,.25); text-align:left;
  font-size:9px; font-weight:400; line-height:13px;
  width:92%; margin:6px auto;
}
.offer-bottom-border{ position:relative; width:100%; }
.line-bottom{
  display:block; width:100%; height:1px;
  background:linear-gradient(90deg, transparent, rgba(150,90,10,.2), transparent);
}
.left-dot,.right-dot{
  width:5px; height:5px; transform:rotate(45deg);
  background:rgba(180,120,10,.3); position:absolute; top:-2px;
}
.left-dot{left:0} .right-dot{right:0}

/* ── LIVE PILL ── */
.live-pill{
  display:inline-flex; align-items:center; gap:5px; margin-top:7px;
  background:rgba(100,10,10,.3);
  border:1px solid rgba(150,80,10,.3); border-radius:20px;
  padding:3px 10px; font-size:10px; font-weight:700;
  color:var(--text-2);
}
.live-pill-dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--gold-2); box-shadow:0 0 6px rgba(180,130,20,.6);
  animation:ldp 1.6s ease-in-out infinite; flex-shrink:0;
}
.live-badge{
  position:absolute; bottom:8px; right:14px; font-size:11px; font-weight:700;
  color:var(--gold-2); display:flex; align-items:center; gap:5px;
  z-index:20; pointer-events:none;
  background:rgba(16,4,2,.75);
  padding:3px 10px; border-radius:20px;
  border:1px solid rgba(150,90,10,.3);
}
.live-dot{
  width:7px; height:7px; border-radius:50%;
  background:var(--gold-2); box-shadow:0 0 6px rgba(180,130,10,.5);
  flex-shrink:0; animation:ldp 1.8s ease-in-out infinite;
}

/* ── FAQ ── */
.faq{
  width:100%; max-width:1100px; margin:36px auto 0; border-radius:16px;
  border:1px solid var(--border-gold);
  background:rgba(18,5,2,.88);
  box-shadow:0 4px 24px rgba(0,0,0,.35);
  padding:36px 40px 10px; position:relative; overflow:hidden;
  backdrop-filter:blur(8px);
}
.faq::before{
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, var(--red-1), var(--gold-2), var(--red-1));
}
.faq h1{
  font-family:'Cinzel', serif; color:var(--gold-2); font-size:26px; font-weight:700;
  line-height:1.2; margin:0 0 26px; text-align:center;
  text-shadow:0 0 24px rgba(180,130,10,.3);
}
.faq h2{
  color:var(--text); font-size:16px; font-weight:700; line-height:1.4;
  margin:20px 0 8px; padding-left:14px;
  border-left:2px solid var(--gold-1);
}
.faq p{
  color:var(--text-dim); font-size:14px; line-height:1.8;
  margin-bottom:22px; padding-left:14px;
}

/* ── ABOUT ── */
.about{
  width:100%; max-width:1100px; margin:0 auto;
  padding:36px 32px 20px;
  display:grid; grid-template-columns:1fr 1fr; gap:20px;
}
.about-item{
  display:flex; flex-direction:column; gap:10px;
  background:rgba(18,5,2,.82);
  border:1px solid var(--border-warm);
  border-radius:14px; padding:24px; position:relative; overflow:hidden;
  transition:border-color .3s, box-shadow .3s, transform .3s;
  box-shadow:0 2px 12px rgba(0,0,0,.25);
}
.about-item::before{
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, var(--red-1), var(--gold-2));
}
.about-item:hover{
  border-color:rgba(180,120,20,.45);
  box-shadow:0 6px 24px rgba(0,0,0,.35);
  transform:translateY(-2px);
}
.about-item .about-image{ display:flex; align-items:center; gap:12px; margin-bottom:4px; }
.about-item .about-image img{ width:34px; height:34px; filter:sepia(.5) saturate(2) hue-rotate(10deg) brightness(.9); }
.about-item h2{ color:var(--gold-2); font-family:'Cinzel', serif; font-size:14px; font-weight:700; letter-spacing:.04em; }
.about-item p{ color:var(--text-dim); font-size:13px; line-height:1.74; }

/* ── PLAY SAFE ── */
.play-safe{ width:100%; max-width:1100px; margin:0 auto; padding:10px 32px 60px; box-sizing:border-box; }
.play-safe h1{ color:var(--text-2); font-size:20px; font-weight:700; text-align:center; margin:40px 0 26px; font-family:'Cinzel', serif; letter-spacing:.04em; }
.gambl-logos{ display:flex; align-items:center; justify-content:center; gap:40px; flex-wrap:wrap; }
.gambl-logos_sm{ max-height:40px; }
.gambl-logos_lg{ max-height:75px; opacity:.4; transition:opacity .25s, transform .25s; filter:grayscale(.5) sepia(.2) brightness(.8); }
.gambl-logos_lg:hover{ opacity:.8; transform:scale(1.05); filter:grayscale(.2) sepia(.1); }

/* ── FOOTER ── */
.footer{
  padding:36px 30px 56px;
  background:rgba(8,2,0,.95);
  text-align:center;
  border-top:1px solid var(--border-gold);
}
.footer p{ color:rgba(160,100,40,.35); font-size:12px; font-weight:400; line-height:22px; }

/* ── POPUP ── */
.popup{ display:none; justify-content:center; align-items:center; position:fixed; top:0; left:0; width:100%; height:100%; z-index:99999; }
.popup-underlay{ background:rgba(5,1,0,.9); backdrop-filter:blur(14px); position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; }
.popup-body{
  width:100%; max-width:400px; border-radius:20px;
  border:1px solid var(--border-gold);
  background:rgba(22,6,2,.97);
  position:relative; z-index:2;
  box-shadow:0 20px 60px rgba(0,0,0,.6), 0 0 40px rgba(100,10,10,.2);
  animation:cardIn .45s ease;
}
.popup-body::before{ content:''; position:absolute; top:0; left:0; right:0; height:2px; border-radius:20px 20px 0 0; background:linear-gradient(90deg, var(--red-1), var(--gold-2), var(--red-1)); }
.close-popup-btn{ transform:rotate(45deg); font-size:48px; line-height:26px; font-weight:100; color:rgba(180,120,20,.35); cursor:pointer; border:none; background:transparent; position:absolute; right:-44px; top:-34px; transition:color .2s; }
.close-popup-btn:hover{ color:var(--gold-2); }
.popup-logo-cover{ border-radius:20px 20px 0 0; border-bottom:1px solid rgba(150,90,10,.2); background:rgba(40,10,4,.8); min-height:160px; display:flex; justify-content:center; align-items:center; }
.popup-logo-cover img{ width:225px; }
.popup .offer-buttons .get-bonus{ margin:14px 0 30px; width:200px; height:56px; font-size:14px; }
.popup .offer-message{ max-width:270px; margin:22px 0 10px; }
.popup-button-cover{ display:flex; flex-direction:column; align-items:center; justify-content:center; }

/* ── PAYMENTS WRAP ── */
.payments-block.wrap-condition{ flex-wrap:wrap; }

/* ══════════════════════════════════════════
   MOBILE OFFERS
══════════════════════════════════════════ */
.offers-cover-mobile{ display:none; flex-direction:column; gap:24px; width:100%; box-sizing:border-box; padding-top:6px; }

.offers-cover-mobile .offer-cover{
  height:auto;
  background:rgba(20,6,2,.5);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid var(--border-gold);
  border-radius:16px; display:flex; flex-direction:row;
  overflow:visible; margin:0;
  box-shadow:0 4px 24px rgba(0,0,0,.4);
}
.offers-cover-mobile .left-side,
.offers-cover-mobile .right-side{
  width:50%; margin:0; min-height:190px; padding:14px 12px;
  display:flex; justify-content:flex-start; flex-direction:column; align-items:center;
}
/* Label — visible above card */
.offers-cover-mobile .offer-cover .label{ top:-13px; left:12px; z-index:50; }
.offers-cover-mobile .offer-cover .label ~ .left-side{ padding-top:22px; }

/* Logo side — dark glass, white logos visible */
.left-side{
  background:rgba(50,8,4,.65);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border-right:1px solid rgba(150,80,10,.2);
  border-radius:16px 0 0 16px;
  overflow:hidden; position:relative; z-index:2;
  animation:logoPulse 3s ease-in-out infinite;
}
/* Content side — warm dark panel */
.right-side{
  justify-content:center;
  border-radius:0 16px 16px 0;
  background:rgba(24,7,3,.88);
  overflow:hidden; position:relative; z-index:2;
}
.left-side img{ width:100%; max-width:150px; border-radius:8px; }

.offers-cover-mobile .stars-container{ margin:6px 0; font-size:18px; letter-spacing:2px; }
.offers-cover-mobile .offer-payment{ max-width:180px; margin-top:8px; justify-content:center; }
.offers-cover-mobile .offer-payment img{ width:26px; height:13px; object-fit:contain; }
.offers-cover-mobile .show-more-btn{ text-align:center; width:auto; }
.offers-cover-mobile .offer-buttons{ margin-top:12px; width:100%; }
.offers-cover-mobile .offer-buttons .get-bonus{
  margin-right:0; width:100%; text-align:center;
  height:50px; border-radius:100px; max-width:215px;
  font-size:13px; letter-spacing:.05em;
}
.offers-cover-mobile .offer-buttons .visit-site{ display:none; }
.offers-cover-mobile .right-side{ justify-content:center; gap:6px; }
.offers-cover-mobile .offer-bottom{ margin:0; }

/* Mobile bonus text */
.offers-cover-mobile .offer-message{ text-align:center; padding:0 4px; max-width:100%; }
.offers-cover-mobile .offer-message .welcome-1{ font-size:11px; color:var(--text-2); font-weight:700; letter-spacing:.08em; }
.offers-cover-mobile .offer-message .welcome-2{ font-size:17px; font-weight:900; line-height:1.15; color:var(--gold-3); text-shadow:0 0 16px rgba(180,130,10,.3); }
.offers-cover-mobile .offer-message .welcome-3{ font-size:13px; font-weight:700; color:var(--text-2); }

/* ══════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════ */
@media screen and (max-width:900px){
  .offer-logo{ max-width:170px; }
  .faq{ padding:24px 22px 6px; }
  .faq h1{ font-size:20px; margin:0 0 18px; }
  .faq h2{ font-size:15px; }
  .faq p{ font-size:13px; margin-bottom:14px; }
  .about{ padding:24px 16px 14px; grid-template-columns:1fr; gap:14px; }
  .about-item{ padding:18px; }
  .play-safe h1{ font-size:18px; margin:28px 0 20px; }
  .gambl-logos{ gap:22px; }
  .gambl-logos_lg{ max-height:65px; }
  .footer{ padding:26px 18px; }
}
@media screen and (max-width:840px){
  .header-flags{ width:54px; height:54px; }
  .top-headline h1{ font-size:24px; }
  .table{ display:none; }
  .offers-cover-desktop{ display:none; }
  .offers-cover-mobile{ display:flex; }
  .offers-cover-mobile .visit-site{ display:none; }
  .offers-cover-mobile .offer-payment{ max-width:100%; }
  .offers-cover-mobile .left-side img{ max-width:135px; }
  .offers-cover-mobile .stars-container{ font-size:20px; }
  .offers-cover-mobile .left-side a{ display:flex; max-width:155px; width:100%; min-height:88px; justify-content:center; align-items:center; }
  .offer-buttons .get-bonus{ height:50px; }
  .offers-cover-mobile .left-side{ min-height:195px; }
  .stats-strip-item .stat-val{ font-size:18px; }
}
@media screen and (max-width:770px){
  .highlited-date-mobile{ display:block; }
  .highlited-date-desc,.sub-header li:last-child{ display:none; }
  .stats-strip{ flex-wrap:wrap; border-radius:12px; }
  .stats-strip-item{ min-width:80px; padding:10px 8px; }
  .stats-strip-item .stat-val{ font-size:16px; }
  .stats-strip-item .stat-label{ font-size:9px; }
}
@media screen and (max-width:680px){
  .offers-cover-mobile .offer-buttons .get-bonus{ max-width:175px; height:46px; }
  .header-flags{ position:absolute; top:0; left:50%; transform:translateX(-50%); z-index:2; }
  .top-headline{ text-align:center; margin-top:0; margin-bottom:2px; padding:0; position:relative; }
  .top-headline h1{ font-size:15px; font-weight:900; margin:62px 0 0; white-space:nowrap; margin-left:12px; }
  .logo-cover{ max-width:118px; }
  .header-disclamer{ font-size:9px; padding:6px 10px 3px; }
  .sub-headline{ display:none; }
  .sub-header{ padding:0; margin:6px auto 8px; gap:6px; }
  .sub-header li{ font-size:10px; padding:5px 12px; }
  .sub-header li img{ width:13px; height:13px; }
  .close-popup-btn{ right:-6px; }
  .score,.votes{ margin-bottom:0; }
  .offers-cover-mobile .left-side,.offers-cover-mobile .right-side{ padding:12px 10px; }
  .about{ grid-template-columns:1fr; }
  .play-safe{ padding:0 14px 36px; }
}
@media screen and (max-width:480px){
  .highlited-date-mobile{ margin:2px auto 1px 0; }
  .sub-header{ margin:0 auto 5px; }
  .sub-header li{ font-size:9px; padding:4px 10px; }
  .offers-cover-mobile .stars-container{ font-size:15px; }
  .offers-cover-mobile .offer-payment{ margin-top:4px; }
  .offer-message .welcome-1{ font-size:10px; }
  .offer-message .welcome-2{ font-size:16px; }
  .offer-message .welcome-3{ font-size:12px; }
  .offers-cover-mobile .offer-buttons .get-bonus{ width:100%; min-width:115px; height:44px; font-size:12px; }
  .score span{ font-size:26px; }
  .offers-cover-mobile .left-side{ justify-content:space-around; min-height:178px; }
  .offer-bottom .terms{ margin:4px auto 0; width:97%; font-size:8px; line-height:11px; }
  .top-headline h1{ font-size:13px; margin:62px 0 0; margin-left:10px; }
  .faq h1{ font-size:17px; margin:0 0 14px; text-align:left; }
  .faq{ padding:18px 16px 4px; }
  .faq h2{ font-size:13px; }
  .faq p{ font-size:12px; line-height:1.65; }
  .about-item h2{ font-size:13px; }
  .about-item p{ font-size:12px; }
  .play-safe h1{ font-size:16px; margin:22px 0 18px; }
  .footer p{ font-size:11px; }
  .footer{ padding:22px 12px; }
  .about{ padding:14px 10px 0; }
  .offers-cover-mobile .offer-payment img{ width:22px; height:11px; }
  .offers-cover-mobile .left-side,.offers-cover-mobile .right-side{ padding:10px 7px 6px; }
  .stats-strip-item{ min-width:58px; padding:8px 5px; }
  .stats-strip-item .stat-val{ font-size:14px; }
  .stats-strip-item .stat-label{ font-size:8px; }
}
@media screen and (max-width:380px){
  .offers-cover-mobile .left-side,.offers-cover-mobile .right-side{ padding:8px 5px; }
  .top-headline h1{ font-size:11px; }
  .offer-message .welcome-2{ font-size:14px; }
}
