:root{--page-bg:#f8fafc;--surface:#ffffff;--surface-strong:#0f172a;--text-main:#1e293b;--text-muted:#64748b;--accent:#0284c7;--accent-red:#dc2626;--accent-green:#16a34a;--border:#e2e8f0;--card-shadow:0 4px 20px -2px rgba(15,23,42,0.06);--transition-base:all 0.3s cubic-bezier(0.4,0,0.2,1)}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background-color:var(--page-bg);color:var(--text-main);line-height:1.6;overflow-x:hidden}.navbar-custom{background-color:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);transition:var(--transition-base);z-index:1030}.navbar-brand img{max-height:40px;object-fit:contain}.nav-link-custom{font-weight:500;color:var(--text-main) !important;transition:var(--transition-base);position:relative}.nav-link-custom::after{content:'';position:absolute;bottom:-2px;left:50%;width:0;height:2px;background:linear-gradient(90deg,var(--accent-red),var(--accent),var(--accent-green));transition:var(--transition-base);transform:translateX(-50%)}.nav-link-custom:hover::after{width:100%}.section-header{margin-bottom:2.5rem;position:relative}.section-title{font-weight:800;color:var(--surface-strong);letter-spacing:-0.03em;position:relative;display:inline-block;padding-bottom:10px}.section-title::after{content:'';position:absolute;bottom:0;left:0;width:60px;height:4px;background:linear-gradient(90deg,var(--accent-red) 33%,var(--accent) 33%,var(--accent) 66%,var(--accent-green) 66%);border-radius:2px}.custom-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--card-shadow);transition:var(--transition-base);overflow:hidden}.custom-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px -4px rgba(15,23,42,0.12)}.hero-section{padding:8rem 0 5rem;background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 100%);color:#ffffff;position:relative;overflow:hidden}.hero-section::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 80% 20%,rgba(2,132,199,0.15) 0%,transparent 50%);pointer-events:none}.hero-badge{background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);color:#ffffff;padding:6px 16px;border-radius:30px;font-weight:600;font-size:0.9rem;display:inline-flex;align-items:center;gap:8px}.hero-title{font-size:2.8rem;font-weight:800;line-height:1.2;letter-spacing:-0.02em}.hero-desc{color:rgba(255,255,255,0.8);font-size:1.1rem;line-height:1.7}.hero-img-wrapper img{border-radius:12px;box-shadow:0 20px 40px rgba(0,0,0,0.3);border:1px solid rgba(255,255,255,0.1)}.stats-badge{font-size:2rem;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent-red));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.match-card{border-left:4px solid var(--accent);background:var(--surface);padding:1.25rem;border-radius:8px;margin-bottom:1rem;box-shadow:var(--card-shadow)}.match-card.mexico{border-left-color:var(--accent-green)}.match-card.canada{border-left-color:var(--accent-red)}.team-flag-name{display:flex;align-items:center;gap:10px;font-weight:600}.match-status{font-size:0.85rem;padding:3px 8px;border-radius:4px;font-weight:500}.match-status.live{background-color:#fee2e2;color:#ef4444;animation:pulse 2s infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.6}}.group-table{width:100%;border-collapse:separate;border-spacing:0 4px}.group-table th{background:#f1f5f9;color:var(--text-muted);font-weight:600;padding:10px;font-size:0.85rem}.group-table td{background:var(--surface);padding:12px 10px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.group-table tr td:first-child{border-left:1px solid var(--border);border-radius:6px 0 0 6px}.group-table tr td:last-child{border-right:1px solid var(--border);border-radius:0 6px 6px 0}.guide-item{display:flex;gap:1rem;padding:1.25rem;background:var(--surface);border-radius:10px;border:1px solid var(--border);transition:var(--transition-base)}.guide-item:hover{border-color:var(--accent);transform:translateY(-2px)}.guide-icon{font-size:1.75rem;color:var(--accent);flex-shrink:0}.accordion-button:not(.collapsed){background-color:rgba(2,132,199,0.05);color:var(--accent)}.accordion-button:focus{box-shadow:none;border-color:var(--border)}footer{background-color:var(--surface-strong);color:rgba(255,255,255,0.7);padding:4rem 0 2rem;border-top:4px solid var(--accent)}footer a{color:rgba(255,255,255,0.8);text-decoration:none;transition:var(--transition-base)}footer a:hover{color:#ffffff;padding-left:4px}.scroll-x-container{overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;padding-bottom:10px}.scroll-x-container::-webkit-scrollbar{height:6px}.scroll-x-container::-webkit-scrollbar-thumb{background:var(--border);border-radius:10px}