html.adpi-intro-active,
body.adpi-intro-active {
    overflow: hidden !important;
}

.adpi-intro {
    --adpi-bg: #ffffff;
    --adpi-logo-max-width: 1120px;
    --adpi-reveal-duration: 1650ms;
    --adpi-exit-duration: 650ms;
    --adpi-shimmer-duration: 1100ms;
    --adpi-shimmer-delay: 520ms;
    --adpi-blur-start: 10px;
    --adpi-shift-y: 10px;
    --adpi-scale-start: 0.985;
    --adpi-sweep-width: 18%;
    --adpi-sweep-opacity: 0.95;
    --adpi-sweep-travel: 690%;
    --adpi-reveal-ease: cubic-bezier(0.21, 0.83, 0.21, 0.99);
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: var(--adpi-bg);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--adpi-exit-duration) ease, visibility var(--adpi-exit-duration) ease;
}

.adpi-intro.is-visible {
    opacity: 1;
    visibility: visible;
}

.adpi-intro.is-leaving {
    opacity: 0;
    visibility: hidden;
}

.adpi-intro__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
    padding: clamp(24px, 5vw, 56px);
    box-sizing: border-box;
}

.adpi-intro__logo-shell {
    width: min(90vw, var(--adpi-logo-max-width));
}

.adpi-intro__logo-reveal {
    position: relative;
    display: block;
    width: 100%;
    clip-path: inset(0 100% 0 0);
    opacity: 0;
    filter: blur(var(--adpi-blur-start));
    transform: translateY(var(--adpi-shift-y)) scale(var(--adpi-scale-start));
    will-change: clip-path, opacity, filter, transform;
}

.adpi-intro.is-visible .adpi-intro__logo-reveal {
    animation: adpi-reveal-logo var(--adpi-reveal-duration) var(--adpi-reveal-ease) 0.18s forwards;
}

.adpi-intro__logo-shimmer {
    position: absolute;
    inset: 0;
    display: block;
    opacity: 0;
    pointer-events: none;
    will-change: opacity, -webkit-mask-position, mask-position;
    -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.18) 24%, rgba(0,0,0,1) 50%, rgba(0,0,0,0.18) 76%, rgba(0,0,0,0) 100%);
    mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.18) 24%, rgba(0,0,0,1) 50%, rgba(0,0,0,0.18) 76%, rgba(0,0,0,0) 100%);
    -webkit-mask-size: var(--adpi-sweep-width) 100%;
    mask-size: var(--adpi-sweep-width) 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: -28% 50%;
    mask-position: -28% 50%;
    mix-blend-mode: screen;
}

.adpi-intro__logo--shimmer {
    filter: brightness(2.15) contrast(1.04) drop-shadow(0 0 12px rgba(255,255,255,0.22));
}

.adpi-intro[data-shimmer="1"].is-visible .adpi-intro__logo-shimmer {
    animation: adpi-magic-sweep var(--adpi-shimmer-duration) ease-out var(--adpi-shimmer-delay) forwards;
}

.adpi-intro__logo {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

@keyframes adpi-reveal-logo {
    0% {
        clip-path: inset(0 100% 0 0);
        opacity: 0;
        filter: blur(var(--adpi-blur-start));
        transform: translateY(var(--adpi-shift-y)) scale(var(--adpi-scale-start));
    }
    35% {
        opacity: 1;
    }
    100% {
        clip-path: inset(0 0 0 0);
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1);
    }
}

@keyframes adpi-magic-sweep {
    0% {
        opacity: 0;
        -webkit-mask-position: -28% 50%;
        mask-position: -28% 50%;
    }
    12% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        -webkit-mask-position: 128% 50%;
        mask-position: 128% 50%;
    }
}

@media (max-width: 1024px) {
    .adpi-intro__logo-shell {
        width: min(92vw, calc(var(--adpi-logo-max-width) * 0.88));
    }
}

@media (max-width: 767px) {
    .adpi-intro__inner {
        padding: 20px;
    }

    .adpi-intro__logo-shell {
        width: min(94vw, calc(var(--adpi-logo-max-width) * 0.74));
    }
}
