/* ORQUESTA SUAVECITO — DARK COSMIC EDITION */

* { margin:0; padding:0; box-sizing:border-box; }

:root {
  --primary: #FF6B35;
  --primary-dark: #E85A2A;
  --secondary: #00B4D8;
  --accent: #FFD60A;
  --space: #03060F;
  --space-2: #080D1A;
  --space-3: #0D1428;
  --glass: rgba(255,255,255,0.04);
  --glass-border: rgba(255,255,255,0.08);
  --glass-hover: rgba(255,255,255,0.08);
  --white: #FFFFFF;
  --off-white: rgba(255,255,255,0.92);
  --text-dim: rgba(255,255,255,0.65);
  --gradient: linear-gradient(135deg, #FF6B35, #FFD60A);
  --gradient-light: linear-gradient(135deg, rgba(255,255,255,0.95), rgba(255,255,255,0.75));
  --glow-primary: 0 0 30px rgba(255,107,53,0.35);
  --font-primary: 'Poppins', sans-serif;
  --font-display: 'Bebas Neue', sans-serif;
  --font-heading: 'Oswald', sans-serif;
  --transition: all 0.4s cubic-bezier(0.4,0,0.2,1);
  --ease-smooth: cubic-bezier(0.4,0,0.2,1);
  --ease-spring: cubic-bezier(0.34,1.56,0.64,1);
  --shadow: 0 10px 40px rgba(0,0,0,0.4);
  --shadow-lg: 0 20px 60px rgba(0,0,0,0.6);
  --radius-card: 24px;
  --radius-pill: 100px;
}

html { scroll-behavior:smooth; font-size:16px; overflow-x:hidden; }
body { font-family:var(--font-primary); color:var(--off-white); background:var(--space); overflow-x:hidden; line-height:1.6; }
.container { max-width:1200px; margin:0 auto; padding:0 20px; }
.container-fluid { max-width:100%; padding:0 40px; }
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }

/* CANVAS ESPACIAL */
#space-canvas { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; }

/* BARRA DE PROGRESO */
.scroll-progress { position:fixed; top:0; left:0; height:3px; background:var(--gradient); width:0%; z-index:99999; transition:width .1s linear; box-shadow:0 0 16px rgba(255,107,53,.8); }

/* LOADER */
.loader { display:none !important; }

