/* Dropdowns in the site header nav (e.g. Paid Traffic ▾). Shared by
   /creative-center/ and /paid-traffic/; colours are the Creative Center
   header's own (--blue #1256ba family) so the menu looks the same on both. */
.navdrop { position: relative; display: inline-flex; }
.navdrop-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 10px; border: 0; border-radius: 8px; background: none; cursor: pointer;
  font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1; color: #475467;
}
.navdrop-btn:hover, .navdrop.is-open .navdrop-btn { color: #1256ba; background: #eef4fc; }
.navdrop-btn[aria-current="page"] { color: #1256ba; }
.navdrop-btn svg { width: 14px; height: 14px; flex: none; transition: transform .15s ease; }
.navdrop.is-open .navdrop-btn svg { transform: rotate(180deg); }
.navdrop-menu {
  display: none; position: absolute; top: calc(100% + 6px); left: 0; z-index: 60;
  min-width: 210px; padding: 6px;
  background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 24px -12px rgba(16, 24, 40, .18);
}
/* Bridges the gap under the button so a hover-opened menu stays open. */
.navdrop-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px; }
.navdrop-menu--end { left: auto; right: 0; }
.navdrop.is-open .navdrop-menu { display: block; }
@media (hover: hover) { .navdrop:hover .navdrop-menu { display: block; } }
.navdrop .navdrop-menu a {
  display: block; padding: 9px 12px; border-radius: 8px;
  font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1.3;
  color: #475467; text-decoration: none; white-space: nowrap;
}
.navdrop .navdrop-menu a:hover, .navdrop .navdrop-menu a:focus-visible { color: #1256ba; background: #eef4fc; }