/*
 * Entreprise Berry — retouches maquette (recette du 27/10/2026)
 *
 * Feuille chargée telle quelle (hors build Vite, voir inc/berry.php), après
 * app-css et le CSS du plugin StellarIO Reviews.
 */

/* Images « h-full » : la règle globale `img { height: auto }` de berry.css
   l'emportait sur l'utilitaire Tailwind — les photos ne remplissaient plus
   leur cadre (aspect-[…]) et prenaient des hauteurs différentes. */
img.h-full { height: 100%; }

/* Avis — cartes en escalier de la maquette : le CSS du plugin (fond blanc,
   petit rayon, bordure) écrasait .testi-card, et `max-width: var(--maxw)`
   (variable inexistante) faisait déborder la grille sur toute la largeur. */
.stellario-aries--maquette.avis-google .container-aries {
  max-width: 1320px;
  padding-inline: clamp(1.25rem, 4vw, 3rem);
}
.stellario-aries--maquette .testi-card.stellario-review {
  display: block;
  padding: 2rem 1.75rem 1.75rem;
  background: var(--color-surface);
  border: 0;
  border-radius: var(--radius-card) 0 var(--radius-card) 0;
  box-shadow: var(--shadow-card);
}
.stellario-aries--maquette .testi-card.stellario-review:hover { box-shadow: var(--shadow-hover); }

/* Pied de page — pictos centrés sur leur texte */
.site-footer .info-list li { align-items: center; }

/* Duo de photos décalées — photos agrandies, empilées sur mobile */
.duo-photos__media { display: grid; gap: 1.25rem; }
.duo-photos__photo { aspect-ratio: 4 / 3; }
@media (min-width: 768px) {
  .duo-photos__media { grid-template-columns: repeat(2, 1fr); align-items: start; }
  .duo-photos__photo { aspect-ratio: 4 / 5; }
  .duo-photos__photo--offset { margin-top: 4rem; }
}

/* Texte + cartes + image — image sticky dans sa section (desktop) */
@media (min-width: 1024px) {
  .texte-cartes-image__grid { align-items: stretch; }
  .texte-cartes-image__media { position: sticky; top: 7.5rem; }
}

/* Étiquettes (chips) sous une liste à puces — 24 px d'air : la règle
   `.chip-list { margin: 0 }` annulait l'utilitaire mt-7. */
.chip-list.mt-7 { margin-top: 1.5rem; }

/* Mobile — titres et sous-titres calés sur la largeur de l'écran
   (text-wrap: balance laissait des lignes courtes et un vide à droite). */
@media (max-width: 639px) {
  .h1-hero {
    font-size: clamp(2.6rem, 14vw, 4.2rem);
    text-wrap: pretty;
  }
  .h1-hero .accent {
    font-size: clamp(0.95rem, 4.6vw, 1.15rem);
    letter-spacing: 0.12em;
  }
  h1.display {
    font-size: clamp(2.4rem, 12.5vw, 3.8rem);
    text-wrap: pretty;
  }
  .h2-section,
  .stellario-aries--maquette .stellario-aries__title {
    font-size: clamp(2rem, 10.5vw, 3rem);
    text-wrap: pretty;
  }
  .eyebrow { letter-spacing: 0.18em; }
  .eyebrow::before,
  .center .eyebrow::after { width: 1.5rem; flex-shrink: 0; }
}

/* Mobile — grilles de photos des blocs formulaire (Nous rejoindre, Contact) :
   2 photos seulement, l'une sous l'autre. */
@media (max-width: 767px) {
  .photos-mobile-duo { grid-template-columns: 1fr; }
  .photos-mobile-duo > :nth-child(n + 3) { display: none; }
  .photos-mobile-duo > * { aspect-ratio: 4 / 3; }
}