/* NAVBAR */
.navbar-premium { position:fixed; top:0; left:0; width:100%; z-index:9999; padding:20px 0; transition:var(--transition); }
.navbar-premium.scrolled { background:rgba(3,6,15,0.94); backdrop-filter:blur(24px); padding:13px 0; border-bottom:1px solid var(--glass-border); box-shadow:0 4px 30px rgba(0,0,0,.5); }
.nav-wrapper { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.logo-container { flex-shrink:0; }
.nav-logo { height:66px; transition:var(--transition); filter:drop-shadow(0 0 10px rgba(255,107,53,.35)); }
.navbar-premium.scrolled .nav-logo { height:50px; }
.nav-menu-premium { display:flex; list-style:none; gap:30px; align-items:center; margin:0 auto; }
.nav-link-premium { color:var(--off-white); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:2px; position:relative; padding:8px 0; transition:color .3s; }
.nav-link-premium::after { content:''; position:absolute; bottom:0; left:0; width:0; height:2px; background:var(--gradient); border-radius:2px; transition:width .35s var(--ease-spring); }
.nav-link-premium:hover,.nav-link-premium.active { color:var(--primary); }
.nav-link-premium:hover::after,.nav-link-premium.active::after { width:100%; }
.btn-nav-contact { background:var(--gradient); padding:10px 22px !important; border-radius:var(--radius-pill); box-shadow:var(--glow-primary); }
.btn-nav-contact:hover { transform:translateY(-2px); box-shadow:0 0 28px rgba(255,107,53,.7) !important; }
.btn-nav-contact::after { display:none; }
.nav-toggle-premium { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:10px; z-index:10001; }
.nav-toggle-premium span { width:26px; height:2px; background:var(--white); border-radius:2px; transition:var(--transition); display:block; }
.social-nav { display:flex; gap:12px; }
.social-nav-icon { width:38px; height:38px; border-radius:50%; background:var(--glass); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; color:var(--white); transition:var(--transition); }
.social-nav-icon:hover { background:var(--primary); border-color:var(--primary); transform:translateY(-3px); box-shadow:var(--glow-primary); }

/* HERO */
.hero-premium { position:relative; height:100vh; min-height:700px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hero-media-container { position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; }
.hero-video { width:100%; height:100%; object-fit:cover; opacity:1; }
.hero-overlay-gradient { position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(135deg, rgba(3,6,15,0.65), rgba(255,107,53,0.2)); }
.hero-overlay-pattern { position:absolute; top:0; left:0; width:100%; height:100%; background-image:radial-gradient(circle, rgba(255,255,255,0.03) 1px, transparent 1px); background-size:40px 40px; }
.hero-content-premium { position:relative; z-index:2; text-align:center; color:var(--white); max-width:1000px; margin:0 auto; padding:0 20px; }
.hero-title-premium { margin-bottom:30px; }
.title-super { 
  display:block; 
  font-family:var(--font-heading); 
  font-size:2.2rem; 
  letter-spacing:12px; 
  margin-bottom:20px; 
  opacity:1;
  color:var(--accent);
  text-transform:uppercase;
  font-weight:700;
  animation:fadeInDown 1s ease-out 0.3s both;
  text-shadow:0 0 20px rgba(255,214,10,0.5);
}
.title-main-premium { 
  display:block; 
  font-family:var(--font-display); 
  font-size:9.5rem; 
  letter-spacing:20px; 
  line-height:0.95; 
  margin-bottom:10px; 
  text-shadow:0 5px 40px rgba(0,0,0,0.8), 0 0 60px rgba(255,107,53,0.4);
  animation:fadeInUp 1s ease-out 0.5s both, pulseGlow 3s ease-in-out 1.5s infinite;
  color:var(--white);
  font-weight:400;
}
.title-brand { 
  display:block; 
  font-family:var(--font-display); 
  font-size:9.5rem; 
  letter-spacing:20px; 
  line-height:0.95;
  background:var(--gradient); 
  -webkit-background-clip:text; 
  -webkit-text-fill-color:transparent; 
  background-clip:text;
  background-size:200% 200%;
  animation:fadeInUp 1s ease-out 0.7s both, gradientShift 4s ease infinite;
  filter:drop-shadow(0 0 30px rgba(255,107,53,0.6));
  font-weight:400;
}

@keyframes fadeInDown {
  from { opacity:0; transform:translateY(-30px); }
  to { opacity:1; transform:translateY(0); }
}

@keyframes fadeInUp {
  from { opacity:0; transform:translateY(40px) scale(0.95); }
  to { opacity:1; transform:translateY(0) scale(1); }
}

@keyframes pulseGlow {
  0%, 100% { text-shadow:0 5px 40px rgba(0,0,0,0.8), 0 0 60px rgba(255,107,53,0.4); }
  50% { text-shadow:0 5px 40px rgba(0,0,0,0.8), 0 0 80px rgba(255,107,53,0.7), 0 0 100px rgba(255,214,10,0.3); }
}

@keyframes gradientShift {
  0%, 100% { background-position:0% 50%; }
  50% { background-position:100% 50%; }
}
.hero-stats { display:flex; gap:50px; justify-content:center; margin-bottom:50px; flex-wrap:wrap; }
.stat-hero { text-align:center; }
.stat-hero-number { display:block; font-family:var(--font-display); font-size:3rem; background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.stat-hero-label { display:block; font-size:0.9rem; text-transform:uppercase; letter-spacing:1px; opacity:0.8; margin-top:5px; }
.hero-buttons { display:flex; gap:20px; justify-content:center; flex-wrap:wrap; }
.btn-premium { display:inline-flex; align-items:center; gap:15px; padding:18px 40px; font-weight:600; border-radius:var(--radius-pill); transition:var(--transition); font-size:16px; text-transform:uppercase; letter-spacing:1px; cursor:pointer; border:none; position:relative; overflow:hidden; }
.btn-premium::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); transition:left .6s; }
.btn-premium:hover::before { left:100%; }
.btn-primary-premium { background:var(--gradient); color:var(--white); box-shadow:var(--glow-primary); }
.btn-primary-premium:hover { transform:translateY(-5px); box-shadow:0 0 40px rgba(255,107,53,0.6); }
.btn-outline-premium { background:transparent; color:var(--white); border:2px solid var(--white); }
.btn-outline-premium:hover { background:var(--white); color:var(--primary); transform:translateY(-5px); }
.arrow-icon { font-size:20px; transition:var(--transition); }
.btn-premium:hover .arrow-icon { transform:translateX(5px); }
.hero-particles { display:none; }

/* SECCIONES */
section { padding:120px 0; position:relative; z-index:1; }
.section-label { display:inline-block; background:transparent; color:var(--primary); border:2px solid var(--primary); padding:8px 20px; border-radius:20px; font-size:11px; text-transform:uppercase; letter-spacing:2.5px; font-weight:700; margin-bottom:20px; }
.section-title-premium { font-family:var(--font-display); font-size:3.8rem; letter-spacing:5px; line-height:1.2; margin-bottom:20px; color:var(--white); }
.text-gradient { background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.text-gradient-light { background:var(--gradient-light); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.section-description { font-size:1.1rem; color:var(--text-dim); max-width:700px; line-height:1.8; }
.section-header-center { text-align:center; margin-bottom:80px; }
.text-white { color:var(--white) !important; }
.text-light { color:rgba(255,255,255,0.8) !important; }

/* CARRUSEL GIRA 2026 - MÁS RÁPIDO Y MÁS DELGADO */
.gira-section { background:var(--space); border-top:1px solid var(--glass-border); border-bottom:1px solid var(--glass-border); padding:80px 0; }
.gira-marquee-wrapper { overflow:hidden; margin:50px 0; background:rgba(255,107,53,0.08); border-top:1px solid rgba(255,107,53,0.2); border-bottom:1px solid rgba(255,107,53,0.2); padding:12px 0; }
.gira-marquee { display:flex; gap:50px; animation:marquee 12s linear infinite; white-space:nowrap; }
.gira-marquee:hover { animation-play-state:paused; }
@keyframes marquee { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }
.marquee-item { font-family:var(--font-display); font-size:1.8rem; letter-spacing:6px; color:var(--primary); display:flex; align-items:center; gap:20px; }
.marquee-item span { color:var(--accent); font-size:1.2rem; }
.carousel-wrapper { position:relative; overflow:hidden; margin:50px 0 30px; }
.carousel-track { display:flex; gap:18px; transition:transform .5s var(--ease-smooth); }
.carousel-slide { flex:0 0 260px; height:360px; border-radius:var(--radius-card); overflow:hidden; position:relative; background:var(--space-3); border:1px solid var(--glass-border); transition:var(--transition); cursor:pointer; }
.carousel-slide:hover { transform:translateY(-8px); border-color:var(--primary); box-shadow:0 0 40px rgba(255,107,53,0.4); }
.carousel-slide-tag { position:absolute; top:12px; right:12px; background:var(--gradient); color:var(--white); padding:5px 12px; border-radius:16px; font-size:10px; font-weight:700; letter-spacing:1px; z-index:3; }
.carousel-slide-img { width:100%; height:160px; object-fit:cover; }
.carousel-slide-overlay { position:absolute; top:0; left:0; width:100%; height:160px; background:linear-gradient(to bottom, transparent, var(--space-3)); }
.carousel-slide-content { padding:18px; position:absolute; bottom:0; left:0; right:0; }
.carousel-slide-date { display:inline-block; background:rgba(255,107,53,0.2); color:var(--primary); padding:5px 12px; border-radius:10px; font-size:11px; font-weight:700; letter-spacing:1.5px; margin-bottom:10px; }
.carousel-slide-content h3 { font-size:1.2rem; color:var(--white); margin-bottom:6px; font-weight:700; }
.carousel-slide-content p { font-size:0.85rem; color:var(--text-dim); }
.carousel-controls { display:flex; align-items:center; justify-content:center; gap:20px; }
.carousel-btn { width:50px; height:50px; background:var(--glass); border:2px solid var(--primary); color:var(--primary); border-radius:50%; cursor:pointer; font-size:2rem; display:flex; align-items:center; justify-content:center; transition:var(--transition); }
.carousel-btn:hover { background:var(--primary); color:var(--white); transform:scale(1.1); box-shadow:var(--glow-primary); }
.carousel-dots { display:flex; gap:10px; }
.carousel-dot { width:12px; height:12px; border-radius:50%; background:var(--glass); border:2px solid var(--glass-border); cursor:pointer; transition:var(--transition); }
.carousel-dot.active { width:32px; border-radius:10px; background:var(--gradient); border-color:var(--primary); }

/* ABOUT */
.about-premium { background:var(--space-2); border-top:1px solid var(--glass-border); }
.about-grid-premium { display:grid; grid-template-columns:1.2fr 1fr; gap:80px; align-items:center; }
.about-description { font-size:1.1rem; line-height:1.8; margin-bottom:25px; color:var(--text-dim); }
.about-features { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin:40px 0; }
.feature-item { display:flex; gap:15px; align-items:flex-start; background:var(--glass); border:1px solid var(--glass-border); border-radius:16px; padding:18px; transition:var(--transition); }
.feature-item:hover { border-color:var(--primary); background:var(--glass-hover); transform:translateY(-3px); }
.feature-icon { font-size:2rem; flex-shrink:0; }
.feature-text h4 { font-size:1.1rem; margin-bottom:5px; color:var(--white); }
.feature-text p { font-size:0.9rem; color:var(--text-dim); }
.about-image-main { position:relative; border-radius:30px; overflow:hidden; box-shadow:var(--shadow-lg); }
.image-decoration-circle { position:absolute; top:-30px; right:-30px; width:200px; height:200px; border:4px solid var(--primary); border-radius:50%; z-index:-1; animation:orbit 20s linear infinite; }
@keyframes orbit { 0%,100% { transform:rotate(0deg); } 50% { transform:rotate(180deg); } }
.about-floating-card { position:absolute; bottom:-30px; right:-30px; background:var(--space-3); border:1px solid var(--glass-border); backdrop-filter:blur(16px); padding:30px; border-radius:20px; box-shadow:var(--shadow); }
.floating-number { display:block; font-family:var(--font-display); font-size:3.5rem; background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; line-height:1; }
.floating-text { display:block; font-size:0.9rem; text-transform:uppercase; letter-spacing:1px; color:var(--text-dim); margin-top:5px; }

/* TIMELINE */
.history-section { background:var(--space-2); border-top:1px solid var(--glass-border); }
.timeline { position:relative; max-width:1200px; margin:0 auto; }
.timeline::before { content:''; position:absolute; left:50%; transform:translateX(-50%); width:3px; height:100%; background:linear-gradient(to bottom, transparent, rgba(255,107,53,0.45), transparent); }
.timeline-item { display:grid; grid-template-columns:1fr 80px 1fr; gap:40px; margin-bottom:80px; align-items:center; }
.timeline-item:nth-child(even) { grid-template-areas:"content year image"; }
.timeline-item:nth-child(odd) { grid-template-areas:"image year content"; }
.timeline-year { grid-area:year; width:80px; height:80px; background:var(--gradient); border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:1.5rem; color:var(--white); z-index:2; box-shadow:0 0 0 5px var(--space-2), var(--glow-primary); animation:ring-pulse 3s ease-in-out infinite; }
@keyframes ring-pulse { 0%,100% { box-shadow:0 0 0 5px var(--space-2), 0 0 0 8px rgba(255,107,53,0.3), var(--glow-primary); } 50% { box-shadow:0 0 0 5px var(--space-2), 0 0 0 14px rgba(255,107,53,0.1), var(--glow-primary); } }
.timeline-content { display:contents; }
.timeline-image { grid-area:image; border-radius:20px; overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--glass-border); }
.timeline-image img { width:100%; height:420px; object-fit:cover; transition:var(--transition); }
.timeline-image:hover img { transform:scale(1.05); }
.timeline-text { grid-area:content; }
.timeline-text h3 { font-size:2rem; margin-bottom:15px; color:var(--white); }
.timeline-text p { line-height:1.8; color:var(--text-dim); }

/* ARTISTAS */
.artists-section { background:var(--space); border-top:1px solid var(--glass-border); }
.artists-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:30px; }
.artist-card { position:relative; border-radius:20px; overflow:hidden; box-shadow:var(--shadow); transition:var(--transition); background:var(--space-3); border:1px solid var(--glass-border); }
.artist-card:hover { transform:translateY(-10px); box-shadow:0 0 40px rgba(255,107,53,0.4); border-color:var(--primary); }
.artist-image-wrapper { position:relative; overflow:hidden; aspect-ratio:3/4; }
.artist-image-wrapper img { width:100%; height:100%; object-fit:cover; transition:var(--transition); filter:brightness(0.85) saturate(1.1); }
.artist-card:hover .artist-image-wrapper img { transform:scale(1.1); filter:brightness(1) saturate(1.3); }
.artist-card.active .artist-image-wrapper img { transform:scale(1.1); filter:brightness(1) saturate(1.3); }
.artist-overlay { position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,107,53,0.95); display:flex; align-items:center; justify-content:center; opacity:0; transition:var(--transition); }
.artist-card:hover .artist-overlay { opacity:1; }
.artist-card.active .artist-overlay { opacity:1; }
.artist-social { display:flex; gap:15px; }
.artist-social a { width:50px; height:50px; background:var(--white); color:var(--primary); display:flex; align-items:center; justify-content:center; border-radius:50%; transition:var(--transition); font-size:20px; }
.artist-social a:hover { transform:scale(1.2) rotate(360deg); }
.artist-info { padding:25px; text-align:center; }
.artist-name { font-size:1.3rem; margin-bottom:5px; color:var(--white); }
.artist-role { font-size:0.9rem; color:var(--text-dim); text-transform:uppercase; letter-spacing:1px; }

