/*!
 * Horizon Santé — feuille de style unique.
 * Concept « Horizon clair » : blanc lumineux, encre profonde, sarcelle et menthe ; arches et ligne d'horizon.
 * Lisibilité maximale : Atkinson Hyperlegible Next (texte), Source Serif 4 (titres) ; texte courant ≥ 7:1.
 */
@layer reset, tokens, base, layout, components, utilities, pages, piles;

/* =========================================================== RESET */
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body, h1, h2, h3, h4, p, figure, blockquote, dl, dd, ul, ol { margin: 0; }
  ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
  img, svg, video { display: block; max-inline-size: 100%; }
  img { block-size: auto; }
  input, button, select, textarea { font: inherit; color: inherit; }
  button { cursor: pointer; }
  table { border-collapse: collapse; }
  [hidden] { display: none !important; }
}

/* =========================================================== TOKENS */
@layer tokens {
  :root {
    --color-bg: #FFFFFF;
    --color-surface: #F3F8F7;
    --color-mint: #CFF1E4;
    --color-mint-soft: #E6F6F0;
    --color-ink: #10252C;
    --color-ink-2: #3E5660;
    --color-teal: #17726D;
    --color-teal-deep: #0E5A56;
    --color-teal-light: #7FD8C4;
    --color-night: #0B1E24;
    --color-on-night-2: #B4CBC8;
    --color-urgent: #B3261E;
    --color-urgent-deep: #8C1D18;
    --color-urgent-soft: #FDECEA;
    --color-ok: #1E6B3A;
    --color-warn: #8A5300;
    --color-warn-soft: #FFF4DC;
    --color-border: #C5D6D3;
    --color-border-ui: #6B8A86;
    --color-disabled-bg: #EEF2F2;
    --color-disabled: #5C6F73;
    --color-link: var(--color-teal-deep);
    --color-focus: var(--color-teal-deep);
    --msd-accent: #7FD8C4;

    --font-text: "Atkinson Hyperlegible Next", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --font-display: "Source Serif 4", Georgia, "Times New Roman", serif;
    --text-scale: 1;
    --step--1: 1rem;
    --step-0: clamp(1.125rem, 1.08rem + 0.2vw, 1.1875rem);
    --step-1: clamp(1.3rem, 1.2rem + 0.5vw, 1.5rem);
    --step-2: clamp(1.75rem, 1.45rem + 1.4vw, 2.5rem);
    --step-3: clamp(2.25rem, 1.7rem + 2.6vw, 3.75rem);
    --step-4: clamp(2.5rem, 1.6rem + 4.2vw, 4.75rem);

    --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.5rem;
    --space-6: 2rem; --space-7: 2.5rem; --space-8: 3rem; --space-9: 4rem; --space-10: 5rem;
    --section: clamp(3.5rem, 2.5rem + 4vw, 6rem);
    --gutter: clamp(1rem, 4vw, 2rem);
    --container: 76rem;
    --measure: 68ch;

    --radius-field: 10px; --radius-card: 16px; --radius-panel: 24px; --radius-pill: 999px;
    --radius-arch: 999px 999px 20px 20px;
    --bw: 1px;
    --shadow-1: 0 1px 2px rgb(16 37 44 / 0.06), 0 8px 24px rgb(16 37 44 / 0.08);
    --shadow-2: 0 2px 4px rgb(16 37 44 / 0.06), 0 18px 40px rgb(16 37 44 / 0.12);
    --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
    --dur-1: 150ms; --dur-2: 200ms; --dur-3: 400ms;
    --target: 3rem;
    --header-h: 4.75rem;
    --bar-h: 64px;
  }
  /* Contraste renforcé : noir sur blanc pur, bordures noires 2 px */
  :root[data-contrast="high"] {
    --color-surface: #FFFFFF; --color-mint: #FFFFFF; --color-mint-soft: #FFFFFF;
    --color-ink: #000000; --color-ink-2: #000000; --color-teal: #00403C; --color-teal-deep: #00403C;
    --color-border: #000000; --color-border-ui: #000000; --color-disabled: #000000; --color-disabled-bg: #FFFFFF;
    --color-urgent-soft: #FFFFFF; --color-warn-soft: #FFFFFF;
    --color-link: #00403C; --color-focus: #000000; --bw: 2px;
    --shadow-1: none; --shadow-2: none;
  }
}

/* =========================================================== BASE */
@layer base {
  html {
    font-size: calc(100% * var(--text-scale));
    color-scheme: light;
    scroll-padding-block-start: calc(var(--header-h) + 1rem);
    hanging-punctuation: first;
  }
  body {
    background: var(--color-bg);
    color: var(--color-ink);
    font-family: var(--font-text);
    font-size: var(--step-0);
    line-height: 1.6;
    font-variant-ligatures: common-ligatures;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    min-block-size: 100vh;
    overflow-x: clip;
  }
  body.menu-open { overflow: hidden; }
  h1, h2, h3, h4 { line-height: 1.15; text-wrap: balance; color: var(--color-ink); }
  h1, h2 { font-family: var(--font-display); font-weight: 600; }
  h1 { font-size: var(--step-3); line-height: 1.08; letter-spacing: -0.01em; }
  h2 { font-size: var(--step-2); letter-spacing: -0.005em; }
  h3 { font-size: var(--step-1); font-weight: 700; line-height: 1.25; }
  h4 { font-size: var(--step-0); font-weight: 700; }
  p, li, dd { text-wrap: pretty; }
  p, ul, ol, dl { max-inline-size: var(--measure); }
  ul[class], ol[class], dl[class] { max-inline-size: none; }
  a { color: var(--color-link); text-decoration-thickness: 0.08em; text-underline-offset: 0.18em; }
  a:hover { text-decoration-thickness: 0.14em; }
  strong, b { font-weight: 700; }
  small { font-size: var(--step--1); }
  :focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; border-radius: 4px; }
  [data-contrast="high"] :focus-visible { outline-width: 4px; }
  ::selection { background: var(--color-mint); color: var(--color-ink); }
  sup { font-size: 0.65em; }
  abbr[title] { text-decoration: none; }
  hr { border: 0; border-block-start: var(--bw) solid var(--color-border); margin-block: var(--space-6); }
  [id] { scroll-margin-block-start: calc(var(--header-h) + 1.5rem); }
  table { font-variant-numeric: tabular-nums; }
  [data-contrast="high"] a { text-decoration-thickness: 2px; }
  [data-spacing="on"] body { line-height: 1.8; letter-spacing: 0.12em; word-spacing: 0.16em; }
  :root[data-taille="1.3"] body, :root[data-taille="1.5"] body, [data-spacing="on"] body { overflow-wrap: anywhere; hyphens: auto; }
  [data-spacing="on"] p { margin-block-end: 2em; }
  [data-spacing="on"] h1, [data-spacing="on"] h2, [data-spacing="on"] h3 { letter-spacing: 0.05em; }
}

