/* 114 — SOMMAIRE, VERRE, GALERIE, PAYSAGE (V1.34.0).
   1. Sommaire : le panneau du burger devient une table des matières (plus de
      vide central, Expertises déplié d'office, coordonnées en pied).
   2. Fiches du Track Record en verre trempé.
   3. Galerie photo plein écran (structure ; le comportement est dans
      js/core/lightbox.js).
   4. Paysage iPhone / iPad : hauteurs utiles, encoche, respirations.
   5. Safari mobile : ancre de défilement stable sous la barre fixe.
   Chargé en dernier : les sélecteurs sont volontairement plus lourds que ceux
   des modules 90, 106 et 112 qu'ils remplacent. */

/* ---------- 1. Sommaire ---------- */
@media(max-width:1080px){
  html body #nav .nav-links{
    display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:0;
    padding:calc(var(--nav-h,4.6rem) + .4rem) max(1.4rem,env(safe-area-inset-right)) max(1.4rem,env(safe-area-inset-bottom)) max(1.4rem,env(safe-area-inset-left));
    background:
      radial-gradient(110% 60% at 100% 0%,rgba(212,168,67,.11),transparent 60%),
      radial-gradient(80% 50% at 0% 100%,rgba(255,255,255,.04),transparent 60%),
      linear-gradient(165deg,#0e0f13,#060609);
    -webkit-backdrop-filter:none;backdrop-filter:none; /* panneau opaque : rien à flouter, et le GPU mobile respire */
  }
  html body #nav .nav-links>a:not(.nav-cta){
    width:100%;min-height:0;padding:.62rem 0;border-radius:0;text-align:left;
    display:flex;align-items:center;justify-content:space-between;gap:1rem;
    border-bottom:1px solid rgba(255,255,255,.075);
    font-family:var(--display);font-weight:300;font-size:clamp(1.42rem,5.4vw,1.95rem);line-height:1.12;letter-spacing:-.02em;color:#e9ebf0;
  }
  html body #nav .nav-links>a:not(.nav-cta)::before{display:none}
  html body #nav .nav-links>a:not(.nav-cta)::after{
    content:"\2192";display:inline-block;position:static;width:auto;height:auto;background:none;
    font-family:var(--text);font-size:1rem;color:rgba(212,168,67,.85);
    opacity:.55;transform:translateX(-4px);transition:opacity .3s,transform .3s var(--ease);
  }
  html body #nav .nav-links>a:not(.nav-cta):hover::after,
  html body #nav .nav-links>a:not(.nav-cta):focus-visible::after{opacity:1;transform:none}
  html body #nav .nav-links>a[aria-current="page"]:not(.nav-cta){color:var(--gold)}
  html body #nav .nav-links>a[aria-current="page"]:not(.nav-cta)::after{opacity:1;transform:none}

  /* Expertises : une rubrique dépliée, pas un accordéon. */
  html body #nav .nav-links .nav-group{
    display:block;width:100%;margin:0;padding:.95rem 0 .55rem;border-bottom:1px solid rgba(255,255,255,.075);
  }
  html body #nav .nav-links .nav-group-btn{
    pointer-events:none;width:auto;min-height:0;justify-content:flex-start;padding:0 0 .6rem;border-radius:0;
    font-family:var(--text);font-weight:600;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(212,168,67,.92);
    opacity:1;transform:none;transition:none;
  }
  html body #nav .nav-links .nav-group-btn::before{content:"";display:inline-block;width:22px;height:1px;margin-right:.6rem;background:rgba(212,168,67,.9);vertical-align:middle}
  html body #nav .nav-links .nav-group-caret{display:none}
  html body #nav .nav-links .nav-submenu,
  html body #nav .nav-links .nav-group.is-open>.nav-submenu{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;gap:.4rem .5rem;
    opacity:1;visibility:visible;pointer-events:auto;transform:none;overflow:visible;transition:none;
  }
  html body #nav .nav-links .nav-submenu a{
    display:flex;align-items:center;justify-content:flex-start;width:100%;min-height:44px;padding:.5rem .8rem;
    text-align:left;font-family:var(--text);font-weight:500;font-size:.92rem;line-height:1.25;color:#dfe2e8;
    border-radius:12px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  }
  html body #nav .nav-links .nav-submenu a[aria-current="page"]{color:var(--gold);border-color:rgba(212,168,67,.45)}
  html body #nav .nav-links .nav-submenu a::before,html body #nav .nav-links .nav-submenu a::after{display:none}

  html body #nav .nav-links .nav-cta{margin:1.15rem 0 0;width:100%;justify-content:center;padding:1rem 1.4rem;font-size:1rem}

  /* Pied : coordonnées, poussées en bas quand la hauteur le permet. */
  html body #nav .nav-links .nav-more{
    margin-top:auto;padding-top:1.3rem;display:grid;grid-template-columns:1fr auto;gap:.15rem 1rem;align-items:baseline;
    color:#9aa0ad;font-size:.84rem;line-height:1.5;
  }
  html body #nav .nav-links .nav-more-k{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,168,67,.85);grid-column:1/-1}
  html body #nav .nav-links .nav-more-v{grid-column:1/-1}
  html body #nav .nav-links .nav-more a{width:auto;min-height:0;padding:.15rem 0;font-family:var(--text);font-size:.92rem;font-weight:500;color:#e9ebf0;border:0;opacity:1;transform:none;text-align:left;display:inline-flex;justify-content:flex-start}
  html body #nav .nav-links .nav-more a::after{display:none}
  html body #nav .nav-links .nav-more-in{justify-self:end}
}
@media(max-width:420px){
  html body #nav .nav-links .nav-submenu{grid-template-columns:1fr}
}
/* Tablette et paysage : deux colonnes — rubriques à gauche, Expertises à droite. */
@media(min-width:640px) and (max-width:1080px),(max-width:1080px) and (max-height:560px) and (orientation:landscape){
  html body #nav .nav-links{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
    grid-template-rows:repeat(6,max-content) max-content minmax(0,1fr);
    column-gap:clamp(1.5rem,5vw,4rem);row-gap:0;align-content:start;align-items:start;justify-items:stretch;
  }
  html body #nav .nav-links>a:not(.nav-cta){grid-column:1;min-height:44px}
  html body #nav .nav-links .nav-group{grid-column:2;grid-row:1/7;align-self:start;padding-top:.5rem;border-bottom:0}
  html body #nav .nav-links .nav-cta{grid-column:1/-1;grid-row:7;width:min(22rem,100%);justify-self:start;margin-top:1.2rem}
  html body #nav .nav-links .nav-more{grid-column:1/-1;grid-row:8;align-self:end;grid-template-columns:auto auto 1fr auto;padding-top:1rem}
  html body #nav .nav-links .nav-more-k,html body #nav .nav-links .nav-more-v{grid-column:auto}
}
/* Tablette en portrait : la hauteur est généreuse — la typographie prend la
   place plutôt que le vide. */
