@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --paper: #F5F5F3;
  --paper-dim: #F3EFE6;
  --ink: #23302A;
  --ink-soft: #55635B;
  --sage: #10A083;
  --sage-dark: #0C7A63;
  --sage-light: #E3F4EF;
  --plum: #8B5468;
  --plum-dark: #6E3F50;
  --plum-light: #F3E7EC;
  --blue: #3B6E8F;
  --blue-dark: #2C5470;
  --line: rgba(35,48,42,0.14);
  --radius: 14px;
  --shadow: 0 12px 32px -18px rgba(35,48,42,0.35);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; font-size:112.5%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3{
  font-family:'Fraunces',serif;
  font-weight:600;
  line-height:1.1;
  margin:0 0 .5em;
  color:var(--ink);
}
h1{font-size:clamp(2.8rem,6vw,4.2rem); font-weight:700; letter-spacing:-.01em;}
h2{font-size:clamp(1.7rem,3vw,2.3rem); font-weight:700; letter-spacing:-.01em;}
h3{font-size:1.25rem; font-weight:700; letter-spacing:-.01em;}
p{margin:0 0 1em; color:var(--ink-soft);}
a{color:inherit;}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.5em;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--sage-dark);
  font-weight:600;
  margin-bottom:.9em;
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--sage-dark);
  display:inline-block;
}

.wrap{max-width:1120px; margin:0 auto; padding:0 28px;}

/* ---------- NAV ---------- */
.site-nav{
  position:sticky; top:0; z-index:50;
  background:rgba(245,245,243,0.92);
  backdrop-filter:blur(8px);
  transition:box-shadow .2s ease;
}
.site-nav.is-scrolled{
  box-shadow:0 8px 24px -16px rgba(35,48,42,0.35);
}
.site-nav .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:28px; padding-bottom:28px;
}
.brand{
  display:flex; align-items:center;
  text-decoration:none;
}
.brand img{height:48px; width:auto; display:block;}
.nav-links{
  display:flex; align-items:center; gap:1.5rem;
  list-style:none; margin:0; padding:0;
}
.nav-right{display:flex; align-items:center; gap:2rem;}
.nav-links a{
  text-decoration:none;
  font-size:.93rem;
  font-weight:700;
  color:var(--ink);
  transition:color .15s ease;
}
.nav-links a:hover, .nav-links a:focus-visible{color:var(--sage-dark);}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px;
  padding:.75em 1.5em;
  font-size:.92rem;
  font-weight:600;
  text-decoration:none;
  border:1px solid transparent;
  cursor:pointer;
  white-space:nowrap;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary{background:var(--sage); color:#fff;}
.btn-primary:hover{background:var(--sage-dark); transform:translateY(-1px); box-shadow:var(--shadow);}
.btn-ghost{background:transparent; border-color:var(--sage); color:var(--sage);}
.btn-ghost:hover{border-color:var(--sage-dark); color:var(--sage-dark);}
.nav-cta{display:none;}
@media(min-width:860px){.nav-cta{display:inline-flex;}}
.nav-links{display:none;}
@media(min-width:860px){.nav-links{display:flex;}}
.nav-toggle{
  display:inline-flex; background:none; border:1px solid var(--line);
  border-radius:8px; padding:.5em .7em; font-size:1rem; cursor:pointer;
}
@media(min-width:860px){.nav-toggle{display:none;}}
.mobile-menu{
  display:none; flex-direction:column; gap:0;
  border-bottom:1px solid var(--line);
  background:var(--paper);
}
.mobile-menu.open{display:flex;}
.mobile-menu a{
  padding:1em 28px; text-decoration:none; color:var(--ink);
  border-top:1px solid var(--line); font-weight:500;
}
@media(min-width:860px){.mobile-menu{display:none !important;}}

/* ---------- HERO ---------- */
.hero{
  padding:1rem 0 1rem;
}
.hero-grid{
  display:grid; grid-template-columns:1fr; gap:2.6rem; align-items:center;
}
@media(min-width:900px){
  .hero-grid{grid-template-columns:1.05fr .95fr; gap:3.5rem;}
}
.hero-copy .lead{font-size:1.15rem; max-width:42ch; color:var(--ink-soft); font-family:'Inter',system-ui,sans-serif;}
.hero-actions{display:flex; flex-wrap:wrap; align-items:center; gap:1rem; margin-top:1.6rem;}
.hero-phone svg{width:22px; height:22px; flex:none; margin-right:.35rem;}
.hero-media-small img{
  width:100%; aspect-ratio:19/20; object-fit:cover; object-position:center 35%;
  border-radius:24px; display:block; box-shadow:var(--shadow); border:1px solid var(--line);
}
@media(min-width:900px){.hero-media-small img{aspect-ratio:19/20;}}

/* signature: photo carousel of the practice */
.carousel{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  aspect-ratio:4/3;
  background:#fff;
}
.carousel-track{
  display:flex; height:100%;
  transition:transform .4s ease;
}
.carousel-slide{
  flex:none; width:100%; height:100%;
  border-right:1px solid var(--line);
}
.carousel-slide img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.carousel-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:38px; height:38px; border-radius:50%;
  background:rgba(245,245,243,0.92); border:1px solid var(--line);
  font-size:1.3rem; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  color:var(--ink);
}
.carousel-prev{left:14px;}
.carousel-next{right:14px;}
.carousel-arrow:hover{background:#fff;}
.carousel-dots{
  position:absolute; bottom:14px; left:50%; transform:translateX(-50%);
  display:flex; gap:.5rem;
}
.dot{
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,0.65); border:1px solid var(--line);
  padding:0; cursor:pointer;
}
.dot.active{background:var(--plum); border-color:var(--plum);}

