/* NORDVIK — intro « CEFONSTUDIO devient Nordvik », version glitch (accueil, première visite) */
.nv-intro-voile{display:none}
html.nv-intro{overflow:hidden}
html.nv-intro .nv-intro-voile{position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;color:var(--nv-neige,#EAEAEA);pointer-events:auto}

/* fond découpé en bandes, pour une sortie en lamelles */
.nv-intro-bandes{position:absolute;inset:0;z-index:-1;display:flex;flex-direction:column}
.nv-intro-bandes i{flex:1;background:var(--nv-mork,#0C0B0B);transition:transform .7s cubic-bezier(.76,0,.24,1)}
.nv-intro-voile.part .nv-intro-bandes i{transform:translateX(var(--sens,-101%))}

/* lignes de balayage et grain qui scintillent */
.nv-intro-voile::before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(234,234,234,.035) 0 1px,transparent 1px 3px);animation:nvScan .12s steps(2) infinite}
.nv-intro-voile::after{content:'';position:absolute;left:0;right:0;height:18vh;top:-20vh;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(234,234,234,.05),transparent);animation:nvBalai 2.4s linear .3s infinite}
.nv-intro-voile.part::before,.nv-intro-voile.part::after,.nv-intro-voile.part .nv-intro-scene{opacity:0;transition:opacity .25s}
@keyframes nvScan{50%{opacity:.6}}
@keyframes nvBalai{to{top:110vh}}

.nv-intro-scene{position:relative;display:flex;flex-direction:column;align-items:center;gap:20px}

/* texte glitché : deux copies décalées, découpées en tranches */
.nv-intro-texte{position:relative;margin:0;font:400 clamp(18px,2.4vw,30px)/1 var(--font-titre,var(--font));letter-spacing:.42em;text-indent:.42em;white-space:nowrap}
.nv-intro-texte::before,.nv-intro-texte::after{content:attr(data-texte);position:absolute;inset:0;text-indent:inherit;opacity:0}
.nv-intro-voile.glitch .nv-intro-texte::before{opacity:.75;color:#fff;animation:nvTranche1 .28s steps(1) infinite;transform:translateX(-3px)}
.nv-intro-voile.glitch .nv-intro-texte::after{opacity:.55;color:#7a7a7a;animation:nvTranche2 .34s steps(1) infinite;transform:translateX(3px)}
.nv-intro-voile.glitch .nv-intro-texte{animation:nvSecousse .18s steps(1) infinite}
@keyframes nvTranche1{0%{clip-path:inset(10% 0 70% 0)}25%{clip-path:inset(55% 0 20% 0)}50%{clip-path:inset(30% 0 52% 0)}75%{clip-path:inset(78% 0 4% 0)}100%{clip-path:inset(0 0 88% 0)}}
@keyframes nvTranche2{0%{clip-path:inset(62% 0 18% 0)}25%{clip-path:inset(8% 0 76% 0)}50%{clip-path:inset(44% 0 38% 0)}75%{clip-path:inset(20% 0 66% 0)}100%{clip-path:inset(84% 0 2% 0)}}
@keyframes nvSecousse{0%{transform:none}33%{transform:translate(-2px,1px) skewX(-6deg)}66%{transform:translate(2px,-1px)}100%{transform:none}}

.nv-intro-mot{margin:0;font:400 12px/1 var(--font);letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;color:rgba(234,234,234,.55);opacity:0;transition:opacity .4s}
.nv-intro-voile.mot .nv-intro-mot{opacity:1}

/* le logo arrive en clignant, puis se fixe */
.nv-intro-logo{position:absolute;left:50%;top:50%;width:clamp(200px,24vw,320px);transform:translate(-50%,-50%);opacity:0}
.nv-intro-logo{display:grid}
.nv-intro-logo svg{grid-area:1/1;display:block;width:100%;height:auto;fill:currentColor}
.nv-intro-couche--g1,.nv-intro-couche--g2{opacity:0}
.nv-intro-voile.logo.glitch .nv-intro-couche--g1{opacity:.8;color:#fff;animation:nvTranche1 .26s steps(1) infinite;transform:translateX(-4px)}
.nv-intro-voile.logo.glitch .nv-intro-couche--g2{opacity:.6;color:#7a7a7a;animation:nvTranche2 .32s steps(1) infinite;transform:translateX(4px)}
.nv-intro-voile.logo.glitch .nv-intro-couche--net{animation:nvSecousse .2s steps(1) infinite}
.nv-intro-voile.logo-net .nv-intro-couche--g1,.nv-intro-voile.logo-net .nv-intro-couche--g2{opacity:0;animation:none}
.nv-intro-voile.logo .nv-intro-texte,.nv-intro-voile.logo .nv-intro-mot{opacity:0;transition:opacity .15s}
.nv-intro-voile.logo .nv-intro-logo{animation:nvAllume .6s steps(1) forwards}
@keyframes nvAllume{0%{opacity:1;transform:translate(calc(-50% - 6px),-50%) skewX(10deg)}12%{opacity:0}22%{opacity:1;transform:translate(calc(-50% + 4px),-50%)}30%{opacity:.2}40%{opacity:1;transform:translate(-50%,calc(-50% + 2px)) skewX(-4deg)}55%{opacity:.6}70%,100%{opacity:1;transform:translate(-50%,-50%)}}
