/* ═══════════════════════════════════════════
   La Promesse de l'Aube — Page d'accueil
   Charge uniquement sur template-accueil.php
   ═══════════════════════════════════════════ */

:root{
  --nuit:#0a1730;
  --marine:#14264f;
  --marine-txt:#1B2D5B;
  --or:#B8912F;
  --or-vif:#C9A84C;
  --or-lum:#E4C368;
  --ivoire:#FBF9F4;
  --sable:#F2EDE2;
  --encre:#2A3A56;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scrollbar-gutter:stable}
body{
  background:var(--ivoire);
  color:var(--encre);
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:17px;
  overflow-x:hidden;
}
img{max-width:100%;display:block}

/* ══ RIDEAU ══ */
#rideau{
  position:fixed;inset:0;z-index:9999;
  background:var(--ivoire);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  animation:rideau-part 1.4s 3.6s cubic-bezier(.76,0,.24,1) forwards;
}
@keyframes rideau-part{to{opacity:0;visibility:hidden}}
#rideau .intro-logo{
  width:min(520px,80vw);
  opacity:0;
  animation:intro-eclot 3s cubic-bezier(.19,1,.22,1) forwards;
}
@keyframes intro-eclot{
  0%{opacity:0;transform:scale(.94);filter:blur(10px)}
  100%{opacity:1;transform:scale(1);filter:blur(0)}
}
.intro-vers{
  margin-top:36px;
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:18px;letter-spacing:3px;color:var(--or);
  opacity:0;animation:doux 1.6s 1.8s forwards;
}
@keyframes doux{to{opacity:1}}
.intro-aube{
  position:absolute;bottom:0;left:0;right:0;height:34vh;
  background:linear-gradient(to top,rgba(184,145,47,.14),transparent);
  opacity:0;animation:doux 2.4s 1s forwards;
}

