@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;900&family=Oswald:wght@400;500;600;700&display=swap');

.bb-page * { margin: 0; padding: 0; box-sizing: border-box; }
.bb-page {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color: #0d0d1a; line-height: 1.6; overflow-x: hidden;
  --bb-green: #00C853; --bb-green-dark: #1B8C3D; --bb-green-glow: rgba(0,200,83,0.4);
  --bb-purple: #7C3AED; --bb-purple-dark: #5B21B6; --bb-purple-glow: rgba(124,58,237,0.4);
  --bb-gold: #FBBF24; --bb-dark: #0a0a1a; --bb-darker: #050510; --bb-gray: #1a1a2e;
  --bb-light: #f0f2f5; --bb-glass: rgba(255,255,255,0.06); --bb-glass-border: rgba(255,255,255,0.1);
  --bb-radius: 16px;
}
.bb-sr { display: none; }
.bb-sr.bb-show { display: inline !important; }
.bb-hide { display: none !important; }

/* NAV */
.bb-nav { position: sticky; top: 0; z-index: 1000; background: rgba(10,10,26,0.85); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid var(--bb-glass-border); padding: 0 20px; }
.bb-nav-inner { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; height: 64px; }
.bb-nav-brand { font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; text-decoration: none; display: flex; align-items: center; gap: 8px; }
.bb-nav-brand .g { color: var(--bb-green); }
.bb-nav-brand .p { color: var(--bb-purple); text-shadow: 0 0 20px var(--bb-purple-glow); }
.bb-nav-links { display: flex; align-items: center; gap: 4px; }
.bb-nav-links a { color: rgba(255,255,255,0.65); text-decoration: none; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; padding: 8px 14px; border-radius: 8px; transition: all 0.3s; position: relative; }
.bb-nav-links a:hover, .bb-nav-links a.active { color: #fff; background: var(--bb-glass); }
.bb-nav-links a.active::after { content: ''; position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%); width: 20px; height: 2px; background: var(--bb-green); border-radius: 2px; box-shadow: 0 0 8px var(--bb-green-glow); }
.bb-nav-right { display: flex; align-items: center; gap: 8px; }
.bb-lang-btn { padding: 5px 14px; border: 1px solid var(--bb-glass-border); background: transparent; color: rgba(255,255,255,0.5); font-weight: 700; font-size: 11px; cursor: pointer; border-radius: 6px; transition: all 0.3s; text-transform: uppercase; letter-spacing: 1px; font-family: inherit; }
.bb-lang-btn.active { background: var(--bb-green); color: #fff; border-color: var(--bb-green); box-shadow: 0 0 15px var(--bb-green-glow); }
.bb-lang-btn:hover:not(.active) { border-color: rgba(255,255,255,0.3); color: #fff; }
.bb-nav-cta { padding: 8px 20px; background: linear-gradient(135deg, var(--bb-green), var(--bb-green-dark)); color: #fff !important; font-size: 12px !important; font-weight: 700; border-radius: 8px; text-decoration: none; letter-spacing: 1px; text-transform: uppercase; box-shadow: 0 4px 15px var(--bb-green-glow); transition: all 0.3s; }
.bb-nav-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 25px var(--bb-green-glow); }
.bb-hamburger { display: none; background: none; border: none; color: #fff; font-size: 24px; cursor: pointer; padding: 8px; }
.bb-mobile-menu { display: none; position: fixed; top: 64px; left: 0; right: 0; bottom: 0; background: rgba(10,10,26,0.97); backdrop-filter: blur(20px); z-index: 999; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.bb-mobile-menu.open { display: flex; }
.bb-mobile-menu a { color: rgba(255,255,255,0.7); text-decoration: none; font-family: 'Oswald', sans-serif; font-size: 24px; font-weight: 500; text-transform: uppercase; letter-spacing: 3px; padding: 12px 30px; border-radius: 10px; transition: all 0.3s; }
.bb-mobile-menu a:hover { color: var(--bb-green); background: var(--bb-glass); }

/* HERO */
.bb-hero { background: var(--bb-darker); min-height: 90vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; padding: 80px 20px; }
.bb-hero::before { content: ''; position: absolute; top: -30%; right: -20%; width: 800px; height: 800px; background: radial-gradient(circle, var(--bb-purple-glow) 0%, transparent 70%); animation: bb-float 12s ease-in-out infinite; }
.bb-hero::after { content: ''; position: absolute; bottom: -30%; left: -20%; width: 700px; height: 700px; background: radial-gradient(circle, var(--bb-green-glow) 0%, transparent 70%); animation: bb-float 12s ease-in-out infinite reverse; }
@keyframes bb-float { 0%, 100% { transform: translate(0,0) scale(1); } 33% { transform: translate(30px,-30px) scale(1.05); } 66% { transform: translate(-20px,20px) scale(0.95); } }
.bb-hero-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px); background-size: 60px 60px; }
.bb-hero-content { position: relative; z-index: 2; max-width: 900px; text-align: center; }
.bb-hero-tag { display: inline-flex; align-items: center; gap: 8px; background: var(--bb-glass); border: 1px solid var(--bb-glass-border); backdrop-filter: blur(10px); padding: 8px 20px; border-radius: 30px; color: rgba(255,255,255,0.8); font-size: 13px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 30px; }
.bb-hero-tag .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--bb-green); box-shadow: 0 0 10px var(--bb-green-glow); animation: bb-blink 2s ease-in-out infinite; }
@keyframes bb-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
.bb-hero h1 { font-family: 'Oswald', sans-serif; font-size: 80px; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: 6px; line-height: 0.95; margin-bottom: 20px; }
.bb-hero h1 .line1 { display: block; font-size: 28px; font-weight: 400; letter-spacing: 12px; color: rgba(255,255,255,0.5); font-family: 'Inter', sans-serif; margin-bottom: 8px; }
.bb-hero h1 .green { color: var(--bb-green); text-shadow: 0 0 40px var(--bb-green-glow); }
.bb-hero h1 .purple { color: var(--bb-purple); text-shadow: 0 0 40px var(--bb-purple-glow); }
.bb-hero-sub { font-size: 18px; color: rgba(255,255,255,0.55); margin-bottom: 40px; font-weight: 300; max-width: 550px; margin-left: auto; margin-right: auto; line-height: 1.7; }
.bb-hero-cta { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
.bb-hero-scroll { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 2; color: rgba(255,255,255,0.3); font-size: 12px; text-transform: uppercase; letter-spacing: 3px; display: flex; flex-direction: column; align-items: center; gap: 8px; animation: bb-bounce 2s ease-in-out infinite; }
@keyframes bb-bounce { 0%, 100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(8px); } }
.bb-hero-scroll .arrow { font-size: 18px; }