/* ---------- SECTION SHELL ---------- */
section{padding:4rem 0;}
.section-alt{}
.section-head{max-width:56ch; margin-bottom:2.6rem;}

/* ---------- SERVICES ---------- */
.services-grid{
  display:grid; gap:1rem;
  grid-template-columns:repeat(2,1fr);
  grid-auto-rows:1fr;
}
@media(min-width:760px){
  .services-grid{grid-template-columns:repeat(3,1fr); gap:1.4rem;}
}
.service-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:1.5rem 1.4rem 1.2rem;
  transition:transform .15s ease, box-shadow .15s ease;
  display:flex; flex-direction:column; height:100%;
}
.service-card:hover{transform:translateY(-3px); box-shadow:var(--shadow);}
.service-card h3{margin-bottom:.4rem; font-size:1.15rem;}
@media(min-width:760px){.service-card h3{font-size:1.5rem;}}
.service-card p{margin:0; font-size:.94rem;}
.service-cta{
  align-self:flex-start; padding:.6em 1.3em; font-size:.85rem;
  border-color:var(--blue); color:var(--blue);
}
.service-cta:hover{border-color:var(--blue-dark); color:var(--blue-dark);}
.service-icon{
  width:38px; height:38px; margin-bottom:.9rem;
  color:var(--blue);
}
.service-card--soon{
  background:#fff; border:2px dashed rgba(35,48,42,0.28);
}
.service-card--soon .service-icon{color:var(--blue);}
.service-icon svg{width:100%; height:100%; display:block;}

/* ---------- INFOS PRATIQUES ---------- */
.section-infos{background:#E1EEEA;}
.info-columns{
  display:grid; gap:2.6rem;
  grid-template-columns:1fr;
}
@media(min-width:860px){
  .info-columns{grid-template-columns:repeat(3,1fr);}
}
.info-column{text-align:center;}
@media(min-width:860px){
  .info-column{border-left:1px solid var(--line); padding-left:2.4rem;}
  .info-column:first-child{border-left:none; padding-left:0;}
}
.info-column .info-icon{
  width:40px; height:40px; margin:0 auto 1.1rem; color:var(--blue);
}
.info-column .info-icon svg{width:100%; height:100%; display:block;}
.info-column h3{margin-bottom:1rem;}
.info-column p{font-size:.95rem;}
.info-column .btn{margin-top:.9rem;}

/* ---------- CABINET ---------- */
.cabinet-grid{
  display:grid; gap:2.6rem; grid-template-columns:1fr;
  align-items:center;
}
@media(min-width:900px){.cabinet-grid{grid-template-columns:1fr 1fr;}}
.cabinet-address{
  display:flex; gap:.9rem; align-items:flex-start;
  margin-top:.4rem;
  font-size:.98rem;
  color:var(--ink-soft);
}
.info-tag{
  flex:none; width:28px; height:28px;
  color:var(--blue);
  display:flex; align-items:center; justify-content:center;
}
.info-tag svg{width:100%; height:100%; display:block;}
.carousel--cabinet{aspect-ratio:5/4;}

/* ---------- RENDEZ-VOUS ---------- */
.rdv-grid{display:grid; gap:1.6rem; grid-template-columns:1fr;}
@media(min-width:760px){.rdv-grid{grid-template-columns:repeat(2,1fr);}}
.rdv-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:2rem; display:flex; flex-direction:column; gap:.5rem;
}
.rdv-card h3{margin-bottom:.2rem;}
.contact-strip{
  margin-top:3rem; padding-top:2.4rem; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:2.4rem; justify-content:space-between;
}
.contact-item dt{
  font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--sage-dark); font-weight:700; margin-bottom:.3rem;
}
.contact-item dd{margin:0; font-size:1.02rem; font-weight:500;}

