/* En-tete commun a toutes les pages : sous-menu "Nos offres" (ICRI, vulgarisation scientifique)
   et acces a la plateforme ICRI a droite du menu ("Lancer mon ICRI", "Se connecter"), a la demande de Cortex. */
.top .wrap{justify-content:flex-start}
.top .nav{margin-left:auto}
.dd{position:relative;display:flex;align-items:center}
.dd-t::after{content:"";display:inline-block;width:7px;height:7px;margin-left:9px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:translateY(-3px) rotate(45deg);transition:transform .25s ease}
.dd-m{position:absolute;top:calc(100% + 14px);right:-16px;min-width:340px;z-index:40;
  background:#0F1E30;border:1px solid rgba(255,255,255,.12);border-top:2px solid #EA580C;padding:8px;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s}
.dd-m::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.dd:hover .dd-m,.dd:focus-within .dd-m,.dd.ouvert .dd-m{opacity:1;visibility:visible;transform:none}
.dd:hover .dd-t::after,.dd:focus-within .dd-t::after,.dd.ouvert .dd-t::after{transform:translateY(1px) rotate(-135deg)}
.nav .dd-m a{display:block;padding:12px 14px;border:0;color:#fff;font-weight:700;font-size:15.5px;line-height:1.3;text-decoration:none}
.nav .dd-m a b{display:block;color:#EA580C;font-size:12.5px;font-weight:900;margin-bottom:3px}
.nav .dd-m a:hover,.nav .dd-m a:focus-visible{background:rgba(255,255,255,.07)}

/* acces plateforme */
.icri{display:flex;align-items:center;gap:20px;margin-left:clamp(22px,2.2vw,36px);flex:0 0 auto}
.icri .co{color:#c3d2e0;font-weight:700;font-size:15px;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:2px;white-space:nowrap}
.icri .co:hover{color:#fff;border-color:#fff}
.icri .go{background:#EA580C;color:#fff;font-weight:800;font-size:15px;padding:11px 18px;text-decoration:none;
  border-radius:2px;white-space:nowrap;transition:background .2s}
.icri .go:hover{background:#c4470a}
.nav .nav-co{display:none}

/* entre 981 et 1300 px, huit elements ne tiennent pas sur une ligne : le menu passe en burger */
@media (max-width:1300px){
  .top .wrap{position:relative}
  .top .nav{display:none}
  .top .burger{display:block;order:3;margin-left:22px}
  .icri{order:2;margin-left:auto}
  .top .nav.open{display:grid;position:absolute;top:100%;right:var(--pad);background:#0F1E30;padding:20px 24px;gap:14px;
    min-width:240px;z-index:30;border:1px solid rgba(255,255,255,.12)}
  .dd{display:block}
  .dd-t::after{display:none}
  .dd-m{position:static;min-width:0;opacity:1;visibility:visible;transform:none;
    background:none;border:0;border-left:2px solid #EA580C;padding:2px 0 0 14px;margin-top:10px}
  .dd-m::before{display:none}
  .nav .dd-m a{padding:7px 0;font-size:15px}
  .nav .dd-m a:hover{background:none}
}
@media (max-width:640px){
  .icri .co{display:none}
  .nav .nav-co{display:block}
  .icri .go{padding:9px 13px;font-size:14px}
  .top .burger{margin-left:14px}
}
@media (max-width:440px){ .brand span{display:none} }
@media (prefers-reduced-motion:reduce){.dd-m,.dd-t::after{transition:none}}

/* avec l'onglet Blog, neuf entrées : aucun libellé ne passe sur deux lignes, l'espacement se resserre entre 1301 et 1500 px */
.top .nav a,.top .nav .dd-t{white-space:nowrap}
@media (min-width:1301px) and (max-width:1500px){.top .nav{gap:clamp(14px,1.45vw,24px)}.top .icri{margin-left:20px}}
