/* ================================================================
   Power Site Builder — Effects & Animations
   Atmosphere: elegant
   ================================================================ */

/* ===== SCROLL REVEAL ===== */
.rv {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);
    will-change: opacity, transform;
}
.rv.visible {
    opacity: 1;
    transform: none;
}
.rv-left {
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);
    will-change: opacity, transform;
}
.rv-left.visible {
    opacity: 1;
    transform: none;
}
.rv-right {
    opacity: 0;
    transform: translateX(40px);
    transition: opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);
    will-change: opacity, transform;
}
.rv-right.visible {
    opacity: 1;
    transform: none;
}
.rv-scale {
    opacity: 0;
    transform: scale(.92);
    transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);
    will-change: opacity, transform;
}
.rv-scale.visible {
    opacity: 1;
    transform: none;
}

/* Stagger delays */
.rv-d1 { transition-delay: .1s; }
.rv-d2 { transition-delay: .2s; }
.rv-d3 { transition-delay: .3s; }
.rv-d4 { transition-delay: .4s; }
.rv-d5 { transition-delay: .5s; }
.rv-d6 { transition-delay: .6s; }
.rv-d7 { transition-delay: .7s; }
.rv-d8 { transition-delay: .8s; }

/* Stagger container — children get auto-delayed via JS */
.stagger > * {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .5s cubic-bezier(.16,1,.3,1), transform .5s cubic-bezier(.16,1,.3,1);
}
.stagger.visible > * {
    opacity: 1;
    transform: none;
}

/* ===== ATMOSPHERE LAYERS ===== */
.atm {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}
.atm-glow {
    position: absolute;
    inset: 0;
}
.atm-glow__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
}
.atm-grain {
    position: absolute;
    inset: 0;
    opacity: 0.02;
    mix-blend-mode: overlay;
}
.atm-particles {
    position: absolute;
    inset: 0;
}
.atm-particles span {
    position: absolute;
    display: block;
    opacity: 0.07;
}
.atm-overlay {
    position: absolute;
    inset: 0;
}

/* ===== ATMOSPHERE KEYFRAMES ===== */

/* Rise — warm vapour particles floating upward */
@keyframes atm-rise {
    0% { transform: translateY(100vh) translateX(0) scale(.8); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateY(-10vh) translateX(20px) scale(1.1); opacity: 0; }
}

/* Float — gentle up/down bobbing */
@keyframes atm-float {
    0%, 100% { transform: translateY(0) translateX(0); }
    25% { transform: translateY(-18px) translateX(6px); }
    50% { transform: translateY(-8px) translateX(-4px); }
    75% { transform: translateY(-22px) translateX(8px); }
}

/* Drift — slow lateral movement */
@keyframes atm-drift {
    0% { transform: translateX(0) translateY(0); }
    33% { transform: translateX(30px) translateY(-10px); }
    66% { transform: translateX(-20px) translateY(8px); }
    100% { transform: translateX(0) translateY(0); }
}

/* Breathe — scale pulse for glow orbs */
@keyframes atm-breathe {
    0%, 100% { transform: scale(1); opacity: .6; }
    50% { transform: scale(1.15); opacity: 1; }
}

/* Fall — leaves/confetti falling down */
@keyframes atm-fall {
    0% { transform: translateY(-10vh) translateX(0) rotate(0deg); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: .8; }
    100% { transform: translateY(105vh) translateX(40px) rotate(360deg); opacity: 0; }
}

/* Pulse — clinical expanding rings */
@keyframes atm-pulse {
    0% { transform: scale(.6); opacity: .4; }
    50% { transform: scale(1); opacity: .15; }
    100% { transform: scale(1.4); opacity: 0; }
}

/* Shimmer — shine sweep effect */
@keyframes atm-shimmer {
    0% { transform: translateX(-100%) rotate(25deg); }
    100% { transform: translateX(200%) rotate(25deg); }
}

/* Glitch — micro-offset for electric/neon */
@keyframes atm-glitch {
    0%, 90%, 100% { transform: translate(0,0); opacity: .7; }
    92% { transform: translate(2px, -1px); opacity: 1; }
    94% { transform: translate(-2px, 1px); opacity: .5; }
    96% { transform: translate(1px, 2px); opacity: .9; }
    98% { transform: translate(-1px, -2px); opacity: .6; }
}

