@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,500&family=Inter:wght@300;400;500;600;700&display=swap');

/* ---------- Design tokens ---------- */
:root{
  /* Charte graphique Sophie Hocquart MTC */
  --creme:      #FEFAE0;
  --creme-2:    #EFE2BC; /* décroché plus marqué pour bandes alternées */
  --olive:      #6E7C4E;
  --olive-fonce:#333B22;
  --argile:     #B5623C;
  --argile-fonce:#96502F;
  --sable:      #DCCFA6;
  --encre:      #2A2619;
  --encre-60:   rgba(42,38,25,.62);

  --font-titre: 'Playfair Display', Georgia, serif;
  --font-texte: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --container: 1180px;
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 40px;
  --space-5: 64px;
  --space-6: 96px;
  --space-7: 140px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{
  margin:0;
  overflow-x:hidden;
  background:var(--creme);
  color:var(--encre);
  font-family:var(--font-texte);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  position:relative;
}
img{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3,h4{
  font-family:var(--font-titre);
  font-weight:600;
  line-height:1.15;
  margin:0 0 var(--space-2);
  letter-spacing:.005em;
}
h1{font-size:clamp(2.4rem,4.6vw,3.6rem);font-weight:600;}
h2{font-size:clamp(1.9rem,3.2vw,2.6rem);}
h3{font-size:1.35rem;}
p{margin:0 0 var(--space-2);}
.lead{font-size:1.15rem;color:var(--encre-60);}

/* Grain de papier, texture subtile en filigrane, appliquée via SVG turbulence */
.grain{position:relative;}
.grain::after{
  content:"";
  position:absolute;inset:0;
  pointer-events:none;
  opacity:.05;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body::before{
  content:"";
  position:fixed;inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.035;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Filigrane enso décoratif */
.enso-bg{
  position:absolute;
  pointer-events:none;
  opacity:.055;
  z-index:0;
  filter:brightness(0);
}
.enso-bg img{width:100%;height:100%;object-fit:contain;}

.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-3);position:relative;z-index:1;}
section{position:relative;}

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-texte);font-weight:600;font-size:.98rem;
  padding:15px 30px;
  border:1px solid transparent;
  cursor:pointer;
  text-decoration:none;
  letter-spacing:.01em;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .15s ease;
  border-radius:0;
  white-space:nowrap;
}
.btn:active{transform:translateY(1px);}
.btn-argile{background:var(--argile);color:var(--creme);}
.btn-argile:hover{background:var(--argile-fonce);}
.btn-olive{background:var(--olive-fonce);color:var(--creme);}
.btn-olive:hover{background:#242c16;}
.btn-outline{background:transparent;color:var(--encre);border-color:var(--encre);}
.btn-outline:hover{background:var(--encre);color:var(--creme);}
.btn-outline-creme{background:transparent;color:var(--creme);border-color:var(--creme);}
.btn-outline-creme:hover{background:var(--creme);color:var(--olive-fonce);}
.btn-sm{padding:10px 20px;font-size:.88rem;}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(254,250,224,.92);
  backdrop-filter:saturate(120%) blur(6px);
  border-bottom:3px solid var(--argile);
}
.site-header .container{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:14px;padding-bottom:14px;
  gap:var(--space-3);
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none;}
.brand-mark{width:38px;height:38px;flex:none;}
.brand-mark img{width:100%;height:100%;object-fit:contain;}
.brand-name{font-family:var(--font-titre);font-size:1.28rem;color:var(--encre);white-space:nowrap;}

.main-nav{display:flex;align-items:center;gap:var(--space-4);flex:1;justify-content:center;}
.main-nav a{
  text-decoration:none;color:var(--encre);font-size:.98rem;font-weight:500;
  padding:6px 2px;position:relative;
}
.main-nav a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--argile);
  transition:width .2s ease;
}
.main-nav a:hover::after,.main-nav a.active::after{width:100%;}
.main-nav a.active{color:var(--argile-fonce);}

.header-actions{display:flex;align-items:center;gap:var(--space-2);flex:none;}
.call-link{
  display:flex;align-items:center;gap:8px;font-weight:600;font-size:.95rem;
  text-decoration:none;color:var(--encre);white-space:nowrap;
}
.call-link svg{flex:none;}

.social-link{display:flex;align-items:center;color:var(--encre);flex:none;}
.social-link:hover{color:var(--argile-fonce);}

.nav-toggle{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:40px;height:40px;border:1px solid var(--encre);background:transparent;cursor:pointer;flex:none;
}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--encre);margin:0 auto;transition:transform .25s ease,opacity .2s ease;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

