/* Marketing only: keep product workspaces independent of campaign styling. */
body.marketing-page {
  --marketing-ink: #faf5ec;
  --marketing-focus: #ffca4a;
}
.marketing-page [hidden] { display: none !important; }
.marketing-page :where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--marketing-focus);
  outline-offset: 5px;
}
.marketing-page :where(section, main, [id]) { scroll-margin-top: 6rem; }
.marketing-page main p { text-wrap: pretty; }
.marketing-page :where(h1, h2, h3) { text-wrap: balance; }
.marketing-page .text-gradient-gold {
  background: none;
  -webkit-text-fill-color: currentColor;
  color: var(--marketing-ink);
}
.marketing-page #mobile-menu {
  max-height: calc(100dvh - 4rem);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.marketing-page header :where(a, button) { min-height: 44px; }
.marketing-page header nav a { display: inline-flex; align-items: center; }
.marketing-page #resetPasswordForm input { padding-inline-start: 2.5rem; padding-inline-end: 3.25rem; }
.marketing-page #resetPasswordForm button[onclick^="togglePassword("] {
  min-width: 44px;
  min-height: 44px;
  right: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
html[dir="rtl"] .marketing-page #resetPasswordForm button[onclick^="togglePassword("] { right: auto; left: 2px; }
html[dir="rtl"] .marketing-page #resetPasswordForm .fa-lock { left: auto; right: .75rem; }
html[dir="rtl"] .marketing-page .font-display {
  font-family: Cairo, Amiri, sans-serif;
  letter-spacing: normal;
  line-height: 1.5;
}
html[dir="rtl"] .marketing-page .fa-arrow-right { transform: rotate(180deg); }
@media (max-width: 639px) {
  .marketing-page main h1 { overflow-wrap: anywhere; }
  .marketing-page main :where(input, select, textarea) { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(body.marketing-page) { scroll-behavior: auto !important; }
  .marketing-page *, .marketing-page *::before, .marketing-page *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  .marketing-page [data-animate], .marketing-page .js-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}