/* =============================================================================
   band-img.css — bandeau photo pleine largeur, fond en parallaxe
   =============================================================================
   Repris de la maquette figee (style.css l. 2624-2643). Les commentaires d'origine sont
   conserves : ils portent des motifs de conception qu'aucune autre source ne
   documente.

   ⚠️ TOUT le CSS de ce type de bloc vit ici — y compris ses @media. Rien dans
   le CSS d'une page : un bloc duplique vers une page vierge doit rester correct.
   ============================================================================= */

/* BANDEAU IMAGE « découpé dans la page » — composant GÉNÉRIQUE (.band-img, règle Fix 06/07 :
   alterner fonds unis / bandeaux photo parallaxe / blocs texte+photo pour rythmer les pages) ;
   .py-culture (Terres & cultures des fiches pays) = même mécanique, alias conservé.
   Fond photo pleine largeur en attachment:fixed (effet fenêtre au scroll) + voile + texte
   superposé. Fond sombre (voile) -> textes CLAIRS (règle lisibilité). */
.py-culture, .band-img{ position:relative; overflow:hidden; }   /* overflow = la « fenêtre découpée » */
/* MÊME MÉCANIQUE que le martin-pêcheur de la Home (feature__fix) : couche 100vh translatée à
   l'INVERSE du scroll (--fix-y, piloté par bandFixedBg dans main.js) -> le fond paraît FIXE
   derrière la page, la section le révèle. Fiable partout (contextes transformés inclus). */
.py-culture__bg, .band-img__bg{ position:absolute; left:0; right:0; top:0; height:100vh;
  transform:translateY(var(--fix-y, 0px)); will-change:transform;
  background:#241d12 center/cover no-repeat; }
.py-culture__veil, .band-img__veil{ position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(14,14,14,.74) 0%, rgba(14,14,14,.45) 48%, rgba(14,14,14,.12) 100%); }
.py-culture__inner, .band-img__inner{ position:relative; z-index:1; max-width:620px;
  padding:clamp(90px,12vw,170px) 0; }
.py-culture .eyebrow, .band-img .eyebrow{ color:var(--jaune); }
.py-culture__titre, .band-img__titre{ color:var(--blanc); text-align:left; margin:12px 0 20px; }
.py-culture__inner p:not(.eyebrow), .band-img__inner p:not(.eyebrow){ color:rgba(255,255,255,.86);
  font-size:var(--fs-body); line-height:1.7; margin-bottom:16px; }

/* --- Responsive (maquette mobile.css) --- */
@media (max-width:1024px){
  /* 100dvh : sur mobile la barre d'adresse fait varier 100vh, et le fond « saute ». */
  .py-culture__bg, .band-img__bg{ height:100dvh; }
}
@media (max-width:640px){
  /* Le CTA partage son parent avec un titre et un texte VOLONTAIREMENT alignes a
     gauche : on centre donc le BOUTON lui-meme, pas le bloc (qui recentrerait aussi
     le titre). */
  .band-img__cta{ display:flex; width:fit-content; margin-inline:auto; }
}
