/* Perceptra Custom Animations CSS (Fallback/Pure CSS implementations) */

/* A01 Cinematic Zoom */
.anim-a01-cinematic-zoom {
    animation: cinematicZoom 8s ease-out forwards;
}
@keyframes cinematicZoom {
    0% { transform: scale(1.05); opacity: 0; }
    10% { opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}

/* A02 Split Text Cascade (Approximation for container) */
.anim-a02-split-text {
    animation: cascadeUp 1.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    opacity: 0;
    transform: translateY(30px);
}
@keyframes cascadeUp {
    to { opacity: 1; transform: translateY(0); }
}

/* A03 Curtain Reveal */
.anim-a03-curtain-reveal {
    animation: curtainReveal 1.5s cubic-bezier(0.77, 0, 0.175, 1) forwards;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
@keyframes curtainReveal {
    0% { clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
    100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
}

/* A04 Globe Zoom (Static fallback with slow pulse) */
.anim-a04-globe-zoom {
    animation: slowPulse 6s infinite alternate;
}
@keyframes slowPulse {
    0% { filter: brightness(1); }
    100% { filter: brightness(1.2); }
}

/* A07 Mask Wipe */
.anim-a07-mask-wipe {
    animation: maskWipe 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    clip-path: inset(0 100% 0 0);
}
@keyframes maskWipe {
    to { clip-path: inset(0 0 0 0); }
}

/* A11 Scroll Pin (Sticky fallback) */
.anim-a11-scroll-pin {
    position: sticky;
    top: 100px;
}

/* A12 Counter (Fade in approximation) */
.anim-a12-counter {
    animation: fadeIn 1s ease forwards;
    opacity: 0;
}
@keyframes fadeIn { to { opacity: 1; } }

/* A13 Progress Bars */
.anim-a13-progress-bars {
    animation: expandWidth 1.5s ease-out forwards;
    transform-origin: left;
    transform: scaleX(0);
}
@keyframes expandWidth { to { transform: scaleX(1); } }

/* A14 SVG Line Draw */
.anim-a14-svg-line-draw {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: dash 2s linear forwards;
}
@keyframes dash { to { stroke-dashoffset: 0; } }

/* A15 Horizontal Scroll (Scroll snap fallback) */
.anim-a15-horizontal-scroll {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
}
.anim-a15-horizontal-scroll > * {
    scroll-snap-align: start;
}

/* A18 Mask Reveal */
.anim-a18-mask-reveal {
    animation: cascadeUp 0.8s ease forwards;
    opacity: 0;
    transform: translateY(20px);
}

/* A19 Stagger (Apply to children via nth-child if needed, here just basic fade) */
.anim-a19-stagger {
    animation: fadeIn 1s ease forwards;
    opacity: 0;
}

/* A21 Magnetic Button */
.anim-a21-magnetic {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.anim-a21-magnetic:hover {
    transform: scale(1.05) translateY(-2px);
}

/* A22 Tilt */
.anim-a22-tilt {
    transition: transform 0.4s ease;
}
.anim-a22-tilt:hover {
    transform: perspective(1000px) rotateX(2deg) rotateY(-2deg);
}

/* A23 Distortion Hover */
.anim-a23-distortion-hover {
    transition: filter 0.3s ease;
}
.anim-a23-distortion-hover:hover {
    filter: contrast(1.2) brightness(1.1);
}

/* A24 Underline Draw */
.anim-a24-underline-draw {
    position: relative;
}
.anim-a24-underline-draw::after {
    content: '';
    position: absolute;
    bottom: -2px; left: 0;
    width: 0%; height: 1px;
    background: currentColor;
    transition: width 0.3s ease;
}
.anim-a24-underline-draw:hover::after, .anim-a24-underline-draw:focus::after {
    width: 100%;
}

/* A25 Color Invert Hover */
.anim-a25-color-invert-hover {
    transition: all 0.3s ease;
}
.anim-a25-color-invert-hover:hover {
    background-color: var(--text-main, #fff);
    color: var(--bg-color, #000);
}

/* A35 Tabs */
.anim-a35-tabs {
    transition: opacity 0.3s ease;
}

/* A36 Accordion */
.anim-a36-accordion {
    transition: max-height 0.3s ease, padding 0.3s ease;
    overflow: hidden;
}

/* A39 Pin Drop */
.anim-a39-pin-drop {
    animation: pinDrop 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
    transform: translateY(-50px);
    opacity: 0;
}
@keyframes pinDrop {
    to { transform: translateY(0); opacity: 1; }
}
