/* ==========================================================
   Page d'accueil
   ========================================================== */

/* ---------- Affiche ---------- */
.affiche-accueil {
  padding-block: var(--e-4) var(--e-7);
}
.affiche-accueil__grille {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--e-3);
  row-gap: var(--e-4);
  align-items: start;
}
.affiche-accueil__titre {
  grid-column: 1 / span 9;
  grid-row: 1;
  position: relative; z-index: 2;
  font-size: var(--d-xl);
  line-height: .84;
  text-transform: uppercase;
  color: var(--rose);
  text-shadow: .045em .05em 0 var(--cerise);
  padding-top: var(--e-4);
}
.affiche-accueil__titre span { display: block; }
.affiche-accueil__titre span:nth-child(2) { padding-left: .55em; }
.affiche-accueil__titre span:nth-child(3) { padding-left: .12em; }

/* Tirage photo épinglé sur la vitrine */
.affiche-accueil__tirage {
  grid-column: 8 / -1;
  grid-row: 1 / span 2;
  position: relative;
  margin-top: var(--e-5);
  background: var(--papier);
  padding: clamp(.5rem, 1.2vw, .9rem);
  rotate: 3deg;
}
.affiche-accueil__tirage img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: 40% 50%;
}
.affiche-accueil__fleur-a {
  --taille: clamp(5rem, 10vw, 9rem);
  position: absolute; left: -12%; bottom: -8%;
  rotate: -14deg;
}
.affiche-accueil__fleur-b {
  --taille: clamp(3rem, 5vw, 4.5rem);
  position: absolute; right: -5%; top: -6%;
}
.affiche-accueil__fleur-c {
  --taille: clamp(2.5rem, 4vw, 3.5rem);
  position: absolute; left: 47%; top: 1rem;
  rotate: 20deg;
}

.affiche-accueil__texte {
  grid-column: 1 / span 6;
  grid-row: 2;
}
.affiche-accueil__texte .chapeau { max-width: 32rem; }
.affiche-accueil__actions {
  display: flex; flex-wrap: wrap; gap: var(--e-2) var(--e-3);
  margin-top: var(--e-4);
}

@media (max-width: 56rem) {
  .affiche-accueil__grille { grid-template-columns: 1fr; }
  .affiche-accueil__titre { grid-column: 1; padding-top: var(--e-2); font-size: clamp(3.5rem, 15.5vw, 8rem); }
  .affiche-accueil__tirage {
    grid-column: 1; grid-row: 2;
    width: min(82%, 26rem); margin: 0 0 0 auto;
  }
  .affiche-accueil__tirage img { aspect-ratio: 5 / 4; }
  .affiche-accueil__texte { grid-column: 1; grid-row: 3; }
  .affiche-accueil__fleur-c { left: auto; right: 0; top: 0; }
}

/* ---------- En-têtes de section ---------- */
.entete-section {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: var(--e-3) var(--e-5);
  align-items: end;
  margin-bottom: var(--e-5);
}
.entete-section__titre {
  font-size: var(--d-m);
  color: var(--vert);
  text-transform: uppercase;
}
.entete-section__texte { font-size: var(--t-2); line-height: 1.45; }
@media (max-width: 48rem) {
  .entete-section { grid-template-columns: 1fr; }
}