@media(min-width:640px) and (max-width:1080px) and (orientation:portrait){
  html body #nav .nav-links{padding-top:calc(var(--nav-h,4.6rem) + 7vh);column-gap:clamp(2rem,6vw,4.5rem)}
  html body #nav .nav-links>a:not(.nav-cta){padding:1rem 0;font-size:clamp(1.9rem,3.6vw,2.5rem)}
  html body #nav .nav-links .nav-group{padding-top:1.1rem}
  html body #nav .nav-links .nav-group-btn{font-size:.72rem;padding-bottom:.9rem}
  html body #nav .nav-links .nav-submenu{gap:.6rem}
  html body #nav .nav-links .nav-submenu a{min-height:58px;padding:.7rem 1rem;font-size:1.02rem}
  html body #nav .nav-links .nav-cta{margin-top:1.8rem;padding:1.05rem 1.6rem;font-size:1.05rem;width:min(24rem,100%)}
  html body #nav .nav-links .nav-more{font-size:.92rem}
}
@media(max-width:1080px) and (max-height:560px) and (orientation:landscape){
  html body #nav .nav-links{padding-top:calc(var(--nav-h,4.6rem) + .1rem);column-gap:clamp(1.2rem,4vw,3rem)}
  html body #nav .nav-links>a:not(.nav-cta){padding:.3rem 0;font-size:clamp(1rem,4.4vh,1.3rem);min-height:40px;line-height:1.1}
  html body #nav .nav-links .nav-group{padding-top:.2rem}
  html body #nav .nav-links .nav-group-btn{padding-bottom:.35rem;font-size:.6rem}
  html body #nav .nav-links .nav-submenu a{min-height:36px;padding:.3rem .6rem;font-size:.8rem;justify-content:center;text-align:center}
  html body #nav .nav-links .nav-cta{margin-top:.6rem;padding:.6rem 1.2rem;font-size:.88rem;width:min(16rem,100%)}
  html body #nav .nav-links .nav-more{padding-top:.5rem;font-size:.76rem}
}

