/* ---------------------------------------------------------------------------
   Rythme vertical partagé — L'Abri, Cézanne, L'Italien
   ---------------------------------------------------------------------------
   Chaque maquette avait hérité de son propre espacement, et les sections que
   nous avons ajoutées après coup (feed Instagram, note Google) d'un troisième :

       L'Abri     128 px  → 256 px entre deux sections
       L'Italien   96 px  (mais 64 px pour la livraison)
       Cézanne     64 px
       ajouts      88 px  sur les trois sites

   D'où le « certaines rubriques sont trop espacées ». Un seul fichier fixe
   désormais la règle pour les trois sites : une valeur unique, moyenne, qui
   s'adapte à la largeur d'écran.

   Les héros ne sont jamais visés. Leur hauteur repose sur leur propre mise en
   page (min-h-screen, h-[110vh], min-h-[90vh]) et y toucher les casse — c'est
   déjà arrivé une fois. Ils ne portent ni les classes ni les identifiants
   ci-dessous, donc aucun sélecteur ne peut les atteindre par accident.

   Charger ce fichier APRÈS la feuille de style de l'application.
--------------------------------------------------------------------------- */

:root {
  /* ~44 px sur mobile, ~72 px sur grand écran : deux sections voisines
     respirent sur 88 à 144 px au lieu de 256. */
  --section-rhythm: clamp(2.75rem, 5.5vw, 4.5rem);

  /* Les séparateurs décoratifs en tête de section ajoutaient jusqu'à 128 px
     par-dessus le padding. Ramenés à une valeur proportionnée. */
  --divider-rhythm: clamp(1.25rem, 3vw, 2.25rem);
}

/* Sections de contenu — ciblage explicite, jamais générique.
   L'Abri et L'Italien exposent une classe ; Cézanne n'en a pas, ses sections
   sont donc nommées une à une. */
#root section.section-spacing,
#root section.section-padding,
#root section#livraison,
#root section#villa,
#root section#terrasse,
#root section#cafe,
#root section#table,
#root section#menu,
#root section#galerie,
#root section#informations,
/* Sections écrites hors de #root, que React ne gère pas. */
section.ig-feed,
section.gg-note {
  padding-top: var(--section-rhythm) !important;
  padding-bottom: var(--section-rhythm) !important;
}

/* Séparateurs de Cézanne : leur marge basse s'empilait sur le padding. */
#root .mood-divider {
  margin-bottom: var(--divider-rhythm) !important;
}

/* Le filet décoratif de L'Abri, même logique. */
#root .line-accent {
  margin-top: var(--divider-rhythm) !important;
}