/* ====== Sahyla Studio · motion & accueil ====== */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* préchargeur */
.prechargeur{position:fixed;inset:0;z-index:300;background:var(--ivoire);display:none;flex-direction:column;align-items:center;justify-content:center;gap:34px}
.js .prechargeur{display:flex}
.js.deja-vu .prechargeur{display:none}
.pre-logo{font-family:var(--serif);color:var(--brun);text-align:center;line-height:1;overflow:hidden}
.pre-logo b{display:block;font-weight:300;font-size:clamp(2.4rem,7vw,4rem);letter-spacing:.34em;padding-left:.34em}
.pre-logo i{display:block;font-style:normal;color:var(--rose);font-size:.8rem;margin:12px 0 8px}
.pre-logo small{display:block;font-family:var(--sans);font-size:.7rem;letter-spacing:.6em;padding-left:.6em;color:var(--taupe)}
.pre-barre{width:140px;height:1px;background:var(--ligne);overflow:hidden}
.pre-barre span{display:block;height:100%;width:100%;background:var(--brun);transform:scaleX(0);transform-origin:left}

/* rideau de transition */
.rideau{position:fixed;inset:0;z-index:250;background:var(--brun);transform:scaleY(0);transform-origin:bottom;pointer-events:none}

/* curseur */
.curseur{position:fixed;left:0;top:0;z-index:400;pointer-events:none;display:none}
.curseur span{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--brun);display:flex;align-items:center;justify-content:center;font-size:0;color:var(--ivoire);letter-spacing:.2em;text-transform:uppercase;transition:width .35s,height .35s,left .35s,top .35s,background .35s,font-size .2s}
.curseur.sur-lien span{width:44px;height:44px;left:-22px;top:-22px;background:rgba(255,102,196,.22)}
.curseur.sur-img span{width:86px;height:86px;left:-43px;top:-43px;background:var(--brun);font-size:.62rem}
@media (hover:hover) and (pointer:fine){.js .curseur{display:block}}

/* entête au-dessus du hero */
.entete{transition:transform .5s cubic-bezier(.7,0,.2,1),background .4s}
.entete.cache-haut{transform:translateY(-100%)}

/* révélations */
.mot{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.mot>span{display:inline-block;will-change:transform}
.js [data-fade]{opacity:0}
.js [data-reveal]{clip-path:inset(100% 0 0 0)}
.js .deja-montre [data-fade],.no-motion [data-fade]{opacity:1!important}

/* ===== HERO ===== */
.hero2{position:relative;min-height:calc(100svh - 78px);display:grid;grid-template-columns:1fr 1fr;align-items:stretch;padding:0;overflow:hidden;background:var(--creme)}
.hero2-fond{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 30%,#F5F1EB 0%,var(--creme) 60%)}
.hero2-texte{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:60px 4vw 90px max(24px,calc((100vw - var(--max))/2 + 24px))}
.hero2-titre{font-family:var(--serif);font-weight:300;text-transform:uppercase;font-size:clamp(2.5rem,5.2vw,5.6rem);line-height:.98;letter-spacing:.005em;color:var(--brun)}
.hero2-titre .l{display:block;overflow:hidden;padding-bottom:.06em;white-space:nowrap}
.hero2-titre .l>span{display:inline-block}
.hero2-titre em{font-style:italic;text-transform:none;color:var(--taupe);font-weight:300}
.hero2-texte p{max-width:420px;font-size:1.02rem}
.hero2-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:36px}
.hero2-visuel{position:relative;z-index:1}
.hero2-masque{position:absolute;inset:0;overflow:hidden}
.hero2-masque img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.hero2-masque:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--creme) 0%,rgba(232,222,210,0) 22%)}
.js .hero2-masque{clip-path:inset(0 0 100% 0)}
.badge{position:absolute;z-index:3;right:max(24px,calc((100vw - var(--max))/2 + 10px));bottom:56px;width:150px;height:150px;color:var(--ivoire)}
.badge svg{width:100%;height:100%;animation:tourne 22s linear infinite}
.badge text{font-family:var(--sans);font-size:13.5px;letter-spacing:3.4px;fill:currentColor}
.badge span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:2.8rem;font-weight:300;font-style:italic}
.badge:before{content:"";position:absolute;inset:26px;border:1px solid rgba(255,253,251,.55);border-radius:50%}
@keyframes tourne{to{transform:rotate(360deg)}}
.defiler{position:absolute;z-index:3;left:max(24px,calc((100vw - var(--max))/2 + 24px));bottom:26px;display:flex;align-items:center;gap:14px;font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--taupe)}
.defiler span{width:1px;height:42px;background:var(--ligne);position:relative;overflow:hidden}
.defiler span:after{content:"";position:absolute;left:0;top:-50%;width:100%;height:50%;background:var(--brun);animation:goutte 2.2s cubic-bezier(.7,0,.3,1) infinite}
@keyframes goutte{to{top:100%}}

