/* ===== Animations ===== */
@keyframes floatUpDown {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }
}

@keyframes floatSide {
    0%, 100% {
        transform: translateX(0px);
    }

    50% {
        transform: translateX(8px);
    }
}

@keyframes pulseSoft {
    0%, 100% {
        transform: scale(1);
        opacity: 0.75;
    }

    50% {
        transform: scale(1.08);
        opacity: 1;
    }
}

@keyframes shimmer {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== Motion Helpers ===== */
.animate-float {
    animation: floatUpDown 5s ease-in-out infinite;
}

.animate-float-side {
    animation: floatSide 6s ease-in-out infinite;
}

.animate-pulse-soft {
    animation: pulseSoft 2.4s ease-in-out infinite;
}

.animate-fade-up {
    animation: fadeUp 0.8s ease-out both;
}

.delay-1 {
    animation-delay: 0.1s;
}

.delay-2 {
    animation-delay: 0.2s;
}

.delay-3 {
    animation-delay: 0.3s;
}

.delay-4 {
    animation-delay: 0.4s;
}

/* ===== 3D Cards ===== */
.card-3d {
    transform-style: preserve-3d;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    will-change: transform;
}

    .card-3d:hover {
        transform: translateY(-10px) perspective(1200px) rotateX(4deg) rotateY(-4deg);
        box-shadow: 0 24px 60px rgba(15, 23, 42, 0.14);
    }

.card-3d-soft {
    transform-style: preserve-3d;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

    .card-3d-soft:hover {
        transform: translateY(-8px) perspective(1000px) rotateX(3deg);
        box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
    }

/* ===== Glass / Shine ===== */
.glass {
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.glass-dark {
    background: rgba(15, 23, 42, 0.82);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.shine-button {
    position: relative;
    overflow: hidden;
}

    .shine-button::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(120deg, transparent, rgba(255,255,255,0.28), transparent);
        transform: translateX(-100%);
    }

    .shine-button:hover::after {
        animation: shimmer 0.9s ease;
    }

/* ===== Background Orbs ===== */
.bg-orb {
    position: absolute;
    border-radius: 9999px;
    filter: blur(60px);
    opacity: 0.45;
    pointer-events: none;
}

.bg-orb-orange {
    background: rgba(234, 88, 12, 0.18);
}

.bg-orb-slate {
    background: rgba(15, 23, 42, 0.10);
}

/* ===== Hero depth ===== */
.hero-depth {
    perspective: 1200px;
}

.hero-mockup {
    transform: rotateY(-10deg) rotateX(4deg);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

    .hero-mockup:hover {
        transform: rotateY(0deg) rotateX(0deg) translateY(-6px);
    }

/* ===== Section entrance ===== */
.section-reveal {
    animation: fadeUp 0.9s ease both;
}

/* ===== Hover lift ===== */
.lift-hover {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

    .lift-hover:hover {
        transform: translateY(-4px);
    }

/* ===== Image polish ===== */
.img-zoom {
    transition: transform 0.7s ease;
}

.group:hover .img-zoom {
    transform: scale(1.08);
}