/* Neon Thread - header submenus (Lavori > the four featured cases, Chi sono > podcast). Published as neon-nav.css, linked by site/blocks/header.html. */
/* Lavori: the four featured cases as a submenu (hover or keyboard on desktop, always open in the phone menu) */
.es-bp-nav .es-has-sub { position: relative; height: 64px; display: flex; align-items: center; }
.es-bp-nav .es-has-sub > a .nt-label::after { content: ""; display: inline-block; width: 0; height: 0; margin-left: 8px; vertical-align: 2px; border: 4px solid transparent; border-top-color: currentColor; border-bottom: 0; }
.es-bp-nav .es-sub-menu { position: absolute; top: 100%; left: -18px; min-width: 260px; padding: 8px 0; background: #070B1C; border: 1px solid rgba(155,123,255,.55); border-top: 0;
  box-shadow: 0 18px 40px rgba(0,0,0,.5), 0 0 18px rgba(155,123,255,.15); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease, visibility .18s; }
.es-bp-nav .es-has-sub:hover .es-sub-menu, .es-bp-nav .es-has-sub:focus-within .es-sub-menu { opacity: 1; visibility: visible; transform: none; }
.es-bp-nav .es-sub-menu a { display: block; padding: 10px 18px 10px 34px; position: relative; font-size: 15px; font-weight: 600; line-height: 1.25; color: var(--nt-text-primary); }
.es-bp-nav .es-sub-menu a::before { content: ""; position: absolute; left: 18px; top: 15px; width: 7px; height: 7px; background: var(--c, var(--nt-hud-cyan)); box-shadow: 0 0 8px var(--c, var(--nt-hud-cyan)); }
.es-bp-nav .es-sub-menu small { display: block; margin-top: 3px; font-family: var(--nt-font-pixel); font-size: 10px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--nt-text-tertiary); }
.es-bp-nav .es-sub-menu a:hover, .es-bp-nav .es-sub-menu a:focus-visible, .es-bp-nav .es-sub-menu a[aria-current] { background: rgba(155,123,255,.12); }
.es-bp-nav .es-sub-menu .es-sub-all { margin-top: 6px; padding-left: 18px; border-top: 1px dashed var(--nt-night-border-dashed); font-family: var(--nt-font-pixel); font-size: 11px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--nt-hud-cyan); }
.es-bp-nav .es-sub-menu .es-sub-all::before { display: none; }
@media (max-width: 860px) {
  /* phone menu: scrolls on its own when it is taller than the screen */
  .es-bp-nav .es-links { max-height: calc(100svh - 64px); overflow-y: auto; overscroll-behavior: contain; }
  /* a parent with a submenu is one row: label on top, the dashed line under the whole group */
  .es-bp-nav .es-has-sub { height: auto; display: block; border-bottom: 1px dashed var(--nt-night-border-dashed); padding-bottom: 10px; }
  .es-bp-nav .es-links .es-has-sub > a { display: block; border-bottom: 0; padding-bottom: 8px; }
  .es-bp-nav .es-has-sub > a .nt-label::after { display: none; }
  /* the children hang from a thread, like the rest of the site */
  .es-bp-nav .es-sub-menu { position: static; opacity: 1; visibility: visible; transform: none; min-width: 0; margin: 0 0 0 6px; padding: 2px 0 2px 14px;
    background: none; border: 0; border-left: 1px solid rgba(155,123,255,.45); box-shadow: none; }
  .es-bp-nav .es-links .es-sub-menu a { padding: 9px 4px 9px 18px; border-bottom: 0; font-size: 15px; }
  .es-bp-nav .es-sub-menu a::before { left: 2px; top: 15px; }
  .es-bp-nav .es-sub-menu small { font-size: 9px; margin-top: 2px; }
  .es-bp-nav .es-links .es-sub-menu .es-sub-all { margin-top: 2px; padding: 9px 4px 4px 18px; border-top: 0; font-size: 10px; }
  /* every main entry is a link: label brighter, the site's ">>" on the right, like the buttons */
  .es-bp-nav .es-links > a:not(.nt-btn), .es-bp-nav .es-links .es-has-sub > a { display: flex; align-items: center; justify-content: space-between; }
  .es-bp-nav .es-links > a:not(.nt-btn) .nt-label, .es-bp-nav .es-links .es-has-sub > a .nt-label { --nt-accent: var(--nt-text-primary); }
  .es-bp-nav .es-links > a:not(.nt-btn)::after, .es-bp-nav .es-links .es-has-sub > a::after {
    content: ">>"; font-family: var(--nt-font-pixel); font-size: 12px; letter-spacing: .1em; color: var(--nt-hud-cyan); text-shadow: 0 0 8px rgba(56,217,245,.6); padding-left: 12px; }
  .es-bp-nav .es-links a[aria-current] .nt-label { --nt-accent: var(--nt-hud-cyan); }
  .es-bp-nav .es-links a[aria-current]::after { color: var(--nt-semantic-system, #2FE39A); }
}
/* the thread follows you in the bar: a thin neon line on the bottom edge fills as you scroll, the white pixel at its tip */
.es-nav-progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; pointer-events: none; --p: 0; }
.es-nav-progress::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: calc(var(--p) * 100%);
  background: linear-gradient(90deg, #22D3EE, #3B82F6 20%, #8B5CF6 40%, #F050C8 60%, #FFB020 80%, #2FE39A) 0 0 / 100vw 100% no-repeat;
  box-shadow: 0 0 8px rgba(56,217,245,.55); }
.es-nav-progress b { position: absolute; top: -2px; left: calc(var(--p) * 100% - 3px); width: 6px; height: 6px; background: #fff;
  box-shadow: 0 0 6px #fff, 0 0 12px #38D9F5; opacity: min(1, calc(var(--p) * 40)); }
/* site-wide: READ cards are not buttons, so no blinking "continue" arrow */
body:has(#es-root) .nt-dialog__box::after { display: none !important; }
/* AI: the new workshop (Competenze Aumentate) as its own label, cyan with a blinking pixel */
.es-bp-nav .es-links .es-ai { white-space: nowrap; }
.es-bp-nav .es-links .es-ai .nt-label { --nt-accent: var(--nt-hud-cyan); text-shadow: 0 0 8px rgba(56,217,245,.6); }
.es-bp-nav .es-links .es-ai .nt-label::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 7px; vertical-align: 1px; background: #22D3EE; box-shadow: 0 0 8px #22D3EE; animation: es-blink 1.6s steps(2) infinite; }
@keyframes es-blink { 50% { opacity: .2; } }
@media (prefers-reduced-motion: reduce) { .es-bp-nav .es-links .es-ai .nt-label::after { animation: none; } }
