/* The "Use cases" dropdown in the marketing nav (js/usecases-menu.js; markup
   from scripts/audiences/_shared.mjs). Shared by the landing, the audience
   pages and the site pages; light only like the rest of marketing. */
.rd-uc { position: relative; }
.rd-uc-btn {
  display: inline-flex; align-items: center; gap: 2px; padding: 10px 10px 10px 14px; border: 0; border-radius: 8px;
  background: transparent; color: #000000; font: inherit; font-size: 16px; cursor: pointer;
}
.rd-uc-btn .material-symbols-rounded { font-size: 20px; transition: transform 160ms ease; }
.rd-uc-phone { display: none; }
.rd-uc.is-open .rd-uc-btn { background: #F5F5F5; }
.rd-uc.is-open .rd-uc-caret { transform: rotate(180deg); }
.rd-uc-btn:focus-visible { outline: 2px solid #0D99FF; outline-offset: 2px; }
.rd-uc-menu {
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 300; width: min(620px, calc(100vw - 32px));
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 10px;
  border: 1px solid #E6E6E6; border-radius: 16px; background: #FFFFFF;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 24px 48px -16px rgba(0, 0, 0, 0.22);
}
.rd-uc-menu[hidden] { display: none; }
.rd-uc-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.rd-uc-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; color: #000000; text-decoration: none; }
.rd-uc-item, .rd-uc-item:hover, .rd-uc-item:visited { color: #000000; text-decoration: none; }
.rd-uc-item:hover, .rd-uc-item:focus-visible, .rd-uc-item.is-on { background: #F5F5F5; outline: none; }
.rd-uc-ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 10px; color: #000000; font-size: 22px; }
.rd-uc-text { display: flex; flex-direction: column; min-width: 0; }
.rd-uc-text b { font-size: 15px; font-weight: 500; }
.rd-uc-text small { color: #6E6E6E; font-size: 13.5px; line-height: 1.35; }
@media (max-width: 640px) {
  .rd-uc-btn { padding: 8px 6px 8px 8px; font-size: 15px; }
}
@media (max-width: 420px) {
  .rd-uc-label, .rd-uc-caret { display: none; }
  .rd-uc-phone { display: inline; font-size: 24px; }
  .rd-uc-btn { padding: 8px; }
}
@media (max-width: 640px) {
  .rd-uc-menu { position: fixed; top: 64px; left: 16px; right: 16px; width: auto; grid-template-columns: minmax(0, 1fr); max-height: calc(100dvh - 88px); overflow-y: auto; }
}
