/* BetFIRST site-4 | prefix: betw */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Roboto',sans-serif;background:#F5F5F5;color:#1A1A1A;line-height:1.65;font-size:16px}
a{color:#E30613;text-decoration:none}
img{max-width:100%;height:auto}
table{width:100%;border-collapse:collapse}
th,td{border:1px solid #e0e0e0;padding:10px 14px;text-align:left;font-size:.88rem;color:#1A1A1A}
th{background:#222222;color:#FFD700;font-weight:600}
tr:nth-child(even) td{background:#FFFFFF}

/* Layout */
.betw-wrap{max-width:1200px;margin:0 auto;padding:0 20px}

/* Header */
.betw-hdr{position:sticky;top:0;z-index:100;background:#1A1A2E;border-bottom:1px solid #FFD70030;padding:14px 0}
.betw-hdr-in{display:flex;align-items:center;justify-content:space-between;gap:16px}
.betw-logo{height:36px;width:auto}
.betw-nav{display:flex;gap:24px;font-size:.9rem}
.betw-nav a{color:#ffffffbb;transition:color .2s}
.betw-nav a:hover{color:#FFD700}

/* Buttons */
.betw-btn{display:inline-block;background:#E30613;color:#ffffff;padding:10px 22px;border-radius:2px;font-weight:700;font-size:.9rem;transition:background .2s,transform .15s;cursor:pointer;border:none;text-decoration:none}
.betw-btn:hover{background:#ff2030;transform:translateY(-1px)}
.betw-btn-lg{padding:14px 32px;font-size:1rem}
.betw-btn-sm{padding:7px 16px;font-size:.82rem}

/* Sections */
.betw-sec{padding:60px 0;background:#FFFFFF}
.betw-sec-alt{padding:60px 0;background:#F8F8F8}
.betw-sec h2{font-size:1.7rem;font-weight:800;margin-bottom:20px;color:#1A1A1A}
.betw-sec-alt h2{font-size:1.7rem;font-weight:800;margin-bottom:20px;color:#1A1A1A}
.betw-sec h3,.betw-sec-alt h3{font-size:1.25rem;font-weight:700;margin-bottom:16px;color:#1A1A1A}
.betw-sec p,.betw-sec-alt p{margin-bottom:14px;color:#666666;font-size:.95rem;max-width:800px}

/* Split layout */
.betw-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.betw-split img{border-radius:10px;width:100%;height:auto}

/* Hero */
.betw-hero{padding:70px 0;background:#FFFFFF}
.betw-hero-wrap{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.betw-hero h1{font-size:2.1rem;font-weight:900;line-height:1.2;margin-bottom:20px;color:#1A1A1A}
.betw-hero-img img{border-radius:10px;width:100%;height:auto}
.betw-badges{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.betw-badge{background:#E3061315;color:#c00510;padding:5px 12px;border-radius:20px;font-size:.8rem;font-weight:600;border:1px solid #E3061340}

/* Steps */
.betw-steps{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin:24px 0}
.betw-step{display:flex;gap:14px;align-items:flex-start;background:#FFFFFF;padding:18px;border-radius:2px;border-left:3px solid #E30613;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.betw-step-num{font-size:1.4rem;font-weight:900;color:#E30613;min-width:32px;line-height:1}
.betw-step strong{display:block;font-size:.9rem;color:#1A1A1A;margin-bottom:4px}
.betw-step p{font-size:.83rem;color:#666666;margin:0}

/* Category cards */
.betw-cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:24px 0}
.betw-cat-card{border-radius:2px;overflow:hidden;position:relative;border:1px solid #e0e0e0;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.betw-cat-card img{width:100%;height:180px;object-fit:cover;display:block}
.betw-cat-info{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.85));padding:16px 14px}
.betw-cat-info strong{display:block;font-size:1rem;font-weight:700;color:#fff}
.betw-cat-info span{font-size:.8rem;color:#FFD700}

/* Slot grid */

.betw-slot-grid{display:inline-grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%}
.betw-slot-item{border-radius:4px;overflow:hidden;background:#FFFFFF;outline:1px solid #e0e0e0;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.betw-slot-item img{width:100%;height:135px;object-fit:cover;display:block}
.betw-slot-meta{padding:8px}
.betw-slot-name{font-size:.81rem;font-weight:700;color:#1A1A1A;display:block}
.betw-slot-prov{font-size:.71rem;color:#E30613}
.betw-live-grid{display:inline-grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%}
.betw-live-card{border-radius:4px;overflow:hidden;background:#FFFFFF;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.betw-live-card img{width:100%;height:155px;object-fit:cover;display:block}
.betw-live-info{padding:10px}
.betw-live-info h4{margin:0 0 4px;font-size:.88rem;color:#1A1A1A}
.betw-live-info p{margin:0;font-size:.77rem;color:#666666}


/* Table games (similar to live) */
.betw-tbl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:20px 0}
.betw-tbl-card{border-radius:2px;overflow:hidden;background:#FFFFFF;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.betw-tbl-card img{width:100%;height:155px;object-fit:cover}
.betw-tbl-info{padding:12px}
.betw-tbl-info h4{margin:0 0 4px;font-size:.9rem;color:#1A1A1A}
.betw-tbl-info p{margin:0;font-size:.78rem;color:#666666}

/* Payment row */
.betw-pay-icons{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.betw-pay-icons img{background:#fff;padding:4px 8px;border-radius:6px}
.betw-tbl-wrap{overflow-x:auto;margin:16px 0}

/* Bonus section */
.betw-bonus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:24px 0}
.betw-bonus-card{border-radius:2px;overflow:hidden;background:#FFFFFF;border-top:3px solid #E30613;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.betw-bonus-card img{width:100%;height:155px;object-fit:cover}
.betw-bonus-body{padding:16px}
.betw-bonus-title{font-size:1rem;font-weight:700;color:#1A1A1A;display:block;margin-bottom:6px}
.betw-bonus-amt{font-size:1.15rem;font-weight:900;color:#E30613;display:block;margin-bottom:8px}
.betw-bonus-body p{font-size:.82rem;color:#666666;margin:0}
.betw-single-bonus{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;background:#FFFFFF;border-radius:2px;overflow:hidden;margin:20px 0;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.betw-single-bonus img{width:100%;height:180px;object-fit:cover}
.betw-single-bonus-txt{padding:20px}
.betw-single-bonus-txt h4{color:#1A1A1A;margin-bottom:10px}
.betw-single-bonus-txt p{color:#666666;font-size:.88rem;margin-bottom:12px}

/* FAQ */
.betw-faq{display:flex;flex-direction:column;gap:12px;margin:24px 0}
.betw-faq-item{background:#FFFFFF;border-radius:2px;border:1px solid #e0e0e0;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.betw-faq-q{padding:16px 20px;font-weight:700;font-size:.95rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:#1A1A1A}
.betw-faq-q::after{content:'▾';color:#E30613}
.betw-faq-a{padding:0 20px 16px;font-size:.88rem;color:#666666;line-height:1.6}

/* Promo bar */
.betw-promo{position:fixed;bottom:0;left:0;right:0;z-index:200;background:linear-gradient(135deg,#E30613,#ff2030);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.betw-promo-txt{font-weight:700;color:#ffffff;font-size:.95rem}
.betw-promo-right{display:flex;align-items:center;gap:12px}
.betw-promo-close{background:none;border:none;cursor:pointer;color:#ffffff;font-size:1.3rem;line-height:1;padding:2px 8px}
.betw-promo-btn{background:#ffffff;color:#E30613;padding:8px 20px;border-radius:2px;font-weight:700;font-size:.88rem;text-decoration:none}

/* Footer */
.betw-footer{background:#1A1A2E;padding:32px 0;border-top:1px solid #FFD70020}
.betw-footer-in{display:grid;grid-template-columns:1fr 2fr;gap:32px;align-items:start}
.betw-footer-lic{font-size:.75rem;color:#ffffff60;line-height:1.7}
.betw-footer-logo{height:30px;width:auto;margin-bottom:12px;display:block}
.betw-footer-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:16px}
.betw-footer-links a{font-size:.8rem;color:#ffffff70}

/* Responsive */
@media(max-width:1024px){
  .betw-hero-wrap,.betw-split{grid-template-columns:1fr}
  .betw-hero-img{order:-1}
  .betw-cat-grid{grid-template-columns:repeat(3,1fr)}
  .betw-slot-grid{grid-template-columns:repeat(3,1fr)!important}
  .betw-live-grid{grid-template-columns:repeat(2,1fr)!important}
  .betw-tbl-grid{grid-template-columns:repeat(2,1fr)}
  .betw-bonus-grid{grid-template-columns:repeat(3,1fr)}
  .betw-footer-in{grid-template-columns:1fr}
}
@media(max-width:768px){
  .betw-hero h1{font-size:1.6rem}
  .betw-cat-grid{grid-template-columns:repeat(2,1fr)}
  .betw-slot-grid{grid-template-columns:repeat(2,1fr)!important}
  .betw-live-grid{grid-template-columns:repeat(2,1fr)!important}
  .betw-tbl-grid{grid-template-columns:repeat(2,1fr)}
  .betw-bonus-grid{grid-template-columns:1fr 1fr}
  .betw-single-bonus{grid-template-columns:1fr}
  .betw-nav{display:none}
  .betw-hdr-in{justify-content:space-between}
  .betw-steps{grid-template-columns:1fr}
  .betw-promo{flex-direction:column;text-align:center}
}
@media(max-width:480px){
  .betw-cat-grid{grid-template-columns:1fr}
  .betw-slot-grid{grid-template-columns:1fr 1fr!important}
  .betw-live-grid{grid-template-columns:1fr!important}
  .betw-tbl-grid{grid-template-columns:1fr 1fr}
  .betw-bonus-grid{grid-template-columns:1fr}
  .betw-hero{padding:40px 0}
  .betw-sec,.betw-sec-alt{padding:40px 0}
}
@media(max-width:320px){
  body{font-size:14px}
  .betw-slot-grid{grid-template-columns:1fr!important}
  .betw-tbl-grid{grid-template-columns:1fr}
  .betw-hero h1{font-size:1.35rem}
}