/* ═══ Les bô jours avec vous — styles des pages internes ═══
   Reprend la charte de index.html : palette, fonts, composants. */

:root {
  --cream:    #FAF6F0;
  --cream-2:  #F4ECDD;
  --paper:    #FFFFFF;
  --rose:     #F7838D;
  --rose-deep:#E15C31;
  --rose-soft:#F6C9CD;
  --rose-pale:#FCE6E9;
  --blue:     #BEDFEF;
  --blue-soft:#DDF0F8;
  --blue-deep:#1724A4;
  --beige:    #F6E4C9;
  --ink:      #1724A4;
  --ink-2:    #2E3A7C;
  --muted:    #6E7AAA;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--cream); color: var(--ink);
  font-family: 'DM Sans', system-ui, sans-serif; font-weight: 400;
  -webkit-font-smoothing: antialiased; line-height: 1.6;
}
::selection { background: var(--rose); color: var(--ink); }
img { display: block; max-width: 100%; }
picture { display: contents; }
a { color: inherit; }

.wrap   { max-width: 1360px; margin: 0 auto; padding: 0 32px; }
.narrow { max-width: 820px;  margin: 0 auto; padding: 0 32px; }
@media (max-width: 720px){ .wrap, .narrow { padding: 0 20px; } }

/* ── Header (fond crème charte, identique à la home) ──
   Persistant au scroll : seule la hauteur se réduit. */
header.topbar {
  position: sticky; top: 0; z-index: 80;
  background-color: var(--cream);
  border-bottom: 1.5px solid rgba(23,36,164,.10);
}
header.topbar .topbar-inner { transition: min-height .3s; }
header.topbar .brand-logo img { transition: height .3s; }
header.topbar.scrolled .topbar-inner { min-height: 64px; }
header.topbar.scrolled .brand-logo img { height: 60px; }
@media (max-width: 720px){
  header.topbar.scrolled .topbar-inner { min-height: 56px; }
  header.topbar.scrolled .brand-logo img { height: 48px; }
}
/* Calqué sur la home : hauteur 200px desktop / 120px mobile, logo 134px / 90px */
.topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 200px; }
.brand-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand-logo img { height: 134px; width: auto; display: block; }
@media (max-width: 720px){
  .topbar-inner { min-height: 120px; }
  .brand-logo img { height: 90px; }
}
nav.primary { display: flex; gap: 36px; font-size: 17px; font-weight: 500; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
nav.primary a { color: var(--ink); text-decoration: none; padding: 4px 0; position: relative; }
nav.primary a::after { content:''; position:absolute; left:0; bottom:0; height:1.5px; width:0; background: var(--rose); transition: width .3s; }
nav.primary a:hover { color: var(--rose-deep); }
nav.primary a:hover::after { width: 100%; }
@media (max-width: 900px){ nav.primary { display: none; } }

/* ── Sous-menus déroulants (desktop) ── */
.nav-item { position: relative; display: inline-flex; }
.nav-item > a .caret { font-size: 10px; margin-left: 4px; }
.sub-menu {
  position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%);
  background: var(--paper); border: 1.5px solid var(--ink); border-radius: 16px;
  padding: 8px; min-width: 250px; display: none; z-index: 70;
  box-shadow: 0 26px 50px -24px rgba(23,36,164,.35);
}
.nav-item::after { content: ''; position: absolute; top: 100%; left: 0; right: 0; height: 10px; }
.nav-item:hover .sub-menu, .nav-item:focus-within .sub-menu { display: block; }
.sub-menu a { display: block; padding: 11px 15px; border-radius: 10px; font-size: 16px; white-space: nowrap; }
.sub-menu a::after { display: none; }
.sub-menu a:hover { background: var(--rose-pale); color: var(--rose-deep); }

/* ── Libellés de groupe dans le hamburger ── */
.menu-panel .panel-label {
  display: block; padding: 12px 18px 4px;
  font-family: 'League Spartan', sans-serif; font-size: 11px; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase; color: var(--rose-deep);
}
.menu-panel a.sub { padding-left: 34px; font-size: 15px; }