/* ---------- MEDECINS TEASER ---------- */
.section-team{}
.medecins-teaser{
  display:grid; gap:1.4rem;
  grid-template-columns:repeat(auto-fit, minmax(210px,1fr));
}
.medecin-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .15s ease, box-shadow .15s ease;
}
.medecin-card:hover{transform:translateY(-3px); box-shadow:var(--shadow);}
.medecin-photo{
  width:84px; height:84px; border-radius:50%; overflow:hidden;
  background:var(--sage-light); flex:none;
  margin-bottom:1rem;
  box-shadow:0 10px 22px -10px rgba(35,48,42,0.4);
}
.medecin-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.medecin-body{padding:1.4rem 1.4rem 1.5rem; display:flex; flex-direction:column; flex:1;}
.medecin-role{font-size:.85rem; color:var(--sage-dark); font-weight:700; margin-bottom:1.1rem;}
.role-dot{
  display:inline-block; width:5px; height:5px; border-radius:50%;
  background:var(--plum); margin:0 .5em; vertical-align:middle;
}
.medecin-actions{display:flex; flex-direction:column; gap:.6rem; margin-top:auto;}
.medecin-actions .btn{width:100%;}

.medecin-card--empty{
  border:2px dashed rgba(35,48,42,0.28); background:#fff;
  align-items:center; justify-content:center; text-align:center;
  padding:2rem 1.5rem; gap:.8rem; color:var(--ink-soft);
}
.medecin-card--empty .empty-icon{
  width:38px; height:38px;
  color:var(--blue);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:.5rem;
}
.medecin-card--empty h3{font-size:1.05rem; margin-bottom:.3rem;}
.medecin-card--empty .empty-icon svg{width:100%; height:100%; display:block;}
.medecin-card--empty p{font-size:.9rem; margin:0 0 1rem;}

/* ---------- FOOTER ---------- */
/* ---------- LOCALISATION ---------- */
.map-embed{
  position:relative;
  border-radius:var(--radius); overflow:hidden;
  border:1px solid var(--line); box-shadow:var(--shadow);
  aspect-ratio:16/7; background:var(--sage-light);
}
.map-embed iframe{width:100%; height:100%; border:0; display:block;}
@media(max-width:760px){.map-embed{aspect-ratio:4/3;}}
.map-card{
  position:absolute; left:20px; top:20px;
  width:280px; max-width:calc(100% - 40px);
  background:#fff; border-radius:16px;
  padding:1.4rem 1.4rem 1.3rem;
  box-shadow:0 20px 44px -20px rgba(35,48,42,0.45);
}
.map-card-header{display:flex; align-items:center; justify-content:center; margin-bottom:.5rem;}
.map-card-header img{height:96px; width:auto;}
.map-card-address{font-size:.92rem; color:var(--ink); font-weight:600; margin:0;}
.map-card-label{
  font-size:.8rem; font-weight:700; color:var(--sage-dark);
  text-decoration:underline; margin:0 0 .4rem;
}
.map-card-hours{font-size:.86rem; color:var(--ink-soft); margin:0;}
@media(max-width:640px){
  .map-card{position:static; width:auto; max-width:none; margin-top:1rem; box-shadow:none; border:1px solid var(--line);}
  .map-embed{display:flex; flex-direction:column; height:auto; aspect-ratio:auto;}
  .map-embed iframe{aspect-ratio:4/3; height:auto;}
}

