
/*********************
MENU
********/


/*********************
COMING SOON
********/
.bde-section:has(.ion-cs-bg-animation) {
    position: relative;
    overflow: hidden;
}
.bde-section:has(.ion-cs-bg-animation) .section-container {
    position: relative;
}
.bde-code-block:has(> .ion-cs-bg-animation) {
    z-index: 0;
    pointer-events: none;
}
.bde-section:has(.ion-cs-bg-animation) .section-container > :not(.bde-code-block) {
    position: relative;
    z-index: 1;
}
.ion-cs-bg-animation {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    overflow: visible;
}
.ion-cs-bg-animation .ion-cs-circle,
.ion-cs-bg-animation .ion-cs-path {
    transform-box: fill-box;
    transform-origin: center;
    will-change: transform;
}
.ion-cs-circle {
    filter: blur(1px);
}
.ion-cs-circle-1 {
    animation: ionCsFloat1 8s ease-in-out infinite;
}
.ion-cs-circle-2 {
    animation: ionCsFloat2 10s ease-in-out infinite;
}
.ion-cs-path {
    stroke-dasharray: 400;
    stroke-dashoffset: 400;
    stroke-linecap: round;
}
.ion-cs-path-1 {
    animation: ionCsDraw 2.4s cubic-bezier(.22,1,.36,1) 0.3s forwards,
               ionCsFloat1 6s ease-in-out 2.7s infinite;
}
.ion-cs-path-2 {
    animation: ionCsDraw 2.4s cubic-bezier(.22,1,.36,1) 0.6s forwards,
               ionCsFloat2 8s ease-in-out 3s infinite;
}
.ion-cs-grid line {
    animation: ionCsGridPulse 6s ease-in-out infinite;
}
.ion-cs-grid line:nth-child(2) { animation-delay: 0.6s; }
.ion-cs-grid line:nth-child(3) { animation-delay: 1.2s; }
.ion-cs-grid line:nth-child(4) { animation-delay: 1.8s; }
.ion-cs-grid line:nth-child(5) { animation-delay: 2.4s; }

@keyframes ionCsFloat1 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(20px, -30px) scale(1.1);
    }
}

@keyframes ionCsFloat2 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(-25px, 25px) scale(0.95);
    }
}

@keyframes ionCsDraw {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes ionCsGridPulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.35;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ion-cs-bg-animation * {
        animation: none !important;
    }

    .ion-cs-path {
        stroke-dashoffset: 0;
    }
}


/*********************
ANIMATION ENGINE (creative-scripts.js)
.gsap-init is only added on pages where the engine runs
********/
.gsap-init [data-gsap]:not([data-gsap="parallax"]):not([data-gsap="counter"]):not([data-gsap="magnetic"]):not([data-gsap="tilt"]):not([data-gsap="scrub-text"]) {
    visibility: hidden;
}
.is-editor [data-gsap] {
    visibility: visible !important;
}
/* SplitText masks — padding keeps descenders (g, y, p) from being clipped */
.split-line-mask,
.split-word-mask {
    padding-bottom: .14em;
    margin-bottom: -.14em;
}
