:root{
  --or:#c9a96e;
  --or-light:#e8d5a3;
  --or-deep:#a8863f;
  --creme:#faf8f5;
  --ivoire:#f5f0e8;
  --champagne:#f0e8d5;
  --encre:#241f19;
  --texte:#2c2c2c;
  --texte-doux:#5c5346;
  --gris-clair:#e2d9cb;
  --blanc:#ffffff;
  --serif:'Cormorant Garamond', Georgia, serif;
  --sans:'Inter', system-ui, sans-serif;
  --ease:cubic-bezier(0.22,1,0.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth; max-width:100%; overflow-x:hidden;}
body{
  background:var(--creme);
  color:var(--texte);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  max-width:100%;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%; height:auto;}
ul{list-style:none;}
.w{max-width:1180px; margin:0 auto; padding:0 clamp(20px,5vw,48px);}
.eyebrow{
  font-family:var(--sans); font-size:0.75rem; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--or-deep); font-weight:600; display:block; margin-bottom:14px;
}
.rule{display:block; width:40px; height:2px; background:var(--or); margin-bottom:18px;}
h1,h2,h3{font-family:var(--serif); font-weight:400; color:var(--encre); text-wrap:balance;}
section{padding:clamp(60px,9vw,110px) 0;}

/* ---- reveal on scroll ---- */
.reveal{opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}

/* ---- NAV ---- */
.nav{
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px clamp(20px,5vw,48px);
  background:rgba(250,248,245,0.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--gris-clair);
}
.nav-logo{font-family:var(--serif); font-size:1.3rem; color:var(--encre);}
.nav-logo em{font-style:italic; color:var(--or-deep);}
.nav-menu{display:flex; align-items:center; gap:28px;}
.nav-menu a{font-size:0.88rem; color:var(--texte-doux); transition:color .2s;}
.nav-menu a:hover{color:var(--or-deep);}
.nav-cta{
  background:var(--encre); color:var(--creme) !important; padding:10px 20px; border-radius:2px;
  font-size:0.82rem; letter-spacing:0.03em;
}
.burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
.burger span{width:22px; height:2px; background:var(--encre);}
@media (max-width:860px){
  .nav-menu{display:none;}
  .burger{display:flex;}
}

/* ---- HERO ---- */
.hero{
  position:relative;
  overflow:hidden;
  padding:clamp(80px,14vh,140px) 0 clamp(60px,8vh,90px);
  background:linear-gradient(180deg, var(--creme) 0%, var(--ivoire) 100%);
}
.hero .w{position:relative; z-index:1;}
.hero-art{
  position:absolute; top:50%; right:clamp(-60px,-1vw,10px); transform:translateY(-50%);
  width:clamp(360px,38vw,560px); z-index:0; pointer-events:none;
  -webkit-mask-image:radial-gradient(ellipse farthest-corner at 50% 50%, #000 62%, transparent 100%);
  mask-image:radial-gradient(ellipse farthest-corner at 50% 50%, #000 62%, transparent 100%);
}
.hero-art svg{width:100%; height:auto; display:block;}
.hero-art svg .draw{transition:stroke-dashoffset 80ms linear;}
.hero-art svg .dot{transition:opacity 300ms ease;}
@keyframes vinylSpin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.vinyl-spin{transform-origin:488px 118px;}
.vinyl-spin.spin{animation:vinylSpin 7s linear infinite;}
@keyframes bubbleRise{0%{transform:translateY(0) scale(0.7); opacity:0;} 18%{opacity:1;} 100%{transform:translateY(-16px) scale(1.15); opacity:0;}}
.bubble{transform-box:fill-box; transform-origin:center;}
.bubble.go{animation:bubbleRise 2.4s ease-in infinite;}
@keyframes noteFloat{0%{transform:translate(0,0) rotate(0deg); opacity:0;} 18%{opacity:0.9;} 100%{transform:translate(-16px,-30px) rotate(-10deg); opacity:0;}}
.note{transform-box:fill-box; transform-origin:center;}
.note.go{animation:noteFloat 2.8s ease-out infinite;}
@media (prefers-reduced-motion:reduce){.hero-art svg .draw, .hero-art svg .dot{transition:none !important;} .vinyl-spin.spin, .bubble.go, .note.go{animation:none !important;}}
@media (max-width:980px){.hero-art{display:none;}}
.hero-eyebrow{font-family:var(--sans); font-size:0.8rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--or-deep); font-weight:600; margin-bottom:20px;}
.hero h1{font-size:clamp(2.6rem,6vw,4.4rem); line-height:1.05; letter-spacing:-0.01em; max-width:16ch;}
.hero h1 em{font-style:italic; color:var(--or-deep);}
.hero-sub{font-size:clamp(1.1rem,2vw,1.35rem); color:var(--texte-doux); max-width:52ch; margin-top:26px; line-height:1.6;}
.hero-actions{display:flex; align-items:center; gap:24px; margin-top:38px; flex-wrap:wrap;}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:16px 32px; border-radius:2px; font-size:0.88rem; letter-spacing:0.03em; font-weight:500;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.btn-primary{background:var(--encre); color:var(--creme);}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(36,31,25,0.25);}
.btn-ghost{color:var(--encre); border-bottom:1px solid var(--or);}
.hero-figures{display:flex; gap:clamp(24px,5vw,56px); margin-top:56px; flex-wrap:wrap;}
.hero-figure b{display:block; font-family:var(--serif); font-size:2.2rem; color:var(--or-deep); line-height:1;}
.hero-figure span{font-size:0.82rem; color:var(--texte-doux); margin-top:6px; display:block;}

