/* WanaLike interaction layer: shared hover, selected and responsive navigation states. */
.site-header .nav-wrap {
  width: min(96%, 1380px);
  gap: clamp(10px, 1.4vw, 22px);
}

.site-header .brand { flex: 0 0 auto; }

.site-header .nav {
  min-width: 0;
  flex: 1 1 auto;
  justify-content: center;
  gap: clamp(10px, 1.25vw, 22px);
}

.site-header .nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 1px;
  border: 0;
  border-radius: 0;
  white-space: nowrap;
  color: #d8e7ff;
  background: transparent;
  box-shadow: none;
  transition: color .18s ease, transform .18s ease;
}

.site-header .nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--cyan), var(--purple));
  box-shadow: 0 0 12px rgba(39, 215, 255, .5);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .18s ease;
}

.site-header .nav a:hover,
.site-header .nav a.is-active,
.site-header .nav a[aria-current="page"] {
  color: #fff;
  background: transparent;
  border: 0;
  box-shadow: none;
  transform: translateY(-1px);
}

.site-header .nav a:hover::after,
.site-header .nav a.is-active::after,
.site-header .nav a[aria-current="page"]::after { transform: scaleX(1); }

.site-header .nav-actions {
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}

.site-header .nav-actions .btn {
  min-height: 42px;
  padding-inline: 14px;
  white-space: nowrap;
  line-height: 1.15;
}

/* WING is an application view: keep only the navigation useful inside the client. */
body.is-wing-route .site-header .nav a[href="/ecosysteme"],
body.is-wing-route .site-header .nav a[href="/blog"],
body.is-wing-route .site-header .nav a[href="/projets"],
body.is-wing-route .site-header .nav a[href="/wanachess"],
body.is-wing-route .site-header .nav a[href="/fm"],
body.is-wing-route .site-header .nav a[href="/contact"] { display: none; }

body.is-wing-route .site-header .nav { justify-content: flex-start; }
body.is-wing-route .site-header .nav-wrap { width: min(98%, 1480px); }
body.is-wing-route .site-header .brand-text { display: inline; }

.btn,
.wing-channel,
.wing-rail-button,
.wing-console-actions button,
.wing-profile button,
.project-card,
.domain-card,
.story-card,
.tech-box,
.mini-card {
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}

.btn:hover,
.wing-channel:hover,
.wing-rail-button:hover,
.wing-console-actions button:hover,
.wing-profile button:hover { transform: translateY(-1px); }

.btn:focus-visible,
.site-header a:focus-visible,
.wing-channel:focus-visible,
.wing-rail-button:focus-visible,
.wing-profile button:focus-visible {
  outline: 2px solid rgba(39, 215, 255, .9);
  outline-offset: 3px;
}

.wing-profile { grid-template-columns: 40px minmax(0, 1fr) 36px 36px; }
.wing-profile-action { color: var(--wing-cyan) !important; }

