/* Accueil : la bannière tient dans le premier écran, quelle que soit la mise à l'échelle
   du système (Windows 125-150 %, petits portables). --gfa-hero-zoom est calculé dans index.tpl. */
.gfa-v4-hero-grid.is-fit {
  grid-template-rows: 250px 250px 160px;
  zoom: var(--gfa-hero-zoom, 1);
}

/* Les textes ne descendent pas sous 85-90 % de leur taille ; les cartes, plus larges
   en proportion, affichent leurs titres sur moins de lignes. */
.gfa-v4-hero-grid.is-fit .gfa-v2-hero-card__eyebrow,
.gfa-v4-hero-grid.is-fit .gfa-v2-hero-card__cta,
.gfa-v4-hero-grid.is-fit .gfa-v4-hero-card:not(.gfa-v4-hero-card--main) .gfa-v2-hero-card__title {
  zoom: max(1, calc(0.9 / var(--gfa-hero-zoom, 1)));
}

.gfa-v4-hero-grid.is-fit .gfa-v4-hero-card:not(.gfa-v4-hero-card--main) .gfa-v2-hero-card__title {
  max-width: none;
}

.gfa-v4-hero-grid.is-fit .gfa-v4-hero-card--main .gfa-v2-hero-card__title {
  zoom: max(1, calc(0.85 / var(--gfa-hero-zoom, 1)));
  max-width: 13ch;
}

.gfa-v4-hero-grid.is-fit .gfa-v4-hero-card--service .gfa-v2-hero-card__content {
  padding-top: 12px;
  padding-bottom: 12px;
  gap: 6px;
}

.gfa-v4-hero-grid.is-fit .gfa-v4-hero-card--service .gfa-v2-btn {
  min-height: 32px;
  padding-top: 5px;
  padding-bottom: 5px;
}

@media (min-width: 1200px) and (max-height: 900px) {
  body#index #wrapper {
    padding-top: 10px;
  }

  .page-home .gfa-v3-home-hero {
    margin-top: 4px;
  }
}

/* Menu Produits : les douze catégories tiennent sans défilement sur les écrans peu hauts. */
@media (min-width: 1200px) {
  #gfa-v2-mega-menu .gfa-v2-mega__list {
    display: flex;
    flex-direction: column;
  }

  #gfa-v2-mega-menu .gfa-v2-mega__item {
    display: flex;
    flex: 0 1 50px;
    min-height: 32px;
  }

  #gfa-v2-mega-menu .gfa-v2-mega__btn {
    padding-top: 2px;
    padding-bottom: 2px;
    line-height: 1.15;
  }
}

@media (min-width: 1200px) and (max-height: 959px) {
  #gfa-v2-mega-menu .gfa-v2-mega__title {
    padding-top: 16px;
    padding-bottom: 8px;
    font-size: 24px;
  }

  #gfa-v2-mega-menu .gfa-v2-mega__title::after {
    margin-top: 8px;
  }

  #gfa-v2-mega-menu .gfa-v2-mega__list {
    padding-bottom: 8px;
  }

  #gfa-v2-mega-menu .gfa-v2-mega__btn {
    font-size: 14px;
  }
}

/* Recherche : une seule loupe dessinée en SVG, identique sur tous les systèmes.
   Le caractère « ⌕ » dépendait des polices installées et l'icône icon-rt-loupe
   (police d'un ancien thème) n'était jamais chargée : bouton vide. */
.gfa-v2-header-main .search-input-container::before,
#header .gfa-v2-header-main .search-input-container::before {
  content: none;
}

.gfa-v2-header-main .pos-search__submit {
  display: inline-grid;
  place-items: center;
  cursor: pointer;
}

.gfa-v2-header-main .pos-search__submit .icon-rt-loupe {
  display: block;
  width: 20px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f2f53' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5 21 21'/%3E%3C/svg%3E") center / contain no-repeat;
}

.gfa-v2-header-main .pos-search__input {
  text-overflow: ellipsis;
}

/* Fiche produit sur petits téléphones : la colonne de la galerie (« 1fr ») ne descendait
   pas sous la largeur de son contenu (344 px) et faisait défiler la page en largeur. */
@media (max-width: 767px) {
  .page-product .images-container {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-product .images-container > *,
  .page-product .images-container .product-cover,
  .page-product .images-container .js-qv-mask {
    min-width: 0;
    max-width: 100%;
  }
}

/* Menu mobile : la liste ne doit pas capter le glissé du doigt. Sur mobile elle s'affiche
   en entier ; avec overscroll-behavior: contain, le geste n'atteignait pas le menu, qui
   ne défilait plus (dernières catégories inaccessibles sur les petits téléphones). */
@media (max-width: 767px) {
  #gfa-v2-mega-menu .gfa-v2-mega__list {
    overflow: visible;
    overscroll-behavior: auto;
  }

  #gfa-v2-mega-menu {
    overscroll-behavior: contain;
  }
}