/* ---------- 2. Fiches en verre trempé ---------- */
body[data-page="track-record"] #mosaic .g-card{
  position:relative;isolation:isolate;border-radius:22px;padding:.55rem .55rem 0;
  background:
    linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02) 50%,rgba(255,255,255,.055)),
    linear-gradient(rgba(12,13,17,.86),rgba(12,13,17,.86));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),           /* arête haute polie          */
    inset 0 -1px 0 rgba(255,255,255,.05),
    inset 0 0 0 1px rgba(255,255,255,.025),
    0 1px 2px rgba(0,0,0,.45),
    0 22px 44px -22px rgba(0,0,0,.75);
  transition:transform .55s var(--ease),box-shadow .55s,border-color .55s;
}
body[data-page="track-record"] #mosaic .g-card::before{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;
  background:linear-gradient(118deg,rgba(255,255,255,0) 32%,rgba(255,255,255,.09) 46%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.09) 54%,rgba(255,255,255,0) 68%);
  background-size:230% 100%;background-position:115% 0;
  transition:background-position 1.1s var(--ease);
}
body[data-page="track-record"] #mosaic .g-card:hover,
body[data-page="track-record"] #mosaic .g-card:focus-visible{
  transform:translateY(-5px);border-color:rgba(255,255,255,.2);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.3),
    inset 0 -1px 0 rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(255,255,255,.03),
    0 0 0 1px rgba(212,168,67,.14),
    0 2px 4px rgba(0,0,0,.45),
    0 34px 60px -24px rgba(0,0,0,.8);
}
body[data-page="track-record"] #mosaic .g-card:hover::before{background-position:-25% 0}
body[data-page="track-record"] #mosaic .g-pic{border-radius:16px;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
body[data-page="track-record"] #mosaic .g-body{padding:1.05rem .55rem 1.2rem;border-bottom:0}
body[data-page="track-record"] #mosaic .g-card:hover .g-pic .plus,body[data-page="track-record"] #mosaic .g-pic .plus{background:var(--cg-or-compact,var(--gold));color:#151006;border-color:rgba(140,105,28,.85);box-shadow:inset 0 1px 0 rgba(255,255,248,.9),0 6px 14px -6px rgba(0,0,0,.7)}
@media(min-width:1024px){
  body[data-page="track-record"] #mosaic .g-card{
    background:
      linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02) 50%,rgba(255,255,255,.055)),
      linear-gradient(rgba(12,13,17,.58),rgba(12,13,17,.58));
    -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
  }
}
@media(hover:none){
  body[data-page="track-record"] #mosaic .g-card:active{transform:scale(.985);transition-duration:.12s}
}
@media(prefers-reduced-motion:reduce){
  body[data-page="track-record"] #mosaic .g-card,body[data-page="track-record"] #mosaic .g-card::before{transition:none}
  body[data-page="track-record"] #mosaic .g-card:hover{transform:none}
}

/* ---------- 3. Galerie plein écran ---------- */
.cg-lb{position:fixed;inset:0;z-index:1700; /* au-dessus de la fiche (1650), sous le voile de chargement */display:none;align-items:center;justify-content:center;
  padding:max(.8rem,env(safe-area-inset-top)) max(.8rem,env(safe-area-inset-right)) max(.8rem,env(safe-area-inset-bottom)) max(.8rem,env(safe-area-inset-left));
  -webkit-user-select:none;user-select:none;touch-action:pan-y pinch-zoom}
.cg-lb.open{display:flex}
.cg-lb-back{position:absolute;inset:0;background:rgba(3,3,5,.82);-webkit-backdrop-filter:blur(22px) saturate(140%);backdrop-filter:blur(22px) saturate(140%);opacity:0;transition:opacity .4s}
.cg-lb.show .cg-lb-back{opacity:1}
.cg-lb-stage{position:relative;z-index:1;max-width:min(1600px,100%);max-height:100%;display:flex;align-items:center;justify-content:center}
.cg-lb-img{display:block;max-width:calc(100vw - 1.6rem);max-height:calc(100svh - 7.2rem);width:auto;height:auto;object-fit:contain;border-radius:14px;
  box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 40px 90px -30px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.08);
  opacity:0;transform:scale(.94);transition:opacity .38s ease,transform .5s var(--ease)}