/* ══ HERO ══ */
.hero{
  position:relative;min-height:100svh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:130px 5vw 190px;text-align:center;
  background:
    linear-gradient(to bottom, transparent 0%, transparent 62%, var(--ivoire) 97%),
    radial-gradient(ellipse 130% 72% at 50% 86%, rgba(184,145,47,.15) 0%, transparent 60%),
    radial-gradient(ellipse 90% 60% at 50% 22%, rgba(20,38,79,.045) 0%, transparent 62%),
    var(--ivoire);
  overflow:hidden;
}
#ciel-hero{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero-aureole{
  position:absolute;left:50%;bottom:14%;transform:translateX(-50%);
  width:min(880px,116vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(184,145,47,.11) 0%,rgba(184,145,47,.035) 38%,transparent 66%);
  animation:aureole 11s ease-in-out infinite;pointer-events:none;
}
@keyframes aureole{
  0%,100%{opacity:.75;transform:translateX(-50%) scale(1)}
  50%{opacity:1;transform:translateX(-50%) scale(1.1)}
}
.hero-logo{
  width:min(760px,90vw);position:relative;z-index:3;
  margin-bottom:44px;mix-blend-mode:multiply;
  opacity:0;animation:logo-pose 2.2s 4.2s cubic-bezier(.19,1,.22,1) forwards;
}
@keyframes logo-pose{
  from{opacity:0;transform:translateY(30px) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.hero-vers{
  position:relative;z-index:3;
  font-family:'Cormorant Garamond',serif;font-weight:500;font-style:italic;
  font-size:clamp(20px,2.6vw,29px);line-height:1.75;
  color:var(--marine-txt);max-width:44ch;margin:0 auto 52px;
  text-align:center;text-wrap:balance;
}
.hero-vers span{
  display:block;opacity:0;
  animation:vers-eclot 1.5s cubic-bezier(.19,1,.22,1) forwards;
}
.hero-vers span:nth-child(1){animation-delay:4.9s}
.hero-vers span:nth-child(2){animation-delay:5.45s}
@keyframes vers-eclot{
  from{opacity:0;transform:translateY(14px);filter:blur(6px)}
  to{opacity:1;transform:translateY(0);filter:blur(0)}
}
.hero-portes{
  display:flex;gap:20px;flex-wrap:wrap;justify-content:center;
  position:relative;z-index:3;
  opacity:0;animation:doux 1.6s 6.4s forwards;
}
.porte{
  font-family:'Jost',sans-serif;font-size:14px;font-weight:400;
  letter-spacing:1.6px;text-transform:uppercase;text-decoration:none;
  padding:17px 40px;border-radius:100px;
  transition:transform .5s cubic-bezier(.2,.8,.2,1),background .5s,color .5s,box-shadow .5s;
}
.porte-pleine{
  background:var(--marine);color:var(--ivoire);
  box-shadow:0 6px 28px rgba(20,38,79,.2);
}
.porte-pleine:hover{
  background:var(--or);transform:translateY(-3px);
  box-shadow:0 12px 40px rgba(184,145,47,.34);
}
.porte-fine{
  border:1.5px solid rgba(20,38,79,.24);color:var(--marine-txt);
}
.porte-fine:hover{
  border-color:var(--or);color:var(--or);transform:translateY(-3px);
}
.hero-goutte{
  position:absolute;bottom:52px;left:50%;transform:translateX(-50%);z-index:4;
  display:flex;flex-direction:column;align-items:center;gap:14px;
  opacity:0;animation:doux 1.6s 7.2s forwards;
}
.goutte-piste{
  width:2px;height:74px;border-radius:2px;
  background:linear-gradient(to bottom,rgba(184,145,47,.35),rgba(184,145,47,.05));
  position:relative;overflow:hidden;
}
.goutte-piste::after{
  content:'';position:absolute;left:0;top:-26px;width:2px;height:26px;
  border-radius:2px;background:var(--or-vif);
  animation:goutte-tombe 3.4s cubic-bezier(.4,0,.5,1) infinite;
}
@keyframes goutte-tombe{
  0%{transform:translateY(0);opacity:0}
  20%{opacity:1}
  80%{opacity:1}
  100%{transform:translateY(100px);opacity:0}
}
.goutte-mot{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;
  font-size:15px;letter-spacing:2.5px;color:var(--or);
}

/* ══ VAGUES ══ */
.houle{position:relative;line-height:0;z-index:5;margin-top:-1px;margin-bottom:-1px}
.houle svg{width:100%;height:clamp(80px,11vw,150px);display:block}
.h-de-ivoire{background:var(--ivoire)}
.h-de-sable{background:var(--sable)}
.h-de-nuit{background:var(--nuit)}

/* ══ SECTIONS ══ */
.sect{position:relative;padding:clamp(88px,12vw,150px) 5vw;z-index:5}
.s-ivoire{background:var(--ivoire)}
.s-sable{background:var(--sable)}
.s-nuit{background:var(--nuit);color:#fff}
.wrap{max-width:1120px;margin:0 auto}

.chapitre{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;
  font-size:16px;letter-spacing:3.5px;text-transform:uppercase;
  color:var(--or);margin-bottom:26px;
  display:inline-flex;align-items:center;gap:14px;
}
.chapitre svg{flex-shrink:0}
.titre{
  font-family:'Marcellus',serif;
  font-size:clamp(38px,5.4vw,68px);line-height:1.13;
  color:var(--marine-txt);margin-bottom:34px;
}
.s-nuit .titre{color:#fff}
.titre i{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;
  color:var(--or);
}
.s-nuit .titre i{color:var(--or-lum)}
.prose{
  font-size:17.5px;font-weight:400;line-height:1.95;
  color:var(--encre);max-width:58ch;
}
.s-nuit .prose{color:rgba(255,255,255,.78)}

/* ══ PROMESSE ══ */
.promesse-flux{
  display:grid;grid-template-columns:1.1fr .9fr;
  gap:clamp(40px,7vw,100px);align-items:start;
}
.promesse-mots{position:relative}
.promesse-mots::before{
  content:'';position:absolute;left:-38px;top:14px;bottom:14px;width:26px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='400' viewBox='0 0 26 400'%3E%3Cpath d='M13 0 C4 60 22 110 13 170 C4 230 22 280 13 340 C8 370 15 385 13 400' stroke='%23B8912F' stroke-opacity='.35' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") no-repeat center/contain;
}
.signe{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;
  font-size:26px;color:var(--marine-txt);margin-top:48px;
  display:flex;align-items:center;gap:16px;
}

/* Chiffres */
.chiffres{padding-top:20px}
.ch{margin-bottom:clamp(42px,6vw,66px);position:relative}
.ch:nth-child(2){margin-left:clamp(16px,4.5vw,58px)}
.ch:nth-child(3){margin-left:clamp(8px,2vw,24px)}
.ch-val{
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:clamp(66px,9.5vw,108px);line-height:.88;
  color:var(--or);margin-bottom:14px;letter-spacing:-2px;
}
.ch-val sup{font-size:.3em;top:-1.5em;letter-spacing:0}
.ch-txt{
  font-size:16px;font-weight:400;line-height:1.75;
  color:var(--encre);max-width:26ch;
}

/* ══ SERVICES ══ */
.soins{max-width:1000px;margin:clamp(50px,7vw,80px) auto 0}
.soin{
  position:relative;
  display:grid;grid-template-columns:clamp(60px,7vw,88px) 1fr;
  gap:clamp(24px,4vw,52px);align-items:start;
  padding:clamp(34px,4.4vw,52px) clamp(20px,3vw,36px);
  border-radius:24px;
  transition:background .7s,transform .7s cubic-bezier(.2,.8,.2,1);
}
.soin:hover{background:rgba(255,255,255,.045);transform:translateX(10px)}
.soin-sep{
  height:34px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1000' height='34' viewBox='0 0 1000 34' preserveAspectRatio='none'%3E%3Cpath d='M0 17 C120 4 200 30 320 17 C440 4 520 30 640 17 C760 4 860 28 1000 17' stroke='%23C9A84C' stroke-opacity='.22' stroke-width='1.2' fill='none'/%3E%3C/svg%3E") no-repeat center/100% 100%;
}
.soin-vignette{
  width:clamp(58px,6.6vw,84px);aspect-ratio:1;
  display:flex;align-items:center;justify-content:center;
  border-radius:50% 50% 50% 8px;
  background:rgba(201,168,76,.09);
  border:1px solid rgba(201,168,76,.28);
  transition:background .6s,border-color .6s,transform .7s cubic-bezier(.2,.8,.2,1);
}
.soin:hover .soin-vignette{
  background:rgba(201,168,76,.2);border-color:var(--or-vif);
  transform:rotate(-8deg) scale(1.06);
}
.soin-nom{
  font-family:'Marcellus',serif;
  font-size:clamp(24px,3.2vw,34px);color:#fff;
  margin-bottom:14px;line-height:1.24;transition:color .6s;
}
.soin:hover .soin-nom{color:var(--or-lum)}
.soin-txt{
  font-size:16.5px;font-weight:400;line-height:1.85;
  color:rgba(255,255,255,.72);max-width:60ch;margin-bottom:16px;
}
.soin-detail{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;
  font-size:18px;color:var(--or-lum);
}

/* ══ TERRITOIRE ══ */
.terre-scene{
  position:relative;height:clamp(360px,46vw,480px);
  margin-top:clamp(44px,6vw,70px);
}
.terre-trace{position:absolute;inset:0;width:100%;height:100%}
.trace-cote{
  stroke:var(--or);stroke-opacity:.4;stroke-width:2;fill:none;
  stroke-linecap:round;
  stroke-dasharray:1800;stroke-dashoffset:1800;
}
.vu .trace-cote{animation:cote-dessin 4.5s .3s cubic-bezier(.4,0,.3,1) forwards}
@keyframes cote-dessin{to{stroke-dashoffset:0}}
.pt{
  position:absolute;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;gap:11px;
}
.pt-phare{
  width:11px;height:11px;border-radius:50%;
  background:var(--or);position:relative;
  box-shadow:0 0 0 4px rgba(184,145,47,.14);
  animation:phare-tourne 4.5s ease-in-out infinite;
  animation-delay:var(--d);
}
@keyframes phare-tourne{
  0%,100%{box-shadow:0 0 0 4px rgba(184,145,47,.12), 0 0 12px rgba(184,145,47,.4)}
  50%{box-shadow:0 0 0 7px rgba(184,145,47,.2), 0 0 26px rgba(184,145,47,.85)}
}
.pt-phare::after{
  content:'';position:absolute;inset:-6px;border-radius:50%;
  border:1.5px solid rgba(184,145,47,.4);
  animation:cercle-onde 4.5s ease-out infinite;animation-delay:var(--d);
}
@keyframes cercle-onde{
  0%{transform:scale(.6);opacity:.9}
  100%{transform:scale(3);opacity:0}
}
.pt-nom{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;
  font-size:clamp(15px,1.8vw,19px);
  color:var(--marine-txt);white-space:nowrap;
  transition:color .5s,transform .5s;
}
.pt:hover .pt-nom{color:var(--or);transform:translateY(-2px)}

/* ══ MAISONS ══ */
.maisons{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:clamp(22px,3vw,34px);margin-top:clamp(46px,6vw,72px);
}
.maison{
  position:relative;overflow:hidden;
  min-height:clamp(370px,44vw,470px);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(30px,3.6vw,44px);
  background:linear-gradient(172deg,#0f1f42,#183055 58%,#1f3d6d);
  border-radius:200px 200px 26px 26px;
  transition:transform .9s cubic-bezier(.19,1,.22,1),box-shadow .9s;
  box-shadow:0 10px 40px rgba(20,38,79,.16);
}
.maison:nth-child(2){margin-top:clamp(18px,3.6vw,44px)}
.maison:hover{transform:translateY(-12px);box-shadow:0 24px 60px rgba(20,38,79,.28)}
.maison-soleil{
  position:absolute;top:15%;left:50%;transform:translateX(-50%);
  width:58%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(201,168,76,.28),rgba(201,168,76,.06) 46%,transparent 70%);
  transition:opacity .9s,transform .9s;
}
.maison:hover .maison-soleil{opacity:.7;transform:translateX(-50%) scale(1.12)}
.maison-flot{position:absolute;left:0;right:0;bottom:0;height:84px;opacity:.5}
.maison-etiq{
  position:absolute;top:clamp(26px,3.4vw,38px);left:50%;transform:translateX(-50%);
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;
  font-size:15px;letter-spacing:2.5px;
  color:var(--or-lum);white-space:nowrap;
}
.maison-lieu{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;
  font-size:16px;letter-spacing:2px;color:var(--or-lum);
  margin-bottom:12px;position:relative;
}
.maison-nom{
  font-family:'Marcellus',serif;
  font-size:clamp(23px,2.7vw,29px);color:#fff;
  margin-bottom:12px;line-height:1.26;position:relative;
}
.maison-txt{
  font-size:16px;font-weight:400;line-height:1.75;
  color:rgba(255,255,255,.72);position:relative;
}

/* ══ CONTACT ══ */
.contact{text-align:center;position:relative}
.contact-logo{
  width:min(360px,66vw);margin:0 auto clamp(36px,5vw,54px);
  mix-blend-mode:multiply;
}
.contact-titre{
  font-family:'Marcellus',serif;
  font-size:clamp(40px,6vw,76px);line-height:1.08;
  color:var(--marine-txt);margin-bottom:26px;
}
.contact-titre i{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;
  color:var(--or);
}
.contact-vers{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;
  font-size:clamp(20px,2.5vw,26px);line-height:1.85;
  color:var(--marine-txt);max-width:42ch;margin:0 auto clamp(44px,6vw,64px);
}
.contact-coords{display:flex;flex-direction:column;gap:22px;align-items:center}
.coord{
  font-family:'Cormorant Garamond',serif;font-weight:600;
  font-size:clamp(23px,3vw,34px);
  color:var(--marine-txt);text-decoration:none;
  position:relative;padding-bottom:9px;transition:color .55s;
}
.coord::after{
  content:'';position:absolute;left:50%;bottom:0;width:0;height:2px;
  border-radius:2px;background:var(--or);
  transition:width .7s cubic-bezier(.19,1,.22,1),left .7s cubic-bezier(.19,1,.22,1);
}
.coord:hover{color:var(--or)}
.coord:hover::after{width:100%;left:0}
.orn{margin:clamp(44px,6vw,62px) auto 0;width:240px;opacity:.6}

/* ══ REVEAL ══ */
.rev{opacity:0;transform:translateY(30px);transition:opacity 1.3s cubic-bezier(.19,1,.22,1),transform 1.3s cubic-bezier(.19,1,.22,1)}
.rev.vu{opacity:1;transform:translateY(0)}

/* ══ RESPONSIVE ══ */
@media(max-width:980px){
  .nav-liens{display:none}
  .nav-cle{display:block}
  .nav-logo{height:44px}
  nav.pose .nav-logo{height:36px}
  .nav-corps{padding:14px 5vw}
  nav.pose .nav-corps{padding:9px 5vw}
}
@media(max-width:900px){
  .promesse-flux{grid-template-columns:1fr;gap:52px}
  .promesse-mots::before{display:none}
  .ch{margin-left:0 !important}
  .soin{grid-template-columns:1fr;gap:20px;padding:30px 16px}
  .soin:hover{transform:translateX(4px)}
  .terre-scene{height:440px}
  footer{flex-direction:column;align-items:flex-start}
  .maison:nth-child(2){margin-top:0}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  #rideau{display:none}
  .rev{opacity:1;transform:none}
  .trace-cote{stroke-dashoffset:0}
}
/* ══ ENGAGEMENT ÉCO-RESPONSABLE ══ */
.eco-flux{max-width:1000px;margin:clamp(48px,7vw,78px) auto 0}
.eco{
  position:relative;
  display:grid;grid-template-columns:clamp(60px,7vw,88px) 1fr;
  gap:clamp(24px,4vw,52px);align-items:start;
  padding:clamp(32px,4.2vw,48px) clamp(20px,3vw,36px);
  border-radius:24px;
  transition:background .7s,transform .7s cubic-bezier(.2,.8,.2,1);
}
.eco:hover{background:rgba(255,255,255,.68);transform:translateX(10px)}
.eco-sep{
  height:34px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1000' height='34' viewBox='0 0 1000 34' preserveAspectRatio='none'%3E%3Cpath d='M0 17 C120 4 200 30 320 17 C440 4 520 30 640 17 C760 4 860 28 1000 17' stroke='%23B8912F' stroke-opacity='.3' stroke-width='1.4' fill='none'/%3E%3C/svg%3E") no-repeat center/100% 100%;
}
.eco-vignette{
  width:clamp(58px,6.6vw,84px);aspect-ratio:1;
  display:flex;align-items:center;justify-content:center;
  border-radius:50% 50% 50% 8px;
  background:rgba(184,145,47,.1);
  border:1px solid rgba(184,145,47,.34);
  transition:background .6s,border-color .6s,transform .7s cubic-bezier(.2,.8,.2,1);
}
.eco:hover .eco-vignette{
  background:rgba(184,145,47,.2);border-color:var(--or);
  transform:rotate(-8deg) scale(1.06);
}
.eco-nom{
  font-family:'Marcellus',serif;
  font-size:clamp(22px,2.9vw,30px);color:var(--marine-txt);
  margin-bottom:14px;line-height:1.26;transition:color .6s;
}
.eco:hover .eco-nom{color:var(--or)}
.eco-txt{
  font-size:16.5px;font-weight:400;line-height:1.9;
  color:var(--encre);max-width:62ch;
}
.eco-mot{
  max-width:660px;margin:clamp(50px,7vw,80px) auto 0;text-align:center;
}
.eco-mot-orn{width:220px;margin:0 auto clamp(24px,3vw,32px);display:block;opacity:.75}
.eco-mot p{
  font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;
  font-size:clamp(19px,2.4vw,24px);line-height:1.85;
  color:var(--marine-txt);
}
@media(max-width:900px){
  .eco{grid-template-columns:1fr;gap:20px;padding:28px 16px}
  .eco:hover{transform:translateX(4px)}
}