/* Dropdown for the main nav ("Tech teams" > sub pages). Works with style.css and practice.css. */
.nav-links .nav-dd{ position:relative; display:flex; align-items:center; }
.nav-links .nav-dd > a{
  padding-right: 26px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2399A3B3' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
}
.nav-links .nav-dd > a.active::after{ right: 26px; }
.nav-dd-menu{
  display:none;
  position:absolute; top:100%; left:0; z-index:60;
  min-width: 250px;
  margin-top: 6px; padding: 6px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 14px 34px rgba(0,0,0,.45);
}
/* invisible bridge so the menu doesn't close while the pointer crosses the gap */
.nav-dd-menu::before{ content:""; position:absolute; left:0; right:0; top:-8px; height:8px; }
.nav-dd:hover .nav-dd-menu,
.nav-dd:focus-within .nav-dd-menu{ display:block; }
.nav-links .nav-dd-menu a{ display:block; white-space:normal; padding:10px 12px; }
.nav-dd-menu small{ display:block; font-size:11.5px; color: var(--ink-faint, #626D7D); font-weight:400; margin-top:2px; }

@media (max-width: 1040px){
  .nav-links .nav-dd{ display:block; }
  .nav-links .nav-dd > a{ background-position: right 12px center; }
  .nav-dd-menu{
    display:block; position:static; min-width:0; margin:0 0 4px 10px; padding:0 0 0 10px;
    background:transparent; border:0; border-left:2px solid var(--line); border-radius:0; box-shadow:none;
  }
  .nav-dd-menu::before{ display:none; }
  .nav-links .nav-dd-menu a{ padding:10px; }
}

/* ---- Menu now has one more top-level item (Articles) ----
   Slightly tighter spacing keeps the bar on one line in all three languages. */
.toolbar .brand-text strong, .toolbar .nav-cta{ white-space:nowrap; }
@media (min-width: 1041px){
  .nav-links{ gap:0; }
  .nav-links a{ padding-left:9px; padding-right:9px; }
  .nav-links a.active::after{ left:9px; right:9px; }
  .toolbar .nav-cta{ margin-right:8px !important; padding-left:11px; padding-right:11px; }
  .toolbar .lang-switch{ padding:9px 9px; margin-right:6px; }
  .toolbar .lang-switch + .lang-switch{ margin-left:0; }
}
@media (min-width: 1041px) and (max-width: 1300px){
  .toolbar .brand{ gap:9px; margin-right:10px; }
  .toolbar .brand-text span{ display:none; }
  .nav-links a{ padding-left:7px; padding-right:7px; font-size:13.5px; }
  .nav-links a.active::after{ left:7px; right:7px; }
}
@media (min-width: 1041px) and (max-width: 1150px){
  .nav-links a{ padding-left:5px; padding-right:5px; font-size:13px; }
  .nav-links a.active::after{ left:5px; right:5px; }
  .toolbar .nav-cta{ font-size:11.5px; padding-left:8px; padding-right:8px; margin-right:6px !important; }
  .toolbar .lang-switch{ padding:8px 7px; margin-right:4px; font-size:11.5px; }
}