/* BetFIRST site-1 | prefix: bf1 */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Outfit',sans-serif;background:#FFFFFF;color:#1A1A1A;line-height:1.65;font-size:16px}
a{color:#f0a500;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:#1A1A2E;color:#FFD700;font-weight:600}
tr:nth-child(even) td{background:#F8F8F8}

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

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

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

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

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

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

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

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

/* Slot grid */

.bf1-slot-grid {display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
.bf1-slot-item {width:calc(25% - 12px);min-width:160px;border-radius:10px;overflow:hidden;background:#FFFFFF;transition:transform .2s;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.bf1-slot-item:hover{transform:translateY(-4px)}
.bf1-slot-item img{width:100%;height:140px;object-fit:cover;display:block}
.bf1-slot-meta{padding:10px 12px}
.bf1-slot-name{font-size:.85rem;font-weight:700;color:#1A1A1A;display:block}
.bf1-slot-prov{font-size:.75rem;color:#f0a500}
.bf1-live-grid{display:flex;flex-wrap:wrap;gap:20px}
.bf1-live-card{width:calc(25% - 15px);min-width:200px;border-radius:10px;overflow:hidden;background:#FFFFFF;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.bf1-live-card img{width:100%;height:155px;object-fit:cover}
.bf1-live-info{padding:14px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.bf1-live-info h4{margin:0;font-size:.95rem;color:#1A1A1A}
.bf1-live-info p{margin:0;font-size:.8rem;color:#666666}


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

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

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

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

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

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

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