.cg-lb.show .cg-lb-img{opacity:1;transform:none}
.cg-lb-img.is-out{opacity:0;transform:scale(.985);transition-duration:.18s}
.cg-lb-btn{position:absolute;z-index:2;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.16);color:#f2f3f6;cursor:pointer;
  display:flex;align-items:center;justify-content:center;font:500 1.15rem/1 var(--text);
  background:linear-gradient(150deg,rgba(255,255,255,.14),rgba(255,255,255,.04)),rgba(10,10,14,.55);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 24px -10px rgba(0,0,0,.8);
  transition:transform .3s var(--ease),background .3s,border-color .3s}
.cg-lb-btn:hover{border-color:rgba(212,168,67,.55);transform:scale(1.06)}
.cg-lb-btn:active{transform:scale(.96)}
.cg-lb-btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.cg-lb-close{top:max(.9rem,env(safe-area-inset-top));right:max(.9rem,env(safe-area-inset-right))}
.cg-lb-prev{left:max(.9rem,env(safe-area-inset-left));top:50%;transform:translateY(-50%)}
.cg-lb-next{right:max(.9rem,env(safe-area-inset-right));top:50%;transform:translateY(-50%)}
.cg-lb-prev:hover,.cg-lb-next:hover{transform:translateY(-50%) scale(1.06)}
.cg-lb-prev:active,.cg-lb-next:active{transform:translateY(-50%) scale(.96)}
.cg-lb[data-count="1"] .cg-lb-prev,.cg-lb[data-count="1"] .cg-lb-next,.cg-lb[data-count="1"] .cg-lb-dots{display:none}
.cg-lb-meta{position:absolute;z-index:2;left:max(1rem,env(safe-area-inset-left));right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));
  display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;pointer-events:none;color:#e9ebf0}
.cg-lb-cap{min-width:0;font-size:.95rem;line-height:1.35;text-shadow:0 1px 10px rgba(0,0,0,.8)}
.cg-lb-cap b{display:block;font-weight:600}
.cg-lb-cap span{color:#aeb3bf;font-size:.84rem}
.cg-lb-count{flex:0 0 auto;font-size:.78rem;letter-spacing:.14em;color:rgba(255,255,255,.85);font-variant-numeric:tabular-nums}
.cg-lb-dots{display:flex;gap:.4rem;justify-content:center;position:absolute;left:0;right:0;bottom:calc(max(1rem,env(safe-area-inset-bottom)) + 2.4rem);z-index:2;pointer-events:none}
.cg-lb-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35);transition:background .3s,transform .3s}
.cg-lb-dots i.on{background:var(--gold);transform:scale(1.25)}
@media(max-width:700px){
  .cg-lb-prev,.cg-lb-next{top:auto;bottom:calc(max(1rem,env(safe-area-inset-bottom)) + .2rem);transform:none;width:44px;height:44px}
  .cg-lb-prev{left:auto;right:calc(max(.9rem,env(safe-area-inset-right)) + 3.3rem)}
  .cg-lb-prev:hover,.cg-lb-next:hover{transform:scale(1.06)}
  .cg-lb-prev:active,.cg-lb-next:active{transform:scale(.96)}
  .cg-lb-img{max-height:calc(100svh - 9.2rem)}
  .cg-lb-meta{bottom:calc(max(1rem,env(safe-area-inset-bottom)) + .2rem);padding-right:7.4rem}
  .cg-lb-dots{bottom:calc(max(1rem,env(safe-area-inset-bottom)) + 5.6rem);justify-content:flex-start;left:max(1rem,env(safe-area-inset-left))}
}
@media(max-height:520px) and (orientation:landscape){
  .cg-lb-img{max-height:calc(100svh - 2.4rem);max-width:calc(100vw - 8rem)}
  .cg-lb-meta{right:auto;left:max(1rem,env(safe-area-inset-left));bottom:max(.7rem,env(safe-area-inset-bottom))}
  .cg-lb-dots{display:none}
}
/* Déclencheur dans la fiche : le visuel principal s'ouvre en grand. */
body[data-page="track-record"] .focus-media img.fimg.on{cursor:zoom-in}
.cg-lb-open{position:absolute;top:.9rem;right:.9rem;z-index:5;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.22);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;font:500 1.05rem/1 var(--text);
  background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .3s,border-color .3s,transform .3s var(--ease)}
