:root{
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-out: cubic-bezier(0.33, 1, 0.68, 1);
    --dur-fast: 200ms;
    --dur-base: 650ms;
}

/* Scroll reveal - see js/reveal.js */
[data-animate]{
    opacity: 0;
    transition: opacity var(--dur-base) var(--ease-out-expo), transform var(--dur-base) var(--ease-out-expo);
    transition-delay: var(--reveal-delay, 0ms);
}
[data-animate="fade-up"]{
    transform: translateY(24px);
}
[data-animate="fade-left"]{
    transform: translateX(-24px);
}
[data-animate="fade-right"]{
    transform: translateX(24px);
}
[data-animate="fade-in"]{
    transform: none;
}
/* Hero content reveals slower and with a larger travel distance than the rest of the page -
   it's the first thing seen on load, so a more deliberate, cinematic cascade reads as more
   premium than the snappier reveal used for scroll-triggered sections further down. */
.hero__headline[data-animate], .hero__sub-heading[data-animate], .hero__cta-wrapper [data-animate]{
    transition-duration: 1100ms;
    transform: translateY(36px);
}
[data-animate].is-visible{
    opacity: 1;
    transform: none;
}

/* Header shrink-on-scroll (see js/global.js) */
@media (min-width: 992px) {
    .header__nav .navbar{
        transition: height var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
    }
    .header--scrolled .header__nav .navbar{
        height: 46px;
        box-shadow: 0 2px 10px rgba(0,0,0,.12);
    }
}

/* Hero background micro-zoom - animates a transform on the isolated ::before image layer
   (see hero.css) rather than background-size, so it can never reveal gaps: transform can only
   scale an already-fully-covering image further in, never change how much of the box it covers. */
@keyframes heroKenBurns{
    from{ transform: scale(1); }
    to{ transform: scale(1.1); }
}
.hero::before{
    animation: heroKenBurns 20s var(--ease-out) infinite alternate;
}

/* Shared button micro-interactions */
.hero__cta-contact, .hero__cta-demo, .banner__cta, .awards__cta, .news__cta,
.team-card__cta, .modules_see-more, .success-partners__see-more,
.modules__card .card__cta, .all-steps__cta{
    transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out),
        background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.hero__cta-contact:hover, .hero__cta-demo:hover, .banner__cta:hover, .awards__cta:hover,
.news__cta:hover, .team-card__cta:hover, .modules_see-more:hover, .success-partners__see-more:hover,
.modules__card .card__cta:hover, .all-steps__cta:hover{
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 42, 121, 0.18);
}
.hero__cta-contact:active, .hero__cta-demo:active, .banner__cta:active, .awards__cta:active,
.news__cta:active, .team-card__cta:active, .modules_see-more:active, .success-partners__see-more:active,
.modules__card .card__cta:active, .all-steps__cta:active{
    transform: translateY(0) scale(0.97);
    box-shadow: none;
}

/* Shared card hover-lift */
.usp__card, .problems__card, .success__card-container,
.success-why-carousel__card, .awards-carousel__card{
    transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.usp__card:hover, .problems__card:hover{
    transform: translateY(-6px);
}
.success__card-container:hover, .success-why-carousel__card:hover, .awards-carousel__card:hover{
    transform: translateY(-4px);
}

/* YouTube click-to-load facade (see js/video-facade.js) */
.card__video{
    position: relative;
    cursor: pointer;
}
.card__video img{
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
    border-radius: 8px;
}
.card__video__play{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(0, 42, 121, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.card__video__play svg{
    width: 22px;
    height: 22px;
    margin-left: 3px;
    fill: var(--white);
}
.card__video:hover .card__video__play{
    transform: translate(-50%,-50%) scale(1.1);
    background: var(--light-blue);
}

@media (prefers-reduced-motion: reduce){
    [data-animate]{
        opacity: 1;
        transform: none;
        transition: none;
    }
    .hero::before{
        animation: none;
    }
    .hero__cta-contact, .hero__cta-demo, .banner__cta, .awards__cta, .news__cta,
    .team-card__cta, .modules_see-more, .success-partners__see-more,
    .modules__card .card__cta, .all-steps__cta,
    .usp__card, .problems__card, .success__card-container,
    .success-why-carousel__card, .awards-carousel__card,
    .header__nav .navbar, .card__video__play{
        transition: none;
    }
}