@media (max-width:900px){
  .main-nav{
    position:absolute;top:100%;left:0;right:0;
    background:var(--creme);
    flex-direction:column;align-items:stretch;justify-content:flex-start;
    gap:0;padding:0;
    max-height:0;overflow:hidden;
    transition:max-height .35s ease;
    border-bottom:1px solid rgba(42,38,25,.1);
    box-shadow:0 16px 24px rgba(42,38,25,.12);
  }
  .main-nav.open{padding:var(--space-2) 0;overflow-y:auto;max-height:600px;}
  .main-nav a{padding:16px var(--space-3);border-bottom:1px solid rgba(42,38,25,.08);}
  .main-nav a::after{display:none;}
  .call-link span{display:none;}
  .nav-toggle{display:flex;}
}
@media (max-width:600px){
  .btn-header{display:none;}
  .site-header .container{gap:var(--space-2);}
  .header-actions{gap:10px;}
}
@media (max-width:520px){
  .brand-name{font-size:1.05rem;}
}
@media (max-width:480px){
  :root{--space-3:16px;}
}
@media (max-width:360px){
  .social-link svg{width:26px;height:26px;}
  .brand-name{font-size:.95rem;}
}

/* ---------- Hero ---------- */
.hero{padding:var(--space-5) 0 var(--space-6);overflow:hidden;}
.hero .container{
  display:grid;grid-template-columns:1.05fr .95fr;gap:var(--space-5);align-items:center;
}
.hero-copy .kicker{
  display:inline-block;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--argile-fonce);font-weight:600;margin-bottom:var(--space-2);
}
.hero-copy h1{margin-bottom:var(--space-3);}
.hero-copy .lead{max-width:46ch;margin-bottom:var(--space-4);}
.hero-actions{display:flex;gap:var(--space-2);flex-wrap:wrap;}
.hero-figure{position:relative;}
.hero-figure img{width:100%;height:600px;object-fit:cover;}
.hero-figure::before{
  content:"";position:absolute;top:24px;left:24px;right:-24px;bottom:-24px;
  border:1px solid var(--sable);z-index:-1;
}
@media (max-width:900px){
  .hero .container{grid-template-columns:1fr;gap:var(--space-4);}
  .hero-figure{order:-1;}
  .hero-figure img{height:340px;}
  .hero-figure::before{display:none;}
  .hero{padding:var(--space-4) 0 var(--space-5);}
}

/* ---------- Sections génériques ---------- */
.section{padding:var(--space-6) 0;}
.section-tight{padding:var(--space-5) 0;}
.section-alt{background:var(--creme-2);}
.section-header{max-width:720px;margin:0 auto var(--space-5);text-align:center;}
.section-header.left{margin-left:0;text-align:left;}
.eyebrow{
  display:block;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--olive-fonce);font-weight:700;margin-bottom:10px;
}
@media (max-width:700px){
  .section{padding:var(--space-5) 0;}
}

/* Présentation courte (texte seul, éditorial) */
.intro-block{max-width:800px;margin:0 auto;}
.intro-block p{font-size:1.2rem;line-height:1.75;color:var(--encre);}
.intro-block p:first-of-type::first-letter{
  font-family:var(--font-titre);font-size:3.6rem;line-height:.7;float:left;
  padding:8px 10px 0 0;color:var(--argile-fonce);font-weight:600;
}

/* Grille "Souffrez-vous de" */
.symptom-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);
}
.symptom-card{
  background:var(--creme);border:1px solid var(--sable);
  padding:var(--space-4) var(--space-3);
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;
}
.symptom-card svg{flex:none;color:var(--olive-fonce);}
.symptom-card p{margin:0;font-size:.98rem;color:var(--encre);}
@media (max-width:900px){.symptom-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.symptom-grid{grid-template-columns:1fr;}}

/* Prestations teaser */
.teaser-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);}
.teaser-card{
  background:var(--creme);color:var(--encre);border:1px solid var(--sable);
  padding:var(--space-4);
  display:flex;flex-direction:column;gap:var(--space-2);
  text-decoration:none;
  position:relative;overflow:hidden;
}
.teaser-card svg{color:var(--olive-fonce);}
.teaser-card p{color:var(--encre-60);}
.teaser-card .price{font-family:var(--font-titre);font-size:1.5rem;margin-top:auto;color:var(--argile-fonce);}
.teaser-card .go{font-size:.88rem;font-weight:600;color:var(--encre);display:inline-flex;align-items:center;gap:6px;text-decoration:underline;text-underline-offset:4px;}
@media (max-width:760px){.teaser-grid{grid-template-columns:1fr;}}

