/* Explicit marketing roles leave product screens and operational forms intact. */
.marketing-refresh {
  --marketing-title: clamp(2.125rem, 3.4vw, 3rem);
  --marketing-heading: clamp(1.5rem, 2.5vw, 2rem);
  --marketing-lead: 1.125rem;
}
body :is(#main-content.marketing-refresh, #main-content .marketing-refresh) [data-marketing-title],
body :is(#main-content.marketing-refresh, #main-content .marketing-refresh) [data-marketing-title] > span {
  font-family: "Poppins", "Open Sans", Arial, sans-serif !important;
  font-size: var(--marketing-title) !important;
  line-height: 1.17 !important;
  font-weight: 600 !important;
  letter-spacing: -.035em;
  text-wrap: balance;
  overflow-wrap: normal;
}
body :is(#main-content.marketing-refresh, #main-content .marketing-refresh) [data-marketing-lead] {
  font-size: var(--marketing-lead) !important;
  line-height: 1.65;
  text-wrap: pretty;
}
body :is(#main-content.marketing-refresh, #main-content .marketing-refresh) [data-marketing-heading] {
  font-size: var(--marketing-heading);
  line-height: 1.3;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.marketing-refresh [data-marketing-hero] { position: relative; isolation: isolate; }
@layer marketing-actions {
.marketing-refresh [data-marketing-action] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px !important;
  padding: 12px 22px;
  border: 1px solid transparent;
  border-radius: 999px !important;
  background: var(--btn-primary-bg, #00c434) !important;
  color: var(--btn-primary-fg, #fff) !important;
  font: 600 14px/22px "Open Sans", Arial, sans-serif;
  text-decoration: none;
  transition: background-color .4s ease, color .4s ease !important;
}
.marketing-refresh [data-marketing-action]:is(:hover,:focus-visible) {
  background: var(--btn-primary-hover, #1b1c1a) !important;
  color: var(--btn-primary-hover-fg, #fff) !important;
}
.marketing-refresh [data-marketing-action="secondary"] {
  border-color: var(--brand-purple-fill-1) !important;
  border-radius: 8px !important;
  background: var(--surface) !important;
  color: var(--brand-purple-fill-1) !important;
}
.marketing-refresh [data-marketing-action="secondary"]:is(:hover,:focus-visible) {
  background: var(--brand-purple-fill-1) !important;
  color: var(--text-on-dark, #fff) !important;
}
@media (prefers-reduced-motion: reduce) {
  .marketing-refresh [data-marketing-action] { transition: none !important; }
}
}
@media (max-width:600px) {
  .marketing-refresh { --marketing-lead: 1rem; }
  .marketing-refresh [data-marketing-title] { hyphens: auto; }
}