/* Orthodontie adultes — styles de page.
   Construit section par section depuis layout-plan + type-map + photo-css.
   Rythme inter-sections = 160px (identique aux autres pages).
   Images : hero / céramique / galerie réutilisent des fichiers déjà extraits
   (imageRefs identiques à enfants) ; intro, métallique, gouttières, invisible-2
   et linguale n'ont PAS d'image extraite → placeholder navy (à remplacer). */

/* ── HERO (frame-427321453, 1440×543) ───────────────────────────────────────
   Photo (imageRef 51becef9 = même image que la carte céramique), STRETCH
   d=0.5367 → bg 1400×933.45, posY -89.53. PAS de miroir (a=1). Titre Nunito 200
   80/88 blanc bas-gauche, CTA rdv bas-droite. */
.adu-hero {
  padding: 66px 20px 0;
}
.adu-hero__media {
  position: relative;
  height: 501px;
  overflow: hidden;
  background-color: var(--c-blue);
}
.adu-hero__media::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('../img/enf-classiques-ceramique.webp') no-repeat;
  background-size: 1400px 933.45px;
  background-position: 0 -89.53px;
}
.adu-hero__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 192px;
  height: 100%;
  padding: 200px 80px 80px;
}
.adu-hero__title {
  margin: 0;
  max-width: 937px;
  font-family: var(--font-heading);
  font-weight: 200;
  font-size: 80px;
  line-height: 88px;
  color: var(--neutral-0);
}

/* ── Texte courant (Inter 300 16/24, gras = <strong> 700) ───────────────────── */
.adu-intro__body p,
.adu-retrouvez__body p,
.adu-card__body p,
.adu-numbered__body p,
.adu-linguale__body p {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 16px;
  line-height: 24px;
  color: var(--neutral-900);
}
.adu-intro__body p + p,
.adu-card__body p + p { margin-top: 24px; }
.adu-intro__body strong,
.adu-retrouvez__body strong,
.adu-card__body strong,
.adu-linguale__body strong { font-weight: 700; }

/* Titres de section H2 (Nunito 300 40/48) ─────────────────────────────────── */
.adu-sec__title,
.adu-intro__title,
.adu-retrouvez__title,
.adu-duree__title,
.adu-cas__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 300;
  font-size: 40px;
  line-height: 48px;
  color: var(--neutral-900);
}