/* EVENTOS */
.events-premium { background:var(--space-3); position:relative; overflow:hidden; border-top:1px solid var(--glass-border); }
.events-bg-pattern { position:absolute; top:0; left:0; width:100%; height:100%; background-image:radial-gradient(circle at 20% 50%, rgba(255,107,53,0.08) 0%, transparent 50%), radial-gradient(circle at 80% 80%, rgba(0,180,216,0.08) 0%, transparent 50%); }
.events-grid-premium { display:grid; grid-template-columns:1.5fr 1fr; gap:40px; margin-bottom:60px; }
.event-card-featured { position:relative; border-radius:30px; overflow:hidden; background:var(--space-2); box-shadow:var(--shadow-lg); border:1px solid var(--glass-border); }
.event-featured-badge { position:absolute; top:20px; right:20px; background:var(--gradient); color:var(--white); padding:10px 20px; border-radius:20px; font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:1px; z-index:2; }
.event-featured-image { position:relative; height:300px; background:var(--space-2); }
.event-featured-image img { width:100%; height:100%; object-fit:cover; }
.event-featured-overlay { position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(to bottom, transparent, rgba(8,13,26,0.9)); }
.event-featured-content { padding:40px; display:flex; gap:30px; align-items:flex-start; }
.event-date-large { display:flex; flex-direction:column; align-items:center; background:var(--gradient); padding:20px; border-radius:15px; min-width:100px; color:var(--white); }
.event-date-large .day { font-family:var(--font-display); font-size:3rem; line-height:1; }
.event-date-large .month { font-size:1rem; text-transform:uppercase; font-weight:700; }
.event-info-large { flex:1; }
.event-info-large h3 { font-size:2rem; color:var(--white); margin-bottom:15px; }
.event-details-row { display:flex; gap:30px; margin-bottom:15px; flex-wrap:wrap; }
.event-detail { color:rgba(255,255,255,0.8); display:flex; align-items:center; gap:8px; font-size:14px; }
.event-description { color:rgba(255,255,255,0.7); line-height:1.8; margin-bottom:20px; }
.btn-small { padding:12px 30px; font-size:14px; }
.events-list-premium { display:flex; flex-direction:column; gap:20px; }
.event-card-compact { background:var(--space-2); padding:25px; border-radius:15px; display:flex; align-items:center; gap:20px; transition:var(--transition); border:1px solid var(--glass-border); }
.event-card-compact:hover { transform:translateX(10px); border-color:var(--primary); box-shadow:var(--glow-primary); }
.event-date-compact { display:flex; flex-direction:column; align-items:center; background:rgba(255,107,53,0.15); padding:15px; border-radius:10px; min-width:70px; color:var(--white); border:1px solid rgba(255,107,53,0.3); }
.day-compact { font-family:var(--font-display); font-size:2rem; line-height:1; }
.month-compact { font-size:0.9rem; text-transform:uppercase; }
.event-info-compact { flex:1; }
.event-info-compact h4 { color:var(--white); margin-bottom:5px; font-size:1.2rem; }
.event-info-compact p { color:rgba(255,255,255,0.7); font-size:0.9rem; }
.event-btn-arrow { width:40px; height:40px; background:var(--primary); color:var(--white); display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:1.5rem; transition:var(--transition); text-decoration:none; }
.event-btn-arrow:hover { transform:scale(1.2) rotate(360deg); box-shadow:var(--glow-primary); }
.events-footer { text-align:center; }
.events-footer p { color:rgba(255,255,255,0.8); font-size:1.2rem; margin-bottom:20px; }
.btn-outline-light-premium { background:transparent; color:var(--white); border:2px solid var(--white); }
.btn-outline-light-premium:hover { background:var(--white); color:var(--primary); }

