/* Cabinet Kaabeche — sous-menus de navigation (chargé après site.css / styles de l'accueil) */
.nav-item{position:relative;display:flex;align-items:center;gap:4px}
.nav-item>a{white-space:nowrap}
.nav-item.is-active>a::after{width:100%}
.sub-toggle{background:none;border:0;padding:6px 2px;margin:0;cursor:pointer;color:var(--noir);display:inline-flex;align-items:center;line-height:0}
.sub-toggle svg{width:9px;height:9px;transition:transform .35s ease}
.sub-toggle:focus-visible{outline:2px solid var(--jaune);outline-offset:2px}

.sub{position:absolute;top:100%;left:50%;width:340px;padding-top:22px;transform:translate(-50%,10px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,transform .35s cubic-bezier(.2,.7,.2,1),visibility .3s;z-index:120}
.sub-inner{background:var(--ivoire);border-top:2px solid var(--jaune);box-shadow:0 34px 70px -34px rgba(16,16,16,.55),0 0 0 1px rgba(16,16,16,.06);padding:20px 10px 10px}
.sub-eyebrow{display:block;padding:0 14px 10px;font-size:.62rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--anthracite)}
.nav-links .sub a{display:block;padding:10px 14px 10px 16px;text-transform:none;letter-spacing:0;font-size:1rem;color:var(--noir);border-left:2px solid transparent;transition:background .25s ease,border-color .25s ease}
.nav-links .sub a::after{display:none}
.nav-links .sub a:hover,.nav-links .sub a:focus-visible,.nav-links .sub a[aria-current="page"]{background:var(--blanc);border-left-color:var(--jaune);outline:none}
.sub-t{display:block;font-family:var(--serif);font-size:1.12rem;font-weight:500;line-height:1.25}
.sub-d{display:block;margin-top:2px;font-size:.74rem;font-weight:300;line-height:1.4;color:var(--anthracite)}
.nav-links .sub a.sub-all{margin-top:8px;padding:12px 16px;border-top:1px solid rgba(16,16,16,.1);font-size:.66rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase}
.nav-links .sub a.sub-all:hover{background:transparent;border-left-color:transparent;color:var(--anthracite)}

@media(min-width:761px){
  .nav-links{gap:30px}
  .nav-item.open>.sub,.nav-item:focus-within>.sub{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
  .nav-item.open>.sub-toggle svg,.nav-item:focus-within>.sub-toggle svg{transform:rotate(180deg)}
}
@media(min-width:761px) and (hover:hover){
  .nav-item:hover>.sub{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
  .nav-item:hover>.sub-toggle svg{transform:rotate(180deg)}
}
@media(min-width:761px) and (max-width:1100px){
  .nav-links{gap:20px}
  .nav-links a{letter-spacing:.14em}
}

/* mobile : accordéons dans le panneau latéral */
@media(max-width:760px){
  .nav-links{justify-content:flex-start;align-items:stretch;overflow-y:auto;padding:100px 30px 40px;gap:4px}
  .nav-links>a,.nav-item>a{padding:12px 0}
  .nav-links>a.nav-cta{align-self:flex-start;margin-top:18px;padding:11px 24px}
  .nav-item{flex-wrap:wrap;justify-content:space-between;border-bottom:1px solid rgba(16,16,16,.08)}
  .sub-toggle{padding:12px 4px 12px 16px}
  .sub-toggle svg{width:13px;height:13px}
  .nav-item.open>.sub-toggle svg{transform:rotate(180deg)}
  .sub{position:static;width:100%;padding:0;transform:none;opacity:1;visibility:visible;pointer-events:auto;display:none}
  .nav-item.open>.sub{display:block}
  .sub-inner{background:transparent;border-top:0;box-shadow:none;padding:0 0 14px}
  .sub-eyebrow{display:none}
  .nav-links .sub a{padding:8px 0 8px 14px;border-left:2px solid rgba(16,16,16,.1)}
  .nav-links .sub a:hover,.nav-links .sub a[aria-current="page"]{background:transparent;border-left-color:var(--jaune)}
  .sub-t{font-size:1.05rem}
  .sub-d{display:none}
  .nav-links .sub a.sub-all{margin-top:4px;border-top:0;font-size:.62rem}
}
