/* Visuel qui s'elargit au scroll, pilote par js/deplie.js (--deplie : 0 a 1).
   Au repos 10 % de marge de chaque cote, comme sur wearecollins.com ; les
   coins suivent l'arrondi des cartes de l'accueil.
   ⚠️ Horizontal SEULEMENT (choix de Tibo, 26/09) : la version d'origine
   rognait aussi 15 % en bas, le visuel grandissait dans les deux sens.
   Valeur par defaut 1 : sans le script, le visuel reste entier. */
[data-deplie] {
    --deplie: 1;
    /* ⚠️ .project-panel1 porte un `transition: 1s` sur TOUTES ses proprietes :
       le masque suivait le scroll avec une seconde de retard et ne finissait
       jamais de s'ouvrir tant qu'on bougeait. Lenis lisse deja le scroll. */
    transition: none;
    clip-path: inset(0
        calc(10% * (1 - var(--deplie)))
        round var(--anglesindex));
}

/* Le titre pose sur le visuel suit le bord gauche du masque : --deplie-x est
   le retrait en px ecrit par le script. `translate` et pas `transform`, pour
   ne pas toucher aux autres effets de cet element. */
[data-deplie] .infoprojets {
    translate: var(--deplie-x, 0px) 0;
}