/* =========================================================== LAYOUT */
@layer layout {
  .split, .hero__grid, .diaspora, .spec-section__grid, .article__grid, .directory, .signs, .rdv-layout, .access-card, .stack, .stack-lg { min-inline-size: 0; }
  .split, .hero__grid, .diaspora, .spec-section__grid, .article__grid, .directory, .signs { grid-template-columns: minmax(0, 1fr); }
  .hero__text, .page-head__inner, .section-head, .access-card, .field, .rdv-main, .rdv-form, .step, .step__head, .notfound, .confirmation, .doctor__body, .doctor__id, .spec-aside, .spec-facts, .article__head, .callout, .ethic, .bilan-card__actions, .doctor__actions, .hero__actions, .access-list li, .rdv-aside, .aside-card, .mobile-menu__meta, .filters__form, .empty-state, .now-band, .rdv-memo, .times, .search, .display-panel fieldset { grid-template-columns: minmax(0, 1fr); }
  .container { inline-size: 100%; max-inline-size: calc(var(--container) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
  .container--narrow { max-inline-size: calc(52rem + 2 * var(--gutter)); }
  .section { padding-block: var(--section); overflow-x: clip; }
  .section--alt { background: var(--color-surface); }
  .section--mint { background: var(--color-mint-soft); }
  .section--tight { padding-block: calc(var(--section) * 0.6); }
  .section + .section:not(.section--alt):not(.section--mint) { padding-block-start: calc(var(--section) * 0.4); }
  .grid > li { display: grid; min-inline-size: 0; }
  .cluster { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
  .grid { display: grid; gap: var(--gap, clamp(1rem, 0.6rem + 1.5vw, 1.75rem)); grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--min, 16rem)), 1fr)); }
  .grid--2 { --min: 22rem; }
  .grid--3 { --min: 17rem; }
  .split { display: grid; gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
  @media (min-width: 64em) {
    .split { grid-template-columns: 1fr 1fr; }
    .split--top { align-items: start; }
  }
  main { display: block; }
  /* Sections hors écran : le navigateur saute leur mise en page tant qu'on ne s'en approche pas (démarrage plus rapide sur mobile d'entrée de gamme) */
  @supports (content-visibility: auto) {
    main > .section:not(:last-child):not(.no-cv), main > .spec-section:not(:last-child) { content-visibility: auto; contain-intrinsic-size: auto 38rem; }
  }
  body.has-mobile-bar main { padding-block-end: 0; }
  @media (max-width: 47.99em) { body.has-mobile-bar main, body.has-mobile-bar .site-footer { padding-block-end: var(--bar-h); } }
}

