/* Opt-in presentation for public feature and landlord marketing pages. */
body.public-design #main-content .marketing-features { color: var(--text); }
body.public-design #main-content .marketing-features [data-marketing-title],
body.public-design #main-content .marketing-features [data-marketing-title] > span { font: 600 var(--marketing-title)/1.17 Poppins, "Open Sans", Arial, sans-serif !important; letter-spacing: -.035em !important; }
body.public-design #main-content .marketing-features [data-marketing-lead] { font-size: var(--marketing-lead) !important; line-height: 1.65 !important; }
body.public-design #main-content .marketing-features [data-marketing-hero] { position: relative; isolation: isolate; }
body.public-design #main-content .marketing-features .cz-wrap > [data-marketing-hero] { padding: 44px 0; gap: 44px; margin-bottom: 28px; }
body.public-design #main-content .marketing-features .cz-wrap > [data-marketing-hero]::before { content: ""; position: absolute; inset: 0 -36px; z-index: -1; border-radius: 28px; background: linear-gradient(130deg, var(--ai-bg), var(--surface) 58%, var(--pastel-lime)); }
body.public-design #main-content .marketing-features .cz-band { padding-top: 30px; }
body.public-design #main-content .marketing-features [data-marketing-hero] .cz-copy { align-self: center; }
body.public-design #main-content .marketing-features [data-marketing-title] :is(.cz-grad,.rai-grad,.ln-grad,.lv-grad) { background: none; color: var(--brand-purple); -webkit-text-fill-color: currentColor; }
body.public-design #main-content .marketing-features .cz-copy :is(.cz-p,.cz-sub),
body.public-design #main-content .marketing-features :is(.ft-panel-copy,.ft-group-heading,.pf-flow,.ys-points,.ys-list,.mzz-body) p { font-size: 16px; line-height: 1.65; }
body.public-design #main-content .marketing-features :is(.cz-copy > h2,.ft-group-heading h2,.ys-band h2) { font: 600 28px/1.25 Poppins, sans-serif; letter-spacing: -.025em; }
body.public-design #main-content .marketing-features :is(.ft-panel-copy h3,.pf-flow h3,.ys-points h3) { font-size: 21px; line-height: 1.35; }
body.public-design #main-content .marketing-features .mf-benefits { display: flex; flex-wrap: wrap; gap: 8px 18px; list-style: none; padding: 0; margin: 24px 0 0; }
body.public-design #main-content .marketing-features .mf-benefits li { display: flex; align-items: baseline; gap: 8px; font-size: 14px; font-weight: 600; line-height: 1.5; }
body.public-design #main-content .marketing-features .mf-benefits li::before { content: ""; flex: 0 0 7px; width: 7px; height: 7px; border-radius: 50%; background: var(--ink-purple-lime); border: 1px solid var(--text); }
body.public-design #main-content .marketing-features .fpg-trust { border-top: 1px solid var(--border); padding-top: 18px; }
body.public-design #main-content .marketing-features .fpg-trust .cz-grad { color: var(--text); background: none; -webkit-text-fill-color: currentColor; }
body.public-design #main-content .marketing-features :is(.pd-action,.pd-secondary,.fpg-btn,.pg-btn,.mzz-cta,.rai-btn,.ln-btn) { min-height: 48px; padding: 12px 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 600; line-height: 1.45; white-space: normal; text-align: center; }
body.public-design #main-content .marketing-features :is(.pd-action,.fpg-btn.primary,.pg-btn:not(.secondary),.mzz-cta,.rai-btn.p) { border-radius: 999px; background: var(--btn-primary-bg); color: var(--btn-primary-fg); border-color: var(--btn-primary-bg); transition: background-color .4s, color .4s; }
body.public-design #main-content .marketing-features :is(.pd-action,.fpg-btn.primary,.pg-btn:not(.secondary),.mzz-cta,.rai-btn.p):is(:hover,:focus-visible) { background: var(--btn-primary-hover); color: var(--btn-primary-hover-fg); }
body.public-design #main-content .marketing-features :is(.pd-secondary,.fpg-btn.ghost,.rai-btn.g) { border: 1px solid var(--brand-purple); border-radius: 8px; color: var(--brand-purple); background: var(--surface); }
body.public-design #main-content .marketing-features :is(.pd-secondary,.fpg-btn.ghost,.rai-btn.g):is(:hover,:focus-visible) { background: var(--brand-purple); color: var(--surface); }
body.public-design #main-content .marketing-features :is(.ft-hero,.pf-hero-grid) { padding-block: 64px; }
body.public-design #main-content .marketing-features .ft-hero-copy { max-width: none; }
body.public-design #main-content .marketing-features .ft-hero-art { background: var(--surface); border-radius: 24px; overflow: hidden; }
body.public-design #main-content .marketing-features .ft-hero-art img { max-height: none; border-radius: 24px; }
body.public-design #main-content .marketing-features .ft-art-note { margin: 16px 12px; font-size: 14px; }
body.public-design #main-content .marketing-features .ft-group { padding-top: 64px; }
body.public-design #main-content .marketing-features .ft-panel { border: 1px solid var(--border); border-radius: 24px; }
body.public-design #main-content .marketing-features .mzz-hero { background: linear-gradient(120deg, var(--ai-bg), var(--surface) 68%, var(--pastel-lime)); color: var(--text); padding-block: 64px; }
body.public-design #main-content .marketing-features .mzz-h1,
body.public-design #main-content .marketing-features .mzz-lede { color: var(--text); }
body.public-design #main-content .marketing-features .mzz-h1 span { color: var(--brand-purple); background: none; -webkit-text-fill-color: currentColor; }
body.public-design #main-content .marketing-features .mf-photo-hero { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 44px; }
body.public-design #main-content .marketing-features .mf-photo-hero > div { min-width: 0; }
body.public-design #main-content .marketing-features .mf-photo-hero .mzz-h1 { max-width: none; }
body.public-design #main-content .marketing-features .mf-scene { margin: 0; min-width: 0; }
body.public-design #main-content .marketing-features .mf-scene img { display: block; width: 100%; height: auto; border-radius: 24px; }
body.public-design #main-content .marketing-features .mf-scene figcaption { color: var(--text-muted); font-size: 14px; line-height: 1.5; margin-top: 12px; }
body.public-design #main-content .marketing-features :is(.rai-hero,.ln-hero) [data-marketing-title] { color: var(--surface); }
body.public-design #main-content .marketing-features :is(.rai-hero,.ln-hero) [data-marketing-lead] { color: var(--text-on-dark-muted); }
body.public-design #main-content .marketing-features .rai-dark :is(.rai-ben p,.rai-node .tx span,.rai-stat span,.rai-eye) { color: var(--text-on-dark-muted); }
body.public-design #main-content .marketing-features [data-marketing-reveal] { scroll-margin-top: 110px; }
body.public-design #main-content .marketing-features .lt-phone { width: 100%; max-width: 310px; }
@media (max-width: 900px) {
  body.public-design #main-content .marketing-features .mf-photo-hero { grid-template-columns: 1fr; gap: 28px; }
  body.public-design #main-content .marketing-features .mf-scene { max-width: 600px; }
}
@media (max-width: 640px) {
  body.public-design #main-content .marketing-features .cai-orbit-two { max-width: 75%; height: auto; aspect-ratio: 1; }
  body.public-design #main-content .marketing-features .cz-wrap > [data-marketing-hero] { padding-block: 28px; gap: 28px; }
  body.public-design #main-content .marketing-features .cz-wrap > [data-marketing-hero]::before { inset-inline: -12px; border-radius: 18px; }
  body.public-design #main-content .marketing-features :is(.ft-hero,.pf-hero-grid,.mzz-hero) { padding-block: 36px; }
  body.public-design #main-content .marketing-features :is(.cz-copy > h2,.ft-group-heading h2,.ys-band h2) { font-size: 25px; }
  body.public-design #main-content .marketing-features .ft-panel { padding: 20px; }
  body.public-design #main-content .marketing-features .mf-benefits { gap: 8px 14px; }
  body.public-design #main-content .marketing-features :is(.fpg-cta-row,.rai-cta,.ln-cta-row,.lv-cta) > :is(.pd-action,.pd-secondary) { width: auto; max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  body.public-design #main-content .marketing-features :is(.pd-action,.pd-secondary) { transition: none; }
}

body.public-design #main-content .marketing-features :is(.rai-hero,.ln-hero) { --btn-primary-hover: var(--brand-purple-fill-1); --btn-primary-hover-fg: var(--text-on-dark); }
