/* Site-level compact, accessible dropdown navigation. Loaded after all original CSS. */
.header{overflow:visible!important}
.nav{position:relative;min-width:0}
.site-nav-dropdown{position:relative;display:block;flex:0 0 auto;align-self:center;min-width:0;z-index:115}
.site-nav-dropdown summary.site-nav-trigger{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:124px;min-height:44px;padding:10px 14px;white-space:nowrap;cursor:pointer;user-select:none;list-style:none;position:relative;border-radius:15px;background:linear-gradient(155deg,#0b363d,#08232b);border:1px solid rgba(69,219,179,.48);box-shadow:0 10px 22px rgba(0,0,0,.15),inset 0 1px rgba(255,255,255,.10);color:#e8fff7;font-weight:800;font-size:.88rem;line-height:1.15;transition:background .2s,border-color .2s,box-shadow .2s}
.site-nav-dropdown summary.site-nav-trigger::-webkit-details-marker{display:none}
.site-nav-dropdown summary.site-nav-trigger:hover,.site-nav-dropdown[open] summary.site-nav-trigger{border-color:#64f6cc;background:linear-gradient(145deg,#10493e,#093036);box-shadow:0 0 0 3px rgba(70,246,199,.09),0 14px 30px rgba(0,0,0,.22)}
.site-nav-hamburger{display:flex;flex-flow:column nowrap;gap:4px;width:18px;flex:none}
.site-nav-hamburger i{width:18px;height:2px;display:block;border-radius:2px;background:#78ffd1;transition:transform .2s,opacity .2s}
.site-nav-dropdown[open] .site-nav-hamburger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.site-nav-dropdown[open] .site-nav-hamburger i:nth-child(2){opacity:0}
.site-nav-dropdown[open] .site-nav-hamburger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.site-nav-chevron{width:8px;height:8px;border-bottom:2px solid #8fffd9;border-right:2px solid #8fffd9;transform:rotate(45deg) translateY(-2px);margin-left:3px;transition:transform .2s;flex:none}
.site-nav-dropdown[open] .site-nav-chevron{transform:rotate(225deg) translateY(-1px)}
.site-nav-dropdown:not([open])>.nav-menu{display:none!important}
.site-nav-dropdown[open]>.nav-menu{display:flex!important;box-sizing:border-box;position:absolute;top:calc(100% + 12px);left:0;right:auto;width:min(350px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:min(500px,calc(100dvh - 100px));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;flex-direction:column;align-items:stretch;gap:5px;margin:0;padding:12px;border:1px solid rgba(66,213,179,.35);border-radius:19px;background:linear-gradient(145deg,rgba(9,38,44,.985),rgba(6,22,32,.99));box-shadow:0 24px 65px rgba(0,0,0,.50),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(24px);z-index:220;white-space:normal;direction:ltr}
.site-nav-dropdown .nav-menu a{display:flex;align-items:center;min-height:45px;width:100%;padding:11px 15px;border-radius:11px;color:#e3f9f3!important;text-align:start;font-size:.91rem;line-height:1.35;white-space:normal;overflow-wrap:anywhere;font-weight:650;border:1px solid transparent;transition:background .2s,border-color .2s}
.site-nav-dropdown .nav-menu a:hover,.site-nav-dropdown .nav-menu a:focus-visible{background:linear-gradient(100deg,rgba(43,226,180,.13),rgba(31,184,155,.04));border-color:rgba(96,252,210,.18);color:#fff!important}
.site-nav-dropdown .nav-menu a:active{background:rgba(30,180,142,.28)}
.site-nav-dropdown .nav-menu a:not(:last-child){border-bottom-color:rgba(84,222,179,.09)}
.site-nav-dropdown .nav-menu a::before{content:'';width:6px;height:6px;display:block;flex:none;border-radius:50%;margin-inline-end:12px;background:#28e8af;box-shadow:0 0 10px rgba(38,229,176,.35)}
.menu-toggle{display:none!important}
/* Nav is one dropdown on desktop and mobile. Main menu stays within device viewport. */
@media(max-width:1000px){
 .site-nav-dropdown[open]>.nav-menu{position:fixed;left:12px;right:12px;top:var(--site-menu-top,90px);width:auto;max-width:none;max-height:calc(100dvh - var(--site-menu-top,90px) - 12px);padding:10px;z-index:220}
}
@media(max-width:850px){
 .header>.container.nav,.nav{display:grid!important;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;row-gap:9px;align-items:center;width:calc(100% - 24px);max-width:100%;height:auto!important;min-height:0!important;padding:12px 0 10px!important}
 .nav>.brand{grid-column:1;grid-row:1;min-width:0;max-width:100%}
 .nav>.site-nav-dropdown{grid-column:2;grid-row:1;justify-self:end;margin:0}
 .site-nav-dropdown summary.site-nav-trigger{min-width:0;min-height:42px;padding:9px 11px;gap:8px;border-radius:13px;font-size:.84rem}
 .nav>.nav-right{grid-column:1/-1;grid-row:2;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(115px,146px);gap:8px;margin:0;padding:0;max-width:100%;width:100%;align-items:center;justify-content:stretch}
 .nav-right>.btn,.nav-right>.nav-login,.nav-right>.nav-register{display:none!important}
 .nav-right>.search-box{position:relative!important;left:auto!important;right:auto!important;top:auto!important;grid-column:1;grid-row:1;display:flex;width:100%!important;max-width:100%!important;min-width:0!important;height:41px;flex:none;order:initial!important;padding:8px 12px;border-radius:13px}
 .nav-right>.search-box input{opacity:1!important;visibility:visible!important;display:block;width:100%}
 .nav-right>.search-box:focus-within{width:100%!important}
 .nav-right>.locale-picker{position:relative;grid-column:2;grid-row:1;display:block;min-width:0!important;max-width:100%!important;width:100%!important;margin:0!important;order:initial!important}
 .nav-right>.locale-picker summary{width:100%;max-width:100%;min-width:0;padding:9px 10px}
 .nav-right>.locale-picker .locale-menu{left:auto!important;right:0!important;min-width:min(290px,calc(100vw - 24px))!important;max-width:calc(100vw - 24px)!important;max-height:min(390px,calc(100dvh - 145px))!important}
 .site-nav-dropdown[open]>.nav-menu{left:12px;right:12px;top:var(--site-menu-top,122px);max-height:calc(100dvh - var(--site-menu-top,122px) - 12px)}
}
@media(max-width:380px){
 .nav{width:calc(100% - 20px)!important;column-gap:6px}
 .nav>.brand{font-size:1.13rem}
 .nav .binarium-wordmark{font-size:1.16rem}
 .site-nav-dropdown summary.site-nav-trigger{padding:8px 9px;font-size:.79rem;gap:6px}
 .nav>.nav-right{grid-template-columns:minmax(0,1fr) minmax(103px,130px);gap:6px}
 .locale-name{font-size:12px!important}
}
/* RTL languages: keep the label and links correctly aligned */
[dir=rtl] .site-nav-dropdown .nav-menu a{direction:rtl;text-align:right}
[dir=rtl] .site-nav-dropdown .nav-menu a::before{margin-inline-start:0}
[dir=rtl] .site-nav-dropdown[open]>.nav-menu{direction:rtl}
@media(prefers-reduced-motion:reduce){.site-nav-hamburger i,.site-nav-chevron{transition:none}}

/* === Navigation alignment refinement · 2026-10-10 === */
@media (min-width: 851px){
  .header>.container.nav{display:flex;align-items:center;justify-content:flex-start;gap:20px;min-height:78px}
  .nav>.brand{flex:0 0 auto}
  .nav>.site-nav-dropdown{margin-inline-start:clamp(4px,1.4vw,18px);margin-inline-end:auto}
  .nav>.nav-right{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:0 1 auto;min-width:0;margin-inline-start:auto}
  .site-nav-dropdown summary.site-nav-trigger{height:44px;border-radius:13px}
  .site-nav-dropdown[open]>.nav-menu{width:310px;max-width:min(310px,calc(100vw - 24px));top:calc(100% + 14px)}
  .nav-right>.locale-picker{margin:0;max-width:180px}
  .nav-right>.locale-picker summary{height:44px;min-height:44px;border-radius:13px}
  .nav-right>.search-box{height:44px;border-radius:13px}
}
@media (min-width:851px) and (max-width:1100px){
  .header>.container.nav{gap:11px}
  .nav>.site-nav-dropdown{margin-inline-start:4px}
  .nav>.nav-right{gap:8px}
  .nav>.nav-right .nav-login{display:none!important}
  .nav>.nav-right .search-box{width:108px}
  .nav>.nav-right .search-box:focus-within{width:145px}
  .nav>.nav-right .nav-register{padding-inline:12px;white-space:nowrap;font-size:.77rem}
  .nav>.nav-right .locale-picker{min-width:142px;max-width:158px}
  .nav>.nav-right .locale-picker summary{padding-inline:10px}
  .site-nav-dropdown summary.site-nav-trigger{min-width:110px;padding-inline:12px}
}
/* Even, calm link rhythm inside the dropdown */
.site-nav-dropdown[open]>.nav-menu{
  counter-reset:site-nav-counter;
  gap:5px;
  padding:11px;
  background:#071f24;
  border:1px solid rgba(74,215,178,.42);
  border-radius:17px;
  box-shadow:0 20px 55px rgba(0,0,0,.68),0 0 0 1px rgba(61,209,163,.055),inset 0 1px 0 rgba(255,255,255,.07);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.site-nav-dropdown .nav-menu a{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  justify-content:start;
  gap:12px;
  min-height:48px;
  padding:9px 12px;
  margin:0;
  border:1px solid rgba(81,214,181,.075)!important;
  border-radius:11px;
  background:rgba(255,255,255,.022);
  color:#e8fff9!important;
  font-weight:680;
  font-size:.92rem;
  line-height:1.35;
  letter-spacing:.002em;
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.site-nav-dropdown .nav-menu a::before{
  counter-increment:site-nav-counter;
  content:counter(site-nav-counter,decimal-leading-zero);
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  margin:0;
  flex:none;
  border:1px solid rgba(68,217,169,.22);
  border-radius:8px;
  background:#0c3936;
  color:#71f5ca;
  box-shadow:none;
  font-size:10px;
  font-weight:800;
  letter-spacing:.03em;
  font-variant-numeric:tabular-nums;
}
.site-nav-dropdown .nav-menu a:hover,.site-nav-dropdown .nav-menu a:focus-visible{
  transform:none;
  border-color:rgba(81,232,191,.42)!important;
  background:linear-gradient(90deg,rgba(42,218,175,.17),rgba(42,218,175,.04));
}
.site-nav-dropdown .nav-menu a:hover::before,.site-nav-dropdown .nav-menu a:focus-visible::before{
  background:#0a6e59;color:#fff;border-color:rgba(101,255,208,.45)
}
/* Keep the native marker out of the trigger in all browsers */
.site-nav-dropdown summary.site-nav-trigger::marker{content:"";font-size:0}
@media (max-width:850px){
  .header{background:rgba(3,19,22,.975);box-shadow:0 9px 28px rgba(0,0,0,.22)}
  .header>.container.nav,.nav{
    width:calc(100% - 28px)!important;
    max-width:620px;
    margin-inline:auto;
    padding:11px 0 12px!important;
    column-gap:12px;
    row-gap:11px;
    grid-template-columns:minmax(0,1fr) auto;
  }
  .nav>.brand{display:inline-flex;align-items:center;gap:9px;min-width:0;max-width:100%;line-height:1.05}
  .nav .binarium-symbol{flex:0 0 37px}
  .nav .binarium-wordmark{font-size:1.43rem;letter-spacing:-.04em;white-space:nowrap}
  .nav>.site-nav-dropdown{align-self:center;justify-self:end}
  .site-nav-dropdown summary.site-nav-trigger{
    display:flex;align-items:center;justify-content:center;
    width:auto;min-width:116px;height:42px;min-height:42px;
    padding:10px 14px;gap:9px;border-radius:13px;
    background:#0a3535;border-color:rgba(89,226,189,.56);
    font-size:.87rem;letter-spacing:.01em;
  }
  .site-nav-dropdown summary.site-nav-trigger .site-nav-hamburger{width:17px;gap:4px}
  .site-nav-dropdown summary.site-nav-trigger .site-nav-hamburger i{width:17px}
  .nav>.nav-right{
    display:grid!important;
    grid-column:1/-1;
    grid-row:2;
    grid-template-columns:minmax(0,1fr) minmax(115px,148px);
    gap:10px;
    width:100%;max-width:100%;
    align-items:stretch;
  }
  .nav-right>.search-box,
  .nav-right>.locale-picker summary{height:43px!important;min-height:43px!important;border-radius:13px!important;margin:0!important}
  .nav-right>.search-box{padding:9px 12px}
  .nav-right>.locale-picker{position:relative;z-index:116;margin:0}
  .nav-right>.locale-picker summary{display:flex;align-items:center;padding:9px 11px!important;box-shadow:none}
  .nav-right>.locale-picker .locale-current{gap:7px}
  .nav-right>.locale-picker .locale-name{font-size:13px!important;font-weight:750}
  .site-nav-dropdown[open]>.nav-menu{
    position:fixed;
    top:var(--site-menu-top,122px);
    left:14px;
    right:14px;
    width:auto;
    max-width:none;
    max-height:calc(100dvh - var(--site-menu-top,122px) - 14px);
    padding:10px;
    gap:5px;
    border-radius:17px;
    background:#071e23;
    box-shadow:0 24px 56px rgba(0,0,0,.76),0 0 0 1px rgba(78,225,176,.11);
  }
  .site-nav-dropdown .nav-menu a{min-height:46px;padding:9px 11px;gap:12px;font-size:.92rem}
  .nav-right>.locale-picker[open]{z-index:225}
  .nav-right>.locale-picker .locale-menu{
    position:fixed!important;
    top:var(--site-menu-top,122px)!important;
    left:14px!important;
    right:14px!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    max-height:calc(100dvh - var(--site-menu-top,122px) - 14px)!important;
    overflow-y:auto;
    background:#071e23;
    box-shadow:0 24px 56px rgba(0,0,0,.74)
  }
}
@media (max-width:380px){
  .header>.container.nav,.nav{width:calc(100% - 22px)!important;column-gap:7px;row-gap:9px}
  .nav .binarium-wordmark{font-size:1.29rem}
  .site-nav-dropdown summary.site-nav-trigger{min-width:104px;padding-inline:10px;gap:7px}
  .nav>.nav-right{gap:7px;grid-template-columns:minmax(0,1fr) minmax(100px,125px)}
  .site-nav-dropdown[open]>.nav-menu{left:11px;right:11px}
  .nav-right>.locale-picker .locale-menu{left:11px!important;right:11px!important}
}
@media (max-width:850px){
  [dir=rtl] .nav>.site-nav-dropdown{justify-self:end}
  [dir=rtl] .site-nav-dropdown .nav-menu a{text-align:right;direction:rtl}
  [dir=rtl] .site-nav-dropdown .nav-menu a::before{margin:0}
}

/* Language-only headers: use the complete second row instead of leaving an empty cell. */
@media (max-width:850px){
 .locale-page .nav>.nav-right{grid-template-columns:minmax(0,1fr)!important}
 .locale-page .nav-right>.locale-picker{grid-column:1;grid-row:1;width:100%!important;max-width:100%!important}
 .locale-page .nav-right>.locale-picker summary{width:100%;min-width:0}
}

@media (min-width:851px){
  /* RTL menu should open inward, not cross the right viewport edge. */
  [dir=rtl] .site-nav-dropdown[open]>.nav-menu{left:auto;right:0}
}
