/* ====================================================================
   Contenu encadré « façon Elementor / pleine largeur boxed ».

   Avant : .container = viewport − 14vw (7vw de marge de chaque côté), donc
   le contenu s'étirait sans limite sur les grands écrans. Ici il est capé à
   1400px et centré. La règle min() ne change RIEN tant que le viewport laisse
   le contenu sous 1400px (≈ ≤ 1628px) : petits et moyens écrans inchangés,
   seuls les très grands sont cadrés.

   Les sections pleine largeur restent bord à bord (fond compris) grâce à la
   technique 100vw + calc(50% − 50vw), indépendante de la largeur du conteneur.

   Desktop uniquement (> 1024px = $resp-tablette) : mobile/tablette intacts.
   ==================================================================== */
@media (min-width: 1025px) {
  .container {
    width: min(calc(100% - 14vw), 1400px);
    margin-left: auto;
    margin-right: auto;
  }
  /* Full-width via margin-left */
  .bg-full-width,
  #bloc--blog,
  .slider-overflow-x.slick-slider,
  .bloc--rs-galerie .rs-galerie,
  .slider--destination-img {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: 0;
  }
  /* Full-width via left (position:relative) */
  .bloc--full-width,
  .bloc--full-width-color-bg,
  .bloc--introduction {
    width: 100vw;
    max-width: 100vw;
    left: calc(50% - 50vw);
  }

  /* Héros + moteur de recherche : le FOND reste pleine largeur, mais le CONTENU
     (titre, promesse, barre de recherche) est cadré sur la même colonne 1400px
     que le reste de la page → son bord GAUCHE s'aligne avec le contenu dessous.
     Avant : 1000px centrés, qui flottaient au milieu. */
  .intro--cnt {
    max-width: min(calc(100% - 14vw), 1400px);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  /* Barre de recherche de l'ACCUEIL : cadrée à 1200px, alignée à gauche.
     `:not(.searchbar-etablissement)` = ne PAS toucher la barre de réservation
     des pages établissement (qui, elle, doit suivre la largeur du contenu). */
  .search-bar:not(.searchbar-etablissement) {
    max-width: 1200px;
    margin-left: 0;
    margin-right: auto;
  }
  /* Barre de réservation établissement : même largeur que les autres blocs. */
  .search-bar.searchbar-etablissement {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  /* Blocs vll à fond configurable (.vll-bloc--fond, ex. #destinations, Préparez
     l'hiver, Léo Experiences…) : le FOND doit filer bord à bord tandis que le
     CONTENU reste dans la colonne 1400. On sort le bloc en pleine largeur et on
     repousse son contenu par du padding centré (colonne 1400).
     ⚠️ On NE met PAS `position:relative` : ces blocs se chevauchent volontairement
     (margin-top négatif entre deux `--fond`), et positionner le bloc le ferait
     passer AU-DESSUS du titre du bloc précédent (bug « titre coupé »). En le
     laissant statique, le titre (positionné) reste peint par-dessus. */
  .vll-bloc--fond {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: max(7vw, calc(50vw - 700px));
    padding-right: max(7vw, calc(50vw - 700px));
  }

  /* Bloc blog du theme, surtitre Restez informe : le fond gris reste bord a
     bord (gere plus haut, groupe margin-left), mais son contenu .blog-ctn
     gardait l ancien padding 7vw et s etalait au-dela de la colonne 1400 sur
     grand ecran. Meme remede que .vll-bloc--fond : padding horizontal qui
     centre la colonne 1400 ; le padding vertical d origine est conserve. */
  #bloc--blog .blog-ctn {
    padding-left: max(7vw, calc(50vw - 700px));
    padding-right: max(7vw, calc(50vw - 700px));
  }

  /* Sections colorees pleine largeur (bloc formulaire contact/devis en bas des
     pages etablissement) : le fond reste bord a bord (gere plus haut), mais le
     contenu doit etre cadre a 1400px comme le reste du site. On remplace son
     padding horizontal 7vw par un padding qui centre ; le vertical reste. La
     double classe depasse le padding 7vw de main.css (une classe). Le bloc devis
     reutilise cette classe et blocs-vll/formulaires.css redeclare son padding
     avec deux classes dans un fichier charge APRES layout-boxed : on le rebat
     avec la triple classe plus .vll-devis (specificite superieure).
     ATTENTION : jamais d accolade ni de backtick dans un commentaire de ce
     fichier. Le minifieur WP Rocket les laisse fuiter en texte brut et une
     accolade de commentaire ferme le bloc @media par erreur. */
  .bloc--full-width-color-bg.bloc--full-width-color-bg,
  .vll-devis.bloc--full-width-color-bg.bloc--full-width-color-bg {
    padding-left: max(7vw, calc(50vw - 700px));
    padding-right: max(7vw, calc(50vw - 700px));
  }
}

/* Mobile : un peu d'air sous la barre de recherche (elle remonte dans le héros
   via translateY(-50%), le contenu suivant collait). */
@media (max-width: 767px) {
  .search-bar { margin-bottom: 26px; }
}
/* Largeur portee de 1240 a 1400px le 30/08/2026 - colonne clubmed. */