/* ── Menu hamburger (mobile) ── */
.menu-btn {
  width: 44px; height: 44px; display: none; align-items: center; justify-content: center;
  background: transparent; border: 1.5px solid var(--ink); cursor: pointer;
  color: var(--ink); border-radius: 999px; transition: background .2s; flex-shrink: 0;
}
.menu-btn:hover { background: var(--ink); color: var(--cream); }
@media (max-width: 900px){ .menu-btn { display: inline-flex; } }
.menu-panel {
  position: fixed; top: 88px; left: 20px; right: 20px; z-index: 60;
  background: var(--paper); border-radius: 24px; padding: 14px;
  box-shadow: 0 30px 60px -28px rgba(31,26,23,.3); border: 1.5px solid rgba(23,36,164,.12);
}
.menu-panel a { display: block; padding: 13px 18px; color: var(--ink); text-decoration: none; border-radius: 14px; font-size: 16px; font-weight: 500; transition: background .2s; }
.menu-panel a:hover { background: var(--rose-pale); color: var(--rose-deep); }
.menu-panel[hidden] { display: none; }

/* ── Boutons flottants : alignés sur les marges du contenu (20px mobile) ── */
.sticky-cta { position: fixed; z-index: 55; left: 20px; right: 88px; bottom: 16px; display: flex; }
.sticky-cta .btn { width: 100%; justify-content: center; padding: 16px 24px; box-shadow: 0 22px 30px -14px rgba(31,26,23,.4); background: var(--rose-soft); }
.wa-float {
  position: fixed; z-index: 55; right: 20px; bottom: 16px;
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--ink); color: var(--cream);
  border: 1.5px solid var(--ink);
  display: grid; place-items: center; text-decoration: none;
  box-shadow: 0 22px 30px -14px rgba(23,36,164,.45);
  transition: transform .3s, background .3s, color .3s;
}
.wa-float:hover { transform: translateY(-3px); background: var(--rose); color: var(--ink); }
@media (min-width: 901px){
  .sticky-cta { left: auto; right: 100px; bottom: 24px; }
  .sticky-cta .btn { width: auto; padding: 15px 26px; }
  .wa-float { right: 24px; bottom: 24px; }
}
footer.site { padding-bottom: 110px; }

/* ── Image d'illustration de page ── */
.page-hero-img {
  border: 1.5px solid var(--ink); border-radius: 22px; overflow: hidden;
  margin: 6px 0 30px; aspect-ratio: 16 / 9; background: var(--rose-soft);
  box-shadow: 0 40px 70px -45px rgba(31,26,23,.35);
}
.page-hero-img img { width: 100%; height: 100%; object-fit: cover; }
/* Variante portrait : image affichée en entier, sans recadrage */
.page-hero-img.portrait { aspect-ratio: auto; max-width: 520px; margin-left: auto; margin-right: auto; }
.page-hero-img.portrait img { height: auto; object-fit: unset; }
.card-img { border: 1.5px solid var(--ink); border-radius: 16px; overflow: hidden; aspect-ratio: 16 / 8; margin: 0 0 18px; }
.card-img img { width: 100%; height: 100%; object-fit: cover; }

/* ── Fil d'Ariane ── */
.breadcrumb { font-size: 13px; color: var(--muted); padding: 18px 0 0; }
.breadcrumb a { color: var(--muted); text-decoration: none; }
.breadcrumb a:hover { color: var(--rose-deep); }
.breadcrumb .sep { margin: 0 8px; color: var(--rose); }
.breadcrumb .current { color: var(--ink-2); }

