/* VIZARNE — curseur personnalisé + rideau de transition (toutes les pages, accueil compris).
   Couleurs écrites en dur : ce fichier ne doit dépendre d'aucune variable de page. */
/* ─── Curseur personnalisé ─── */
.wn-cursor, .wn-ring { position: fixed; left: 0; top: 0; z-index: 1000; pointer-events: none; opacity: 0; transition: opacity .3s; }
html.cur-on .wn-cursor, html.cur-on .wn-ring { opacity: 1; }
html.has-cur, html.has-cur * { cursor: none !important; }
.wn-cursor { width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: #ff3d5a; }
.wn-ring { width: 0; height: 0; }
.wn-ring > i {
  position: absolute; left: 0; top: 0; width: 38px; height: 38px;
  transform: translate(-50%, -50%); border-radius: 50%;
  border: 1.5px solid #cbe1f8; display: grid; place-items: center;
  font-style: normal; font-family: 'Geist Mono', ui-monospace, Menlo, monospace; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: #081320;
  transition: width .45s cubic-bezier(.19,1,.22,1), height .45s cubic-bezier(.19,1,.22,1), background-color .3s, border-color .3s, border-radius .45s cubic-bezier(.19,1,.22,1);
}
.wn-ring.is-link > i { width: 64px; height: 64px; border-color: #ff3d5a; background: rgba(255, 61, 90, .12); }
.wn-ring.is-label > i { width: 92px; height: 92px; background: #cbe1f8; border-color: #cbe1f8; }
.wn-ring.is-down > i { width: 26px; height: 26px; }
.wn-ring.is-text > i { width: 3px; height: 30px; border-radius: 2px; background: #ff3d5a; border-color: #ff3d5a; }
.wn-ring > i span { opacity: 0; transition: opacity .2s; }
.wn-ring.is-label > i span { opacity: 1; }

/* ─── Rideau de transition entre pages ─── */
.wn-curtain {
  position: fixed; inset: 0; z-index: 900; pointer-events: none;
  display: grid; grid-template-rows: repeat(4, 1fr);
}
/* quatre barres de bleu à l'horizontale, du bleu nuit au blue ice */
.wn-curtain > span { transform: scaleX(0); transform-origin: left; transition: transform .55s cubic-bezier(.77,0,.175,1); }
.wn-curtain > span:nth-child(1) { background: #081320; }
.wn-curtain > span:nth-child(2) { background: #1b263b; transition-delay: .05s; }
.wn-curtain > span:nth-child(3) { background: #27364d; transition-delay: .1s; }
.wn-curtain > span:nth-child(4) { background: #cbe1f8; transition-delay: .15s; }
.wn-curtain.cover > span { transform: scaleX(1); }
.wn-curtain.leave > span { transform-origin: right; transform: scaleX(0); }
.wn-curtain.instant > span { transition: none; }
.wn-curtain .wn-dots { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.wn-dots { display: flex; gap: 12px; opacity: 0; transition: opacity .25s ease .2s; }
.wn-curtain.cover .wn-dots { opacity: 1; }
.wn-curtain.leave .wn-dots { opacity: 0; transition-delay: 0s; }
.wn-dots i { width: 12px; height: 12px; border-radius: 50%; background: #ff3d5a; animation: wn-wave 1s cubic-bezier(.45,0,.55,1) infinite; }
.wn-dots i:nth-child(2) { animation-delay: .14s; }
.wn-dots i:nth-child(3) { animation-delay: .28s; }
@keyframes wn-wave { 0%, 60%, 100% { transform: translateY(0); } 30% { transform: translateY(-14px); } }

@media (hover: none), (pointer: coarse) { .wn-cursor, .wn-ring { display: none; } }
@media (prefers-reduced-motion: reduce) { .wn-curtain { display: none; } }

/* ─── Forme signature en texture ─── */
.wn-tex { position: absolute; z-index: 0; fill: #ff3d5a; pointer-events: none; opacity: .9; }
.wn-tex-0 { width: clamp(140px, 22vw, 340px); right: -4vw; top: 18%; }
.wn-tex-1 { width: clamp(180px, 30vw, 460px); right: -8vw; bottom: -12vw; opacity: .14; }
.wn-tex-2 { width: clamp(120px, 16vw, 240px); left: -3vw; bottom: -4vw; fill: #081320; opacity: .18; }
.blk-coral .wn-tex { fill: #081320; opacity: .16; }
.p-hero > *:not(.wn-tex):not(.wn-scatter), .wn-foot > *:not(.wn-tex):not(.wn-scatter), .cta-blk > *:not(.wn-tex):not(.wn-scatter) { position: relative; z-index: 1; }
footer.footer { overflow: hidden; } footer.footer > *:not(.wn-tex) { position: relative; z-index: 1; }

/* ─── Petites formes éparpillées qui réagissent à la souris ─── */
.wn-scatter { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.wn-scatter svg { position: absolute; top: 0; left: 0; fill: #ff3d5a; will-change: transform; pointer-events: none; }
.wn-scatter.on-light svg { fill: #081320; }
.wn-cursor { transition: opacity .3s, background-color .25s; } .wn-cursor.on-coral { background: #081320; }
.wn-ring.on-light > i { border-color: #081320; } .wn-ring.on-light.is-label > i { background: #081320; border-color: #081320; color: #cbe1f8; }

/* accueil : liens légaux du bas de page */
.footer-legal { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.footer-legal a { opacity: .7; transition: opacity .3s; }
.footer-legal a:hover { opacity: 1; }

/* titre lu par Google et les lecteurs d'écran, invisible à l'écran */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* lien d'accès direct au contenu : invisible, il apparaît quand on navigue au clavier (Tab) */
.skip-link { position: fixed; left: 16px; top: 12px; z-index: 1000; padding: 12px 18px; border-radius: 999px; background: #ff3d5a; color: #fff; font: 500 14px/1 'Geist', system-ui, sans-serif; text-decoration: none; transform: translateY(-160%); transition: transform .25s cubic-bezier(.23, 1, .32, 1); }
.skip-link:focus, .skip-link:focus-visible { transform: none; outline: 2px solid #fff; outline-offset: 3px; }