/* BUTTONS */
.bb-btn { display: inline-flex; align-items: center; gap: 8px; padding: 16px 36px; font-size: 14px; font-weight: 700; text-decoration: none; border-radius: 12px; text-transform: uppercase; letter-spacing: 1.5px; transition: all 0.3s; cursor: pointer; border: none; font-family: inherit; }
.bb-btn-green { background: linear-gradient(135deg, var(--bb-green), var(--bb-green-dark)); color: #fff; box-shadow: 0 4px 20px var(--bb-green-glow); }
.bb-btn-green:hover { transform: translateY(-3px); box-shadow: 0 8px 35px var(--bb-green-glow); }
.bb-btn-glass { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); color: #fff; backdrop-filter: blur(10px); }
.bb-btn-glass:hover { background: rgba(255,255,255,0.12); transform: translateY(-3px); }
.bb-btn-purple { background: linear-gradient(135deg, var(--bb-purple), var(--bb-purple-dark)); color: #fff; box-shadow: 0 4px 20px var(--bb-purple-glow); }
.bb-btn-purple:hover { transform: translateY(-3px); box-shadow: 0 8px 35px var(--bb-purple-glow); }
.bb-btn-sm { padding: 10px 24px; font-size: 12px; }

/* STATS */
.bb-stats { background: var(--bb-dark); border-top: 1px solid var(--bb-glass-border); border-bottom: 1px solid var(--bb-glass-border); }
.bb-stats-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); }
.bb-stat { padding: 35px 20px; text-align: center; position: relative; }
.bb-stat:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 20%; height: 60%; width: 1px; background: var(--bb-glass-border); }
.bb-stat-num { font-family: 'Oswald', sans-serif; font-size: 44px; font-weight: 700; display: block; background: linear-gradient(135deg, var(--bb-green), var(--bb-gold)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.bb-stat-label { font-size: 11px; text-transform: uppercase; letter-spacing: 3px; color: rgba(255,255,255,0.4); margin-top: 4px; font-weight: 600; }

/* SECTIONS */
.bb-section { padding: 80px 20px; max-width: 1200px; margin: 0 auto; }
.bb-section-header { margin-bottom: 50px; }
.bb-section-header.center { text-align: center; }
.bb-section-label { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 3px; color: var(--bb-green); margin-bottom: 12px; }
.bb-section-label .line { width: 30px; height: 2px; background: var(--bb-green); border-radius: 2px; }
.bb-section-header h2 { font-family: 'Oswald', sans-serif; font-size: 48px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: var(--bb-dark); line-height: 1.1; }
.bb-section-header p { color: #666; font-size: 17px; margin-top: 12px; max-width: 550px; }
.bb-section-header.center p { margin-left: auto; margin-right: auto; }
.bb-dark-section { background: var(--bb-dark); color: #fff; }
.bb-dark-section .bb-section-header h2 { color: #fff; }
.bb-dark-section .bb-section-header p { color: rgba(255,255,255,0.5); }

/* PAGE HEADER */
.bb-page-header { background: linear-gradient(135deg, var(--bb-darker) 0%, var(--bb-purple-dark) 50%, var(--bb-green-dark) 100%); padding: 80px 20px; text-align: center; position: relative; overflow: hidden; }
.bb-page-header::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px); background-size: 60px 60px; }
.bb-page-header::after { content: ''; position: absolute; top: -50%; right: -30%; width: 600px; height: 600px; background: radial-gradient(circle, var(--bb-purple-glow) 0%, transparent 70%); animation: bb-float 12s ease-in-out infinite; }
.bb-page-header-content { position: relative; z-index: 2; }
.bb-page-header h1 { font-family: 'Oswald', sans-serif; font-size: 56px; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: 4px; margin-bottom: 10px; }
.bb-page-header p { color: rgba(255,255,255,0.6); font-size: 18px; }

/* ABOUT */
.bb-about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.bb-about-text p { color: #555; font-size: 16px; margin-bottom: 16px; line-height: 1.8; }
.bb-about-visual { position: relative; }
.bb-about-card { background: linear-gradient(135deg, var(--bb-dark), var(--bb-gray)); border-radius: var(--bb-radius); height: 380px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; border: 1px solid var(--bb-glass-border); }
.bb-about-card::before { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; background: linear-gradient(135deg, var(--bb-green), transparent, var(--bb-purple)); border-radius: var(--bb-radius); z-index: -1; }
.bb-about-card .emoji { font-size: 100px; }
.bb-about-card .overlay-text { position: absolute; bottom: 20px; left: 20px; right: 20px; font-family: 'Oswald', sans-serif; font-size: 60px; font-weight: 700; text-transform: uppercase; color: rgba(255,255,255,0.06); letter-spacing: 4px; line-height: 1; }
.bb-about-badge { position: absolute; top: -15px; right: 30px; background: var(--bb-green); color: #fff; padding: 10px 20px; border-radius: 10px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; box-shadow: 0 8px 25px var(--bb-green-glow); }

/* GAME CARDS */
.bb-games-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 20px; }
.bb-game-card { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); overflow: hidden; transition: all 0.4s; position: relative; }
.bb-game-card:hover { transform: translateY(-6px); border-color: var(--bb-green); box-shadow: 0 20px 50px rgba(0,200,83,0.15); }
.bb-game-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--bb-green), var(--bb-purple)); }
.bb-game-date { padding: 14px 20px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: var(--bb-green); display: flex; align-items: center; gap: 8px; }
.bb-game-date .pulse { width: 6px; height: 6px; border-radius: 50%; background: var(--bb-green); box-shadow: 0 0 8px var(--bb-green-glow); }
.bb-game-body { padding: 0 20px 20px; }
.bb-game-matchup { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 14px; }
.bb-game-team { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 600; text-transform: uppercase; color: #fff; letter-spacing: 1px; }
.bb-game-vs { font-size: 12px; font-weight: 800; color: var(--bb-purple); background: rgba(124,58,237,0.15); padding: 6px 12px; border-radius: 6px; letter-spacing: 2px; }
.bb-game-meta { font-size: 13px; color: rgba(255,255,255,0.4); display: flex; flex-direction: column; gap: 4px; }

/* FEATURE CARDS */
.bb-features-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.bb-feature-card { background: #fff; border-radius: var(--bb-radius); padding: 35px 30px; position: relative; overflow: hidden; transition: all 0.4s; border: 1px solid #eee; }
.bb-feature-card:hover { transform: translateY(-5px); box-shadow: 0 20px 50px rgba(0,0,0,0.08); border-color: transparent; }
.bb-feature-card::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; border-radius: 0 4px 4px 0; }
.bb-feature-card:nth-child(odd)::before { background: linear-gradient(180deg, var(--bb-green), transparent); }
.bb-feature-card:nth-child(even)::before { background: linear-gradient(180deg, var(--bb-purple), transparent); }
.bb-feature-card .icon { font-size: 36px; margin-bottom: 16px; }
.bb-feature-card h3 { font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 600; text-transform: uppercase; color: var(--bb-dark); margin-bottom: 8px; letter-spacing: 1px; }
.bb-feature-card p { font-size: 14px; color: #777; line-height: 1.7; }
.bb-feature-card .num { position: absolute; top: 15px; right: 20px; font-family: 'Oswald', sans-serif; font-size: 60px; font-weight: 700; color: rgba(0,0,0,0.03); line-height: 1; }
.bb-feature-card.dark { background: var(--bb-gray); border-color: var(--bb-glass-border); }
.bb-feature-card.dark h3 { color: #fff; }
.bb-feature-card.dark p { color: rgba(255,255,255,0.5); }
.bb-feature-card.dark .num { color: rgba(255,255,255,0.04); }

/* CTA */
.bb-cta { position: relative; overflow: hidden; padding: 100px 20px; text-align: center; background: var(--bb-dark); }
.bb-cta::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,200,83,0.1), transparent 50%, rgba(124,58,237,0.1)); }
.bb-cta-content { position: relative; z-index: 2; max-width: 700px; margin: 0 auto; }
.bb-cta h2 { font-family: 'Oswald', sans-serif; font-size: 52px; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 16px; line-height: 1.1; }
.bb-cta h2 .green { color: var(--bb-green); text-shadow: 0 0 30px var(--bb-green-glow); }
.bb-cta p { color: rgba(255,255,255,0.5); font-size: 18px; margin-bottom: 35px; }
.bb-cta-glow { position: absolute; width: 400px; height: 400px; border-radius: 50%; filter: blur(120px); opacity: 0.3; }
.bb-cta-glow.g { background: var(--bb-green); top: -100px; right: -100px; }
.bb-cta-glow.p { background: var(--bb-purple); bottom: -100px; left: -100px; }

