.n12{--n12-nav:85px}
@media (max-width:900px){.n12{--n12-nav:64px}}
html.intro{overflow:hidden}
.n12 .wrap{max-width:1120px}
.n12 section{padding:110px 0}
.n12 .intro-ecran{position:fixed;inset:0;z-index:80;background:var(--green);overflow:hidden}
html:not(.intro) .n12 .intro-ecran{display:none}
.n12 .scene{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:28px 16px}
.n12 .entree{position:relative;height:min(78%, calc((100vw - 32px) * 1.6));margin-top:40px;aspect-ratio:400/640;perspective:1100px}
.n12 .facade{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.n12 .t{fill:none;stroke:var(--cream);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.n12 .leger{stroke-opacity:.32}
.n12 .t.clef{fill:var(--green)}
.n12 .scene.joue .t{animation:n12-trace 1.2s cubic-bezier(.6,.1,.2,1) forwards;animation-delay:calc(var(--dl,0s) * .6)}
@keyframes n12-trace{to{stroke-dashoffset:0}}
@keyframes n12-apparaitre{to{opacity:1}}
.n12 .adresse{position:absolute;left:50%;bottom:calc(100% + 18px);transform:translateX(-50%);width:max-content;max-width:calc(100vw - 32px);text-align:center;font-size:clamp(18px,2vw,26px);font-weight:300;letter-spacing:.5px;color:var(--cream);opacity:0;margin:0}
.n12 .scene.joue .adresse{animation:n12-apparaitre .8s ease .7s forwards}
.n12 .logo-facade{position:absolute;left:46%;top:13.75%;width:8%;aspect-ratio:1;background:var(--cream);-webkit-mask:url('/assets/logo.png') left center/auto 100% no-repeat;mask:url('/assets/logo.png') left center/auto 100% no-repeat;opacity:0}
.n12 .scene.joue .logo-facade{animation:n12-apparaitre .8s ease .9s forwards}
.n12 .lumiere{position:absolute;left:25%;top:48.4375%;width:50%;height:39.84375%;background:radial-gradient(ellipse at 50% 55%,#fffaf3 0%,var(--cream) 70%);opacity:0}
.n12 .vantail{position:absolute;top:48.4375%;width:25%;height:39.84375%;background:var(--green)}
.n12 .vantail.g{left:25%;transform-origin:left center}
.n12 .vantail.d{left:50%;transform-origin:right center}
.n12 .vantail svg{display:block;width:100%;height:100%;overflow:visible}
.n12 .vitre{fill:rgba(253,244,233,.05)}
.n12 .passer{position:absolute;right:16px;top:14px;font:inherit;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:var(--cream);background:none;border:1px solid rgba(253,244,233,.4);border-radius:4px;padding:8px 12px;opacity:.9;cursor:pointer;z-index:2}
.n12 .passer:hover{opacity:1;border-color:var(--cream)}
.n12 .passer:focus-visible{opacity:1;outline:2px solid var(--cream);outline-offset:3px}
.n12 .hero{position:relative;height:calc(100vh - var(--n12-nav));height:calc(100svh - var(--n12-nav));min-height:520px;padding:0;background:radial-gradient(ellipse at 50% 50%,#fffaf3 0%,var(--cream) 65%);color:var(--green);overflow:hidden}
.n12 .titre-hero{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 16px}
.n12 .eyebrow{font-size:clamp(15px,3.2vw,24px);font-weight:500;letter-spacing:.3em;text-transform:uppercase}
.n12 .titre-hero h1{--h:clamp(110px,22vw,280px);font-size:var(--h);font-weight:200;line-height:1;letter-spacing:-.03em;margin:10px 0 8px;display:flex;align-items:flex-start;justify-content:center;color:var(--green)}
.n12 .rouleau{display:block;height:1.1em;overflow:hidden;-webkit-mask-image:linear-gradient(transparent 0,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(transparent 0,#000 14%,#000 86%,transparent 100%)}
.n12 .bande{display:flex;flex-direction:column;text-align:right;font-variant-numeric:tabular-nums;transform:translateY(-12.1em)}
.n12 .bande span{display:block;height:1.1em;line-height:1.1em}
.n12 .bande span:not(:last-child){opacity:.3}
.n12 .chiffre{position:relative;display:block}
.n12 .ordinal{position:absolute;left:100%;top:0;font-size:.2em;font-weight:400;letter-spacing:.02em;line-height:1;margin:1.15em 0 0 .1em}
.n12 .rouleau-noms{position:absolute;left:100%;top:calc(var(--h) * .5);margin-left:calc(var(--h) * .03);display:block;width:max-content;height:1.3em;overflow:hidden;font-size:clamp(14px,1.7vw,24px);font-weight:400;letter-spacing:.02em;line-height:1.3em;color:var(--ink);white-space:nowrap;-webkit-mask-image:linear-gradient(transparent 0,#000 22%,#000 78%,transparent 100%);mask-image:linear-gradient(transparent 0,#000 22%,#000 78%,transparent 100%)}
.n12 .bande-noms{display:flex;flex-direction:column;text-align:left;transform:translateY(-14.3em)}
.n12 .bande-noms span{display:block;height:1.3em}
.n12 .bande-noms span:not(:last-child){opacity:.8}
.n12 .masque::before{content:"";display:inline-block;width:7.5em;height:.75em;border-radius:.4em;vertical-align:-.05em;background:linear-gradient(90deg,rgba(26,75,35,.13) 0%,rgba(26,75,35,.3) 50%,rgba(26,75,35,.13) 100%);background-size:200% 100%;animation:n12-reflet 2.6s linear infinite}
@keyframes n12-reflet{from{background-position:100% 0}to{background-position:-100% 0}}
@media (max-width:600px){
.n12 .rouleau-noms{position:relative;left:50%;top:auto;width:20em;margin:.35em 0 0 -10em}
.n12 .bande-noms{text-align:center}
}
.n12 .lieu{display:flex;align-items:center;gap:16px;font-size:clamp(16px,1.8vw,22px);font-weight:300;letter-spacing:1px;color:var(--ink)}
.n12 .lieu .trait{flex:0 0 44px;height:1px;background:var(--green);opacity:.5}
.n12 .defiler{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--green);text-decoration:none}
.n12 .defiler::after{content:"";display:block;width:1px;height:34px;background:var(--green);opacity:.5;margin:10px auto 0;animation:n12-pulse 2s ease-in-out infinite}
@keyframes n12-pulse{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}
.n12 .titre{font-size:13px;font-weight:600;letter-spacing:6px;text-transform:uppercase;color:var(--green);margin-bottom:22px}
.n12 .grand{font-size:clamp(30px,4.2vw,52px);font-weight:300;line-height:1.18;color:var(--ink);max-width:820px}
.n12 .grand strong{font-weight:600;color:var(--green)}
html.js .n12 .apparait{opacity:0;transform:translateY(18px);transition:opacity .9s ease,transform .9s ease}
html.js .n12 .apparait.vu{opacity:1;transform:none}
.n12 .rebours{background:var(--white)}
.n12 .rebours .wrap{display:grid;grid-template-columns:auto 1fr;gap:60px;align-items:end}
.n12 .jours{font-size:clamp(96px,15vw,200px);font-weight:200;line-height:.85;color:var(--green);font-variant-numeric:tabular-nums;letter-spacing:-4px}
.n12 .jours-legende{font-size:13px;font-weight:600;letter-spacing:5px;text-transform:uppercase;color:var(--green);margin-top:18px}
.n12 .rebours p.grand{padding-bottom:6px}
.n12 .faits{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(26,75,35,.18);margin-top:56px}
.n12 .faits div{padding:28px 22px 6px 0}
.n12 .faits div+div{padding-left:22px;border-left:1px solid rgba(26,75,35,.18)}
.n12 .faits dt{font-size:clamp(26px,2.6vw,36px);font-weight:300;color:var(--green);line-height:1.1}
.n12 .faits dd{font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:#555;margin-top:10px}
.n12 .emplacement{background:var(--cream2)}
.n12 .emplacement .wrap{display:grid;grid-template-columns:1fr minmax(260px,420px);gap:64px;align-items:center}
.n12 .empl-liste{margin-top:40px;border-top:1px solid rgba(26,75,35,.18)}
.n12 .empl-liste div{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 20px;padding:16px 0;border-bottom:1px solid rgba(26,75,35,.18)}
.n12 .empl-liste dt{font-size:clamp(19px,1.8vw,22px);font-weight:400;color:var(--ink)}
.n12 .empl-liste dd{font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--green)}
.n12 .empl-dessin{position:relative;width:100%;max-width:420px;aspect-ratio:1;justify-self:center}
.n12 .empl-dessin svg{display:block;width:100%;height:100%;overflow:visible}
.n12 .anneau{fill:none;stroke:var(--green);stroke-width:1.2;stroke-opacity:.5}
.n12 .anneau.leger{stroke-opacity:.22}
html.js .n12 .anneau{stroke-dasharray:1;stroke-dashoffset:1}
html.js .n12 .empl-dessin.vu .anneau{animation:n12-trace 1.4s cubic-bezier(.6,.1,.2,1) forwards;animation-delay:var(--dl,0s)}
.n12 .onde{fill:none;stroke:var(--green);stroke-width:1;vector-effect:non-scaling-stroke;opacity:0;transform-origin:200px 200px}
.n12 .empl-dessin.vu .onde{animation:n12-onde 3.6s ease-out 1.6s infinite}
@keyframes n12-onde{0%{transform:scale(1);opacity:.45}100%{transform:scale(4.5);opacity:0}}
.n12 .picto .fond{fill:var(--cream2);stroke:var(--green);stroke-width:1.2}
.n12 .picto .trait{fill:none;stroke:var(--green);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
html.js .n12 .picto{opacity:0}
html.js .n12 .empl-dessin.vu .picto{animation:n12-apparaitre .6s ease forwards;animation-delay:var(--dp,1s)}
.n12 .empl-y{position:absolute;left:41%;top:41%;width:18%;aspect-ratio:1;background:url('/assets/logo.png') left center/auto 100% no-repeat}
.n12 .etapes{background:var(--bg);padding-top:0}
.n12 .etapes-intro{max-width:620px;color:#444;margin-top:18px}
.n12 .frise{position:relative;list-style:none;display:grid;grid-template-columns:repeat(var(--n,5),1fr);margin:64px 0 0;padding:0}
.n12 .fil,.n12 .fil-plein,.n12 .tete{display:none}
html.js .n12 .fil,html.js .n12 .fil-plein,html.js .n12 .tete{display:block}
.n12 .fil,.n12 .fil-plein{position:absolute;border-radius:2px;transform-origin:left center;transform:scaleX(0);transition:transform 1.4s cubic-bezier(.6,.1,.2,1)}
.n12 .fil{background:rgba(26,75,35,.14)}
.n12 .fil-plein{background:linear-gradient(90deg,var(--green),#4b8556);transition-delay:.9s}
.n12 .frise.vu .fil,.n12 .frise.vu .fil-plein{transform:none}
.n12 .tete{position:absolute;z-index:2;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(26,75,35,.15);opacity:0;transition:opacity .5s ease 2.2s}
.n12 .frise.vu .tete{opacity:1}
.n12 .tete::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--green);animation:n12-onde-tete 2.4s ease-out infinite}
@keyframes n12-onde-tete{0%{transform:scale(1);opacity:.6}100%{transform:scale(3.2);opacity:0}}
.n12 .tete span{position:absolute;left:18px;bottom:12px;white-space:nowrap;font-size:11px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--green)}
.n12 .tete.a-gauche span{left:auto;right:18px}
.n12 .jalon{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 10px}
html.js .n12 .jalon{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(.25s + var(--i) * .16s)}
html.js .n12 .frise.vu .jalon{opacity:1;transform:none}
.n12 .quand{font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:#666;min-height:18px}
.n12 .noeud{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;margin:14px 0 22px;border-radius:50%;background:var(--white);border:1px solid rgba(26,75,35,.28);box-shadow:0 6px 18px rgba(26,75,35,.08);transition:transform .3s ease,box-shadow .3s ease}
.n12 .jalon:hover .noeud{transform:translateY(-3px);box-shadow:0 10px 24px rgba(26,75,35,.14)}
.n12 .noeud svg{width:22px;height:22px}
.n12 .noeud svg *{fill:none;stroke:var(--green);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.n12 .jalon--fait .noeud{background:var(--green);border-color:var(--green)}
.n12 .jalon--fait .noeud svg *{stroke:var(--cream)}
.n12 .jalon--ouverture .noeud{width:68px;height:68px;margin:8px 0 16px;background:var(--green);border-color:var(--green);box-shadow:0 0 0 8px rgba(26,75,35,.08),0 0 0 18px rgba(26,75,35,.04)}
.n12 .noeud .y{width:62%;aspect-ratio:1;background:var(--cream);-webkit-mask:url('/assets/logo.png') left center/auto 100% no-repeat;mask:url('/assets/logo.png') left center/auto 100% no-repeat}
.n12 .etiquette{font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--green)}
.n12 .jalon h3{font-size:22px;font-weight:400;line-height:1.25;color:var(--ink);margin-top:6px}
.n12 .jalon .detail{font-size:15px;color:#555;margin-top:8px;max-width:210px}
.n12 .jalon .barres{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;max-width:170px;margin-top:14px}
.n12 .jalon .barres span{display:block;width:100%;height:8px;border-radius:4px;background:linear-gradient(90deg,#ece3d6 0%,#f7f1e8 40%,#ece3d6 80%);background-size:200% 100%;animation:n12-miroiter 2.4s linear infinite}
.n12 .jalon .barres span:nth-child(2){width:70%}
@keyframes n12-miroiter{to{background-position:-200% 0}}
.n12 .inscription{background:var(--green);color:var(--cream)}
.n12 .inscription .titre{color:var(--cream);opacity:.8}
.n12 .inscription .grand{color:var(--cream)}
.n12 .chemins{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:48px;align-items:stretch}
.n12 .chemin{border-radius:6px;padding:34px 30px 32px;display:flex;flex-direction:column}
.n12 .chemin h3{font-size:clamp(22px,2.2vw,28px);font-weight:400;line-height:1.25}
.n12 .chemin .texte{margin-top:12px}
.n12 .inscription .btn{background:var(--cream);color:var(--green);border:1px solid var(--cream);padding:16px 22px;font-weight:600;transition:background .15s,color .15s}
.n12 .inscription .btn:hover{background:transparent;color:var(--cream)}
.n12 .chemin--prive{background:var(--cream);color:var(--green)}
.n12 .chemin--prive .texte{color:var(--ink)}
.n12 .chemin--prive .rare{margin-top:18px;font-weight:600}
.n12 .chemin--prive .pousse{flex:1;min-height:26px}
.n12 .inscription .chemin--prive .btn{align-self:flex-start;background:var(--green);color:var(--cream);border-color:var(--green)}
.n12 .inscription .chemin--prive .btn:hover{background:transparent;color:var(--green)}
.n12 .chemin--suivre{background:rgba(253,244,233,.06);border:1px solid rgba(253,244,233,.18)}
.n12 .chemin--suivre .texte{opacity:.85}
.n12 .chemin--suivre form{margin-top:24px}
.n12 label.champ{display:block;font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;margin-bottom:8px}
.n12 input[type=email]{width:100%;font:inherit;font-size:17px;padding:14px 16px;border-radius:4px;border:1px solid rgba(253,244,233,.35);background:transparent;color:var(--cream)}
.n12 input[type=email]::placeholder{color:rgba(253,244,233,.45)}
.n12 input[type=email]:focus{outline:2px solid var(--cream);outline-offset:2px;border-color:rgba(253,244,233,.35)}
.n12 .accord{display:flex;gap:12px;align-items:flex-start;margin:20px 0 24px;font-size:14px;line-height:1.5;opacity:.9}
.n12 .accord input{margin-top:3px;width:18px;height:18px;accent-color:var(--cream);flex:0 0 auto}
.n12 .accord a{color:var(--cream)}
.n12 .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.n12 .erreur{margin-top:16px;padding:12px 14px;border-radius:4px;background:#fdecea;color:#8a1f1f;font-size:15px}
.n12 .erreur a{color:inherit;font-weight:600}
.n12 .merci{display:none;margin-top:24px}
.n12 .chemin--suivre.envoye #n12-form{display:none}
.n12 .chemin--suivre.envoye .merci{display:block}
.n12 .merci:focus{outline:none}
.n12 .merci-titre{font-size:22px;font-weight:400}
.n12 .merci-texte{margin-top:6px;opacity:.85}
.n12 .questions{margin-top:24px;padding-top:22px;border-top:1px solid rgba(253,244,233,.18)}
.n12 .questions .q-intro{font-size:14px;opacity:.85}
.n12 .questions fieldset{border:0;margin:16px 0 0;padding:0}
.n12 .questions legend{font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;margin-bottom:10px;padding:0}
.n12 .chips{display:flex;flex-wrap:wrap;gap:8px}
.n12 .chips label{position:relative;cursor:pointer}
.n12 .chips input{position:absolute;opacity:0;width:1px;height:1px;padding:0;border:0}
.n12 .chips span{display:inline-block;font-size:14px;padding:8px 14px;border:1px solid rgba(253,244,233,.35);border-radius:999px;transition:background .15s,color .15s}
.n12 .chips input:checked + span{background:var(--cream);color:var(--green);border-color:var(--cream)}
.n12 .chips input:focus-visible + span{outline:2px solid var(--cream);outline-offset:2px}
.n12 .questions .btn{margin-top:22px}
.n12 .q-merci{display:none;margin-top:22px}
.n12 .questions.repondu .q-corps{display:none}
.n12 .questions.repondu .q-merci{display:block}
.n12 .dici-la{margin-top:40px;font-size:16px;opacity:.9}
.n12 .dici-la a{color:var(--cream);font-weight:600}
@media (max-width:900px){
.n12 section{padding:80px 0}
.n12 .rebours .wrap{grid-template-columns:1fr;gap:26px}
.n12 .faits{grid-template-columns:1fr 1fr}
.n12 .faits div:nth-child(3){padding-left:0;border-left:0}
.n12 .faits div:nth-child(n+3){border-top:1px solid rgba(26,75,35,.18)}
.n12 .emplacement .wrap{grid-template-columns:1fr;gap:44px}
.n12 .empl-dessin{max-width:320px}
.n12 .chemins{grid-template-columns:1fr}
}
@media (max-width:760px){
.n12 .frise{grid-template-columns:1fr;margin-top:44px}
.n12 .jalon{display:grid;grid-template-columns:56px 1fr;column-gap:18px;align-items:start;text-align:left;padding:0 0 30px}
.n12 .jalon > *{grid-column:2}
.n12 .jalon .noeud,.n12 .jalon--ouverture .noeud{grid-column:1;grid-row:1 / span 4;width:56px;height:56px;margin:0}
.n12 .quand{min-height:0;margin-top:4px}
.n12 .jalon .barres{align-items:flex-start;margin-top:10px}
.n12 .jalon .detail{max-width:none}
.n12 .fil,.n12 .fil-plein{transform-origin:center top;transform:scaleY(0)}
.n12 .tete span{display:none}
}
@media (max-width:600px){
.n12 .wrap{padding:0 16px}
.n12 .eyebrow{letter-spacing:.18em}
.n12 .lieu .trait{display:none}
.n12 .chemin{padding:26px 22px}
.n12 .chemin .btn{width:100%;text-align:center;align-self:stretch}
}
@media (prefers-reduced-motion:reduce){
html.js .n12 .apparait{opacity:1;transform:none;transition:none}
.n12 .jalon .barres span,.n12 .defiler::after,.n12 .tete::after,.n12 .masque::before{animation:none}
html.js .n12 .frise .jalon,.n12 .fil,.n12 .fil-plein,.n12 .tete{opacity:1;transform:none;transition:none}
html.js .n12 .anneau{stroke-dashoffset:0;animation:none!important}
html.js .n12 .picto{opacity:1;animation:none!important}
.n12 .onde{display:none}
}