:root{
  padding-top:env(safe-area-inset-top, 0px);
  padding-bottom:env(safe-area-inset-bottom, 0px);
  --bg:#F6F3EC;
  --surface:#FFFFFF;
  --surface-2:#EFEAE0;
  --ink:#1E2723;
  --ink-soft:#4B564F;
  --ink-faint:#8A9089;
  --accent:#25423C;
  --accent-ink:#FFFFFF;
  --accent-soft:#DCE6E0;
  --line:#DCD5C6;
  --shadow: 0 30px 60px -32px rgba(20,30,25,.35);
  --shadow-sm: 0 14px 28px -18px rgba(20,30,25,.3);
  --radius-lg:26px;
  --radius-md:16px;
  --radius-sm:10px;
  --font-display:'Newsreader', 'Iowan Old Style', Georgia, serif;
  --font-body:'Work Sans', 'Segoe UI', system-ui, sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#161C19;
    --surface:#1C231F;
    --surface-2:#212925;
    --ink:#EDF1EE;
    --ink-soft:#B7C2BB;
    --ink-faint:#7C8983;
    --accent:#8FBBAE;
    --accent-ink:#122420;
    --accent-soft:#25352F;
    --line:#2C3530;
    --shadow: 0 30px 60px -32px rgba(0,0,0,.6);
    --shadow-sm: 0 14px 28px -18px rgba(0,0,0,.55);
  }
}

*{box-sizing:border-box;}
img,svg{max-width:100%; display:block;}
[hidden]{display:none!important;}
html{scroll-behavior:smooth; scroll-padding-top:96px;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.01ms!important; transition-duration:.01ms!important;}
}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;}
.wrap{max-width:1140px; margin-inline:auto; padding-inline:24px;}
h1,h2,h3{font-family:var(--font-display); font-weight:600; margin:0; text-wrap:balance; color:var(--ink);}
p{margin:0;}
.eyebrow{
  font-family:var(--font-body); font-size:.72rem; font-weight:600; letter-spacing:.15em;
  text-transform:uppercase; color:var(--accent); display:flex; align-items:center; gap:10px; margin-bottom:14px;
}
.eyebrow::before{content:""; width:24px; height:1px; background:var(--accent); display:inline-block;}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 24px; border-radius:999px; font-weight:600; font-size:.95rem;
  text-decoration:none; border:1px solid transparent; cursor:pointer; transition:transform .15s ease, background .2s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--accent); color:var(--accent-ink);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line);}

/* header */
.nav{position:sticky; top:0; z-index:40; background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
.nav-inner{display:flex; align-items:center; justify-content:space-between; padding-block:16px;}
.wordmark{font-family:var(--font-display); font-size:1.2rem; font-weight:600; text-decoration:none; color:var(--ink); display:flex; flex-direction:column; line-height:1.15;}
.wordmark small{font-family:var(--font-body); font-size:.65rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint);}
.nav-links{list-style:none; display:flex; gap:28px; margin:0; padding:0;}
.nav-links a{text-decoration:none; color:var(--ink-soft); font-size:.92rem; font-weight:500;}
.nav-links a:hover{color:var(--accent);}
.nav-actions{display:flex; align-items:center; gap:14px;}
.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
.nav-toggle span{width:22px; height:2px; background:var(--ink);}
.mobile-panel{display:none;}

@media (max-width:860px){
  .nav-links{display:none;}
  .nav-actions .btn{display:none;}
  .nav-toggle{display:flex;}
  .mobile-panel{
    display:block; max-height:0; overflow:hidden; background:var(--surface); border-bottom:1px solid var(--line);
    transition:max-height .25s ease;
  }
  .mobile-panel.open{max-height:320px;}
  .mobile-panel ul{list-style:none; margin:0; padding:18px 24px 24px; display:flex; flex-direction:column; gap:16px;}
  .mobile-panel a{text-decoration:none; color:var(--ink); font-weight:500;}
}

