/* Gestion by Belentia, DA v3.3 : styles de la page « tarifs, après affine et v32 », repris tels quels de la maquette tarifs.html (24/09/2026). */
/* Boucle 3, correction (23/09) : de 721 à 900 px, l'affiche en une colonne
     (3:2, 720 × 480) repoussait les offres à 1 260 px, sous le premier écran
     de 1 024 px ; en 2:1, elles restaient à 1 140 px. En-tête en deux
     colonnes, comme au-dessus de 900 px : texte à gauche (titre de 40 à 46 px
     sur deux lignes), affiche 4:3 à droite, cadrée sur le saladier et les mains.
     Les cartes d'offre et leurs prix entrent dans le premier écran. */
  @media (min-width: 721px) and (max-width: 900px) {
    .hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--space-4); align-items: center; }
    .hero .h1 { font-size: clamp(40px, 5.2vw, 46px); }
    .hero .head-visual--ambiance { aspect-ratio: 4 / 3; }
  }

  /* Boucle 4 (23/09) : au-dessus de 900 px, les prix n'entraient pas dans le
     premier écran (1440 × 900 : « 3,99 € » à y = 962 ; 1024 × 768 : 847).
     En-tête plus court : 64 px au-dessus, 48 dessous, affiche en 16:9 (elle
     est au format 16:9, la table et le saladier restent entiers) ; titre de
     « Deux offres » sur une ligne, section resserrée au-dessus des cartes. */
  @media (min-width: 901px) {
    .hero { padding-block: var(--space-7, 64px) var(--space-6); }
    .hero .head-visual--ambiance { aspect-ratio: 16 / 9; }
    #offres { padding-top: var(--space-6); }
    #offres .section-head { max-width: none; margin-bottom: var(--space-5); }
  }
  /* De 901 à 1 024 px, les colonnes de 721-900 px (texte 1,1 fr, affiche
     0,9 fr) : l'affiche garde 370 à 430 px de large (229 px à 901 avant). */
  @media (min-width: 901px) and (max-width: 1024px) {
    .hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--space-4); }
    .hero .h1 { font-size: 46px; }
  }
  /* Boucle 5 (24/09) : premier écran mobile vivant. L'image d'en-tête dérive très
     lentement (1 → 1,05 en 16 s, aller-retour), sans vidéo ; fixe en mouvement réduit.
     Propriété scale : se compose avec le balayage du kit sans le remplacer. */
  @keyframes gx-derive { from { scale: 1; } to { scale: 1.05; } }
  @media (prefers-reduced-motion: no-preference) {
    .head-visual--ambiance img { animation: gx-derive 16s ease-in-out infinite alternate; }
  }