/* ── Typo de contenu ── */
h1 {
  font-family: 'League Spartan', sans-serif; font-weight: 800;
  font-size: clamp(34px, 5.4vw, 58px); line-height: 1.02; letter-spacing: -.04em;
  color: var(--ink); margin: 26px 0 18px;
}
h1 em { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 400; color: var(--rose); }
h2 {
  font-family: 'League Spartan', sans-serif; font-weight: 700;
  font-size: clamp(24px, 3.2vw, 34px); letter-spacing: -.03em; line-height: 1.1;
  color: var(--ink); margin: 52px 0 16px;
}
h3 { font-family: 'League Spartan', sans-serif; font-weight: 600; font-size: 20px; letter-spacing: -.01em; color: var(--ink); margin: 30px 0 10px; }
.lead { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-size: clamp(19px, 2.2vw, 24px); color: var(--ink-2); line-height: 1.55; margin: 0 0 14px; }
main p, main li { font-size: 17.5px; color: var(--ink-2); }
@media (min-width: 901px){ main p, main li { font-size: 18px; } }
main a { color: var(--rose-deep); }
main ul { padding-left: 22px; }
main li { margin-bottom: 8px; }
.page-head { padding: 8px 0 34px; }
.page-body { padding-bottom: 30px; }
strong { color: var(--ink); }

/* ── Boutons ── */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 26px; border-radius: 999px; cursor: pointer;
  font-family: 'League Spartan', sans-serif; font-weight: 600; font-size: 13px;
  letter-spacing: .14em; text-transform: uppercase; text-decoration: none;
  border: 1.5px solid var(--ink);
  background: var(--rose-soft); color: var(--ink);
  transition: transform .3s, background .3s, color .3s, box-shadow .3s;
  white-space: nowrap;
}
.btn:hover { background: var(--ink); color: #FFFFFF; transform: translateY(-2px); box-shadow: 0 10px 22px -12px rgba(23,36,164,.45); }

/* ── Encadrés ── */
.card-block {
  background: var(--paper); border: 1.5px solid var(--ink); border-radius: 22px;
  padding: 26px 28px; margin: 26px 0;
}
.card-block.rose { background: var(--rose-pale); }
.card-block.blue { background: var(--blue-soft); }
.card-block h3:first-child, .card-block h2:first-child { margin-top: 0; }
.meta-pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; padding: 0; list-style: none; }
.meta-pills li { padding: 7px 14px; background: var(--cream-2); border-radius: 999px; font-size: 13.5px; color: var(--ink); font-weight: 500; margin: 0; }

/* ── Tableau tarifs ── */
.tbl-wrap { overflow-x: auto; margin: 22px 0; }
table.tarifs { width: 100%; border-collapse: collapse; background: var(--paper); border: 1.5px solid var(--ink); border-radius: 18px; overflow: hidden; }
table.tarifs th { font-family: 'League Spartan', sans-serif; font-weight: 700; font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; text-align: left; background: var(--rose-soft); color: var(--ink); padding: 14px 16px; border-bottom: 1.5px solid var(--ink); }
table.tarifs td { padding: 13px 16px; font-size: 16.5px; color: var(--ink-2); border-bottom: 1px solid rgba(23,36,164,.10); }
table.tarifs tr:last-child td { border-bottom: none; }
table.tarifs td.prix { font-family: 'League Spartan', sans-serif; font-weight: 700; color: var(--ink); white-space: nowrap; }
/* Mobile : padding réduit + colonne "Lieu" masquée sur le grand tableau 4 colonnes */
@media (max-width: 720px){
  table.tarifs th, table.tarifs td { padding: 10px 10px; font-size: 13.5px; }
  table.tarifs th { font-size: 10.5px; letter-spacing: .08em; }
  table.tarifs.cols-4 th:nth-child(3), table.tarifs.cols-4 td:nth-child(3) { display: none; }
}

