/* Rental marketing: alternating stories with the original product demonstrations. */
.mk-page.marketing-refresh {
  --feature-title: clamp(34px, 3.4vw, 48px);
  --marketing-heading: clamp(28px, 2.5vw, 36px);
  --marketing-lead: 18px;
  color: var(--text); background: var(--surface); overflow: clip;
}
.mk-page *, .mk-page *::before, .mk-page *::after { box-sizing: border-box; }
.mk-page .mk-wrap { width: min(1160px, calc(100% - 80px)); margin-inline: auto; }
.mk-page [id] { scroll-margin-top: 120px; }
.mk-page figure { margin: 0; min-width: 0; }
.mk-page img { display: block; max-width: 100%; height: auto; }
.mk-page .mk-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: clamp(36px, 6vw, 80px); }
.mk-page .mk-grid > * { min-width: 0; }
.mk-page .mk-reverse > .mk-copy { grid-column: 2; grid-row: 1; }
.mk-page .mk-reverse > :not(.mk-copy) { grid-column: 1; grid-row: 1; }
.mk-page .mk-copy { display: grid; justify-items: start; gap: 20px; }
body.public-design #main-content .mk-page :is(h1,h2,h3,p,ol) { margin: 0; }
body.public-design #main-content .mk-page :is(p,li) { font-size: 16px; line-height: 1.6; }
body.public-design #main-content .mk-page .mk-lead { font-size: var(--marketing-lead); line-height: 1.6; }
body.public-design #main-content .mk-page h3 { font-size: 22px; font-weight: 600; line-height: 1.35; }
body.public-design #main-content .mk-page [data-marketing-heading] { font-size: var(--marketing-heading); line-height: 1.22; letter-spacing: -.035em; font-weight: 600; text-wrap: balance; }
.mk-page :is(h1,h2) > span { color: var(--brand-purple-ink); }
body.public-design #main-content .mk-page .mk-eyebrow { display: flex; align-items: center; gap: 10px; color: var(--link-ink); font-size: 12px; line-height: 1.5; letter-spacing: .1em; font-weight: 700; text-transform: uppercase; }
.mk-page .mk-eyebrow a { color: inherit; }
body.public-design #main-content .mk-page .mk-note { font-size: 14px; line-height: 1.5; color: var(--text-muted); }
.mk-page .mk-number { display: inline-flex; justify-content: center; align-items: center; width: 34px; height: 34px; border: 1px solid transparent; border-radius: 50%; color: #fff; background: var(--brand-purple-fill-1); font-size: 12px; letter-spacing: 0; }
.mk-page .mk-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 24px; }
.mk-page .mk-button { display: inline-flex; align-items: center; justify-content: center; width: fit-content; min-height: 36px; padding: 8px 16px; background: var(--btn-primary-bg); color: var(--btn-primary-fg); border: 1px solid transparent; border-radius: 6px; font: 700 12px/18px "Open Sans", sans-serif; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; transition: background-color .4s, color .4s; }
.mk-page .mk-button:is(:hover,:focus-visible) { background: #1b1c1a; color: #fff; }
.mk-page .mk-button:active { background: var(--btn-primary-active-bg, #00a82d); color: var(--btn-primary-fg); }
.mk-page .mk-link { display: inline-flex; align-items: center; min-height: 44px; width: fit-content; max-width: 100%; color: var(--link-ink); font-size: 14px; font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.mk-page :is(a,summary):focus-visible { outline: 2px solid var(--brand-purple-ink); outline-offset: 4px; }
.mk-page .mk-hero {
  position: relative;
  isolation: isolate;
  overflow: clip;
  padding-block: 64px 60px;
  background: radial-gradient(ellipse at 82% 18%, #633db5 0%, transparent 60%),
    linear-gradient(125deg, var(--brand-purple-deep-2), var(--brand-purple-deep-1) 53%, #402080);
  color: #fff;
}
.mk-page .mk-hero::before {
  content: '';
  position: absolute;
  z-index: -1;
  right: 0;
  bottom: clamp(-70px, -5vw, -28px);
  width: clamp(720px, 100%, 1440px);
  aspect-ratio: 1440 / 560;
  background: url('/images/app-artwork/rental-skyline.webp') right bottom / contain no-repeat;
  mask-image: linear-gradient(90deg, transparent, #000 45%);
  opacity: .24;
  pointer-events: none;
}
body.public-design #main-content .mk-page .mk-hero :is(h1,.mk-lead,.mk-note,.mk-eyebrow,.mk-link) { color: #fff; }
body.public-design #main-content .mk-page .mk-hero h1 > span { color: var(--ink-purple-lime); }
.mk-page .mk-hero .mk-copy a:focus-visible { outline-color: var(--ink-purple-lime); }
.mk-page .mk-rating { display: grid; gap: 4px; margin-top: 8px; font-size: 14px; }
.mk-page .mk-stars { color: var(--attention-gold); font-size: 26px; line-height: 1.2; letter-spacing: 3px; }
.mk-page .mk-rating-score { display: flex; align-items: center; gap: 10px; }
.mk-page .mk-rating-score b { font-size: 24px; line-height: 1.2; font-weight: 700; }
.mk-page .mk-view-stage { display: grid; grid-template-columns: minmax(0, 1fr); }
.mk-page .mk-view-stage > * { grid-area: 1 / 1; align-self: start; }
.mk-page .mk-view-stage > [inert] { visibility: hidden; }
@media (prefers-reduced-motion: no-preference) {
  .mk-page .mk-view-stage > :not([inert]) { animation: mk-view-enter .35s ease both; }
  .mk-page .mk-view-stage > .mk-view-card:not([inert]) { animation: mk-walkthrough-reveal .6s ease-out both; }
  .mk-page .mk-view-card:not([inert]) > :is(img, .mk-property-screen) {
    transform-origin: top left;
    animation: mk-screenshot-tour 7.2s cubic-bezier(.4, 0, .2, 1) both;
  }
  @keyframes mk-view-enter {
    from { opacity: 0; transform: translateX(12px); }
    to { opacity: 1; transform: translateX(0); }
  }
  @keyframes mk-walkthrough-reveal { from { opacity: 0; } to { opacity: 1; } }
  @keyframes mk-screenshot-tour {
    /* Hold on the overview, then move down and right to the next actions. */
    0% { transform: scale(1.16) translate(0, 0); }
    12%, 31% { transform: scale(1.22) translate(0, 0); }
    54%, 82% { transform: scale(1.22) translate(-18%, -18%); }
    100% { transform: none; }
  }
  .mk-page .mk-property-callouts { position: absolute; inset: 0; pointer-events: none; }
  .mk-page .mk-property-callout { position: absolute; }
  .mk-page .mk-property-callout:first-child { inset-inline-end: 12px; inset-block-end: 12px; }
  .mk-page .mk-property-callout:last-child { inset-inline-start: 12px; inset-block-start: 12px; }
  .mk-page #mk-properties-view:not([inert]) .mk-property-callout {
    animation: mk-callout-reveal 2.35s .35s cubic-bezier(.2, .75, .3, 1) both;
  }
  .mk-page #mk-properties-view:not([inert]) .mk-property-callout:last-child { animation-delay: 3.9s; }
  @keyframes mk-callout-reveal {
    0% { visibility: hidden; opacity: 0; transform: translateY(10px); }
    20%, 82% { visibility: visible; opacity: 1; transform: translateY(0); }
    100% { visibility: hidden; opacity: 0; transform: translateY(-3px); }
  }
  .mk-page #mk-properties-view:not([inert]) .mk-property-screen::before,
  .mk-page #mk-properties-view:not([inert]) .mk-property-screen::after {
    content: "";
    position: absolute;
    pointer-events: none;
    border: 2px solid var(--brand-purple-ink);
    border-radius: 4px;
    box-shadow: 0 0 0 3px #ffffffb3;
    animation: mk-column-highlight 2.35s .35s ease both;
  }
  .mk-page #mk-properties-view:not([inert]) .mk-property-screen::before { inset: .5% 36.5% 60% 35.8%; }
  .mk-page #mk-properties-view:not([inert]) .mk-property-screen::after {
    inset: 62.5% 18% .5% 63.6%;
    animation-delay: 3.9s;
  }
  @keyframes mk-column-highlight {
    0%, 100% { opacity: 0; }
    16%, 84% { opacity: 1; }
  }
}
.mk-page .mk-view-card {
  position: relative;
  overflow: hidden;
  width: calc(100% + clamp(36px, 5vw, 64px));
  justify-self: end;
  border: 2px solid var(--interaction-border);
  border-radius: 8px;
  background: var(--surface);
}
.mk-page .mk-view-card img { width: 100%; border-radius: 6px; }
.mk-page #mk-properties-view { box-shadow: 0 0 0 1px #15052f, 0 8px 16px -4px #10032199, 0 28px 48px -16px #100321b3; }
.mk-page .mk-property-screen { position: relative; }
.mk-page .mk-property-callouts { display: grid; gap: 8px; padding: 12px; }
.mk-page .mk-property-callout {
  display: grid;
  gap: 4px;
  width: max-content;
  max-width: min(28ch, calc(100% - 24px));
  padding: 12px 16px;
  border: 1px solid var(--interaction-border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  box-shadow: 0 0 0 1px #1e004f40, 0 4px 8px -2px #15052f40, 0 12px 24px -6px #15052f70;
  font: 400 .875rem/1.4 "Open Sans", sans-serif;
}
.mk-page .mk-property-callout strong { color: var(--brand-purple-ink); }
@media (min-width: 1001px) {
  .mk-page #mk-marketing-view { --mk-max-extension: 80px; }
  .mk-page :is(#mk-marketing-view, #mk-properties-view) {
    --mk-card-extension: clamp(24px, (100vw - 1160px) / 2 - 16px, var(--mk-max-extension, 176px));
    width: calc(100% + clamp(36px, 5vw, 64px) + var(--mk-card-extension));
    margin-inline-end: calc(-1 * var(--mk-card-extension));
  }
}
.mk-page .mk-hero-art { position: relative; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; align-items: start; padding: 28px 0 0; }
.mk-page .mk-cover { grid-column: 1 / -1; margin-inline: 24px 16px; overflow: hidden; border-radius: 8px; border: 4px solid var(--brand-purple); }
.mk-page .mk-cover img { width: 100%; }
.mk-page .mk-property { position: relative; grid-column: 1; width: 100%; margin-top: -44px; padding: 10px; border: 1px solid var(--border); border-top: 4px solid var(--ink-purple-lime); border-radius: 8px; color: var(--text); background: var(--surface); box-shadow: 0 16px 36px -24px rgba(35, 18, 63, .4); }
.mk-page .mk-property > img { width: 100%; aspect-ratio: 2.6; object-fit: cover; border-radius: 4px; }
.mk-page .mk-property figcaption { padding: 8px 0 0; container-type: inline-size; }
.mk-page .mk-property-address { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; }
.mk-page .mk-property strong { display: block; font-size: 14px; font-weight: 700; }
.mk-page .mk-property-address > span { font-size: 12px; color: var(--text-muted); }
.mk-page .mk-property-details { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 6px; margin-top: 4px; font-size: 14px; }
.mk-page .mk-property-details > * { white-space: nowrap; }
.mk-page .mk-property-counts, .mk-page .mk-property-counts > span { display: inline-flex; align-items: center; }
.mk-page .mk-property-counts { gap: 6px; font-size: 12px; }
.mk-page .mk-property-counts > span { gap: 2px; }
.mk-page .mk-property-counts img { width: clamp(24px, calc((100cqi - 112px) / 2), 32px); height: auto; aspect-ratio: 1; object-fit: contain; }
.mk-page .mk-property small { font-size: 12px; font-weight: 400; }
.mk-page .mk-feature-card { position: absolute; display: flex; align-items: center; gap: 12px; padding: 16px; min-height: 80px; border-radius: 8px; color: var(--brand-purple-deep-2); text-decoration: none; box-shadow: 0 10px 30px -16px #1e004f; transition: translate .4s ease; }
.mk-page .mk-feature-card:is(:hover,:focus-visible) { translate: 0 -4px; }
.mk-page .mk-feature-card strong { display: block; font-size: 16px; line-height: 1.4; font-weight: 700; }
.mk-page .mk-feature-card small { display: block; margin-top: 4px; font-size: 14px; line-height: 1.5; }
.mk-page .mk-card-icon { display: grid; place-items: center; width: 36px; height: 36px; flex: none; }
.mk-page .mk-card-icon svg { width: 28px; height: 28px; }
.mk-page .mk-draft-card {
  top: 0;
  right: 0;
  gap: 8px;
  padding: 6px 12px 6px 8px;
  min-height: 44px;
  background: var(--surface-card-sky);
  border: 1px solid var(--interaction-border);
  box-shadow: 0 12px 28px -16px var(--brand-purple-deep-2);
  transition: border-color .4s ease, box-shadow .4s ease;
}
.mk-page .mk-draft-card .mk-card-icon { width: 28px; height: 28px; border-radius: 6px; background: var(--brand-purple-fill-1); color: var(--ink-purple-lime); }
.mk-page .mk-draft-card .mk-card-icon svg { width: 18px; height: 18px; }
.mk-page .mk-draft-card:is(:hover,:focus-visible) { translate: none; border-color: var(--brand-purple-ink); box-shadow: 0 14px 32px -16px var(--brand-purple-deep-2); }
.mk-page .mk-share-card { position: relative; grid-column: 1; grid-row: 3; width: 100%; background: var(--surface-card-sky); }
.mk-page .mk-sites-card { position: relative; grid-column: 2; grid-row: 2 / span 2; margin-top: -76px; justify-self: end; padding: 8px 12px; border: 1px solid var(--border); border-radius: 8px; color: var(--text); background: var(--surface); box-shadow: 0 16px 36px -24px rgba(35,18,63,.4); }
.mk-page .mk-sites-card > strong { display: block; margin-bottom: 4px; font-size: 16px; line-height: 1.5; }
.mk-page .mk-sites-illustration > div { display: grid; grid-template-columns: 28px 28px minmax(0,1fr); align-items: center; gap: 8px; min-height: 30px; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.mk-page .mk-sites-illustration img { width: 28px; height: 28px; object-fit: contain; }
.mk-page .mk-site-toggle { width: 28px; height: 16px; padding: 2px; border-radius: 20px; background: var(--btn-primary-bg); }
.mk-page .mk-site-toggle::after { content: ''; display: block; width: 12px; height: 12px; margin-left: 12px; border-radius: 50%; background: #fff; }
.mk-page .mk-site-toggle-off { background: var(--border); }
.mk-page .mk-site-toggle-off::after { margin-left: 0; }
body.public-design #main-content .mk-page .mk-art-caption { grid-column: 1 / -1; font-size: 14px; color: #fff; line-height: 1.5; }
.mk-page .mk-route { padding-block: 24px; border-block: 1px solid var(--border); }
.mk-page .mk-route ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; list-style: none; padding: 12px 0 0; }
.mk-page .mk-route a { position: relative; display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 8px 0; font-size: 14px; font-weight: 600; text-decoration: none; color: var(--text); }
.mk-page .mk-route a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--brand-purple-ink); transform: scaleX(0); transform-origin: left; transition: transform .4s ease; }
.mk-page .mk-route a:is(:hover,:focus-visible,[aria-current])::after { transform: scaleX(1); }
.mk-page .mk-route a > span { display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 50%; background: var(--ink-purple-lime); color: var(--brand-purple-deep-2); font-size: 12px; }
.mk-page .mk-section { padding-block: 80px; }
.mk-page .mk-demo { background: var(--brand-purple-fill-1); padding: 18px 12px 12px; border: 1px solid var(--brand-purple-fill-1); border-radius: 8px; }
.mk-page .mk-visual-label { display: flex; align-items: center; gap: 8px; padding: 0 12px 14px; font-size: 12px; font-weight: 600; color: #fff; }
.mk-page .mk-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-purple-lime); }
.mk-page .vac-draft-frame { display: block; width: 100%; height: 560px; border: 0; border-radius: 4px; background: var(--surface); }
.mk-page .mk-network-section { background: linear-gradient(155deg, var(--surface-card-sky), var(--surface-tint-2)); }
.mk-page .mk-network { border-radius: 12px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--border); }
.mk-page .mk-network rentari-listing-network { display: block; width: 100%; }
.mk-page details { border-bottom: 1px solid var(--border); }
.mk-page summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 56px; padding: 16px 0; font-size: 16px; line-height: 1.5; font-weight: 600; list-style: none; cursor: pointer; }
.mk-page summary::-webkit-details-marker { display: none; }
.mk-page summary::after { content: '+'; flex: none; font-size: 24px; font-weight: 400; color: var(--brand-purple-ink); }
.mk-page details[open] > summary::after { content: '−'; }
body.public-design #main-content .mk-page details p { padding-bottom: 16px; }
.mk-page .mk-help { width: 100%; border-top: 1px solid var(--border); }
.mk-page .mk-help summary { font-size: 14px; }
.mk-page .mk-share-row + .mk-share-row { padding-top: 72px; margin-top: 72px; border-top: 1px solid var(--border); }
.mk-page .mk-image { padding: 20px; border-radius: 8px; }
.mk-page .mk-image img { width: 100%; border-radius: 4px; }
.mk-page .mk-lavender { background: var(--brand-purple-fill-1); }
.mk-page .mk-sky { background: var(--ink-purple-lime); }
.mk-page .mk-inquiries { background: var(--surface-tint-2); }
/* One background per numbered step, from the tag palette fills. */
.mk-page #add-your-property { --mk-step-bg: #D1F48C; }
.mk-page #prepare-your-listing { --mk-step-bg: #FFB8FC; }
.mk-page #publish-your-listing { --mk-step-bg: #C3DBFF; }
.mk-page #share-your-listing { --mk-step-bg: #FFFA64; }
.mk-page #renter-inquiries { --mk-step-bg: #D1F864; }
/* Darker link blue keeps AA contrast on the tag fills. */
.mk-page :is(#add-your-property, #prepare-your-listing, #publish-your-listing, #share-your-listing, #renter-inquiries) { --link-ink: #004A7C; }
.mk-page :is(#publish-your-listing, #renter-inquiries) { background: var(--mk-step-bg); }
.mk-page :is(#add-your-property, #prepare-your-listing, #share-your-listing) {
  background: var(--mk-step-bg);
  box-shadow: 0 0 0 100vmax var(--mk-step-bg);
  clip-path: inset(0 -100vmax);
}
/* Faint line art at the screen edges behind each step. */
.mk-page :is(#add-your-property, #prepare-your-listing, #publish-your-listing, #share-your-listing, #renter-inquiries) { position: relative; isolation: isolate; }
.mk-page :is(#add-your-property, #prepare-your-listing, #publish-your-listing, #share-your-listing, #renter-inquiries)::before {
  content: ""; position: absolute; z-index: -1; inset: 0 auto; left: 50%; width: 100vw; transform: translateX(-50%);
  background: var(--mk-step-art) center top / 100% auto no-repeat; opacity: .18; pointer-events: none;
}
.mk-page #add-your-property { --mk-step-art: url("/images/illustrations/marketing-step-art-01.webp"); }
.mk-page #prepare-your-listing { --mk-step-art: url("/images/illustrations/marketing-step-art-02.webp"); }
.mk-page #publish-your-listing { --mk-step-art: url("/images/illustrations/marketing-step-art-03.webp"); }
.mk-page #share-your-listing { --mk-step-art: url("/images/illustrations/marketing-step-art-04.webp"); }
.mk-page #renter-inquiries { --mk-step-art: url("/images/illustrations/marketing-step-art-05.webp"); }
@media (max-width: 760px) {
  .mk-page :is(#add-your-property, #prepare-your-listing, #publish-your-listing, #share-your-listing, #renter-inquiries)::before { background-position: center top; background-size: 100% auto; }
}
.mk-page .mk-showing-times { display: flex; flex-wrap: wrap; gap: 8px; }
.mk-page .mk-showing-times span { padding: 4px 8px; border-radius: 6px; background: var(--ink-purple-lime); color: var(--brand-purple-deep-2); font-size: 14px; font-weight: 600; }
.mk-page .mk-showing { margin: 0; overflow: hidden; border: 1px solid var(--border); border-top: 4px solid var(--brand-purple-ink); border-radius: 8px; background: var(--surface); }
.mk-page .mk-showing-story { display: grid; }
.mk-page .mk-showing-scene { min-width: 0; padding: clamp(12px, 2.5vw, 28px); border-bottom: 1px solid var(--border); }
.mk-page .mk-showing-connect { display: none; position: relative; padding: 0; }
.mk-page .mk-showing-connect .mk-eyebrow { position: absolute; top: 10px; left: 12px; z-index: 1; }
.mk-page .mk-showing-dashboard { display: grid; grid-template-rows: auto 1fr; padding: 0; background: var(--surface); }
.mk-page .mk-showing-panel { display: grid; align-content: center; padding: clamp(12px, 2.5vw, 28px); }
.mk-page .mk-showing-scene header { display: grid; gap: 4px; }
.mk-page .mk-showing-scene header strong { font-size: 22px; font-weight: 600; }
.mk-page .mk-showing-scene header span { color: var(--text-muted); font-size: 14px; }
.mk-page .mk-showing-handoff { display: grid; grid-template-columns: max-content minmax(0, 1fr); border: 1px solid var(--border); border-radius: 8px; background: var(--surface-tint-2); }
.mk-page .mk-showing-rail { display: grid; align-content: start; gap: 4px; padding: 8px; border-right: 1px solid var(--border); border-radius: 8px 0 0 8px; background: var(--surface); }
.mk-page .mk-showing-rail > div { display: flex; align-items: center; gap: 6px; min-height: 36px; padding: 6px; border-radius: 4px; font-size: 14px; }
.mk-page .mk-showing-rail-current { background: var(--surface-tint-2); box-shadow: inset 3px 0 var(--ink-purple-lime); font-weight: 600; }
.mk-page .mk-showing-rail svg { width: 20px; height: 20px; flex: none; fill: var(--surface); stroke: var(--illustration-ink); stroke-width: 1.65; stroke-linejoin: round; }
.mk-page .mk-showing-rail .mk-showing-nav-lavender { fill: var(--illustration-lavender); }
.mk-page .mk-showing-rail .mk-showing-nav-lime { fill: var(--ink-purple-lime); stroke: none; }
.mk-page .mk-showing-unread { min-width: 18px; padding: 1px 4px; border-radius: 99px; background: var(--ink-purple-lime); color: var(--brand-purple-deep-2); font-size: 12px; font-weight: 700; text-align: center; }
.mk-page .mk-showing-leads { display: grid; gap: 8px; min-width: 0; margin: 10px; padding: 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); }
.mk-page .mk-showing-lead-tabs { display: flex; flex-wrap: wrap; gap: 4px 10px; border-bottom: 1px solid var(--border); color: var(--text-muted); font-size: 14px; }
.mk-page .mk-showing-lead-tabs b { padding-bottom: 4px; border-bottom: 2px solid var(--brand-purple-ink); color: var(--brand-purple-ink); }
.mk-page .mk-showing-arrival { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-card-sky); }
.mk-page .mk-showing-arrival img { width: 36px; height: 36px; flex: none; border-radius: 50%; object-fit: cover; }
body.public-design #main-content .mk-page .mk-showing-arrival p { color: var(--text-muted); font-size: 14px; }
@media (max-width: 600px) {
  .mk-page .mk-showing-handoff { grid-template-columns: minmax(0, 1fr); }
  .mk-page .mk-showing-rail { display: flex; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--border); border-radius: 8px 8px 0 0; }
}
.mk-page .mk-showing-followup { display: grid; grid-template-rows: auto 1fr auto; padding: 0; background: var(--surface); }
.mk-page :is(.mk-showing-followup,.mk-showing-dashboard) > header { padding: 12px clamp(12px, 3vw, 20px); background: var(--surface-tint-2); border-bottom: 1px solid var(--border); }
.mk-page .mk-chat-contact { display: flex; align-items: center; gap: 8px; margin-top: 2px; font-size: 14px; line-height: 1.35; }
.mk-page .mk-chat-contact span { display: block; }
.mk-page :is(.mk-chat-contact,.mk-chat-line) > img { flex: none; border-radius: 50%; object-fit: cover; background: var(--surface-tint-2); }
.mk-page .mk-chat-thread { display: grid; align-content: start; padding: 4px clamp(10px, 2.5vw, 20px) 12px; list-style: none; }
.mk-page .mk-chat-thread > li { position: relative; justify-self: start; max-width: 100%; }
.mk-page .mk-chat-thread > .mk-mozart-message { justify-self: end; }
.mk-page .mk-chat-line { display: flex; align-items: end; gap: 7px; }
.mk-page .mk-mozart-message .mk-chat-line { flex-direction: row-reverse; }
.mk-page .mk-chat-bubble { min-width: 0; margin-top: 8px; padding: 7px 10px; border-radius: 12px 12px 12px 3px; background: var(--surface-card-sky); }
.mk-page .mk-mozart-message .mk-chat-bubble { border-radius: 12px 12px 3px 12px; background: var(--surface-tint-2); }
.mk-page .mk-chat-bubble strong { display: block; font-size: 14px; line-height: 1.35; }
.mk-page .mk-chat-bubble small { margin-left: 4px; color: var(--brand-purple-ink); font-size: 11px; }
body.public-design #main-content .mk-page .mk-chat-bubble p { font-size: 14px; line-height: 1.4; }
.mk-page .mk-chat-typing { display: none; position: absolute; top: 8px; right: 31px; align-items: center; gap: 4px; padding: 7px 10px; border-radius: 12px 12px 3px 12px; background: var(--surface-tint-2); color: var(--brand-purple-ink); font-size: 12px; white-space: nowrap; }
.mk-page .mk-chat-typing i { width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.mk-page .mk-chat-typing i:first-of-type { margin-left: 3px; }
.mk-page .mk-chat-bubble .mk-showing-times { gap: 6px; margin-top: 6px; }
.mk-page :is(.mk-chat-bubble .mk-showing-times span,.mk-showing-request .mk-showing-times span:last-child) { background: var(--surface); }
.mk-page .mk-chat-booking { display: inline-block; margin-top: 6px; padding: 3px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); color: var(--link-ink); font-size: 14px; font-weight: 600; }
.mk-page .mk-chat-composer { padding: 10px clamp(10px, 2.5vw, 16px); border-top: 1px solid var(--border); background: var(--surface); }
.mk-page .mk-chat-box { padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; }
.mk-page .mk-chat-placeholder { min-height: 30px; color: var(--text-muted); font-size: 14px; }
.mk-page .mk-chat-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 6px; border-top: 1px solid var(--border); font-size: 12px; font-weight: 600; }
.mk-page .mk-chat-draft { color: var(--brand-purple-ink); }
.mk-page .mk-chat-auto { display: flex; align-items: center; gap: 6px; margin-left: auto; white-space: nowrap; }
.mk-page .mk-chat-switch { position: relative; flex: none; width: 32px; height: 18px; border-radius: 99px; background: var(--brand-purple-ink); }
.mk-page .mk-chat-switch::before { content: ''; position: absolute; inset: 3px auto auto 3px; width: 12px; height: 12px; border-radius: 50%; background: white; transform: translateX(14px); }
.mk-page .mk-chat-switch-state { display: grid; color: var(--brand-purple-ink); }
.mk-page .mk-chat-switch-state > span { grid-area: 1 / 1; }
.mk-page .mk-chat-switch-state > :first-child { visibility: hidden; color: var(--text-muted); }
.mk-page .mk-chat-pointer { display: none; position: absolute; z-index: 1; left: 17px; top: 10px; color: var(--text); pointer-events: none; }
.mk-page .mk-chat-send { padding: 5px 8px; border-radius: 6px; background: var(--btn-primary-bg); color: var(--btn-primary-fg); }
.mk-page .mk-showing-calendar { padding: 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); }
.mk-page .mk-showing-appointment { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.mk-page :is(.mk-showing-slot,.mk-showing-guest) { display: grid; gap: 2px; }
.mk-page .mk-showing-slot { padding: 6px 10px; border-radius: 6px; background: var(--surface-card-sky); }
.mk-page :is(.mk-showing-slot,.mk-showing-guest) span { color: var(--text-muted); font-size: 14px; }
.mk-page .mk-showing-slot time { font-weight: 600; }
.mk-page .mk-showing-calendar-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
.mk-page .mk-showing-status { display: grid; justify-items: start; font-size: 12px; font-weight: 600; }
.mk-page .mk-showing-status > span { grid-area: 1 / 1; padding: 3px 8px; border-radius: 99px; }
.mk-page .mk-showing-status > :first-child { visibility: hidden; background: var(--surface-tint-2); color: var(--text-muted); }
.mk-page .mk-showing-status > :last-child { background: var(--success-bg); color: var(--success-ink); }
.mk-page .mk-showing-action { position: relative; visibility: hidden; display: inline-flex; align-items: center; min-height: 36px; padding: 6px 10px; border-radius: 6px; background: var(--btn-primary-bg); color: var(--btn-primary-fg); font-size: 12px; font-weight: 700; }
.mk-page :is(.mk-showing-action,.mk-showing-time-choice) .mk-chat-pointer { inset: 55% 8px auto auto; }
.mk-page .mk-showing-request .mk-showing-times { margin-top: 8px; }
.mk-page .mk-showing-time-choice { position: relative; display: inline-flex; align-items: center; gap: 4px; }
.mk-page .mk-showing-request-state { display: grid; }
.mk-page .mk-showing-request-state > * { grid-area: 1 / 1; justify-self: start; align-self: center; }
body.public-design #main-content .mk-page .mk-showing-request-receipt p { color: var(--text-muted); font-size: 14px; }
@media (prefers-reduced-motion: no-preference) {
  .mk-page .mk-showing-story[data-showing-playback] > * { grid-area: 1 / 1; border-bottom: 0; }
  .mk-page .mk-showing-story[data-showing-playback] .mk-showing-connect { display: grid; align-items: center; }
  .mk-page .mk-showing-story[data-showing-playback] > [inert] { visibility: hidden; }
  .mk-page .mk-showing-story[data-showing-playback] > :not([inert],.mk-showing-connect:not(.ra-motion-ready)) { animation: mk-showing-enter .4s ease-out both; }
  /* Let the shared scene publish the listing and bring the inquiry back. */
  .mk-page .mk-showing-connect.ra-motion-ready .ra-distribution-scene * {
    animation-iteration-count: 1;
    animation-play-state: running;
  }
  .mk-page [data-showing-playback] .mk-showing-dashboard:not([inert]) .mk-showing-handoff { --mk-lead-land-at: 3.12s; }
  .mk-page [data-showing-playback] .mk-showing-dashboard:not([inert]) .mk-showing-handoff .mk-showing-arrival {
    position: relative;
    z-index: 1;
    animation: mk-showing-enter .45s .25s ease-out both, mk-lead-fly 1.27s 1.85s ease-in-out forwards;
  }
  .mk-page [data-showing-playback] .mk-showing-dashboard:not([inert]) .mk-showing-inbox {
    animation: mk-inbox-receive .65s var(--mk-lead-land-at) ease-out forwards;
  }
  .mk-page [data-showing-playback] .mk-showing-dashboard:not([inert]) .mk-showing-unread {
    animation: mk-showing-enter .35s var(--mk-lead-land-at) ease-out both;
  }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) {
    --mk-toggle-at: 2.1s;
  }
  .mk-page .mk-showing-story[data-showing-playback] > .mk-showing-followup:not([inert]) { animation-name: mk-messages-open; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-line { animation: mk-showing-enter .38s var(--mk-message-delay, .35s) ease-out both; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-typing { display: flex; animation: mk-chat-thinking 1.8s var(--mk-typing-at) ease both; }
  .mk-page .mk-chat-thread > :nth-child(2) { --mk-typing-at: calc(var(--mk-toggle-at) + .25s); --mk-message-delay: 4.15s; }
  .mk-page .mk-chat-thread > :nth-child(3) { --mk-message-delay: 7.1s; }
  .mk-page .mk-chat-thread > :nth-child(4) { --mk-typing-at: 7.8s; --mk-message-delay: 9.6s; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-typing i { animation: mk-chat-dot .65s calc(var(--mk-typing-at) + var(--mk-dot-delay, 0s)) ease-in-out 2; }
  .mk-page .mk-chat-typing i:nth-of-type(2) { --mk-dot-delay: .11s; }
  .mk-page .mk-chat-typing i:nth-of-type(3) { --mk-dot-delay: .22s; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-switch { animation: mk-chat-switch-fill .24s var(--mk-toggle-at) ease-out both; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-switch::before { animation: mk-chat-switch-thumb .24s var(--mk-toggle-at) ease-out both; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-switch-state > :first-child { animation: mk-showing-hide 1ms var(--mk-toggle-at) both; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-switch-state > :last-child { animation: mk-showing-reveal 1ms var(--mk-toggle-at) both; }
  .mk-page [data-showing-playback] .mk-showing-followup:not([inert]) .mk-chat-pointer { display: block; animation: mk-chat-press 1.25s calc(var(--mk-toggle-at) - .75s) ease both; }
  .mk-page [data-showing-playback] .mk-showing-request:not([inert]) { --mk-select-at: 1s; --mk-request-at: 2.45s; }
  .mk-page [data-showing-playback] .mk-showing-request:not([inert]) .mk-showing-time-choice { animation: mk-showing-select .24s var(--mk-select-at) ease-out both; }
  .mk-page [data-showing-playback] .mk-showing-request:not([inert]) .mk-showing-time-choice b { animation: mk-showing-reveal 1ms var(--mk-select-at) both; }
  .mk-page [data-showing-playback] .mk-showing-request:not([inert]) .mk-showing-request-action {
    animation: mk-showing-reveal 1ms var(--mk-select-at) both, mk-showing-hide 1ms var(--mk-request-at) forwards;
  }
  .mk-page [data-showing-playback] .mk-showing-request:not([inert]) .mk-showing-request-receipt { animation: mk-showing-enter .35s var(--mk-request-at) ease-out both; }
  .mk-page [data-showing-playback] .mk-showing-request:not([inert]) .mk-chat-pointer {
    display: block;
    animation: mk-chat-press 1.25s calc(var(--mk-press-at) - .75s) ease both;
  }
  .mk-page .mk-showing-time-choice { --mk-press-at: var(--mk-select-at); }
  .mk-page .mk-showing-request-action { --mk-press-at: var(--mk-request-at); }
  .mk-page [data-showing-playback] .mk-showing-confirmation:not([inert]) { --mk-confirm-at: 1.75s; }
  .mk-page [data-showing-playback] .mk-showing-confirmation:not([inert]) .mk-showing-calendar {
    animation: mk-calendar-confirm .75s var(--mk-confirm-at) ease-out forwards;
  }
  .mk-page [data-showing-playback] .mk-showing-confirmation:not([inert]) :is(.mk-showing-status > :first-child,.mk-showing-confirm-action) {
    animation: mk-showing-hide 1ms var(--mk-confirm-at) both;
  }
  .mk-page [data-showing-playback] .mk-showing-confirmation:not([inert]) .mk-showing-status > :last-child {
    animation: mk-showing-reveal 1ms var(--mk-confirm-at) both;
  }
  .mk-page [data-showing-playback] .mk-showing-confirmation:not([inert]) .mk-chat-pointer {
    display: block;
    animation: mk-chat-press 1.25s calc(var(--mk-confirm-at) - .75s) ease both;
  }
  .mk-page .mk-showing-story[data-showing-paused] .mk-showing-scene,
  .mk-page .mk-showing-story[data-showing-paused] .mk-showing-scene *,
  .mk-page .mk-showing-story[data-showing-paused] .mk-chat-switch::before {
    animation-play-state: paused !important;
  }
  @keyframes mk-showing-enter {
    from { opacity: 0; visibility: hidden; transform: translateY(8px); }
    to { opacity: 1; visibility: visible; transform: none; }
  }
  @keyframes mk-lead-fly {
    0% { opacity: 1; transform: none; }
    22% { transform: translate(calc(var(--mk-flight-x) * .1), -16px) rotate(-3deg) scale(.98); }
    78% { opacity: 1; transform: translate(calc(var(--mk-flight-x) * .8), calc(var(--mk-flight-y) * .8 - 12px)) rotate(-5deg) scale(.46); }
    100% { opacity: 0; transform: translate(var(--mk-flight-x), var(--mk-flight-y)) scale(.12); }
  }
  @keyframes mk-inbox-receive {
    40% { background: var(--surface-tint-2); box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-purple-ink) 18%, transparent); }
    100% { background: var(--surface-tint-2); }
  }
  @keyframes mk-messages-open {
    from { opacity: 0; visibility: hidden; transform: translateX(16px); }
    to { opacity: 1; visibility: visible; transform: none; }
  }
  @keyframes mk-chat-thinking {
    0%, 100% { opacity: 0; visibility: hidden; }
    15%, 85% { opacity: 1; visibility: visible; }
  }
  @keyframes mk-chat-dot {
    0%, 100% { opacity: .45; }
    50% { opacity: 1; transform: translateY(-2px); }
  }
  @keyframes mk-chat-switch-fill { from { background: var(--text-muted); } }
  @keyframes mk-chat-switch-thumb { from { transform: translateX(0); } }
  @keyframes mk-showing-hide { from { visibility: visible; } to { visibility: hidden; } }
  @keyframes mk-showing-reveal { from { visibility: hidden; } to { visibility: visible; } }
  @keyframes mk-showing-select { from { background: var(--surface); } }
  @keyframes mk-chat-press {
    0% { opacity: 0; transform: translate(20px, -14px); }
    42% { opacity: 1; transform: translate(0, 0); }
    60% { opacity: 1; transform: scale(.8); }
    76% { opacity: 1; transform: scale(1); }
    100% { opacity: 0; transform: translate(4px, 3px); }
  }
  @keyframes mk-calendar-confirm {
    35% { background: var(--success-bg); box-shadow: 0 0 0 4px var(--success-bg); }
    100% { border-color: var(--success-border); }
  }
}
.mk-page .mk-faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; }
.mk-page .mk-faq > div:first-child { display: grid; align-content: start; gap: 20px; }
.mk-page .mk-questions { border-top: 1px solid var(--border); }
.mk-page .mk-close { background: var(--brand-deep-purple); color: var(--text-on-dark, #fff); padding-block: 56px; }
.mk-page .mk-close > .mk-wrap { display: grid; grid-template-columns: 1.3fr .7fr; align-items: center; gap: 60px; }
.mk-page .mk-close .mk-wrap > div { display: grid; justify-items: start; gap: 20px; }
body.public-design #main-content .mk-page .mk-close :is(h2,p) { color: #fff; }
body.public-design #main-content .mk-page .mk-close .mk-eyebrow { color: #d1f48c; }
.mk-page .mk-close a:not(.mk-button) { color: #fff; text-decoration: underline; }
.mk-page .mk-button.mk-secondary { background: #fff; border-color: var(--interaction-border); color: var(--text); }
.mk-page .mk-button.mk-secondary:is(:hover,:focus-visible) { color: var(--brand-purple-ink); }
@media (max-width: 1000px) {
  .mk-page .mk-wrap { width: calc(100% - 48px); }
  .mk-page .mk-grid { gap: 32px; }
  .mk-page .mk-faq { gap: 40px; }
  .mk-page .mk-hero > .mk-grid { grid-template-columns: minmax(0,1fr); }
  .mk-page .mk-hero-views { width: min(540px,100%); justify-self: center; }
  .mk-page .mk-view-card { width: calc(100% + 16px); justify-self: center; }
  .mk-page :is(#mk-marketing-view, #mk-properties-view) { width: calc(100% + 28px); }
  .mk-page .mk-view-stage > [inert] { display: none; }
}
@media (max-width: 800px) {
  .mk-page .mk-wrap { width: calc(100% - 40px); }
  .mk-page :is(.mk-grid,.mk-faq,.mk-close > .mk-wrap) { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .mk-page .mk-reverse > :is(.mk-copy,:not(.mk-copy)) { grid-column: auto; grid-row: auto; }
  .mk-page .mk-hero { padding-block: 32px 40px; }
  .mk-page .mk-hero > .mk-grid { grid-template-columns: minmax(0,1fr); }
  .mk-page .mk-section { padding-block: 48px; }
  .mk-page .mk-route ol { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px 20px; }
  .mk-page .mk-image { padding: 12px; }
  .mk-page .mk-share-row + .mk-share-row { padding-top: 40px; margin-top: 40px; }
  .mk-page .mk-button { min-height: 44px; font-size: 14px; line-height: 20px; }
  .mk-page .mk-close { padding-block: 40px; }
}
@media (max-width: 600px) {
  .mk-page .mk-hero-art { grid-template-columns: minmax(0,1fr); gap: 12px; padding: 0; }
  .mk-page .mk-cover { margin-left: 16px; }
  .mk-page .mk-property { position: relative; left: auto; bottom: auto; width: 100%; margin-top: 0; }
  .mk-page .mk-feature-card { position: relative; inset: auto; width: 100%; min-height: 76px; padding: 12px; }
  .mk-page .mk-draft-card { margin-top: -28px; width: fit-content; min-height: 44px; padding: 6px 12px 6px 8px; }
  .mk-page .mk-hero-art > :is(.mk-property,.mk-sites-card,.mk-share-card,.mk-art-caption) { grid-column: 1; grid-row: auto; }
  .mk-page .mk-sites-card { margin: 0; justify-self: start; }
  .mk-page .mk-sites-illustration > div { grid-template-columns: 28px 28px minmax(0,1fr); gap: 8px; }
  .mk-page .mk-sites-illustration img { display: block; width: 28px; height: 28px; }
  body.public-design #main-content .mk-page .mk-art-caption { position: static; width: 100%; text-align: left; }
}
@media (max-width: 440px) {
  .mk-page .mk-wrap { width: calc(100% - 32px); }
  .mk-page.marketing-refresh { --feature-title: 34px; --marketing-heading: 28px; --marketing-lead: 16px; }
  .mk-page .mk-route a { gap: 8px; font-size: 14px; }
  .mk-page .mk-demo { padding-inline: 4px; }
}
@media (pointer: coarse) { .mk-page .mk-button { min-height: 44px; font-size: 14px; line-height: 20px; } }
@media (prefers-reduced-motion: reduce) { .mk-page *, .mk-page *::after { scroll-behavior: auto !important; transition: none !important; } }