/* hero */
.hero{position:relative; padding-block:100px 80px; overflow:hidden;}
.hero-motif{position:absolute; top:-40px; right:-60px; width:360px; height:360px; color:var(--accent); opacity:.08;}
.hero-inner{position:relative; max-width:680px;}
.hero h1{font-size:clamp(2.2rem, 4.6vw, 3.4rem); line-height:1.1; margin-bottom:22px;}
.lead{font-size:1.08rem; color:var(--ink-soft); max-width:560px; margin-bottom:32px;}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-bottom:34px;}
.rating-pill{display:inline-flex; align-items:center; gap:10px; background:var(--surface); border:1px solid var(--line); padding:10px 18px; border-radius:999px; box-shadow:var(--shadow-sm);}
.rating-pill .stars{color:var(--accent); letter-spacing:2px; font-size:.85rem;}
.rating-pill .num{font-weight:700;}
.rating-pill .sep{width:1px; height:14px; background:var(--line);}
.rating-pill .sub{color:var(--ink-faint); font-size:.85rem;}

/* praticien - asymmetric grid */
.praticien{padding-block:70px; background:var(--surface-2);}
.praticien-grid{display:grid; grid-template-columns:1.5fr 1fr; gap:56px; align-items:start;}
.praticien-copy h2{font-size:1.9rem; margin-bottom:18px;}
.praticien-copy p{color:var(--ink-soft); margin-bottom:14px; max-width:520px;}
.quote-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); padding:36px 30px; box-shadow:var(--shadow); position:relative; margin-top:8px;}
.quote-mark{font-family:var(--font-display); font-size:3.2rem; color:var(--accent); line-height:1; margin-bottom:6px;}
.quote-text{font-family:var(--font-display); font-size:1.15rem; font-style:italic; color:var(--ink); margin-bottom:16px;}
.quote-who{color:var(--ink-faint); font-size:.88rem;}
@media (max-width:820px){ .praticien-grid{grid-template-columns:1fr;} }

/* soins */
#soins{padding-block:80px;}
.section-head{max-width:560px; margin-bottom:44px;}
.section-head h2{font-size:1.9rem;}
.soins-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:24px;}
.soin-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-md); padding:28px 24px;}
.soin-ic{display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; color:var(--accent); background:var(--accent-soft); border-radius:12px; margin-bottom:16px;}
.soin-card h3{font-size:1.05rem; margin-bottom:8px;}
.soin-card p{color:var(--ink-soft); font-size:.92rem;}
@media (max-width:900px){ .soins-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .soins-grid{grid-template-columns:1fr;} }

/* avis */
#avis{padding-block:80px; background:var(--surface-2);}
.avis-grid{display:grid; grid-template-columns:.8fr 1.6fr; gap:48px; align-items:start;}
.score-big{font-family:var(--font-display); font-size:4rem; font-weight:600; line-height:1;}
.avis-score .stars{color:var(--accent); font-size:1.1rem; letter-spacing:2px; margin:8px 0 6px;}
.avis-score .count{color:var(--ink-faint); font-size:.9rem;}
.avis-list{display:flex; flex-direction:column; gap:20px;}
.avis-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-md); padding:26px;}
.avis-card .stars{color:var(--accent); letter-spacing:2px; font-size:.85rem; display:block; margin-bottom:10px;}
.avis-card .quote{color:var(--ink); margin-bottom:12px;}
.avis-card .who{color:var(--ink-faint); font-size:.85rem;}
@media (max-width:820px){ .avis-grid{grid-template-columns:1fr;} }

/* infos */
#infos{padding-block:80px;}
.infos-card{display:grid; grid-template-columns:1fr 1fr; gap:40px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); padding:44px; box-shadow:var(--shadow-sm);}
.infos-col h3{font-size:1rem; margin-bottom:6px; margin-top:22px;}
.infos-col h3:first-child{margin-top:0;}
.infos-col p{color:var(--ink-soft); margin-bottom:4px;}
.infos-col a{color:var(--accent); text-decoration:none; font-weight:600;}
.infos-col .btn{margin-top:18px;}
@media (max-width:700px){ .infos-card{grid-template-columns:1fr; padding:30px;} }

/* footer */
footer{padding-block:60px 30px; border-top:1px solid var(--line);}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-bottom:40px;}
.footer-grid p{color:var(--ink-soft); font-size:.9rem; margin-top:10px;}
.footer-grid h5{margin:0 0 14px; font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; color:var(--ink-faint);}
.footer-grid ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.footer-grid a{text-decoration:none; color:var(--ink-soft); font-size:.92rem;}
.footer-bottom{display:flex; flex-wrap:wrap; gap:8px 20px; justify-content:space-between; font-size:.8rem; color:var(--ink-faint); padding-top:24px; border-top:1px solid var(--line);}
@media (max-width:700px){ .footer-grid{grid-template-columns:1fr;} }