/* ── Popup de réservation Calendly (toutes pages) ── */
.rdv-modal { position: fixed; inset: 0; z-index: 110; display: grid; place-items: center; }
.rdv-modal[hidden] { display: none; }
.rdv-backdrop { position: absolute; inset: 0; background: rgba(23,36,164,.35); backdrop-filter: blur(4px); }
.rdv-box {
  position: relative; background: var(--paper); border: 1.5px solid var(--ink);
  border-radius: 24px; padding: 22px 18px 10px; width: min(460px, calc(100vw - 24px));
  height: calc(100vh - 24px); height: calc(100svh - 24px); display: flex; flex-direction: column;
  box-shadow: 0 50px 90px -40px rgba(23,36,164,.5);
}
.rdv-head h3 { font-family:'League Spartan', sans-serif; font-weight: 700; font-size: 22px; letter-spacing: -.02em; color: var(--ink); margin: 0 0 4px; text-align: center; }
.rdv-head p { font-family:'Fraunces', Georgia, serif; font-style: italic; font-size: 14px; color: var(--ink-2); margin: 0 0 10px; text-align: center; }
#rdv-calendly { flex: 1; min-height: 0; overflow: hidden; border-radius: 14px; }
#rdv-calendly .calendly-inline-widget { height: 100% !important; min-height: 0; }
#rdv-calendly iframe { height: 100% !important; }
.rdv-close {
  position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; z-index: 2;
  border-radius: 50%; border: 1.5px solid var(--ink); background: var(--paper);
  cursor: pointer; color: var(--ink); font-size: 13px; display: grid; place-items: center;
}
.rdv-close:hover { background: var(--ink); color: var(--cream); }

/* ── FAQ ── */
.faq details {
  background: var(--paper); border: 1.5px solid var(--ink); border-radius: 16px;
  margin-bottom: 12px; overflow: hidden;
}
.faq summary {
  cursor: pointer; list-style: none; padding: 16px 20px;
  font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 17px; color: var(--ink);
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; font-size: 22px; color: var(--rose-deep); flex-shrink: 0; }
.faq details[open] summary::after { content: '–'; }
.faq details[open] summary { border-bottom: 1.5px dashed rgba(23,36,164,.25); }
.faq .faq-a { padding: 14px 20px 18px; }
.faq .faq-a p { margin: 0 0 10px; font-size: 16.5px; }
.faq .faq-a p:last-child { margin-bottom: 0; }

/* ── Bloc venir au cabinet (pages internes, fond clair) ── */
.acces-block {
  background: var(--blue-soft); border: 1.5px solid var(--ink); border-radius: 18px;
  padding: 20px 24px; margin: 30px 0; font-size: 15px; color: var(--ink-2);
}
.acces-block h3 { margin: 0 0 8px; }
.acces-block a { font-weight: 600; }

/* ── Galerie (retraite) ── */
.galerie { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 24px 0 8px; }
@media (max-width: 720px){ .galerie { grid-template-columns: 1fr; } }
.galerie figure { margin: 0; border: 1.5px solid var(--ink); border-radius: 16px; overflow: hidden; aspect-ratio: 3 / 4; }
.galerie img { width: 100%; height: 100%; object-fit: cover; }
.galerie-note { font-size: 11.5px; color: var(--muted); text-align: right; margin: 6px 0 20px; }

/* ── Disclaimer ── */
.disclaimer-block {
  font-family: 'Fraunces', Georgia, serif; font-style: italic; font-size: 13.5px;
  color: var(--muted); border-left: 3px solid var(--rose); padding: 4px 0 4px 16px; margin: 34px 0 8px;
}

/* ── CTA final ── */
.cta-final { text-align: center; padding: 44px 0 60px; }
.cta-final p { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-size: 18px; color: var(--ink-2); margin-bottom: 18px; }

