/* ==========================================================
   Pages complémentaires : ateliers, mariages, abonnements,
   la fleuriste, contact, infos pratiques, pages légales
   ========================================================== */

/* ---------- Coordonnées ---------- */
.coordonnees { list-style: none; padding: 0; margin: var(--e-2) 0 0; display: grid; gap: .5rem; }
.coordonnees li { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--e-2); overflow-wrap: anywhere; }
.coordonnees__type { font-weight: 700; }
.coordonnees a { font-weight: 600; }
.coordonnees__vide { font-weight: 600; }
@media (max-width: 30rem) { .coordonnees li { grid-template-columns: 1fr; gap: 0; } }

/* ---------- Ateliers ---------- */
.ateliers-liste { display: grid; gap: var(--e-6); }
.atelier { border-top: 3px solid var(--vert); padding-top: var(--e-3); }
.atelier__entete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--e-2) var(--e-4); }
.atelier__nom { font-size: var(--d-s); color: var(--vert); text-transform: uppercase; }
.atelier__prix { font-family: var(--font-serif); font-size: var(--t-4); line-height: 1; }
.atelier__prix span { font-family: var(--font-texte); font-size: var(--t-1); }
.atelier__description { margin-top: var(--e-2); max-width: var(--lecture); }
.atelier__description p + p { margin-top: var(--e-1); }
.atelier__sous-titre { font-size: var(--t-3); color: var(--vert); margin: var(--e-4) 0 var(--e-2); }
.atelier__vide { margin-top: var(--e-3); font-weight: 600; }
.seances-page { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--e-1); grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
.seance-page {
  display: grid; grid-template-columns: 4.25rem minmax(0, 1fr); gap: .25rem var(--e-2); align-items: center;
  padding: var(--e-2); background: #fff; border: var(--trait) solid var(--encre);
}
.seance-page > :last-child { grid-column: 2; }
.seance-page__date { grid-row: 1 / span 2; font-family: var(--font-serif); font-size: var(--t-0); line-height: 1; text-align: center; color: var(--vert); }
.seance-page__date span { display: block; font-size: var(--t-5); }
.seance-page__infos { font-weight: 600; }
.seance-page--complet { border-style: dashed; background: transparent; }
.page-ateliers .encart, .page-mariages .encart { margin-top: var(--e-6); max-width: 46rem; }
.abonnements__souscrire { margin-top: var(--e-6); }
.offre__action { margin-top: var(--e-2); }

/* ---------- Mariages : collage + texte ---------- */
.evenement {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: var(--e-5) var(--e-6); align-items: center;
}
.evenement__collage { position: relative; min-height: 30rem; }
.evenement__tirage { position: absolute; padding: clamp(.5rem, 1.2vw, .8rem); }
.evenement__tirage img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.evenement__tirage--a { left: 0; top: 0; width: 62%; background: var(--rose); rotate: -3deg; }
.evenement__tirage--b { right: 0; bottom: 0; width: 50%; background: var(--anis); rotate: 3.5deg; z-index: 1; }
.evenement__fleur { --taille: clamp(3.5rem, 7vw, 5.5rem); position: absolute; z-index: 2; left: 52%; top: 6%; rotate: 10deg; }
@media (max-width: 56rem) {
  .evenement { grid-template-columns: 1fr; }
  .evenement__collage { min-height: 0; aspect-ratio: 1 / 1.05; max-width: 30rem; }
}

/* ---------- Abonnements ---------- */
.offres { display: grid; gap: var(--e-5) var(--e-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.offre { border-top: 3px solid var(--vert); padding-top: var(--e-2); display: grid; gap: var(--e-1); align-content: start; }
.offre__tirage { background: var(--rose); padding: .6rem; margin-bottom: var(--e-1); }
.offre:nth-child(3n+2) .offre__tirage { background: var(--anis); }
.offre:nth-child(3n) .offre__tirage { background: var(--capucine); }
.offre__tirage img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.offre__nom { font-size: var(--d-s); color: var(--vert); text-transform: uppercase; }
.offre__prix { font-family: var(--font-serif); font-size: var(--t-4); line-height: 1.1; }
.offre__prix span { font-family: var(--font-texte); font-size: var(--t-1); }
.offre__description p + p { margin-top: var(--e-1); }

/* ---------- La fleuriste : histoire en tirages ---------- */
.histoire {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: var(--e-5) var(--e-6); align-items: center;
}
.histoire--inverse { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.histoire__tirage { position: relative; padding: clamp(.5rem, 1.2vw, .9rem); max-width: 28rem; }
.histoire__tirage img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.histoire__tirage--portrait { background: var(--rose); rotate: -2.5deg; }
.histoire__tirage--portrait img { object-position: 35% 50%; }
.histoire__tirage--vitrine { background: var(--papier); rotate: 3deg; justify-self: end; }
.histoire__tirage--interieur { background: var(--anis); rotate: -2deg; }
.histoire__fleur { --taille: clamp(3.5rem, 7vw, 5.5rem); position: absolute; left: -1.5rem; bottom: -1.5rem; rotate: -12deg; }
.fond-rose .texte-long h2 { color: var(--vert-profond); }
@media (max-width: 56rem) {
  .histoire, .histoire--inverse { grid-template-columns: 1fr; }
  .histoire--inverse .histoire__tirage { order: -1; justify-self: start; }
  .histoire__tirage { width: min(85%, 26rem); }
}

/* ---------- Infos pratiques ---------- */
.fermetures { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; }
.fermetures li { font-weight: 600; }
.fermetures li::first-letter { text-transform: uppercase; }
.page-infos .encart { margin-bottom: var(--e-5); }

/* ---------- Pages légales ---------- */
.texte-long ul li { overflow-wrap: anywhere; }
.corps-page .encart--bientot + .texte-long { margin-top: var(--e-5); }

/* ---------- Formulaires transactionnels (réservation, devis, abonnement pro) ---------- */
.reservation {
  margin-top: var(--e-6);
  max-width: 50rem;
  border-top: 3px solid var(--vert);
  padding-top: var(--e-3);
}
.reservation .bloc__titre { font-size: var(--d-s); font-family: var(--font-display); font-weight: 800; font-stretch: 75%; text-transform: uppercase; line-height: .9; }
.reservation__intro { font-size: var(--t-2); margin: var(--e-2) 0 var(--e-4); }
.reservation .formulaire { margin-top: var(--e-3); }
.atelier__nom a { text-decoration: none; }
.atelier__nom a:hover { text-decoration: underline wavy 2px; text-underline-offset: .12em; }
.seance-page__action { grid-column: 2; }
.champ input[type="file"] {
  width: 100%; padding: .75rem; background: #fff;
  border: var(--trait) dashed var(--encre); font-size: var(--t-0);
}
.champ input[type="file"]::file-selector-button {
  margin-right: .75rem; padding: .5rem .9rem;
  border: var(--trait) solid var(--vert-profond); background: var(--rose); color: var(--vert-profond);
  font: inherit; font-weight: 700; cursor: pointer;
}