/* MÚSICA */
.music-premium { background:linear-gradient(135deg, var(--space), var(--space-3)); color:var(--white); border-top:1px solid var(--glass-border); }
.music-player-premium { background:var(--glass); border:1px solid var(--glass-border); border-radius:30px; padding:60px; backdrop-filter:blur(16px); display:grid; grid-template-columns:2fr 1fr; gap:60px; }
.player-visual-area { display:flex; gap:40px; align-items:center; justify-content:center; margin-bottom:40px; }
.album-art { position:relative; width:250px; height:250px; border-radius:20px; overflow:hidden; box-shadow:var(--shadow-lg); }
.album-art.playing { animation:float-album 3s ease-in-out infinite; }
@keyframes float-album { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
.album-art img { width:100%; height:100%; object-fit:cover; }
.album-art-glow { position:absolute; inset:-20px; background:var(--gradient); opacity:0.3; filter:blur(30px); z-index:-1; }
.visualizer { width:200px; height:200px; background:rgba(255,255,255,0.03); border-radius:15px; display:flex; align-items:center; justify-content:center; border:1px solid var(--glass-border); }
.visualizer canvas { width:100%; height:100%; }
.now-playing { text-align:center; margin-bottom:30px; }
.now-playing h3 { font-size:1.8rem; margin-bottom:10px; }
.now-playing p { color:rgba(255,255,255,0.7); }
.progress-container { display:flex; align-items:center; gap:15px; margin-bottom:30px; }
.time-current,.time-total { font-size:14px; color:rgba(255,255,255,0.7); min-width:45px; }
.progress-bar-premium { flex:1; height:6px; background:rgba(255,255,255,0.15); border-radius:3px; position:relative; cursor:pointer; }
.progress-fill { height:100%; background:var(--gradient); border-radius:3px; width:0%; transition:width .1s linear; }
.progress-dot { position:absolute; top:50%; transform:translate(-50%, -50%); width:14px; height:14px; background:var(--white); border-radius:50%; box-shadow:0 2px 8px rgba(0,0,0,0.3); left:0%; transition:left .1s linear; }
.player-buttons { display:flex; gap:20px; justify-content:center; align-items:center; }
.btn-player { background:var(--glass); border:2px solid var(--primary); color:var(--white); width:50px; height:50px; border-radius:50%; cursor:pointer; transition:var(--transition); display:flex; align-items:center; justify-content:center; }
.btn-player:hover { background:var(--primary); transform:scale(1.1); box-shadow:var(--glow-primary); }
.btn-play { width:70px; height:70px; }
.playlist-title { font-size:1.5rem; margin-bottom:25px; }
.playlist-item { display:flex; align-items:center; gap:15px; padding:15px; background:var(--glass); border-radius:10px; margin-bottom:10px; cursor:pointer; transition:var(--transition); border:1px solid transparent; }
.playlist-item:hover,.playlist-item.active { background:rgba(255,107,53,0.15); border-color:rgba(255,107,53,0.4); }
.playlist-item-number { font-weight:700; color:var(--primary); font-size:1.2rem; width:30px; }
.playlist-item-info { flex:1; }
.playlist-item-info h4 { font-size:1rem; margin-bottom:3px; }
.playlist-item-info p { font-size:0.85rem; color:rgba(255,255,255,0.6); }
.playlist-item-duration { color:rgba(255,255,255,0.6); font-size:0.9rem; }

/* GALERÍA */
.gallery-premium { background:var(--space-2); border-top:1px solid var(--glass-border); }
.gallery-masonry { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:20px; grid-auto-rows:250px; grid-auto-flow:dense; }
.gallery-item-premium { position:relative; border-radius:15px; overflow:hidden; cursor:pointer; transition:var(--transition); border:1px solid var(--glass-border); }
.gallery-item-premium:hover { transform:scale(1.02); box-shadow:0 0 40px rgba(255,107,53,0.4); border-color:var(--primary); }
.gallery-tall { grid-row:span 2; }
.gallery-wide { grid-column:span 2; }
.gallery-item-premium img { width:100%; height:100%; object-fit:cover; transition:var(--transition); filter:saturate(0.7); }
.gallery-item-premium:hover img { filter:saturate(1.2); }
.gallery-overlay-premium { position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,107,53,0.9); display:flex; align-items:center; justify-content:center; opacity:0; transition:var(--transition); }
.gallery-item-premium:hover .gallery-overlay-premium { opacity:1; }
.gallery-zoom { font-size:4rem; color:var(--white); }
.gallery-cta { text-align:center; margin-top:60px; }

