/* La Neyrette — corrections d'affichage communes à toutes les pages (repasse mobile du 14/10/2026).
 * Chargée par le thème enfant. Préfixe « html body » : passe devant le CSS écrit dans chaque page. */

/* ---------- Sélecteur de langue en liste déroulante ---------- */
html body .ln-lang { position: relative; flex: 0 0 auto; }
html body .ln-lang__btn {
  background: transparent; border: 1px solid rgba(255,255,255,0.35); color: #fff;
  padding: 7px 10px; font-family: var(--font-sans); font-size: 10px; font-weight: 600;
  letter-spacing: 0.15em; line-height: 1; border-radius: 2px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 5px; transition: color 300ms, border-color 300ms;
}
html body .site-header.is-scrolled .ln-lang__btn,
html body .site-header.ln-menu-open .ln-lang__btn,
html body .site-header:has(.logo-img--bordeaux) .ln-lang__btn { border-color: var(--border); color: var(--color-anthracite); }
html body .ln-lang__list {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 60; min-width: 150px;
  margin: 0; padding: 6px 0; list-style: none; background: var(--color-blanc-pur, #fff);
  border: 1px solid var(--border); border-radius: 2px; box-shadow: 0 8px 24px rgba(42,38,34,0.12);
}
html body .ln-lang__list[hidden] { display: none; }
html body .ln-lang__list a {
  display: flex; align-items: center; gap: 10px; padding: 10px 16px;
  font-family: var(--font-sans); font-size: 13px; color: var(--color-anthracite); text-decoration: none; white-space: nowrap;
}
html body .ln-lang__list a:hover, html body .ln-lang__list a:focus-visible { background: var(--color-creme); color: var(--color-bordeaux); }
html body .ln-lang__list a[aria-current] { color: var(--color-bordeaux); font-weight: 600; }
html body .ln-lang__code { font-size: 10px; font-weight: 600; letter-spacing: 0.15em; width: 20px; }

html body .ln-court { display: none; }
/* Le thème parent colore en rose tout bouton survolé ou ciblé : neutralisé pour les boutons de l'en-tête. */
html body .site-header .ln-lang__btn:hover, html body .site-header .ln-lang__btn:focus,
html body .site-header .menu-toggle:hover, html body .site-header .menu-toggle:focus { background: transparent; }
html body .site-header .ln-lang__btn:focus-visible, html body .site-header .menu-toggle:focus-visible { outline: 2px solid var(--color-or); outline-offset: 2px; }

/* ---------- En-tête et menu sur tablette et téléphone ---------- */
@media (max-width: 1024px) {
  html body .site-header .menu-toggle { display: inline-flex; flex: 0 0 auto; }
  html body .site-header .brand { min-width: 0; flex: 0 1 auto; }
  html body .site-header .header-actions { flex: 0 0 auto; }
  html body .site-header.ln-menu-open { background: var(--color-blanc-casse); border-bottom-color: var(--border); }
  /* Le flou de l'en-tête défilé enfermait le menu dans l'en-tête (40 px de haut) : retiré tant que le menu est ouvert. */
  html body .site-header.ln-menu-open { -webkit-backdrop-filter: none; backdrop-filter: none; }
  html body .site-header.ln-menu-open .brand__name { color: var(--color-bordeaux); }
  html body .site-header.ln-menu-open .brand__mark.logo-img { filter: brightness(0) saturate(100%) invert(22%) sepia(48%) saturate(1684%) hue-rotate(323deg) brightness(92%) contrast(91%); }
  html body .site-header.ln-menu-open .menu-toggle { border-color: var(--border); color: var(--color-anthracite); }
  html body .site-header.ln-menu-open nav .nav {
    display: flex; flex-direction: column; gap: 0;
    position: fixed; left: 0; right: 0; bottom: 0; top: var(--ln-header-h, 80px);
    background: var(--color-blanc-casse); padding: 16px 32px 40px; overflow-y: auto; z-index: 49;
  }
  html body .site-header.ln-menu-open nav .nav li { border-bottom: 1px solid var(--border); }
  html body .site-header.ln-menu-open nav .nav a {
    display: block; padding: 16px 0; font-family: var(--font-serif); font-size: 24px;
    color: var(--color-anthracite); text-shadow: none; border-bottom: 0;
  }
  html body .site-header.ln-menu-open nav .nav a.is-active { color: var(--color-bordeaux); }
  html.ln-no-scroll, html.ln-no-scroll body { overflow: hidden; }
}

@media (max-width: 600px) {
  html body .site-header__inner,
  html body .site-header.is-scrolled .site-header__inner { padding-left: 16px; padding-right: 16px; gap: 8px; }
  html body .site-header .brand { gap: 8px; }
  html body .site-header .brand__mark { width: 40px; height: 40px; flex: 0 0 auto; }
  html body .site-header .brand__name { font-size: 13px; letter-spacing: 0.06em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html body .site-header .header-actions { gap: 6px; }
  html body .site-header .ln-lang__btn { padding: 7px 7px; }
  html body .site-header .header-actions .btn { padding: 10px 12px; font-size: 10px; letter-spacing: 0.1em; white-space: nowrap; }
  html body .site-header .menu-toggle { padding: 8px; }
  html body .site-header .header-actions .btn .ln-long { display: none; }
  html body .site-header .header-actions .btn .ln-court { display: inline; }
  html body .site-header .brand > span { min-width: 0; overflow: hidden; }
  html body .site-header .brand__name { font-size: 12px; letter-spacing: 0.02em; }
  html body .site-header.ln-menu-open nav .nav { padding: 8px 16px 32px; }
}

/* ---------- Contenus : défauts relevés le 13/10/2026 ---------- */
/* Politique de confidentialité : la grille prenait la largeur de son plus long contenu (666 à 709 px). */
html body .legal-grid > * { min-width: 0; }
html body .legal-body, html body .legal-card { overflow-wrap: anywhere; }
html body .legal-table-wrap { max-width: 100%; overflow-x: auto; }
@media (max-width: 1024px) {
  html body .legal-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Hôtel : « 1 050 m » ne se coupe plus en deux. */
html body .intro__stat-num { white-space: nowrap; }
html body .intro__stats > *, html body .devoluy__stats > *, html body .amenities__grid > * { min-width: 0; }

@media (max-width: 600px) {
  /* Restaurant : la formule du midi passe sur une colonne au lieu de trois colonnes coupées. */
  html body .formule-midi { grid-template-columns: minmax(0, 1fr); padding: 28px 22px; }
  html body .formule-midi__cols { grid-template-columns: minmax(0, 1fr); }
  /* Restaurant : le badge « Maître Restaurateur » reste dans la photo du chef. */
  html body .chef__portrait-badge { left: 16px; right: 16px; bottom: 16px; padding: 12px 14px; gap: 12px; }
  html body .chef__portrait-badge-text { min-width: 0; flex: 1 1 auto; letter-spacing: 0.1em; }
  html body .chef__portrait-badge img.chef__portrait-badge-logo { width: 56px; max-width: 56px; flex: 0 0 56px; }
  html body .chef__portrait-badge-text strong { letter-spacing: 0.1em; }
  /* Hôtel : chiffres et équipements tiennent dans l'écran (mots allemands longs compris). */
  html body .intro__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  html body .intro__stat-num { font-size: 28px; }
  html body .intro__stat-label { letter-spacing: 0.1em; overflow-wrap: anywhere; hyphens: auto; }
  html body .devoluy__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body .devoluy__stat { padding: 24px 12px; }
  html body .devoluy__stat-num { font-size: 26px; overflow-wrap: anywhere; hyphens: auto; }
  html body .devoluy__stat-label { letter-spacing: 0.08em; hyphens: auto; overflow-wrap: anywhere; }
  html body .amenities__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body .amenities__item { gap: 10px; padding: 12px 8px; }
  html body .amenities__label { min-width: 0; hyphens: auto; overflow-wrap: anywhere; }
}

/* ---------- Téléphones étroits ---------- */
@media (max-width: 600px) {
  /* Une colonne de grille ne s'élargit plus d'après son plus long mot. */
  html body section [class*="__grid"] > *, html body .hours__table * { min-width: 0; }
  /* Allemand : coupure des mots longs plutôt que débordement. */
  html[lang^="de"] body section { hyphens: auto; overflow-wrap: break-word; }
}
@media (max-width: 400px) {
  html body .site-header__inner,
  html body .site-header.is-scrolled .site-header__inner { padding-left: 12px; padding-right: 12px; gap: 6px; }
  html body .site-header .brand { gap: 6px; }
  html body .site-header .brand__mark { width: 34px; height: 34px; }
  html body .site-header .brand__name { font-size: 11px; letter-spacing: 0; }
  html body .site-header .header-actions { gap: 5px; }
  html body .site-header .header-actions .btn { padding: 10px 9px; }
  html body .prat-card { padding: 22px 18px; }
  html body .prat-card__k { white-space: normal; }
  html body .formule-spa { padding: 26px 20px 24px; }
  html body .bien__card { padding: 28px 18px; }
  html body .bien__card-price { font-size: 52px; }
}

/* ---------- Accueil : la photo du Dévoluy remplit son cadre ---------- */
/* « .elementor img { height: auto } » l'emportait : la photo, au premier plan, recouvrait le texte. */
html body .photo > img.photo__img { height: 100%; max-width: none; }
html body .devoluy__overlay { z-index: 2; }
html body .devoluy__photo .devoluy__inner { z-index: 3; }

/* ---------- Pop-up de fermeture saisonnière : tient dans l'écran ---------- */
@media (max-width: 600px) {
  html body .pum-container.popmake { width: auto !important; max-width: none !important; left: 12px !important; right: 12px !important; margin-left: 0 !important; }
  html body .pum-container.popmake .pum-content { width: auto !important; max-width: 100% !important; overflow-wrap: anywhere; }
}

/* ---------- Restaurant : onglets de la carte et horaires ---------- */
@media (max-width: 768px) {
  html body .carte__tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; overflow: visible; border-radius: 22px; }
  html body .carte__tab { padding: 11px 8px; letter-spacing: 0.1em; border-radius: 999px; text-align: center; white-space: normal; }
}
@media (max-width: 480px) {
  html body .hours__row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  html body .hours__slots { flex-wrap: wrap; gap: 6px 18px; }
  html body .hours__slot { white-space: nowrap; }
}

/* ---------- Activités : l'autocollant agrandi tient dans la largeur de l'écran ---------- */
@media (max-width: 900px) {
  html body .charte-zoom__cadre img.charte-zoom__img { width: 100%; max-width: 100%; }
  html body .charte-zoom__aide { display: none; }
}

/* ---------- Galerie : photos ouvertes en grand ---------- */
html body .ln-agrandir { cursor: zoom-in; }
html body .ln-agrandir:focus-visible { outline: 2px solid var(--color-or); outline-offset: -2px; }
html body .ln-galerie {
  position: fixed; inset: 0; z-index: 100000; background: rgba(24, 22, 20, 0.95);
  display: flex; align-items: center; justify-content: center; padding: 56px 12px 48px;
}
html body .ln-galerie[hidden] { display: none; }
html body .ln-galerie__figure { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; gap: 12px; }
html body .ln-galerie img.ln-galerie__img { max-width: 100%; max-height: calc(100vh - 150px); max-height: calc(100dvh - 150px); width: auto; height: auto; object-fit: contain; border-radius: 2px; }
html body .ln-galerie__legende { color: var(--color-blanc-casse); font-family: var(--font-sans); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; text-align: center; }
html body .ln-galerie__compteur { position: fixed; top: 20px; left: 20px; color: rgba(250,247,242,0.7); font-family: var(--font-sans); font-size: 12px; letter-spacing: 0.1em; }
html body .ln-galerie button { background: transparent; border: 0; color: #fff; cursor: pointer; padding: 0; line-height: 1; }
html body .ln-galerie button:hover, html body .ln-galerie button:focus { background: transparent; color: var(--color-or); }
html body .ln-galerie button:focus-visible { outline: 2px solid var(--color-or); outline-offset: 2px; }
html body .ln-galerie__fermer { position: fixed; top: 8px; right: 12px; width: 44px; height: 44px; font-size: 34px; }
html body .ln-galerie__nav { position: fixed; top: 50%; transform: translateY(-50%); width: 44px; height: 64px; font-size: 44px; }
html body .ln-galerie__nav--prec { left: 4px; }
html body .ln-galerie__nav--suiv { right: 4px; }
html body .ln-galerie--seule .ln-galerie__nav, html body .ln-galerie--seule .ln-galerie__compteur { display: none; }
@media (max-width: 600px) {
  html body .ln-galerie { padding: 56px 0 40px; }
  html body .ln-galerie__nav { top: auto; bottom: 8px; transform: none; }
}

/* ---------- Haut de page : le titre ne passe plus sous l'en-tête quand le texte est long ---------- */
@media (max-width: 768px) {
  html body section.hero { padding-top: calc(var(--ln-header-h, 80px) + 24px); }
}

/* ---------- Qui sommes-nous : la carte au-dessus, la description en dessous ---------- */
@media (max-width: 768px) {
  html body #ou-sommes-nous .container > div[style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; gap: 28px !important; }
}