/* ========================================================== Calendrier de réservation des ateliers — Entre Deux Utilise les variables de couleur déjà définies par chaque page. ========================================================== */ /* 72 px de retrait faisaient de ce bloc l'exception du site : additionnés aux 42 px de la section voisine, ils creusaient près de 150 px de vide de part et d'autre du calendrier. Même respiration que les autres sections désormais. */ .resa-section { padding: 42px 0; background: var(--cream); } .resa { max-width: 1080px; margin: 0 auto; padding: 0 24px; } .resa__head { text-align: center; margin-bottom: 34px; } /* Sur les pages d'atelier, l'en-tete est suivi du seul #resaCalendrier, qui n'est qu'un point d'ancrage : le script y ecrit la fenetre du calendrier puis la deplace sur . Ses 34 px ne separaient donc plus rien et s'ajoutaient au retrait de la section, soit 54 px de blanc pour finir la page au telephone. Sur /ateliers, un bouton suit l'en-tete : la marge y garde tout son sens. */ .resa__head:has(+ #resaCalendrier) { margin-bottom: 0; } /* Pages atelier : plus d'en-tête ni de bouton — seulement l'ancre #calendrier. Le gabarit part sur : sans ça, 40–60 px de crème vide avant le footer. */ .resa-section:has(> .resa > #resaCalendrier:only-child) { padding: 0; min-height: 0; } .resa-section:has(> .resa > #resaCalendrier:only-child) > .resa { padding: 0; max-width: none; } .resa-section:has(> .resa > #resaCalendrier:only-child) #resaCalendrier { height: 0; overflow: hidden; margin: 0; padding: 0; } /* 2–3 prochaines dates libres en clair (hors popup calendrier). */ .resa-rapides { max-width: 720px; margin: 0 auto 28px; padding: 0 24px; } .resa-rapides__list { list-style: none; display: grid; gap: 12px; margin: 0; padding: 0; } .resa-rapides__item { display: grid; grid-template-columns: auto 1fr auto; gap: 10px 20px; align-items: center; padding: 16px 18px; background: var(--white, #fff); border: 1px solid rgba(90, 62, 62, 0.08); border-radius: var(--radius, 14px); } .resa-rapides__quand { display: flex; flex-direction: column; gap: 2px; min-width: 8.5em; } /* En français le mois reste en minuscules : « Dim. 16 août », pas « 16 Août ». D'où ::first-letter plutôt que capitalize, qui frappe chaque mot. */ .resa-rapides__quand b { font-family: var(--serif); font-size: 1.05rem; font-weight: 500; color: var(--brown); } .resa-rapides__quand b::first-letter { text-transform: uppercase; } .resa-rapides__quand span { font-size: .84rem; color: var(--sage-dark, #6b7f5e); font-weight: 600; } /* Ce qu'on obtient d'abord, ce qu'on paie ensuite. */ .resa-rapides__nom { margin: 0 0 2px; font-size: .92rem; font-weight: 600; line-height: 1.35; color: var(--brown); } .resa-rapides__meta { margin: 0; font-size: .88rem; line-height: 1.45; color: var(--brown); } /* Dit une fois au-dessus des dates : l'autre atelier existe aux mêmes créneaux, sans disputer la lecture à la date elle-même. */ .resa-rapides__note { margin: 0 0 12px; font-size: .85rem; line-height: 1.5; color: var(--brown-soft, #7a6a60); } /* Les capitales d'origine hurlaient sur trois lignes identiques. Casse normale, et seule la date la plus proche garde le bouton plein. Sélecteur doublé : les pages déclarent `.btn` dans un