/* LIGHTBOX */
.lightbox-premium { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.95); z-index:99999; display:none; align-items:center; justify-content:center; }
.lightbox-premium.active { display:flex; }
.lightbox-premium img { max-width:90vw; max-height:90vh; border-radius:10px; }
.lightbox-close { position:absolute; top:30px; right:30px; background:none; border:none; color:var(--white); font-size:3rem; cursor:pointer; z-index:100000; }
.lightbox-nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,0.2); border:none; color:var(--white); font-size:3rem; padding:20px; cursor:pointer; transition:var(--transition); border-radius:5px; }
.lightbox-nav:hover { background:rgba(255,255,255,0.4); }
.lightbox-prev { left:30px; }
.lightbox-next { right:30px; }

/* CONTACTO */
.contact-premium { background:var(--space); border-top:1px solid var(--glass-border); }
.contact-cards { display:grid; grid-template-columns:repeat(3, 1fr); gap:25px; margin-bottom:60px; }
.contact-card { background:var(--glass); border:2px solid var(--glass-border); border-radius:20px; padding:40px 25px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:8px; transition:var(--transition); box-shadow:var(--shadow); backdrop-filter:blur(16px); }
.contact-card:hover { border-color:var(--primary); transform:translateY(-8px); box-shadow:0 0 40px rgba(255,107,53,0.4); }
.contact-card-icon { width:65px; height:65px; background:var(--gradient); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--white); margin-bottom:10px; flex-shrink:0; }
.contact-card h4 { font-size:1.2rem; color:var(--white); margin-bottom:4px; font-weight:700; }
.contact-card a,.contact-card span { color:var(--text-dim); font-size:0.95rem; line-height:1.8; display:block; transition:var(--transition); }
.contact-card a:hover { color:var(--primary); }
.contact-social-block { text-align:center; padding-top:20px; }
.contact-social-block h4 { font-size:1.2rem; color:var(--white); margin-bottom:25px; }