/* Avis clients */
.rating-line{display:flex;align-items:center;gap:10px;justify-content:center;margin-bottom:var(--space-4);}
.rating-stars{display:flex;gap:3px;color:var(--argile);}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);}
.testi-card{
  background:var(--creme);border:1px solid var(--sable);padding:var(--space-3);
  display:flex;flex-direction:column;gap:var(--space-2);
}
.testi-card p{font-style:italic;color:var(--encre);margin:0;font-size:.98rem;}
.testi-name{font-style:normal;font-weight:600;font-size:.88rem;color:var(--olive-fonce);}
@media (max-width:900px){.testi-grid{grid-template-columns:1fr;}}

/* Bandeau CTA final */
.cta-band{
  background:var(--olive-fonce);color:var(--creme);
  padding:var(--space-5) 0;text-align:center;overflow:hidden;position:relative;
}
.cta-band h2{color:var(--creme);}
.cta-band .lead{color:rgba(254,250,224,.78);max-width:52ch;margin:0 auto var(--space-4);}
.cta-band .enso-bg{width:640px;height:640px;top:50%;left:50%;transform:translate(-50%,-50%);filter:brightness(0) invert(1);opacity:.06;}

/* Footer */
.site-footer{background:var(--encre);color:rgba(254,250,224,.85);padding:var(--space-4) 0 var(--space-3);border-top:1px solid rgba(254,250,224,.12);}
.footer-top{display:flex;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-4);}
.footer-brand{display:flex;align-items:center;gap:12px;}
.footer-brand .brand-mark img{filter:brightness(0) invert(1);}
.footer-brand-name{font-family:var(--font-titre);color:var(--creme);font-size:1.15rem;}
.footer-links{display:flex;gap:var(--space-4);flex-wrap:wrap;}
.footer-col h4{color:var(--creme);font-family:var(--font-texte);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;}
.footer-col a{display:block;color:rgba(254,250,224,.78);text-decoration:none;font-size:.94rem;margin-bottom:8px;}
.footer-col a:hover{color:var(--creme);}
.footer-bottom{border-top:1px solid rgba(254,250,224,.15);padding-top:var(--space-3);display:flex;justify-content:space-between;gap:var(--space-2);flex-wrap:wrap;font-size:.82rem;color:rgba(254,250,224,.6);}
@media (max-width:700px){.footer-top{flex-direction:column;}}

/* ---------- Page: bandeau titre générique ---------- */
.page-header{padding:var(--space-5) 0 var(--space-4);background:var(--creme-2);border-bottom:1px solid var(--sable);}
.page-header .eyebrow{color:var(--argile-fonce);}
.page-header .lead{max-width:60ch;}

/* ---------- À propos ---------- */
.bio-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--space-5);align-items:center;}
.bio-photo{
  aspect-ratio:4/5;background:
    repeating-linear-gradient(135deg,rgba(42,38,25,.05) 0 2px,transparent 2px 10px),
    var(--sable);
  border:1px solid var(--sable);
  position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.bio-photo .enso-bg{width:70%;height:70%;position:static;opacity:.25;filter:none;}
.bio-photo .enso-bg img{filter:brightness(0);opacity:.5;}
.bio-photo span{
  position:absolute;bottom:var(--space-2);left:var(--space-2);right:var(--space-2);
  font-size:.78rem;color:var(--encre-60);text-align:center;
}
.tags{display:flex;gap:10px;flex-wrap:wrap;margin:var(--space-3) 0;}
.tag{background:var(--olive);color:var(--creme);padding:8px 16px;font-size:.85rem;font-weight:600;letter-spacing:.02em;}
.mission-quote{
  border-left:3px solid var(--argile);padding-left:var(--space-3);margin:var(--space-3) 0;
  font-family:var(--font-titre);font-size:1.25rem;font-style:italic;color:var(--olive-fonce);
}
@media (max-width:900px){.bio-grid{grid-template-columns:1fr;}.bio-photo{aspect-ratio:16/10;}}

/* Contenu + photo alterné (MTC / prestations) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);align-items:center;}
.split img{width:100%;height:460px;object-fit:cover;}
.split.reverse .split-media{order:2;}
.split-media{position:relative;}
.split-media::after{
  content:"";position:absolute;bottom:-18px;right:-18px;top:18px;left:18px;
  border:1px solid var(--sable);z-index:-1;
}
.split.reverse .split-media::after{right:18px;left:-18px;}
@media (max-width:900px){
  .split{grid-template-columns:1fr;}
  .split.reverse .split-media{order:0;}
  .split img{height:300px;}
  .split-media::after{display:none;}
}

.pillar-list{list-style:none;margin:var(--space-3) 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.pillar-list li{display:flex;align-items:baseline;gap:10px;}
.pillar-list li::before{content:"•";color:var(--argile-fonce);font-weight:700;}

/* Déroulement séance : 3 étapes */
.session-flow{margin-top:var(--space-6);}
.session-flow .eyebrow{margin-bottom:var(--space-3);}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);}
.step{border-top:2px solid var(--olive-fonce);padding-top:var(--space-2);}
.step .num{font-family:var(--font-titre);font-size:1.8rem;color:var(--argile-fonce);display:block;margin-bottom:6px;}
@media (max-width:760px){.steps{grid-template-columns:1fr;}}

