/* ============================================================
   VIRILACCESSORIES — transitions.css
   Transitions élégantes entre les pages
   ============================================================ */

/* ── RIDEAU DE TRANSITION ── */
#page-transition {
    position: fixed;
    inset: 0;
    background: #292a29;
    z-index: 99998;
    transform: translateY(100%);
    pointer-events: none;
}

/* Rideau qui monte (quitter la page) */
#page-transition.leaving {
    animation: curtainUp 0.5s cubic-bezier(0.76, 0, 0.24, 1) forwards;
}

/* Rideau qui descend (arriver sur la page) */
#page-transition.entering {
    transform: translateY(0%);
    animation: curtainDown 0.5s cubic-bezier(0.76, 0, 0.24, 1) forwards;
}

@keyframes curtainUp {
    from { transform: translateY(100%); }
    to   { transform: translateY(0%); }
}

@keyframes curtainDown {
    from { transform: translateY(0%); }
    to   { transform: translateY(-100%); }
}

/* ── LIGNE DORÉE SUR LE RIDEAU ── */
#page-transition::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, #FF9E6D, #906543, transparent);
}

/* ── CONTENU DE LA PAGE ── */
/* Apparition douce du contenu à l'arrivée */
body.page-enter .hero,
body.page-enter header,
body.page-enter section,
body.page-enter footer {
    animation: contentFadeIn 0.6s ease 0.2s both;
}

@keyframes contentFadeIn {
    from { opacity: 0; transform: translateY(15px); }
    to   { opacity: 1; transform: translateY(0); }
}