
/* YEDIIKLIM PREMIUM PROGRAM CARDS */

.program-grid--classic {
    perspective: 1400px;
}

.program-card-v3 {
    --mx: 50%;
    --my: 50%;
    --rx: 0deg;
    --ry: 0deg;

    position: relative;
    isolation: isolate;
    transform-style: preserve-3d;
    transform:
        perspective(1100px)
        rotateX(var(--rx))
        rotateY(var(--ry));

    transition:
        transform .35s cubic-bezier(.2,.8,.2,1),
        box-shadow .35s ease,
        border-color .35s ease;

    will-change: transform;
}

.program-card-v3::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(
        380px circle at var(--mx) var(--my),
        rgba(255,255,255,.40),
        transparent 65%
    );
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease;
    z-index: 3;
}

.program-card-v3:hover::after {
    opacity: 1;
}

.program-card-v3:hover {
    box-shadow:
        0 24px 55px rgba(10,35,75,.13),
        0 8px 18px rgba(10,35,75,.06);
}

.program-card-v3__icon {
    transform: translateZ(32px);
    transition: transform .35s ease;
}

.program-card-v3:hover .program-card-v3__icon {
    transform: translateZ(45px) translateY(-5px) rotate(-7deg);
}

.program-card-v3__watermark {
    transition:
        transform .45s ease,
        opacity .45s ease;
}

.program-card-v3:hover .program-card-v3__watermark {
    transform: translateY(-8px) scale(1.08);
}

.program-card-v3__body {
    transform: translateZ(12px);
}

.program-card-v3__footer {
    transition: transform .3s ease;
}

.program-card-v3:hover .program-card-v3__footer {
    transform: translateY(-3px);
}

/* SCROLL REVEAL */

.program-card-v3.card-reveal-ready {
    opacity: 0;
    translate: 0 35px;
    transition:
        opacity .65s ease,
        translate .65s cubic-bezier(.2,.8,.2,1),
        transform .35s ease,
        box-shadow .35s ease;
}

.program-card-v3.card-reveal-ready.card-visible {
    opacity: 1;
    translate: 0 0;
}

/* MOBILE */

@media (max-width: 820px) {
    .program-card-v3 {
        transform: none !important;
        will-change: auto;
    }

    .program-card-v3::after {
        display: none;
    }

    .program-card-v3__body {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .program-card-v3,
    .program-card-v3 * {
        transition-duration: .01ms !important;
        animation: none !important;
        transform: none !important;
        translate: none !important;
    }

    .program-card-v3.card-reveal-ready {
        opacity: 1;
    }
}