/* Techniques (chips) */
.chip-list{display:flex;flex-wrap:wrap;gap:10px;margin:var(--space-3) 0;padding:0;list-style:none;}
.chip-list li{
  border:1px solid var(--sable);background:var(--creme);
  padding:9px 16px;font-size:.9rem;font-weight:500;
}

/* Lien vers la section tarifs */
.tarifs-link{
  display:inline-flex;align-items:center;gap:6px;margin-top:var(--space-3);
  font-size:.92rem;font-weight:600;color:var(--argile-fonce);
  text-decoration:underline;text-underline-offset:4px;
}
.tarifs-link:hover{color:var(--argile);}

/* Tarifs (section dédiée, regroupant toutes les prestations) */
.pricing-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);}
.pricing-group{background:var(--creme-2);border:1px solid var(--sable);padding:var(--space-4);}
.pricing-group h3{color:var(--olive-fonce);margin-bottom:8px;}
.pricing-group .pricing-desc{font-size:.92rem;color:var(--encre-60);margin-bottom:var(--space-3);}
@media (max-width:760px){.pricing-grid{grid-template-columns:1fr;}}
.pricing-actions{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-4);}
@media (max-width:600px){
  .pricing-actions{flex-direction:column;}
  .pricing-actions .btn{width:100%;}
}

.price-table{width:100%;border-collapse:collapse;margin-top:var(--space-2);}
.price-table td{padding:14px 0;border-bottom:1px solid var(--sable);vertical-align:top;}
.price-table td:last-child{text-align:right;font-family:var(--font-titre);font-size:1.2rem;color:var(--argile-fonce);white-space:nowrap;padding-left:var(--space-2);}

/* Esthétique / acu-lifting, bloc texte + motif enso */
.esthetique-block{
  background:var(--creme-2);border:1px solid var(--sable);
  padding:var(--space-5);position:relative;overflow:hidden;
}
.esthetique-block .enso-bg{width:420px;height:420px;right:-100px;top:50%;transform:translateY(-50%);}
.esthetique-block .content{max-width:640px;position:relative;z-index:1;}

/* FAQ */
.faq-item{border-bottom:1px solid var(--sable);}
.faq-item summary{
  list-style:none;cursor:pointer;padding:var(--space-3) 0;
  display:flex;justify-content:space-between;align-items:center;gap:var(--space-2);
  font-family:var(--font-titre);font-size:1.15rem;font-weight:600;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary .icon{flex:none;transition:transform .25s ease;color:var(--argile-fonce);}
.faq-item[open] summary .icon{transform:rotate(45deg);}
.faq-item .faq-a{padding:0 0 var(--space-3);max-width:70ch;color:var(--encre-60);}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);align-items:stretch;}
.cabinet-card{border:1px solid var(--sable);background:var(--creme);display:flex;flex-direction:column;height:100%;}
.cabinet-card img{width:100%;height:280px;object-fit:cover;}
.cabinet-card .cc-body{padding:var(--space-4);display:flex;flex-direction:column;flex:1;}
.cabinet-photo-placeholder{
  width:100%;height:280px;
  background:
    repeating-linear-gradient(135deg,rgba(42,38,25,.05) 0 2px,transparent 2px 10px),
    var(--sable);
  display:flex;align-items:center;justify-content:center;position:relative;
}
.cabinet-photo-placeholder .enso-bg{width:50%;height:50%;position:static;opacity:.3;}
.cabinet-photo-placeholder .enso-bg img{filter:brightness(0);opacity:.55;}
.info-line{display:flex;gap:12px;margin-bottom:14px;align-items:flex-start;}
.info-line svg{flex:none;color:var(--olive-fonce);margin-top:3px;}
.info-line .lbl{display:block;font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:var(--olive-fonce);margin-bottom:2px;}
.map-embed{width:100%;height:220px;flex:none;border:1px solid var(--sable);margin:auto 0 var(--space-3);filter:sepia(8%) saturate(85%);}
.map-embed iframe{width:100%;height:100%;border:0;display:block;}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;}}

.direct-band{
  background:var(--argile);color:var(--creme);
  padding:var(--space-4) 0;text-align:center;
}
.direct-band .container{display:flex;justify-content:center;align-items:center;gap:var(--space-4);flex-wrap:wrap;}
.direct-band a{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--creme);font-weight:600;font-size:1.05rem;}
.direct-band a:hover{opacity:.85;}

/* Utilitaires */
.text-center{text-align:center;}
.mt-0{margin-top:0;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}