.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.organic-shape {
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
    transition: border-radius 8s ease-in-out infinite alternate;
}
@keyframes morph {
    0% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; }
    50% { border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%; }
    100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; }
}
.animate-morph {
    animation: morph 12s ease-in-out infinite;
}

.organic-card-1 { border-radius: 40px 10px 40px 10px; }
.organic-card-2 { border-radius: 10px 40px 10px 40px; }
.organic-card-3 { border-radius: 30px 20px 40px 10px; }

/* === NOSTALGIC ANALOG & VHS EFFECTS === */

/* Local VHS Box Overlay (Only for specific elements) */
.vhs-box {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(255,255,255,0),
        rgba(255,255,255,0) 50%,
        rgba(0,0,0,0.1) 50%,
        rgba(0,0,0,0.1)
    );
    background-size: 100% 4px;
    z-index: 20;
    pointer-events: none;
    opacity: 0.5;
    mix-blend-mode: overlay;
    border-radius: inherit;
}

.vhs-box::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.15;
    z-index: 21;
    pointer-events: none;
    background-image: url('data:image/svg+xml;utf8,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noiseFilter)"/%3E%3C/svg%3E');
    border-radius: inherit;
}

/* Chromatic Aberration & Glitch on Hover */
.analog-hover {
    transition: all 0.3s ease;
    display: inline-block;
}
.analog-hover:hover {
    text-shadow: 2px 0px 2px rgba(255,0,0,0.6), -2px 0px 2px rgba(0,255,255,0.6);
    transform: scale(1.02) skewX(-1deg);
    color: inherit;
}

/* Floating Animation for Images */
@keyframes analog-float {
    0% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-12px) rotate(1.5deg); }
    100% { transform: translateY(0px) rotate(0deg); }
}
.analog-float {
    animation: analog-float 8s ease-in-out infinite;
}

/* Reveal Animations on Scroll */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1s cubic-bezier(0.25, 1, 0.5, 1), transform 1s cubic-bezier(0.25, 1, 0.5, 1);
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.15s; }
.reveal-delay-2 { transition-delay: 0.3s; }
.reveal-delay-3 { transition-delay: 0.45s; }

/* Fixed Smooth Image Reveals (no clip-path to prevent disappearing) */
.img-reveal {
    opacity: 0;
    transform: scale(0.95);
    transition: all 1.2s cubic-bezier(0.25, 1, 0.5, 1);
}
.img-reveal.active {
    opacity: 1;
    transform: scale(1);
}

/* === ENHANCED NAVBAR ANIMATIONS === */
html {
    scroll-behavior: smooth;
}

.nav-link {
    position: relative;
    text-decoration: none;
}

.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #e8846b; /* accent-coral */
    transition: width 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.nav-link:hover::after,
.nav-link.active-link::after {
    width: 100%;
}

.nav-link.active-link {
    color: #e8846b !important;
}
