/* BunsBet Casino - styles specifiques a la page Promotions */

/* Compense la barre haute collante quand on arrive via une ancre (#tournois, #club-vip) */
.bb-anchor{scroll-margin-top:104px}

/* Aucun mot long (adresse e-mail, montant) ne doit forcer un debordement horizontal */
.bb-prose p,
.bb-prose li,
.bb-faq summary,
.bb-faq p,
.bb-note,
.bb-facts .bb-fact__lab,
.bb-steps .bb-step__txt{overflow-wrap:break-word}

/* Encart pedagogique dans les explications de conditions de mise */
.bb-note{
  background:rgba(245,158,11,.08);
  border:1px solid var(--bb-line-strong);
  border-left-width:4px;
  border-radius:var(--bb-r-sm);
  padding:16px 18px;
  color:var(--bb-cream);
  font-size:.95rem;
}
.bb-note b{color:var(--bb-cheese)}

/* Legende de tableau */
.bb-table caption{
  caption-side:top;
  text-align:left;
  padding:0 0 10px;
  font-size:.82rem;
  color:var(--bb-ink-mute);
}

/* Titre du bandeau final : rendu visuel d'un h2 sans creer de niveau Hn */
.bb-band p.bb-band__hed{
  font-family:"Lilita One","Inter",system-ui,sans-serif;
  font-weight:400;
  line-height:1.12;
  letter-spacing:.4px;
  font-size:clamp(1.5rem,2.8vw,2.15rem);
  color:#fff;
  margin:0 0 10px;
}

/* ---------- Vitrine du bonus de bienvenue ---------- */

.bb-vitrine{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.42fr);
  gap:26px;align-items:center;
  background:var(--bb-grad-deep);
  border:1px solid var(--bb-line-strong);
  border-radius:var(--bb-r-lg);
  padding:30px 32px;
  margin:0 0 14px;
}
.bb-vitrine::before{
  content:"";position:absolute;left:-70px;top:-80px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,158,11,.22),rgba(245,158,11,0) 70%);
  pointer-events:none;
}
.bb-vitrine__key{position:relative;z-index:1;min-width:0}
.bb-vitrine .bb-vitrine__kicker{
  font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;
  color:var(--bb-orange);line-height:1.4;margin:0 0 12px;
}
.bb-vitrine .bb-vitrine__pct{
  font-family:"Lilita One","Inter",system-ui,sans-serif;font-weight:400;
  font-size:clamp(3.2rem,8.4vw,5.4rem);line-height:.96;letter-spacing:.5px;
  color:var(--bb-cheese);text-shadow:0 0 26px rgba(255,201,40,.4);
  margin:0;
}
.bb-vitrine .bb-vitrine__line{
  font-family:"Lilita One","Inter",system-ui,sans-serif;font-weight:400;
  font-size:clamp(1.35rem,3.4vw,2.05rem);line-height:1.2;letter-spacing:.4px;
  color:#fff;margin:6px 0 0;
}
.bb-vitrine .bb-vitrine__line b{color:var(--bb-cheese);font-weight:400}
.bb-vitrine .bb-vitrine__spins{
  display:inline-block;margin:16px 0 0;padding:8px 18px;border-radius:999px;
  background:rgba(245,158,11,.12);border:1px solid var(--bb-line-strong);
  color:var(--bb-cream);font-weight:700;font-size:.95rem;line-height:1.4;
}
.bb-vitrine .bb-btn{margin-top:20px}
.bb-vitrine .bb-vitrine__fine{
  margin:14px 0 0;font-size:.8rem;line-height:1.6;color:var(--bb-ink-mute);
}
.bb-vitrine__art{position:relative;z-index:1;display:grid;place-items:center;min-width:0}
.bb-vitrine__art img{width:100%;max-width:250px;filter:drop-shadow(0 16px 32px rgba(0,0,0,.6))}

/* Tuiles de chiffres cles */
ul.bb-facts{
  list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;margin:0 0 14px;padding:0;
}
.bb-facts li{
  display:flex;flex-direction:column;gap:5px;margin:0;min-width:0;
  background:var(--bb-surface);border:1px solid var(--bb-line);
  border-radius:var(--bb-r);padding:16px 18px;
}
.bb-facts .bb-fact__num{
  font-family:"Lilita One","Inter",system-ui,sans-serif;font-weight:400;
  font-size:1.85rem;line-height:1;letter-spacing:.4px;color:var(--bb-cheese);
}
.bb-facts .bb-fact__lab{
  font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;font-weight:700;
  line-height:1.45;color:var(--bb-ink-mute);
}

