/* =========================================================
   FOLD LOGO ANIMATION — CONFIGURATOR LOADER
   Eigenständiges Modul; verändert keine Configurator-Datei.
========================================================= */

.fold-logo-loader{
    position:absolute;
    inset:0;
    z-index:20;

    display:grid;
    place-items:center;

    padding:clamp(22px,4vw,54px);

    background:
        radial-gradient(
            circle at 50% 42%,
            #FFFFFF 0%,
            #FBFBF9 48%,
            #F3F2ED 100%
        );

    opacity:1;
    visibility:visible;
    pointer-events:auto;

    transition:
        opacity .46s ease,
        visibility 0s linear 0s;
}

.fold-logo-loader.is-leaving{
    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transition:
        opacity .46s ease,
        visibility 0s linear .46s;
}

.fold-logo-loader__inner{
    width:min(58%,560px);

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:14px;

    text-align:center;
}

.fold-logo-loader__media{
    position:relative;

    width:100%;
    aspect-ratio:16 / 9;

    display:grid;
    place-items:center;

    overflow:hidden;
}

.fold-logo-loader__video{
    display:block;

    width:100%;
    height:100%;

    object-fit:contain;

    /* Weiß des MP4 fügt sich in die helle Bühne ein; Schwarz bleibt sichtbar. */
    mix-blend-mode:multiply;
}

.fold-logo-loader__fallback{
    display:none;
    align-items:center;
    justify-content:center;

    width:100%;
    min-height:110px;

    color:#111111;

    font-family:"Oswald","Arial Narrow",Arial,sans-serif;
    font-size:clamp(46px,7vw,92px);
    font-weight:700;
    letter-spacing:-.055em;
    line-height:1;
}

.fold-logo-loader.has-video-error .fold-logo-loader__video,
.fold-logo-loader.prefers-reduced-motion .fold-logo-loader__video{
    display:none;
}

.fold-logo-loader.has-video-error .fold-logo-loader__fallback,
.fold-logo-loader.prefers-reduced-motion .fold-logo-loader__fallback{
    display:flex;
}

.fold-logo-loader__status{
    margin:0;

    color:#54575D;

    font-family:"Inter",Arial,sans-serif;
    font-size:12px;
    font-weight:700;
    line-height:1.4;
}

.fold-logo-loader__progress{
    position:relative;

    width:min(180px,56%);
    height:3px;

    overflow:hidden;

    border-radius:999px;
    background:#DEDCD5;
}

.fold-logo-loader__progress::after{
    content:"";

    position:absolute;
    inset:0 auto 0 0;

    width:42%;

    border-radius:inherit;
    background:#FACA30;

    animation:fold-logo-loader-progress 1.15s ease-in-out infinite;
}

@keyframes fold-logo-loader-progress{
    0%{
        transform:translateX(-115%);
    }

    50%{
        transform:translateX(105%);
    }

    100%{
        transform:translateX(245%);
    }
}

/* Der vorhandene Textloader bleibt technisch aktiv, wird beim ersten Laden
   jedoch optisch durch den Logo-Loader ersetzt. Fehler bleiben sichtbar. */
.fold-configurator__loading.fold-logo-loader__native:not(.is-error){
    opacity:0 !important;
    pointer-events:none !important;
}

.fold-configurator__loading.fold-logo-loader__native.is-error{
    z-index:30 !important;
    opacity:1 !important;
    pointer-events:auto !important;
}

@media (max-width:900px){
    .fold-logo-loader__inner{
        width:min(72%,500px);
    }
}

@media (max-width:560px){
    .fold-logo-loader{
        padding:20px;
    }

    .fold-logo-loader__inner{
        width:min(88%,430px);
        gap:10px;
    }

    .fold-logo-loader__status{
        font-size:11px;
    }
}

@media (prefers-reduced-motion:reduce){
    .fold-logo-loader,
    .fold-logo-loader.is-leaving{
        transition:none !important;
    }

    .fold-logo-loader__progress::after{
        animation:none !important;
        width:100%;
        opacity:.72;
    }
}