/* AGENCIAS MUSICALES */
.agencies-container { display:flex; gap:30px; justify-content:center; margin-bottom:50px; flex-wrap:wrap; }
.agency-card { 
  width:200px; 
  height:120px; 
  background:var(--glass); 
  border:2px solid var(--glass-border); 
  border-radius:25px; 
  padding:15px; 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  transition:var(--transition); 
  backdrop-filter:blur(16px);
  box-shadow:var(--shadow);
  animation:float 4s ease-in-out infinite;
}
.agency-card:nth-child(2) { animation-delay:2s; }
.agency-card:hover { 
  transform:translateY(-8px) scale(1.05); 
  border-color:var(--primary); 
  box-shadow:0 0 40px rgba(255,107,53,0.5); 
}
.agency-logo { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.agency-logo img { max-width:100%; max-height:100%; object-fit:contain; filter:brightness(0.9); transition:var(--transition); }
.agency-card:hover .agency-logo img { filter:brightness(1.1); }

@keyframes float {
  0%, 100% { transform:translateY(0); }
  50% { transform:translateY(-15px); }
}

.contact-social-row { display:flex; gap:15px; justify-content:center; flex-wrap:wrap; }
.social-icon-large { width:52px; height:52px; background:var(--primary); color:var(--white); display:flex; align-items:center; justify-content:center; border-radius:14px; transition:var(--transition); }
.social-icon-large:hover { background:var(--primary-dark); transform:translateY(-5px); box-shadow:var(--glow-primary); }

/* FOOTER */
.footer-premium { background:var(--space-3); color:var(--white); padding:80px 0 30px; position:relative; border-top:1px solid var(--glass-border); }
.footer-wave { position:absolute; top:0; left:0; width:100%; overflow:hidden; line-height:0; }
.footer-wave svg { position:relative; display:block; width:calc(100% + 1.3px); height:80px; }
.footer-wave path { fill:var(--space); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:60px; margin-bottom:60px; }
.footer-logo { height:80px; margin-bottom:20px; }
.footer-slogan { color:rgba(255,255,255,0.7); margin-bottom:30px; line-height:1.6; }
.footer-apps { display:flex; gap:15px; flex-wrap:wrap; }
.app-badge img { height:45px; }
.footer-links-group h4 { font-size:1.3rem; margin-bottom:25px; }
.footer-links-group ul { list-style:none; }
.footer-links-group li { margin-bottom:12px; }
.footer-links-group a { color:rgba(255,255,255,0.7); transition:var(--transition); }
.footer-links-group a:hover { color:var(--primary); padding-left:5px; }
.footer-social { display:flex; gap:12px; flex-wrap:wrap; }
.footer-social a { width:45px; height:45px; background:var(--glass); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; border-radius:10px; transition:var(--transition); color:var(--white); }
.footer-social a:hover { background:var(--primary); border-color:var(--primary); transform:translateY(-5px); box-shadow:var(--glow-primary); }
.footer-bottom { padding-top:30px; border-top:1px solid var(--glass-border); display:flex; justify-content:space-between; align-items:center; color:rgba(255,255,255,0.5); }
.footer-legal-links { display:flex; gap:25px; }
.footer-legal-links a { color:rgba(255,255,255,0.5); transition:var(--transition); }
.footer-legal-links a:hover { color:var(--primary); }

/* BACK TO TOP */
.back-to-top-premium { position:fixed; bottom:30px; right:30px; width:55px; height:55px; background:var(--gradient); color:var(--white); border:none; border-radius:50%; cursor:pointer; box-shadow:var(--glow-primary); opacity:0; visibility:hidden; transition:var(--transition); display:flex; align-items:center; justify-content:center; z-index:9998; }
.back-to-top-premium.visible { opacity:1; visibility:visible; }
.back-to-top-premium:hover { transform:translateY(-5px); box-shadow:0 0 40px rgba(255,107,53,0.6); }

/* AOS */
[data-aos] { opacity:0; transition:opacity .8s var(--ease-smooth), transform .8s var(--ease-smooth); }
[data-aos].aos-animate { opacity:1; }
[data-aos="fade-up"] { transform:translateY(40px); }
[data-aos="fade-up"].aos-animate { transform:translateY(0); }
[data-aos="fade-right"] { transform:translateX(-40px); }
[data-aos="fade-right"].aos-animate { transform:translateX(0); }
[data-aos="fade-left"] { transform:translateX(40px); }
[data-aos="fade-left"].aos-animate { transform:translateX(0); }

/* RESPONSIVE */
@media (max-width: 1200px) {
  .events-grid-premium { grid-template-columns:1fr; }
  .music-player-premium { grid-template-columns:1fr; }
  .gallery-masonry { grid-template-columns:repeat(3, 1fr); }
}

@media (max-width: 968px) {
  .about-grid-premium,.footer-grid { grid-template-columns:1fr; }
  .about-features { grid-template-columns:1fr; }
  .player-visual-area { flex-direction:column; }
  .timeline::before { left:30px; }
  .timeline-item,.timeline-item:nth-child(even) { display:flex; flex-direction:column; padding-left:70px; position:relative; gap:20px; margin-bottom:60px; }
  .timeline-year { position:absolute; left:0; top:0; width:60px; height:60px; font-size:1rem; }
  .timeline-content { display:flex; flex-direction:column; gap:20px; }
  .timeline-image,.timeline-text { grid-area:unset; }
  .timeline-image img { height:260px; }
  .timeline-text h3 { font-size:1.6rem; }
}

@media (max-width: 768px) {
  .nav-toggle-premium { display:flex; }
  .logo-container { max-width:55vw; }
  .nav-logo { height:48px !important; }
  .social-nav { display:none; }
  .nav-menu-premium { position:fixed; top:0; left:-100%; width:100%; height:100vh; background:var(--space); flex-direction:column; padding:100px 30px 40px; transition:var(--transition); z-index:10000; overflow-y:auto; }
  .nav-menu-premium.active { left:0; }
  .title-super { font-size:1.1rem; letter-spacing:4px; margin-bottom:12px; }
  .title-main-premium,.title-brand { font-size:4rem; letter-spacing:6px; }
  .hero-stats { gap:20px; }
  .stat-hero-number { font-size:2rem; }
  section { padding:70px 0; }
  .section-title-premium { font-size:2.2rem; letter-spacing:3px; }
  .artists-grid { grid-template-columns:repeat(2, 1fr) !important; gap:14px; }
  .artist-info { padding:14px 10px; }
  .artist-name { font-size:1rem; }
  .artist-role { font-size:0.72rem; }
  .music-player-premium { padding:25px 15px; }
  .album-art,.visualizer { width:160px; height:160px; }
  .gallery-masonry { grid-template-columns:repeat(2, 1fr); grid-auto-rows:170px; gap:10px; }
  .gallery-tall,.gallery-wide { grid-row:span 1; grid-column:span 1; }
  .contact-cards { grid-template-columns:1fr; max-width:380px; margin:0 auto 40px; }
  .footer-bottom { flex-direction:column; gap:12px; text-align:center; }
  .carousel-slide { flex:0 0 220px; height:320px; }
  .marquee-item { font-size:1.4rem; gap:15px; }
}

@media (max-width: 480px) {
  .title-main-premium,.title-brand { font-size:3.2rem; letter-spacing:4px; }
  .title-super { font-size:0.95rem; letter-spacing:3px; }
  .section-title-premium { font-size:1.8rem; }
  .gallery-masonry { grid-auto-rows:140px; gap:8px; }
  .carousel-slide { flex:0 0 200px; height:300px; }
  .marquee-item { font-size:1.2rem; }
}