/* css/content-execution.css */

/* Global Reveal Classes for ScrollTrigger */
.ce-reveal {
    opacity: 0;
    transform: translateY(30px);
}

/* Section 1: Hero Parallax */
.parallax-bg-svg path,
.parallax-bg-svg circle,
.parallax-bg-svg line {
    vector-effect: non-scaling-stroke;
}

/* Section 2: Layered Document Animation */
.ce-layers-container {
    perspective: 1200px;
    transform-style: preserve-3d;
}

.ce-doc-layer {
    transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 1.2s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform, box-shadow;
}

.layer-1 {
    transform: rotateX(60deg) rotateZ(-40deg) translateZ(-80px);
    z-index: 1;
}

.layer-2 {
    transform: rotateX(60deg) rotateZ(-40deg) translateZ(-10px);
    z-index: 2;
}

.layer-3 {
    transform: rotateX(60deg) rotateZ(-40deg) translateZ(60px);
    z-index: 3;
}

/* Active states triggered by JS */
.ce-layers-container.is-active .layer-1 {
    transform: rotateX(55deg) rotateZ(-35deg) translateZ(-40px);
    box-shadow: 0 30px 60px rgba(0,0,0,0.1);
}
.ce-layers-container.is-active .layer-2 {
    transform: rotateX(55deg) rotateZ(-35deg) translateZ(40px);
    box-shadow: 0 40px 80px rgba(0,0,0,0.15);
}
.ce-layers-container.is-active .layer-3 {
    transform: rotateX(55deg) rotateZ(-35deg) translateZ(120px);
    box-shadow: 0 50px 100px rgba(0,0,0,0.25);
}

/* Section 3: Art Director */
.ce-art-reveal {
    opacity: 0;
    transform: scale(0.95);
    transition: opacity 1s ease, transform 1s ease;
}
.ce-art-reveal.is-visible {
    opacity: 1;
    transform: scale(1);
}

#art-director-img {
    filter: grayscale(100%) blur(4px);
    transform: scale(1.0);
    transition: filter 1.5s cubic-bezier(0.16, 1, 0.3, 1), transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}
#art-director-img.is-active {
    filter: grayscale(0%) blur(0px);
    transform: scale(1.03); /* subtle ken burns */
}

/* Section 4: Webmaster Typing */
.typing-cursor {
    animation: blink 1s step-end infinite;
}
@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

/* Section 5: The Intelligence FAQ Accordion */
.ce-faq-item.is-active h3 {
    color: #D5B473;
}
/* Height animated via JS */

/* Section 5.5: Output Gallery */
/* Background transition handled by JS ScrollTrigger */
.ce-tag {
    transition: transform 0.3s ease, background-color 0.3s ease;
}
.ce-tag:hover {
    transform: translateY(-2px);
}
.ce-swarm-ai {
    will-change: transform, opacity;
}