/* Téléphone seulement (moins de 768 px) : corrections de ce qui s'affichait mal sur le site d'origine.
   Sur ordinateur et tablette, rien ne change. */
@media (max-width: 767px) {
  /* Accueil : l'illustration centrale était minuscule au milieu d'un grand vide blanc */
  .home .et_pb_section.et_pb_section_1.et_pb_with_background { background-size: 92% auto !important; height: calc(66vw + 24px) !important; top: 0 !important; padding: 0 !important; }
  .home .et_pb_section.et_pb_section_2.et_section_specialty { margin-top: 0 !important; }

  /* Pages intérieures : la grande photo du haut, remontée de 172 px, laissait 172 px de blanc dessous et son titre touchait le bouton « Réserver » */
  body:not(.home):not(.page-id-3) .et_pb_section.et_pb_section_1.et_pb_with_background { margin-bottom: -172px !important; padding-top: 80px !important; }

  /* Texte blanc posé sur les photos du haut : une ombre légère pour le lire */
  body:not(.home):not(.page-id-3) .et_pb_section_1 .et_pb_text_inner { text-shadow: 0 1px 6px rgba(0, 0, 0, .55); }

  /* Réservation : l'onglet « Pour réserver un massage à l'institut » sortait de l'écran à gauche */
  .page-id-21 .et_pb_text_8 { transform: translateY(37px) !important; }

  /* Texte justifié : de grands trous entre les mots sur une colonne étroite */
  #main-content .et_pb_module.et_pb_text_align_justified, #main-content .et_pb_module.et_pb_text_align_justified-tablet, #main-content .et_pb_module.et_pb_text_align_justified-phone { text-align: left !important; }

  /* Photos : pleine largeur au lieu de petites vignettes décalées */
  #main-content .et_pb_image { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; text-align: center; }
  #main-content .et_pb_image .et_pb_image_wrap, #main-content .et_pb_image img { width: 100% !important; }

  /* Menu du téléphone : fond opaque (le texte se mêlait à l'image dessous) et plus large */
  .et_pb_menu .et_mobile_menu { background-color: rgb(165, 150, 143) !important; width: min(340px, calc(100vw - 40px)) !important; }

  /* Lien discret du bas : assez grand pour le doigt */
  .mh-legal { font-size: 13px !important; padding-bottom: 14px !important; }
  .mh-legal a { display: inline-block; padding: 6px 4px; }
}
