:root{--primary-navy:#0B2240;--primary-red:#D80621;--primary-green:#006847;--accent-gold:#D4AF37;--bg-canvas:#F8FAFC;--bg-card:#FFFFFF;--text-dark:#0F172A;--text-muted:#475569;--border-color:#E2E8F0;--sidebar-width:280px}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background-color:var(--bg-canvas);color:var(--text-dark);overflow-x:hidden}.app-container{display:flex;min-height:100vh}.app-sidebar{width:var(--sidebar-width);background-color:var(--primary-navy);color:#FFFFFF;position:fixed;top:0;bottom:0;left:0;z-index:1030;display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,0.1);transition:all 0.3s ease}.app-main{margin-left:var(--sidebar-width);flex:1;min-width:0;padding:2rem;transition:all 0.3s ease}.sidebar-brand{padding:1.5rem;border-bottom:1px solid rgba(255,255,255,0.1);display:flex;align-items:center;gap:0.75rem}.sidebar-brand img{height:40px;width:auto}.sidebar-brand span{font-size:1.15rem;font-weight:700;letter-spacing:0.5px;color:#FFFFFF}.sidebar-nav{padding:1.5rem 1rem;flex:1;overflow-y:auto}.sidebar-nav .nav-link{color:rgba(255,255,255,0.75);padding:0.75rem 1rem;border-radius:8px;margin-bottom:0.5rem;display:flex;align-items:center;gap:0.75rem;font-weight:500;transition:all 0.2s ease}.sidebar-nav .nav-link:hover,.sidebar-nav .nav-link.active{color:#FFFFFF;background-color:rgba(255,255,255,0.1);border-left:4px solid var(--accent-gold)}.sidebar-footer{padding:1rem;border-top:1px solid rgba(255,255,255,0.1);font-size:0.8rem;color:rgba(255,255,255,0.5)}.mobile-header{display:none;background-color:var(--primary-navy);color:#FFFFFF;padding:0.75rem 1rem;position:sticky;top:0;z-index:1040;justify-content:space-between;align-items:center}.section-title{position:relative;padding-left:1rem;margin-bottom:2rem;font-weight:800;color:var(--primary-navy)}.section-title::before{content:'';position:absolute;left:0;top:15%;height:70%;width:5px;background-color:var(--primary-red);border-radius:4px}.content-card{background-color:var(--bg-card);border-radius:12px;border:1px solid var(--border-color);box-shadow:0 4px 6px -1px rgba(0,0,0,0.05);padding:1.5rem;margin-bottom:2rem;transition:transform 0.2s ease,box-shadow 0.2s ease}.content-card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(0,0,0,0.1)}.hero-banner{position:relative;background:linear-gradient(135deg,#0B2240 0%,#1E3A8A 100%);border-radius:16px;padding:3rem;color:#FFFFFF;overflow:hidden;margin-bottom:2.5rem}.hero-banner::after{content:'';position:absolute;right:0;bottom:0;top:0;width:45%;background:linear-gradient(90deg,transparent,rgba(11,34,64,0.9));z-index:1}.hero-content{position:relative;z-index:2;max-width:60%}.hero-img{position:absolute;right:0;bottom:0;top:0;width:45%;object-fit:cover;opacity:0.85;z-index:0}.match-badge{font-size:0.75rem;padding:0.25rem 0.5rem;border-radius:4px;font-weight:600}.match-badge.live{background-color:rgba(216,6,33,0.1);color:var(--primary-red);border:1px solid var(--primary-red)}.match-badge.upcoming{background-color:rgba(15,23,42,0.08);color:var(--text-dark)}.group-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.25rem}.group-card{background-color:#FFFFFF;border-radius:10px;border-top:4px solid var(--primary-navy);box-shadow:0 2px 4px rgba(0,0,0,0.02)}.group-card.group-us{border-top-color:var(--primary-navy)}.group-card.group-ca{border-top-color:var(--primary-red)}.group-card.group-mx{border-top-color:var(--primary-green)}.table-responsive-custom{overflow-x:auto;-webkit-overflow-scrolling:touch}.faq-item{border-bottom:1px solid var(--border-color);padding:1rem 0}.faq-question{font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.faq-answer{padding-top:0.75rem;color:var(--text-muted);display:none}.faq-item.active .faq-answer{display:block}@media (max-width:1024px){.app-sidebar{transform:translateX(-100%)}.app-sidebar.show{transform:translateX(0)}.app-main{margin-left:0;padding:1.25rem}.mobile-header{display:flex}.hero-banner{padding:1.5rem;background:var(--primary-navy)}.hero-banner::after,.hero-img{display:none}.hero-content{max-width:100%}}