/* Dynamic Section Background Scenery - Lightweight & Aesthetic */

.section-scenery {
    position: absolute;
    inset: 0;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    overflow: visible;
}

.ambient-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    /* Ultra-soft color wash */
    opacity: 0;
    transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: opacity, transform;
    animation: gentleFloat 35s ease-in-out infinite alternate;
}

/* Base Positioning */
.orb-left {
    top: 5%;
    left: -15%;
    width: clamp(400px, 60vw, 900px);
    height: clamp(400px, 60vw, 900px);
}

.orb-right {
    bottom: -5%;
    right: -15%;
    width: clamp(400px, 60vw, 900px);
    height: clamp(400px, 60vw, 900px);
    animation-duration: 45s;
    animation-direction: alternate-reverse;
}

/* Simple Animation */
@keyframes gentleFloat {
    0% {
        transform: translate(0, 0) scale(1.0);
    }

    100% {
        transform: translate(30px, -20px) scale(1.08);
    }
}

/* Active State */
section.is-active .ambient-orb {
    opacity: 0.55;
}

/* --- Section Vibes (Progressive Color Story) --- */

/* Vibe 1: Purple to Pink (Hero) */
.vibe-1 .orb-left {
    background: radial-gradient(circle, var(--orb-color-2) 0%, transparent 75%);
}

/* Purple */
.vibe-1 .orb-right {
    background: radial-gradient(circle, var(--orb-color-1) 0%, transparent 75%);
}

/* Pink */

/* Vibe 2: Pink to Peach (Stats) */
.vibe-2 .orb-left {
    background: radial-gradient(circle, var(--orb-color-1) 0%, transparent 75%);
}

/* Pink */
.vibe-2 .orb-right {
    background: radial-gradient(circle, var(--orb-color-2-alt) 0%, transparent 75%);
}

/* Peach */

/* Vibe 3: Peach to Coral (Team/Works) */
.vibe-3 .orb-left {
    background: radial-gradient(circle, var(--orb-color-2-alt) 0%, transparent 75%);
}

/* Peach */
.vibe-3 .orb-right {
    background: radial-gradient(circle, var(--orb-color-1-alt) 0%, transparent 75%);
}

/* Coral */

/* Vibe 4: Coral to Purple (Mastery/Services) */
.vibe-4 .orb-left {
    background: radial-gradient(circle, var(--orb-color-1-alt) 0%, transparent 75%);
}

/* Coral */
.vibe-4 .orb-right {
    background: radial-gradient(circle, var(--orb-color-2) 0%, transparent 75%);
}

/* Purple */

/* Mobile Optimization */
@media (max-width: 768px) {
    .ambient-orb {
        filter: blur(50px);
        opacity: 0 !important;
        animation-duration: 60s !important;
    }

    section.is-active .ambient-orb {
        opacity: 0.3 !important;
    }

    .orb-left {
        left: -30%;
        width: 300px;
        height: 300px;
    }

    .orb-right {
        right: -30%;
        width: 300px;
        height: 300px;
    }
}