.modes-hero{padding:80px 0;position:relative;overflow:hidden}.modes-hero-bg{z-index:0;background:linear-gradient(135deg,#0a1628 0%,#1a2840 50%,#0d1a2a 100%);position:absolute;inset:0}.modes-hero-bg:before{content:"";background:radial-gradient(circle at 20% 80%,#c8aa6e26 0%,#0000 40%),radial-gradient(circle at 80% 20%,#0ac8b91a 0%,#0000 40%);position:absolute;inset:0}.modes-hero-content{z-index:1;text-align:center;position:relative}.modes-hero-title{background:linear-gradient(135deg,#f0e6d2,#c8aa6e,#8a6b33);color:#0000;-webkit-background-clip:text;background-clip:text;margin-bottom:16px;font-size:clamp(2.2rem,4.4vw,3.6rem);font-weight:700}.modes-hero-subtitle{color:var(--text-secondary);margin-bottom:40px;font-size:1.1rem}.modes-hero-stats{justify-content:center;gap:48px;display:flex}.mode-stat{flex-direction:column;align-items:center;display:flex}.mode-stat-number{color:var(--lol-gold);font-size:2.5rem;font-weight:700}.mode-stat-label{color:var(--text-muted);font-size:.875rem}.featured-mode-section{background:linear-gradient(#0a162880,#040c16cc);padding:60px 0}.section-badge{color:var(--lol-gold);background:linear-gradient(135deg,#c8aa6e33,#c8aa6e1a);border:1px solid #c8aa6e4d;border-radius:20px;margin-bottom:24px;padding:6px 16px;font-size:.875rem;display:inline-block}.featured-mode-card{background:linear-gradient(135deg,#10233999,#06101bcc);border:1px solid #c8aa6e40;border-radius:24px;grid-template-columns:1fr 1.5fr;gap:48px;padding:48px;display:grid;position:relative;overflow:hidden}.featured-mode-card:before{content:"";background:linear-gradient(90deg,#0000,#c8aa6e80,#0000);height:1px;position:absolute;top:0;left:0;right:0}.featured-mode-visual{justify-content:center;align-items:center;display:flex;position:relative}.featured-mode-glow{background:radial-gradient(circle,#c8aa6e33 0%,#0000 70%);width:300px;height:300px;animation:3s ease-in-out infinite pulse;position:absolute}.featured-mode-img{z-index:1;filter:drop-shadow(0 20px 40px #00000080);width:200px;height:200px;animation:4s ease-in-out infinite float;position:relative}.featured-mode-particles{z-index:0;position:absolute;inset:0}.featured-mode-particles span{background:var(--lol-gold);border-radius:50%;width:4px;height:4px;animation:2s ease-in-out infinite sparkle;position:absolute}.featured-mode-particles span:first-child{animation-delay:0s;top:20%;left:10%}.featured-mode-particles span:nth-child(2){animation-delay:.3s;top:30%;right:15%}.featured-mode-particles span:nth-child(3){animation-delay:.6s;bottom:25%;left:20%}.featured-mode-particles span:nth-child(4){animation-delay:.9s;bottom:40%;right:10%}.featured-mode-particles span:nth-child(5){animation-delay:1.2s;top:50%;left:5%}.featured-mode-particles span:nth-child(6){animation-delay:1.5s;top:60%;right:20%}@keyframes sparkle{0%,to{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1)}}.featured-mode-info h2{color:var(--lol-gold);margin-bottom:8px;font-size:2.5rem}.featured-mode-badge{color:#0ac8b9;background:#0ac8b933;border-radius:12px;margin-bottom:12px;padding:4px 12px;font-size:.75rem;display:inline-block}.featured-mode-subtitle{color:var(--text-muted);margin-bottom:16px;font-size:1rem}.featured-mode-desc{color:var(--text-secondary);margin-bottom:24px;line-height:1.8}.featured-mode-features{grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:32px;display:grid}.feature-item{color:var(--text-primary);background:#c8aa6e14;border-radius:12px;align-items:center;gap:12px;padding:12px 16px;display:flex}.feature-icon{font-size:1.25rem}.featured-mode-stats{gap:32px;display:flex}.featured-mode-stats .stat-item{text-align:center}.stat-value{color:var(--lol-gold);font-size:1.5rem;font-weight:700;display:block}.stat-name{color:var(--text-muted);font-size:.75rem}.modes-filter-section{padding:40px 0 20px}.modes-filter{flex-wrap:wrap;gap:12px;display:flex}.modes-grid-section{padding:20px 0 60px}.modes-grid-enhanced{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;display:grid}.mode-card-enhanced{background:linear-gradient(135deg,#10233980,#06101bb3);border:1px solid #c8aa6e26;border-radius:20px;transition:all .4s;position:relative;overflow:hidden}.mode-card-enhanced:before{content:"";opacity:0;background:linear-gradient(135deg,#c8aa6e1a,#0000);transition:opacity .4s;position:absolute;inset:0}.mode-card-enhanced:hover{border-color:#c8aa6e66;transform:translateY(-8px);box-shadow:0 20px 40px #0006}.mode-card-enhanced:hover:before{opacity:1}.mode-card-enhanced.archived{opacity:.6}.mode-card-header{z-index:1;justify-content:space-between;align-items:flex-start;padding:24px;display:flex;position:relative}.mode-card-icon{background:radial-gradient(circle at 30% 30%,#c8aa6e33,#0000);border-radius:16px;justify-content:center;align-items:center;width:72px;height:72px;display:flex}.mode-card-icon img{object-fit:contain;filter:drop-shadow(0 4px 8px #0000004d);width:48px;height:48px;transition:transform .3s}.mode-card-enhanced:hover .mode-card-icon img{transform:scale(1.1)rotate(5deg)}.mode-card-icon.hot:after{content:"";border:2px solid #ff6b6b;border-radius:20px;animation:2s infinite pulse-ring;position:absolute;inset:-4px}@keyframes pulse-ring{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.2)}}.mode-card-badge{border-radius:12px;padding:4px 12px;font-size:.75rem;font-weight:600}.mode-card-badge.competitive{color:#0ac8b9;background:#0ac8b933}.mode-card-badge.casual{color:var(--lol-gold);background:#c8aa6e33}.mode-card-badge.rotating{color:#ff6b6b;background:#ff6b6b33}.mode-card-badge.archived{color:#888;background:#64646433}.mode-card-body{z-index:1;padding:0 24px 24px;position:relative}.mode-card-body h3{color:var(--lol-gold);margin-bottom:4px;font-size:1.25rem}.mode-card-subtitle{color:var(--text-muted);margin-bottom:12px;font-size:.875rem}.mode-card-desc{color:var(--text-secondary);margin-bottom:16px;font-size:.9rem;line-height:1.6}.mode-card-meta{flex-wrap:wrap;gap:12px;margin-bottom:16px;display:flex}.mode-card-meta span{color:var(--text-muted);align-items:center;gap:6px;font-size:.8rem;display:flex}.mode-card-footer{border-top:1px solid var(--border-subtle);z-index:1;padding:16px 24px;position:relative}.mode-tags{flex-wrap:wrap;gap:8px;display:flex}.mode-tag{background:var(--accent-soft);color:var(--text-secondary);border-radius:12px;padding:4px 10px;font-size:.75rem}.mode-tag.hot{color:#ff6b6b;background:#ff6b6b33}.modes-comparison-section{background:linear-gradient(#040c1680,#0a1a324d);padding:60px 0}.comparison-table-wrap{overflow-x:auto}.comparison-table{border-collapse:collapse;background:#0b1a2c6b;border-radius:16px;width:100%;overflow:hidden}.comparison-table th,.comparison-table td{text-align:left;border-bottom:1px solid var(--border-subtle);padding:16px 20px}.comparison-table th{background:var(--accent-soft);color:var(--lol-gold);font-weight:600}.comparison-table td{color:var(--text-secondary)}.comparison-table tr:hover td{background:var(--interactive-bg)}.difficulty-bar{background:#c8aa6e33;border-radius:4px;width:80px;height:8px;display:inline-block;position:relative;overflow:hidden}.difficulty-bar:after{content:"";height:100%;width:var(--difficulty);background:linear-gradient(90deg,#0ac8b9,var(--lol-gold));border-radius:4px;position:absolute;top:0;left:0}@media (max-width:1024px){.featured-mode-card{grid-template-columns:1fr}.featured-mode-visual{margin-bottom:32px}}@media (max-width:768px){.modes-hero{padding:60px 0}.modes-hero-stats{flex-direction:column;gap:24px}.featured-mode-card{padding:24px}.featured-mode-features{grid-template-columns:1fr}.featured-mode-stats{flex-wrap:wrap}.modes-grid-enhanced{grid-template-columns:1fr}}