/* ---------- Rayons (index typographique) ---------- */
.rayons__titre {
  font-family: var(--font-serif);
  font-weight: 400; font-stretch: 100%;
  font-size: var(--t-4);
  line-height: 1.1;
  margin-bottom: var(--e-3);
}
.rayons__liste { border-bottom: 3px solid var(--vert-profond); }
.rayon {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--e-3);
  border-top: 3px solid var(--vert-profond);
  padding-block: .15em .05em;
}
.rayon__nom {
  font-family: var(--font-display);
  font-weight: 800; font-stretch: 75%;
  font-size: var(--d-m);
  line-height: 1;
  text-transform: uppercase;
}
.rayon__compte { font-weight: 700; white-space: nowrap; }
.rayon__lien { color: inherit; text-decoration: none; }
.rayon__lien::after { content: ""; position: absolute; inset: 0; }
.rayon { position: relative; transition: background-color .15s ease-out, color .15s ease-out; }
.rayon:has(.rayon__lien):hover { background: var(--vert-profond); color: var(--rose); }
.rayon:has(.rayon__lien:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.rayon__lien:focus-visible { outline: none; }
.rayon:nth-child(even) .rayon__nom { padding-left: clamp(1rem, 8vw, 8rem); }
@media (max-width: 40rem) {
  .rayon { flex-direction: column; align-items: flex-start; gap: 0; padding-bottom: .4rem; }
  .rayon:nth-child(even) .rayon__nom { padding-left: 0; }
  .rayon__nom { font-size: var(--d-s); }
}

/* ---------- Ateliers ---------- */
.ateliers__grille {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--e-5) var(--e-6);
  align-items: center;
}
.ateliers__titre {
  font-size: var(--d-xl);
  text-transform: uppercase;
  color: var(--papier);
  text-shadow: .045em .05em 0 var(--vert-profond);
  margin-bottom: var(--e-3);
}
.seances { margin-top: var(--e-5); border-top: var(--trait) solid var(--papier); }
.seance {
  display: grid;
  grid-template-columns: 5.5rem minmax(0, 1fr) auto;
  gap: var(--e-3);
  align-items: center;
  padding-block: var(--e-2);
  border-bottom: var(--trait) solid var(--papier);
}
.seance__date { font-family: var(--font-serif); font-size: var(--t-0); line-height: 1; text-align: center; }
.seance__jour { display: block; font-size: var(--t-5); }
.seance__infos h3 { font-size: var(--t-3); }
.seance__infos p { font-size: var(--t-0); margin-top: .2rem; }
.seance__places {
  font-weight: 800; white-space: nowrap;
  background: var(--anis); color: var(--encre);
  padding: .3rem .7rem;
}
.seance--complet .seance__places { background: transparent; color: var(--papier); border: var(--trait) solid var(--papier); }
.ateliers__vide { margin-top: var(--e-4); font-weight: 600; }
.ateliers__suite { margin-top: var(--e-4); }
.retrait__bloc > p + p, .fleuriste__texte .bouton { margin-top: var(--e-2); }

.ateliers__tirage {
  background: var(--anis);
  padding: clamp(.5rem, 1.2vw, .9rem);
  rotate: -2.5deg;
}
.ateliers__tirage img { width: 100%; aspect-ratio: 1; object-fit: cover; }

@media (max-width: 56rem) {
  .ateliers__grille { grid-template-columns: 1fr; }
  .ateliers__tirage { width: min(80%, 24rem); justify-self: end; }
}
@media (max-width: 30rem) {
  .seance { grid-template-columns: 4.5rem minmax(0, 1fr); }
  .seance__places { grid-column: 2; justify-self: start; }
}

/* ---------- Retrait & livraison ---------- */
.retrait .entete-section__titre { margin-bottom: var(--e-5); }
.retrait__colonnes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.retrait__bloc { padding: var(--e-1) var(--e-5) var(--e-2) 0; }
.retrait__bloc + .retrait__bloc {
  padding-left: var(--e-5);
  border-left: 3px solid var(--vert);
}
.retrait__bloc h3 { font-size: var(--t-4); color: var(--vert); margin-bottom: var(--e-2); }
.retrait__bloc .horaires { margin-top: var(--e-3); }
@media (max-width: 48rem) {
  .retrait__colonnes { grid-template-columns: 1fr; }
  .retrait__bloc { padding-right: 0; }
  .retrait__bloc + .retrait__bloc {
    padding-left: 0; border-left: 0;
    margin-top: var(--e-4); padding-top: var(--e-4);
    border-top: 3px solid var(--vert);
  }
}

/* ---------- La fleuriste ---------- */
.fleuriste__grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--e-6);
  align-items: center;
}
.fleuriste__collage { position: relative; min-height: 30rem; }
.fleuriste__tirage { position: absolute; padding: clamp(.5rem, 1.2vw, .8rem); }
.fleuriste__tirage img { width: 100%; object-fit: cover; }
.fleuriste__tirage--portrait {
  left: 0; top: 0; width: 66%;
  background: var(--rose);
  rotate: -3deg; z-index: 1;
}
.fleuriste__tirage--portrait img { aspect-ratio: 4 / 5; object-position: 35% 50%; }
.fleuriste__tirage--vitrine {
  right: 0; bottom: 0; width: 48%;
  background: var(--papier);
  rotate: 4deg; z-index: 2;
}
.fleuriste__tirage--vitrine img { aspect-ratio: 4 / 5; }
.fleuriste__fleur {
  --taille: clamp(4rem, 8vw, 6.5rem);
  position: absolute; z-index: 3; left: 52%; top: 4%;
  rotate: 12deg;
}
.fleuriste__nom {
  font-family: var(--font-serif);
  font-weight: 400; font-stretch: 100%;
  font-size: var(--d-s);
  line-height: 1;
  color: var(--rose);
  margin-bottom: var(--e-3);
}
.fleuriste__texte p + p { margin-top: var(--e-2); }

@media (max-width: 56rem) {
  .fleuriste__grille { grid-template-columns: 1fr; }
  .fleuriste__collage { min-height: 0; aspect-ratio: 1 / 1.05; max-width: 32rem; }
}