/* STATUS must use the complete conversation width and wrap long IRC lines. */
.wing-status-log { width: 100%; max-width: none; margin-inline: 0; }
.wing-status-log p {
  width: 100%;
  grid-template-columns: 68px 58px minmax(0, 1fr);
}
.wing-status-log p > span {
  min-width: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.wing-messages { overflow-x: hidden; }

.wing-channel-list-command { margin-top: 4px; }

@media (max-width: 1260px) {
  .site-header .nav-wrap { width: min(98%, 1460px); gap: 8px; }
  .site-header .brand-text { display: none; }
  body.is-wing-route .site-header .brand-text { display: inline; }
  .site-header .nav { gap: 12px; }
  .site-header .nav a { font-size: .88rem; }
  .site-header .nav-actions .btn { padding-inline: 11px; font-size: .86rem; }
}

@media (max-width: 1040px) {
  .site-header .menu-toggle { display: inline-flex; }
  .site-header .nav,
  .site-header .nav-actions { display: none; }
  .site-header .nav-wrap.is-open .nav,
  .site-header .nav-wrap.is-open .nav-actions,
  .site-header .nav.is-open,
  .site-header .nav-actions.is-open { display: flex; }
}

.site-header .nav a{gap:7px}
.site-header .nav a>i{width:15px;color:#7186a8;font-size:.78rem;text-align:center;transition:color .18s ease,filter .18s ease}
.site-header .nav a:hover>i,.site-header .nav a.is-active>i,.site-header .nav a[aria-current="page"]>i{color:var(--cyan);filter:drop-shadow(0 0 7px rgba(39,215,255,.45))}
@media(max-width:1040px){.site-header .nav a>i{width:22px;font-size:.9rem}}


/* 2026-07 — compact navigation with accessible dropdowns */
.site-header .nav{gap:clamp(18px,1.65vw,30px)}
.site-header .nav-direct,
.site-header .nav-dropdown-toggle{
  position:relative;display:inline-flex;align-items:center;gap:10px;min-height:46px;
  padding:0 2px;border:0;color:#c9d7eb;background:transparent;white-space:nowrap;
  font:600 .91rem/1 Inter,sans-serif;cursor:pointer;transition:color .18s ease,transform .18s ease
}
.site-header .nav-direct>i,
.site-header .nav-dropdown-toggle>i:first-child{
  width:18px;margin-right:1px;color:#7890b2;font-size:.84rem;text-align:center;
  transition:color .18s ease,filter .18s ease
}
.site-header .nav-direct:hover,
.site-header .nav-direct.is-active,
.site-header .nav-dropdown-toggle:hover,
.site-header .nav-dropdown.is-open>.nav-dropdown-toggle,
.site-header .nav-dropdown:focus-within>.nav-dropdown-toggle{color:#fff;transform:translateY(-1px)}
.site-header .nav-direct:hover>i,
.site-header .nav-direct.is-active>i,
.site-header .nav-dropdown-toggle:hover>i:first-child,
.site-header .nav-dropdown.is-open>.nav-dropdown-toggle>i:first-child,
.site-header .nav-dropdown:focus-within>.nav-dropdown-toggle>i:first-child{
  color:var(--cyan);filter:drop-shadow(0 0 7px rgba(39,215,255,.42))
}
.site-header .nav-direct::after,
.site-header .nav-dropdown-toggle::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:999px;
  background:linear-gradient(90deg,var(--cyan),var(--purple));box-shadow:0 0 12px rgba(39,215,255,.42);
  transform:scaleX(0);transform-origin:center;transition:transform .18s ease
}
.site-header .nav-direct:hover::after,
.site-header .nav-direct.is-active::after,
.site-header .nav-dropdown.is-open>.nav-dropdown-toggle::after,
.site-header .nav-dropdown:focus-within>.nav-dropdown-toggle::after{transform:scaleX(1)}
.site-header .nav-dropdown{position:relative;display:flex;align-items:center}
.site-header .nav-chevron{width:auto!important;margin-left:1px!important;color:#627691!important;font-size:.58rem!important;filter:none!important;transition:transform .2s ease!important}
.site-header .nav-dropdown.is-open .nav-chevron,
.site-header .nav-dropdown:focus-within .nav-chevron{transform:rotate(180deg)}
.site-header .nav-dropdown-menu{
  position:absolute;z-index:1100;left:50%;top:calc(100% + 12px);width:350px;padding:10px;
  border:1px solid rgba(113,174,235,.18);border-radius:18px;
  background:linear-gradient(145deg,rgba(11,19,37,.98),rgba(5,10,22,.98));
  box-shadow:0 30px 80px rgba(0,0,0,.48),0 0 45px rgba(46,121,255,.08);
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,-8px) scale(.98);
  transform-origin:top center;transition:opacity .18s ease,transform .18s ease,visibility .18s
}
.site-header .nav-dropdown-menu::before{
  content:"";position:absolute;left:50%;top:-6px;width:11px;height:11px;
  border-left:1px solid rgba(113,174,235,.18);border-top:1px solid rgba(113,174,235,.18);
  background:#0a1223;transform:translateX(-50%) rotate(45deg)
}
.site-header .nav-dropdown.is-open>.nav-dropdown-menu,
.site-header .nav-dropdown:focus-within>.nav-dropdown-menu{
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1)
}
.site-header .nav-dropdown-head{padding:10px 12px 13px;margin-bottom:4px;border-bottom:1px solid rgba(148,163,184,.1)}
.site-header .nav-dropdown-head small{display:block;margin-bottom:5px;color:#63ddff;font:600 .58rem/1 "JetBrains Mono",monospace;letter-spacing:.14em}
.site-header .nav-dropdown-head strong{color:#dce9f8;font-size:.8rem}
.site-header .nav-dropdown-menu>a{
  position:relative;display:grid;grid-template-columns:39px minmax(0,1fr) auto;align-items:center;
  gap:12px;min-height:58px;padding:8px 10px;border:0;border-radius:12px;color:#d9e6f5;background:transparent;
  transform:none!important;transition:background .16s ease,border-color .16s ease
}
.site-header .nav-dropdown-menu>a::after{display:none}
.site-header .nav-dropdown-menu>a:hover,
.site-header .nav-dropdown-menu>a.is-active{background:linear-gradient(90deg,rgba(39,215,255,.08),rgba(159,92,255,.06))}
.site-header .nav-dropdown-menu>a>span:nth-child(2){display:flex;min-width:0;flex-direction:column;gap:3px}
.site-header .nav-dropdown-menu>a strong{font-size:.78rem}
.site-header .nav-dropdown-menu>a small{color:#6f829d;font-size:.65rem;font-weight:500}
.site-header .nav-menu-icon{display:grid!important;place-items:center;width:37px;height:37px;border:1px solid rgba(39,215,255,.16);border-radius:11px;color:#5cddff;background:rgba(39,215,255,.07)}
.site-header .nav-menu-icon i{width:auto!important;color:inherit!important;font-size:.82rem!important;filter:none!important}
.site-header .nav-menu-icon-purple{color:#c184ff;border-color:rgba(159,92,255,.18);background:rgba(159,92,255,.08)}
.site-header .nav-menu-icon-gold{color:#f1c968;border-color:rgba(241,201,104,.18);background:rgba(241,201,104,.07)}
.site-header .nav-menu-icon-green{color:#65e7ad;border-color:rgba(67,230,168,.18);background:rgba(67,230,168,.07)}
.site-header .nav-menu-icon-red{color:#ff849b;border-color:rgba(255,107,136,.18);background:rgba(255,107,136,.07)}
.site-header .nav-external{width:auto!important;color:#50647e!important;font-size:.58rem!important;filter:none!important}
.site-header .nav-actions .btn{gap:9px}
body.is-wing-route .site-header .nav-dropdown,
body.is-wing-route .site-header .nav-direct[href="/contact"]{display:none}

@media (min-width:1041px){
  .site-header .nav-dropdown:hover>.nav-dropdown-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1)}
  .site-header .nav-dropdown:hover .nav-chevron{transform:rotate(180deg)}
}
@media (max-width:1040px){
  .site-header .nav{align-items:stretch!important;gap:3px!important}
  .site-header .nav-direct,.site-header .nav-dropdown{width:100%}
  .site-header .nav-direct,.site-header .nav-dropdown-toggle{
    width:100%;min-height:48px;padding:0 14px;gap:13px;border-radius:11px
  }
  .site-header .nav-direct::after,.site-header .nav-dropdown-toggle::after{display:none}
  .site-header .nav-direct:hover,.site-header .nav-direct.is-active,.site-header .nav-dropdown.is-open>.nav-dropdown-toggle{background:rgba(39,215,255,.06)}
  .site-header .nav-chevron{margin-left:auto!important}
  .site-header .nav-dropdown{display:block}
  .site-header .nav-dropdown-menu{
    position:static;width:100%;max-height:0;padding:0 7px;margin:0;border:0;border-radius:0;
    background:transparent;box-shadow:none;backdrop-filter:none;opacity:1;visibility:visible;
    pointer-events:none;overflow:hidden;transform:none!important;transition:max-height .25s ease,padding .25s ease
  }
  .site-header .nav-dropdown-menu::before,.site-header .nav-dropdown-head{display:none}
  .site-header .nav-dropdown.is-open>.nav-dropdown-menu{max-height:430px;padding:5px 7px 9px;pointer-events:auto}
  .site-header .nav-dropdown-menu>a{min-height:53px;padding-left:20px}
  .site-header .nav-dropdown-menu>a small{display:block}
}

.site-header .nav-dropdown.has-active-child>.nav-dropdown-toggle{color:#fff}
.site-header .nav-dropdown.has-active-child>.nav-dropdown-toggle::after{transform:scaleX(1)}
.site-header .nav-dropdown.has-active-child>.nav-dropdown-toggle>i:first-child{color:var(--cyan);filter:drop-shadow(0 0 7px rgba(39,215,255,.42))}