/**
 * Artwork Page Transitions — CSS v1.0.0
 * Minimal: GSAP gestisce tutta l'animazione, questo file
 * definisce solo lo stato base del layer e variabili.
 */

/* ─── Variabili configurabili via JS (override inline) ─── */
:root {
    --apt-bg:       #fff;       /* background layer B */
    --apt-z:        9999;
    --apt-duration: 0.65s;      /* usato solo per fallback CSS */
}

/* ─── Layer B: overlay posizionato fuori viewport da GSAP ─── */
#apt-layer-b {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: var(--apt-z);
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--apt-bg);

    /* Performance hint */
    will-change: transform;
    -webkit-overflow-scrolling: touch;

    /* Nascosto di default — GSAP lo posiziona fuori viewport */
    pointer-events: none;
}

/* ─── Mentre la transizione è attiva, blocca scroll su body ─── */
body.apt-transitioning {
    overflow: hidden;
}

/* ─── Cursore di caricamento sul body durante fetch ─── */
body.apt-loading * {
    cursor: wait !important;
}

/* ─── Indicatore di progresso (barra top) ─── */
#apt-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 2px;
    width: 0%;
    background: #121212;
    z-index: 99999;
    transition: width 0.3s ease, opacity 0.2s ease;
    opacity: 0;
    pointer-events: none;
}

#apt-progress.apt-progress--active {
    opacity: 1;
}

#apt-progress.apt-progress--done {
    width: 100% !important;
    opacity: 0;
    transition: width 0.1s ease, opacity 0.3s ease 0.1s;
}

/* ─── Reduced motion: disabilita l'animazione, solo fade ─── */
@media (prefers-reduced-motion: reduce) {
    #apt-layer-b {
        will-change: auto;
    }
}