/* Parcours en trois etapes */
ol.bb-steps{
  list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;margin:0 0 26px;padding:0;
}
.bb-steps li{
  position:relative;margin:0;min-width:0;
  background:var(--bb-surface-2);border:1px solid var(--bb-line);
  border-radius:var(--bb-r);padding:18px 20px 18px 64px;
}
.bb-steps .bb-step__n{
  position:absolute;left:18px;top:17px;
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:var(--bb-grad-hot);color:#1A0B05;
  font-family:"Lilita One","Inter",system-ui,sans-serif;font-size:1.05rem;line-height:1;
}
.bb-steps .bb-step__hed{display:block;color:#fff;font-size:.98rem;line-height:1.35;margin-bottom:5px}
.bb-steps .bb-step__txt{display:block;font-size:.9rem;line-height:1.6;color:var(--bb-ink-soft)}

/* ---------- Rythme vertical de la page ---------- */

.bb-prose .bb-lede{margin-bottom:22px}
/* Les cartes promo sont dans .bb-prose : on annule le rythme editorial sur leurs titres */
.bb-prose .bb-deal h3{margin:6px 0 8px;color:#fff}
.bb-prose .bb-deal p{max-width:none;line-height:1.6}
.bb-prose .bb-grid-scroll{margin:0 0 24px}
.bb-prose .bb-note{margin:0 0 22px}
.bb-prose .bb-duo{margin:0 0 26px}
.bb-prose ul:not(.bb-facts),
.bb-prose ol:not(.bb-steps){margin-bottom:1.4em}
.bb-prose .bb-faq{margin-top:4px}

/* ---------- Responsive ---------- */

/* Paliers alignes sur core.css : 1180 / 960 / 640 / 400 */

@media (max-width:1180px){
  /* Meme rythme que .bb-quad de core.css : 4 tuiles ne tiennent plus avec le rail */
  ul.bb-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:960px){
  /* La vitrine passe en pile, le visuel sous le texte */
  .bb-vitrine{grid-template-columns:minmax(0,1fr);gap:22px;padding:26px 22px}
  .bb-vitrine__art img{max-width:200px}
  /* Le parcours en etapes suit .bb-trio de core.css */
  ol.bb-steps{grid-template-columns:minmax(0,1fr);gap:12px;margin-bottom:22px}
}

@media (max-width:640px){
  .bb-anchor{scroll-margin-top:78px}

  /* Vitrine : une seule colonne resserree, bouton pleine largeur */
  .bb-vitrine{padding:22px 16px;border-radius:var(--bb-r);gap:18px}
  .bb-vitrine .bb-vitrine__spins{margin-top:14px;font-size:.9rem}
  .bb-vitrine .bb-btn{width:100%;margin-top:16px;min-height:46px}
  .bb-vitrine .bb-vitrine__fine{margin-top:12px}
  .bb-vitrine__art img{max-width:170px}

  /* Tuiles de chiffres : chiffre et libelle sur une ligne */
  ul.bb-facts{grid-template-columns:minmax(0,1fr);gap:10px}
  .bb-facts li{flex-direction:row;align-items:baseline;gap:12px;padding:14px 16px}
  .bb-facts .bb-fact__num{flex:0 0 auto;font-size:1.6rem}
  .bb-facts .bb-fact__lab{line-height:1.35}

  /* Etapes : la pastille numerotee reste hors du texte */
  .bb-steps li{padding:16px 16px 16px 56px}
  .bb-steps .bb-step__n{left:14px;top:15px}

  /* Cartes promo : le montant tient sur la largeur, le bouton devient une vraie cible */
  .bb-deal .bb-deal__amount{font-size:2rem}
  .bb-deal .bb-btn{align-self:stretch;min-height:46px}

  /* Encart et bandeau final au meme diapason que les h2 de core.css */
  .bb-note{padding:14px 16px;font-size:.92rem}
  .bb-prose .bb-note{margin-bottom:20px}
  .bb-band p.bb-band__hed{font-size:clamp(1.35rem,5.4vw,1.75rem)}
  .bb-band .bb-btn{min-height:46px}
}

@media (max-width:400px){
  .bb-vitrine{padding:20px 14px}
  .bb-vitrine__art img{max-width:148px}
  .bb-facts .bb-fact__num{font-size:1.45rem}
  .bb-deal .bb-deal__amount{font-size:1.75rem}
  .bb-steps li{padding:15px 14px 15px 52px}
  .bb-steps .bb-step__n{left:12px;top:14px;width:30px;height:30px;font-size:.95rem}
}