/* NEWS */
.bb-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.bb-news-card { background: #fff; border-radius: var(--bb-radius); overflow: hidden; transition: all 0.4s; border: 1px solid #eee; }
.bb-news-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(0,0,0,0.1); border-color: transparent; }
.bb-news-thumb { height: 200px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; font-size: 48px; }
.bb-news-thumb::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 60%; background: linear-gradient(transparent, rgba(0,0,0,0.6)); }
.bb-news-tag { position: absolute; top: 14px; left: 14px; z-index: 2; background: var(--bb-green); color: #fff; padding: 4px 12px; border-radius: 6px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; }
.bb-news-body { padding: 22px; }
.bb-news-date { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: var(--bb-purple); margin-bottom: 8px; }
.bb-news-body h3 { font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 600; color: var(--bb-dark); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; line-height: 1.3; }
.bb-news-body p { font-size: 14px; color: #888; line-height: 1.6; }
.bb-news-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 13px; font-weight: 700; color: var(--bb-green); text-decoration: none; text-transform: uppercase; letter-spacing: 1px; transition: gap 0.3s; }
.bb-news-link:hover { gap: 10px; }

/* FOOTER */
.bb-footer { background: var(--bb-darker); padding: 60px 20px 30px; border-top: 1px solid var(--bb-glass-border); }
.bb-footer-inner { max-width: 1200px; margin: 0 auto; }
.bb-footer-top { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 40px; }
.bb-footer-brand { font-family: 'Oswald', sans-serif; font-size: 28px; font-weight: 700; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 12px; }
.bb-footer-brand .g { color: var(--bb-green); }
.bb-footer-brand .p { color: var(--bb-purple); }
.bb-footer-desc { color: rgba(255,255,255,0.4); font-size: 14px; line-height: 1.7; margin-bottom: 16px; }
.bb-footer-social { display: flex; gap: 10px; }
.bb-footer-social a { width: 40px; height: 40px; border-radius: 10px; background: var(--bb-glass); border: 1px solid var(--bb-glass-border); display: flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; font-size: 16px; transition: all 0.3s; }
.bb-footer-social a:hover { background: var(--bb-green); border-color: var(--bb-green); transform: translateY(-3px); box-shadow: 0 8px 20px var(--bb-green-glow); }
.bb-footer-col h4 { font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; color: #fff; margin-bottom: 16px; }
.bb-footer-col a { display: block; color: rgba(255,255,255,0.4); text-decoration: none; font-size: 14px; padding: 4px 0; transition: all 0.3s; }
.bb-footer-col a:hover { color: var(--bb-green); padding-left: 6px; }
.bb-footer-bottom { border-top: 1px solid var(--bb-glass-border); padding-top: 25px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
.bb-footer-copy { font-size: 13px; color: rgba(255,255,255,0.3); }
.bb-footer-copy a { color: var(--bb-green); text-decoration: none; }

/* TEAM / ROSTER */
.bb-roster-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 20px; }
.bb-player-card { background: #fff; border-radius: var(--bb-radius); overflow: hidden; transition: all 0.4s; border: 1px solid #eee; text-align: center; }
.bb-player-card:hover { transform: translateY(-6px); box-shadow: 0 15px 40px rgba(0,0,0,0.1); }
.bb-player-card.dark { background: var(--bb-gray); border-color: var(--bb-glass-border); }
.bb-player-card.dark .bb-player-info h3 { color: #fff; }
.bb-player-card.dark .bb-player-stat .lbl { color: rgba(255,255,255,0.4); }
.bb-player-photo { height: 200px; display: flex; align-items: center; justify-content: center; font-size: 64px; position: relative; }
.bb-player-number { position: absolute; top: 10px; right: 14px; font-family: 'Oswald', sans-serif; font-size: 36px; font-weight: 700; color: rgba(255,255,255,0.15); }
.bb-player-info { padding: 18px; }
.bb-player-info h3 { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 600; color: var(--bb-dark); margin-bottom: 4px; text-transform: uppercase; letter-spacing: 1px; }
.bb-player-pos { display: inline-block; background: var(--bb-green); color: #fff; padding: 3px 12px; border-radius: 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
.bb-player-stats { display: flex; justify-content: center; gap: 20px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #f0f0f0; }
.bb-player-card.dark .bb-player-stats { border-top-color: var(--bb-glass-border); }
.bb-player-stat { text-align: center; }
.bb-player-stat .val { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 700; color: var(--bb-purple); }
.bb-player-stat .lbl { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #999; }

/* SCHEDULE / STANDINGS */
.bb-standings { width: 100%; border-collapse: collapse; margin-top: 20px; }
.bb-standings th { background: var(--bb-dark); color: #fff; padding: 12px 16px; text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; font-family: 'Oswald', sans-serif; }
.bb-standings td { padding: 12px 16px; border-bottom: 1px solid #eee; font-size: 14px; }
.bb-standings tr:hover { background: rgba(0,200,83,0.04); }
.bb-standings tr.highlight { background: rgba(0,200,83,0.08); font-weight: 700; }
.bb-result-card { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); padding: 20px; margin-bottom: 15px; display: flex; align-items: center; justify-content: space-between; transition: transform 0.3s; }
.bb-result-card:hover { transform: translateX(5px); }
.bb-result-teams { color: #fff; font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 16px; text-transform: uppercase; letter-spacing: 1px; }
.bb-result-info { font-size: 13px; color: rgba(255,255,255,0.4); margin-top: 4px; }
.bb-result-score { font-family: 'Oswald', sans-serif; font-size: 28px; font-weight: 700; }
.bb-result-score.win { color: var(--bb-green); }
.bb-result-score.loss { color: #e74c3c; }

/* GALLERY */
.bb-gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 15px; }
.bb-gallery-item { position: relative; border-radius: var(--bb-radius); overflow: hidden; aspect-ratio: 4/3; cursor: pointer; transition: all 0.3s; border: 1px solid var(--bb-glass-border); }
.bb-gallery-item:hover { transform: scale(1.03); box-shadow: 0 8px 30px rgba(0,0,0,0.3); }
.bb-gallery-item:hover .bb-gallery-overlay { opacity: 1; }
.bb-gallery-bg { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 48px; }
.bb-gallery-overlay { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0,0,0,0.85)); padding: 20px 15px 15px; opacity: 0; transition: opacity 0.3s; }
.bb-gallery-overlay h4 { color: #fff; font-size: 14px; margin-bottom: 3px; }
.bb-gallery-overlay p { color: rgba(255,255,255,0.6); font-size: 12px; }
.bb-featured-gallery { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 250px 250px; gap: 15px; margin-bottom: 40px; }
.bb-featured-gallery .bb-gallery-item:first-child { grid-row: 1 / 3; aspect-ratio: auto; }
.bb-featured-gallery .bb-gallery-item { aspect-ratio: auto; }
.bb-videos { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.bb-video-card { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); overflow: hidden; transition: transform 0.3s; }
.bb-video-card:hover { transform: translateY(-5px); }
.bb-video-thumb { height: 200px; display: flex; align-items: center; justify-content: center; font-size: 64px; position: relative; }
.bb-video-play { position: absolute; width: 60px; height: 60px; background: rgba(255,255,255,0.15); backdrop-filter: blur(10px); border: 1px solid var(--bb-glass-border); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 24px; color: #fff; transition: transform 0.3s; }
.bb-video-card:hover .bb-video-play { transform: scale(1.1); }
.bb-video-body { padding: 15px 20px; }
.bb-video-body h3 { font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 4px; }
.bb-video-body p { font-size: 13px; color: rgba(255,255,255,0.4); }

/* NEWS PAGE */
.bb-news-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 30px; }
.bb-featured-article { display: grid; grid-template-columns: 1.2fr 1fr; gap: 30px; margin-bottom: 50px; background: #fff; border-radius: var(--bb-radius); overflow: hidden; box-shadow: 0 8px 30px rgba(0,0,0,0.08); border: 1px solid #eee; }
.bb-featured-img { min-height: 350px; display: flex; align-items: center; justify-content: center; font-size: 80px; }
.bb-featured-body { padding: 35px 30px; display: flex; flex-direction: column; justify-content: center; }
.bb-featured-tag { display: inline-block; background: linear-gradient(135deg, var(--bb-green), var(--bb-green-dark)); color: #fff; padding: 4px 14px; border-radius: 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 12px; width: fit-content; }
.bb-featured-body h2 { font-family: 'Oswald', sans-serif; font-size: 26px; font-weight: 600; color: var(--bb-dark); margin-bottom: 12px; line-height: 1.3; text-transform: uppercase; }
.bb-featured-body p { color: #666; font-size: 15px; margin-bottom: 15px; }
.bb-featured-meta { font-size: 13px; color: #999; margin-bottom: 15px; }
.bb-sidebar-widget { background: #fff; border-radius: var(--bb-radius); padding: 20px; box-shadow: 0 4px 15px rgba(0,0,0,0.04); margin-bottom: 20px; border: 1px solid #eee; }
.bb-sidebar-widget h3 { font-family: 'Oswald', sans-serif; font-size: 15px; font-weight: 600; text-transform: uppercase; color: var(--bb-dark); margin-bottom: 15px; padding-bottom: 10px; border-bottom: 2px solid var(--bb-green); letter-spacing: 1px; }
.bb-sidebar-list { list-style: none; }
.bb-sidebar-list li { padding: 8px 0; border-bottom: 1px solid #f0f0f0; }
.bb-sidebar-list li:last-child { border-bottom: none; }
.bb-sidebar-list a { color: #555; text-decoration: none; font-size: 14px; transition: color 0.3s; display: block; }
.bb-sidebar-list a:hover { color: var(--bb-green); }
.bb-sidebar-list .date { font-size: 11px; color: #bbb; }
.bb-social-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bb-social-link { display: flex; align-items: center; gap: 8px; padding: 10px; border-radius: 8px; text-decoration: none; color: #fff; font-size: 13px; font-weight: 700; transition: transform 0.3s; }
.bb-social-link:hover { transform: translateY(-2px); }
.bb-social-link.ig { background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045); }
.bb-social-link.fb { background: #1877f2; }
.bb-social-link.yt { background: #ff0000; }
.bb-social-link.tt { background: #000; }

/* SPONSORS */
.bb-sponsor-tier { margin-bottom: 50px; }
.bb-tier-header { text-align: center; margin-bottom: 25px; }
.bb-tier-badge { display: inline-block; padding: 8px 30px; border-radius: 30px; font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; color: #fff; }
.bb-tier-badge.gold { background: linear-gradient(135deg, #D4AF37, #B8960C); }
.bb-tier-badge.silver { background: linear-gradient(135deg, #8E8E8E, #666); }
.bb-tier-badge.bronze { background: linear-gradient(135deg, #CD7F32, #A0522D); }
.bb-sponsors-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 25px; }
.bb-sponsor-card { background: #fff; border-radius: var(--bb-radius); overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.06); transition: all 0.3s; text-align: center; border: 1px solid #eee; }
.bb-sponsor-card:hover { transform: translateY(-5px); box-shadow: 0 8px 30px rgba(0,0,0,0.12); }
.bb-sponsor-card.gold { border-color: var(--bb-gold); }
.bb-sponsor-logo { height: 160px; display: flex; align-items: center; justify-content: center; font-size: 64px; background: var(--bb-light); }
.bb-sponsor-body { padding: 20px; }
.bb-sponsor-body h3 { font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 600; color: var(--bb-dark); margin-bottom: 6px; text-transform: uppercase; }
.bb-sponsor-body p { font-size: 14px; color: #666; margin-bottom: 12px; }
.bb-sponsor-link { display: inline-block; color: var(--bb-green); font-size: 13px; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; }
.bb-sponsor-link:hover { color: var(--bb-purple); }
.bb-benefits { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 25px; }
.bb-benefit { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); padding: 30px 20px; text-align: center; transition: transform 0.3s; }
.bb-benefit:hover { transform: translateY(-5px); }
.bb-benefit .icon { font-size: 40px; margin-bottom: 12px; }
.bb-benefit h3 { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 600; color: #fff; margin-bottom: 8px; text-transform: uppercase; }
.bb-benefit p { font-size: 14px; color: rgba(255,255,255,0.5); }
.bb-pricing { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 25px; }
.bb-price-card { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); overflow: hidden; text-align: center; transition: transform 0.3s; position: relative; }
.bb-price-card:hover { transform: translateY(-5px); }
.bb-price-card.featured { border: 2px solid var(--bb-gold); }
.bb-price-card.featured::before { content: 'BEST VALUE'; position: absolute; top: 0; left: 0; right: 0; background: var(--bb-gold); color: var(--bb-dark); font-size: 11px; font-weight: 800; padding: 6px; letter-spacing: 2px; font-family: 'Oswald', sans-serif; }
.bb-price-header { padding: 30px 20px 15px; }
.bb-price-header h3 { font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 600; text-transform: uppercase; }
.bb-price-card.featured .bb-price-header { padding-top: 45px; }
.bb-price-amount { font-family: 'Oswald', sans-serif; font-size: 42px; font-weight: 700; margin: 10px 0; color: #fff; }
.bb-price-amount span { font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.4); }
.bb-price-features { list-style: none; padding: 0 25px 20px; text-align: left; }
.bb-price-features li { padding: 8px 0; border-bottom: 1px solid var(--bb-glass-border); font-size: 14px; color: rgba(255,255,255,0.6); }
.bb-price-features li::before { content: '\2713 '; color: var(--bb-green); font-weight: 700; }
.bb-price-cta { padding: 0 25px 25px; }

/* CONTACT */
.bb-contact-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.bb-contact-info { display: flex; flex-direction: column; gap: 20px; }
.bb-info-card { background: #fff; border-radius: var(--bb-radius); padding: 25px; box-shadow: 0 4px 15px rgba(0,0,0,0.04); display: flex; gap: 15px; align-items: flex-start; transition: transform 0.3s; border: 1px solid #eee; }
.bb-info-card:hover { transform: translateX(5px); }
.bb-info-icon { width: 50px; height: 50px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 24px; flex-shrink: 0; }
.bb-info-icon.green { background: rgba(0,200,83,0.1); }
.bb-info-icon.purple { background: rgba(124,58,237,0.1); }
.bb-info-text h3 { font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 600; color: var(--bb-dark); margin-bottom: 4px; text-transform: uppercase; }
.bb-info-text p { font-size: 14px; color: #666; }
.bb-info-text a { color: var(--bb-green); text-decoration: none; font-weight: 600; }
.bb-info-text a:hover { color: var(--bb-purple); }
.bb-contact-form { background: #fff; border-radius: var(--bb-radius); padding: 35px; box-shadow: 0 8px 30px rgba(0,0,0,0.08); border: 1px solid #eee; }
.bb-contact-form h3 { font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 600; color: var(--bb-dark); margin-bottom: 20px; text-transform: uppercase; }
.bb-form-group { margin-bottom: 18px; }
.bb-form-group label { display: block; font-size: 12px; font-weight: 700; color: var(--bb-dark); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 6px; }
.bb-form-group input, .bb-form-group textarea, .bb-form-group select { width: 100%; padding: 12px 15px; border: 2px solid #e0e0e0; border-radius: 10px; font-size: 15px; font-family: inherit; transition: border-color 0.3s; background: #fff; color: #333; }
.bb-form-group input:focus, .bb-form-group textarea:focus, .bb-form-group select:focus { outline: none; border-color: var(--bb-green); box-shadow: 0 0 0 3px rgba(0,200,83,0.1); }
.bb-form-group textarea { height: 120px; resize: vertical; }
.bb-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.bb-form-note { font-size: 12px; color: #999; margin-top: 10px; font-style: italic; }
/* Dark form variant */
.bb-form-dark label { color: rgba(255,255,255,0.7); }
.bb-form-dark input, .bb-form-dark textarea, .bb-form-dark select { background: var(--bb-gray); border-color: var(--bb-glass-border); color: #fff; }
.bb-form-dark input:focus, .bb-form-dark textarea:focus, .bb-form-dark select:focus { border-color: var(--bb-green); box-shadow: 0 0 0 3px rgba(0,200,83,0.15); }
.bb-training { background: #fff; border-radius: var(--bb-radius); padding: 25px; box-shadow: 0 4px 15px rgba(0,0,0,0.04); margin-top: 20px; border: 1px solid #eee; }
.bb-training h3 { font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 600; color: var(--bb-dark); margin-bottom: 15px; text-align: center; text-transform: uppercase; }
.bb-training-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.bb-training-slot { background: var(--bb-light); border-radius: 10px; padding: 15px; text-align: center; border-left: 4px solid var(--bb-green); }
.bb-training-slot:nth-child(even) { border-left-color: var(--bb-purple); }
.bb-training-slot .day { font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 15px; color: var(--bb-dark); text-transform: uppercase; }
.bb-training-slot .time { font-size: 14px; color: var(--bb-green); font-weight: 600; }
.bb-training-slot .location { font-size: 12px; color: #888; margin-top: 4px; }
.bb-map-container { border-radius: var(--bb-radius); overflow: hidden; height: 350px; display: flex; align-items: center; justify-content: center; }
.bb-map-placeholder { text-align: center; }
.bb-map-placeholder .icon { font-size: 48px; margin-bottom: 10px; }
.bb-social-section { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; }
.bb-social-card { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); padding: 20px; text-align: center; transition: all 0.3s; text-decoration: none; color: #fff; }
.bb-social-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.2); }
.bb-social-card .icon { font-size: 32px; margin-bottom: 8px; }
.bb-social-card h4 { font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 600; margin-bottom: 4px; text-transform: uppercase; }
.bb-social-card p { font-size: 13px; color: rgba(255,255,255,0.4); }

/* JOIN PAGE */
.bb-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 25px; }
.bb-step { background: #fff; border-radius: var(--bb-radius); padding: 30px 20px; text-align: center; box-shadow: 0 4px 20px rgba(0,0,0,0.04); transition: transform 0.3s; border: 1px solid #eee; }
.bb-step:hover { transform: translateY(-5px); }
.bb-step-num { width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700; color: #fff; margin: 0 auto 15px; }
.bb-step:nth-child(1) .bb-step-num { background: linear-gradient(135deg, var(--bb-green), var(--bb-green-dark)); }
.bb-step:nth-child(2) .bb-step-num { background: linear-gradient(135deg, var(--bb-purple), var(--bb-purple-dark)); }
.bb-step:nth-child(3) .bb-step-num { background: linear-gradient(135deg, var(--bb-green), var(--bb-purple)); }
.bb-step:nth-child(4) .bb-step-num { background: linear-gradient(135deg, var(--bb-gold), #B8960C); }
.bb-step h3 { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 600; color: var(--bb-dark); margin-bottom: 8px; text-transform: uppercase; }
.bb-step p { font-size: 14px; color: #666; }
.bb-requirements { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.bb-req-card { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); padding: 25px; }
.bb-req-card h3 { font-family: 'Oswald', sans-serif; font-size: 20px; font-weight: 600; color: #fff; margin-bottom: 15px; text-transform: uppercase; }
.bb-req-list { list-style: none; }
.bb-req-list li { padding: 8px 0; border-bottom: 1px solid var(--bb-glass-border); font-size: 15px; color: rgba(255,255,255,0.6); display: flex; align-items: center; gap: 10px; }
.bb-req-list li:last-child { border-bottom: none; }
.bb-req-list li::before { content: '\2713'; color: var(--bb-green); font-weight: 700; }
.bb-req-list.cross li::before { content: '\2717'; color: #e74c3c; }
.bb-reg-form { background: var(--bb-glass); border: 1px solid var(--bb-glass-border); border-radius: var(--bb-radius); padding: 40px; max-width: 700px; margin: 0 auto; }
.bb-reg-form h3 { font-family: 'Oswald', sans-serif; font-size: 24px; font-weight: 600; color: #fff; margin-bottom: 25px; text-align: center; text-transform: uppercase; }
.bb-testimonials { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 25px; }
.bb-testimonial { background: #fff; border-radius: var(--bb-radius); padding: 25px; box-shadow: 0 4px 15px rgba(0,0,0,0.04); border-left: 4px solid var(--bb-green); }
.bb-testimonial:nth-child(even) { border-left-color: var(--bb-purple); }
.bb-testimonial p { font-size: 15px; color: #555; font-style: italic; margin-bottom: 12px; line-height: 1.7; }
.bb-testimonial .author { font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 600; color: var(--bb-dark); text-transform: uppercase; }
.bb-testimonial .role { font-size: 12px; color: var(--bb-purple); }
.bb-faq { max-width: 800px; margin: 0 auto; }
.bb-faq-item { background: #fff; border-radius: var(--bb-radius); margin-bottom: 12px; box-shadow: 0 2px 10px rgba(0,0,0,0.03); overflow: hidden; border: 1px solid #eee; }
.bb-faq-q { padding: 18px 20px; font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 16px; color: var(--bb-dark); cursor: pointer; display: flex; justify-content: space-between; align-items: center; transition: background 0.3s; text-transform: uppercase; letter-spacing: 0.5px; }
.bb-faq-q:hover { background: rgba(0,200,83,0.04); }
.bb-faq-q .arrow { font-size: 20px; color: var(--bb-green); transition: transform 0.3s; }
.bb-faq-a { padding: 0 20px 18px; font-size: 15px; color: #666; display: none; }
.bb-faq-item.open .bb-faq-a { display: block; }
.bb-faq-item.open .arrow { transform: rotate(180deg); }

/* RESPONSIVE */
@media (max-width: 900px) {
  .bb-nav-links { display: none; }
  .bb-hamburger { display: block; }
  .bb-hero h1 { font-size: 48px; }
  .bb-hero h1 .line1 { font-size: 20px; letter-spacing: 6px; }
  .bb-about-grid { grid-template-columns: 1fr; }
  .bb-features-grid { grid-template-columns: 1fr; }
  .bb-news-grid { grid-template-columns: 1fr; }
  .bb-footer-top { grid-template-columns: 1fr 1fr; }
  .bb-stats-inner { grid-template-columns: repeat(2, 1fr); }
  .bb-stat:nth-child(2)::after { display: none; }
  .bb-cta h2 { font-size: 36px; }
  .bb-contact-layout { grid-template-columns: 1fr; }
  .bb-requirements { grid-template-columns: 1fr; }
  .bb-news-layout { grid-template-columns: 1fr; }
  .bb-featured-article { grid-template-columns: 1fr; }
  .bb-featured-gallery { grid-template-columns: 1fr; grid-template-rows: auto; }
  .bb-page-header h1 { font-size: 40px; }
}
@media (max-width: 600px) {
  .bb-hero h1 { font-size: 36px; letter-spacing: 3px; }
  .bb-hero h1 .line1 { font-size: 16px; letter-spacing: 4px; }
  .bb-section { padding: 50px 16px; }
  .bb-section-header h2 { font-size: 32px; }
  .bb-games-grid { grid-template-columns: 1fr; }
  .bb-footer-top { grid-template-columns: 1fr; }
  .bb-stats-inner { grid-template-columns: repeat(2, 1fr); }
  .bb-nav-cta { display: none; }
  .bb-form-row { grid-template-columns: 1fr; }
  .bb-gallery-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
  .bb-page-header h1 { font-size: 32px; letter-spacing: 2px; }
}
