/* ============================================================
   CENTRAL PARK RESIDENCES — HEADER DROPDOWN ADDITIONS
   header.css
   ------------------------------------------------------------
   The base nav (.nav, .nav-menu, .nav-burger, .logo, sticky
   .solid, mobile sheet) lives in core.css + responsive.css and
   is matched 1:1 by the source. This file adds ONLY optional
   dropdown-menu styling, consistent with the nav's dark glass
   aesthetic. Loaded on demand by the CP Site Header widget.

   Depends on: variables.css, core.css
   ============================================================ */

.nav-item{position:relative;}
.nav-item > a{
  color:rgba(255,255,255,.78);font-size:13.5px;font-weight:500;
  padding:9px 16px;border-radius:var(--r-pill);transition:all .3s var(--ease);
  display:inline-flex;align-items:center;gap:6px;cursor:pointer;
}
.nav-item > a::after{
  content:"";width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);margin-left:3px;margin-top:-2px;opacity:.7;transition:transform .3s var(--ease);
}
.nav-item:hover > a{background:rgba(255,255,255,.10);color:#fff;}

.nav-sub{
  position:absolute;top:calc(100% + 10px);left:0;min-width:210px;
  background:rgba(21,21,19,.97);backdrop-filter:blur(16px) saturate(130%);-webkit-backdrop-filter:blur(16px) saturate(130%);
  border:1px solid var(--line-d);border-radius:16px;padding:8px;
  display:flex;flex-direction:column;gap:2px;
  opacity:0;transform:translateY(-8px);pointer-events:none;
  transition:opacity .3s var(--ease),transform .3s var(--ease);z-index:90;
}
.nav-item:hover .nav-sub{opacity:1;transform:none;pointer-events:auto;}
.nav-sub a{color:rgba(255,255,255,.8);font-size:13.5px;font-weight:500;padding:10px 14px;border-radius:10px;white-space:nowrap;transition:all .3s var(--ease);}
.nav-sub a:hover{background:rgba(255,255,255,.10);color:#fff;}

/* Mobile: dropdown becomes an inline expandable list inside the sheet. */
@media(max-width:980px){
  .nav-item{width:100%;}
  .nav-item > a{width:100%;justify-content:space-between;padding:14px 16px;font-size:15px;border-radius:12px;}
  .nav-item.open > a::after{transform:rotate(-135deg);margin-top:2px;}
  .nav-sub{
    position:static;min-width:0;opacity:1;transform:none;pointer-events:auto;
    display:none;background:transparent;border:none;padding:2px 0 8px 12px;
    backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:0;
  }
  .nav-item.open .nav-sub{display:flex;}
  .nav-sub a{font-size:14.5px;padding:11px 14px;}
}