/* Spin slow — rotating orb */
@keyframes atm-spin-slow {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Flash — burst effect for power theme */
@keyframes atm-flash {
    0%, 85%, 100% { opacity: .5; transform: scale(1); }
    90% { opacity: 1; transform: scale(1.2); }
    95% { opacity: .3; transform: scale(1); }
}

/* Bounce — for festive glow */
@keyframes atm-bounce {
    0%, 100% { transform: scale(1) translateY(0); }
    30% { transform: scale(1.08) translateY(-8px); }
    60% { transform: scale(.96) translateY(4px); }
}

/* ===== GLOW ANIMATIONS (type-specific) ===== */
.atm-glow__orb { animation: atm-drift 20s ease-in-out infinite; }
.atm-glow__orb:nth-child(2) { animation-delay: -10s; }
.atm-glow__orb:nth-child(3) { animation-delay: -5s; }

/* ===== PARTICLE ANIMATIONS (direction-specific) ===== */
.atm-particles span { animation: atm-drift ease-in-out infinite; }

/* ===== OVERLAY PATTERNS ===== */

/* ===== HERO ENHANCEMENTS ===== */
.s-hero__title .word {
    display: inline-block;
    opacity: 0;
    transform: translateY(20px);
    animation: heroWordReveal .6s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes heroWordReveal {
    to { opacity: 1; transform: none; }
}

/* ===== BUTTON SHINE SWEEP ===== */
.btn-p {
    position: relative;
    overflow: hidden;
}
.btn-p::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.2), transparent);
    transition: none;
    pointer-events: none;
}
.btn-p:hover::before {
    animation: atm-shimmer .6s ease-out;
}

/* ===== COUNTER ANIMATION ===== */
[data-count-to] {
    display: inline-block;
}

/* ===== THEME ANIMATION OVERRIDES ===== */

/* Luxury — slow transitions */
.theme-luxury .rv,
.theme-luxury .rv-left,
.theme-luxury .rv-right,
.theme-luxury .rv-scale {
    transition-duration: .9s;
}
.theme-luxury .stagger > * {
    transition-duration: .7s;
}
.theme-luxury .btn-p:hover {
    transform: translateY(-1px);
}
.theme-luxury .atm-glow__orb {
    filter: blur(120px);
}

/* Neon — glow pulse on buttons/text */
.theme-neon .btn-p {
    text-shadow: 0 0 8px currentColor;
    box-shadow: 0 0 16px \23 b8860b40;
    transition: all .3s, box-shadow .3s, text-shadow .3s;
}
.theme-neon .btn-p:hover {
    box-shadow: 0 0 32px \23 b8860b60, 0 8px 24px rgba(0,0,0,.15);
    text-shadow: 0 0 12px currentColor;
}
.theme-neon .s-hero__title {
    text-shadow: 0 0 40px \23 b8860b30;
}
.theme-neon .s-h2 {
    text-shadow: 0 0 20px \23 b8860b15;
}

/* Brutalist — snap reveals */
.theme-brutalist .rv,
.theme-brutalist .rv-left,
.theme-brutalist .rv-right,
.theme-brutalist .rv-scale {
    transition-duration: .15s;
    transition-timing-function: step-end;
    transform: none;
}
.theme-brutalist .rv { opacity: 0; }
.theme-brutalist .rv.visible { opacity: 1; }
.theme-brutalist .stagger > * {
    transition-duration: .1s;
    transition-timing-function: step-end;
    transform: none;
}

/* Kawaii — bouncy hovers */
.theme-kawaii .btn-p:hover {
    transform: translateY(-4px) scale(1.03);
    transition: transform .25s cubic-bezier(.34,1.56,.64,1);
}
.theme-kawaii .s-svc-card:hover,
.theme-kawaii .s-testi-card:hover {
    transform: translateY(-8px) scale(1.02) !important;
    transition: transform .3s cubic-bezier(.34,1.56,.64,1);
}

/* Organic — breathing cards */
.theme-organic .s-svc-card,
.theme-organic .s-testi-card {
    transition: transform .6s cubic-bezier(.16,1,.3,1), box-shadow .6s;
}

/* Playful — bouncy everything */
.theme-playful .rv,
.theme-playful .rv-left,
.theme-playful .rv-right {
    transition-timing-function: cubic-bezier(.34,1.56,.64,1);
}

/* ===== prefers-reduced-motion ===== */
@media (prefers-reduced-motion: reduce) {
    .rv, .rv-left, .rv-right, .rv-scale {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        will-change: auto !important;
    }
    .stagger > * {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    .atm { display: none !important; }
    .s-hero__title .word {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }
    .btn-p::before { animation: none !important; }
    .btn-p:hover { transform: none !important; }
    .s-svc-card:hover,
    .s-testi-card:hover,
    .s-bento-card:hover,
    .s-masonry-item:hover,
    .s-uniform-item:hover {
        transform: none !important;
    }
    @keyframes marquee { 0%, 100% { transform: none; } }
    [data-count-to] { transition: none !important; }
}

/* ===== MOBILE: reduce particles ===== */
@media (max-width: 768px) {
    .atm-particles span:nth-child(n+8) { display: none; }
    .atm-glow__orb { filter: blur(60px); }
    .atm-glow__orb:nth-child(3) { display: none; }
}