/* casinos/roobet.css  -  Roobet: "Promo Slick". Magazine ad-style with cashback meter. */
.rb-slick { padding: var(--s-7) 0; background: linear-gradient(135deg, rgba(255,225,86,0.10), transparent 60%), var(--paper); border-bottom: 1px solid var(--rule); }
.rb-slick__diag { position: relative; padding: var(--s-5); border: 4px solid var(--brand); }
.rb-slick__diag::after { content: ""; position: absolute; top: -4px; right: -4px; bottom: -4px; left: -4px; border: 1px solid var(--brand); pointer-events: none; }
.rb-slick__row { display: grid; grid-template-columns: 1fr; gap: var(--s-5); }
@media (min-width: 880px) { .rb-slick__row { grid-template-columns: 1.2fr 1fr; } }
.rb-stamp { display: inline-flex; padding: 6px 12px; background: var(--brand); color: var(--paper); font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 700; margin-bottom: var(--s-3); }
.rb-h1 { font-family: var(--font-serif); font-size: clamp(2.2rem, 5vw, 3.4rem); font-weight: 800; line-height: 1; letter-spacing: -0.02em; margin: 0 0 var(--s-3); }
.rb-h1 em { font-style: italic; color: var(--brand-2); }
.rb-lede { color: var(--ink-dim); font-size: 1.05rem; line-height: 1.55; }
.rb-cb-meter { position: relative; background: var(--surface); border: 2px solid var(--brand); padding: var(--s-5); }
.rb-cb-title { font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.22em; color: var(--brand-2); text-transform: uppercase; }
.rb-cb-num { font-family: var(--font-serif); font-size: 4rem; font-weight: 800; color: var(--brand); line-height: 1; }
.rb-cb-sub { font-family: var(--font-mono); font-size: 14px; color: var(--ink); padding-top: var(--s-2); border-top: 1px dashed var(--rule); margin-top: var(--s-3); }
.rb-cb-cap { font-size: 14px; color: var(--ink-mute); font-family: var(--font-mono); margin-top: 4px; }

.rb-stats { padding: var(--s-6) 0; background: var(--brand); color: var(--paper); }
.rb-stats__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s-4); }
@media (min-width: 700px) { .rb-stats__grid { grid-template-columns: repeat(4, 1fr); } }
.rb-stat__num { font-family: var(--font-serif); font-size: 1.8rem; font-weight: 700; color: var(--paper); }
.rb-stat__label { font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.2em; color: var(--brand-2); text-transform: uppercase; margin-top: 4px; }

.rb-games { padding: var(--s-7) 0; border-bottom: 1px solid var(--rule); }
.rb-games h2 { font-family: var(--font-serif); font-style: italic; font-weight: 600; margin: 0 0 var(--s-5); }
.rb-games__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--s-3); }
.rb-game { padding: var(--s-3); background: var(--surface); border-top: 4px solid var(--brand); text-decoration: none; color: inherit; display: flex; flex-direction: column; gap: 4px; }
.rb-game:hover { background: var(--brand-soft); }
.rb-game strong { font-family: var(--font-serif); color: var(--ink); }
.rb-game span { font-family: var(--font-mono); font-size: 14px; color: var(--brand-2); letter-spacing: 0.12em; }

.rb-body { padding: var(--s-7) 0; }
.rb-body__inner {  }

.rb-claim { padding: var(--s-7) 0; background: var(--brand-soft); border-top: 2px solid var(--brand); }
.rb-claim__title { font-family: var(--font-serif); font-size: var(--t-h2); margin: 0 0 var(--s-5); }
.rb-claim__title em { font-style: italic; color: var(--brand); }
.rb-claim__steps { display: grid; gap: var(--s-3); grid-template-columns: 1fr; }
@media (min-width: 800px) { .rb-claim__steps { grid-template-columns: repeat(4, 1fr); } }
.rb-claim__step { padding: var(--s-4); background: var(--surface); border-top: 4px solid var(--brand); }
.rb-claim__step > span { font-family: var(--font-serif); font-size: 2rem; font-weight: 700; color: var(--brand); line-height: 1; display: block; }
.rb-claim__step h3 { font-family: var(--font-serif); font-size: 1.15rem; margin: var(--s-2) 0 6px; }
.rb-claim__step p { color: var(--ink-dim); font-size: 14px; margin: 0; }
.rb-claim__signoff { display: flex; align-items: center; gap: var(--s-3); margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px dashed var(--rule); }
.rb-claim__signoff img { width: 80px; height: 80px; border-radius: 50%; border: 3px solid var(--brand); padding: 4px; background: var(--surface); object-fit: cover; }
.rb-claim__signoff a { color: var(--brand); border-bottom: 1px solid var(--brand); }

.rb-bullets { padding: var(--s-5) 0; background: var(--brand); color: #fff; }
.rb-bullets__title { font-family: var(--font-serif); font-style: italic; font-weight: 600; font-size: 1.3rem; margin: 0 0 var(--s-3); }
.rb-bullets__list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr; gap: 6px var(--s-4); }
@media (min-width: 700px) { .rb-bullets__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .rb-bullets__list { grid-template-columns: repeat(3, 1fr); } }
.rb-bullets__list li { padding: 6px 0; border-bottom: 1px dashed rgba(255,255,255,0.2); }
.rb-bullets__list a { color: #fff; display: grid; grid-template-columns: 44px 1fr; gap: var(--s-2); font-family: var(--font-mono); font-size: 14px; align-items: baseline; }
.rb-bullets__list span { font-weight: 700; color: var(--brand-2); font-family: var(--font-serif); font-size: 1.2rem; }
.rb-bullets__list a:hover { color: var(--brand-2); }