/* Plaine Altitude, système de design V4 : En-tête H (barre haute, onglet du logo, menu encadré, barre flottante), méga-menus, tiroir mobile, pied de page, réseaux sociaux.
   Extrait des maquettes le 2026-10-11 ; ne pas éditer les pages, éditer ce fichier. */

/* En-tête : pilule compacte au défilement, tiroir mobile */
.compacte { position: fixed; top: 0; left: 0; right: 0; z-index: 40; padding: 0.5rem var(--gouttiere); background: #fff; display: flex; justify-content: center;
    transform: translateY(-140%); transition: transform 380ms cubic-bezier(.2,.7,.3,1); pointer-events: none; }
.compacte > * { pointer-events: auto; }
body.a-defile .compacte { transform: none; }
.pa-tiroir-fenetre { position: fixed; inset: 0; z-index: 59; }   /* fenêtre <dialog> qui porte le voile et le tiroir (2026-11-13) */
.tiroir-voile { position: fixed; inset: 0; z-index: 59; background: rgba(41,39,40,.45); opacity: 0; pointer-events: none; transition: opacity 300ms; }
.pa-tiroir--fixe { transform: translateX(110%); transition: transform 420ms cubic-bezier(.2,.7,.3,1); }
body.menu-ouvert .tiroir-voile { opacity: 1; pointer-events: auto; }
body.menu-ouvert .pa-tiroir--fixe { transform: none; }
/* ── Haut de fiche ── */
.fil { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; padding: var(--sp-xs) 0 var(--sp-s); font: 500 var(--fs-xs) var(--font-texte); color: var(--fg-secondaire); }
.fil a { color: var(--fg-secondaire); }
.fil a:hover { color: var(--fg-titre); }
.fil span::before { content: "›"; margin-right: 0.5rem; opacity: .55; }
.fil span:last-child { color: var(--fg-titre); }
body.a-defile .onglets { top: var(--haut-compacte, 4.25rem); }
body.a-defile .onglets__cta { opacity: 1; pointer-events: auto; }
/* Pied de page */
.pa-pied { border-radius: 0; }
.pied-grille { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: var(--sp-l); }   /* 4 colonnes de liens depuis le 2026-11-08 (« Mon compte ») */
.pied-grille ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pied-logo { display: flex; flex-direction: column; gap: 4px; }
.pied-logo .p { width: 60px; height: 67px; fill: var(--pa-turquoise); }
.pied-logo .t { width: 92px; height: 36px; fill: #fff; }
.pied-bas { margin-top: var(--sp-l); padding-top: var(--sp-s); border-top: 1px solid rgba(255,255,255,.12); display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; justify-content: space-between; font-size: var(--fs-xs); }
@media (max-width: 900px) {
  .pied-grille { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .pied-grille > :first-child { grid-column: 1 / -1; }
  .pa-pied { padding-bottom: calc(var(--sp-m) + 4.5rem); }
}
.pa-pied { padding-inline: max(var(--gouttiere), calc((100% - var(--largeur-max)) / 2 + var(--gouttiere))); }
.pa-btn-menu { background: var(--pa-noir); border-color: var(--pa-noir); }
.pa-btn-menu:hover { background: #3a3738; }
.pa-btn-icone .pa-pastille-compte { background: var(--pa-jaune); }
/* Barre haute grise : liens vers l'école, les baptêmes et l'atelier */
.pa-barre-haute { background: var(--gris-barre); height: 2.625rem; padding-inline: max(var(--gouttiere), calc((100% - var(--largeur-max)) / 2 + var(--gouttiere))); }
.pa-barre-haute__groupe { gap: 2rem; }
.pa-barre-haute a { padding: 0; font: 600 0.875rem/1 var(--font-texte); color: var(--pa-encre); }
.pa-barre-haute a:hover, .pa-barre-haute a[aria-current="page"] { color: var(--pa-noir); }
.pa-barre-haute a[aria-current="page"]::after { left: 0; right: 0; height: 2px; border-radius: 0; }
.pa-barre-haute svg { opacity: .75; }
.pa-barre-haute .pa-tel, .pa-barre-haute .pa-tel:hover { color: var(--pa-turquoise-text); font-weight: 700; }
/* En-tête : logo, menu encadré (liens + bon cadeau), icônes sur fond gris */
.pa-entete { max-width: var(--largeur-max); margin-inline: auto; box-sizing: border-box; padding-block: 0.875rem; gap: clamp(1rem, 0.2rem + 1.6vw, 2.5rem); }
.pa-entete > .pa-pilule { flex: 1 1 auto; justify-content: space-between; gap: 0.75rem; padding: 0.75rem 0.75rem 0.75rem clamp(1.25rem, 0.4rem + 1.2vw, 2rem); min-height: 4.375rem; box-sizing: border-box;
    background: #fff; border: 1px solid rgba(41,39,40,.18); border-radius: 24px; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.pa-entete .pa-pilule__lien, .pa-pilule--compacte .pa-pilule__lien { padding: 0.6rem 0; font: 600 1rem/1 var(--font-texte); color: var(--pa-encre); }
.pa-entete .pa-pilule__lien::after, .pa-pilule--compacte .pa-pilule__lien::after { left: 0; right: 0; bottom: 0.1rem; }
.pa-entete .pa-pilule__lien:hover, .pa-pilule--compacte .pa-pilule__lien:hover { color: var(--pa-noir); }
.pa-entete .pa-entete__cta { margin-left: 0.5rem; padding: 0.8em 1.4em; font-size: 1rem; border-radius: 14px; }
.pa-entete__icones { gap: 0.5rem; }
.pa-entete__icones .pa-btn-icone { border-radius: 12px; background: var(--gris-barre); border: 0; }
.pa-entete__icones .pa-btn-icone:hover { background: var(--pa-turquoise-50); color: var(--pa-turquoise-text); }
.pa-entete__icones .pa-pastille-compte { border-color: #fff; }
@media (max-width: 1399px) {
  .pa-entete .pa-entete__cta { display: none; }
  .pa-entete > .pa-pilule { padding-right: clamp(1.25rem, 0.4rem + 1.2vw, 2rem); }
}
.pa-entete .pa-btn-menu { border-radius: 12px; }
/* Pilule compacte au défilement : mêmes tailles de police que le menu */
.pa-pilule--compacte { gap: 0.25rem 1.35rem; padding-right: 0.4rem; }
.pa-pilule--compacte .pa-pilule__picto { margin-right: 0; }
.pa-btn-icone, .pa-btn-menu, .pa-entete .pa-entete__cta, .pa-entete__icones .pa-btn-icone, .pa-entete .pa-btn-menu { border-radius: var(--r-bouton); }
.pa-pilule--compacte { border-radius: 999px; }
.pa-pilule__picto { border-radius: 50%; }
/* ── Variantes du menu (sélecteur en bas à gauche) ── */
.pa-entete .pa-pilule__lien, .pa-pilule--compacte .pa-pilule__lien { font: var(--menu-graisse) var(--menu-taille)/1 var(--menu-police); text-transform: var(--menu-casse); letter-spacing: var(--menu-espace); color: var(--pa-noir); }
.pa-entete .pa-entete__cta { font: 700 1rem/1 var(--font-texte); padding: 0.85em 1.3em; gap: 0.55rem; }
@media (max-width: 1399px) {
  .pa-entete .pa-entete__cta { display: inline-flex; }
  .pa-entete > .pa-pilule { padding-right: 0.75rem; }
}
@media (max-width: 1299px) {
  .pa-entete .pa-entete__cta { display: none; }
  .pa-entete > .pa-pilule { padding-right: clamp(1.25rem, 0.4rem + 1.2vw, 2rem); }
}
.pa-entete__icones .pa-btn-icone { background: #fff; border: 1px solid var(--bord); }
.pa-entete__icones .pa-btn-icone:hover { background: var(--pa-turquoise-50); border-color: var(--pa-turquoise-300); color: var(--pa-turquoise-text); }
.pa-entete > .pa-pilule { background: none; border: 0; padding-inline: 0; justify-content: center; gap: clamp(1.25rem, 0.2rem + 1.6vw, 2.5rem); }
.pa-entete .pa-entete__cta { margin-left: clamp(0.5rem, 1vw, 1.5rem); }
.haut { border-bottom: 1px solid var(--bord); }
/* Bon cadeau discret (C, G, H) : même dessin que les icônes, avec le texte */
.pa-entete .pa-entete__cta { box-sizing: border-box; height: 2.75rem; padding: 0 1rem 0 0.85rem; background: #fff; border: 1px solid var(--bord); color: var(--pa-noir); font: 600 0.9375rem/1 var(--font-texte); }
.pa-entete .pa-entete__cta svg { color: var(--pa-turquoise-text); }
.pa-entete .pa-entete__cta:hover { background: var(--pa-turquoise-50); border-color: var(--pa-turquoise-300); color: var(--pa-turquoise-text); transform: none; }
.haut { position: relative; z-index: 20; }
.pa-entete { position: relative; padding-left: calc(var(--gouttiere) + var(--logo-l) + clamp(1rem, 0.2rem + 1.6vw, 2.5rem)); }
.pa-entete__logo { position: absolute; left: var(--gouttiere); top: 0; z-index: 5; box-sizing: border-box; width: var(--logo-l); height: var(--logo-h);
    flex-direction: column; justify-content: center; gap: 0.3rem; padding: 0.75rem; border: 1px solid var(--bord-fort); border-top: 0; border-radius: 0 0 14px 14px;
    background: linear-gradient(180deg, #f1f1f1 0%, #fff 100%); box-shadow: 0 14px 30px rgba(41,39,40,.08); }
.pa-entete__logo .pa-logo-picto { height: calc(var(--logo-h) * 0.42); width: calc(var(--logo-h) * 0.42 * 0.894); }
.pa-entete__logo .pa-logo-texte { width: calc(var(--logo-l) * 0.7); height: calc(var(--logo-l) * 0.7 / 2.6); }
@media (max-width: 1179px) {
  .pa-entete__logo { border-top: 1px solid var(--bord-fort); border-radius: 0 0 12px 12px; }
}
.pa-entete__logo { background: linear-gradient(180deg, #3a3738 0%, var(--pa-noir) 100%); border-color: var(--pa-noir); box-shadow: 0 14px 30px rgba(41,39,40,.22); }
.pa-entete__logo .pa-logo-texte { fill: #fff; }
/* Le fil d'Ariane commence à droite de l'onglet */
.fil { padding-left: calc(var(--logo-l) + 1.25rem); min-height: calc(var(--logo-h) - 4.9rem); align-content: center; }
@media (max-width: 1179px) {
  .fil { min-height: calc(var(--logo-h) - 3.5rem); }
}
@media (min-width: 1180px) {
  .pa-entete__logo { top: -2.625rem; height: calc(var(--logo-h) + 2.625rem); padding-top: 1.6rem; }
  .pa-barre-haute { padding-left: calc(max(var(--gouttiere), (100% - var(--largeur-max)) / 2 + var(--gouttiere)) + var(--logo-l) + 1.75rem); }
}
.pa-entete__logo { width: var(--logo-l); height: var(--logo-haut); padding: calc(var(--pad-logo) - var(--pad-logo) * 0.18) var(--pad-logo) calc(var(--pad-logo) - var(--pad-logo) * 0.06); justify-content: space-between; gap: 0; }
.pa-entete__logo .pa-logo-picto { width: calc(var(--logo-lw) * 0.7115); height: calc(var(--logo-lw) * 0.798); }
.pa-entete__logo .pa-logo-texte { width: var(--logo-lw); height: calc(var(--logo-lw) / 2.6); }
@media (min-width: 1180px) {
  .pa-entete { min-height: var(--entete-h); padding-block: 0; }
  .pa-entete > .pa-pilule { min-height: 0; padding-block: 0; }
  .fil { min-height: calc(var(--depasse) + 1.25rem); }
}
.haut { background: #fff; }
/* H : dégradé à peine perceptible dans l'onglet noir du logo, réglable (intensité et sens) */
.pa-entete__logo { background: linear-gradient(var(--r-degrade-sens, 180deg), color-mix(in srgb, #fff var(--r-degrade, 7.5%), var(--pa-noir)) 0%, var(--pa-noir) 100%); }
/* V4c : barre du haut, seulement les autres univers, collés à droite */
.pa-barre-haute { justify-content: flex-end; gap: 2rem; }
.pa-barre-haute__groupe + .pa-barre-haute__groupe { padding-left: 2rem; border-left: 1px solid rgba(41,39,40,.14); }
.pa-barre-haute__groupe:last-child a { padding-inline: 0; }
@media (min-width: 1180px) {
  .pa-barre-haute { padding-left: max(var(--gouttiere), calc((100% - var(--largeur-max)) / 2 + var(--gouttiere))); }
}
.prix-ligne .pa-btn .pa-defile { flex: 1 1 auto; text-align: center; }
/* Boutons de l'en-tête (recherche, compte, panier, bons cadeaux) : liseré turquoise, 5 versions */
.pa-entete__icones .pa-btn-icone, .pa-entete .pa-entete__cta { transition: background var(--t-rapide), border-color var(--t-rapide), color var(--t-rapide); }
.pa-entete__icones .pa-btn-icone, .pa-entete .pa-entete__cta { background: #fff; border: 1px solid var(--pa-turquoise); color: var(--pa-noir); }
.pa-entete__icones .pa-btn-icone:hover, .pa-entete .pa-entete__cta:hover { background: var(--pa-noir); border-color: var(--pa-noir); color: var(--pa-turquoise); }
.pa-entete .pa-entete__cta svg { color: inherit; }
.pa-entete .pa-entete__cta svg { color: var(--pa-turquoise-text); }
.pa-entete .pa-entete__cta:hover svg { color: var(--pa-turquoise); }
/* Barre du haut : un filet entre chaque lien, survol turquoise lisible de la charte */
.pa-barre-haute, .pa-barre-haute__groupe { gap: 0; }
.pa-barre-haute__groupe + .pa-barre-haute__groupe { padding-left: 0; border-left: 0; }
.pa-barre-haute a, .pa-barre-haute__groupe:last-child a { padding-inline: 1.15rem; }
.pa-barre-haute__groupe:last-child a:last-child { padding-right: 0; }
.pa-barre-haute a + a::before, .pa-barre-haute__groupe + .pa-barre-haute__groupe a:first-child::before {
    content: ""; position: absolute; left: 0; top: 50%; height: 1.1rem; transform: translateY(-50%); border-left: 1px solid rgba(41,39,40,.16); }
.pa-barre-haute a, .pa-barre-haute a svg { transition: color var(--t-rapide), opacity var(--t-rapide); }
.pa-barre-haute a:hover, .pa-barre-haute .pa-tel:hover { color: var(--pa-turquoise-text); }
.pa-barre-haute a:hover svg { opacity: 1; }
/* valeurs retenues par Bastien */
/* 11/11/2026 : barre à la couleur du fond de page, sans dégradé, simple filet en bas (Bastien : équilibrer les couleurs) */
.pa-barre-haute { background: var(--bg-page); box-shadow: inset 0 -1px 0 rgba(41,39,40,.06); }
/* Barre compacte du défilement : verre dépoli légèrement transparent, carré arrondi, boutons de la charte */
.compacte { background: transparent; }
body.a-defile .onglets { top: calc(var(--haut-compacte, 4.25rem) - 0.5rem); }
.pa-pilule.pa-pilule--compacte { border-radius: 14px; background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(16px) saturate(1.5); backdrop-filter: blur(16px) saturate(1.5);
    border: 1px solid rgba(41,39,40,.08); box-shadow: 0 10px 30px rgba(41,39,40,.10), 0 1px 3px rgba(41,39,40,.06); padding: 0.35rem 0.4rem; gap: 0.25rem 1.35rem; }
.pa-pilule--compacte .pa-pilule__picto { width: 2.5rem; height: 2.5rem; border-radius: 8px; margin-right: 0.15rem;
    background: linear-gradient(180deg, color-mix(in srgb, #fff 7.5%, var(--pa-noir)) 0%, var(--pa-noir) 100%); }
.pa-pilule--compacte .pa-pilule__picto svg { width: 1.6rem; height: 1.6rem; }
.pa-pilule--compacte .pa-btn-icone { width: 2.5rem; height: 2.5rem; border-radius: 8px; background: #fff; border: 1px solid var(--pa-turquoise); color: var(--pa-noir); }
.pa-pilule--compacte .pa-btn-icone:hover { background: var(--pa-noir); border-color: var(--pa-noir); color: var(--pa-turquoise); }
.pa-pilule--compacte .pa-btn-icone + .pa-btn-icone { margin-left: -0.85rem; }
.pa-pilule--compacte .pa-pastille-compte { border-color: #fff; }
.pa-pilule--compacte .pa-btn-menu { height: 2.5rem; border-radius: 8px; }
@media (max-width: 1179px) {
  .pa-pilule.pa-pilule--compacte { column-gap: 0.5rem; }
  .pa-pilule--compacte .pa-btn-icone + .pa-btn-icone { margin-left: 0; }
  .pa-pilule--compacte .pa-pilule__marque { margin-left: 0.15rem; }
}
/* Fil d'Ariane : une petite maison à la place d'« Accueil » */
.fil__accueil { display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; margin-left: -0.2rem; border-radius: 6px; color: var(--fg-secondaire); transition: color var(--t-rapide), background var(--t-rapide); }
.fil__accueil svg { width: 1.1rem; height: 1.1rem; }
.fil .fil__accueil:hover { color: var(--pa-turquoise-text); background: var(--pa-turquoise-50); }
@media (min-width: 640px) {
  .fil { --fil-h: calc(var(--logo-h) - 72px); --fil-ajust: 2px; --maison-ajust: 1px; height: var(--fil-h); min-height: 0; padding-top: 0; padding-bottom: 0;
      align-items: flex-end; align-content: flex-end; flex-wrap: nowrap; line-height: 1; margin-bottom: calc(var(--sp-s) + var(--fil-ajust, 0px)); }
  .fil > * { position: relative; top: var(--fil-ajust, 0px); }
}
@media (min-width: 1180px) {
  .fil { --fil-h: var(--depasse); }
}
.fil__accueil { align-self: flex-end; height: auto; width: auto; padding: 0 0.15rem; margin-bottom: var(--maison-ajust, 0px); }
/* Barre des rubriques collée : un aplat blanc plein remonte jusqu'en haut de l'écran, derrière la barre flottante (qui reste transparente) */
body.a-defile .onglets { top: var(--haut-compacte, 4.25rem); }
/* Pied de page détaché du bandeau d'aide, coins du haut arrondis */
.pa-pied { margin-top: calc(2 * var(--gouttiere)); border-radius: 16px 16px 0 0; }
@media (max-width: 1179px) {
  .pa-entete__icones { margin-left: auto; }
}
@media (max-width: 639px) {
  .fil { display: none; }
}
@media (max-width: 900px) {
  .pa-pied { padding-bottom: var(--sp-m); }
}
/* ── Menu mobile (tiroir) ── */
.pa-tiroir { border-radius: 16px; }
.pa-tiroir__tete { padding: 0.75rem 0.75rem 0.75rem var(--sp-s); min-height: 4rem; box-sizing: border-box; }
.pa-tiroir__actions { display: flex; gap: 0.4rem; }
.pa-tiroir__tete .pa-btn-icone { width: 2.75rem; height: 2.75rem; border-radius: 8px; background: #fff; border: 1px solid var(--pa-turquoise); color: var(--pa-noir); }
.pa-tiroir__tete .pa-btn-icone:hover { background: var(--pa-noir); border-color: var(--pa-noir); color: var(--pa-turquoise); }
/* Fermer : même aspect que le bouton menu de l en-tête (fond noir), pour le distinguer des contacts encadrés de turquoise */
.pa-tiroir__tete .pa-tiroir__fermer { margin-left: 0.2rem; background: var(--pa-noir); border-color: var(--pa-noir); color: #fff; }
.pa-tiroir__tete .pa-tiroir__fermer:hover { background: #3a3738; border-color: #3a3738; color: #fff; }
.tiroir-logo { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.tiroir-logo__picto { display: grid; place-items: center; flex: none; }
.tiroir-logo__picto svg { fill: var(--pa-turquoise); }
.tiroir-logo__texte { fill: var(--pa-noir); }
/* C (conseillé) : pictogramme dans un carré noir, comme la barre au défilement, et le nom à côté */
.tiroir-logo__picto { width: 2.75rem; height: 2.75rem; border-radius: 8px; background: linear-gradient(180deg, color-mix(in srgb, #fff 7.5%, var(--pa-noir)) 0%, var(--pa-noir) 100%); }
.tiroir-logo__picto svg { width: 1.75rem; height: 1.95rem; }
.tiroir-logo__texte { width: 4.4rem; height: 1.7rem; }
/* Univers : École, Baptêmes, Atelier (on est déjà dans la boutique) ; téléphone au style des boutons de la charte */
.pa-tiroir__univers { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.4rem; }
.pa-tiroir__univers a { border-radius: 8px; background: #fff; }
/* Rubriques : carrés arrondis, plus de pilules */
.pa-tiroir__rubrique, .pa-tiroir__rubrique > summary, .pa-tiroir__lien-simple { border-radius: 8px; }
.pa-tiroir__liens a { border-radius: 6px; }
/* Pied : trois boutons au style des icônes de l'en-tête, sur toute la largeur */
.pa-tiroir__secondaires { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.tiroir-bouton { display: flex; align-items: center; justify-content: center; gap: 0.55rem; height: 3rem; border-radius: 8px; background: #fff; border: 1px solid var(--pa-turquoise);
    color: var(--pa-noir); font: 700 var(--fs-sm)/1 var(--font-texte); text-decoration: none; transition: background var(--t-rapide), border-color var(--t-rapide), color var(--t-rapide); }
.tiroir-bouton svg { width: 1.2rem; height: 1.2rem; color: var(--pa-turquoise-text); transition: color var(--t-rapide); }
.tiroir-bouton:hover { background: var(--pa-noir); border-color: var(--pa-noir); color: #fff; text-decoration: none; }
.tiroir-bouton:hover svg { color: var(--pa-turquoise); }
/* Menu mobile : intertitres de groupes, niveaux experts, lien « tout voir » */
.tiroir-groupe { display: block; margin: 0.7rem 0 0.15rem 0.7rem; font: 800 var(--fs-2xs)/1 var(--font-texte); letter-spacing: 0.1em; text-transform: uppercase; color: var(--fg-secondaire); }
.tiroir-groupe:first-child { margin-top: 0.3rem; }
.pa-tiroir__liens .pa-en { gap: 0.6rem; font: 600 var(--fs-sm)/1.25 var(--font-texte); color: var(--fg-titre); }
.pa-tiroir__liens .pa-en b { min-width: 2.1rem; }
.pa-tiroir__liens a.tiroir-tout { margin-top: 0.5rem; border-top: 1px solid var(--bord); border-radius: 0; padding-top: 0.8rem; font-weight: 800; color: var(--pa-turquoise-text); }
.tiroir-bons-plans > summary { color: var(--pa-noir); }
.tiroir-bons-plans > summary::before { content: ""; width: 0.5rem; height: 0.5rem; margin-right: -0.1rem; border-radius: 50%; background: var(--pa-jaune); order: -1; flex: none; }
.tiroir-bons-plans > summary { justify-content: flex-start; }
.tiroir-bons-plans > summary::after { margin-left: auto; }
@media (max-width: 639px) {
  .pa-pied { padding: var(--sp-l) var(--sp-m) var(--sp-m); }
  .pied-grille { grid-template-columns: 1fr 1fr; gap: var(--sp-m) var(--sp-s); }
  .pied-grille > :first-child { grid-column: 1 / -1; }
  /* Quatre colonnes de liens depuis le 2026-11-08 : deux par ligne, « Aide » ne prend plus toute la largeur */
  .pied-bas { flex-direction: column; align-items: flex-start; gap: 0.35rem; }
}
@media (max-width: 900px) {
  .pa-pied { padding-bottom: calc(var(--sp-m) + 4.75rem); }
}
@media (max-width: 1399px) {
  .pa-entete .pa-entete__cta { display: none; }
}
/* ── Méga-menus (ordinateur) ── */
.mega-calque { display: none; }
@media (min-width: 1180px) {
  .mega-calque { display: block; position: fixed; left: 0; right: 0; top: 0; z-index: 44; pointer-events: none; }
}
.mega { display: none; pointer-events: auto; box-sizing: border-box; width: min(100% - 2 * var(--gouttiere), var(--largeur-max) - 2 * var(--gouttiere)); margin: 0 auto;
    gap: var(--sp-m) var(--sp-l); padding: var(--sp-l); background: #fff; border: 1px solid var(--bord); border-radius: 16px; box-shadow: 0 24px 60px rgba(41,39,40,.16), 0 2px 6px rgba(41,39,40,.06);
    overflow-y: auto; max-height: var(--mega-max, 70vh); }
.mega.is-ouvert { display: grid; animation: mega-entree 160ms cubic-bezier(.2,.7,.3,1); }
@keyframes mega-entree { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .mega.is-ouvert { animation: none; }
}
.mega__titre { margin: 0 0 0.6rem; font: 800 var(--fs-2xs)/1 var(--font-texte); letter-spacing: 0.1em; text-transform: uppercase; color: var(--fg-secondaire); }
.mega__titre--suite { margin-top: var(--sp-s); }
.mega__liste { display: grid; gap: 0.1rem; }
.mega__liste a { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.45rem 0.6rem; margin-inline: -0.6rem; border-radius: 6px;
    font: 600 var(--fs-sm)/1.25 var(--font-texte); color: var(--pa-noir); text-decoration: none; transition: background var(--t-rapide), color var(--t-rapide); }
.mega__liste a:hover { background: var(--pa-turquoise-50); color: var(--pa-turquoise-text); }
.mega__liste small { font: 600 var(--fs-2xs)/1 var(--font-texte); color: var(--fg-secondaire); }
.mega__liste .pa-en { gap: 0.6rem; font: 600 var(--fs-sm)/1.25 var(--font-texte); color: inherit; }
.mega__liste .pa-en b { min-width: 2.1rem; }
.mega__col--marques .mega__liste { grid-template-columns: 1fr 1fr; column-gap: var(--sp-m); }
.mega__promo { grid-column: -2 / -1; grid-row: 1; display: grid; grid-template-rows: auto 1fr; overflow: hidden; border-radius: 12px; background: var(--pa-noir); color: rgba(255,255,255,.75); text-decoration: none; align-self: start; }
.mega__promo-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; position: relative; }
/* Liseré gris fin autour de la partie image : détache les photos détourées sur fond blanc */
.mega__promo-img::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(41,39,40,.14); border-bottom: 0; border-radius: 12px 12px 0 0; pointer-events: none; }
.mega__promo-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 400ms cubic-bezier(.2,.7,.3,1); }
.mega__promo--produit .mega__promo-img { background: #fff; }
.mega__promo--produit .mega__promo-img img { object-fit: contain; padding: 0.75rem; box-sizing: border-box; }
.mega__promo:hover .mega__promo-img img { transform: scale(1.04); }
.mega__promo-texte { display: grid; gap: 0.35rem; padding: var(--sp-s); font-size: var(--fs-xs); line-height: 1.5; }
.mega__accroche { font: 800 var(--fs-2xs)/1 var(--font-texte); letter-spacing: 0.1em; text-transform: uppercase; color: var(--pa-turquoise); }
.mega__promo b { font: 800 var(--fs-md)/1.2 var(--font-titre); color: #fff; }
.mega__promo-lien { margin-top: 0.25rem; font-weight: 700; color: var(--pa-turquoise); }
.mega__promo-lien::after { content: " →"; }
.mega__bas { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.5rem; padding-top: var(--sp-s); border-top: 1px solid var(--bord); }
.mega__bas a { font: 600 var(--fs-sm)/1 var(--font-texte); color: var(--fg-texte); text-decoration: none; }
.mega__bas a:hover { color: var(--pa-turquoise-text); }
.mega__bas .mega__tout { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 800; color: var(--pa-turquoise-text); }
.mega__bas .mega__tout small { font-weight: 600; color: var(--fg-secondaire); }
/* Petit menu déroulant (Casques, Bons plans) : sous la rubrique, pas sur toute la largeur */
.mega--petit { width: 17rem; margin: 0; padding: var(--sp-s) var(--sp-m); gap: var(--sp-xs); }
.mega--petit .mega__bas { padding-top: var(--sp-xs); }
/* Rubrique ouverte : soulignée comme au survol */
.pa-pilule__lien[aria-expanded="true"] { color: var(--pa-noir); }
.pa-pilule__lien[aria-expanded="true"]::after { transform: scaleX(1); }
@media (max-width: 1559px) {
  .pa-entete .pa-entete__cta { display: none; }
}
@media (max-width: 1279px) {
  .pa-entete > .pa-pilule { gap: 0.95rem; }
}
@media (min-width: 1180px) and (max-width: 1279px) {
  .pa-pilule.pa-pilule--compacte { column-gap: 0.95rem; }
}
/* ── Réseaux sociaux ── */
.rs-liste { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.rs-liste a { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; text-decoration: none; transition: background var(--t-rapide), border-color var(--t-rapide), color var(--t-rapide); }
.rs-liste svg { width: 1.15rem; height: 1.15rem; flex: none; }
/* Pied B : bandeau avec les noms */
.rs-bande { margin-top: var(--sp-l); padding: var(--sp-s) 0 0; border-top: 1px solid rgba(255,255,255,.12); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-s); }
.rs-bande__texte { display: grid; gap: 0.2rem; }
.rs-bande__texte b { color: #fff; font: 800 var(--fs-md)/1.2 var(--font-titre); }
.rs-bande__texte span { font-size: var(--fs-xs); }
.pa-pied .rs-liste--noms a { height: 2.5rem; padding: 0 0.95rem; border-radius: 8px; border: 1px solid rgba(255,255,255,.22); color: #fff; font-weight: 700; font-size: var(--fs-xs); }
.pa-pied .rs-liste--noms svg { color: var(--pa-turquoise); }
.pa-pied .rs-liste--noms a:hover { background: var(--pa-turquoise); border-color: var(--pa-turquoise); color: var(--pa-noir); }
.pa-pied .rs-liste--noms a:hover svg { color: var(--pa-noir); }
.rs-bande + .pied-bas { margin-top: var(--sp-s); }
/* Pied C : petites icônes dans la ligne du bas */
.pied-bas__droite { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 1.1rem; }
.pa-pied .pied-bas a { font-size: var(--fs-xs); }
.pied-wa { display: inline-flex; align-items: center; gap: 0.35rem; }
.pied-wa svg { width: 1rem; height: 1rem; color: var(--pa-turquoise); }
.pa-pied .pied-wa:hover { color: #fff; }
/* Menu mobile */
/* Bas du menu mobile : bons cadeaux à gauche, réseaux à droite, chacun sous sa petite étiquette */
.tiroir-bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 0.5rem; margin-top: 0.5rem; }
.tiroir-bas__groupe { display: grid; gap: 0.5rem; }
.tiroir-bas__groupe > span:first-child { font: 800 var(--fs-2xs)/1 var(--font-texte); letter-spacing: 0.1em; text-transform: uppercase; color: var(--fg-secondaire); white-space: nowrap; }
.tiroir-bas .rs-liste { flex-wrap: nowrap; }
@media (max-width: 359px) {
  .tiroir-bas .rs-liste { gap: 0.3rem; }
  .tiroir-bas .rs-liste--tiroir a { width: 2.4rem; height: 2.4rem; }
  .tiroir-bas__groupe > span:first-child { letter-spacing: 0.05em; }
}
.rs-liste--tiroir { gap: 0.4rem; }
.rs-liste--tiroir a { width: 2.75rem; height: 2.75rem; border-radius: 8px; background: #fff; border: 1px solid var(--pa-turquoise); color: var(--pa-noir); }
.rs-liste--tiroir a:hover { background: var(--pa-noir); border-color: var(--pa-noir); color: var(--pa-turquoise); }
/* Partager A : icône carrée v3 à droite du titre */
.infos > div:has(> .rs-partager--icone:not([hidden])) { position: relative; padding-right: 3.5rem; }
.rs-partager { cursor: pointer; font: inherit; }
.rs-partager--icone { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 8px; background: #fff; border: 1px solid var(--pa-turquoise); color: var(--pa-noir); transition: background var(--t-rapide), color var(--t-rapide), border-color var(--t-rapide); }
.rs-partager--icone svg { width: 1.15rem; height: 1.15rem; }
.rs-partager--icone:hover { background: var(--pa-noir); border-color: var(--pa-noir); color: var(--pa-turquoise); }
/* Partager B : lien texte dans la ligne des avis */
.rs-partager--texte { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0; border: 0; background: none; font-size: var(--fs-xs); font-weight: 700; color: var(--pa-turquoise-text); }
.rs-partager--texte svg { width: 0.95rem; height: 0.95rem; }
.rs-partager--texte:hover { color: var(--fg-lien-hover); }
/* Menu de partage (ordinateur) */
.rs-menu { position: absolute; z-index: 60; min-width: 13rem; padding: 0.35rem; border-radius: 12px; background: #fff; border: 1px solid var(--bord); box-shadow: 0 14px 34px rgba(41,39,40,.14); display: grid; }
.rs-menu a, .rs-menu button { display: flex; align-items: center; gap: 0.65rem; padding: 0.6rem 0.7rem; border: 0; border-radius: 8px; background: none; font: 600 var(--fs-sm)/1.2 var(--font-texte); color: var(--fg-titre); text-decoration: none; cursor: pointer; text-align: left; }
.rs-menu svg { width: 1.1rem; height: 1.1rem; color: var(--pa-turquoise-text); }
.rs-menu a:hover, .rs-menu button:hover { background: var(--pa-turquoise-50); }
.rs-copie { position: fixed; left: 50%; bottom: 1.5rem; z-index: 90; transform: translateX(-50%); padding: 0.7rem 1.1rem; border-radius: 8px; background: var(--pa-noir); color: #fff; font: 700 var(--fs-sm)/1 var(--font-texte); box-shadow: 0 10px 30px rgba(41,39,40,.25); }
@media (max-width: 999px) {
  .rs-copie { bottom: 6rem; }
}
/* Les groupes du tunnel sont placés en dernier : le dernier lien habituel garde sa marge nulle, l'aide du tunnel garde la sienne */
.pa-barre-haute__groupe:has(+ .pn-rassure-haut) a:last-child { padding-right: 0; }
.pa-barre-haute .pn-aide-haut a:last-child { padding-right: 1.15rem; }
/* Barre flottante cachée à la descente, rappelée à la remontée : les barres collées montent avec elle */
body.a-defile.entete-cache .compacte { transform: translateY(-140%); }
body.entete-cache { --haut-compacte: 0.5rem; }
.lc-outils { transition: top 380ms cubic-bezier(.2,.7,.3,1); }
/* ── Menus (tiroir mobile, méga-menu Parapentes) : pratiques en photos, marques principales en logos, les autres en texte (décision du 2026-10-13) ── */
.tiroir-photos, .tiroir-logos, .mega-logos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.45rem; margin: 0.35rem 0 0.2rem; }
.pa-tiroir__liens .tiroir-photos, .pa-tiroir__liens .tiroir-logos { margin-inline: 0.3rem; }
.pa-tiroir__liens a.tiroir-photo { position: relative; display: block; aspect-ratio: 4 / 3; padding: 0; border-radius: 10px; overflow: hidden; background: var(--pa-noir); isolation: isolate; }
.tiroir-photo img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.tiroir-photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(20,19,19,.85) 0%, rgba(20,19,19,.25) 60%, rgba(20,19,19,.05) 100%); }
.tiroir-photo span { position: absolute; left: 0.5rem; right: 0.45rem; bottom: 0.45rem; font: 800 0.75rem/1.15 var(--font-titre); color: #fff; }
.pa-tiroir__liens .tiroir-photo small { position: absolute; top: 0.4rem; right: 0.4rem; min-width: 1.3rem; padding: 0.15rem 0.35rem; box-sizing: border-box; border-radius: 6px;
  background: rgba(255,255,255,.92); font: 800 0.6875rem/1.1 var(--font-texte); color: var(--pa-noir); text-align: center; }
.pa-tiroir__liens a.menu-logo, .mega a.menu-logo { position: relative; display: grid; place-items: center; height: 3.4rem; margin: 0; padding: 0.4rem 0.7rem; box-sizing: border-box;
  border-radius: 10px; border: 1px solid var(--bord-fort); background: #fff; color: var(--fg-texte); text-decoration: none; transition: border-color var(--t-rapide); }
.pa-tiroir__liens a.menu-logo:hover, .mega a.menu-logo:hover { background: #fff; border-color: var(--pa-noir); }
.menu-logo i { position: absolute; inset: 1rem 0.7rem 0.55rem; background: currentColor; -webkit-mask: var(--logo) center / contain no-repeat; mask: var(--logo) center / contain no-repeat; }
.menu-logo span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pa-tiroir__liens .menu-logo small, .mega .menu-logo small { position: absolute; top: 0.25rem; right: 0.35rem; font: 700 0.625rem/1 var(--font-texte); color: var(--fg-secondaire); }
.menu-marques-texte { display: flex; flex-wrap: wrap; align-items: center; gap: 0.1rem 0.9rem; margin: 0.35rem 0 0; padding-inline: 0.3rem; }
.pa-tiroir__liens .menu-marques-texte a, .mega .menu-marques-texte a { display: inline-flex; align-items: baseline; gap: 0.3rem; margin: 0; padding: 0.4rem 0; border-radius: 0;
  font: 600 var(--fs-sm)/1.2 var(--font-texte); color: var(--fg-titre); text-decoration: none; }
.pa-tiroir__liens .menu-marques-texte a:hover, .mega .menu-marques-texte a:hover { background: none; color: var(--pa-turquoise-text); }
.menu-marques-texte small { font: 600 var(--fs-2xs)/1 var(--font-texte); color: var(--fg-secondaire); }
.mega .mega-logos { margin-top: 0; }
.mega .menu-marques-texte { padding-inline: 0; }

/* Lien mis en avant dans un sous-menu (packs débutant, 2026-10-13) : mini carte autour du lien existant */
.mega__liste a.lien-vedette, .pa-tiroir__liens a.lien-vedette { margin-block: 0.15rem 0.35rem; padding-block: 0.6rem; border: 1px solid var(--pa-turquoise); border-radius: 8px; background: var(--pa-turquoise-50); font-weight: 800; color: var(--fg-titre); box-shadow: 0 4px 12px rgba(32,196,195,.15); }
.mega__liste a.lien-vedette:hover, .pa-tiroir__liens a.lien-vedette:hover { background: var(--pa-turquoise); color: var(--pa-noir); }
/* Texte et compteur alignés sur ceux des autres liens : la carte déborde dans la marge, comme le fond de survol */
.mega__liste a.lien-vedette { margin-inline: -0.75rem; padding-inline: calc(0.75rem - 1px); }
.pa-tiroir__liens a.lien-vedette { align-items: center; padding-inline: calc(0.7rem - 1px); }
a.lien-vedette small { padding: 0.2rem 0.45rem; border-radius: var(--r-pilule); background: var(--pa-noir); color: var(--pa-jaune); font-weight: 800; }

/* Colonnes de chaque méga-menu (sorties du gabarit le 2026-10-13 : le thème génère les menus) */
.mega[data-panneau="parapentes"] { grid-template-columns: 1fr 1fr 1fr 1.5fr 17rem; }
.mega[data-panneau="sellettes"] { grid-template-columns: 1.1fr 1fr 1.6fr 17rem; }
.mega[data-panneau="secours"] { grid-template-columns: 16rem 16rem 1fr 17rem; }
.mega[data-panneau="sacs"] { grid-template-columns: 16rem 16rem 1fr 17rem; }
.mega[data-panneau="electronique"] { grid-template-columns: 16rem 16rem 1fr 17rem; }
.mega[data-panneau="accessoires"] { grid-template-columns: 15rem 15rem 15rem 1fr 17rem; }

/* Médias des panneaux cachés (tiroir, méga-menus, fenêtres) : rien n'est téléchargé avant la première interaction (PageSpeed, 2026-10-13).
   Les images portent data-src, les logos sont masqués ; commun.js pose la classe medias-chargees et les adresses. */
body:not(.medias-chargees) :is(.pa-tiroir, .mega) .menu-logo i { -webkit-mask: none; mask: none; visibility: hidden; }

/* Corrections de Bastien (2026-11-08) */
/* n°7 : dans le tiroir, le lien de la page en cours, sur le même fond que la rubrique ouverte, avec un trait à gauche */
.pa-tiroir__liens a[aria-current="page"] { background: var(--pa-turquoise-50); font-weight: 800; box-shadow: inset 3px 0 0 var(--pa-turquoise); }
.pa-tiroir__liens a.tiroir-photo[aria-current="page"] { box-shadow: 0 0 0 3px var(--pa-turquoise); }
.pa-tiroir__liens a.menu-logo[aria-current="page"] { border-color: var(--pa-turquoise); box-shadow: 0 0 0 1px var(--pa-turquoise); }
/* n°14 retirée le 2026-11-08 (correction n°40) : le lien mis en avant (« Packs débutant ») reprend sa mini carte turquoise,
   la position dans le menu se lisant au trait à gauche */
.pa-tiroir__liens a.lien-vedette[aria-current="page"] { color: var(--fg-titre); }
/* n°47 : dans les méga-menus aussi, le lien de la page en cours marqué comme dans le tiroir (fond turquoise clair, trait à gauche) */
.mega__liste a[aria-current="page"] { background: var(--pa-turquoise-50); font-weight: 800; color: var(--fg-titre); box-shadow: inset 3px 0 0 var(--pa-turquoise); }
.mega a.menu-logo[aria-current="page"] { border-color: var(--pa-turquoise); box-shadow: 0 0 0 1px var(--pa-turquoise); }
/* n°51 : de 1330 à 1559 px, le bouton « Bons cadeaux » reste dans la barre, réduit à son icône (même carré que les icônes de droite) */
@media (min-width: 1330px) and (max-width: 1559px) {
  .pa-entete > .pa-pilule:not(.pa-pilule--compacte) .pa-entete__cta { display: inline-flex; justify-content: center; flex: 0 0 2.75rem; width: 2.75rem; padding: 0; gap: 0; font-size: 0; margin-left: 0.25rem; }
  .pa-entete > .pa-pilule:not(.pa-pilule--compacte) .pa-entete__cta svg { width: 1.25rem; height: 1.25rem; }
}