:root{--ink:#1a2230;--ink2:#232e40;--stone:#f2eee6;--stone2:#e6dfd2;--brass:#b98a4b;--brass2:#d8b07a;--mute:#7c7468;
--disp:'Stardom',Georgia,serif;--txt:'Chillax',system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--stone);color:var(--ink);font:400 17px/1.6 var(--txt);overflow-x:clip}
body::after{content:"";position:fixed;inset:0;background:url(../img/grain.png);opacity:.05;pointer-events:none;z-index:90}
img{display:block;max-width:100%}
a{color:inherit}
em{font-style:normal;color:var(--brass)}
h1,h2,h3{font-family:var(--disp);font-weight:400;letter-spacing:-.01em}
.kick{font:500 12px/1.2 var(--txt);letter-spacing:.24em;text-transform:uppercase;color:var(--brass)}
.bar{position:fixed;top:0;left:0;right:0;z-index:70;display:flex;justify-content:space-between;align-items:center;padding:14px 18px;pointer-events:none;mix-blend-mode:normal}
.bar a{pointer-events:auto;text-decoration:none}
.logo{display:flex;align-items:center;gap:10px;font:400 22px/1 var(--disp);color:var(--stone);background:rgba(26,34,48,.72);backdrop-filter:blur(8px);padding:8px 14px;border-radius:999px}
.logo svg{width:26px;height:20px;color:var(--brass2)}.logo i{font-style:normal;color:var(--brass2)}
.bar-cta{font:500 13px/1 var(--txt);color:var(--stone);background:rgba(26,34,48,.72);backdrop-filter:blur(8px);padding:11px 14px;border-radius:999px;font-variant-numeric:tabular-nums}
.btn{display:inline-block;font:500 15px/1 var(--txt);text-decoration:none;padding:17px 22px;border-radius:999px}
.btn-brass{background:var(--brass);color:#1a1206}
.btn-line{border:1px solid currentColor}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.scene{position:relative}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.js .s-porte{height:380vh}.js .s-chemin{height:440vh}.js .s-equipe{height:300vh}.js .s-mot{height:220vh}
html:not(.motion) .scene{height:auto!important}
html:not(.motion) .stage{position:relative;height:auto;min-height:100svh}

/* 1 porte */
.s-porte .stage{background:var(--ink)}
.room{position:absolute;inset:0;--t:0}
.room img{width:100%;height:100%;object-fit:cover;object-position:62% 50%;transform:scale(calc(1.35 - var(--t)*.35));filter:brightness(calc(.55 + var(--t)*.5))}
.doors{position:absolute;inset:0;--t:0;perspective:1400px}
.d{position:absolute;top:0;bottom:0;width:50.5%;background:linear-gradient(90deg,#2a3546,#1e2735);box-shadow:inset 0 0 0 1px rgba(216,176,122,.18)}
.d::before{content:"";position:absolute;inset:9% 14%;border:1px solid rgba(216,176,122,.35);box-shadow:inset 0 0 0 10px rgba(255,255,255,.015)}
.d-l{left:0;transform-origin:0 50%;transform:rotateY(calc(var(--t)*-96deg))}
.d-r{right:0;transform-origin:100% 50%;transform:rotateY(calc(var(--t)*96deg))}
.d b{position:absolute;top:52%;width:10px;height:64px;border-radius:6px;background:linear-gradient(180deg,var(--brass2),var(--brass));box-shadow:0 4px 10px rgba(0,0,0,.4)}
.d-l b{right:16px}.d-r b{left:16px}
.c-a{position:absolute;left:20px;right:20px;top:100px;z-index:3;color:var(--stone);--u:0;opacity:calc(1 - var(--u));transform:translateY(calc(var(--u)*-40px))}
.c-a h1{font-size:clamp(42px,11vw,116px);line-height:1;margin-top:14px;max-width:13ch}
.c-a h1 em{color:var(--brass2)}
.c-b{position:absolute;left:16px;right:16px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:3;max-width:540px;--t:0;opacity:var(--t);transform:translateY(calc((1 - var(--t))*40px));
  background:rgba(242,238,230,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:22px;border-radius:22px}
.c-b p{font-size:18px}
html:not(.motion) .doors{display:none}
html:not(.motion) .room{position:relative;height:70vh}
html:not(.motion) .c-a{color:var(--stone)}
html:not(.motion) .c-b{opacity:1;transform:none;position:relative;left:auto;bottom:auto;margin:20px 16px 40px}

/* 2 chemin */
.s-chemin .stage{background:var(--stone)}
.chemin-k{position:absolute;left:20px;top:92px;z-index:3}
.rail{position:absolute;left:20px;right:20px;top:120px;height:1px;background:rgba(26,34,48,.15)}
.rail::after{content:"";position:absolute;left:0;top:-1px;height:3px;width:calc(var(--t,0)*100%);background:var(--brass)}
.track{position:absolute;top:140px;bottom:0;left:0;display:flex;width:400%;--k:0;transform:translateX(calc(var(--k)*-75%))}
.pane{width:25%;padding:10px 20px 0;display:flex;flex-direction:column;gap:6px}
.big{font:400 clamp(140px,44vw,360px)/.8 var(--disp);color:transparent;-webkit-text-stroke:1.5px var(--brass)}
.pane h2{font-size:clamp(40px,10.5vw,90px);line-height:1}
.pane p{margin-top:10px;color:#4b4a46;max-width:36ch}
.pane blockquote{margin-top:18px;border-left:2px solid var(--brass);padding-left:14px;font:400 20px/1.35 var(--disp);max-width:30ch}
html:not(.motion) .track{position:relative;top:auto;width:auto;flex-direction:column;transform:none;padding-top:130px}
html:not(.motion) .pane{width:auto;padding-bottom:40px}

/* 3 equipe */
.s-equipe .stage{background:var(--ink);color:var(--stone);display:flex;flex-direction:column;justify-content:center;padding:0 20px}
.eq-k{position:absolute;left:20px;top:92px}
.noms{list-style:none}
.noms li{--t:0;font:400 clamp(64px,19vw,190px)/.95 var(--disp);opacity:calc(.08 + .92*var(--t));transform:translateX(calc((1 - var(--t))*-40px))}
.noms li:nth-child(even){text-align:right;color:var(--brass2)}
.eq-q{position:absolute;left:20px;right:20px;bottom:calc(92px + env(safe-area-inset-bottom));--t:0;opacity:var(--t);transform:translateY(calc((1 - var(--t))*30px));
  background:var(--stone);color:var(--ink);padding:18px;border-radius:20px;font:400 20px/1.35 var(--disp);max-width:560px}
.eq-q small{display:block;font:500 12px/1 var(--txt);letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin-top:10px}
html:not(.motion) .noms li{opacity:1;transform:none}
html:not(.motion) .eq-q{position:relative;opacity:1;transform:none;margin:30px 0;left:auto;right:auto;bottom:auto}

/* 4 domaines */
.domaines{background:var(--stone2);padding:90px 20px 80px}
.domaines h2{font-size:clamp(38px,10vw,92px);line-height:1;margin:14px 0 30px;max-width:16ch}
.cards{display:grid;gap:14px}
.cards article{background:var(--stone);border-radius:22px;padding:24px;border:1px solid rgba(185,138,75,.25)}
.cards h3{font-size:34px;line-height:1;margin-bottom:10px}
.cards p{color:#4b4a46}
.q{margin-top:34px;border-left:2px solid var(--brass);padding-left:16px}
.q blockquote{font:400 24px/1.3 var(--disp)}
.q figcaption{font-size:13px;color:var(--mute);margin-top:8px}

/* 5 mot */
.s-mot .stage{background:var(--brass);color:var(--ink);display:flex;flex-direction:column;justify-content:center;padding:0 20px}
.mot{font:400 clamp(46px,12vw,160px)/.95 var(--disp)}
.mot span{display:block;--t:0;opacity:calc(.15 + .85*var(--t));transform:translateY(calc((1 - var(--t))*26px))}
.mot em{color:var(--stone)}
.mot-by{margin-top:26px;font-size:14px;--u:0;opacity:var(--u)}
html:not(.motion) .mot span,html:not(.motion) .mot-by{opacity:1;transform:none}

/* 6 contact */
.venir{background:var(--ink);color:var(--stone);padding:100px 20px 120px}
.venir h2{font-size:clamp(44px,11.5vw,112px);line-height:.98;margin:14px 0 14px}
.venir h2 em{color:var(--brass2)}
.sub{color:#b9b2a5}
.foot{background:#121822;color:#9a958b;padding:40px 20px 110px;font-size:14px;display:grid;gap:8px}
.foot-logo{font:400 30px/1 var(--disp);color:var(--stone)}.foot-logo i{font-style:normal;color:var(--brass2)}
.foot-prop{color:var(--brass2)}
.dock{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:60;display:grid;grid-template-columns:1fr 1.5fr 1fr;background:rgba(26,34,48,.94);backdrop-filter:blur(10px);border-radius:999px;overflow:hidden;border:1px solid rgba(216,176,122,.35)}
.dock a{color:var(--stone);text-decoration:none;text-align:center;padding:15px 6px;font:500 14px/1 var(--txt)}
.dock-main{background:var(--brass);color:#1a1206!important}
@media (min-width:900px){
  body{font-size:18px}.bar{padding:22px 44px}.dock{display:none}
  .c-a{left:60px;top:150px;max-width:56%}.c-b{left:60px;bottom:64px}
  .chemin-k,.rail{left:60px}.rail{right:60px;top:160px}.track{top:190px}
  .pane{flex-direction:row;align-items:center;gap:60px;padding:0 60px}.big{flex:none;width:38vw;font-size:clamp(200px,26vw,420px)}
  .s-equipe .stage{padding:0 60px}.eq-k{left:60px;top:130px}.eq-q{left:auto;right:60px;bottom:64px;max-width:480px}
  .domaines{padding:130px 60px}.cards{grid-template-columns:repeat(3,1fr)}
  .s-mot .stage{padding:0 60px}
  .venir{padding:130px 60px}.foot{padding:40px 60px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}