.cg-lb-open:hover{background:rgba(0,0,0,.65);border-color:rgba(212,168,67,.6);transform:scale(1.06)}
@media(prefers-reduced-motion:reduce){.cg-lb-back,.cg-lb-img,.cg-lb-btn{transition:none}.cg-lb-img{transform:none}}

/* ---------- 4. Paysage iPhone / iPad ---------- */
/* L'encoche mord sur les bords en paysage : la barre fixe et le contenu s'en
   écartent ; en portrait ces marges valent zéro. */
@supports(padding:max(0px)){
  #nav{padding-left:max(clamp(1.5rem,6vw,5rem),env(safe-area-inset-left));padding-right:max(clamp(1.5rem,6vw,5rem),env(safe-area-inset-right))}
  body>main,body>section,body>footer,.hero{padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right))}
}
@media(max-width:1024px) and (max-height:520px) and (orientation:landscape){
  html:root{--nav-h:3.6rem} /* le module 80 fixe 72 px sur :root ; ici la hauteur utile prime */
  html body #nav{min-height:var(--nav-h);padding-top:max(.55rem,env(safe-area-inset-top));padding-bottom:.55rem}
  html body #nav .logo{height:28px}
  html body .hero{min-height:100svh;padding-top:calc(var(--nav-h,3.9rem) + 1rem);padding-bottom:2rem;justify-content:center}
  html body .hero h1{font-size:clamp(1.7rem,8.5vh,3rem);max-width:18ch;line-height:1}
  html body .hero-sub{margin-top:.8rem;font-size:.92rem;line-height:1.45;max-width:52ch}
  html body .hero-cta{margin-top:1.1rem;padding:.72rem 1.4rem;font-size:.92rem}
  html body .hero .hero-cta+a,html body .hero .hero-links{margin-top:.6rem}
  html body .sec-head{font-size:clamp(1.5rem,7vh,2.3rem)}
  html body[data-page="track-record"] .focus-media img.fimg{object-fit:cover}
  /* Fiche en paysage : la règle mobile (une colonne) et la règle paysage du
     module 106 (deux colonnes) se contredisaient — le média disparaissait et
     la colonne droite restait vide. Grille explicite : photo à gauche sur toute
     la hauteur, en-tête puis corps défilant à droite. */
  html body[data-page="track-record"] .focus{padding:max(.5rem,env(safe-area-inset-top)) max(.6rem,env(safe-area-inset-right)) max(.5rem,env(safe-area-inset-bottom)) max(.6rem,env(safe-area-inset-left))}
  html body[data-page="track-record"] .focus-box{
    display:grid;grid-template-columns:minmax(0,1.05fr) minmax(16rem,.95fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"media head" "media body";
    width:100%;max-height:calc(100svh - max(1rem,env(safe-area-inset-top)) - max(1rem,env(safe-area-inset-bottom)));overflow:hidden;border-radius:18px;
  }
  html body[data-page="track-record"] .focus-media{grid-area:media;position:relative;min-height:0;height:auto;aspect-ratio:auto;max-height:none}
  html body[data-page="track-record"] .focus-head{grid-area:head;position:static}
  html body[data-page="track-record"] .focus-body{grid-area:body;overflow-y:auto;min-height:0;max-height:none;padding:.9rem 1.1rem calc(1rem + env(safe-area-inset-bottom))}
  html body[data-page="track-record"] .focus-thumbs{padding:.4rem .6rem}
  html body[data-page="track-record"] .focus-arrows{bottom:3.6rem}
  html body[data-page="track-record"] .focus-count{bottom:4rem}
  html body[data-page="track-record"] #mosaic{grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
}
@media(min-width:900px) and (max-width:1200px) and (orientation:landscape) and (hover:none){
  /* iPad paysage : trois fiches par rangée, fiche modale en deux colonnes. */
  html body[data-page="track-record"] #mosaic{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---------- 5. Safari mobile ---------- */
html{scroll-padding-top:calc(var(--nav-h,4.6rem) + .6rem)}