/* ---- PILLARS ---- */
.pillars{background:var(--blanc);}
.pillars-head{max-width:640px; margin-bottom:52px;}
.pillars-head h2{font-size:clamp(2rem,3.6vw,2.8rem);}
.pillars-head p{color:var(--texte-doux); margin-top:16px; font-size:1.05rem;}
.pillars-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:28px;}
.pillar{
  padding:32px 28px; border:1px solid var(--gris-clair); border-radius:4px; background:var(--creme);
  transition:border-color .3s, transform .3s var(--ease);
}
.pillar:hover{border-color:var(--or); transform:translateY(-4px);}
.pillar-icon{
  width:46px; height:46px; border-radius:50%; background:var(--champagne);
  display:flex; align-items:center; justify-content:center; margin-bottom:20px; color:var(--or-deep);
}
.pillar h3{font-size:1.35rem; margin-bottom:12px;}
.pillar p{font-size:0.94rem; color:var(--texte-doux); line-height:1.65;}
.pillar-link{display:inline-block; margin-top:14px; font-size:0.85rem; color:var(--or-deep); border-bottom:1px solid var(--or);}

/* ---- PROCESS ---- */
.process{background:var(--ivoire);}
.process-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:40px; margin-top:48px;}
.process-step{position:relative; padding-left:0;}
.process-num{font-family:var(--serif); font-size:3rem; color:var(--or-light); line-height:1; margin-bottom:14px;}
.process-step h3{font-size:1.2rem; margin-bottom:10px;}
.process-step p{font-size:0.92rem; color:var(--texte-doux);}


/* ---- GALERIE ---- */
.galerie{background:var(--ivoire);}
.galerie-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:40px; flex-wrap:wrap;}
.galerie-head h2{font-size:clamp(1.8rem,3.2vw,2.4rem);}
.galerie-head p{color:var(--texte-doux); font-size:0.95rem; max-width:36ch;}
.gp{overflow:hidden; border-radius:4px; position:relative; flex-shrink:0;}
.gp img,.gp video{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease);}
.galerie-showcase .gp-photo img{object-position:left center;}
.gp:hover img,.gp:hover video{transform:scale(1.06);}

.galerie-showcase{display:flex; align-items:stretch; gap:14px; height:clamp(300px,36vw,460px);}
.galerie-showcase .gp-photo{aspect-ratio:4/3; height:100%;}
.galerie-showcase .gp-video{aspect-ratio:9/16; height:100%; background:#0c0a08;}
@media (max-width:760px){
  .galerie-showcase{flex-direction:column; height:auto;}
  .galerie-showcase .gp-photo{aspect-ratio:4/3; height:auto; width:100%;}
  .galerie-showcase .gp-video{aspect-ratio:9/16; height:auto; width:100%; max-width:340px; margin:0 auto;}
}

/* ---- ZONES ---- */
.zones{background:var(--blanc); padding-top:clamp(40px,6vw,60px); padding-bottom:clamp(40px,6vw,60px);}

/* ---- FAQ ---- */
.faq{background:var(--ivoire);}
.faq-list{max-width:820px;}
.faq-item{
  background:var(--creme); border:1px solid var(--gris-clair); border-radius:4px;
  padding:20px 26px; margin-bottom:14px;
}
.faq-item summary{
  font-family:var(--serif); font-size:1.2rem; color:var(--encre); cursor:pointer;
  list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; font-size:1.4rem; color:var(--or-deep); flex-shrink:0;}
.faq-item[open] summary::after{content:"−";}
.faq-item p{margin-top:14px; color:var(--texte-doux); font-size:0.95rem; line-height:1.6;}

/* ---- CONTACT ---- */
.contact{background:var(--encre); color:var(--creme);}
.contact h2{color:var(--creme); font-size:clamp(2rem,3.6vw,2.8rem);}
.contact-grid{display:grid; grid-template-columns:1fr 1.2fr; gap:60px;}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;}}
.contact-sub{color:rgba(250,248,245,0.7); margin-top:20px; font-size:1.02rem; max-width:40ch;}
.contact-info{margin-top:36px; display:flex; flex-direction:column; gap:14px;}
.contact-info a{font-size:0.95rem; color:var(--or-light); display:flex; align-items:center; gap:10px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:18px;}
@media (max-width:560px){.form-row{grid-template-columns:1fr;}}
.fg label{display:block; font-size:0.78rem; letter-spacing:0.04em; text-transform:uppercase; color:rgba(250,248,245,0.6); margin-bottom:8px;}
.fg input, .fg select, .fg textarea{
  width:100%; background:rgba(250,248,245,0.06); border:1px solid rgba(250,248,245,0.2); color:var(--creme);
  padding:12px 14px; border-radius:2px; font-family:var(--sans); font-size:0.95rem;
}
.fg input::placeholder, .fg textarea::placeholder{color:rgba(250,248,245,0.35);}
.fg{margin-bottom:18px;}
.form-foot{display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:10px; flex-wrap:wrap;}
.form-note{font-size:0.78rem; color:rgba(250,248,245,0.5);}
.btn-send{
  background:var(--or); color:var(--encre); padding:14px 30px; border:none; border-radius:2px;
  font-size:0.88rem; font-weight:600; letter-spacing:0.03em; cursor:pointer; transition:background .2s;
}
.btn-send:hover{background:var(--or-light);}

