/* AVANGARDA MUSIC BAND — style.css */
:root { --brand-ink:#0b0b10; --brand-bone:#f7f7f5; --brand-crimson:#b8202e; }

html { transition: background-color .4s ease, color .4s ease; }
html, body { background: #ffffff; }
html.dark, html.dark body { background: #0b0b10; }

body { font-family: "Source Sans 3", "Source Sans Pro", system-ui, sans-serif; overflow-x: hidden; transition: background-color .4s ease, color .4s ease; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f4f4f6; }
html.dark ::-webkit-scrollbar-track { background: #0b0b10; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #b8202e, rgba(184,32,46,.3)); border-radius: 999px; border: 2px solid #ffffff; }
html.dark ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #b8202e, rgba(184,32,46,.3)); border: 2px solid #0b0b10; }

h1, h2, h3, h4 { text-wrap: balance; letter-spacing: -0.015em; font-family: "Source Sans 3", "Source Sans Pro", system-ui, sans-serif; }

:focus-visible { outline: 2px solid var(--brand-crimson); outline-offset: 3px; border-radius: 8px; }

.glightbox-clean .gslide-description { background: transparent; }
.gnext, .gprev, .gclose { color: var(--brand-crimson) !important; }

[x-cloak] { display: none !important; }

.grayscale { filter: grayscale(1) contrast(1.05); }
.group:hover .group-hover\:grayscale-0 { filter: grayscale(0); }

@keyframes blob-morph {
  0%,100% { border-radius: 42% 58% 65% 35% / 40% 45% 55% 60%; transform: translate(0,0) rotate(0deg); }
  33%     { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; transform: translate(20px,-30px) rotate(120deg); }
  66%     { border-radius: 35% 65% 45% 55% / 55% 65% 35% 45%; transform: translate(-20px,20px) rotate(240deg); }
}
.blob { position: absolute; border-radius: 42% 58% 65% 35% / 40% 45% 55% 60%; animation: blob-morph 22s ease-in-out infinite; filter: blur(60px); will-change: border-radius, transform; }
.blob-slow { animation-duration: 30s; }
.blob-fast { animation-duration: 16s; }

@keyframes float-y { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-24px) rotate(6deg); } }
@keyframes float-y-reverse { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(24px) rotate(-6deg); } }
.float-y { animation: float-y 8s ease-in-out infinite; }
.float-y-reverse { animation: float-y-reverse 10s ease-in-out infinite; }

@keyframes spin-slow { to { transform: rotate(360deg); } }
.spin-slow { animation: spin-slow 40s linear infinite; }
.spin-reverse { animation: spin-slow 60s linear infinite reverse; }

@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.marquee { min-width: 200%; animation: marquee 40s linear infinite; }

@keyframes text-shine { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
.text-shine { background: linear-gradient(90deg, #b8202e 0%, #ffffff 50%, #b8202e 100%); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: text-shine 5s linear infinite; }

@keyframes eq { 0%,100% { height: 30%; } 50% { height: 100%; } }
.eq-bar { width: 3px; margin: 0 1.5px; background: currentColor; border-radius: 2px; animation: eq 1.2s ease-in-out infinite; }

@keyframes wave-flow { 0% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -200; } }
.wave-flow { stroke-dasharray: 4 6; animation: wave-flow 4s linear infinite; }

@keyframes glow-pulse { 0%,100% { opacity: 0.4; transform: scale(1); } 50% { opacity: 0.8; transform: scale(1.05); } }
.glow-pulse { animation: glow-pulse 4s ease-in-out infinite; }

.grid-pattern { background-image: linear-gradient(rgba(184,32,46,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(184,32,46,0.06) 1px, transparent 1px); background-size: 40px 40px; }
.dark .grid-pattern { background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px); }

.diagonal-stripes { background-image: repeating-linear-gradient(45deg, rgba(184,32,46,0.05) 0, rgba(184,32,46,0.05) 8px, transparent 8px, transparent 16px); }

.nav-link { position: relative; padding-bottom: 4px; transition: color .3s ease; }
.nav-link::after { content: ''; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--brand-crimson); transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.nav-link.active, .nav-link:hover { color: var(--brand-crimson) !important; }
.nav-link.active::after, .nav-link:hover::after { transform: scaleX(1); }

@keyframes particle-rise { 0% { transform: translateY(0) scale(0); opacity: 0; } 20% { opacity: 1; transform: translateY(-40px) scale(1); } 80% { opacity: 1; } 100% { transform: translateY(-300px) scale(0.3); opacity: 0; } }
.particle { position: absolute; width: 6px; height: 6px; background: var(--brand-crimson); border-radius: 50%; animation: particle-rise 6s linear infinite; will-change: transform, opacity; }

@keyframes bar-pulse { 0%,100% { transform: scaleY(0.3); } 50% { transform: scaleY(1); } }
.sound-bar { transform-origin: bottom; animation: bar-pulse 1.4s ease-in-out infinite; }

.reveal-underline { position: relative; display: inline-block; }
.reveal-underline::before { content: ''; position: absolute; left: 0; bottom: -6px; height: 3px; width: 100%; background: var(--brand-crimson); transform: scaleX(0); transform-origin: left; transition: transform 1s ease; }
[data-aos].aos-animate .reveal-underline::before { transform: scaleX(1); }

.bio-fact { position: relative; padding-left: 3.5rem; }
.bio-fact::before { content: ''; position: absolute; left: 1.4rem; top: 3.5rem; bottom: -1rem; width: 2px; background: linear-gradient(180deg, var(--brand-crimson), transparent); }
.bio-fact:last-child::before { display: none; }

@media print {
  header, footer, #kontakt form, .glightbox { display: none !important; }
  body { background: #fff; color: #000; }
}