/* ── INTRO (frame-427321437, 1440×304) — texte 715 + image 485×304 r16 ─────── */
.adu-intro {
  display: flex;
  align-items: flex-start;
  gap: 80px;
  padding: 0 80px;
}
.adu-intro__text {
  flex: 0 0 715px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.adu-intro__media {
  flex: 0 0 485px;
  height: 304px;
  border-radius: 16px;
  background: var(--c-blue) url('../img/adu-intro.webp') center / cover no-repeat;
}

/* ── RETROUVEZ UN BEAU SOURIRE (orthodontie-pour-tous, 1440×408) ─────────────
   Carte navy (gauche, texte blanc) + liste de 4 atouts (droite, texte foncé). */
.adu-retrouvez {
  display: flex;
  align-items: stretch;
  gap: 80px;
  padding: 0 80px;
}
.adu-retrouvez__card {
  box-sizing: border-box;
  flex: 0 0 575px;
  padding: 48px;
  border-radius: 20px;
  background: var(--c-blue);
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.adu-retrouvez__card .adu-retrouvez__title { color: var(--neutral-0); }
.adu-retrouvez__body p { color: var(--neutral-0); }
.adu-retrouvez__features {
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
}
.adu-feature {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.adu-feature__ic {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  color: var(--c-light-blue);
}
.adu-feature__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: var(--neutral-900);
}

/* ── GALERIE (orthodontie-pour-tous, 1440×222) — 3 photos gap32 r16 ─────────── */
.adu-gallery {
  padding: 0 80px;
}
.adu-gallery__row {
  display: flex;
  gap: 32px;
}
.adu-gal {
  height: 222px;
  border-radius: 16px;
  background-color: var(--c-blue);
  background-repeat: no-repeat;
}
.adu-gal--w372 { flex: 0 0 372px; }
.adu-gal--w491 { flex: 0 0 491px; }
.adu-gal--w353 { flex: 0 0 353px; }

/* ── QUELLE DURÉE (traitements, 1440×320) — texte+CTA (469) | 2 cartes num. ─── */
.adu-duree {
  display: flex;
  align-items: flex-start;
  gap: 80px;
  padding: 0 80px;
}
.adu-duree__left {
  flex: 0 0 469px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 48px;
}
.adu-duree__cards {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.adu-numbered {
  display: flex;
  gap: 28px;
}
.adu-numbered__badge {
  flex: 0 0 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--c-blue);
  color: var(--neutral-0);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  font-weight: 300;
  font-size: 24px;
  line-height: 36px;
}
.adu-numbered__content {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.adu-numbered__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: var(--neutral-900);
}

/* ── Titres de carte H3 (Nunito 300 28/36) ─────────────────────────────────── */
.adu-card__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 300;
  font-size: 28px;
  line-height: 36px;
  color: var(--neutral-900);
}
.adu-card__title--light { color: var(--neutral-0); }
.adu-card__body--light p { color: var(--neutral-0); }

/* ── RANGÉES (classiques + invisibles) ─────────────────────────────────────── */
.adu-classic,
.adu-invisible {
  padding: 0 80px;
}
.adu-row {
  display: flex;
  align-items: stretch;
  gap: 80px;
  margin-top: 80px;
}
.adu-row--gap48 { margin-top: 48px; }
.adu-row--gap128 { margin-top: 128px; }
.adu-row__img {
  border-radius: 16px;
  background-color: var(--c-blue);
  background-repeat: no-repeat;
}

/* Carte (light / navy), r12 pad32 ─────────────────────────────────────────── */
.adu-card {
  box-sizing: border-box;
  padding: 32px;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.adu-card--pad20 { padding: 20px; }
.adu-card--light { background: var(--c-biege); }
.adu-card--navy { background: var(--c-blue); }
.adu-card--824 { flex: 0 0 824px; }
.adu-card--570 { flex: 0 0 570px; }
.adu-card--548 { flex: 0 0 548px; }

/* Images des rangées (placeholder navy sauf céramique) ─────────────────────── */
.adu-img--cera  { flex: 0 0 364px; height: 276px;
  background: url('../img/enf-classiques-ceramique.webp') center / cover no-repeat; }
.adu-img--metal { flex: 0 0 618px; height: 300px;
  background-image: url('../img/adu-metal.webp'); background-size: cover; background-position: center; }
.adu-img--gout  { flex: 0 0 640px; height: 324px;
  background-image: url('../img/adu-gout.webp'); background-size: cover; background-position: center; }
.adu-img--inv2  { flex: 0 0 548px; height: 312px;
  background-image: url('../img/adu-inv2.webp'); background-size: cover; background-position: center; }
.adu-img--ling  { flex: 0 0 509px; height: 300px;     /* STRETCH photo-css : 576.96×384.69, pos -51.4/-65 */
  background-image: url('../img/adu-ling.webp'); background-size: 576.96px 384.69px; background-position: -51.4px -65px; }

/* Galerie : recadrages (mêmes images que enfants) ──────────────────────────── */
.adu-img--gal1 { background-image: url('../img/enf-gal-1.webp'); background-size: cover; background-position: center; }
.adu-img--gal2 { background-image: url('../img/enf-gal-2.webp'); background-size: cover; background-position: center; }
.adu-img--gal3 {
  background-image: url('../img/enf-gal-3.webp');
  background-size: 409px 613.5px;
  background-position: 0 -211.48px;
}

/* Invisibles — rangée 2 : image + colonne texte+CTA centrée ────────────────── */
.adu-invisible__col {
  flex: 0 0 640px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 32px;
}
.adu-invisible__cta { align-self: flex-start; }

/* Linguale — rangée 3 : carte navy (595) + image 509 ───────────────────────── */
.adu-linguale__card {
  box-sizing: border-box;
  flex: 0 0 691px;
  padding: 48px;
  border-radius: 20px;
  background: var(--c-blue);
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.adu-linguale__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 300;
  font-size: 28px;
  line-height: 36px;
  color: var(--neutral-0);
}
.adu-linguale__body p { color: var(--neutral-0); }

/* ── Rythme inter-sections (160px) ─────────────────────────────────────────── */
main > section + section { margin-top: 160px; }
main + .site-footer { margin-top: 160px; }

/* ═════════════════════════════════════════════════════════════════════════
   RESPONSIVE Orthodontie adultes — base flex, empilement colonne sur mobile.
   ═════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  main > section + section { margin-top: 80px; }
  main + .site-footer { margin-top: 80px; }

  /* HERO */
  .adu-hero { padding: 66px 12px 0; }
  .adu-hero__media { height: auto; min-height: 420px; border-radius: 20px; }
  .adu-hero__inner { flex-direction: column; align-items: flex-start; gap: 24px; padding: 120px 24px 32px; }
  .adu-hero__title { max-width: 100%; font-size: 40px; line-height: 46px; }

  /* Titres réduits */
  .adu-sec__title, .adu-intro__title, .adu-retrouvez__title,
  .adu-duree__title, .adu-cas__title { font-size: 32px; line-height: 38px; }

  /* INTRO */
  .adu-intro { flex-direction: column; gap: 24px; padding: 0 24px; }
  .adu-intro__text { flex: 1 1 auto; gap: 24px; }
  .adu-intro__media { flex: 0 0 auto; width: 100%; height: 240px; }

  /* RETROUVEZ UN BEAU SOURIRE */
  .adu-retrouvez { flex-direction: column; gap: 24px; padding: 0 24px; }
  .adu-retrouvez__card { flex: 0 0 auto; padding: 32px 24px; gap: 32px; }
  .adu-retrouvez__features { flex: 1 1 auto; }

  /* GALERIE */
  .adu-gallery { padding: 0 24px; }
  .adu-gallery__row { flex-direction: column; gap: 16px; }
  .adu-gal { flex: 0 0 auto !important; width: 100%; height: 200px; }

  /* QUELLE DURÉE */
  .adu-duree { flex-direction: column; gap: 32px; padding: 0 24px; }
  .adu-duree__left, .adu-duree__cards { flex: 1 1 auto; }

  /* RANGÉES classiques + invisibles + linguale : carte d'abord, image ensuite */
  .adu-classic, .adu-invisible { padding: 0 24px; }
  .adu-row, .adu-row--gap48, .adu-row--gap128 { flex-direction: column; gap: 24px; margin-top: 24px; }
  .adu-card, .adu-invisible__col, .adu-linguale__card { order: 1; flex: 0 0 auto !important; width: 100%; padding: 24px; }
  .adu-linguale__card { padding: 32px 24px; }
  .adu-card__title { font-size: 24px; line-height: 32px; }
  .adu-invisible__col { gap: 24px; }
  .adu-row__img { order: 2; flex: 0 0 auto !important; width: 100%; height: 240px !important; background-size: cover !important; background-position: center !important; }
}

@media (max-width: 560px) {
  .adu-hero__title { font-size: 32px; line-height: 38px; }
  .adu-sec__title, .adu-intro__title, .adu-retrouvez__title,
  .adu-duree__title, .adu-cas__title { font-size: 28px; line-height: 34px; }
}