/**
 * Bloc intro_logo — pré-intro plein écran (R4)
 *
 * Contenu : 1. Calque  2. Logo  3. Ouverture (le point devient une fenêtre sur le site)
 *
 * Masqué par défaut : sans JS, avec prefers-reduced-motion ou au retour dans la session, le
 * calque n'apparaît jamais. Il s'affiche seulement sous html.intro-pending (posée par le script
 * du <head>), puis is-active (posée par js/blocs/intro-logo.js) le maintient jusqu'à la fin.
 */

/* 1. Calque ---------------------------------------------------------------- */
.intro-logo {
    /* Ouverture : centre (--hx, --hy), rayon (--hole), liseré rouge proportionnel (--ring) */
    --hx: 50%; --hy: 50%; --hole: 0px; --ring: 0.08;
    position: fixed; inset: 0; z-index: 1000; /* au-dessus du header et du grain de papier */
    display: none; place-items: center;
    background: var(--color-text);
}
.intro-pending .intro-logo,
.intro-logo.is-active { display: grid; }
.intro-logo[hidden] { display: none; }

/* 2. Logo ------------------------------------------------------------------ */
.intro-logo__mark { width: clamp(180px, 24vw, 320px); height: auto; overflow: visible; }
.intro-logo__a, .intro-logo__p {
    fill: none; stroke: var(--color-text-inverse); stroke-width: 7;
    stroke-linecap: round; stroke-linejoin: round;
}
.intro-logo__point { fill: var(--color-primary); }

/* 3. Ouverture ------------------------------------------------------------- */
/* Le calque est percé d'un disque (mask) ; sous l'ouverture, un anneau rouge prolonge le point.
   Seul --hole est animé (une variable, un seul élément peint) le temps de l'ouverture. */
.intro-logo.is-opening {
    pointer-events: none;
    background: radial-gradient(circle at var(--hx) var(--hy),
        var(--color-primary) calc(var(--hole) * (1 + var(--ring)) + 4px),
        var(--color-text) calc(var(--hole) * (1 + var(--ring)) + 4.5px));
    -webkit-mask: radial-gradient(circle at var(--hx) var(--hy), transparent var(--hole), #000 calc(var(--hole) + 0.5px));
            mask: radial-gradient(circle at var(--hx) var(--hy), transparent var(--hole), #000 calc(var(--hole) + 0.5px));
}
