:root{--ivoire:#FBF9F5;--encre:#1A1714;--laiton:#A8814A;--zellige:#17352E;--gris:#6b655d;--filet:#e4dfd6}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:'Jost',system-ui,sans-serif;font-weight:300;background:var(--ivoire);color:var(--encre);line-height:1.7;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--laiton);outline-offset:4px}
h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;line-height:1.08}
.kicker{font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;color:var(--laiton);font-weight:500;margin-bottom:18px}

/* barre + header */
.topbar{position:relative;z-index:31;background:var(--zellige);color:#e9e2d2;font-size:.8rem;letter-spacing:.06em;display:flex;justify-content:center;gap:28px;align-items:center;height:34px}
.topbar a{text-decoration:none;opacity:.85}
.dot{width:7px;height:7px;border-radius:50%;background:#58e08e;margin-right:-18px;animation:pulse 2.4s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px transparent}0%{box-shadow:0 0 0 0 #58e08e}}
header{position:sticky;top:0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(20px,4vw,56px);height:78px;transition:background .35s,color .35s,box-shadow .35s}
.has-hero header{position:fixed;top:34px;left:0;right:0;color:#fff}
.no-hero header,header.solid{background:rgba(251,249,245,.96);color:var(--encre);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--filet)}
.has-hero header.solid{position:fixed;top:0}
.brand{font-family:'Cormorant Garamond',serif;font-size:1.7rem;text-decoration:none;letter-spacing:.01em;white-space:nowrap}
.brand i{color:var(--laiton)}
nav{display:flex;gap:34px;align-items:center}
nav a{text-decoration:none;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;font-weight:400;padding:6px 0;border-bottom:1px solid transparent}
nav a:hover,nav a[aria-current]{border-color:var(--laiton)}
nav a.cta{border:1px solid currentColor;padding:11px 22px;border-radius:0}
nav a.cta:hover{background:var(--laiton);border-color:var(--laiton);color:#fff}
#burger{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;color:inherit}
#burger span{display:block;height:1.5px;background:currentColor;margin:7px 10px;transition:.3s}

/* hero */
.hero,.phead{position:relative;background:var(--bg) center/cover no-repeat;color:#fff;display:flex;align-items:flex-end}
.hero::before,.phead::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,18,15,.55),rgba(10,18,15,.25) 40%,rgba(10,18,15,.7))}
.hero{min-height:calc(100svh - 34px);margin-top:-78px}
.hero-in,.phead-in{position:relative;padding:0 clamp(20px,6vw,90px) clamp(60px,9vh,110px);max-width:1100px}
.hero h1{font-size:clamp(3rem,8.4vw,7.2rem);letter-spacing:-.01em;margin-bottom:22px}
.hero p{max-width:46ch;font-size:1.12rem;margin-bottom:34px}
.scroll{position:absolute;right:clamp(20px,5vw,70px);bottom:48px;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:#fff;text-decoration:none;writing-mode:vertical-rl;padding-bottom:62px;background:linear-gradient(#fff,#fff) bottom center/1px 48px no-repeat}
.phead{min-height:52vh}
.phead h1{font-size:clamp(2.8rem,7vw,5.6rem);margin-bottom:14px}
.phead p{max-width:48ch;font-size:1.1rem}

.btn{display:inline-block;font:inherit;font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;font-weight:400;text-decoration:none;padding:16px 34px;border:1px solid var(--encre);background:transparent;color:var(--encre);cursor:pointer;transition:.3s}
.btn:hover{background:var(--encre);color:#fff}
.btn.light{border-color:#fff;color:#fff}
.btn.light:hover{background:#fff;color:var(--encre)}
.btn.dark{background:var(--zellige);border-color:var(--zellige);color:#fff}
.btn.dark:hover{background:var(--laiton);border-color:var(--laiton)}

/* sections */
.intro{max-width:820px;margin:0 auto;padding:130px 24px;text-align:center}
.intro h2{font-size:clamp(2rem,4.2vw,3.3rem);margin-bottom:26px}
.intro p:last-child{color:var(--gris);font-size:1.08rem}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:0 6px}
.tile{position:relative;aspect-ratio:3/4;overflow:hidden;color:#fff;text-decoration:none;display:flex;align-items:flex-end}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(10,18,15,.75))}
.tile:hover img{transform:scale(1.05)}
.tile span{position:relative;z-index:1;padding:34px;font-family:'Cormorant Garamond',serif;font-size:2.4rem;line-height:1.1}
.tile small{display:block;font-family:'Jost',sans-serif;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;margin-top:8px;opacity:.85}

.season{padding:130px clamp(20px,6vw,90px) 110px;max-width:1400px;margin:0 auto}
.season-head h2{font-size:clamp(2.2rem,4.6vw,3.6rem);margin-bottom:34px}
.tabs{display:flex;gap:30px;flex-wrap:wrap;border-bottom:1px solid var(--filet);margin-bottom:54px}
.tabs button{font:inherit;font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;background:none;border:0;border-bottom:2px solid transparent;padding:0 0 16px;margin-bottom:-1px;cursor:pointer;color:var(--gris)}
.tabs button[aria-selected=true]{color:var(--encre);border-color:var(--laiton)}
.season-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.season-body img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:opacity .4s}
.season-body p{font-size:1.15rem;color:var(--gris);margin-bottom:28px;max-width:44ch}
.menu{list-style:none;padding:0;margin:0 0 36px}
.menu li{display:flex;justify-content:space-between;gap:24px;padding:15px 0;border-bottom:1px solid var(--filet)}
.menu span{font-weight:400}
.menu em{font-style:normal;color:var(--gris);text-align:right}

.split{display:grid;grid-template-columns:1fr 1fr;min-height:min(86vh,760px)}
.split figure{position:relative;overflow:hidden;min-height:420px}
.split figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split .txt{display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,7vw,110px);max-width:760px}
.split h2{font-size:clamp(2rem,3.8vw,3.2rem);margin-bottom:22px}
.split .txt>p:not(.kicker){color:var(--gris);font-size:1.05rem;margin-bottom:30px;max-width:46ch}
.split.flip figure{order:2}
.split:nth-of-type(even){background:#f3efe7}

.quote{background:var(--zellige);color:#f1ead9;text-align:center;padding:130px 24px}
.quote blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(1.8rem,3.6vw,3rem);line-height:1.25;max-width:24em;margin:0 auto 26px}
.quote p{font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;color:var(--laiton)}
.logos{padding:90px 24px;text-align:center}
.logo-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:30px 56px;max-width:1100px;margin:30px auto 0}
.logo-row img{height:46px;width:auto;max-width:130px;object-fit:contain;filter:grayscale(1);opacity:.6;transition:.3s}
.logo-row img:hover{filter:none;opacity:1}
.band{background:var(--ivoire);text-align:center;padding:120px 24px;border-top:1px solid var(--filet)}
.band h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:34px}

.steps{max-width:1200px;margin:0 auto;padding:120px clamp(20px,5vw,60px)}
.steps h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:56px}
.steps ol{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
.steps li{border-top:1px solid var(--laiton);padding-top:22px}
.steps b{font-family:'Cormorant Garamond',serif;font-size:2.4rem;font-weight:400;color:var(--laiton)}
.steps h3{font-size:1.6rem;margin:6px 0 8px}
.steps p{color:var(--gris)}

.contact{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(40px,8vw,120px);max-width:1200px;margin:0 auto;padding:110px clamp(20px,5vw,60px)}
form{display:grid;gap:26px}
label{display:grid;gap:10px;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;font-weight:400}
select,input[type=date],input[type=text]{font:inherit;font-size:1rem;letter-spacing:0;text-transform:none;padding:14px 0;border:0;border-bottom:1px solid var(--encre);background:transparent;border-radius:0}
input[type=range]{accent-color:var(--laiton);width:100%}
small{color:var(--gris)}
aside h3{font-size:1.7rem;margin:0 0 6px}
aside p{margin-bottom:28px;color:var(--gris)}

footer{background:var(--encre);color:#cfc8ba;padding:90px clamp(20px,5vw,60px) 40px}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:50px;max-width:1200px;margin:0 auto}
footer .brand{color:#fff}
footer h4{font-size:.75rem;letter-spacing:.26em;text-transform:uppercase;color:var(--laiton);margin-bottom:16px;font-weight:500}
footer .f-grid a:not(.brand){display:block;text-decoration:none;padding:3px 0}
footer .f-grid a:hover{color:#fff}
footer p{margin-top:12px}
.legal{max-width:1200px;margin:60px auto 0!important;padding-top:24px;border-top:1px solid #3a342d;font-size:.8rem;opacity:.7}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s ease}
.reveal.v{opacity:1;transform:none}

@media(max-width:900px){
  .topbar a{display:none}.dot{margin-right:-18px}
  #burger{display:block;z-index:41}
  nav{position:fixed;inset:0;background:var(--zellige);color:#fff;flex-direction:column;justify-content:center;gap:26px;transform:translateX(100%);transition:transform .45s cubic-bezier(.2,.7,.2,1);z-index:40}
  nav a{font-size:1rem}
  body.open nav{transform:none}
  body.open #burger{color:#fff;position:relative}
  .tiles,.steps ol,.season-body,.contact,.f-grid{grid-template-columns:1fr}
  .steps ol{gap:30px}
  .tile{aspect-ratio:4/3}
  .split{grid-template-columns:1fr;min-height:0}
  .split.flip figure{order:0}
  .split figure{min-height:300px}
  .scroll{display:none}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* ===== navigation animée et fluidité ===== */
#progress{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--laiton);transform:scaleX(0);transform-origin:left;z-index:60}
#wipe{position:fixed;inset:0;z-index:100;background:var(--zellige);transform:translateY(-100%);pointer-events:none}
#wipe::after{content:"L'instant Rest";position:absolute;inset:0;display:grid;place-items:center;font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--laiton);font-style:italic}
body{animation:pagein .7s ease both}
@keyframes pagein{from{opacity:.4}}
#wipe{animation:wipeout .8s cubic-bezier(.7,0,.2,1) both}
@keyframes wipeout{from{transform:translateY(0)}to{transform:translateY(-100%)}}
#wipe.go{animation:wipein .45s cubic-bezier(.7,0,.2,1) both}
@keyframes wipein{from{transform:translateY(100%)}to{transform:translateY(0)}}

header{transition:transform .45s cubic-bezier(.2,.7,.2,1),background .35s,color .35s,box-shadow .35s}
header.hide{transform:translateY(-110%)}
nav a:not(.cta){position:relative;border-bottom:0}
nav a:not(.cta)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--laiton);transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
nav a:not(.cta):hover::after,nav a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.btn{position:relative;overflow:hidden;z-index:0}
.btn::before{content:"";position:absolute;inset:0;background:var(--laiton);transform:translateY(101%);transition:transform .4s cubic-bezier(.2,.7,.2,1);z-index:-1}
.btn:hover::before{transform:none}
.btn:hover{background:transparent;color:#fff;border-color:var(--laiton)}
.btn.light:hover{color:#fff}
.btn.dark:hover{background:var(--zellige);border-color:var(--laiton)}
.hero,.phead{background-attachment:scroll;background-position:center calc(50% + var(--py,0px))}
.tile img,.split figure img{transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.split:hover figure img{transform:scale(1.04)}
[id]{scroll-margin-top:130px}

.subnav{position:sticky;top:78px;z-index:25;display:flex;gap:6px 30px;justify-content:center;flex-wrap:wrap;padding:16px 20px;background:rgba(251,249,245,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--filet);transition:top .45s cubic-bezier(.2,.7,.2,1)}
body.hdr-hidden .subnav{top:0}
.subnav a{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--gris);padding:4px 0;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.subnav a:hover,.subnav a.on{color:var(--encre);border-color:var(--laiton)}

.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:1200px;margin:0 auto;padding:100px clamp(20px,5vw,60px);text-align:center}
.stats b{display:block;font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(3rem,6vw,5rem);line-height:1;color:var(--zellige)}
.stats small{display:block;margin-top:12px;color:var(--gris);max-width:20ch;margin-inline:auto}

.hygiene{background:var(--zellige);color:#f1ead9;padding:120px clamp(20px,5vw,60px)}
.hy-head{max-width:760px;margin:0 auto 70px;text-align:center}
.hy-head h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:20px}
.hy-head p:last-child{color:#c9d2c8}
.piliers{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;max-width:1200px;margin:0 auto;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14)}
.piliers li{background:var(--zellige);padding:38px 32px;transition:background .4s}
.piliers li:hover{background:#1f453c}
.piliers h3{font-size:1.7rem;margin-bottom:10px;color:#fff}
.piliers p{color:#c9d2c8;font-size:.98rem}

.process{max-width:1200px;margin:0 auto;padding:120px clamp(20px,5vw,60px)}
.process h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:60px}
.process ol{list-style:none;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:20px;position:relative}
.process ol::before{content:"";position:absolute;top:21px;left:0;right:0;height:1px;background:var(--filet)}
.process li{position:relative}
.process b{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--ivoire);border:1px solid var(--laiton);font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:500;color:var(--laiton);margin-bottom:16px;transition:.4s}
.process li:hover b{background:var(--laiton);color:#fff}
.process span{display:block;font-size:.95rem;max-width:16ch}

.plats{max-width:1300px;margin:0 auto;padding:110px clamp(20px,4vw,50px)}
.plats h2{font-size:clamp(2rem,4vw,3.2rem);max-width:20ch;margin-bottom:50px}
.gal{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:240px;gap:14px}
.gal .g{position:relative;overflow:hidden;margin:0}
.gal .tall{grid-row:span 2}.gal .wide{grid-column:span 2}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.gal .g:hover img{transform:scale(1.06)}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;color:#fff;font-size:.9rem;background:linear-gradient(transparent,rgba(10,18,15,.8));transform:translateY(100%);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.gal .g:hover figcaption{transform:none}
.refh{font-size:clamp(1.8rem,3.2vw,2.6rem);max-width:22ch;margin:0 auto}

.stats div,.piliers li,.process li,.gal .g{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease,background .4s}
.v .stats div,.stats.v div,.v .piliers li,.piliers.v li,.process.v li,.v .gal .g,.gal.v .g{opacity:1;transform:none}
.stats.v div:nth-child(2),.process.v li:nth-child(2),.piliers.v li:nth-child(2),.gal.v .g:nth-child(2){transition-delay:.1s}
.stats.v div:nth-child(3),.process.v li:nth-child(3),.piliers.v li:nth-child(3),.gal.v .g:nth-child(3){transition-delay:.2s}
.stats.v div:nth-child(4),.process.v li:nth-child(4),.piliers.v li:nth-child(4),.gal.v .g:nth-child(4){transition-delay:.3s}
.process.v li:nth-child(5),.piliers.v li:nth-child(5),.gal.v .g:nth-child(5){transition-delay:.4s}
.process.v li:nth-child(6),.piliers.v li:nth-child(6),.gal.v .g:nth-child(6){transition-delay:.5s}

@media(max-width:900px){
  .stats{grid-template-columns:1fr 1fr}
  .piliers{grid-template-columns:1fr}
  .process ol{grid-template-columns:1fr 1fr}.process ol::before{display:none}
  .gal{grid-template-columns:1fr 1fr;grid-auto-rows:200px}.gal .wide{grid-column:span 2}
  .subnav{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.subnav a{white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){#wipe{display:none}.stats div,.piliers li,.process li,.gal .g{opacity:1;transform:none}}