/* =========================================================== COMPONENTS */
@layer components {
  /* ---------- Lien d'évitement ---------- */
  .skip-link { position: absolute; inset-inline-start: var(--space-4); inset-block-start: -10rem; z-index: 100; background: var(--color-teal-deep); color: #fff; padding: var(--space-3) var(--space-5); border-radius: var(--radius-field); font-weight: 700; text-decoration: none; }
  .skip-link:focus { inset-block-start: var(--space-4); }

  /* ---------- Icônes ---------- */
  .icon { inline-size: 1.25em; block-size: 1.25em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
  .icon--lg { inline-size: 1.75rem; block-size: 1.75rem; }
  .icon--xl { inline-size: 2.25rem; block-size: 2.25rem; }
  .icon-badge { display: inline-grid; place-items: center; inline-size: 3.25rem; block-size: 3.25rem; border-radius: 50%; background: var(--color-mint); color: var(--color-teal-deep); flex: none; }
  [data-contrast="high"] .icon-badge { border: 2px solid #000; }

  /* ---------- Boutons ---------- */
  .btn {
    --_bg: var(--color-teal-deep); --_fg: #fff; --_bd: var(--_bg);
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.6em;
    min-block-size: var(--target); padding: 0.6em 1.4em;
    border: 2px solid var(--_bd); border-radius: var(--radius-pill);
    background: var(--_bg); color: var(--_fg);
    font-weight: 700; font-size: var(--step-0); line-height: 1.2; text-align: center; text-decoration: none;
    transition: background-color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), transform var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
  }
  .btn:hover { --_bg: #0A4744; }
  .btn:active { transform: translateY(1px); }
  .btn .icon { inline-size: 1.3em; block-size: 1.3em; }
  .btn--lg { min-block-size: 3.5rem; padding-inline: 1.6em; }
  .btn--sm { min-block-size: 2.75rem; padding: 0.4em 1em; font-size: var(--step--1); }
  .btn--block { inline-size: 100%; }
  .btn--secondary { --_bg: transparent; --_fg: var(--color-teal-deep); --_bd: var(--color-teal-deep); }
  .btn--secondary:hover { --_bg: var(--color-mint-soft); }
  .btn--ghost { --_bg: transparent; --_fg: var(--color-teal-deep); --_bd: var(--color-border-ui); }
  .btn--ghost:hover { --_bg: var(--color-surface); --_bd: var(--color-teal-deep); }
  .btn--urgent { --_bg: var(--color-urgent); --_bd: var(--color-urgent); }
  .btn--urgent:hover { --_bg: var(--color-urgent-deep); --_bd: var(--color-urgent-deep); }
  .btn--urgent-outline { --_bg: #fff; --_fg: var(--color-urgent); --_bd: var(--color-urgent); }
  .btn--urgent-outline:hover { --_bg: var(--color-urgent-soft); --_fg: var(--color-urgent-deep); }
  .btn--light { --_bg: #fff; --_fg: var(--color-teal-deep); --_bd: #fff; }
  .btn[aria-disabled="true"], .btn:disabled { cursor: not-allowed; opacity: 0.75; }
  [data-contrast="high"] .btn { --_bd: #000; }
  [data-contrast="high"] .btn--secondary, [data-contrast="high"] .btn--ghost, [data-contrast="high"] .btn--soft, [data-contrast="high"] .btn--light { --_bg: #fff; --_fg: #000; }
  .link-btn { display: inline-flex; align-items: center; gap: 0.35em; min-block-size: 2.75rem; padding: 0 0.25rem; border: 0; background: none; color: var(--color-link); font-weight: 700; text-decoration: underline; text-underline-offset: 0.18em; }
  .link-arrow { display: inline-flex; align-items: center; gap: 0.45em; min-block-size: var(--target); font-weight: 700; text-decoration: none; }
  .link-arrow .icon { transition: transform var(--dur-1) var(--ease); }
  .link-arrow:hover { text-decoration: underline; }
  .link-arrow:hover .icon { transform: translateX(3px); }
  @keyframes spin { to { transform: rotate(360deg); } }

  /* ---------- Bandeau urgences ---------- */
  .strip { background: var(--color-urgent); color: #fff; container: strip / inline-size; position: relative; z-index: 31; }
  .strip a { color: #fff; }
  .strip__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-block-size: 3rem; }
  .strip__call { display: flex; align-items: center; gap: 0.6rem; min-block-size: 3rem; font-weight: 700; font-size: 1.0625rem; text-decoration: none; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .strip__call:hover { text-decoration: underline; }
  .strip__call .strip__mobile { display: inline; white-space: normal; }
  .strip__call .strip__xs { display: none; white-space: normal; }
  .strip__call .strip__desk { display: none; }
  .strip__tools { display: none; align-items: center; gap: var(--space-2); font-size: 0.9375rem; white-space: nowrap; }
  .strip__live { display: none; align-items: center; gap: var(--space-2); }
  .strip__clock { font-variant-numeric: tabular-nums; }
  .strip__sep { inline-size: 1px; block-size: 1.25rem; background: rgb(255 255 255 / 0.45); margin-inline: var(--space-2); }
  .strip__btn { display: inline-flex; align-items: center; gap: 0.45rem; min-block-size: 2.5rem; padding: 0 0.85rem; border: 1px solid rgb(255 255 255 / 0.6); border-radius: var(--radius-pill); background: transparent; color: #fff; font-weight: 700; font-size: 0.9375rem; text-decoration: none; }
  .strip__btn:hover { background: rgb(255 255 255 / 0.12); }
  .strip :focus-visible { outline-color: #fff; }
  .strip [data-js="statut-court"] { font-weight: 700; }
  @container strip (min-width: 48rem) {
    .strip__call .strip__mobile { display: none; }
    .strip__call .strip__desk { display: inline; }
    .strip__tools { display: flex; }
  }
  @container strip (min-width: 76rem) { :root:not([data-spacing="on"]) .strip__live { display: inline-flex; } }
  @container strip (min-width: 110rem) { .strip__live { display: inline-flex; } }
  @container strip (max-width: 47.99rem) {
    .strip__inner { justify-content: center; }
    .strip__call { inline-size: 100%; justify-content: center; font-size: 1rem; text-align: center; }
  }
  @container strip (max-width: 25.99rem) { .strip__call .strip__mobile { display: none; } .strip__call .strip__xs { display: inline; } }
  [data-contrast="high"] .strip { background: #8C1D18; }

  /* ---------- En-tête collant ---------- */
  .site-header { position: sticky; inset-block-start: 0; z-index: 30; background: rgb(255 255 255 / 0.96); border-block-end: var(--bw) solid var(--color-border); container: header / inline-size; transition: box-shadow var(--dur-2) var(--ease); }
  @supports (backdrop-filter: blur(8px)) { .site-header { background: rgb(255 255 255 / 0.88); backdrop-filter: saturate(1.4) blur(12px); } }
  body.menu-open .site-header { backdrop-filter: none; background: #fff; }
  .site-header.is-scrolled { box-shadow: 0 6px 24px rgb(16 37 44 / 0.08); }
  .header__inner { display: flex; align-items: center; gap: 0.75rem; min-block-size: var(--header-h); }
  .site-header .btn { white-space: nowrap; }
  .logo { display: inline-flex; align-items: center; gap: 0.65rem; color: var(--color-teal); text-decoration: none; margin-inline-end: auto; min-block-size: var(--target); }
  .logo__mark { inline-size: 2.6rem; block-size: 2.6rem; flex: none; }
  .logo__text { display: grid; line-height: 1.05; }
  .logo__name { font-family: var(--font-display); font-weight: 600; font-size: 1.35rem; color: var(--color-ink); letter-spacing: -0.005em; }
  .site-header .logo__name, .site-header .logo__tag { white-space: nowrap; }
  .logo__tag { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-teal); margin-block-start: 0.2rem; }
  .nav { display: none; }
  .nav__list { display: flex; gap: 0.15rem; list-style: none; margin: 0; padding: 0; max-inline-size: none; }
  .nav__link { display: inline-flex; align-items: center; min-block-size: var(--target); padding: 0 0.55rem; border-radius: var(--radius-pill); color: var(--color-ink); font-weight: 700; font-size: 1rem; text-decoration: none; position: relative; white-space: nowrap; }
  .nav__link:hover { background: var(--color-surface); color: var(--color-teal-deep); }
  .nav__link[aria-current="page"] { color: var(--color-teal-deep); }
  .nav__link[aria-current="page"]::after { content: ""; position: absolute; inset-inline: 0.55rem; inset-block-end: 0.35rem; block-size: 3px; border-radius: 3px; background: var(--color-teal); }
  .header__actions { display: none; gap: var(--space-2); }
  .header__urgent-mini { display: inline-flex; }
  .menu-toggle { display: inline-flex; align-items: center; gap: 0.45rem; min-block-size: var(--target); min-inline-size: var(--target); padding: 0 0.9rem; border: 2px solid var(--color-border-ui); border-radius: var(--radius-pill); background: #fff; font-weight: 700; color: var(--color-ink); }
  .menu-toggle[aria-expanded="true"] { background: var(--color-mint); border-color: var(--color-teal-deep); }
  .menu-toggle .icon-close { display: none; }
  .menu-toggle[aria-expanded="true"] .icon-open { display: none; }
  .menu-toggle[aria-expanded="true"] .icon-close { display: block; }
  @container header (max-width: 40rem) { .logo__tag { display: none; } }
  @container header (max-width: 18rem) { .logo__text { display: none; } }
  @container header (max-width: 26rem) { .logo__tag { display: none; } .menu-toggle__label { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); } .menu-toggle { padding: 0; justify-content: center; inline-size: var(--target); } .header__urgent-mini { padding: 0; inline-size: var(--target); } .header__urgent-mini .btn__txt { display: none; } .header__inner { gap: 0.5rem; } }
  @container header (max-width: 22rem) { .logo__name { font-size: 1.15rem; } .logo__mark { inline-size: 2.2rem; block-size: 2.2rem; } .logo { gap: 0.45rem; } }
  @container header (min-width: 48rem) { .header__actions { display: flex; } .header__urgent-mini { display: none; } }
  .header__urgent-outline { padding-inline: 0; inline-size: var(--target); }
  .header__urgent-outline .btn__label { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  @container header (min-width: 75rem) {
    .header__urgent-outline { padding-inline: 0.9em; inline-size: auto; }
    .header__urgent-outline .btn__label { position: static; inline-size: auto; block-size: auto; overflow: visible; clip-path: none; }
  }
  @container header (min-width: 75rem) and (max-width: 95.99rem) {
    .header__urgent-outline .icon { display: none; }
    .nav__list { gap: 0; }
    .nav__link { padding-inline: 0.5rem; }
    .nav__link[aria-current="page"]::after { inset-inline: 0.5rem; }
  }
  @container header (min-width: 75rem) { :root:not([data-spacing="on"]) .nav { display: block; } :root:not([data-spacing="on"]) .menu-toggle { display: none; } }
  @container header (min-width: 100rem) { .nav { display: block; } .menu-toggle { display: none; } }
  @container header (min-width: 75rem) and (max-width: 82rem) { .logo__tag { display: none; } }
  @container header (min-width: 96rem) { .header__urgent-outline { padding-inline: 1em; inline-size: auto; } .header__urgent-outline .btn__label { position: static; inline-size: auto; block-size: auto; overflow: visible; clip-path: none; } }
  .mobile-menu { position: fixed; inset: var(--menu-top, 7.75rem) 0 0 0; z-index: 29; overflow-y: auto; background: #fff; border-block-start: var(--bw) solid var(--color-border); padding-block: var(--space-5) calc(var(--space-9) + env(safe-area-inset-bottom)); overscroll-behavior: contain; }
  .mobile-menu__list { list-style: none; padding: 0; margin: var(--space-5) 0 0; max-inline-size: none; display: grid; }
  .mobile-menu__list a { display: flex; align-items: center; justify-content: space-between; min-block-size: 3.5rem; padding-inline: var(--space-2); border-block-end: var(--bw) solid var(--color-border); color: var(--color-ink); font-weight: 700; font-size: 1.2rem; text-decoration: none; }
  .mobile-menu__list a[aria-current="page"] { color: var(--color-teal-deep); background: var(--color-mint-soft); }
  .mobile-menu__list a .icon { color: var(--color-teal); }
  .mobile-menu__meta { margin-block-start: var(--space-6); display: grid; gap: var(--space-4); }
  .mobile-menu__tools { display: flex; flex-wrap: wrap; gap: var(--space-3); }

  /* ---------- Panneau Affichage ---------- */
  .display-panel { inline-size: min(26rem, calc(100vw - 1.5rem)); max-block-size: calc(100vh - 2rem); overflow: auto; margin: auto; padding: var(--space-5); border: var(--bw) solid var(--color-border); border-radius: var(--radius-panel); background: #fff; color: var(--color-ink); box-shadow: var(--shadow-2); }
  .display-panel::backdrop { background: rgb(11 30 36 / 0.25); }
  .display-panel.is-anchored { position: fixed; inset: var(--pop-top) var(--pop-right) auto auto; margin: 0; }
  .display-panel.is-fallback { position: fixed; inset: 7rem 0.75rem auto auto; z-index: 60; }
  .display-panel__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-block-end: var(--space-4); }
  .display-panel h2 { font-size: 1.5rem; }
  .display-panel fieldset { border: 0; padding: 0; margin: 0 0 var(--space-5); }
  .display-panel legend { font-weight: 700; margin-block-end: var(--space-2); padding: 0; }
  .size-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-2); }
  .size-option { position: relative; display: flex; align-items: center; justify-content: center; text-align: center; min-block-size: 3.25rem; padding: 0.35rem; border: 2px solid var(--color-border-ui); border-radius: var(--radius-field); font-weight: 700; cursor: pointer; line-height: 1.15; }
  .size-option input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
  .size-option:has(input:checked) { border-color: var(--color-teal-deep); border-width: 3px; background: var(--color-mint); }
  .size-option:has(input:focus-visible) { outline: 3px solid var(--color-focus); outline-offset: 2px; }
  .size-option small { display: block; font-weight: 400; font-size: 0.85rem; }

  /* ---------- Formulaires ---------- */
  .field { display: grid; gap: var(--space-2); }
  .field > label, .label { font-weight: 700; }
  .field-hint { color: var(--color-ink-2); font-size: var(--step--1); line-height: 1.45; }
  .input, .select, .textarea {
    inline-size: 100%; min-block-size: 3.25rem; padding: 0.65rem 0.9rem;
    border: 2px solid var(--color-border-ui); border-radius: var(--radius-field); background: #fff; color: var(--color-ink);
    transition: border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
  }
  .select { appearance: none; padding-inline-end: 2.75rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='22' height='22' fill='none' stroke='%230E5A56' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.8rem center; }
  .input:hover, .select:hover, .textarea:hover { border-color: var(--color-teal-deep); }
  .input:focus-visible, .select:focus-visible, .textarea:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 1px; border-color: var(--color-teal-deep); }
  .input[aria-invalid="true"], .select[aria-invalid="true"], .textarea[aria-invalid="true"] { border-color: var(--color-urgent); box-shadow: inset 4px 0 0 var(--color-urgent); }
  .input--short { max-inline-size: 7rem; }
  .field-error { display: flex; gap: 0.5rem; align-items: flex-start; color: var(--color-urgent-deep); font-weight: 700; line-height: 1.4; max-inline-size: none; }
  .field-error svg { flex: none; margin-block-start: 0.1em; }
  .fieldset { border: 0; padding: 0; margin: 0; min-inline-size: 0; }
  .fieldset > legend { font-weight: 700; padding: 0; margin-block-end: var(--space-3); font-size: var(--step-0); }
  .check { display: flex; align-items: flex-start; gap: 0.75rem; min-block-size: var(--target); padding-block: 0.6rem; cursor: pointer; line-height: 1.45; }
  .check input, .radio input { flex: none; inline-size: 1.5rem; block-size: 1.5rem; margin: 0.05rem 0 0; accent-color: var(--color-teal-deep); cursor: pointer; }
  .radio { display: inline-flex; align-items: center; gap: 0.6rem; min-block-size: var(--target); padding: 0.45rem 1rem 0.45rem 0.8rem; border: 2px solid var(--color-border-ui); border-radius: var(--radius-pill); cursor: pointer; font-weight: 700; background: #fff; }
  .radio input { margin: 0; }
  .radio:has(input:checked) { border-color: var(--color-teal-deep); background: var(--color-mint); box-shadow: inset 0 0 0 1px var(--color-teal-deep); }
  .error-summary { padding: var(--space-5); border: 2px solid var(--color-urgent); border-inline-start-width: 6px; border-radius: var(--radius-card); background: var(--color-urgent-soft); color: var(--color-urgent-deep); }
  .error-summary__title { font-size: var(--step-1); color: var(--color-urgent-deep); margin-block-end: var(--space-2); }
  .error-summary ul { margin: 0; padding-inline-start: 1.25rem; }
  .error-summary a { color: var(--color-urgent-deep); font-weight: 700; }
  .error-summary:focus-visible { outline-color: var(--color-urgent-deep); }
  .honeypot { position: absolute !important; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }

  /* Cartes radio (parcours de rendez-vous) */

  /* ---------- Encadrés ---------- */
  .note { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-4) var(--space-5); border-radius: var(--radius-card); background: var(--color-mint-soft); border: var(--bw) solid var(--color-border); max-inline-size: none; }
  .note > .icon { color: var(--color-teal-deep); margin-block-start: 0.15em; }
  .note > * { min-inline-size: 0; }
  .note p { max-inline-size: 68ch; }
  .note--urgent { background: var(--color-urgent-soft); border-color: #F2B8B3; color: var(--color-urgent-deep); }
  .note--urgent > .icon { color: var(--color-urgent); }
  .note--urgent a { color: var(--color-urgent-deep); font-weight: 700; }
  .note--urgent strong { color: var(--color-urgent-deep); }
  .note--warn { background: var(--color-warn-soft); border-color: #F0D9A8; }
  .note--warn > .icon { color: var(--color-warn); }
  .note--plain { background: var(--color-surface); }
  .note--white { background: #fff; }
  [data-contrast="high"] .note { border: 2px solid #000; color: #000; }
  .callout { padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); border-radius: var(--radius-panel); background: var(--color-night); color: #fff; }
  .callout h2, .callout h3 { color: #fff; }
  .callout p { color: var(--color-on-night-2); }
  .callout a:not(.btn) { color: var(--color-teal-light); }

  /* ---------- Fil d'Ariane et tête de page ---------- */
  .breadcrumb ol { display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; list-style: none; padding: 0; margin: 0; font-size: var(--step--1); color: var(--color-ink-2); max-inline-size: none; }
  .breadcrumb li { display: inline-flex; align-items: center; gap: 0.5rem; }
  .breadcrumb li + li::before { content: "›"; color: var(--color-teal); font-weight: 700; }
  .breadcrumb a { color: var(--color-ink-2); display: inline-flex; min-block-size: 2.75rem; align-items: center; }
  .breadcrumb [aria-current="page"] { color: var(--color-ink); font-weight: 700; }
  .page-head { position: relative; padding-block: clamp(1rem, 0.5rem + 2vw, 2rem) clamp(2.5rem, 1.5rem + 4vw, 4.5rem); background: linear-gradient(180deg, var(--color-surface), #fff 85%); overflow: hidden; border-block-end: var(--bw) solid var(--color-border); }
  .page-head::after { content: ""; position: absolute; inset-inline-end: -6rem; inset-block-end: -9rem; inline-size: 26rem; aspect-ratio: 1; border-radius: 50%; border: 1px solid var(--color-border); box-shadow: 0 0 0 3rem rgb(207 241 228 / 0.35), 0 0 0 6rem rgb(207 241 228 / 0.18); pointer-events: none; }
  @media (max-width: 47.99em) { .page-head::after { inset-inline-end: -15rem; inset-block-end: -15rem; opacity: 0.8; } }
  .page-head__inner { position: relative; z-index: 1; display: grid; gap: var(--space-4); }
  .page-head h1 { max-inline-size: 22ch; margin-block-start: var(--space-3); }
  .page-head .lede { font-size: clamp(1.2rem, 1.1rem + 0.45vw, 1.4rem); color: var(--color-ink-2); max-inline-size: 58ch; }
  .eyebrow { display: inline-flex; align-items: center; gap: 0.55rem; font-size: 0.9375rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-teal-deep); }
  .eyebrow::before { content: ""; inline-size: 1.4rem; block-size: 0.7rem; border-radius: 1.4rem 1.4rem 0 0; background: var(--color-teal); box-shadow: 0 3px 0 -1px var(--color-teal); flex: none; }
  :root[data-taille="1.3"] .eyebrow, :root[data-taille="1.5"] .eyebrow { text-transform: none; letter-spacing: 0.01em; }
  .lede { font-size: clamp(1.15rem, 1.08rem + 0.35vw, 1.3rem); color: var(--color-ink-2); }

  /* Ligne d'horizon : filet sarcelle + demi-soleil */
  .horizon { position: relative; block-size: 13px; max-inline-size: 13rem; }
  .horizon::before { content: ""; position: absolute; inset-inline: 0; inset-block-end: 0; block-size: 1px; background: var(--color-teal); }
  .horizon::after { content: ""; position: absolute; inset-inline-start: 1.5rem; inset-block-end: 1px; inline-size: 24px; block-size: 12px; border-radius: 12px 12px 0 0; background: var(--color-teal); }
  .horizon--wide { max-inline-size: none; }
  .horizon--wide::after { inset-inline-start: calc(50% - 12px); }
  .horizon--light::before, .horizon--light::after { background: var(--color-teal-light); }

  /* En-tête de section */
  .section-head { display: grid; gap: var(--space-3); margin-block-end: clamp(1.75rem, 1.2rem + 2vw, 3rem); }
  .section-head p { color: var(--color-ink-2); font-size: clamp(1.125rem, 1.08rem + 0.25vw, 1.25rem); }
  .section-head--row { align-items: end; }
  @media (min-width: 64em) { .section-head--row { grid-template-columns: 1fr auto; } .section-head--row > :last-child:not(:first-child) { grid-row: span 2; align-self: end; } }

  /* ---------- Cartes ---------- */
  .card { position: relative; display: flex; flex-direction: column; gap: var(--space-3); padding: clamp(1.25rem, 1rem + 1vw, 1.75rem); border: var(--bw) solid var(--color-border); border-radius: var(--radius-card); background: #fff; box-shadow: var(--shadow-1); }
  .card--surface { background: var(--color-surface); box-shadow: none; }
  .card__title { font-size: var(--step-1); }
  .card__title a { color: inherit; text-decoration: none; }
  .card__title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
  .card--link { transition: transform var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease); }
  .card--link:hover { border-color: var(--color-teal); box-shadow: var(--shadow-2); }
  .card--link:has(a:focus-visible) { outline: 3px solid var(--color-focus); outline-offset: 3px; }
  .card--link a:focus-visible { outline: none; }
  .card__meta { color: var(--color-ink-2); font-size: var(--step--1); }

  /* Tuiles spécialités */

  /* Monogrammes en arche (à la place des photos des praticiens) */
  .mono { position: relative; display: grid; place-items: center; inline-size: 6rem; block-size: 7rem; flex: none; border-radius: var(--radius-arch); background: var(--color-mint); color: var(--color-teal-deep); font-family: var(--font-display); font-weight: 600; font-size: 2.1rem; letter-spacing: 0.02em; overflow: hidden; }
  .mono > span { position: relative; z-index: 1; margin-block-end: 1.1rem; }
  .mono::after { content: ""; position: absolute; inset-inline-start: 30%; inline-size: 40%; inset-block-end: calc(16% + 1px); aspect-ratio: 2 / 1; border-radius: 999px 999px 0 0; background: rgb(14 90 86 / 0.16); }
  .mono::before { content: ""; position: absolute; inset-inline: 12%; inset-block-end: 16%; block-size: 1.5px; background: rgb(14 90 86 / 0.35); }
  .mono--sm { inline-size: 4rem; block-size: 4.75rem; font-size: 1.4rem; }
  .mono--sm > span { margin-block-end: 0.75rem; }
  [data-contrast="high"] .mono { border: 2px solid #000; color: #000; }

  /* Fiche praticien */
  .doctors { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); list-style: none; padding: 0; margin: 0; max-inline-size: none; }
  .doctors > li { display: grid; }
  .doctor { container: doctor / inline-size; display: flex; flex-direction: column; border: var(--bw) solid var(--color-border); border-radius: var(--radius-card); background: #fff; box-shadow: var(--shadow-1); overflow: hidden; }
  .doctor__top { display: flex; gap: 1.1rem; align-items: flex-start; padding: 1.4rem 1.4rem 0; }
  .doctor__id { display: grid; gap: 0.3rem; min-inline-size: 0; }
  .doctor__name { font-family: var(--font-display); font-size: 1.55rem; font-weight: 600; line-height: 1.15; }
  .doctor__role { color: var(--color-ink-2); font-weight: 700; line-height: 1.35; }
  .doctor__role span { display: block; font-weight: 400; }
  .chips { display: flex; flex-wrap: wrap; gap: 0.4rem; list-style: none; padding: 0; margin: 0; max-inline-size: none; }
  .chip { display: inline-flex; align-items: center; gap: 0.35rem; min-block-size: 2rem; padding: 0.15rem 0.7rem; border-radius: var(--radius-pill); background: var(--color-mint); color: var(--color-ink); font-size: 0.9375rem; font-weight: 700; line-height: 1.2; }
  .chip--soft { background: var(--color-surface); border: var(--bw) solid var(--color-border); font-weight: 400; }
  .chip--teal { background: var(--color-teal-deep); color: #fff; }
  [data-contrast="high"] .chip { border: 2px solid #000; background: #fff; color: #000; }
  .doctor__body { display: flex; flex-direction: column; gap: 1rem; padding: 1.1rem 1.4rem 1.4rem; flex: 1; }
  .next-slot { display: flex; gap: 0.6rem; align-items: center; padding: 0.7rem 0.9rem; border-radius: var(--radius-field); background: var(--color-mint-soft); font-weight: 700; color: var(--color-teal-deep); line-height: 1.35; font-variant-numeric: tabular-nums; }
  .next-slot .icon { color: var(--color-teal); }
  .next-slot__txt:not(.is-live) { font-weight: 400; color: var(--color-ink); }
  .doctor__actions { display: grid; gap: 0.5rem; margin-block-start: auto; }
  .doctor details { border-block-start: var(--bw) solid var(--color-border); }
  .doctor summary { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; min-block-size: 3.25rem; padding: 0 1.4rem; font-weight: 700; color: var(--color-teal-deep); cursor: pointer; list-style: none; }
  .doctor summary::-webkit-details-marker { display: none; }
  .doctor summary .icon { transition: transform var(--dur-2) var(--ease); }
  .doctor details[open] summary .icon { transform: rotate(180deg); }
  @container doctor (min-width: 34rem) {
    .doctor__top { padding: 1.6rem 1.6rem 0; }
    .doctor__body { display: grid; grid-template-columns: 1fr auto; align-items: end; align-content: start; }
    .doctor__actions { grid-column: 2; grid-row: 1 / span 2; }
  }
  .doctor__actions .btn { padding-inline: 1em; }

  /* ---------- Statut en direct ---------- */
  .status-list { display: grid; gap: 0.55rem; list-style: none; margin: 0; padding: 0; max-inline-size: none; }
  .status { display: grid; grid-template-columns: 0.85rem minmax(0, 1fr); align-items: center; align-content: start; column-gap: 0.6rem; row-gap: 0.05rem; line-height: 1.35; }
  .status__dot { grid-column: 1; grid-row: 1; inline-size: 0.85rem; block-size: 0.85rem; border-radius: 50%; border: 2.5px solid currentColor; }
  .status__name { grid-column: 2; grid-row: 1; }
  .status__text { grid-column: 2; }
  .status__name { font-weight: 700; }
  .status__text { color: var(--color-ink-2); }
  .status--ouvert { color: var(--color-ok); }
  .status--ouvert .status__dot { background: currentColor; }
  .status--ferme-bientot { color: var(--color-warn); }
  .status--ferme-bientot .status__dot { background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
  .status--ferme { color: var(--color-ink-2); }
  .status--ferme .status__dot { background: transparent; }
  .status .status__name { color: var(--color-ink); }
  .status--ouvert .status__text { color: var(--color-ok); font-weight: 700; }
  .status--ferme-bientot .status__text { color: var(--color-warn); font-weight: 700; }
  .status-fallback { color: var(--color-ink-2); font-size: var(--step--1); line-height: 1.5; }
  .status-fallback dt { font-weight: 700; color: var(--color-ink); }
  .status-fallback dd { margin: 0 0 0.35rem; }
  .status-card { padding: 1.25rem 1.4rem; border-radius: var(--radius-card); background: #fff; border: var(--bw) solid var(--color-border); box-shadow: var(--shadow-2); }
  .status-card__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-block-end: 0.75rem; }
  .status-card__title { font-size: 1rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-teal-deep); }
  .clock { font-variant-numeric: tabular-nums; color: var(--color-ink-2); font-size: var(--step--1); }

  /* ---------- Étapes numérotées ---------- */
  .steps { display: grid; gap: var(--space-5); list-style: none; padding: 0; margin: 0; counter-reset: step; max-inline-size: none; }
  @media (min-width: 48em) { .steps--4 { grid-template-columns: repeat(2, 1fr); } }
  @media (min-width: 64em) { .steps--4 { grid-template-columns: repeat(4, 1fr); } .steps--4 .step-item::after { content: ""; position: absolute; inset-block-start: 1.75rem; inset-inline-start: 4.25rem; inset-inline-end: -1rem; block-size: 1px; background: var(--color-teal); opacity: 0.5; } .steps--4 .step-item:last-child::after { display: none; } }
  .step-item { position: relative; display: grid; gap: 0.6rem; align-content: start; counter-increment: step; }
  .step-item::before { content: counter(step); display: grid; place-items: center; inline-size: 3.5rem; block-size: 3.5rem; border-radius: 50%; background: var(--color-mint); color: var(--color-teal-deep); font-family: var(--font-display); font-weight: 600; font-size: 1.75rem; line-height: 1; position: relative; z-index: 1; }
  [data-contrast="high"] .step-item::before { border: 2px solid #000; }
  .step-item h3 { font-size: 1.25rem; }
  .step-item p { color: var(--color-ink-2); }

  /* ---------- Engagements (charte) ---------- */
  .charter { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); list-style: none; padding: 0; margin: 0; counter-reset: charte; max-inline-size: none; }
  .charter > li { counter-increment: charte; display: grid; grid-template-columns: auto 1fr; align-content: start; gap: 0.25rem 1rem; padding: 1.5rem; border-radius: var(--radius-card); background: #fff; border: var(--bw) solid var(--color-border); }
  .charter > li::before { content: counter(charte, decimal-leading-zero); grid-row: span 2; font-family: var(--font-display); font-weight: 600; font-size: 2rem; line-height: 1; color: var(--color-teal); }
  .charter h3 { font-size: 1.1875rem; }
  .charter p { color: var(--color-ink-2); }
  .ethic { display: grid; gap: var(--space-5); align-items: center; padding: clamp(1.5rem, 1rem + 2.5vw, 3rem); border-radius: var(--radius-panel); background: var(--color-night); color: #fff; margin-block-start: var(--space-6); position: relative; overflow: hidden; }
  .ethic::after { content: ""; position: absolute; inset-inline-end: -5rem; inset-block-end: -11rem; inline-size: 22rem; aspect-ratio: 1; border-radius: 50%; background: rgb(127 216 196 / 0.1); box-shadow: 0 0 0 2.5rem rgb(127 216 196 / 0.05); pointer-events: none; }
  .ethic h2, .ethic h3 { color: #fff; font-family: var(--font-display); font-weight: 600; font-size: var(--step-2); }
  .ethic p { color: var(--color-on-night-2); font-size: 1.1875rem; position: relative; z-index: 1; }
  .ethic a { color: var(--color-teal-light); }
  .ethic .icon-badge { background: rgb(127 216 196 / 0.16); color: var(--color-teal-light); }
  @media (min-width: 64em) { .ethic { grid-template-columns: auto 1fr; } }
  [data-contrast="high"] .ethic, [data-contrast="high"] .callout { background: #fff; color: #000; border: 2px solid #000; }
  [data-contrast="high"] .ethic h2, [data-contrast="high"] .ethic h3, [data-contrast="high"] .ethic p, [data-contrast="high"] .callout h2, [data-contrast="high"] .callout p { color: #000; }

  /* ---------- Chiffres clés ---------- */
  .figures { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); list-style: none; padding: 0; margin: 0; max-inline-size: none; }
  .figure-card { display: grid; gap: 0.35rem; align-content: start; padding: 1.4rem 1.5rem; border-radius: var(--radius-card); background: #fff; border: var(--bw) solid var(--color-border); }
  .figure-card__value { font-weight: 800; font-size: clamp(1.45rem, 1.2rem + 0.8vw, 1.85rem); line-height: 1.05; color: var(--color-teal-deep); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
  .figure-card__value small { font-size: 0.55em; font-weight: 700; }
  .figure-card__label { font-weight: 700; }
  .figure-card__note { color: var(--color-ink-2); font-size: var(--step--1); }

  /* ---------- Tableaux ---------- */
  .table-wrap { position: relative; overflow-x: auto; border: var(--bw) solid var(--color-border); border-radius: var(--radius-card); background: #fff; -webkit-overflow-scrolling: touch; }
  .table-wrap:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
  .table { inline-size: 100%; min-inline-size: 32rem; font-size: 1.0625rem; }
  .table caption { caption-side: top; text-align: start; padding: 1rem 1.25rem 0.75rem; font-weight: 700; font-size: var(--step-1); }
  .table caption small { display: block; font-weight: 400; color: var(--color-ink-2); font-size: var(--step--1); }
  .table th, .table td { padding: 0.85rem 1.25rem; text-align: start; vertical-align: middle; border-block-start: var(--bw) solid var(--color-border); min-block-size: 3.5rem; line-height: 1.4; }
  .table thead th { background: var(--color-surface); font-size: 0.9375rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--color-ink-2); }
  .table tbody th { font-weight: 700; }
  .table .muted { color: var(--color-ink-2); }
  .table tbody tr:hover { background: var(--color-mint-soft); }
  /* Petits écrans : chaque ligne devient une fiche lisible (intitulé, tarif, ≈ €, autres colonnes libellées), sans défilement horizontal */
  @media (max-width: 39.99em) {
    .table-wrap:has(> .table--stack) { overflow-x: visible; }
    .table--stack, .table--stack tbody, .table--stack caption { display: block; }
    .table--stack { min-inline-size: 0; }
    .table--stack thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .table--stack tr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0.9rem; padding: 0.9rem 1.1rem; border-block-start: var(--bw) solid var(--color-border); }
    .table--stack tbody th, .table--stack td { display: block; padding: 0; border: 0; min-block-size: 0; text-align: start; }
    .table--stack tbody th { flex: 1 0 100%; }
    .table--stack td[data-label] { color: var(--color-ink-2); }
    .table--stack td[data-label]::before { content: attr(data-label) "\00a0: "; font-weight: 700; }
    .table--stack td[data-label]:lang(en)::before { content: attr(data-label) ": "; }
    .table--stack td.eur { color: var(--color-ink-2); }
    .table--stack td.eur::before { content: "≈\00a0"; }
  }

  /* ---------- Bilans ---------- */
  .price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.6rem; font-variant-numeric: tabular-nums; }
  .price__main { font-weight: 800; font-size: clamp(1.4rem, 1.2rem + 0.8vw, 1.75rem); color: var(--color-ink); line-height: 1.1; }
  .price__eur { color: var(--color-ink-2); font-weight: 700; }
  .ticks { display: grid; gap: 0.45rem; list-style: none; padding: 0; margin: 0; }
  .ticks li { display: grid; grid-template-columns: 1.4rem 1fr; gap: 0.5rem; line-height: 1.4; }
  .ticks .icon { color: var(--color-teal); margin-block-start: 0.12rem; inline-size: 1.25rem; block-size: 1.25rem; }

  /* ---------- Images ---------- */
  .arch { position: relative; overflow: hidden; border-radius: var(--radius-arch); background: var(--color-mint); aspect-ratio: 4 / 5; }
  .arch img { inline-size: 100%; block-size: 100%; object-fit: cover; }
  .sun-frame { position: relative; isolation: isolate; padding-block-end: 1rem; }
  .sun-frame::before { content: ""; position: absolute; z-index: -1; inset-inline: -9%; inset-block-end: 0; aspect-ratio: 2 / 1; border-radius: 999px 999px 0 0; background: var(--color-mint); }
  .sun-frame::after { content: ""; position: absolute; z-index: -1; inset-inline: -14%; inset-block-end: 0; block-size: 1px; background: linear-gradient(90deg, transparent, var(--color-teal) 14%, var(--color-teal) 86%, transparent); }
  .sun-frame .arch { max-inline-size: 30rem; margin-inline: auto; box-shadow: var(--shadow-2); }
  [data-contrast="high"] .sun-frame::before { background: transparent; border: 2px solid #000; border-block-end: 0; }

  /* ---------- Plan d'accès ---------- */
  .map { border-radius: var(--radius-panel); border: var(--bw) solid var(--color-border); background: #F6FAF9; overflow: hidden; }
  .map svg { inline-size: 100%; block-size: auto; }
  .access-list { display: grid; gap: var(--space-3); list-style: none; padding: 0; margin: 0; }
  .access-list li { display: grid; grid-template-columns: 2.5rem 1fr; gap: 0.75rem; align-items: start; }
  .access-list .icon-badge { inline-size: 2.5rem; block-size: 2.5rem; }
  .access-list .icon { inline-size: 1.25rem; block-size: 1.25rem; }

  /* ---------- Info list (horaires) ---------- */
  .hours { display: grid; gap: 0; margin: 0; max-inline-size: 40rem; font-variant-numeric: tabular-nums; }
  .hours > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 1rem; padding-block: 0.7rem; border-block-end: var(--bw) dashed var(--color-border); }
  .hours dt { font-weight: 700; }
  .hours dd { margin: 0; text-align: end; color: var(--color-ink-2); }
  .hours--night > div { display: grid; gap: 0.1rem; }
  .hours--night dd { text-align: start; }
  .hours--night dt { color: #fff; }
  .hours--night dd { color: var(--color-on-night-2); }
  .hours--night > div { border-color: rgb(180 203 200 / 0.3); }

  /* ---------- Pied de page ---------- */
  .site-footer { background: var(--color-night); color: #fff; padding-block: clamp(3rem, 2rem + 4vw, 5rem) 0; margin-block-start: 0; }
  .site-footer a { color: #fff; text-decoration-color: rgb(127 216 196 / 0.7); }
  .site-footer a:hover { color: var(--color-teal-light); }
  .site-footer :focus-visible { outline-color: var(--color-teal-light); }
  .footer__grid { display: grid; gap: var(--space-7) var(--space-6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
  .footer__title { font-family: var(--font-text); font-size: 0.9375rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-teal-light); margin-block-end: var(--space-4); }
  .footer__brand .logo { color: #fff; }
  .footer__brand .logo__name { color: #fff; }
  .footer__brand .logo__tag { color: var(--color-teal-light); }
  .footer__brand p, .footer__muted { color: var(--color-on-night-2); }
  .footer__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.15rem; }
  .footer__list a { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: 2.75rem; text-decoration: none; }
  .footer__list a:hover { text-decoration: underline; }
  .footer__contact { display: grid; gap: 0.85rem; list-style: none; padding: 0; margin: 0; }
  .footer__contact li { display: grid; gap: 0.1rem; }
  .footer__contact span { color: var(--color-on-night-2); font-size: var(--step--1); }
  .footer__contact a { font-weight: 700; font-variant-numeric: tabular-nums; display: inline-flex; min-block-size: 2.75rem; align-items: center; }
  .footer__urgent { color: #fff !important; background: var(--color-urgent); border-radius: var(--radius-pill); padding: 0.2rem 1rem; text-decoration: none; justify-self: start; }
  .site-footer .status-list .status__name { color: #fff; }
  .site-footer .status--ferme, .site-footer .status--ferme .status__text { color: var(--color-on-night-2); }
  .site-footer .status--ouvert, .site-footer .status--ouvert .status__text { color: #8FE3A9; }
  .site-footer .status--ferme-bientot, .site-footer .status--ferme-bientot .status__text { color: #F5C16C; }
  .footer__bottom { margin-block-start: clamp(2.5rem, 2rem + 2vw, 4rem); padding-block: var(--space-6); border-block-start: 1px solid rgb(180 203 200 / 0.25); display: grid; gap: var(--space-3); color: var(--color-on-night-2); font-size: var(--step--1); }
  .footer__bottom p { max-inline-size: none; }
  .footer__legal { display: flex; flex-wrap: wrap; gap: 0 1.25rem; list-style: none; padding: 0; margin: 0; }
  .footer__legal a { display: inline-flex; min-block-size: 2.75rem; align-items: center; }

  [data-contrast="high"] .site-footer { background: #000; }

  /* ---------- Barre d'actions mobile ---------- */
  .mobile-bar { position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 25; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.4rem; block-size: calc(var(--bar-h) + env(safe-area-inset-bottom)); padding: 0.4rem 0.5rem calc(0.4rem + env(safe-area-inset-bottom)); background: #fff; border-block-start: var(--bw) solid var(--color-border); box-shadow: 0 -6px 20px rgb(16 37 44 / 0.08); }
  .mobile-bar a { display: flex; align-items: center; justify-content: center; gap: 0.35rem; min-block-size: 3rem; border-radius: 12px; font-weight: 700; font-size: 0.9375rem; text-decoration: none; color: var(--color-teal-deep); background: var(--color-mint-soft); line-height: 1.1; text-align: center; }
  .mobile-bar a .icon { inline-size: 1.25rem; block-size: 1.25rem; }
  .mobile-bar .mobile-bar__primary { background: var(--color-teal-deep); color: #fff; }
  .mobile-bar .mobile-bar__urgent { background: var(--color-urgent); color: #fff; }
  body.kb-open .mobile-bar { display: none; }
  :root[data-taille="1.3"] .mobile-bar, :root[data-taille="1.5"] .mobile-bar { block-size: auto; }
  :root[data-taille="1.3"] .mobile-bar a, :root[data-taille="1.5"] .mobile-bar a { flex-direction: column; gap: 0.1rem; font-size: 0.75rem; letter-spacing: 0; word-spacing: 0; padding-block: 0.3rem; }
  :root[data-taille="1.3"] .mobile-bar a { font-size: 0.7rem; overflow-wrap: normal; }
  :root[data-taille="1.5"] .mobile-bar a { font-size: 0.62rem; overflow-wrap: normal; }
  @media (min-width: 48em) { .mobile-bar { display: none; } }
  @media (max-width: 47.99em) { body.has-mobile-bar .msd-badge { inset-block-end: calc(64px + 12px); } }
  [data-contrast="high"] .mobile-bar a { border: 2px solid #000; }

  /* ---------- Article (conseils) ---------- */
  .prose { font-size: var(--step-0); }
  .prose > * + * { margin-block-start: 1em; }
  .prose h3 { margin-block-start: 1.6em; }
  .prose ul, .prose ol { padding-inline-start: 1.25rem; }
  .prose li + li { margin-block-start: 0.4em; }
  .prose li::marker { color: var(--color-teal); }

  /* ---------- Divers ---------- */
  .pill { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.3rem 0.85rem; border-radius: var(--radius-pill); background: var(--color-mint); color: var(--color-teal-deep); font-weight: 700; font-size: 0.9375rem; line-height: 1.3; }
  .pill--ok { background: #E3F3E8; color: var(--color-ok); }
  .muted { color: var(--color-ink-2); }
  .small { font-size: var(--step--1); }
  .center { text-align: center; }
  .numbers-line { font-variant-numeric: tabular-nums; }

  /* ---------- Compléments ---------- */
  .h-md { font-size: clamp(1.4rem, 1.25rem + 0.7vw, 1.75rem); }
  code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 0.9em; background: var(--color-surface); padding: 0.05em 0.35em; border-radius: 4px; overflow-wrap: anywhere; }
}

/* =========================================================== UTILITAIRES */
@layer utilities {
  .visually-hidden { position: absolute !important; inline-size: 1px !important; block-size: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; margin: -1px !important; padding: 0 !important; border: 0 !important; }
    .mt-4 { margin-block-start: var(--space-4) !important; }
  .mt-8 { margin-block-start: var(--space-8) !important; }
    html:not(.js) .js-only { display: none; }
  
  /* Apparition au défilement : seulement avec JS et si le mouvement est accepté */
  @media (prefers-reduced-motion: no-preference) {
    :root:not([data-motion="reduce"]) .reveal { opacity: 0; transform: translateY(12px); transition: opacity var(--dur-3) var(--ease), transform var(--dur-3) var(--ease); transition-delay: calc(var(--i, 0) * 50ms); }
    :root:not([data-motion="reduce"]) .reveal.is-visible { opacity: 1; transform: none; }
    ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 250ms; }
  }
  @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  }
  [data-motion="reduce"] *, [data-motion="reduce"] *::before, [data-motion="reduce"] *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }

  /* Mode Contraste élevé de Windows */
  @media (forced-colors: active) {
    .choice-card:has(input:checked), .radio:has(input:checked), .size-option:has(input:checked), .day:has(input:checked), .time:has(input:checked) { border: 4px solid Highlight; }
    .status__dot { forced-color-adjust: none; border-color: CanvasText; }
        .btn { border: 2px solid ButtonText; }
    .mono, .icon-badge, .step-item::before, .timeline > li::before { border: 2px solid CanvasText; }
  }
}

/* =========================================================== PAGES */
@layer pages {
  /* ---------- Accueil : héros ---------- */

  /* Bande « ouvert maintenant » */

  /* Rendez-vous mémorisé */

  /* Bande Parents au pays */
  .diaspora { display: grid; gap: clamp(2rem, 1rem + 4vw, 4.5rem); align-items: center; }
  @media (min-width: 64em) { .diaspora { grid-template-columns: 0.8fr 1.2fr; } }
  .diaspora .arch { max-inline-size: 24rem; margin-inline: auto; box-shadow: var(--shadow-2); }

  /* Tarifs clés */

  /* Spécialités (page) */

  /* Annuaire : filtres (barre au-dessus des résultats, jamais de panneau collant à défilement interne) */

  /* ---------- Prise de rendez-vous ---------- */
  html:not(.js) .step__actions [data-js="suivant"], html:not(.js) .step__actions [data-js="precedent"] { display: none; }
  .day { position: relative; display: grid; justify-items: center; gap: 0.1rem; padding: 0.6rem 0.25rem; min-block-size: 5.5rem; border: 2px solid var(--color-border-ui); border-radius: var(--radius-card); background: #fff; cursor: pointer; text-align: center; line-height: 1.2; transition: border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease); }
  .day input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
  .day:hover:not(:has(input:disabled)) { border-color: var(--color-teal-deep); }
  .day:has(input:checked) { border-color: var(--color-teal-deep); background: var(--color-teal-deep); color: #fff; }
  .day:has(input:focus-visible) { outline: 3px solid var(--color-focus); outline-offset: 2px; }
  .day:has(input:disabled) { cursor: not-allowed; background: var(--color-disabled-bg); border-color: var(--color-border); color: var(--color-disabled); }
  .day:has(input:disabled) input { cursor: not-allowed; }
  .confirmation__check { display: grid; place-items: center; inline-size: 4rem; block-size: 4rem; border-radius: 50%; background: var(--color-teal-deep); color: #fff; }

  /* ---------- Urgences ---------- */
  [data-contrast="high"] .page-head::after, [data-contrast="high"] .ethic::after, [data-contrast="high"] .confirmation::before, [data-contrast="high"] .sun-frame::after { display: none; }
  [data-contrast="high"] .page-head, [data-contrast="high"] .hero { background: #fff; }
  .big-call { display: inline-flex; align-items: center; gap: 0.85rem; min-block-size: 4.5rem; padding: 0.75rem 1.75rem; border-radius: var(--radius-pill); background: var(--color-urgent); color: #fff; font-weight: 800; font-size: clamp(1.2rem, 1.05rem + 0.8vw, 1.6rem); text-decoration: none; box-shadow: 0 12px 28px rgb(179 38 30 / 0.28); line-height: 1.2; }
  .big-call:hover { background: var(--color-urgent-deep); }
  .big-call .icon { inline-size: 1.75rem; block-size: 1.75rem; }

  /* ---------- Articles ---------- */
  .article { padding-block: clamp(2.5rem, 2rem + 3vw, 4.5rem); border-block-start: var(--bw) solid var(--color-border); }

  /* ---------- 404 ---------- */
  .notfound { display: grid; gap: var(--space-5); justify-items: start; }
  .notfound__code { font-family: var(--font-display); font-weight: 600; font-size: clamp(4rem, 3rem + 6vw, 8rem); line-height: 1; color: var(--color-teal); }
  .notfound .horizon { justify-self: stretch; max-inline-size: 40rem; }

}

/* =========================================================== PILES */
/* Espacement vertical des piles : dans la dernière couche, pour l'emporter sur les marges remises à zéro
   des composants, quelle que soit la feuille (socle ou feuille de page) qui les déclare. */
@layer piles {
  .stack > * + * { margin-block-start: var(--stack, var(--space-4)); }
  .stack-lg > * + * { margin-block-start: var(--space-6); }
}

/* =========================================================== IMPRESSION */
@media print {
  .strip, .site-header, .site-footer, .mobile-bar, .skip-link, .display-panel, .rdv-aside, .stepper, .stepper-mobile, .step__actions, .btn, .link-btn, .search, .filters, .breadcrumb, .msd-badge, .no-print { display: none !important; }
  body { font-size: 11pt; color: #000; background: #fff; }
  .section, .page-head { padding-block: 1rem; background: none !important; }
  .page-head::after, .sun-frame::before, .confirmation::before { display: none; }
  .card, .step, .confirmation, .table-wrap, .bilan-card, .doctor { box-shadow: none !important; break-inside: avoid; }
  a { color: #000; }
  .print-only-tables > *:not(.print-keep) { display: none !important; }
  img { max-block-size: 8cm; }
}