/* ===== bande défilante ===== */
.defile{background:var(--brun);color:var(--ivoire);overflow:hidden;padding:22px 0;white-space:nowrap}
.defile-piste{display:inline-flex;align-items:center;gap:38px;padding-right:38px;will-change:transform}
.defile span{font-family:var(--serif);font-size:clamp(1.4rem,2.6vw,2.1rem);font-weight:300;font-style:italic}
.defile i{font-style:normal;color:var(--rose);font-size:.9rem}
.no-js-defile .defile-piste,.no-motion .defile-piste{animation:none}

/* ===== manifeste ===== */
.manifeste{padding:150px 0 130px;text-align:center}
.eclaire{font-family:var(--serif);font-weight:300;font-size:clamp(1.7rem,3.6vw,3rem);line-height:1.28;color:var(--brun);max-width:1000px;margin:0 auto}
.eclaire .m{opacity:.16;transition:none}
.manifeste-sign{margin-top:46px}
.manifeste-sign span{display:block;font-family:var(--serif);font-style:italic;font-size:1.8rem;color:var(--taupe)}
.manifeste-sign small{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--taupe)}

/* ===== signature horizontale ===== */
.signature{padding:110px 0 0;background:var(--ivoire);overflow:hidden}
.signature-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:60px}
.signature-tete p{max-width:300px;font-size:.95rem}
.horizontal{padding-bottom:110px}
.piste{display:flex;gap:28px;padding:0 max(24px,calc((100vw - var(--max))/2 + 24px));width:max-content}
.sig{flex:0 0 auto;width:min(380px,78vw);background:#EFE7DD;display:flex;flex-direction:column;transition:background .4s}
.sig:hover{background:var(--poudre)}
.sig-img{aspect-ratio:4/4.3;overflow:hidden}
.sig-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.sig:hover .sig-img img{transform:scale(1.05)}
.sig-corps{display:flex;gap:20px;padding:28px 28px 32px}
.sig-ico{flex:0 0 44px;width:44px;height:44px;color:var(--taupe)}
.sig-num{font-size:.66rem;letter-spacing:.24em;color:var(--rose)}
.sig h3{font-family:var(--serif);font-weight:400;text-transform:uppercase;letter-spacing:.06em;font-size:1.45rem;margin:4px 0 8px}
.sig p{font-size:.9rem;line-height:1.6}
.sig-lien{display:inline-block;margin-top:16px;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--brun)}
.sig-lien i{font-style:normal;display:inline-block;transition:transform .35s}
.sig:hover .sig-lien i{transform:translateX(6px)}
.sig-fin{background:var(--brun);color:#E8DED2;justify-content:center;padding:50px 40px;align-items:flex-start}
.sig-fin:hover{background:#2A1D18}
.sig-fin h3{color:var(--ivoire);text-transform:none;font-size:2.1rem;letter-spacing:0;line-height:1.15;margin-bottom:30px}

/* ===== étapes empilées ===== */
.etapes2{padding:120px 0;background:var(--creme)}
.etapes2-tete{text-align:center;margin-bottom:70px}
.pile{display:flex;flex-direction:column;gap:30px}
.pile-carte{position:sticky;top:110px;display:grid;grid-template-columns:110px 1fr 300px;gap:40px;align-items:center;background:var(--ivoire);padding:44px 48px;border:1px solid var(--ligne);transform-origin:center top;box-shadow:0 -10px 40px rgba(56,40,33,.05)}
.pile-carte:nth-child(2){top:130px}.pile-carte:nth-child(3){top:150px}
.pile-num{font-family:var(--serif);font-weight:300;font-size:4.6rem;line-height:1;color:var(--rose)}
.pile-carte h3{font-size:2rem;margin-bottom:12px}
.pile-img img{width:100%;aspect-ratio:4/3;object-fit:cover}

/* ===== bandeau plein écran ===== */
.plein{position:relative;padding:0;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:var(--ivoire)}
.plein-cadre{position:absolute;inset:0;overflow:hidden}
.plein-cadre img{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.plein-voile{position:absolute;inset:0;background:linear-gradient(90deg,rgba(56,40,33,.78) 0%,rgba(56,40,33,.35) 55%,rgba(56,40,33,.1) 100%)}
.plein-texte{position:relative;z-index:2;color:var(--ivoire)}
.plein-texte h2{color:var(--ivoire);font-weight:300;text-transform:uppercase;font-size:clamp(2.6rem,6vw,5.4rem);line-height:1;max-width:760px;margin-bottom:44px}
.plein-texte h2 em{color:var(--poudre);text-transform:none}

/* ===== réalisations ===== */
.realis{padding:130px 0}
.realis-tete{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px;gap:30px}
.realis-grille{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:110px;gap:18px}
.realis-grille figure{overflow:hidden;background:var(--creme)}
.realis-grille img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.realis-grille figure:hover img{transform:scale(1.05)}
.r1{grid-column:1/6;grid-row:1/6}.r2{grid-column:6/9;grid-row:2/5}.r3{grid-column:9/13;grid-row:1/5}
.r4{grid-column:6/9;grid-row:5/8}.r5{grid-column:9/13;grid-row:5/8}

/* ===== avis + confiance ===== */
.avis2{padding:90px 0;background:var(--poudre)}
.avis2 .wrap{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.avis2-score{display:flex;align-items:center;gap:30px}
.compteur{font-family:var(--serif);font-weight:300;font-size:clamp(5rem,10vw,8rem);line-height:.9;color:var(--brun)}
.avis2 .etoiles{font-size:1.2rem}
.avis2 p{margin-top:6px}
.confiance{background:#E8DED2;padding:44px 0;border-top:1px solid var(--ligne)}
.confiance .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.confiance .wrap>div{display:flex;align-items:center;gap:18px;justify-content:center;padding:6px 10px}
.confiance .wrap>div+div{border-left:1px solid #D6C6B5}
.confiance span{width:34px;height:34px;color:var(--brun);flex:0 0 34px}
.confiance p{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.6;color:var(--brun)}

/* entête transparente sur l'accueil */


/* ===== responsive ===== */
@media (max-width:1000px){
  .hero2{grid-template-columns:1fr;min-height:auto}
  .hero2-visuel{height:64svh;order:-1}
  .hero2-masque:after{background:linear-gradient(0deg,var(--creme) 0%,rgba(232,222,210,0) 30%)}
  .hero2-texte{padding:10px 24px 80px}
  .badge{width:112px;height:112px;top:calc(64svh - 140px);bottom:auto;right:20px}
  .badge text{font-size:14px}
  .badge span{font-size:2.1rem}
  .defiler{display:none}
  .signature-tete{flex-direction:column;align-items:flex-start}
  .horizontal{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:none}
  .horizontal::-webkit-scrollbar{display:none}
  .sig{scroll-snap-align:center}
  .pile-carte{grid-template-columns:1fr;gap:18px;padding:34px 28px;top:96px}
  .pile-carte:nth-child(2){top:112px}.pile-carte:nth-child(3){top:128px}
  .pile-num{font-size:3.2rem}
  .pile-img{display:none}
  .plein{min-height:86svh}
  .realis-grille{grid-template-columns:1fr 1fr;grid-auto-rows:auto}
  .realis-grille figure{grid-column:auto!important;grid-row:auto!important;aspect-ratio:4/5}
  .realis-grille .r1{grid-column:1/3!important;aspect-ratio:4/3}
  .confiance .wrap{grid-template-columns:1fr 1fr;row-gap:26px}
  .confiance .wrap>div:nth-child(3){border-left:0}
  .confiance .wrap>div{justify-content:flex-start}
}
@media (max-width:640px){
  .manifeste{padding:100px 0 90px}
  .hero2-actions .btn{width:100%}
  .realis-tete{flex-direction:column;align-items:flex-start}
  .avis2-score{gap:20px}
  .confiance p{font-size:.62rem}
  .confiance .wrap>div{gap:12px;padding:6px 4px}
}
@media (prefers-reduced-motion:reduce){
  .badge svg,.defiler span:after{animation:none}
  .js [data-fade]{opacity:1}.js [data-reveal],.js .hero2-masque{clip-path:none}
  .eclaire .m{opacity:1}
}

/* ====== HERO plein écran, image + superposition noire ====== */
.hero2{display:block;min-height:100svh;background:#1c130f;color:var(--ivoire)}
.hero2-fond{display:none}
.hero2-visuel{position:absolute;inset:0;z-index:0}
.hero2-masque img{object-position:center 42%}
.hero2-masque:after{background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.55) 38%,rgba(0,0,0,.18) 72%,rgba(0,0,0,.08) 100%),linear-gradient(0deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,0) 35%),linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 22%)}
.hero2-texte{min-height:100svh;padding-top:130px;max-width:calc(var(--max)/2 + max(24px,calc((100vw - var(--max))/2 + 24px)) + 80px)}
.hero2 .sur{color:var(--poudre)}
.hero2-titre{color:var(--ivoire)}
.hero2-titre em{color:var(--poudre)}
.hero2-texte p{color:rgba(245,241,235,.86)}
.hero2 .filet{background:var(--rose)}
.hero2 .lien{color:var(--ivoire);border-color:var(--rose)}
.hero2 .btn.blanc:hover{background:transparent;color:var(--ivoire);border-color:var(--ivoire)}
.hero2 .defiler{color:rgba(245,241,235,.75)}
.hero2 .defiler span{background:rgba(245,241,235,.25)}
.hero2 .defiler span:after{background:var(--ivoire)}

/* menu transparent sur l'accueil, plein au scroll */
.page-index .entete{position:fixed;left:0;right:0;top:0;background:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.page-index .entete .logo,.page-index .entete .nav a{color:var(--ivoire)}
.page-index .entete .logo small{color:var(--poudre)}
.page-index .entete .nav .btn{background:transparent;border-color:rgba(245,241,235,.7);color:var(--ivoire)}
.page-index .entete .nav .btn:hover{background:var(--ivoire);color:var(--brun)}
.page-index .entete .burger span{background:var(--ivoire)}
.page-index .entete.plein-fond{background:rgba(245,241,235,.95);border-bottom-color:var(--ligne);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.page-index .entete.plein-fond .logo,.page-index .entete.plein-fond .nav a{color:var(--texte)}
.page-index .entete.plein-fond .logo b{color:var(--brun)}
.page-index .entete.plein-fond .logo small{color:var(--taupe)}
.page-index .entete.plein-fond .nav .btn{background:var(--brun);border-color:var(--brun);color:var(--ivoire)}
.page-index .entete.plein-fond .burger span{background:var(--brun)}

@media (max-width:1000px){
  .hero2-visuel{height:auto;order:0}
  .hero2-masque:after{background:linear-gradient(0deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.6) 40%,rgba(0,0,0,.25) 70%,rgba(0,0,0,.45) 100%)}
  .hero2-masque img{object-position:center 38%}
  .hero2-texte{justify-content:flex-end;padding:120px 24px 70px}
  .badge{top:96px;right:18px;bottom:auto}
}

/* menu mobile : le panneau couvre bien tout l'écran */
@media (max-width:1000px){
  .menu-ouvert .entete,.menu-ouvert.page-index .entete{transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--ivoire)!important;border-bottom-color:var(--ligne)!important}
  .nav{position:fixed;inset:auto;top:78px;left:0;right:0;width:100%;height:calc(100svh - 78px);background:var(--ivoire);z-index:49}
  .nav a,.page-index .entete .nav a{color:var(--brun)!important;font-size:.95rem}
  .page-index .entete .nav .btn{background:var(--brun);border-color:var(--brun);color:var(--ivoire)!important}
  .menu-ouvert .entete .logo,.menu-ouvert .entete .logo b{color:var(--brun)!important}
  .menu-ouvert .entete .burger span{background:var(--brun)!important}
}
@media (max-width:1000px){
  .nav .btn,.page-index .entete .nav .btn{color:var(--ivoire)!important}
  .menu-ouvert .entete .logo small{color:var(--taupe)!important}
}