:root{
  --brand:#d07800;
  --subnav-bg:#FFF7EF;
  --subnav-border:#E9DED4;
}

.subnav{
  display:flex; align-items:center; justify-content:center;
  background:var(--subnav-bg);
  border-bottom:1px solid var(--subnav-border);
  box-shadow:none;
}

.subnav__list{
  display:flex; flex-wrap:wrap;
  gap:clamp(24px,4vw,56px);
  margin:0; padding:0; list-style:none;
}

.subnav__list > li{
  position:relative; height:45px;
  display:flex; align-items:center; justify-content:center; min-width:0;
}

.subnav__list > li::after{
  content:""; position:absolute; left:0; right:0; bottom:0;
  height:2px; background:rgba(208,120,0,.35);
  transform:scaleX(0); transform-origin:center;
  transition:transform .22s, opacity .22s; opacity:0;
}

.subnav__list > li:hover::after,
.subnav__list > li:focus-within::after,
.subnav__list .current-menu-item::after{
  transform:scaleX(1); opacity:1;
}

.subnav__list a{
  display:inline-flex; align-items:center; justify-content:center;
  height:100%; padding:0 70px; white-space:nowrap;
  font-weight:700; font-size:clamp(15px,.4vw+14px,17px); line-height:1;
  color:#2f3135; text-decoration:none; transition:color .22s;
}

.subnav__list a:hover,
.subnav__list a:focus{ color:var(--brand); }

/* Хедер: поджать пункты и скрыть "…" если пустой */
@media (min-width:1024px){
  .wpl-28-header-wp .nav-menu > li > a{ padding-left:14px; padding-right:14px; }
  .wpl-28-header-wp .nav-menu{ gap:18px; }
  .wpl-28-menu-overflow:has(> ul.sub-menu:empty){ display:none; }
}
