/* Fund Information drop-down: the one addition to the quayside.eu header. */
.dd { position: relative; }
.dd > button { font-family: inherit; font-size: 14px; font-weight: 600; color: #cdd9e4; padding: 9px 14px; border-radius: 8px;
  background: none; border: none; cursor: pointer; transition: background .15s, color .15s; }
.dd > button:hover, .dd:focus-within > button, .dd.open > button { background: rgba(255,255,255,0.085); color: #fff; }
.dd > button::after { content: ""; display: inline-block; margin-left: 7px; width: 6px; height: 6px; border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor; transform: translateY(-3px) rotate(45deg); }
.dd-menu { display: none; position: absolute; top: 100%; left: 0; padding-top: 8px; min-width: 260px; z-index: 60; }
.dd-menu > div { background: #172c47; border: 1px solid rgba(255,255,255,0.20); border-radius: 12px; padding: 6px; box-shadow: 0 14px 30px rgba(0,0,0,0.35); }
.dd:hover .dd-menu, .dd:focus-within .dd-menu, .dd.open .dd-menu { display: block; }
.dd-menu a { display: block; font-size: 14px; font-weight: 600; color: #cdd9e4; text-decoration: none; padding: 10px 12px; border-radius: 8px; }
.dd-menu a:hover { background: rgba(255,255,255,0.085); color: #fff; }
.dd-mobile { display: none; }

@media (max-width: 900px) {
  nav.mainnav { display: none; }
  .hwrap { gap: 10px; }
  .dd-mobile { display: block; margin-left: auto; position: static; }
  .dd-mobile > button { font-size: 13.5px; padding: 9px 11px; border: 1px solid rgba(255,255,255,0.20); }
  /* Full-width panel under the (sticky, positioned) header so it never runs off a small screen. */
  .dd-mobile .dd-menu { left: 16px; right: 16px; min-width: 0; padding-top: 6px; }
}
