/* ==========================================================================
   Nav pill flottante "pearOS" — liquid glass (Glassworks), adaptée
   à la charte US Orly Lutte (navy / gold / bone).
   ========================================================================== */

.pnav{
  position:fixed;top:12px;left:0;right:0;z-index:200;
  display:flex;justify-content:center;pointer-events:none;
}
.pnav-pill{
  pointer-events:auto;position:relative;border-radius:980px;overflow:hidden;
  border:1px solid rgba(230,205,138,.22);
  box-shadow:0 10px 34px -16px rgba(8,18,39,.55);
  transition:box-shadow .35s ease,border-color .35s ease,width .45s cubic-bezier(.34,1.56,.64,1);
  /* Évite le flash "visible -> invisible -> fade-in" au chargement : liquidGL
     anime lui-même l'opacité de la pill jusqu'à 1 une fois sa capture prête
     (reveal:'fade'), donc on démarre déjà invisible en CSS pour qu'il n'y ait
     jamais d'instant où la pill apparaît en clair avant de disparaître. Le
     fallback .no-glass (ajouté en JS si WebGL indisponible) la rend visible
     immédiatement, sans jamais rester bloquée invisible. */
  opacity:0;
}

.pnav.scrolled .pnav-pill{width:min(calc(100% - 32px),1400px)!important;}
.pnav.scrolled .pnav-pill{box-shadow:0 18px 46px -18px rgba(8,18,39,.7);}

/* Tint de lisibilité entre le verre et le texte (liquidGL laisse le fond
   de l'élément-cible transparent, donc ce calque enfant porte la couleur) */
.pnav-pill::before{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:rgba(8,18,39,.42);transition:background-color .35s ease;
  pointer-events:none;
}
.pnav-pill.no-glass{
  opacity:1;
  background:rgba(8,18,39,.66);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
}

.pnav-content{
  position:relative;z-index:1;display:flex;align-items:center;gap:22px;
  padding:6px 10px 6px 14px;pointer-events:auto;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.pnav-brand{display:flex;align-items:center;gap:9px;font-family:'Oswald',sans-serif;
  font-weight:600;font-size:15px;letter-spacing:.02em;color:var(--gold-light);
  transition:color .35s ease;white-space:nowrap;flex:0 0 auto;}
.pnav-brand img{width:46px;height:46px;border-radius:10px;object-fit:contain;flex-shrink:0;}

.pnav-links{display:flex;gap:14px;justify-content:center;flex:1 1 auto;}
.pnav-links a{font-family:'Oswald',sans-serif;font-size:12.5px;letter-spacing:.02em;
  text-transform:uppercase;color:var(--bone);opacity:.9;transition:opacity .2s,color .35s ease;white-space:nowrap;}
.pnav-links a:hover{opacity:1;color:var(--gold-light);}

.pnav-cta{
  flex:0 0 auto;text-align:center;
  font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;letter-spacing:.03em;
  text-transform:uppercase;background:var(--red);color:var(--bone);
  padding:8px 18px;border-radius:980px;transition:background .2s,transform .2s;white-space:nowrap;
  border:1px solid var(--gold);
  margin-left:auto;
}
.pnav-cta:hover{background:#711920;}

.pnav-burger{
  display:none;background:none;border:none;color:var(--bone);font-size:1.4rem;
  cursor:pointer;padding:4px 10px;line-height:1;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1);
}
.pnav.open .pnav-burger{transform:rotate(90deg);}

@media(max-width:1280px){
  .pnav.scrolled .pnav-pill{width:auto!important;}
  .pnav-links{display:none;}
  .pnav-cta{margin-left:auto;}
  .pnav-burger{display:block;margin-left:0;}
  .pnav-content{gap:12px;}
}

/* Menu mobile déroulant : élément indépendant, placé en enfant direct de
   <body> (voir base.html) pour ne jamais être piégé par le containing
   block que .pnav-pill (overflow:hidden + transition) crée pour ses
   descendants position:fixed. */
.pnav-mobile-menu{
  display:none;flex-direction:column;align-items:center;gap:2px;position:fixed;
  left:16px;right:16px;z-index:9999;
  background:rgba(8,18,39,.96);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border:1px solid rgba(230,205,138,.22);border-radius:20px;padding:14px 20px;
  max-height:calc(100vh - 96px);overflow-y:auto;
  box-shadow:0 18px 46px -18px rgba(8,18,39,.7);
}
.pnav-mobile-menu.open{display:flex;}
.pnav-mobile-menu a{
  width:100%;text-align:center;
  font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.02em;
  text-transform:uppercase;color:var(--bone);padding:11px 4px;
  border-bottom:1px solid rgba(230,205,138,.1);
}
.pnav-mobile-menu a:last-child{border-bottom:none;}
@media(min-width:1281px){.pnav-mobile-menu{display:none!important;}}

@media(max-width:980px){body{padding-top:92px;}}

/* la page utilise déjà un burger + nav-links caché en JS ; on masque
   entièrement l'ancien header pour ne garder que la pill flottante */
.site-header{display:none !important;}

/* espace de respiration en haut de page pour compenser le header retiré */
body{padding-top:96px;}