/* ============================================================
   TRANSIÇÃO DE PÁGINA — cortina da marca (par do preloader)
   Saída: cortina sobe do rodapé cobrindo a tela (cantos
   superiores arredondados). Entrada: cortina já cobre a tela
   e sobe pra fora (cantos inferiores), revelando a página.
   A classe html.nc-pt-in é setada por script inline no <head>
   quando a navegação veio de uma transição — o ::before cobre
   a tela ANTES do primeiro paint (anti-flash), até o
   transicao.js assumir com a div animável.
   ============================================================ */

:root {
    --nc-pt-bg: linear-gradient(160deg, #00296B, #001E50 55%, #001233);
    --nc-pt-ease: cubic-bezier(.77, 0, .18, 1);
}

/* Véu de pré-paint: só existe entre o parse do <head> e o
   transicao.js rodar no fim do body */
html.nc-pt-in::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 99998;
    background: var(--nc-pt-bg);
    background-image: url('/public/assets/grainient-static.webp'), var(--nc-pt-bg);
    background-size: cover;
    background-position: center;
}

html.nc-pt-in {
    overflow: hidden;
}

/* Cortina animável (injetada pelo transicao.js) */
.nc-pt {
    position: fixed;
    inset: -1px;
    z-index: 99998;
    overflow: hidden;
    background: var(--nc-pt-bg);
    background-image: url('/public/assets/grainient-static.webp'), var(--nc-pt-bg);
    background-size: cover;
    background-position: center;
    transform: translateY(101%);
    border-radius: 64px 64px 0 0;
    pointer-events: none;
    will-change: transform;
    transition:
        transform .55s var(--nc-pt-ease),
        border-radius .55s var(--nc-pt-ease);
}

/* Cobrindo a tela (fim da saída / início da entrada) */
.nc-pt--cover {
    transform: translateY(0);
    border-radius: 0;
}

/* Saindo por cima (fim da entrada) */
.nc-pt--out {
    transform: translateY(-101%);
    border-radius: 0 0 64px 64px;
}

@media (prefers-reduced-motion: reduce) {
    .nc-pt {
        transition: opacity .3s ease;
        transform: none;
        border-radius: 0;
        opacity: 0;
    }

    .nc-pt--cover {
        opacity: 1;
    }

    .nc-pt--out {
        opacity: 0;
    }
}