/* ═══════════════════════════════════════════════════════════
   MENU MODERNE (maquette 12/11/2026)
   Barre flottante en « pilule » au-dessus du hero :
   - en haut de page : verre sombre, texte blanc (sur la photo du hero)
   - après défilement : verre clair, ombre, plus compacte
   - se cache quand on descend, revient quand on remonte
   - pastille qui glisse sous la section en cours (et au survol)
   - barre de progression de lecture
   - mobile : menu plein écran avec grands liens animés
   Couleur d'accent : --nv-acc (turquoise sur web, orange sur dépannage)
   ═══════════════════════════════════════════════════════════ */
.nv{--nv-acc:#14b8a6;--nv-acc2:#0d9488;--nv-ease:cubic-bezier(.22,1,.36,1);
  position:fixed;top:16px;left:0;right:0;z-index:60;display:flex;justify-content:center;padding:0 16px;pointer-events:none;
  transition:transform .5s var(--nv-ease)}
.nv[data-theme="orange"]{--nv-acc:#f97316;--nv-acc2:#ea580c}
.nv.nv-hide{transform:translateY(-130%)}
.nv-bar{pointer-events:auto;position:relative;display:flex;align-items:center;gap:10px;width:100%;max-width:1180px;
  padding:8px 8px 8px 14px;border-radius:999px;
  background:rgba(10,20,20,.28);border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:0 10px 40px -18px rgba(0,0,0,.5);
  transition:max-width .6s var(--nv-ease),background .4s,border-color .4s,box-shadow .4s,padding .4s}
.nv.nv-solid .nv-bar{max-width:980px;background:rgba(255,255,255,.82);border-color:rgba(15,23,42,.08);box-shadow:0 14px 40px -20px rgba(15,23,42,.35)}

/* logo */
.nv-logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none;margin-right:auto}
.nv-logo img{width:40px;height:40px;object-fit:contain;transition:transform .5s var(--nv-ease)}
.nv-logo:hover img{transform:rotate(-12deg) scale(1.06)}
.nv-logo span{font:800 17px/1 var(--font-title);letter-spacing:-.03em;color:#fff;transition:color .4s}
.nv-logo span em{font-family:var(--font-main);font-style:normal;font-weight:700;font-size:1.25em;color:var(--nv-acc);margin-left:2px}
.nv.nv-solid .nv-logo span{color:#0f172a}

/* liens + pastille glissante */
.nv-links{position:relative;display:flex;align-items:center;gap:2px;margin:0 auto}
.nv-links a{position:relative;z-index:1;font:600 14px/1 var(--font-text);color:rgba(255,255,255,.85);text-decoration:none;padding:11px 16px;border-radius:999px;transition:color .3s}
.nv-links a:hover,.nv-links a.on{color:#fff}
.nv.nv-solid .nv-links a{color:#475569}
.nv.nv-solid .nv-links a:hover,.nv.nv-solid .nv-links a.on{color:#0f172a}
.nv-ind{position:absolute;z-index:0;top:0;left:0;height:100%;border-radius:999px;background:rgba(255,255,255,.16);opacity:0;
  transition:transform .45s var(--nv-ease),width .45s var(--nv-ease),opacity .3s,background .4s}
.nv.nv-solid .nv-ind{background:rgba(15,23,42,.06)}
.nv-ind::after{content:"";position:absolute;left:50%;bottom:4px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--nv-acc)}

/* bouton d'action */
.nv-cta{flex:none;display:inline-flex;align-items:center;gap:8px;margin-left:auto;font:700 14px/1 var(--font-text);color:#fff;text-decoration:none;
  background:var(--nv-acc2);padding:12px 18px;border-radius:999px;position:relative;overflow:hidden;transition:transform .3s var(--nv-ease),box-shadow .3s}
.nv-cta::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-100%);transition:transform .8s var(--nv-ease)}
.nv-cta:hover{transform:translateY(-1px);box-shadow:0 10px 24px -10px var(--nv-acc2)}
.nv-cta:hover::before{transform:translateX(100%)}
.nv-cta svg{transition:transform .3s var(--nv-ease)}
.nv-cta:hover svg{transform:translate(2px,-2px)}

/* progression de lecture */
.nv-prog{position:absolute;left:22px;right:22px;bottom:-1px;height:2px;border-radius:2px;overflow:hidden;pointer-events:none}
.nv-prog i{display:block;height:100%;width:100%;background:var(--nv-acc);transform-origin:left;transform:scaleX(0)}

/* burger */
.nv-burger{display:none;flex:none;width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;background:rgba(255,255,255,.14);position:relative;transition:background .3s}
.nv.nv-solid .nv-burger{background:rgba(15,23,42,.06)}
.nv-burger span{position:absolute;left:14px;right:14px;height:2px;border-radius:2px;background:#fff;transition:transform .45s var(--nv-ease),top .45s var(--nv-ease),background .3s}
.nv-burger span:nth-child(1){top:18px}.nv-burger span:nth-child(2){top:26px}
.nv.nv-solid .nv-burger span{background:#0f172a}
.nv.nv-open .nv-burger span{background:#fff}
.nv.nv-open .nv-burger span:nth-child(1){top:22px;transform:rotate(45deg)}
.nv.nv-open .nv-burger span:nth-child(2){top:22px;transform:rotate(-45deg)}

/* menu plein écran (mobile) */
.nv-menu{position:fixed;inset:0;z-index:55;background:#071010;color:#fff;display:flex;flex-direction:column;justify-content:center;padding:110px 28px 40px;
  clip-path:circle(0 at calc(100% - 46px) 40px);visibility:hidden;transition:clip-path .7s var(--nv-ease),visibility 0s .7s;overflow:auto}
.nv-menu::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:var(--nv-acc,#14b8a6);filter:blur(110px);opacity:.3;top:-120px;left:-120px;pointer-events:none}
.nv-menu.open{clip-path:circle(150% at calc(100% - 46px) 40px);visibility:visible;transition:clip-path .8s var(--nv-ease),visibility 0s}
.nv-menu ol{list-style:none;position:relative}
.nv-menu li{overflow:hidden}
.nv-menu ol a{display:flex;align-items:baseline;gap:14px;text-decoration:none;color:#fff;font:800 clamp(34px,9vw,52px)/1.15 var(--font-title);letter-spacing:-.04em;padding:6px 0;
  transform:translateY(110%);transition:transform .7s var(--nv-ease),color .3s}
.nv-menu ol a small{font:700 22px/1 var(--font-main);color:var(--nv-acc);letter-spacing:0}
.nv-menu ol a:hover,.nv-menu ol a.on{color:var(--nv-acc)}
.nv-menu.open ol a{transform:none}
.nv-menu.open li:nth-child(1) a{transition-delay:.15s}.nv-menu.open li:nth-child(2) a{transition-delay:.21s}
.nv-menu.open li:nth-child(3) a{transition-delay:.27s}.nv-menu.open li:nth-child(4) a{transition-delay:.33s}.nv-menu.open li:nth-child(5) a{transition-delay:.39s}
.nv-mfoot{position:relative;margin-top:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);display:grid;gap:10px;opacity:0;transform:translateY(12px);transition:all .6s .4s var(--nv-ease)}
.nv-menu.open .nv-mfoot{opacity:1;transform:none}
.nv-mfoot a{color:#cfe7e3;text-decoration:none;font:500 15px/1.4 var(--font-text)}
.nv-mfoot .nv-cta{justify-self:start;margin:10px 0 0;padding:15px 22px;font-size:15px;color:#fff}
.nv-mfoot .nv-hand{font:700 24px/1 var(--font-main);color:var(--nv-acc)}
body.nv-lock{overflow:hidden}

@media (max-width:1023px){
  .nv-links,.nv-bar>.nv-cta{display:none}
  .nv-burger{display:block}
  .nv{top:12px}
  .nv-bar{padding:6px 6px 6px 12px}
}
@media (prefers-reduced-motion:reduce){
  .nv,.nv *,.nv-menu,.nv-menu *{transition:none!important}
}
/* menu mobile ouvert : la barre se fond dans le fond sombre */
.nv.nv-open .nv-bar{background:transparent;border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.nv.nv-open .nv-logo span{color:#fff}
.nv.nv-open .nv-burger{background:rgba(255,255,255,.12)}
.nv.nv-open .nv-prog{opacity:0}
/* très grands écrans : menu un peu plus large */
@media (min-width:1800px){.nv-bar{max-width:1500px}.nv.nv-solid .nv-bar{max-width:1240px}.nv-links a{font-size:15px}}