/* ---------- BOOKING MODAL ---------- */
.booking-modal-overlay{
  position:fixed; inset:0; z-index:100;
  background:rgba(27,35,31,0.5);
  backdrop-filter:blur(2px);
  display:flex; align-items:center; justify-content:center;
  padding:1.5rem;
  opacity:0; visibility:hidden;
  transition:opacity .25s ease, visibility .25s ease;
}
.booking-modal-overlay.is-open{opacity:1; visibility:visible;}
.booking-modal{
  background:#fff; border-radius:22px;
  padding:2.2rem 2rem 2rem;
  width:100%; max-width:400px;
  box-shadow:0 30px 60px -20px rgba(35,48,42,0.5);
  position:relative;
  transform:translateY(16px) scale(.97);
  opacity:0;
  transition:transform .3s cubic-bezier(.2,.8,.2,1), opacity .25s ease;
}
.booking-modal-overlay.is-open .booking-modal{
  transform:translateY(0) scale(1);
  opacity:1;
}
.booking-modal-close{
  position:absolute; top:1rem; right:1rem;
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px;
  background:none; border:none; cursor:pointer;
  color:var(--ink-soft); border-radius:50%;
  transition:color .15s ease, background .15s ease;
}
.booking-modal-close:hover{color:var(--ink); background:var(--sage-light);}
.booking-modal-close svg{width:24px; height:24px;}
.booking-modal h2{font-size:1.5rem; margin-bottom:.3rem; padding-right:2rem;}
.booking-modal-subtitle{font-size:.92rem; color:var(--ink-soft); margin:0 0 1.4rem;}
.booking-modal-options{display:flex; flex-direction:column; gap:.7rem;}
.booking-modal-option{
  display:flex; align-items:center; justify-content:space-between;
  padding:.7rem 1.1rem; border:1.5px solid var(--line); border-radius:14px;
  font-weight:700; color:var(--ink); text-decoration:none;
  transition:border-color .15s ease, background .15s ease, transform .15s ease;
}
.booking-modal-option-left{display:flex; align-items:center; gap:.8rem;}
.booking-modal-option-left img{
  width:44px; height:44px; border-radius:50%; object-fit:cover; flex:none;
}
.booking-modal-option svg{width:18px; height:18px; color:var(--sage-dark); transition:transform .15s ease; flex:none;}
.booking-modal-option:hover{
  border-color:var(--sage); background:var(--sage-light);
  transform:translateX(2px);
}
.booking-modal-option:hover svg{transform:translateX(3px);}
@media(prefers-reduced-motion: reduce){
  .booking-modal-overlay, .booking-modal, .booking-modal-option, .booking-modal-option svg{transition:none !important;}
}

footer{
  border-top:1px solid var(--line);
  padding:1.4rem 0;
  color:var(--ink-soft); font-size:.85rem;
}
footer .wrap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; align-items:center;}

/* ---------- MEDECINS PAGE ---------- */
.page-hero{padding:4rem 0 1rem;}
.doctors-section{padding-top:1.5rem;}
.doctor-block{
  display:grid; gap:2.8rem; grid-template-columns:1fr;
  padding:3rem 0; border-bottom:1px solid var(--line);
  align-items:start;
}
.doctor-block:last-child{border-bottom:none;}
@media(min-width:860px){.doctor-block{grid-template-columns:200px 1fr;}}
.doctor-photo{
  aspect-ratio:4/5; border-radius:var(--radius); background:var(--sage-light);
  display:flex; align-items:center; justify-content:center;
  color:var(--sage-dark); font-family:'Fraunces',serif; font-size:3rem;
  overflow:hidden; max-width:200px;
}
.doctor-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.doctor-photo--empty{background:transparent; border:2px dashed var(--line); color:var(--blue);}
.doctor-photo--empty svg{width:48px; height:48px;}
.doctor-specialty{
  font-size:.85rem; font-weight:700; color:var(--sage-dark);
  margin-bottom:.9rem;
}
.doctor-block .btn{margin-top:.6rem;}

@media(prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important;}
}

:focus-visible{outline:2px solid var(--plum); outline-offset:2px;}