/* ── Blog ── */
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; margin: 30px 0 50px; }
.blog-card {
  background: var(--paper); border: 1.5px solid var(--ink); border-radius: 20px;
  padding: 24px; display: flex; flex-direction: column; gap: 10px;
  transition: transform .3s, background .3s; text-decoration: none;
}
.blog-card:hover { transform: translateY(-5px); background: var(--rose-pale); }
.blog-card .cat { font-size: 11.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--rose-deep); font-family: 'League Spartan', sans-serif; }
.blog-card h2 { margin: 0; font-size: 21px; line-height: 1.2; }
.blog-card h2 a { color: var(--ink); text-decoration: none; }
.blog-card h2 a:hover { color: var(--rose-deep); }
.blog-card .date { font-size: 13px; color: var(--muted); }
.blog-card p { margin: 0; font-size: 14.5px; }
.article-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13.5px; color: var(--muted); margin: 0 0 26px; }
.article-meta a { color: var(--rose-deep); }
.article-hero { border-radius: 20px; overflow: hidden; border: 1.5px solid var(--ink); margin: 26px 0; }
.lire-aussi { background: var(--cream-2); border-radius: 18px; padding: 20px 24px; margin: 36px 0; }
.lire-aussi h3 { margin-top: 0; }
.lire-aussi ul { margin: 0; }

/* ── Footer (identique à la home) ── */
footer.site { background: var(--ink); color: var(--cream); padding: 80px 0 36px; position: relative; overflow: hidden; margin-top: 60px; }
footer.site::before { content:''; position:absolute; top: -180px; right: -150px; width: 500px; height: 500px; background: radial-gradient(circle, rgba(240,138,160,.18), transparent 65%); pointer-events:none; }
.footer-grid { display:grid; grid-template-columns: 4fr 3fr 3fr 3fr 3fr; gap: 40px 44px; position:relative; z-index:1; }
@media (max-width: 980px){ .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px){ .footer-grid { grid-template-columns: 1fr; } }
.footer-brand .logo-img img { height: 110px; width: auto; }
.footer-brand .quote { font-family:'DM Sans', sans-serif; font-style: italic; font-size: 17px; color: var(--cream); line-height: 1.45; margin: 24px 0 12px; max-width: 36ch; }
.footer-brand .cert-line { font-size: 12.5px; color: rgba(247,239,227,.7); margin: 0 0 22px; line-height: 1.5; }
.footer-brand .socials { display:flex; gap: 10px; }
.footer-brand .socials a {
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(247,239,227,.08); display:grid; place-items:center;
  color: var(--cream); transition: background .3s, color .3s; text-decoration:none;
  border: 1.5px solid rgba(247,239,227,.15);
}
.footer-brand .socials a:hover { background: var(--rose); color: var(--ink); border-color: var(--rose); }
footer.site h4 { font-family: 'League Spartan', sans-serif; font-size: 11px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--rose); margin: 0 0 20px; }
footer.site .col ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap: 11px; }
footer.site .col a, footer.site .col li { color: var(--cream); text-decoration:none; font-size: 14px; line-height: 1.5; }
footer.site .col a:hover { color: var(--rose); }
footer.site .hours li { display:flex; justify-content: space-between; gap: 12px; }
footer.site .hours li span:last-child { color: rgba(247,239,227,.6); font-style: italic; }
.venir-cabinet { position: relative; z-index: 1; margin-top: 50px; padding: 22px 26px; border: 1.5px solid rgba(247,239,227,.18); border-radius: 18px; }
.venir-cabinet h4 { margin-bottom: 10px !important; }
.venir-cabinet p { margin: 0; font-size: 14px; color: rgba(247,239,227,.85) !important; line-height: 1.6; max-width: 72ch; }
.venir-cabinet a { color: var(--rose) !important; text-decoration: none; font-weight: 600; border-bottom: 1.5px solid currentColor; padding-bottom: 1px; }
.footer-bottom {
  border-top: 1px solid rgba(247,239,227,.12); padding-top: 26px; margin-top: 40px;
  display:flex; justify-content: space-between; flex-wrap: wrap; gap: 14px;
  font-size: 12px; color: rgba(247,239,227,.55); position:relative; z-index: 1;
}
.footer-bottom a { color: rgba(247,239,227,.7); text-decoration:none; margin-left: 18px; }
.footer-bottom a:hover { color: var(--rose); }
.footer-disclaimer { font-family:'DM Sans',sans-serif; font-style: italic; font-size: 12.5px; color: rgba(247,239,227,.5); margin-top: 20px; position:relative; z-index: 1; }