/* ---- FOOTER ---- */
.footer{background:var(--encre); color:rgba(250,248,245,0.6); padding:32px 0; border-top:1px solid rgba(250,248,245,0.12);}
.footer-grid{display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;}
.footer-logo{font-family:var(--serif); color:var(--creme); font-size:1.1rem;}
.footer-logo em{font-style:italic; color:var(--or-light);}
.footer-links{display:flex; gap:22px; flex-wrap:wrap;}
.footer-links a{font-size:0.85rem;}
.footer-links a:hover{color:var(--or-light);}
.footer-right{font-size:0.82rem; text-align:right;}

/* ---- BREADCRUMB (sous-pages) ---- */
.breadcrumb{font-size:0.82rem; color:var(--texte-doux); margin-bottom:22px;}
.breadcrumb a{color:var(--texte-doux); border-bottom:1px solid var(--gris-clair);}
.breadcrumb a:hover{color:var(--or-deep);}
.breadcrumb span{margin:0 8px; color:var(--gris-clair);}

/* ---- PAGE HERO (sous-pages, sans illustration animee) ---- */
.page-hero{background:linear-gradient(180deg, var(--creme) 0%, var(--ivoire) 100%); padding:clamp(70px,12vh,120px) 0 clamp(50px,7vh,70px);}
.page-hero h1{font-size:clamp(2.3rem,5vw,3.6rem); line-height:1.08; max-width:20ch;}
.page-hero h1 em{font-style:italic; color:var(--or-deep);}
.page-hero .hero-sub{max-width:60ch;}

/* ---- CONTENU DE SERVICE ---- */
.detail{background:var(--blanc);}
.detail-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:start;}
@media (max-width:900px){.detail-grid{grid-template-columns:1fr;}}
.detail h2{font-size:clamp(1.8rem,3.2vw,2.4rem); margin-bottom:18px;}
.detail p{color:var(--texte-doux); font-size:1.02rem; line-height:1.7; margin-bottom:16px;}
.check-list{margin-top:8px;}
.check-list li{
  display:flex; gap:12px; align-items:flex-start; padding:12px 0; border-top:1px solid var(--gris-clair);
  font-size:0.96rem; color:var(--texte-doux);
}
.check-list li:first-child{border-top:none;}
.check-list svg{flex-shrink:0; margin-top:3px; color:var(--or-deep);}
.detail-card{
  background:var(--ivoire); border:1px solid var(--gris-clair); border-radius:6px; padding:32px;
}
.detail-card h3{font-size:1.3rem; margin-bottom:14px;}
.detail-card ul{display:flex; flex-direction:column; gap:10px; margin-bottom:24px;}
.detail-card li{font-size:0.92rem; color:var(--texte-doux); padding-left:18px; position:relative;}
.detail-card li::before{content:"•"; position:absolute; left:0; color:var(--or-deep);}

/* ---- LIENS CONNEXES (sous-pages) ---- */
.related{background:var(--ivoire);}
.related-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px; margin-top:36px;}
.related-card{
  display:block; padding:26px; background:var(--creme); border:1px solid var(--gris-clair); border-radius:4px;
  transition:border-color .3s, transform .3s var(--ease);
}
.related-card:hover{border-color:var(--or); transform:translateY(-3px);}
.related-card h3{font-size:1.1rem; margin-bottom:8px;}
.related-card p{font-size:0.88rem; color:var(--texte-doux);}