/**
 * Host marketing landing — operator premium identity.
 *
 * NOT renter About/home (those use cool indigo–violet mist in marketing-landing.css).
 * NOT host product tools (quiet slate + brand-teal --host-product-*).
 *
 * Light: warm stone/slate paper, amber accents, indigo primary CTAs only.
 * Dark: deep ink base, amber rims, indigo primary CTAs.
 * Listing-initiation keeps quiet product greys (unrelated to this atmosphere).
 */

:root {
  --host-operator-ink: #0b1120;
  --host-operator-panel: #111827;
  --host-operator-slate: #1e293b;
  --host-operator-line: rgba(148, 163, 184, 0.28);
  --host-operator-gold: #f59e0b;
  --host-operator-gold-soft: rgba(245, 158, 11, 0.14);
  --host-operator-gold-deep: #b45309;
  --host-operator-paper: #f7f5f1;
  --host-operator-paper-mid: #eef1f4;
  --host-operator-paper-cool: #e8eef5;
  --host-operator-surface: rgba(255, 255, 255, 0.94);
  --host-operator-ink-page: #080c14;
  --host-operator-ink-mid: #0b1120;
}

/* ----- Light: page atmosphere (warm stone paper — no lavender) ----- */
html:not(.dark):has(body.host-landing-body:not(.host-listing-init-mode)) {
  background: linear-gradient(
    162deg,
    var(--host-operator-paper) 0%,
    #f3f1ec 18%,
    var(--host-operator-paper-mid) 48%,
    var(--host-operator-paper-cool) 78%,
    #f5f4f0 100%
  ) !important;
  background-attachment: fixed;
  min-height: 100%;
}

html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) {
  background: linear-gradient(
    162deg,
    var(--host-operator-paper) 0%,
    #f3f1ec 18%,
    var(--host-operator-paper-mid) 48%,
    var(--host-operator-paper-cool) 78%,
    #f5f4f0 100%
  ) !important;
  background-attachment: fixed;
  color: #1e293b;
}

html:not(.dark) body.host-landing-body main,
html:not(.dark) body.host-landing-body main.flex-grow,
html:not(.dark) body.host-landing-body main > div,
html:not(.dark) body.host-landing-body .host-landing-page {
  background: transparent !important;
  background-color: transparent !important;
}

html:not(.dark) body.host-landing-body nav.swiftspot-main-nav {
  background: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

html.dark body.host-landing-body nav.swiftspot-main-nav {
  background: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Marketing landing: mobile sticky bar replaces the hidden host top nav (matches About / legal pages). */
@media (max-width: 767px) {
  body.host-landing-body:not(.host-listing-init-mode) nav.swiftspot-main-nav.swiftspot-main-nav--outer {
    display: none !important;
  }
}

@media (min-width: 768px) {
  html:not(.dark) body.host-landing-body.host-listing-init-mode nav.swiftspot-main-nav .swiftspot-main-nav__shell {
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.985),
      rgba(226, 232, 240, 0.9)
    ) !important;
    border-color: rgba(71, 85, 105, 0.22) !important;
    box-shadow: 0 10px 32px -16px rgba(15, 23, 42, 0.32) !important;
  }

  html.dark body.host-landing-body.host-listing-init-mode nav.swiftspot-main-nav .swiftspot-main-nav__shell {
    background: linear-gradient(
      to bottom,
      rgba(15, 23, 42, 0.99),
      rgba(15, 23, 42, 0.9)
    ) !important;
    border-color: rgba(129, 140, 248, 0.28) !important;
    box-shadow: 0 12px 36px -20px rgba(0, 0, 0, 0.75) !important;
  }
}

/* Listing initiation: same atmosphere on html/body as .host-listing-init-page so the nav band matches main (no seam). */
html:not(.dark):has(body.host-landing-body.host-listing-init-mode) {
  min-height: 100%;
}

/* Listing initiation: quiet product surface with soft brand atmosphere */
html:not(.dark):has(body.host-landing-body.host-listing-init-mode),
html:not(.dark) body.host-landing-body.host-listing-init-mode,
html:not(.dark) .host-listing-init-page {
  background:
    radial-gradient(ellipse 70% 45% at 12% -10%, rgba(15, 90, 86, 0.07), transparent 55%),
    radial-gradient(ellipse 55% 40% at 100% 0%, rgba(15, 90, 86, 0.04), transparent 50%),
    #f4f6f8;
  background-attachment: scroll;
}

html.dark:has(body.host-landing-body.host-listing-init-mode) {
  min-height: 100%;
}

html.dark:has(body.host-landing-body.host-listing-init-mode),
html.dark body.host-landing-body.host-listing-init-mode,
html.dark .host-listing-init-page {
  background: #0f172a;
  background-attachment: scroll;
}

.host-landing-page {
  color: #334155;
}

html.dark:has(body.host-landing-body:not(.host-listing-init-mode)) {
  background-color: var(--host-operator-ink-page) !important;
  min-height: 100%;
}

html.dark body.host-landing-body:not(.host-listing-init-mode) {
  background:
    radial-gradient(ellipse 80% 50% at 12% 0%, rgba(245, 158, 11, 0.06), transparent 48%),
    radial-gradient(ellipse 70% 45% at 90% 100%, rgba(245, 158, 11, 0.04), transparent 42%),
    linear-gradient(180deg, var(--host-operator-ink-page) 0%, var(--host-operator-ink-mid) 55%, #0a1019 100%) !important;
}

html.dark body.host-landing-body main,
html.dark body.host-landing-body main.flex-grow,
html.dark body.host-landing-body main > div,
html.dark body.host-landing-body .host-landing-page {
  background: transparent !important;
  background-color: transparent !important;
}

html.dark body.host-landing-body #mainContent {
  background: transparent !important;
}

html.dark .host-landing-page {
  color: #e2e8f0;
}

html:not(.dark) .host-landing-orb {
  mix-blend-mode: multiply;
  opacity: 0.2;
  background: radial-gradient(circle at 35% 30%, rgba(245, 158, 11, 0.45), rgba(243, 241, 236, 0.2) 55%, transparent 70%) !important;
}

html.dark .host-landing-orb {
  mix-blend-mode: normal;
  opacity: 0.14;
  background: radial-gradient(circle at 35% 30%, rgba(245, 158, 11, 0.28), rgba(15, 23, 42, 0.05) 55%, transparent 72%) !important;
}

html.dark .host-landing-hero {
  background: linear-gradient(
    135deg,
    rgb(8 12 20 / 0.98),
    rgb(11 17 32 / 0.96),
    rgb(15 23 42 / 0.94)
  );
  border-bottom-color: rgba(245, 158, 11, 0.16);
}

html:not(.dark) .host-landing-hero {
  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.94) 0%,
    rgba(247, 245, 241, 0.9) 42%,
    rgba(243, 241, 236, 0.82) 72%,
    rgba(255, 251, 235, 0.55) 100%
  );
  border-bottom: 1px solid rgba(180, 83, 9, 0.1);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.55);
}

.host-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(22rem, 0.92fr);
  gap: clamp(2rem, 5vw, 4.25rem);
  /* Start — never center: scene height must not bounce the hero copy. */
  align-items: start;
}

.host-hero-copy {
  max-width: 46rem;
}

.host-hero-title {
  font-size: clamp(2.6rem, 6.2vw, 5.8rem);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -0.055em;
}

.host-hero-title .host-landing-hero-accent {
  font-size: clamp(2.75rem, 6.6vw, 6rem);
}

.host-hero-subtitle {
  margin: 1rem 0 0;
  max-width: 32rem;
  color: #334155;
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-weight: 600;
  line-height: 1.4;
  text-wrap: balance;
}

html.dark .host-hero-subtitle {
  color: #e2e8f0;
}

@media (max-width: 1023px) {
  .host-hero-subtitle {
    margin-inline: auto;
  }
}

.host-hero-lead {
  line-height: var(--line-height-reading, 1.6);
}

.host-hero-sample {
  margin: 1.25rem auto 0;
  max-width: 28rem;
  padding: 0.9rem 1rem;
  text-align: left;
  border: 1px solid rgb(226 232 240);
  background: rgb(248 250 252);
  border-radius: 0.85rem;
}

html.dark .host-hero-sample {
  border-color: rgb(51 65 85 / 0.9);
  background: rgb(15 23 42 / 0.62);
}

@media (min-width: 1024px) {
  .host-hero-sample {
    margin-left: 0;
    margin-right: 0;
  }
}

.host-hero-sample__label {
  margin: 0 0 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
}

html.dark .host-hero-sample__label {
  color: #94a3b8;
}

.host-hero-sample__line {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  font-size: 0.95rem;
  line-height: 1.4;
  color: #334155;
}

html.dark .host-hero-sample__line {
  color: #cbd5e1;
}

.host-hero-sample__line strong {
  color: #0f172a;
}

html.dark .host-hero-sample__line strong {
  color: #f8fafc;
}

.host-hero-sample__note {
  margin: 0.4rem 0 0;
  font-size: 0.78rem;
  line-height: 1.4;
  color: #64748b;
}

html.dark .host-hero-sample__note {
  color: #94a3b8;
}

.host-hero-partner-note {
  max-width: 40rem;
}

html:not(.dark) .host-landing-hero-accent {
  background: linear-gradient(105deg, #4338ca 0%, #4f46e5 40%, #7c3aed 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

html.dark .host-landing-hero-accent {
  background: linear-gradient(to right, #a5b4fc, #c4b5fd, #e9d5ff);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

html:not(.dark) .host-landing-badge {
  background: linear-gradient(135deg, #fffbeb, #fef3c7);
  border-color: #f59e0b;
  color: #92400e;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.12);
}

html:not(.dark) .host-landing-badge span:last-child {
  color: #78350f;
}

html:not(.dark) .host-landing-primary-cta {
  background: linear-gradient(100deg, #4f46e5 0%, #4338ca 45%, #6366f1 100%) !important;
  color: #fff !important;
  box-shadow:
    0 8px 28px -6px rgba(79, 70, 229, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
}

html:not(.dark) .host-landing-primary-cta:hover {
  filter: brightness(1.05);
  box-shadow: 0 12px 36px -8px rgba(67, 56, 202, 0.5);
}

html:not(.dark) .host-landing-secondary-cta {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(71, 85, 105, 0.22);
  color: #0f172a !important;
  box-shadow: 0 6px 20px -10px rgba(15, 23, 42, 0.12);
}

html:not(.dark) .host-landing-secondary-cta:visited {
  color: #0f172a !important;
}

html:not(.dark) .host-landing-secondary-cta:hover {
  background: #fff;
  border-color: rgba(15, 23, 42, 0.28);
  color: #020617 !important;
}

html.dark .host-landing-secondary-cta {
  background-color: rgb(30 41 59 / 0.9);
  color: #f1f5f9;
  border-color: #475569;
}

html:not(.dark) .host-landing-band-features {
  background: linear-gradient(
    180deg,
    rgba(247, 245, 241, 0.95) 0%,
    rgba(238, 241, 244, 0.55) 50%,
    rgba(245, 244, 240, 0.9) 100%
  );
  border-color: rgba(180, 83, 9, 0.1);
}

html:not(.dark) .host-landing-band-features h2 {
  color: #0f172a;
}

html:not(.dark) .host-landing-band-features .host-landing-lead {
  color: #475569;
}

html:not(.dark) .host-landing-card {
  border-radius: 1.25rem;
  border-width: 1px;
  border-style: solid;
  box-shadow: 0 12px 40px -12px rgba(15, 23, 42, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

html:not(.dark) .host-landing-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 48px -14px rgba(15, 23, 42, 0.12);
}

html:not(.dark) .host-landing-card--bookings {
  background: linear-gradient(155deg, #eef2ff 0%, #e0e7ff 35%, #ffffff 100%);
  border-color: #a5b4fc;
  box-shadow: 0 14px 44px -14px rgba(99, 102, 241, 0.2);
}

html:not(.dark) .host-landing-card--payments {
  background: linear-gradient(155deg, #f0f9ff 0%, #e0f2fe 35%, #ffffff 100%);
  border-color: #38bdf8;
  box-shadow: 0 14px 44px -14px rgba(14, 165, 233, 0.18);
}

html:not(.dark) .host-landing-card--calendar {
  background: linear-gradient(155deg, #faf5ff 0%, #f3e8ff 35%, #ffffff 100%);
  border-color: #c4b5fd;
  box-shadow: 0 14px 44px -14px rgba(139, 92, 246, 0.18);
}

html.dark .host-landing-card {
  background-color: #1e293b;
  border-color: #334155;
}

html:not(.dark) .host-landing-band-benefits {
  background: linear-gradient(
    160deg,
    #fffbeb 0%,
    #fef3c7 40%,
    #ffedd5 100%
  );
  border-color: rgba(245, 158, 11, 0.22);
}

html:not(.dark) .host-landing-band-benefits h2 {
  color: #78350f;
}

html:not(.dark) .host-landing-band-benefits .host-landing-lead {
  color: #92400e;
}

html:not(.dark) .host-landing-benefit-tile {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(254, 243, 199, 0.35));
  border-color: rgba(245, 158, 11, 0.3);
  box-shadow: 0 8px 28px -10px rgba(180, 83, 9, 0.1);
}

html:not(.dark) .host-landing-benefit-tile.blue {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(224, 231, 255, 0.55));
  border-color: rgba(99, 102, 241, 0.35);
  box-shadow: 0 8px 28px -10px rgba(79, 70, 229, 0.12);
}

html:not(.dark) .host-landing-benefit-tile.purple {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(243, 232, 255, 0.65));
  border-color: rgba(167, 139, 250, 0.4);
  box-shadow: 0 8px 28px -10px rgba(124, 58, 237, 0.12);
}

html.dark .host-landing-benefit-tile {
  background: linear-gradient(
    to bottom right,
    rgb(30 41 59 / 0.95),
    rgb(30 27 75 / 0.35)
  );
  border-color: rgba(129, 140, 248, 0.3);
}

html.dark .host-landing-benefit-tile.blue {
  background: linear-gradient(
    to bottom right,
    rgb(30 58 138 / 0.45),
    rgb(30 41 59 / 0.9)
  );
  border-color: rgba(96, 165, 250, 0.35);
}

html.dark .host-landing-benefit-tile.purple {
  background: linear-gradient(
    to bottom right,
    rgb(88 28 135 / 0.4),
    rgb(30 41 59 / 0.9)
  );
  border-color: rgba(192, 132, 252, 0.35);
}

html:not(.dark) .host-landing-cta-strip {
  background:
    radial-gradient(circle at 18% 12%, rgba(245, 158, 11, 0.18), transparent 28%),
    linear-gradient(135deg, #0b1120 0%, #111827 48%, #1e293b 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  color: #f8fafc;
}

html.dark .host-landing-primary-cta {
  background: linear-gradient(100deg, #6366f1, #4f46e5, #7c3aed) !important;
  color: #fff !important;
}

html.dark .host-landing-band-features {
  background: linear-gradient(180deg, #0f172a 0%, #1e293b 50%, #0f172a 100%);
  border-color: #334155;
}

html.dark .host-landing-band-benefits {
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
  border-color: #334155;
}

html.dark .host-landing-badge {
  background: rgb(49 46 129 / 0.45);
  border-color: #6366f1;
  color: #e0e7ff;
}

.host-landing-kicker {
  margin-bottom: 0.6rem;
  font-size: var(--type-badge-size, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  letter-spacing: var(--letter-spacing-kicker, 0.08em);
  text-transform: uppercase;
}

html:not(.dark) .host-landing-kicker {
  color: var(--host-operator-gold-deep);
}

html.dark .host-landing-kicker {
  color: #fcd34d;
}

.host-section-intro {
  margin-bottom: 1.4rem;
}

.host-section-intro--split {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(16rem, 0.55fr);
  gap: 1.4rem;
  align-items: end;
}

.host-earnings-preview,
.host-calculator-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.35rem;
  padding: clamp(1.1rem, 2.25vw, 1.55rem);
}

.host-earnings-preview::before,
.host-calculator-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at top right, rgb(251 191 36 / 0.22), transparent 34%),
    radial-gradient(circle at bottom left, rgb(99 102 241 / 0.2), transparent 36%);
}

.host-earnings-preview > *,
.host-calculator-card > * {
  position: relative;
  z-index: 1;
}

html:not(.dark) .host-earnings-preview,
html:not(.dark) .host-calculator-card {
  background: linear-gradient(145deg, rgb(255 255 255 / 0.96), rgb(238 242 255 / 0.86));
  border: 1px solid rgb(99 102 241 / 0.2);
  box-shadow:
    0 28px 70px -28px rgb(67 56 202 / 0.36),
    inset 0 1px 0 rgb(255 255 255 / 0.8);
}

html.dark .host-earnings-preview,
html.dark .host-calculator-card {
  background: linear-gradient(145deg, rgb(15 23 42 / 0.96), rgb(30 27 75 / 0.78));
  border: 1px solid rgb(129 140 248 / 0.26);
  box-shadow: 0 28px 70px -32px rgb(0 0 0 / 0.65);
}

html:not(.dark) .host-calculator-card {
  background: linear-gradient(145deg, rgb(255 255 255 / 0.92), rgb(248 250 252 / 0.9));
  box-shadow: 0 18px 50px -34px rgb(15 23 42 / 0.42);
}

html.dark .host-calculator-card {
  background: linear-gradient(145deg, rgb(15 23 42 / 0.9), rgb(30 41 59 / 0.72));
}

.host-earnings-preview {
  max-width: 34rem;
  justify-self: end;
}

.host-earnings-preview__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.host-earnings-preview__header span {
  display: block;
  font-size: var(--type-badge-size, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  letter-spacing: var(--letter-spacing-label, 0.04em);
  text-transform: uppercase;
}

.host-earnings-preview__header strong {
  display: block;
  margin-top: 0.25rem;
  font-size: 1.15rem;
  font-weight: var(--font-weight-bold, 700);
}

html:not(.dark) .host-earnings-preview__header strong {
  color: #0f172a;
}

html.dark .host-earnings-preview__header strong {
  color: #f8fafc;
}

.host-earnings-preview__header p {
  border-radius: 999px;
  padding: 0.4rem 0.7rem;
  font-size: var(--type-label-size, 0.8125rem);
  font-weight: var(--font-weight-semibold, 600);
  white-space: nowrap;
}

html:not(.dark) .host-earnings-preview__header span {
  color: #64748b;
}

html.dark .host-earnings-preview__header span {
  color: #94a3b8;
}

html:not(.dark) .host-earnings-preview__header p {
  background: rgb(255 255 255 / 0.78);
  border: 1px solid rgb(99 102 241 / 0.16);
  color: #312e81;
}

html.dark .host-earnings-preview__header p {
  background: rgb(15 23 42 / 0.72);
  border: 1px solid rgb(129 140 248 / 0.22);
  color: #e0e7ff;
}

.host-earnings-preview__label,
.host-payout-card span,
.host-calculator-inputs label > span,
.host-calculator-results span,
.host-example-card__top span {
  display: block;
  font-size: var(--type-badge-size, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  letter-spacing: var(--letter-spacing-label, 0.04em);
  text-transform: uppercase;
}

html:not(.dark) .host-earnings-preview__label,
html:not(.dark) .host-payout-card span,
html:not(.dark) .host-calculator-inputs label > span,
html:not(.dark) .host-calculator-results span,
html:not(.dark) .host-example-card__top span {
  color: #64748b;
}

html.dark .host-earnings-preview__label,
html.dark .host-payout-card span,
html.dark .host-calculator-inputs label > span,
html.dark .host-calculator-results span,
html.dark .host-example-card__top span {
  color: #94a3b8;
}

.host-earnings-preview__price {
  margin-top: 0.45rem;
  font-size: clamp(2.1rem, 4.6vw, 3.45rem);
  font-weight: 900;
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.host-earnings-preview__price span {
  margin-left: 0.25rem;
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}

html:not(.dark) .host-earnings-preview__price {
  color: #111827;
}

html.dark .host-earnings-preview__price {
  color: #f8fafc;
}

.host-earnings-preview__rows,
.host-calculator-results {
  display: grid;
  gap: 0.65rem;
  margin-top: 1.1rem;
}

.host-earnings-preview__rows > div,
.host-calculator-results > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  border-radius: 0.85rem;
  padding: 0.72rem 0.85rem;
}

html:not(.dark) .host-earnings-preview__rows > div,
html:not(.dark) .host-calculator-results > div {
  background: rgb(255 255 255 / 0.74);
  border: 1px solid rgb(226 232 240 / 0.92);
}

html.dark .host-earnings-preview__rows > div,
html.dark .host-calculator-results > div {
  background: rgb(15 23 42 / 0.62);
  border: 1px solid rgb(51 65 85 / 0.9);
}

.host-earnings-preview__rows strong,
.host-calculator-results strong {
  font-size: 0.95rem;
  font-weight: 900;
  white-space: nowrap;
}

.host-earnings-preview__total strong,
.host-calculator-results__total strong {
  font-size: 1.12rem;
}

html:not(.dark) .host-earnings-preview__total,
html:not(.dark) .host-calculator-results__total,
html:not(.dark) .host-payout-card--highlight {
  background: linear-gradient(135deg, #312e81, #4f46e5) !important;
  border-color: rgb(99 102 241 / 0.4) !important;
  color: #fff;
}

html.dark .host-earnings-preview__total,
html.dark .host-calculator-results__total,
html.dark .host-payout-card--highlight {
  background: linear-gradient(135deg, #4338ca, #7c3aed) !important;
  border-color: rgb(165 180 252 / 0.3) !important;
  color: #fff;
}

.host-earnings-preview__total span,
.host-calculator-results__total span,
.host-payout-card--highlight span,
.host-payout-card--highlight p {
  color: rgb(224 231 255 / 0.92) !important;
}

.host-earnings-preview__note,
.host-payout-section__disclaimer {
  margin-top: 0.8rem;
  font-size: 0.82rem;
  line-height: 1.5;
}

html:not(.dark) .host-earnings-preview__note,
html:not(.dark) .host-payout-section__disclaimer {
  color: #64748b;
}

html.dark .host-earnings-preview__note,
html.dark .host-payout-section__disclaimer {
  color: #94a3b8;
}

html:not(.dark) .host-landing-calculator-section {
  background: linear-gradient(180deg, rgb(255 255 255 / 0.88), rgb(248 250 252 / 0.74));
  border-color: rgb(99 102 241 / 0.14);
}

html.dark .host-landing-calculator-section {
  background: linear-gradient(180deg, #0f172a 0%, #111827 100%);
  border-color: #334155;
}

.host-payout-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.host-payout-card,
.host-example-card,
.host-control-card,
.host-step-card {
  border-radius: 1rem;
  padding: 1rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.host-payout-card:hover,
.host-example-card:hover,
.host-control-card:hover,
.host-step-card:hover {
  transform: translateY(-3px);
}

html:not(.dark) .host-payout-card,
html:not(.dark) .host-example-card,
html:not(.dark) .host-control-card,
html:not(.dark) .host-step-card {
  background: rgb(255 255 255 / 0.9);
  border: 1px solid rgb(226 232 240 / 0.9);
  box-shadow: 0 16px 42px -24px rgb(15 23 42 / 0.28);
}

html.dark .host-payout-card,
html.dark .host-example-card,
html.dark .host-control-card,
html.dark .host-step-card {
  background: rgb(30 41 59 / 0.78);
  border: 1px solid rgb(71 85 105 / 0.72);
  box-shadow: 0 16px 42px -28px rgb(0 0 0 / 0.74);
}

.host-payout-card strong,
.host-example-card__top strong,
.host-example-card__summary strong,
.host-control-card h3,
.host-step-card h3 {
  display: block;
  margin-top: 0.35rem;
  font-weight: 900;
}

.host-payout-card strong {
  font-size: clamp(1.2rem, 2.35vw, 1.55rem);
}

.host-payout-card p,
.host-example-card p,
.host-control-card p,
.host-step-card p {
  margin-top: 0.7rem;
  font-size: 0.92rem;
  line-height: 1.5;
}

html:not(.dark) .host-payout-card p,
html:not(.dark) .host-example-card p,
html:not(.dark) .host-control-card p,
html:not(.dark) .host-step-card p {
  color: #64748b;
}

html.dark .host-payout-card p,
html.dark .host-example-card p,
html.dark .host-control-card p,
html.dark .host-step-card p {
  color: #cbd5e1;
}

.host-scale-note {
  margin-top: 1.15rem;
  border-radius: 1rem;
  padding: 0.95rem;
  font-size: 0.92rem;
  line-height: 1.55;
}

html:not(.dark) .host-scale-note {
  background: linear-gradient(135deg, #fffbeb, #eef2ff);
  border: 1px solid rgb(245 158 11 / 0.26);
  color: #334155;
}

html.dark .host-scale-note {
  background: rgb(15 23 42 / 0.72);
  border: 1px solid rgb(129 140 248 / 0.24);
  color: #e2e8f0;
}

.host-calculator-inputs {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(8rem, 0.7fr);
  gap: 0.8rem;
}

.host-calculator-inputs label {
  display: grid;
  gap: 0.5rem;
}

.host-calculator-field {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-radius: 0.85rem;
  padding: 0.6rem 0.75rem;
}

html:not(.dark) .host-calculator-field {
  background: #fff;
  border: 1px solid rgb(203 213 225 / 0.9);
  color: #0f172a;
}

html.dark .host-calculator-field {
  background: rgb(15 23 42 / 0.72);
  border: 1px solid rgb(71 85 105 / 0.9);
  color: #f8fafc;
}

.host-calculator-field input {
  width: 100%;
  min-width: 0;
  border: 0;
  background: transparent;
  font-size: 1.18rem;
  font-weight: 900;
  line-height: 1.2;
  outline: none;
}

html:not(.dark) .host-calculator-field input {
  color: #0f172a;
}

html.dark .host-calculator-field input {
  color: #f8fafc;
}

.host-example-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.8rem;
}

.host-example-card {
  grid-column: span 2;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

.host-example-card:nth-child(4),
.host-example-card:nth-child(5) {
  grid-column: span 3;
}

.host-example-card__top strong {
  font-size: 1.12rem;
  color: inherit;
}

.host-example-card > p {
  font-size: 0.96rem;
  font-weight: 750;
}

.host-example-card__summary {
  margin-top: auto;
  border-radius: 0.9rem;
  padding: 0.8rem;
}

.host-example-card__summary span {
  display: block;
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.4;
}

.host-example-card__summary strong {
  display: block;
  margin-top: 0.45rem;
  font-size: 1.28rem;
  font-weight: 950;
  line-height: 1.1;
  letter-spacing: -0.035em;
}

html:not(.dark) .host-example-card__summary {
  background: rgb(255 255 255 / 0.66);
  border: 1px solid rgb(226 232 240 / 0.82);
}

html:not(.dark) .host-example-card__summary span {
  color: #475569;
}

html.dark .host-example-card__summary {
  background: rgb(15 23 42 / 0.46);
  border: 1px solid rgb(51 65 85 / 0.78);
}

html.dark .host-example-card__summary span {
  color: #cbd5e1;
}

.host-example-card__yearly {
  margin-top: 0.75rem;
  margin-bottom: 0;
  border-radius: 999px;
  padding: 0.45rem 0.7rem;
  font-size: 0.78rem;
  font-weight: 900;
  text-align: center;
}

html:not(.dark) .host-example-card__yearly {
  background: rgb(79 70 229 / 0.1);
  color: #3730a3;
}

html.dark .host-example-card__yearly {
  background: rgb(129 140 248 / 0.16);
  color: #c7d2fe;
}

html:not(.dark) .host-example-card--amber {
  background: linear-gradient(155deg, rgb(255 251 235 / 0.96), rgb(255 255 255 / 0.9));
  border-color: rgb(245 158 11 / 0.32);
}

html:not(.dark) .host-example-card--indigo {
  background: linear-gradient(155deg, rgb(238 242 255 / 0.96), rgb(255 255 255 / 0.9));
  border-color: rgb(99 102 241 / 0.32);
}

html:not(.dark) .host-example-card--sky {
  background: linear-gradient(155deg, rgb(240 249 255 / 0.96), rgb(255 255 255 / 0.9));
  border-color: rgb(14 165 233 / 0.3);
}

html:not(.dark) .host-example-card--violet {
  background: linear-gradient(155deg, rgb(245 243 255 / 0.96), rgb(255 255 255 / 0.9));
  border-color: rgb(124 58 237 / 0.3);
}

html:not(.dark) .host-example-card--slate {
  background: linear-gradient(155deg, rgb(248 250 252 / 0.98), rgb(238 242 255 / 0.72));
  border-color: rgb(100 116 139 / 0.28);
}

.host-control-card__icon {
  display: inline-flex;
  width: 2.5rem;
  height: 2.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.85rem;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  box-shadow: 0 12px 28px -14px rgb(79 70 229 / 0.7);
}

.host-control-card__icon--sky {
  background: linear-gradient(135deg, #0284c7, #2563eb);
}

.host-control-card__icon--violet {
  background: linear-gradient(135deg, #7c3aed, #a855f7);
}

.host-control-card__icon--amber {
  background: linear-gradient(135deg, #d97706, #f59e0b);
}

.host-control-card h3 {
  margin-top: 0.8rem;
  font-size: 1rem;
}

.host-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
}

.host-step-card span {
  display: inline-flex;
  width: 1.9rem;
  height: 1.9rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 0.86rem;
  font-weight: 900;
}

html:not(.dark) .host-step-card span {
  background: #312e81;
  color: #fff;
}

html.dark .host-step-card span {
  background: #818cf8;
  color: #0f172a;
}

.host-step-card h3 {
  margin-top: 0.8rem;
  font-size: 1.05rem;
}

.host-earnings-preview__media {
  margin-bottom: 1rem;
}

.host-preview-listing-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(5.5rem, 0.7fr);
  gap: 0.7rem;
  align-items: stretch;
}

.host-preview-listing-card .host-space-illustration {
  min-height: 8rem;
}

.host-preview-map {
  position: relative;
  min-height: 8rem;
  overflow: hidden;
  border-radius: 1.1rem;
}

.host-preview-map::before,
.host-preview-map::after {
  content: "";
  position: absolute;
  border-radius: 999px;
}

.host-preview-map::before {
  inset: 0.7rem;
}

.host-preview-map::after {
  left: 22%;
  top: -10%;
  width: 38%;
  height: 120%;
  transform: rotate(28deg);
}

.host-preview-map__pin {
  position: absolute;
  left: 52%;
  top: 38%;
  z-index: 3;
  width: 1rem;
  height: 1rem;
  border-radius: 999px 999px 999px 0;
  transform: rotate(-45deg);
}

.host-preview-map__pin::after {
  content: "";
  position: absolute;
  inset: 0.28rem;
  border-radius: 999px;
}

.host-preview-map__road {
  position: absolute;
  z-index: 2;
  display: block;
  height: 2px;
  border-radius: 999px;
}

.host-preview-map__road:nth-child(2) {
  left: 8%;
  right: 18%;
  top: 30%;
  transform: rotate(-12deg);
}

.host-preview-map__road:nth-child(3) {
  left: 14%;
  right: 8%;
  bottom: 28%;
  transform: rotate(14deg);
}

.host-preview-listing-card__caption {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  border-radius: 0.9rem;
  padding: 0.7rem 0.85rem;
}

.host-preview-listing-card__caption strong {
  font-size: 0.95rem;
  font-weight: 900;
}

.host-preview-listing-card__caption span {
  font-size: 0.8rem;
  font-weight: 700;
  text-align: right;
}

html:not(.dark) .host-preview-map {
  background: linear-gradient(135deg, #eff6ff, #eef2ff);
  border: 1px solid rgb(99 102 241 / 0.18);
}

html.dark .host-preview-map {
  background: linear-gradient(135deg, rgb(15 23 42), rgb(30 41 59));
  border: 1px solid rgb(129 140 248 / 0.22);
}

html:not(.dark) .host-preview-map::before {
  background:
    linear-gradient(90deg, rgb(99 102 241 / 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgb(99 102 241 / 0.08) 1px, transparent 1px);
  background-size: 1rem 1rem;
}

html.dark .host-preview-map::before {
  background:
    linear-gradient(90deg, rgb(165 180 252 / 0.1) 1px, transparent 1px),
    linear-gradient(0deg, rgb(165 180 252 / 0.1) 1px, transparent 1px);
  background-size: 1rem 1rem;
}

html:not(.dark) .host-preview-map::after {
  background: rgb(255 255 255 / 0.82);
  box-shadow: 0 0 0 1px rgb(99 102 241 / 0.08);
}

html.dark .host-preview-map::after {
  background: rgb(51 65 85 / 0.7);
}

html:not(.dark) .host-preview-map__pin {
  background: #4f46e5;
  box-shadow: 0 8px 18px -8px rgb(79 70 229 / 0.8);
}

html.dark .host-preview-map__pin {
  background: #a5b4fc;
}

html:not(.dark) .host-preview-map__pin::after {
  background: #fff;
}

html.dark .host-preview-map__pin::after {
  background: #1e1b4b;
}

html:not(.dark) .host-preview-map__road {
  background: rgb(79 70 229 / 0.22);
}

html.dark .host-preview-map__road {
  background: rgb(165 180 252 / 0.28);
}

html:not(.dark) .host-preview-listing-card__caption {
  background: rgb(255 255 255 / 0.78);
  border: 1px solid rgb(226 232 240 / 0.9);
}

html.dark .host-preview-listing-card__caption {
  background: rgb(15 23 42 / 0.58);
  border: 1px solid rgb(51 65 85 / 0.86);
}

html:not(.dark) .host-preview-listing-card__caption span {
  color: #64748b;
}

html.dark .host-preview-listing-card__caption span {
  color: #cbd5e1;
}

.host-space-illustration {
  position: relative;
  min-height: 7.25rem;
  overflow: hidden;
  border-radius: 1.1rem;
  isolation: isolate;
}

.host-space-illustration::before,
.host-space-illustration::after {
  content: "";
  position: absolute;
  inset: auto;
  z-index: 1;
}

.host-space-illustration::before {
  left: 10%;
  right: 10%;
  bottom: 18%;
  height: 36%;
  border-radius: 0.7rem;
}

.host-space-illustration::after {
  left: 18%;
  right: 18%;
  bottom: 18%;
  height: 2px;
}

.host-space-illustration span {
  position: absolute;
  display: block;
  z-index: 2;
  border-radius: 999px;
}

.host-space-illustration span:nth-child(1) {
  left: 16%;
  top: 18%;
  width: 36%;
  height: 26%;
}

.host-space-illustration span:nth-child(2) {
  right: 15%;
  top: 26%;
  width: 19%;
  height: 18%;
}

.host-space-illustration span:nth-child(3) {
  left: 22%;
  right: 22%;
  bottom: 29%;
  height: 10%;
  border-radius: 0.5rem;
}

html:not(.dark) .host-space-illustration {
  background: linear-gradient(135deg, #dbeafe 0%, #eef2ff 48%, #fef3c7 100%);
  border: 1px solid rgb(99 102 241 / 0.18);
}

html.dark .host-space-illustration {
  background: linear-gradient(135deg, rgb(30 41 59), rgb(30 27 75), rgb(15 23 42));
  border: 1px solid rgb(129 140 248 / 0.22);
}

html:not(.dark) .host-space-illustration::before {
  background: rgb(255 255 255 / 0.72);
  box-shadow: 0 18px 36px -24px rgb(15 23 42 / 0.5);
}

html.dark .host-space-illustration::before {
  background: rgb(15 23 42 / 0.62);
}

html:not(.dark) .host-space-illustration::after {
  background: rgb(99 102 241 / 0.3);
}

html.dark .host-space-illustration::after {
  background: rgb(165 180 252 / 0.35);
}

html:not(.dark) .host-space-illustration span {
  background: rgb(79 70 229 / 0.26);
}

html.dark .host-space-illustration span {
  background: rgb(165 180 252 / 0.24);
}

.host-space-illustration--driveway,
.host-space-illustration--indigo {
  background: linear-gradient(135deg, #e0e7ef 0%, #eef1f4 48%, #f8fafc 100%) !important;
}

.host-space-illustration--driveway::before,
.host-space-illustration--indigo::before {
  left: 14%;
  right: 14%;
  bottom: 14%;
  height: 44%;
  border-radius: 0.45rem 0.45rem 1rem 1rem;
}

.host-space-illustration--driveway::after,
.host-space-illustration--indigo::after {
  left: 48%;
  right: auto;
  bottom: 16%;
  width: 2px;
  height: 38%;
}

.host-space-illustration--driveway span:nth-child(1),
.host-space-illustration--indigo span:nth-child(1) {
  left: 19%;
  top: 17%;
  width: 30%;
  height: 16%;
  border-radius: 0.5rem 0.5rem 0.2rem 0.2rem;
}

.host-space-illustration--driveway span:nth-child(2),
.host-space-illustration--indigo span:nth-child(2) {
  right: 18%;
  top: 18%;
  width: 26%;
  height: 16%;
  border-radius: 0.5rem 0.5rem 0.2rem 0.2rem;
}

.host-space-illustration--driveway span:nth-child(3),
.host-space-illustration--indigo span:nth-child(3) {
  left: 21%;
  right: 21%;
  bottom: 27%;
  height: 8%;
}

.host-space-illustration--amber {
  background: linear-gradient(135deg, #fef3c7 0%, #fffbeb 50%, #f7f5f1 100%) !important;
}

.host-space-illustration--amber::before {
  left: 14%;
  right: 14%;
  bottom: 16%;
  height: 52%;
  border-radius: 1rem 1rem 0.35rem 0.35rem;
}

.host-space-illustration--amber::after {
  left: 24%;
  right: 24%;
  bottom: 23%;
  height: 32%;
  border-radius: 0.35rem;
}

.host-space-illustration--sky {
  background: linear-gradient(135deg, #e0f2fe 0%, #eff6ff 50%, #f1f5f9 100%) !important;
}

.host-space-illustration--sky::before {
  left: 9%;
  right: 9%;
  bottom: 18%;
  height: 30%;
  transform: skewX(-10deg);
}

.host-space-illustration--sky::after {
  left: 17%;
  right: 17%;
  bottom: 47%;
  height: 2px;
}

.host-space-illustration--violet {
  background: linear-gradient(135deg, #e8e4f0 0%, #f3f1ec 50%, #f8fafc 100%) !important;
}

.host-space-illustration--violet::before {
  left: 8%;
  right: 8%;
  bottom: 18%;
  height: 46%;
}

.host-space-illustration--violet::after {
  left: 12%;
  right: 12%;
  bottom: 39%;
  height: 2px;
  box-shadow:
    0 0.9rem 0 rgb(99 102 241 / 0.22),
    0 -0.9rem 0 rgb(99 102 241 / 0.22);
}

.host-space-illustration--slate {
  background: linear-gradient(135deg, #e2e8f0 0%, #f8fafc 50%, #f3f1ec 100%) !important;
}

.host-space-illustration--slate::before {
  left: 12%;
  right: 12%;
  bottom: 18%;
  height: 48%;
  border-radius: 0.5rem;
}

.host-space-illustration--slate::after {
  left: 22%;
  right: 22%;
  bottom: 25%;
  height: 26%;
  border-radius: 0.25rem;
}

.host-space-illustration--storage {
  background: linear-gradient(140deg, #ffedd5 0%, #fed7aa 40%, #e2e8f0 100%) !important;
}

.host-space-illustration--storage::before {
  left: 10%;
  right: 10%;
  bottom: 20%;
  height: 50%;
  border-radius: 0.35rem;
  box-shadow: inset 0 0 0 1px rgb(120 53 15 / 0.12);
}

.host-space-illustration--storage::after {
  left: 18%;
  right: 18%;
  bottom: 32%;
  height: 18%;
  border-radius: 0.2rem;
  background: rgb(255 255 255 / 0.35);
}

html.dark .host-space-illustration--driveway,
html.dark .host-space-illustration--indigo,
html.dark .host-space-illustration--amber,
html.dark .host-space-illustration--sky,
html.dark .host-space-illustration--violet,
html.dark .host-space-illustration--slate,
html.dark .host-space-illustration--storage {
  background: linear-gradient(135deg, rgb(30 41 59), rgb(30 27 75), rgb(15 23 42)) !important;
}

.host-earnings-preview__keep {
  margin-top: 1rem;
  border-radius: 1.1rem;
  padding: 1rem;
}

.host-earnings-preview__keep span,
.host-earnings-preview__meta span {
  display: block;
  font-size: var(--type-badge-size, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  letter-spacing: var(--letter-spacing-label, 0.04em);
  text-transform: uppercase;
}

.host-earnings-preview__keep strong {
  display: block;
  margin-top: 0.25rem;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: var(--font-weight-bold, 700);
  line-height: 1;
  letter-spacing: -0.05em;
}

html:not(.dark) .host-earnings-preview__keep {
  background: linear-gradient(135deg, #312e81, #4f46e5);
  color: #fff;
  box-shadow: 0 22px 44px -28px rgb(49 46 129 / 0.85);
}

html.dark .host-earnings-preview__keep {
  background: linear-gradient(135deg, #4338ca, #7c3aed);
  color: #fff;
}

.host-earnings-preview__keep span {
  color: rgb(224 231 255 / 0.92);
}

.host-earnings-preview__meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
  margin-top: 0.75rem;
}

.host-earnings-preview__meta > div {
  border-radius: 0.95rem;
  padding: 0.8rem;
}

.host-earnings-preview__meta strong {
  display: block;
  margin-top: 0.2rem;
  font-size: 1.05rem;
  font-weight: var(--font-weight-bold, 700);
}

html:not(.dark) .host-earnings-preview__meta span {
  color: #64748b;
}

html:not(.dark) .host-earnings-preview__meta strong {
  color: #1e293b;
}

html.dark .host-earnings-preview__meta span {
  color: #94a3b8;
}

html.dark .host-earnings-preview__meta strong {
  color: #f8fafc;
}

html:not(.dark) .host-earnings-preview__meta > div {
  background: rgb(255 255 255 / 0.76);
  border: 1px solid rgb(226 232 240 / 0.9);
}

html.dark .host-earnings-preview__meta > div {
  background: rgb(15 23 42 / 0.56);
  border: 1px solid rgb(51 65 85 / 0.86);
}

.host-calculator-results__main {
  display: block !important;
  padding: 1.05rem !important;
}

.host-calculator-results__main strong {
  display: block;
  margin-top: 0.25rem;
  font-size: clamp(1.8rem, 4vw, 2.7rem) !important;
  line-height: 1;
  letter-spacing: -0.045em;
}

html:not(.dark) .host-calculator-results__main {
  background: linear-gradient(135deg, #312e81, #4f46e5) !important;
  border-color: rgb(99 102 241 / 0.4) !important;
  color: #fff;
}

html.dark .host-calculator-results__main {
  background: linear-gradient(135deg, #4338ca, #7c3aed) !important;
  border-color: rgb(165 180 252 / 0.3) !important;
  color: #fff;
}

.host-calculator-results__main span {
  color: rgb(224 231 255 / 0.92) !important;
}

.host-calculator-results__details {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.host-calculator-results__details > div {
  border-radius: 0.85rem;
  padding: 0.72rem 0.85rem;
}

html:not(.dark) .host-calculator-results__details > div {
  background: rgb(255 255 255 / 0.74);
  border: 1px solid rgb(226 232 240 / 0.92);
}

html.dark .host-calculator-results__details > div {
  background: rgb(15 23 42 / 0.62);
  border: 1px solid rgb(51 65 85 / 0.9);
}

.host-example-visual {
  position: relative;
  margin-bottom: 0.95rem;
}

.host-example-visual .host-space-illustration {
  min-height: 6.2rem;
}

.host-example-visual > span {
  position: absolute;
  left: 0.7rem;
  top: 0.7rem;
  z-index: 3;
  border-radius: 999px;
  padding: 0.28rem 0.55rem;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

html:not(.dark) .host-example-visual > span {
  background: rgb(255 255 255 / 0.82);
  color: #312e81;
  border: 1px solid rgb(99 102 241 / 0.16);
}

html.dark .host-example-visual > span {
  background: rgb(15 23 42 / 0.78);
  color: #e0e7ff;
  border: 1px solid rgb(129 140 248 / 0.22);
}

.host-demand-section {
  position: relative;
}

html:not(.dark) .host-demand-section {
  background:
    radial-gradient(circle at top left, rgb(99 102 241 / 0.12), transparent 28%),
    radial-gradient(circle at bottom right, rgb(245 158 11 / 0.1), transparent 32%),
    linear-gradient(180deg, rgb(255 255 255 / 0.94), rgb(238 242 255 / 0.58));
  border-color: rgb(99 102 241 / 0.14);
}

html.dark .host-demand-section {
  background: linear-gradient(180deg, #0f172a 0%, #111827 100%);
  border-color: #334155;
}

.host-trust-section {
  position: relative;
}

.host-trust-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(20rem, 1.22fr);
  gap: 1rem;
  align-items: stretch;
  border-radius: 1.25rem;
  padding: clamp(1rem, 2.4vw, 1.35rem);
}

.host-trust-copy {
  align-self: center;
}

.host-trust-copy .host-landing-kicker {
  margin-bottom: 0.2rem;
}

.host-trust-copy h2 {
  line-height: 1.12;
}

.host-trust-copy .host-landing-lead {
  margin-top: 0.65rem;
  margin-bottom: 0;
  line-height: 1.45;
  font-size: 0.94rem;
}

.host-trust-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.host-trust-card {
  --host-trust-accent: #6366f1;
  border-radius: 1rem;
  padding: 0.9rem 0.95rem;
}

.host-trust-card strong,
.host-trust-card span {
  display: block;
}

.host-trust-card strong {
  font-size: 0.95rem;
  font-weight: 950;
  line-height: 1.2;
}

.host-trust-card span {
  margin-top: 0.55rem;
  padding: 0.62rem 0.7rem;
  border-left: 3px solid color-mix(in srgb, var(--host-trust-accent) 62%, transparent);
  border-radius: 0.7rem;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.5;
}

html:not(.dark) .host-trust-section {
  background: linear-gradient(180deg, rgb(238 242 255 / 0.58), rgb(255 255 255 / 0.9));
  border-color: rgb(99 102 241 / 0.14);
}

html.dark .host-trust-section {
  background: linear-gradient(180deg, #111827 0%, #0f172a 100%);
  border-color: #334155;
}

html:not(.dark) .host-trust-panel {
  background:
    radial-gradient(circle at top left, rgb(99 102 241 / 0.14), transparent 30%),
    linear-gradient(135deg, rgb(255 255 255 / 0.9), rgb(238 242 255 / 0.72));
  border: 1px solid rgb(99 102 241 / 0.2);
  box-shadow: 0 18px 48px -34px rgb(49 46 129 / 0.34);
}

html.dark .host-trust-panel {
  background:
    radial-gradient(circle at top left, rgb(129 140 248 / 0.14), transparent 30%),
    linear-gradient(135deg, rgb(30 41 59 / 0.78), rgb(15 23 42 / 0.9));
  border: 1px solid rgb(71 85 105 / 0.72);
}

html:not(.dark) .host-trust-card {
  background: rgb(255 255 255 / 0.78);
  border: 1px solid rgb(226 232 240 / 0.86);
}

html.dark .host-trust-card {
  background: rgb(15 23 42 / 0.48);
  border: 1px solid rgb(51 65 85 / 0.82);
}

html:not(.dark) .host-trust-card strong {
  color: #1e1b4b;
}

html.dark .host-trust-card strong {
  color: #f8fafc;
}

html:not(.dark) .host-trust-card span {
  background: color-mix(in srgb, var(--host-trust-accent) 8%, #ffffff);
  color: #334155;
}

html.dark .host-trust-card span {
  background: color-mix(in srgb, var(--host-trust-accent) 16%, transparent);
  color: #e2e8f0;
}

.host-trust-card--indigo {
  --host-trust-accent: #6366f1;
}

.host-trust-card--amber {
  --host-trust-accent: #d97706;
}

.host-trust-card--sky {
  --host-trust-accent: #0284c7;
}

.host-trust-card--violet {
  --host-trust-accent: #8b5cf6;
}

.host-trust-card--emerald {
  --host-trust-accent: #059669;
}

.host-trust-card--rose {
  --host-trust-accent: #e11d48;
}

html:not(.dark) .host-trust-card--indigo {
  border-color: rgb(99 102 241 / 0.32);
}

html:not(.dark) .host-trust-card--amber {
  border-color: rgb(245 158 11 / 0.3);
}

html:not(.dark) .host-trust-card--sky {
  border-color: rgb(14 165 233 / 0.28);
}

html:not(.dark) .host-trust-card--violet {
  border-color: rgb(139 92 246 / 0.3);
}

html:not(.dark) .host-trust-card--emerald {
  border-color: rgb(16 185 129 / 0.32);
}

html:not(.dark) .host-trust-card--rose {
  border-color: rgb(244 63 94 / 0.3);
}

html:not(.dark) .host-fee-comparison-section {
  background:
    radial-gradient(circle at 18% 20%, rgb(79 70 229 / 0.12), transparent 30%),
    linear-gradient(135deg, rgb(15 23 42 / 0.98), rgb(49 46 129 / 0.96));
  border-color: rgb(79 70 229 / 0.24);
  color: #fff;
}

html.dark .host-fee-comparison-section {
  background:
    radial-gradient(circle at 20% 10%, rgb(129 140 248 / 0.18), transparent 32%),
    linear-gradient(135deg, #020617 0%, #1e1b4b 100%);
  border-color: #334155;
  color: #fff;
}

.host-fee-comparison-section .host-landing-kicker,
.host-fee-comparison-section .host-landing-lead {
  color: rgb(224 231 255 / 0.9) !important;
}

.host-fee-comparison-note {
  margin-top: 0.9rem;
  font-size: 0.82rem;
  line-height: 1.5;
  color: rgb(226 232 240 / 0.78);
  max-width: 36rem;
}

.host-fee-comparison-grid {
  display: grid;
  gap: 0.75rem;
}

.host-fee-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  border-radius: 1rem;
  padding: 0.95rem 1rem;
}

.host-fee-row span {
  display: block;
  font-size: 0.92rem;
  font-weight: 900;
}

.host-fee-row p {
  margin-top: 0.25rem;
  font-size: 0.82rem;
  line-height: 1.45;
}

.host-fee-row strong {
  font-size: clamp(1.55rem, 4vw, 2.45rem);
  font-weight: 950;
  letter-spacing: -0.055em;
  white-space: nowrap;
}

.host-fee-row--primary {
  background: linear-gradient(135deg, #f8fafc, #fef3c7);
  color: #1e1b4b;
  box-shadow: 0 20px 48px -26px rgb(251 191 36 / 0.85);
}

.host-fee-row--primary p {
  color: rgb(30 27 75 / 0.78);
}

.host-fee-row--neutral {
  background: rgb(255 255 255 / 0.1);
  border: 1px solid rgb(255 255 255 / 0.16);
  color: #f8fafc;
}

.host-fee-row--neutral p {
  color: rgb(226 232 240 / 0.76);
}

html:not(.dark) .host-landing-examples {
  background:
    radial-gradient(circle at top right, rgb(245 158 11 / 0.12), transparent 30%),
    linear-gradient(180deg, rgb(248 250 252 / 0.94), rgb(255 255 255 / 0.88));
  border-color: rgb(226 232 240 / 0.9);
}

html.dark .host-landing-examples {
  background: linear-gradient(180deg, #111827 0%, #0f172a 100%);
  border-color: #334155;
}

.host-tools-section {
  position: relative;
}

html:not(.dark) .host-tools-section {
  background:
    radial-gradient(circle at top left, rgb(99 102 241 / 0.12), transparent 28%),
    linear-gradient(180deg, rgb(255 255 255 / 0.9), rgb(238 242 255 / 0.62));
  border-color: rgb(99 102 241 / 0.14);
}

html.dark .host-tools-section {
  background: linear-gradient(180deg, #0f172a 0%, #111827 100%);
  border-color: #334155;
}

.host-app-cta-section {
  position: relative;
}

html:not(.dark) .host-app-cta-section {
  background:
    radial-gradient(circle at 12% 10%, rgb(245 158 11 / 0.1), transparent 32%),
    linear-gradient(180deg, rgb(255 255 255 / 0.94), rgb(247 245 241 / 0.88));
  border-color: rgba(180, 83, 9, 0.1);
}

html.dark .host-app-cta-section {
  background: linear-gradient(180deg, #111827 0%, #0f172a 100%);
  border-color: #334155;
}

.host-app-cta-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.25rem;
  align-items: center;
  border-radius: 1.35rem;
  padding: clamp(1.15rem, 2.6vw, 1.6rem);
}

html:not(.dark) .host-app-cta-strip {
  background:
    radial-gradient(circle at top right, rgb(245 158 11 / 0.12), transparent 34%),
    linear-gradient(135deg, rgb(255 255 255 / 0.98), rgb(247 245 241 / 0.9));
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 20px 52px -36px rgba(15, 23, 42, 0.2);
}

html.dark .host-app-cta-strip {
  background:
    radial-gradient(circle at top right, rgb(129 140 248 / 0.16), transparent 34%),
    linear-gradient(135deg, rgb(30 41 59 / 0.86), rgb(15 23 42 / 0.94));
  border: 1px solid rgb(71 85 105 / 0.75);
  box-shadow: 0 20px 52px -38px rgb(0 0 0 / 0.8);
}

.host-app-cta-strip__copy {
  max-width: 42rem;
}

.host-app-cta-strip__action {
  display: flex;
  justify-content: flex-end;
}

.host-app-cta-strip__badge.swiftspot-app-store-badge {
  min-width: 10.75rem;
  width: auto;
  max-width: 100%;
  flex-shrink: 0;
}

.host-tools-header {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(16rem, 0.55fr);
  gap: 1.5rem;
  align-items: end;
  margin-bottom: 1.5rem;
}

.host-tools-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}

.host-tools-grid--six {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.host-tool-card {
  border-radius: 1.1rem;
  padding: 1rem;
  min-height: 100%;
}

.host-tool-card span {
  display: inline-flex;
  width: 1.9rem;
  height: 1.9rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 950;
}

.host-tool-card h3 {
  margin-top: 0.9rem;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.25;
}

.host-tool-card p {
  margin-top: 0.55rem;
  font-size: 0.88rem;
  line-height: 1.5;
}

html:not(.dark) .host-tool-card {
  background: rgb(255 255 255 / 0.82);
  border: 1px solid rgb(226 232 240 / 0.88);
  box-shadow: 0 16px 42px -28px rgb(15 23 42 / 0.28);
}

html.dark .host-tool-card {
  background: rgb(30 41 59 / 0.7);
  border: 1px solid rgb(71 85 105 / 0.72);
}

html:not(.dark) .host-tool-card span {
  background: #312e81;
  color: #fff;
}

html.dark .host-tool-card span {
  background: #818cf8;
  color: #0f172a;
}

html:not(.dark) .host-tool-card p {
  color: #64748b;
}

html.dark .host-tool-card p {
  color: #cbd5e1;
}

.host-tool-card--indigo span {
  background: linear-gradient(135deg, #4f46e5, #6366f1) !important;
}

.host-tool-card--emerald span {
  background: linear-gradient(135deg, #059669, #10b981) !important;
}

.host-tool-card--amber span {
  background: linear-gradient(135deg, #d97706, #f59e0b) !important;
}

.host-tool-card--sky span {
  background: linear-gradient(135deg, #0284c7, #2563eb) !important;
}

.host-tool-card--violet span {
  background: linear-gradient(135deg, #7c3aed, #a855f7) !important;
}

.host-tool-card--slate span {
  background: linear-gradient(135deg, #334155, #64748b) !important;
}

.host-process-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
  justify-content: center;
  margin-top: 1.35rem;
  border-radius: 999px;
  padding: 0.65rem;
  font-size: 0.82rem;
  font-weight: 900;
}

.host-process-strip span {
  border-radius: 999px;
  padding: 0.45rem 0.75rem;
}

.host-process-strip span + span::before {
  content: "->";
  margin-right: 0.65rem;
  color: inherit;
  opacity: 0.62;
}

html:not(.dark) .host-process-strip {
  background: rgb(255 255 255 / 0.72);
  border: 1px solid rgb(99 102 241 / 0.16);
  color: #312e81;
}

html:not(.dark) .host-process-strip span {
  background: rgb(238 242 255 / 0.86);
}

html.dark .host-process-strip {
  background: rgb(15 23 42 / 0.58);
  border: 1px solid rgb(71 85 105 / 0.72);
  color: #e0e7ff;
}

html.dark .host-process-strip span {
  background: rgb(129 140 248 / 0.12);
}

.host-demand-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
}

.host-demand-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.05rem;
  padding: 1rem 1rem 1rem 1.15rem;
}

.host-demand-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.9rem;
  bottom: 0.9rem;
  width: 4px;
  border-radius: 999px;
}

.host-demand-card strong {
  display: block;
  font-size: 0.98rem;
  font-weight: 900;
}

.host-demand-card span {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.9rem;
  line-height: 1.5;
}

html:not(.dark) .host-demand-card {
  background: rgb(255 255 255 / 0.82);
  border: 1px solid rgb(226 232 240 / 0.9);
  box-shadow: 0 14px 36px -28px rgb(15 23 42 / 0.28);
}

html.dark .host-demand-card {
  background: rgb(30 41 59 / 0.68);
  border: 1px solid rgb(71 85 105 / 0.7);
}

html:not(.dark) .host-demand-card::before {
  background: linear-gradient(180deg, #4f46e5, #f59e0b);
}

html.dark .host-demand-card::before {
  background: linear-gradient(180deg, #818cf8, #fbbf24);
}

html:not(.dark) .host-demand-card span {
  color: #64748b;
}

html.dark .host-demand-card span {
  color: #cbd5e1;
}

@media (max-width: 1023px) {
  .host-hero-layout {
    grid-template-columns: 1fr;
  }

  .host-hero-copy {
    max-width: none;
  }

  .host-hero-showcase {
    max-width: 42rem;
    margin: 0 auto;
    justify-self: center;
  }

  .host-operator-metrics {
    width: min(100%, 38rem);
    margin: 1.25rem auto 0;
    justify-self: center;
  }

  .host-example-card,
  .host-example-card:nth-child(4),
  .host-example-card:nth-child(5) {
    grid-column: span 3;
  }

  .host-tools-header,
  .host-tools-grid,
  .host-trust-panel,
  .host-app-cta-strip,
  .host-section-intro--split {
    grid-template-columns: 1fr;
  }

  .host-trust-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .host-demand-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@media (max-width: 767px) {
  .host-payout-grid,
  .host-calculator-inputs,
  .host-steps-grid,
  .host-trust-grid,
  .host-demand-grid {
    grid-template-columns: 1fr;
  }

  .host-earnings-preview__meta,
  .host-calculator-results__details,
  .host-fee-row {
    grid-template-columns: 1fr;
  }

  .host-fee-row strong {
    font-size: 2rem;
  }

  .host-preview-listing-card {
    grid-template-columns: 1fr;
  }

  .host-preview-listing-card .host-space-illustration,
  .host-preview-map {
    min-height: 6.5rem;
  }

  .host-preview-listing-card__caption {
    align-items: flex-start;
    flex-direction: column;
  }

  .host-preview-listing-card__caption span {
    text-align: left;
  }

  .host-example-grid {
    grid-template-columns: 1fr;
  }

  .host-example-card,
  .host-example-card:nth-child(4),
  .host-example-card:nth-child(5) {
    grid-column: auto;
  }

  .host-earnings-preview__rows > div,
  .host-calculator-results > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.35rem;
  }

  .host-process-strip {
    align-items: stretch;
    border-radius: 1rem;
    flex-direction: column;
  }

  .host-process-strip span + span::before {
    content: "";
    margin-right: 0;
  }

  .host-space-type-grid {
    grid-template-columns: 1fr;
  }

  .host-app-cta-strip {
    text-align: center;
  }

  .host-app-cta-strip__copy {
    max-width: none;
  }

  .host-app-cta-strip__action {
    justify-content: stretch;
  }

  .host-app-cta-strip__badge.swiftspot-app-store-badge {
    width: auto;
    max-width: 100%;
    min-width: min(100%, 10.75rem);
    justify-content: flex-start;
    flex-shrink: 0;
  }

  .host-step-flow {
    flex-direction: column;
  }

  .host-tools-grid--six {
    grid-template-columns: 1fr;
  }

  .host-payout-proof__row {
    flex-direction: column;
    align-items: flex-start;
  }

  .host-payout-proof__row dd {
    text-align: left;
  }
}

/* ----- 2026 host acquisition redesign (mosaic, steps, payout proof, FAQ) ----- */

.host-hero-title-single {
  font-size: clamp(2.05rem, 5vw, 3.25rem);
  font-weight: 900;
  letter-spacing: -0.055em;
  line-height: 1.1;
}

.host-hero-title-line2 {
  margin-top: 0.1em;
  background: linear-gradient(105deg, #3730a3 0%, #4f46e5 45%, #7c3aed 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

html.dark .host-hero-title-line2 {
  background: linear-gradient(to right, #a5b4fc, #c4b5fd, #e9d5ff);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.host-hero-showcase {
  display: grid;
  gap: 1.1rem;
  align-content: start;
  max-width: 34rem;
  justify-self: end;
}

.host-hero-mosaic {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  border-radius: 1.1rem;
  overflow: hidden;
  min-height: 9.5rem;
  box-shadow: 0 18px 50px -36px rgb(15 23 42 / 0.45);
}

.host-hero-mosaic__cell {
  min-height: 4.5rem;
  position: relative;
  background-size: 200% 200%;
}

.host-hero-mosaic__cell--asphalt {
  background-image: linear-gradient(145deg, #64748b 0%, #475569 40%, #334155 100%);
}

.host-hero-mosaic__cell--garage {
  background-image: linear-gradient(160deg, #e2e8f0 0%, #94a3b8 45%, #64748b 100%);
}

.host-hero-mosaic__cell--lot {
  background-image: linear-gradient(125deg, #c7d2fe 0%, #a5b4fc 50%, #6366f1 100%);
}

.host-hero-mosaic__cell--storage {
  background-image: linear-gradient(150deg, #ffedd5 0%, #fdba74 55%, #b45309 100%);
}

.host-hero-snapshot {
  display: flex;
  gap: 0.9rem;
  padding: 0.95rem 1rem;
  border-radius: 1.15rem;
  align-items: center;
  border: 1px solid rgb(99 102 241 / 0.2);
  box-shadow: 0 16px 44px -32px rgb(15 23 42 / 0.35);
}

html:not(.dark) .host-hero-snapshot {
  background: rgb(255 255 255 / 0.92);
}

html.dark .host-hero-snapshot {
  background: linear-gradient(145deg, rgb(15 23 42 / 0.96), rgb(30 27 75 / 0.5));
  border-color: rgb(129 140 248 / 0.28);
}

.host-hero-snapshot__media {
  flex: 0 0 auto;
}

.host-hero-snapshot__illus {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 0.85rem;
  min-width: 4.5rem;
  min-height: 4.5rem;
}

.host-hero-snapshot__kicker {
  font-size: var(--type-badge-size, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  letter-spacing: var(--letter-spacing-label, 0.04em);
  text-transform: uppercase;
  color: #64748b;
  margin: 0 0 0.2rem 0;
}

html.dark .host-hero-snapshot__kicker {
  color: #94a3b8;
}

.host-hero-snapshot__title {
  font-size: 1.1rem;
  font-weight: var(--font-weight-bold, 700);
  margin: 0;
  line-height: 1.2;
  color: #0f172a;
}

html.dark .host-hero-snapshot__title {
  color: #f8fafc;
}

.host-hero-snapshot__meta,
.host-hero-snapshot__sub {
  font-size: 0.86rem;
  line-height: 1.4;
  margin: 0.2rem 0 0 0;
  color: #64748b;
}

html.dark .host-hero-snapshot__meta,
html.dark .host-hero-snapshot__sub {
  color: #cbd5e1;
}

.host-space-types-section {
  position: relative;
}

.host-space-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
}

.host-space-type-card {
  display: flex;
  flex-direction: column;
  border-radius: 1.15rem;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgb(226 232 240 / 0.9);
  box-shadow: 0 14px 40px -30px rgb(15 23 42 / 0.35);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

html:not(.dark) .host-space-type-card {
  background: rgb(255 255 255 / 0.9);
}

html.dark .host-space-type-card {
  background: rgb(30 41 59 / 0.65);
  border-color: rgb(71 85 105 / 0.75);
}

.host-space-type-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 48px -32px rgb(15 23 42 / 0.45);
}

.host-space-type-card__visual {
  position: relative;
  min-height: 6.5rem;
  padding: 0.6rem;
}

html:not(.dark) .host-space-type-card__visual {
  background: linear-gradient(180deg, rgb(248 250 252 / 0.95), rgb(238 242 255 / 0.4));
}

html.dark .host-space-type-card__visual {
  background: linear-gradient(180deg, rgb(15 23 42 / 0.9), rgb(30 41 59 / 0.5));
}

.host-space-type-card__illus {
  width: 100%;
  height: 5.5rem;
  border-radius: 0.75rem;
  min-width: 0;
  min-height: 0;
}

.host-space-type-card__title {
  font-size: 1.05rem;
  font-weight: 950;
  margin: 0.75rem 0.9rem 0.15rem 0.9rem;
  color: #0f172a;
}

html.dark .host-space-type-card__title {
  color: #f8fafc;
}

.host-space-type-card__tagline {
  font-size: 0.88rem;
  line-height: 1.45;
  margin: 0 0.9rem 0.9rem 0.9rem;
  color: #64748b;
}

html.dark .host-space-type-card__tagline {
  color: #cbd5e1;
}

@media (max-width: 1023px) {
  .host-space-type-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .host-tools-grid--six {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.host-landing-payout-block {
  position: relative;
}

html:not(.dark) .host-landing-payout-block {
  background: linear-gradient(180deg, rgb(255 255 255 / 0.92), rgb(248 250 252 / 0.8));
  border-color: rgb(99 102 241 / 0.12);
}

html.dark .host-landing-payout-block {
  background: linear-gradient(180deg, #0f172a, #111827 100%);
}

.host-payout-proof {
  max-width: 32rem;
  margin: 0 auto 1.5rem;
}

.host-payout-proof__grid {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
}

.host-payout-proof__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1.05rem;
  border-radius: 0.95rem;
  border: 1px solid rgb(226 232 240 / 0.9);
  background: rgb(255 255 255 / 0.7);
}

html.dark .host-payout-proof__row {
  background: rgb(15 23 42 / 0.65);
  border-color: rgb(51 65 85 / 0.85);
}

.host-payout-proof__row--highlight {
  background: linear-gradient(135deg, #312e81, #4f46e5) !important;
  color: #fff;
  border-color: rgb(129 140 248 / 0.3) !important;
}

.host-payout-proof__row--highlight dt,
.host-payout-proof__row--highlight dd {
  color: #fff !important;
}

.host-payout-proof__row dt {
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.4;
  margin: 0;
  text-align: left;
  color: #475569;
  max-width: 20rem;
}

html.dark .host-payout-proof__row:not(.host-payout-proof__row--highlight) dt {
  color: #94a3b8;
}

.host-payout-proof__row dd {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 950;
  letter-spacing: -0.03em;
  white-space: nowrap;
  text-align: right;
  color: #0f172a;
}

html.dark .host-payout-proof__row:not(.host-payout-proof__row--highlight) dd {
  color: #f1f5f9;
}

.host-payout-proof__row dd span {
  font-size: 0.85rem;
  font-weight: 800;
  margin-left: 0.15rem;
  opacity: 0.9;
}

.host-payout-proof__fee {
  color: #7c2d12 !important;
}

html.dark .host-payout-proof__fee {
  color: #fdba74 !important;
}

.host-payout-section__disclaimer {
  font-size: 0.82rem;
  line-height: 1.55;
  text-align: center;
  color: #94a3b8;
  max-width: 32rem;
  margin: 1rem auto 0;
}

html.dark .host-payout-section__disclaimer {
  color: #94a3b8;
}

.host-calculator-disclosure {
  max-width: 40rem;
  margin: 1.5rem auto 0;
  border-radius: 1.15rem;
  border: 1px solid rgb(99 102 241 / 0.2);
  overflow: hidden;
  background: rgb(99 102 241 / 0.06);
}

html.dark .host-calculator-disclosure {
  background: rgb(15 23 42 / 0.7);
  border-color: rgb(100 116 139 / 0.6);
}

.host-calculator-disclosure__summary {
  list-style: none;
  padding: 1rem 1.15rem;
  cursor: pointer;
  font-weight: 900;
  font-size: 0.98rem;
  color: #312e81;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  user-select: none;
}

html.dark .host-calculator-disclosure__summary {
  color: #c7d2fe;
}

.host-calculator-disclosure__summary::-webkit-details-marker {
  display: none;
}

.host-calculator-disclosure__summary::after {
  content: ">";
  display: inline-flex;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  background: rgb(99 102 241 / 0.15);
  color: #4338ca;
  font-weight: 950;
  font-size: 0.8rem;
  transform: rotate(0deg);
  transition: transform 0.2s ease;
}

html.dark .host-calculator-disclosure__summary::after {
  background: rgb(129 140 248 / 0.2);
  color: #e0e7ff;
}

.host-calculator-disclosure[open] .host-calculator-disclosure__summary::after {
  transform: rotate(90deg);
}

.host-calculator-card--in-disclosure {
  margin: 0 0.8rem 0.9rem 0.8rem;
  border: 0;
  box-shadow: none;
  border-radius: 0.9rem;
}

html:not(.dark) .host-calculator-card--in-disclosure {
  background: linear-gradient(145deg, rgb(255 255 255 / 0.96), rgb(248 250 252 / 0.92)) !important;
  border: 1px solid rgb(226 232 240 / 0.9) !important;
}

html.dark .host-calculator-card--in-disclosure {
  background: rgb(30 41 59 / 0.7) !important;
  border: 1px solid rgb(51 65 85 / 0.85) !important;
}

.host-step-flow {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  justify-content: center;
}

.host-step-flow__item {
  flex: 1 1 10rem;
  max-width: 12.5rem;
  border-radius: 1.1rem;
  padding: 1rem 0.95rem;
  border: 1px solid rgb(99 102 241 / 0.18);
  text-align: center;
  position: relative;
  box-shadow: 0 10px 36px -30px rgb(15 23 42 / 0.35);
}

html:not(.dark) .host-step-flow__item {
  background: rgb(255 255 255 / 0.95);
}

html.dark .host-step-flow__item {
  background: rgb(30 41 59 / 0.6);
  border-color: rgb(100 116 139 / 0.45);
}

.host-step-flow__badge {
  display: inline-flex;
  width: 2.25rem;
  height: 2.25rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 1.05rem;
  font-weight: 950;
  color: #fff;
  background: linear-gradient(135deg, #4338ca, #4f46e5);
  box-shadow: 0 10px 22px -12px rgba(99 102 241, 0.45);
  margin-bottom: 0.5rem;
}

.host-step-flow__title {
  font-size: 0.95rem;
  font-weight: 950;
  margin: 0 0 0.4rem 0;
  line-height: 1.2;
  color: #0f172a;
}

html.dark .host-step-flow__title {
  color: #f8fafc;
}

.host-step-flow__summary {
  font-size: 0.8rem;
  line-height: 1.4;
  margin: 0;
  color: #64748b;
}

html.dark .host-step-flow__summary {
  color: #94a3b8;
}

.host-faq {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.host-faq__item {
  border-radius: 0.95rem;
  border: 1px solid rgb(226 232 240 / 0.9);
  overflow: hidden;
  background: rgb(255 255 255 / 0.78);
}

html.dark .host-faq__item {
  border-color: rgb(71 85 105 / 0.75);
  background: rgb(30 41 59 / 0.5);
}

.host-faq__q {
  list-style: none;
  margin: 0;
  padding: 0.95rem 1.05rem;
  font-weight: 800;
  font-size: 0.95rem;
  cursor: pointer;
  user-select: none;
  text-align: left;
  line-height: 1.4;
  color: #0f172a;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

html.dark .host-faq__q {
  color: #f1f5f9;
}

.host-faq__q::-webkit-details-marker {
  display: none;
}

.host-faq__q::after {
  content: "";
  width: 0.55rem;
  height: 0.55rem;
  border-right: 2px solid #6366f1;
  border-bottom: 2px solid #6366f1;
  transform: rotate(45deg);
  flex: 0 0 auto;
  margin-top: 0.35rem;
  transition: transform 0.2s ease;
}

html.dark .host-faq__q::after {
  border-color: #a5b4fc;
}

.host-faq__item[open] .host-faq__q::after {
  transform: rotate(225deg);
  margin-top: 0.4rem;
}

.host-faq__a {
  margin: 0 0.45rem 0.85rem 0.45rem;
  padding: 0.8rem 0.85rem;
  font-size: 0.9rem;
  line-height: 1.6;
  color: #64748b;
  background: linear-gradient(180deg, rgba(99, 102, 241, 0.05), transparent);
  border-radius: 0.75rem;
}

html.dark .host-faq__a {
  color: #94a3b8;
  background: rgba(0, 0, 0, 0.12);
}

.host-landing-cta-final.host-landing-cta-strip {
  background:
    radial-gradient(circle at 18% 12%, rgba(245, 158, 11, 0.18), transparent 28%),
    linear-gradient(135deg, #0b1120 0%, #111827 48%, #1e293b 100%) !important;
  border: 0;
  border-top: 1px solid rgba(245, 158, 11, 0.22);
  color: #f8fafc;
}

/* ----- Premium host operator restyle (tokens defined at file top) ----- */

/* Initiation page backgrounds: unified with html/body near top of this file */

.host-listing-init-top-fade {
  pointer-events: none;
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  top: 0;
  height: 4.75rem;
  margin-top: -0.85rem;
  background: linear-gradient(
    180deg,
    rgba(248, 250, 252, 0.92) 0%,
    rgba(241, 245, 249, 0.35) 55%,
    transparent 100%
  );
}

html.dark .host-listing-init-top-fade {
  background: linear-gradient(
    180deg,
    rgba(2, 6, 23, 0.42) 0%,
    rgba(15, 23, 42, 0.08) 55%,
    transparent 100%
  );
}

.host-listing-init-orb {
  opacity: 0.32;
}

.host-listing-init-orb--right {
  background: linear-gradient(135deg, rgba(129, 140, 248, 0.42), rgba(79, 70, 229, 0.28));
}

.host-listing-init-orb--left {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.38), rgba(180, 83, 9, 0.24));
}

.host-listing-init-hero {
  min-height: calc(100vh - 4rem);
  min-height: calc(100dvh - 4rem - env(safe-area-inset-bottom, 0px));
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: clamp(0.75rem, 2.5vh, 2rem);
  padding-bottom: max(2.5rem, env(safe-area-inset-bottom));
}

.host-listing-init-layout {
  width: 100%;
  max-width: 32rem;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

/* Quiet exit chrome — sits above the card, not inside the decision stack */
.host-listing-init-chrome {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 1.75rem;
  padding: 0 0.15rem;
}

.host-listing-init-back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin: 0;
  padding: 0.2rem 0.1rem;
  width: auto;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #64748b;
  text-decoration: none;
  border-radius: 0.375rem;
  transition: color 0.15s ease;
}

.host-listing-init-back-link svg {
  width: 0.95rem;
  height: 0.95rem;
  flex-shrink: 0;
  opacity: 0.85;
}

.host-listing-init-back-link:hover,
.host-listing-init-back-link:focus-visible {
  color: #0f172a;
  outline: none;
}

html.dark .host-listing-init-back-link {
  color: #94a3b8;
}

html.dark .host-listing-init-back-link:hover,
html.dark .host-listing-init-back-link:focus-visible {
  color: #f8fafc;
}

.host-listing-init-back-link:focus-visible {
  box-shadow: 0 0 0 2px rgba(100, 116, 139, 0.45);
}

/* Card head: title lives with the form (one composition) */
.host-listing-init-card-head {
  margin: 0 0 1.1rem;
  padding: 0 0 1.05rem;
  border-bottom: 1px solid #e2e8f0;
}

html.dark .host-listing-init-card-head {
  border-bottom-color: #334155;
}

.host-listing-init-kicker {
  display: block;
  margin: 0 0 0.45rem;
  padding: 0;
  border: 0;
  background: none;
  width: auto;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #475569;
}

html.dark .host-listing-init-kicker {
  color: #94a3b8;
}

.host-listing-init-title {
  margin: 0;
  color: #0f172a;
  font-size: clamp(1.45rem, 3.4vw, 1.8rem);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -0.03em;
  text-wrap: balance;
}

html.dark .host-listing-init-title {
  color: #f8fafc;
}

.host-listing-init-lead {
  margin: 0.45rem 0 0;
  max-width: 34rem;
  color: #64748b;
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.5;
}

html.dark .host-listing-init-lead {
  color: #cbd5e1;
}

/* Calm product card — light hub surface (not dark marketing panel) */
.host-listing-init-panel {
  position: relative;
  z-index: 1;
  overflow: visible;
  border-radius: 1rem;
  padding: 1.25rem 1.15rem 1.3rem;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 12px 28px -18px rgba(15, 23, 42, 0.18);
}

html.dark .host-listing-init-panel {
  background: #1e293b;
  border-color: #334155;
  box-shadow: none;
}

/* Remove indigo/amber accent rail — cleaner product edge */
.host-listing-init-panel::before {
  content: none;
}

@media (min-width: 640px) {
  .host-listing-init-panel {
    padding: 1.35rem 1.4rem 1.45rem;
  }
}

.host-listing-init-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Express-start: space type first; more-options / count follow. */
.host-listing-init-form--express-start #listing-init-space-type-intro {
  order: 1;
}
.host-listing-init-form--express-start #listing-init-space-type-options {
  order: 2;
}
.host-listing-init-form--express-start #listing-init-more-options,
.host-listing-init-form--express-start #listing-init-space-count-block {
  order: 3;
}
.host-listing-init-form--express-start #listing-init-complex-fields {
  order: 4;
}
.host-listing-init-form--express-start .host-listing-init-ack,
.host-listing-init-form--express-start .host-listing-init-actions {
  order: 20;
}

/* Space count = primary decision surface */
#listing-init-space-count-block .host-listing-init-panel-intro h2,
.host-listing-init-panel-intro--primary h2 {
  font-size: clamp(1.3rem, 2.8vw, 1.55rem);
}

#listing-init-space-count-block .host-listing-init-options {
  gap: 0.65rem !important;
}

/* Page H1 already owns the question — desk-only section cue */
.host-listing-init-panel-intro--page-led {
  margin-bottom: 0.25rem;
}

.host-listing-init-panel-intro--page-led > p:first-of-type {
  margin: 0;
}

.host-listing-init-panel-sub--desk-only {
  display: none;
}

@media (min-width: 640px) {
  .host-listing-init-panel-sub--desk-only {
    display: block;
  }
}

/* Secondary decisions: same clarity, slightly quieter size */
.host-listing-init-panel-intro--secondary {
  margin-top: 0.2rem;
}

.host-listing-init-panel-intro--secondary > p:first-of-type {
  letter-spacing: 0.06em;
  font-size: 0.72rem;
  font-weight: 700;
}

.host-listing-init-panel-intro--secondary h2 {
  font-size: clamp(1.2rem, 2.5vw, 1.4rem);
  font-weight: 750;
}

.host-listing-init-panel-intro--secondary .host-listing-init-panel-sub {
  font-size: 0.875rem;
  line-height: 1.45;
  margin-top: 0.3rem;
}

.host-listing-init-section--secondary .host-listing-init-option {
  min-height: 0;
}

.host-listing-init-section--secondary .host-listing-init-option-label {
  font-size: 0.95rem;
  font-weight: 700;
}

.host-listing-init-option--space-count {
  min-height: 0;
  padding: 0.9rem 1rem !important;
  border-width: 1.5px;
}

.host-listing-init-option--space-count .host-listing-init-option-label {
  font-size: 1rem;
}

/* Quiet brand selection on primary space-count cards */
.host-listing-init-option--space-count.is-selected {
  border-color: rgba(15, 90, 86, 0.38);
  background: rgba(15, 90, 86, 0.04);
  box-shadow: inset 0 0 0 1px rgba(15, 90, 86, 0.08);
}

.host-listing-init-option--space-count.is-selected .host-listing-init-selected-chip {
  color: #0f5a56;
  background: rgba(15, 90, 86, 0.1);
  border-color: rgba(15, 90, 86, 0.2);
}

html.dark .host-listing-init-option--space-count.is-selected {
  border-color: rgba(45, 212, 191, 0.4);
  background: rgba(15, 90, 86, 0.22);
  box-shadow: none;
}

html.dark .host-listing-init-option--space-count.is-selected .host-listing-init-selected-chip {
  color: #ccfbf1;
  background: rgba(15, 90, 86, 0.35);
  border-color: rgba(45, 212, 191, 0.28);
}

/* Space type = primary decision on express path */
#listing-init-space-type-intro .host-listing-init-panel-intro h2,
.host-listing-init-panel-intro--space-type h2 {
  font-size: clamp(1.15rem, 2.4vw, 1.3rem);
  font-weight: 700;
}

.host-listing-init-panel-intro--space-type {
  margin-top: 0;
  margin-bottom: 0.55rem;
  opacity: 1;
}

.host-listing-init-panel-intro--space-type.host-listing-init-panel-intro--page-led {
  margin-bottom: 0.4rem;
}

#listing-init-space-type-options {
  min-width: 0;
  width: 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#listing-init-space-type-options .host-listing-init-option {
  min-width: 0;
  min-height: 0;
  padding: 0.85rem 0.9rem !important;
  box-shadow: none;
  overflow: hidden;
}

#listing-init-space-type-options .host-listing-init-option-label {
  font-size: 0.98rem;
  font-weight: 700;
}

#listing-init-space-type-options .host-listing-init-option-copy {
  font-size: 0.75rem;
  line-height: 1.4;
}

#listing-init-space-type-options .host-listing-init-option:hover,
#listing-init-space-type-options .host-listing-init-option:focus-within {
  transform: none;
  box-shadow: none;
}

#listing-init-space-type-options .host-listing-init-option.is-selected,
#listing-init-space-type-options .host-listing-init-option:has(> input[type="radio"]:checked) {
  box-shadow: inset 0 0 0 1px rgba(15, 90, 86, 0.12);
}

/* Quiet secondary disclosure — never before the primary decision */
.host-listing-init-more-options {
  margin: 0.15rem 0 0;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  background: #f8fafc;
  overflow: hidden;
}

html.dark .host-listing-init-more-options {
  border-color: #334155;
  background: #0f172a;
}

.host-listing-init-more-options__summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  cursor: pointer;
  list-style: none;
  padding: 0.75rem 0.9rem;
  color: #334155;
  font-size: 0.84rem;
  font-weight: 650;
}

.host-listing-init-more-options__summary::-webkit-details-marker {
  display: none;
}

.host-listing-init-more-options__text {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
}

.host-listing-init-more-options__toggle {
  flex: 0 0 auto;
  color: #94a3b8;
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.2;
}

.host-listing-init-more-options__toggle::before {
  content: "+";
}

.host-listing-init-more-options[open] > .host-listing-init-more-options__summary .host-listing-init-more-options__toggle::before {
  content: "−";
}

html.dark .host-listing-init-more-options__summary {
  color: #e2e8f0;
}

.host-listing-init-more-options__label {
  display: block;
}

.host-listing-init-more-options__hint {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  color: #64748b;
}

html.dark .host-listing-init-more-options__hint {
  color: #94a3b8;
}

.host-listing-init-more-options__body {
  padding: 0 0.9rem 0.9rem;
  border-top: 1px solid #e2e8f0;
}

html.dark .host-listing-init-more-options__body {
  border-top-color: #334155;
}

.host-listing-init-more-options__body .host-listing-init-panel-intro {
  margin-top: 0.75rem;
}

/* “Start without preselecting” is support text, not a third equal option */
.host-listing-init-clear-action {
  align-self: flex-start;
  min-height: 0;
  padding: 0.2rem 0.1rem;
  border: 0;
  border-radius: 0;
  color: #64748b;
  background: transparent;
  font-size: 0.78rem;
  font-weight: 550;
  letter-spacing: 0.01em;
  text-decoration: underline;
  text-underline-offset: 0.18em;
  box-shadow: none;
  transition: color 160ms ease;
}

.host-listing-init-clear-action:hover,
.host-listing-init-clear-action:focus-visible {
  color: #e2e8f0;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.host-listing-init-clear-action.is-active {
  color: #b45309;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  text-decoration: none;
}

.host-listing-init-panel-skip {
  padding-top: 0.15rem;
  margin-top: 0;
  border-top: none;
  display: flex;
  justify-content: flex-start;
}

@media (min-width: 640px) {
  .host-listing-init-panel-skip {
    padding-top: 0.25rem;
    margin-top: 0;
    border-top: none;
    justify-content: flex-start;
  }
}

/* Actions sit under decisions — solid but not louder than choice cards */
.host-listing-init-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.4rem;
  margin-top: 0.55rem;
  padding-top: 0.85rem;
  border-top: 1px solid #e2e8f0;
}

html.dark .host-listing-init-actions {
  border-top-color: #334155;
}

/* Primary CTA: brand teal (matches ListSpot / btn-brand) */
.host-listing-init-cta,
#listing-init-express-action.host-listing-init-cta,
#listing-init-primary-action.host-listing-init-cta {
  min-height: 2.5rem;
  padding-top: 0.62rem;
  padding-bottom: 0.62rem;
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--host-product-primary-text, #ffffff) !important;
  background: var(--host-product-primary, #0f5a56) !important;
  border: 1px solid var(--host-product-primary-hover, #0c4e4a) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.host-listing-init-cta:hover,
#listing-init-express-action.host-listing-init-cta:hover,
#listing-init-primary-action.host-listing-init-cta:hover {
  background: var(--host-product-primary-hover, #0c4e4a) !important;
  border-color: var(--host-product-primary-pressed, #083f3c) !important;
  color: #fff !important;
  filter: none !important;
  box-shadow: none !important;
}

.host-listing-init-cta:active,
#listing-init-express-action.host-listing-init-cta:active,
#listing-init-primary-action.host-listing-init-cta:active {
  background: var(--host-product-primary-pressed, #083f3c) !important;
}

html:not(.dark) .host-listing-init-page .host-listing-init-cta,
html:not(.dark) .host-listing-init-page #listing-init-express-action.host-listing-init-cta,
html:not(.dark) .host-listing-init-page #listing-init-primary-action.host-listing-init-cta {
  color: #fff !important;
  background: var(--host-product-primary, #0f5a56) !important;
  border-color: var(--host-product-primary-hover, #0c4e4a) !important;
}

html:not(.dark) .host-listing-init-page .host-listing-init-cta:hover,
html:not(.dark) .host-listing-init-page #listing-init-express-action.host-listing-init-cta:hover,
html:not(.dark) .host-listing-init-page #listing-init-primary-action.host-listing-init-cta:hover {
  background: var(--host-product-primary-hover, #0c4e4a) !important;
}

html.dark .host-listing-init-page .host-listing-init-cta,
html.dark .host-listing-init-page #listing-init-express-action.host-listing-init-cta,
html.dark .host-listing-init-page #listing-init-primary-action.host-listing-init-cta {
  color: #ffffff !important;
  background: var(--host-product-primary, #0f5a56) !important;
  border-color: var(--host-product-primary-hover, #0c4e4a) !important;
}

html.dark .host-listing-init-page .host-listing-init-cta:hover,
html.dark .host-listing-init-page #listing-init-express-action.host-listing-init-cta:hover,
html.dark .host-listing-init-page #listing-init-primary-action.host-listing-init-cta:hover {
  background: var(--host-product-primary-hover, #0c4e4a) !important;
  border-color: var(--host-product-primary-pressed, #083f3c) !important;
  color: #ffffff !important;
}

@media (min-width: 640px) {
  #listing-init-express-action,
  #listing-init-primary-action {
    width: 100% !important;
    min-width: 0 !important;
  }
}

.host-listing-init-panel-intro {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-bottom: 0.65rem;
}

.host-listing-init-panel-intro p:first-of-type,
.host-listing-init-primer p {
  color: #475569;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

html.dark .host-listing-init-panel-intro p:first-of-type,
html.dark .host-listing-init-primer p {
  color: #94a3b8;
}

.host-listing-init-panel-intro h2,
.host-listing-init-primer h3 {
  color: #0f172a;
  margin: 0;
}

html.dark .host-listing-init-panel-intro h2,
html.dark .host-listing-init-primer h3 {
  color: #f8fafc;
}

.host-listing-init-panel-intro h2 {
  font-size: clamp(1.2rem, 2.6vw, 1.4rem);
  font-weight: 750;
  letter-spacing: -0.025em;
  line-height: 1.22;
}

.host-listing-init-panel-sub {
  margin: 0.35rem 0 0;
  color: #64748b;
  font-size: 0.9rem;
  line-height: 1.5;
}

html.dark .host-listing-init-panel-sub {
  color: #94a3b8;
}

.host-listing-init-panel-skip {
  padding-top: 0.15rem;
  margin-top: 0;
  border-top: none;
  display: flex;
  justify-content: flex-start;
}

@media (min-width: 640px) {
  .host-listing-init-panel-skip {
    padding-top: 0.2rem;
    margin-top: 0;
    border-top: none;
    justify-content: flex-start;
  }
}

/* Kept as text link — hierarchy: not a third option card */
.host-listing-init-clear-action {
  align-self: flex-start;
  min-height: 0;
  padding: 0.2rem 0.1rem;
  border: 0;
  border-radius: 0;
  color: #64748b;
  background: transparent;
  font-size: 0.78rem;
  font-weight: 550;
  letter-spacing: 0.01em;
  text-decoration: underline;
  text-underline-offset: 0.18em;
  box-shadow: none;
  transition: color 160ms ease;
}

.host-listing-init-clear-action:hover,
.host-listing-init-clear-action:focus-visible {
  color: #e2e8f0;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.host-listing-init-clear-action.is-active {
  color: #fcd34d;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  text-decoration: none;
}

.host-listing-init-option {
  position: relative;
  align-items: flex-start;
  padding: 0.85rem 1rem;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #0f172a;
  border-radius: 0.75rem;
}

html.dark .host-listing-init-option {
  border-color: #334155;
  background: #0f172a;
  color: #f8fafc;
}

.host-listing-init-option:hover,
.host-listing-init-option:focus-within {
  transform: none;
  border-color: #cbd5e1;
  background: #f8fafc;
  box-shadow: none;
}

html.dark .host-listing-init-option:hover,
html.dark .host-listing-init-option:focus-within {
  border-color: #475569;
  background: #1e293b;
  box-shadow: none;
}

.host-listing-init-option.is-selected,
.host-listing-init-option:has(> input[type="radio"]:checked) {
  border-color: rgba(15, 90, 86, 0.42);
  background: rgba(15, 90, 86, 0.04);
  box-shadow: inset 0 0 0 1px rgba(15, 90, 86, 0.08);
}

html.dark .host-listing-init-option.is-selected,
html.dark .host-listing-init-option:has(> input[type="radio"]:checked) {
  border-color: rgba(45, 212, 191, 0.45);
  background: rgba(15, 90, 86, 0.22);
  box-shadow: inset 0 0 0 1px rgba(45, 212, 191, 0.1);
}

.host-listing-init-option--parking .host-listing-init-option-icon {
  color: #475569;
  background: #f1f5f9;
  border-color: #e2e8f0;
}

.host-listing-init-option--storage .host-listing-init-option-icon {
  color: #57534e;
  background: #f5f5f4;
  border-color: #e7e5e4;
}

.host-listing-init-option--parking.is-selected,
.host-listing-init-option--parking:has(> input[type="radio"]:checked) {
  border-color: rgba(15, 90, 86, 0.42);
  background: rgba(15, 90, 86, 0.04);
  box-shadow: inset 0 0 0 1px rgba(15, 90, 86, 0.08);
}

html.dark .host-listing-init-option--parking.is-selected,
html.dark .host-listing-init-option--parking:has(> input[type="radio"]:checked) {
  border-color: rgba(45, 212, 191, 0.45);
  background: rgba(15, 90, 86, 0.22);
}

.host-listing-init-option--parking.is-selected .host-listing-init-radio,
.host-listing-init-option--parking:has(> input[type="radio"]:checked) .host-listing-init-radio {
  background: var(--host-product-primary, #0f5a56);
  border-color: var(--host-product-primary-hover, #0c4e4a);
}

.host-listing-init-option--storage.is-selected,
.host-listing-init-option--storage:has(> input[type="radio"]:checked) {
  border-color: rgba(15, 90, 86, 0.42);
  background: rgba(15, 90, 86, 0.04);
  box-shadow: inset 0 0 0 1px rgba(15, 90, 86, 0.08);
}

html.dark .host-listing-init-option--storage.is-selected,
html.dark .host-listing-init-option--storage:has(> input[type="radio"]:checked) {
  border-color: rgba(45, 212, 191, 0.45);
  background: rgba(15, 90, 86, 0.22);
}

.host-listing-init-option--storage.is-selected .host-listing-init-radio,
.host-listing-init-option--storage:has(> input[type="radio"]:checked) .host-listing-init-radio {
  background: var(--host-product-primary, #0f5a56);
  border-color: var(--host-product-primary-hover, #0c4e4a);
}

.host-listing-init-option--storage.is-selected .host-listing-init-selected-chip,
.host-listing-init-option--storage:has(> input[type="radio"]:checked) .host-listing-init-selected-chip {
  color: #0f5a56;
  background: rgba(15, 90, 86, 0.1);
  border-color: rgba(15, 90, 86, 0.22);
}

.host-listing-init-option-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  flex: 0 0 2.1rem;
  border-radius: 0.55rem;
  color: #64748b;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}

html.dark .host-listing-init-option-icon {
  color: #94a3b8;
  background: #0f172a;
  border-color: #334155;
}

.host-listing-init-option-icon svg {
  width: 1.2rem;
  height: 1.2rem;
}

.host-listing-init-radio {
  width: 1.15rem;
  height: 1.15rem;
  border-color: rgba(148, 163, 184, 0.72);
}

/* Prefer real radio state so the indicator cannot desync from form value */
.host-listing-init-option.is-selected .host-listing-init-radio,
.host-listing-init-option:has(> input[type="radio"]:checked) .host-listing-init-radio {
  background: var(--host-product-primary, #0f5a56);
  border-color: var(--host-product-primary-hover, #0c4e4a);
}

.host-listing-init-radio-dot {
  display: none;
  background: #111827;
}

.host-listing-init-option.is-selected .host-listing-init-radio-dot,
.host-listing-init-option:has(> input[type="radio"]:checked) .host-listing-init-radio-dot {
  display: block;
}

.host-listing-init-option-body {
  flex: 1 1 auto;
  min-width: 0;
}

.host-listing-init-option-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.host-listing-init-option-label {
  color: #0f172a;
}

html.dark .host-listing-init-option-label {
  color: #f8fafc;
}

.host-listing-init-option-copy {
  color: #64748b;
}

html.dark .host-listing-init-option-copy {
  color: #94a3b8;
}

.host-listing-init-selected-chip {
  display: none;
}

.host-listing-init-selected-mark {
  display: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 999px;
  color: #ffffff;
  background: var(--host-product-primary, #0f5a56);
}

.host-listing-init-selected-mark svg {
  width: 0.78rem;
  height: 0.78rem;
}

.host-listing-init-option.is-selected .host-listing-init-selected-mark,
.host-listing-init-option:has(> input[type="radio"]:checked) .host-listing-init-selected-mark {
  display: inline-flex;
}

.host-listing-init-unavailable-chip {
  flex: 0 0 auto;
  padding: 0.2rem 0.46rem;
  border-radius: 999px;
  color: rgba(148, 163, 184, 0.95);
  background: rgba(148, 163, 184, 0.12);
  border: 1px solid rgba(148, 163, 184, 0.22);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.host-listing-init-option--disabled {
  cursor: not-allowed;
  opacity: 0.72;
  border-style: dashed;
  background: rgba(2, 6, 23, 0.18);
  box-shadow: none;
}

.host-listing-init-option--disabled:hover,
.host-listing-init-option--disabled:focus-within {
  transform: none;
  border-color: rgba(148, 163, 184, 0.2);
  background: rgba(2, 6, 23, 0.18);
  box-shadow: none;
}

.host-listing-init-option--disabled .host-listing-init-option-icon {
  opacity: 0.55;
}

.host-listing-init-option--disabled .host-listing-init-option-label,
.host-listing-init-option--disabled .host-listing-init-option-copy {
  color: rgba(203, 213, 225, 0.62);
}

.host-listing-init-options--single-active .host-listing-init-option--single.is-selected {
  cursor: default;
}

.host-listing-init-options--single-active .host-listing-init-option--single.is-selected:hover,
.host-listing-init-options--single-active .host-listing-init-option--single.is-selected:focus-within {
  transform: none;
}

.host-listing-init-primer {
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  border-radius: 0.75rem;
  padding: 0.95rem 1rem !important;
}

html.dark .host-listing-init-primer {
  border-color: #334155;
  background: #0f172a;
}

.host-listing-init-primer-head {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.host-listing-init-primer-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 2.25rem;
  border-radius: 0.75rem;
  color: #fcd34d;
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(251, 191, 36, 0.24);
}

.host-listing-init-primer-icon svg {
  width: 1.15rem;
  height: 1.15rem;
}

.host-listing-init-primer-bullets {
  margin: 0;
  padding-left: 1.1rem;
  color: rgba(203, 213, 225, 0.78);
  font-size: 0.84rem;
  line-height: 1.55;
}

.host-listing-init-primer-bullets li + li {
  margin-top: 0.35rem;
}

.host-listing-init-details {
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  background: #f8fafc;
  overflow: hidden;
}

html.dark .host-listing-init-details {
  border-color: #334155;
  background: #0f172a;
}

.host-listing-init-details > summary {
  cursor: pointer;
  list-style: none;
  padding: 0.75rem 1rem;
  color: #334155;
  font-size: 0.84rem;
  font-weight: 650;
}

html.dark .host-listing-init-details > summary {
  color: #e2e8f0;
}

.host-listing-init-details > summary::-webkit-details-marker {
  display: none;
}

.host-listing-init-details > summary::after {
  content: "+";
  float: right;
  color: rgba(148, 163, 184, 0.85);
  font-weight: 900;
}

.host-listing-init-details[open] > summary::after {
  content: "−";
}

.host-listing-init-details .host-listing-init-verification {
  margin: 0;
  border: 0;
  border-radius: 0;
  border-top: 1px solid rgba(148, 163, 184, 0.12);
  padding: 0 1rem 0.95rem;
  background: transparent;
}

.host-listing-init-primer-summary {
  display: block;
  margin-top: 0.42rem;
  color: #475569;
  font-size: 0.88rem;
  line-height: 1.5;
}

html.dark .host-listing-init-primer-summary {
  color: #cbd5e1;
}

.host-listing-init-verification {
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(2, 6, 23, 0.32);
}

.host-listing-init-options.grid {
  gap: 0.65rem !important;
}

.host-listing-init-verification p {
  color: #0f172a;
  font-size: 0.88rem;
  font-weight: 650;
}

html.dark .host-listing-init-verification p {
  color: #f8fafc;
}

.host-listing-init-verification span {
  display: block;
  margin-top: 0.35rem;
  color: #64748b;
  font-size: 0.86rem;
  line-height: 1.55;
}

html.dark .host-listing-init-verification span {
  color: #94a3b8;
}

.host-listing-init-ack {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.88rem 1rem;
  border-radius: 0.75rem;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  box-shadow: none;
}

html.dark .host-listing-init-ack {
  border-color: #334155;
  background: #0f172a;
}

.host-listing-init-ack-input {
  margin-top: 0.35rem;
  flex: 0 0 auto;
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 0.25rem;
  border: 1px solid rgba(15, 90, 86, 0.35);
  background: rgba(15, 23, 42, 0.92);
  accent-color: var(--host-product-primary, #0f5a56);
}

.host-listing-init-ack-input:focus-visible {
  outline: 2px solid rgba(129, 140, 248, 0.55);
  outline-offset: 2px;
}

.host-listing-init-ack-text {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #334155;
}

html.dark .host-listing-init-ack-text {
  color: #e2e8f0;
}

.host-listing-init-ack-link {
  color: inherit;
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.host-listing-init-ack-link:hover,
.host-listing-init-ack-link:focus-visible {
  color: #0f172a;
}

html.dark .host-listing-init-ack-link:hover,
html.dark .host-listing-init-ack-link:focus-visible {
  color: #f8fafc;
}

.host-listing-init-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.4rem;
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}

@media (min-width: 640px) {
  .host-listing-init-actions {
    align-items: flex-start;
    gap: 0.35rem;
  }
}

.host-listing-init-cta-hint {
  margin: 0;
  max-width: 28rem;
  font-size: 0.76rem;
  line-height: 1.52;
  color: #64748b;
}

html.dark .host-listing-init-cta-hint {
  color: #94a3b8;
}

#listing-init-form:has(#listing-init-ack):not(:has(#listing-init-ack:checked)) .host-listing-init-cta-submit {
  opacity: 0.55;
  filter: none;
  cursor: not-allowed;
  pointer-events: none;
  box-shadow: none !important;
}

.host-listing-init-cta-submit {
  min-height: 2.5rem;
}

@media (min-width: 1024px) {
  .host-listing-init-hero {
    align-items: flex-start;
    justify-content: center;
    padding-top: clamp(1rem, 3vh, 2.5rem);
  }
}

@media (max-width: 1023px) {
  .host-listing-init-hero {
    align-items: flex-start;
  }
}

@media (max-width: 767px) {
  /* Brand bar / breadcrumb already titles the page — hide duplicate back chrome */
  body.host-listing-init-mode--portal .host-listing-init-chrome {
    display: none;
  }
}

/* Portal: breadcrumb is enough on desktop too — avoid dual exit paths */
@media (min-width: 768px) {
  body.host-listing-init-mode--portal .host-listing-init-chrome {
    display: none;
  }
}

@media (max-width: 640px) {
  html.dark:has(body.host-landing-body.host-listing-init-mode),
  html.dark body.host-landing-body.host-listing-init-mode,
  html.dark .host-listing-init-page {
    background: #0f172a;
    background-attachment: scroll;
  }

  html:not(.dark):has(body.host-landing-body.host-listing-init-mode),
  html:not(.dark) body.host-landing-body.host-listing-init-mode,
  html:not(.dark) .host-listing-init-page {
    background:
      radial-gradient(ellipse 70% 40% at 8% -8%, rgba(15, 90, 86, 0.06), transparent 55%),
      #f4f6f8;
    background-attachment: scroll;
  }

  .host-listing-init-hero {
    min-height: auto;
    padding-top: 0.35rem;
    padding-bottom: 1.25rem;
  }

  .host-listing-init-layout {
    gap: 0.4rem;
    max-width: none;
  }

  .host-listing-init-chrome {
    min-height: 1.5rem;
    padding: 0 0.05rem 0.1rem;
  }

  .host-listing-init-back-link {
    font-size: 0.78rem;
    font-weight: 500;
    color: #94a3b8;
  }

  .host-listing-init-panel {
    border-radius: 0.75rem;
    padding: 1rem 0.95rem 1.05rem;
  }

  .host-listing-init-card-head {
    margin-bottom: 1rem;
    padding-bottom: 0.95rem;
  }

  .host-listing-init-kicker {
    margin-bottom: 0.35rem;
    font-size: 0.7rem;
  }

  .host-listing-init-title {
    font-size: 1.45rem;
    line-height: 1.2;
  }

  .host-listing-init-lead {
    font-size: 0.9rem;
    line-height: 1.45;
    margin-top: 0.4rem;
  }

  .host-listing-init-form {
    gap: 1rem;
  }

  .host-listing-init-panel-intro--page-led {
    display: none;
  }

  .host-listing-init-panel-intro h2 {
    font-size: 1.2rem;
  }

  .host-listing-init-panel-intro--secondary h2 {
    font-size: 1.15rem;
  }

  .host-listing-init-panel-sub {
    font-size: 0.85rem;
    line-height: 1.4;
  }

  .host-listing-init-panel-intro--secondary .host-listing-init-panel-sub {
    display: none;
  }

  .host-listing-init-panel-skip {
    display: flex;
    justify-content: flex-start;
  }

  .host-listing-init-clear-action {
    width: fit-content;
    align-self: flex-start;
    font-size: 0.72rem;
  }

  .host-listing-init-option {
    gap: 0.4rem;
    min-height: 0;
    padding: 0.75rem 0.8rem;
    border-radius: 0.65rem;
  }

  #listing-init-space-type-options {
    gap: 0.5rem !important;
  }

  #listing-init-space-type-options .host-listing-init-option {
    padding: 0.7rem 0.65rem !important;
  }

  #listing-init-space-type-options .host-listing-init-option-copy {
    font-size: 0.7rem;
    line-height: 1.35;
  }

  .host-listing-init-panel {
    padding-left: 0.95rem;
    padding-right: 0.95rem;
  }

  .host-listing-init-option-icon {
    width: 1.75rem;
    height: 1.75rem;
    flex-basis: 1.75rem;
  }

  .host-listing-init-option-topline {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.3rem 0.45rem;
  }

  .host-listing-init-selected-chip {
    font-size: 0.58rem;
    padding: 0.1rem 0.32rem;
  }

  .host-listing-init-options.grid {
    gap: 0.5rem !important;
  }

  #listing-init-space-count-block .host-listing-init-options,
  #listing-init-distribution-block .host-listing-init-options,
  #listing-init-scope-block .host-listing-init-options {
    margin-bottom: 0 !important;
  }

  .host-listing-init-primer {
    padding: 0.75rem 0.8rem !important;
  }

  .host-listing-init-primer-summary {
    font-size: 0.8rem;
    line-height: 1.4;
  }

  .host-listing-init-ack {
    padding: 0.7rem 0.8rem;
  }

  .host-listing-init-ack-text {
    font-size: 0.76rem;
    line-height: 1.45;
  }

  .host-listing-init-actions {
    position: sticky;
    bottom: 0;
    z-index: 2;
    margin: 0.15rem -0.15rem 0;
    padding: 0.55rem 0.15rem max(0.55rem, env(safe-area-inset-bottom));
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0.92) 38%,
      #ffffff 100%
    );
    backdrop-filter: blur(6px);
    border-top: 1px solid #e2e8f0;
  }

  html.dark .host-listing-init-page .host-listing-init-actions {
    background: linear-gradient(
      180deg,
      rgba(30, 41, 59, 0) 0%,
      rgba(30, 41, 59, 0.92) 38%,
      #1e293b 100%
    );
    border-top-color: #334155;
  }

  #listing-init-express-action,
  #listing-init-primary-action {
    min-height: 2.5rem;
    font-size: 0.9rem;
    width: 100%;
  }

  .host-listing-init-cta-hint {
    font-size: 0.7rem;
    text-align: left;
    color: #64748b;
  }

  .host-listing-init-flashes .ss-callout-dismiss {
    min-width: 2.75rem;
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: -0.375rem -0.375rem -0.375rem 0;
  }
}

/* Operator premium page wash (overrides any older indigo-mist atmosphere) */
html:not(.dark):has(body.host-landing-body:not(.host-listing-init-mode)),
html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) {
  background:
    radial-gradient(circle at 8% 0%, rgba(245, 158, 11, 0.08), transparent 34%),
    radial-gradient(circle at 92% 8%, rgba(148, 163, 184, 0.12), transparent 30%),
    linear-gradient(
      165deg,
      #f7f5f1 0%,
      #f3f1ec 22%,
      #eef1f4 52%,
      #e8eef5 78%,
      #f5f4f0 100%
    ) !important;
}

html:not(.dark) .host-landing-hero {
  background:
    radial-gradient(circle at 14% 10%, rgba(245, 158, 11, 0.1), transparent 34%),
    radial-gradient(circle at 86% 20%, rgba(148, 163, 184, 0.1), transparent 32%),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.97) 0%,
      rgba(247, 245, 241, 0.92) 46%,
      rgba(243, 241, 236, 0.88) 100%
    ) !important;
  border-bottom: 1px solid rgba(180, 83, 9, 0.12);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.7);
  color: #0f172a;
}

html.dark .host-landing-hero {
  background:
    radial-gradient(circle at 18% 12%, rgba(245, 158, 11, 0.14), transparent 26%),
    radial-gradient(circle at 88% 22%, rgba(100, 116, 139, 0.12), transparent 30%),
    linear-gradient(135deg, #080c14 0%, #0b1120 48%, #111827 100%) !important;
  border-bottom-color: rgba(245, 158, 11, 0.18);
}

.host-landing-hero > .absolute {
  opacity: 0.45;
}

html.dark .host-landing-hero .host-hero-copy h1 span:first-child,
html.dark .host-landing-hero .host-hero-lead {
  color: #f8fafc !important;
}

html.dark .host-landing-hero .host-hero-lead {
  max-width: 43rem;
  color: rgba(226, 232, 240, 0.88) !important;
}

html:not(.dark) .host-landing-hero .host-hero-copy h1 span:first-child {
  color: #0f172a !important;
}

html:not(.dark) .host-landing-hero .host-hero-lead {
  max-width: 43rem;
  color: #334155 !important;
}

html:not(.dark) .host-hero-free-note {
  color: #64748b !important;
}

html.dark .host-operator-kicker {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin: 0 auto 1rem;
  padding: 0.42rem 0.72rem;
  border-radius: 999px;
  color: #fcd34d;
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(245, 158, 11, 0.34);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

html:not(.dark) .host-operator-kicker {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin: 0 auto 1rem;
  padding: 0.42rem 0.72rem;
  border-radius: 999px;
  color: #4338ca;
  background: rgb(238 242 255 / 0.92);
  border: 1px solid rgb(165 180 252 / 0.62);
  box-shadow: 0 8px 24px -18px rgb(79 70 229 / 0.35);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

@media (min-width: 1024px) {
  .host-operator-kicker {
    margin-left: 0;
    margin-right: 0;
  }
}

html.dark .host-hero-title-line2 {
  background: linear-gradient(105deg, #fcd34d 0%, #f59e0b 42%, #c4b5fd 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

html:not(.dark) .host-hero-title-line2 {
  background: linear-gradient(105deg, #0f172a 0%, #334155 42%, #b45309 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

html.dark .host-landing-primary-cta {
  background: linear-gradient(100deg, #6366f1 0%, #4f46e5 48%, #4338ca 100%) !important;
  color: #fff !important;
  box-shadow:
    0 14px 32px -16px rgba(79, 70, 229, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

html.dark .host-landing-primary-cta svg {
  color: #fff !important;
}

.host-operator-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
  max-width: 38rem;
}

html.dark .host-operator-metrics li {
  border-radius: 0.95rem;
  padding: 0.75rem 0.85rem;
  text-align: left;
  background: rgba(15, 23, 42, 0.58);
  border: 1px solid rgba(148, 163, 184, 0.22);
}

html:not(.dark) .host-operator-metrics li {
  border-radius: 0.95rem;
  padding: 0.75rem 0.85rem;
  text-align: left;
  background: rgb(255 255 255 / 0.92);
  border: 1px solid rgb(226 232 240 / 0.95);
  box-shadow: 0 12px 32px -22px rgb(15 23 42 / 0.18);
}

html.dark .host-operator-metrics span,
html.dark .host-command-card dt {
  display: block;
  color: rgba(203, 213, 225, 0.72);
  font-size: 0.66rem;
  font-weight: 850;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

html:not(.dark) .host-operator-metrics span {
  display: block;
  color: #6366f1;
  font-size: 0.66rem;
  font-weight: 850;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

html.dark .host-operator-metrics strong,
html.dark .host-command-card dd {
  display: block;
  margin-top: 0.2rem;
  color: #f8fafc;
  font-size: 0.92rem;
  font-weight: 900;
}

html:not(.dark) .host-operator-metrics strong {
  display: block;
  margin-top: 0.2rem;
  color: #0f172a;
  font-size: 0.92rem;
  font-weight: 900;
}

.host-hero-showcase {
  gap: 0.85rem;
}

.host-command-card,
.host-hero-snapshot,
.host-hero-mosaic {
  border: 1px solid rgba(148, 163, 184, 0.24);
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(30, 41, 59, 0.82)) !important;
  box-shadow:
    0 24px 60px -34px rgba(0, 0, 0, 0.72),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.host-command-card {
  border-radius: 1.2rem;
  padding: 1rem;
}

.host-command-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.host-command-card__top span {
  color: #fcd34d;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.host-command-card__top strong {
  color: #f8fafc;
  font-size: 0.85rem;
  font-weight: 900;
}

.host-command-card__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 0.85rem 0 0;
}

.host-command-card__grid div {
  min-width: 0;
  padding: 0.72rem;
  border-radius: 0.85rem;
  background: rgba(2, 6, 23, 0.34);
  border: 1px solid rgba(148, 163, 184, 0.16);
}

.host-command-card dd {
  margin: 0.2rem 0 0;
  font-size: 0.82rem;
}

.host-hero-mosaic {
  padding: 0.55rem;
  background:
    linear-gradient(135deg, rgba(2, 6, 23, 0.96), rgba(15, 23, 42, 0.86)) !important;
}

.host-hero-mosaic__cell {
  border-radius: 0.65rem;
  overflow: hidden;
}

.host-hero-snapshot__title,
.host-hero-snapshot__meta,
.host-hero-snapshot__sub {
  color: #f8fafc !important;
}

.host-hero-snapshot__kicker {
  color: #fcd34d !important;
}

.host-space-types-section,
.host-trust-section,
.host-steps-section,
.host-tools-section,
.host-app-cta-section,
.host-demand-section,
.host-faq-section {
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.94), rgba(226, 232, 240, 0.56)) !important;
  border-color: rgba(15, 23, 42, 0.1) !important;
}

html.dark .host-space-types-section,
html.dark .host-trust-section,
html.dark .host-steps-section,
html.dark .host-tools-section,
html.dark .host-app-cta-section,
html.dark .host-demand-section,
html.dark .host-faq-section {
  background: linear-gradient(180deg, #0f172a, #111827) !important;
  border-color: rgba(71, 85, 105, 0.72) !important;
}

.host-space-type-card,
.host-trust-card,
.host-step-flow__item,
.host-tool-card,
.host-demand-card {
  border-radius: 0.85rem !important;
  box-shadow: none !important;
}

html:not(.dark) .host-space-type-card,
html:not(.dark) .host-trust-card,
html:not(.dark) .host-step-flow__item,
html:not(.dark) .host-tool-card,
html:not(.dark) .host-demand-card {
  background: #fff !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
}

html.dark .host-space-type-card,
html.dark .host-trust-card,
html.dark .host-step-flow__item,
html.dark .host-tool-card,
html.dark .host-demand-card {
  background: rgba(15, 23, 42, 0.72) !important;
  border-color: rgba(71, 85, 105, 0.8) !important;
}

.host-space-type-card::before,
.host-trust-card::before,
.host-tool-card::before,
.host-demand-card::before {
  background: linear-gradient(90deg, #f59e0b, #6366f1) !important;
}

.host-landing-payout-block {
  background:
    radial-gradient(circle at 18% 8%, rgba(245, 158, 11, 0.16), transparent 28%),
    linear-gradient(135deg, #0b1120 0%, #111827 52%, #1e293b 100%) !important;
  color: #f8fafc;
  border-color: rgba(245, 158, 11, 0.22) !important;
}

.host-landing-payout-block .host-landing-kicker,
.host-landing-payout-block .host-landing-lead,
.host-landing-payout-block h2 {
  color: #f8fafc !important;
}

.host-landing-payout-block .host-payout-proof {
  max-width: 40rem;
  padding: 1rem;
  border-radius: 1.25rem;
  background: rgba(2, 6, 23, 0.36);
  border: 1px solid rgba(148, 163, 184, 0.18);
}

.host-landing-payout-block .host-payout-proof__row {
  border-color: rgba(148, 163, 184, 0.18) !important;
  background: rgba(15, 23, 42, 0.68) !important;
}

.host-landing-payout-block .host-payout-proof__row dt,
.host-landing-payout-block .host-payout-proof__row dd {
  color: #f8fafc !important;
}

.host-landing-payout-block .host-payout-proof__row--highlight {
  background: linear-gradient(135deg, #f59e0b, #b45309) !important;
  border-color: rgba(252, 211, 77, 0.42) !important;
}

.host-landing-payout-block .host-payout-proof__row--highlight dt,
.host-landing-payout-block .host-payout-proof__row--highlight dd {
  color: #111827 !important;
}

.host-landing-payout-block .host-payout-section__disclaimer {
  color: #94a3b8 !important;
}

.host-landing-payout-block .host-calculator-disclosure {
  border-color: rgba(148, 163, 184, 0.22);
  background: rgba(15, 23, 42, 0.5);
}

.host-landing-payout-block .host-calculator-disclosure__summary {
  color: #e2e8f0 !important;
}

.host-landing-payout-block .host-calculator-card--in-disclosure {
  background: rgba(15, 23, 42, 0.42) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}

.host-landing-payout-block .host-calculator-field,
.host-landing-payout-block .host-calculator-results__details > div {
  background: rgba(15, 23, 42, 0.72) !important;
  border-color: rgba(148, 163, 184, 0.2) !important;
  color: #f8fafc !important;
}

.host-landing-payout-block .host-calculator-field input {
  color: #f8fafc !important;
}

.host-landing-payout-block .host-calculator-results__main {
  background: linear-gradient(135deg, rgba(51, 65, 85, 0.92), rgba(30, 41, 59, 0.96)) !important;
  color: #f8fafc !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
}

.host-landing-payout-block .host-calculator-results__main span {
  color: rgba(203, 213, 225, 0.82) !important;
}

.host-app-cta-strip {
  border-radius: 1rem;
}

html:not(.dark) .host-app-cta-strip,
html.dark .host-app-cta-strip {
  background:
    radial-gradient(circle at top right, rgba(245, 158, 11, 0.15), transparent 34%),
    linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.92)) !important;
  border-color: rgba(245, 158, 11, 0.24) !important;
  color: #f8fafc;
}

.host-app-cta-strip .host-landing-kicker,
.host-app-cta-strip .host-landing-lead,
.host-app-cta-strip h2 {
  color: #f8fafc !important;
}

.host-landing-cta-final.host-landing-cta-strip {
  border-top: 1px solid rgba(79, 70, 229, 0.14);
}

/* Light close: same operator ink + amber as the rest of /host (not a violet island). */
html:not(.dark) .host-landing-cta-final.host-landing-cta-strip {
  background:
    radial-gradient(circle at 18% 0%, rgba(245, 158, 11, 0.16), transparent 40%),
    radial-gradient(circle at 88% 100%, rgba(255, 255, 255, 0.06), transparent 42%),
    linear-gradient(135deg, #0b1120 0%, #111827 52%, #1e293b 100%) !important;
  border-top-color: rgba(245, 158, 11, 0.2);
  color: #f8fafc;
}

html:not(.dark) .host-landing-cta-final.host-landing-cta-strip h2 {
  color: #f8fafc !important;
}

html:not(.dark) .host-landing-cta-final.host-landing-cta-strip p {
  color: rgba(226, 232, 240, 0.9) !important;
}

html.dark .host-landing-cta-final.host-landing-cta-strip {
  background:
    radial-gradient(circle at 18% 12%, rgba(245, 158, 11, 0.18), transparent 28%),
    linear-gradient(135deg, #0b1120 0%, #111827 48%, #1e293b 100%) !important;
  border-top: 1px solid rgba(245, 158, 11, 0.22);
  color: #f8fafc;
}

html.dark .host-landing-cta-final.host-landing-cta-strip h2 {
  color: #f8fafc !important;
}

html.dark .host-landing-cta-final.host-landing-cta-strip p {
  color: rgba(226, 232, 240, 0.92) !important;
}

html:not(.dark) .host-value-split-section h2,
html:not(.dark) .host-steps-section h2,
html:not(.dark) .host-space-types-section h2,
html:not(.dark) .host-faq-section h2 {
  color: #0f172a;
}

html:not(.dark) .host-value-split-section .host-landing-lead,
html:not(.dark) .host-steps-section .host-landing-lead,
html:not(.dark) .host-space-types-section .host-landing-lead {
  color: #475569;
}

@media (max-width: 640px) {
  .host-operator-metrics,
  .host-command-card__grid {
    grid-template-columns: 1fr;
  }
}

/* Small-device landing polish: final overrides for phone-width host acquisition pages. */
@media (max-width: 767px) {
  body.host-landing-body,
  body.host-landing-body main,
  .host-landing-page {
    overflow-x: clip;
  }

  .host-space-type-grid,
  .host-tools-grid,
  .host-tools-grid--six,
  .host-trust-grid,
  .host-demand-grid {
    grid-template-columns: 1fr !important;
  }

  .host-hero-layout,
  .host-section-intro--split,
  .host-tools-header,
  .host-trust-panel,
  .host-app-cta-strip {
    grid-template-columns: 1fr !important;
  }

  .host-payout-proof__row,
  .host-calculator-results > div,
  .host-fee-row {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 0.4rem !important;
  }

  .host-payout-proof__row dd,
  .host-calculator-results strong,
  .host-fee-row strong {
    max-width: 100%;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  .host-earnings-preview__header p,
  .host-earnings-preview__rows strong,
  .host-calculator-results strong,
  .host-payout-proof__row dd {
    white-space: normal !important;
  }

  .host-earnings-preview__header {
    flex-wrap: wrap;
  }

  .host-calculator-results__details {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  .host-landing-hero {
    padding-top: 2.4rem !important;
    padding-bottom: 2.7rem !important;
  }

  .host-landing-hero .max-w-7xl,
  .host-space-types-section .max-w-6xl,
  .host-trust-section .max-w-6xl,
  .host-steps-section .max-w-6xl,
  .host-landing-payout-block .max-w-6xl,
  .host-tools-section .max-w-6xl,
  .host-demand-section .max-w-6xl,
  .host-faq-section .max-w-3xl,
  .host-landing-cta-final .max-w-2xl {
    padding-left: max(1rem, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(1rem, env(safe-area-inset-right, 0px)) !important;
  }

  .host-hero-title,
  .host-hero-title-single {
    max-width: 100%;
    font-size: clamp(2rem, 10vw, 2.7rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.045em !important;
    overflow-wrap: anywhere;
  }

  .host-hero-title-line2 {
    margin-top: 0.06em;
  }

  .host-hero-lead {
    max-width: 100%;
    font-size: 0.98rem !important;
    line-height: 1.58 !important;
  }

  .host-hero-copy .mt-6,
  .host-landing-cta-final .flex {
    width: 100%;
  }

  .host-landing-primary-cta,
  .host-landing-secondary-cta,
  .host-landing-cta-final a,
  .host-landing-cta-final button {
    width: 100%;
    min-height: 2.85rem;
    padding: 0.78rem 1rem !important;
    font-size: 0.95rem !important;
  }

  .host-operator-metrics {
    max-width: none;
    gap: 0.5rem;
  }

  .host-operator-metrics li,
  .host-command-card__grid div {
    padding: 0.65rem 0.7rem;
  }

  .host-hero-showcase {
    width: 100%;
    max-width: 100%;
    gap: 0.75rem;
  }

  .host-command-card,
  .host-hero-mosaic,
  .host-hero-snapshot,
  .host-payout-proof,
  .host-calculator-disclosure {
    max-width: 100%;
    border-radius: 1rem;
  }

  .host-command-card {
    padding: 0.85rem;
  }

  .host-command-card__top {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.25rem;
  }

  .host-hero-mosaic {
    min-height: 7.75rem;
    padding: 0.45rem;
  }

  .host-hero-mosaic__cell {
    min-height: 3.35rem;
  }

  .host-hero-snapshot {
    align-items: flex-start;
    padding: 0.82rem;
  }

  .host-hero-snapshot__illus {
    width: 3.65rem;
    height: 3.65rem;
    min-width: 3.65rem;
    min-height: 3.65rem;
  }

  .host-hero-snapshot__kicker {
    font-size: 0.66rem;
    letter-spacing: 0.08em;
  }

  .host-space-type-card__visual {
    min-height: 5.6rem;
    padding: 0.5rem;
  }

  .host-space-type-card__illus {
    height: 4.65rem;
  }

  .host-payout-proof {
    padding: 0.75rem;
  }

  .host-payout-proof__row {
    padding: 0.75rem 0.8rem;
  }

  .host-calculator-disclosure__summary {
    padding: 0.85rem 0.9rem;
  }

  .host-calculator-card--in-disclosure {
    margin: 0 0.55rem 0.65rem;
  }
}

@media (max-width: 380px) {
  .host-hero-title,
  .host-hero-title-single {
    font-size: clamp(1.82rem, 10.6vw, 2.25rem) !important;
  }

  .host-operator-kicker {
    max-width: 100%;
    justify-content: center;
    text-align: center;
    white-space: normal;
  }

  .host-hero-snapshot {
    flex-direction: column;
  }

  .host-hero-snapshot__illus {
    width: 100%;
    height: 4rem;
  }

  .host-payout-proof {
    padding: 0.55rem;
  }
}

/* ----- Profit-focused landing (unified panel cards) ----- */
.host-landing-orb--single {
  opacity: 0.18;
}

html.dark .host-landing-orb--single {
  opacity: 0.1;
}

.host-panel-card {
  border-radius: 1.1rem;
  padding: 1.15rem 1.2rem;
  border: 1px solid rgb(226 232 240 / 0.95);
  background: rgb(255 255 255 / 0.94);
  box-shadow: 0 12px 36px -28px rgb(15 23 42 / 0.28);
}

html.dark .host-panel-card {
  background: rgb(30 41 59 / 0.92);
  border-color: rgb(71 85 105 / 0.85);
}

.host-panel-card__title {
  margin: 0 0 0.75rem;
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f172a;
}

html.dark .host-panel-card__title {
  color: #f8fafc;
}

.host-panel-card__body {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  line-height: 1.5;
  color: #334155;
}

html.dark .host-panel-card__body {
  color: #cbd5e1;
}

.host-panel-card__note {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: #64748b;
}

html.dark .host-panel-card__note {
  color: #94a3b8;
}

.host-panel-card__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.host-panel-card__list li {
  position: relative;
  padding-left: 1.15rem;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #475569;
}

html.dark .host-panel-card__list li {
  color: #cbd5e1;
}

.host-panel-card__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 999px;
  background: #6366f1;
}

.host-contrast-grid,
.host-automation-split,
.host-scenarios-grid {
  display: grid;
  gap: 1rem;
}

.host-contrast-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.host-automation-split {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Content sections — consistent light/dark bands and readable intro copy */
html:not(.dark) .host-automation-section {
  background: rgb(255 255 255 / 0.78);
}

html.dark .host-automation-section {
  background: rgb(15 23 42 / 0.72);
}

html:not(.dark) .host-trust-payout-section {
  background: rgb(248 250 252 / 0.92);
}

html.dark .host-trust-payout-section {
  background: rgb(15 23 42 / 0.82);
}

html:not(.dark) .host-problem-section h2,
html:not(.dark) .host-automation-section h2,
html:not(.dark) .host-scenarios-section h2,
html:not(.dark) .host-trust-payout-section h2 {
  color: #0f172a;
}

html.dark .host-problem-section h2,
html.dark .host-automation-section h2,
html.dark .host-scenarios-section h2,
html.dark .host-trust-payout-section h2 {
  color: #f8fafc;
}

html:not(.dark) .host-problem-section .host-landing-lead,
html:not(.dark) .host-automation-section .host-landing-lead,
html:not(.dark) .host-scenarios-section .host-landing-lead,
html:not(.dark) .host-trust-payout-section .host-landing-lead {
  color: #475569;
}

html.dark .host-problem-section .host-landing-lead,
html.dark .host-automation-section .host-landing-lead,
html.dark .host-scenarios-section .host-landing-lead,
html.dark .host-trust-payout-section .host-landing-lead {
  color: #cbd5e1;
}

html.dark .host-panel-card__list li::before {
  background: #818cf8;
}

.host-scenarios-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.host-contrast-card,
.host-scenario-card {
  border: 1px solid rgb(226 232 240 / 0.95);
  background: rgb(255 255 255 / 0.92);
  box-shadow: 0 14px 40px -30px rgb(15 23 42 / 0.34);
  border-radius: 1.1rem;
  padding: 1.15rem 1.2rem;
}

html.dark .host-contrast-card,
html.dark .host-scenario-card {
  background: rgb(30 41 59 / 0.92);
  border-color: rgb(71 85 105 / 0.85);
}

.host-contrast-card h3,
.host-scenario-card h3 {
  margin: 0 0 0.75rem;
  color: #0f172a;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: -0.015em;
}

html.dark .host-contrast-card h3,
html.dark .host-scenario-card h3 {
  color: #f8fafc;
}

.host-contrast-card__split {
  display: grid;
  gap: 0.65rem;
}

.host-contrast-card__split > div {
  border-radius: 0.85rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid rgb(226 232 240 / 0.86);
  background: rgb(248 250 252 / 0.74);
}

html.dark .host-contrast-card__split > div {
  border-color: rgb(51 65 85 / 0.9);
  background: rgb(15 23 42 / 0.46);
}

.host-contrast-card__label {
  margin: 0 0 0.35rem;
  color: #64748b;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.07em;
  line-height: 1.2;
  text-transform: uppercase;
}

.host-contrast-card__label--swiftspot {
  color: #4f46e5;
}

html.dark .host-contrast-card__label {
  color: #94a3b8;
}

html.dark .host-contrast-card__label--swiftspot {
  color: #c7d2fe;
}

.host-contrast-card__text {
  margin: 0;
  color: #475569;
  font-size: 0.88rem;
  line-height: 1.45;
}

html.dark .host-contrast-card__text {
  color: #cbd5e1;
}

.host-panel-card--accent {
  border-color: rgb(99 102 241 / 0.35);
  background:
    radial-gradient(circle at top right, rgb(99 102 241 / 0.1), transparent 42%),
    rgb(255 255 255 / 0.96);
}

html.dark .host-panel-card--accent {
  border-color: rgb(129 140 248 / 0.45);
  background:
    radial-gradient(circle at top right, rgb(99 102 241 / 0.18), transparent 42%),
    rgb(30 41 59 / 0.96);
}

html.dark .host-panel-card--accent .host-panel-card__title {
  color: #e0e7ff;
}

.host-trust-payout-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.95fr);
  gap: clamp(1.25rem, 3vw, 2rem);
  align-items: stretch;
}

.host-trust-payout-copy {
  display: flex;
  flex-direction: column;
}

.host-trust-payout-copy .host-booking-rules-list {
  margin-top: 1rem;
}

.host-trust-payout-copy .host-risk-note {
  margin-top: 1rem;
}

.host-trust-payout-stripe {
  margin-top: auto;
  padding-top: 1.5rem;
  text-align: center;
}

.host-trust-payout-stripe .swiftspot-stripe-trust-inline__row {
  justify-content: center;
}

.host-trust-payout-copy .swiftspot-stripe-trust-inline--host {
  margin-top: 0;
}

/* Payout side — override global forced-dark host-landing calculator rules */
.host-trust-payout-side .host-payout-proof {
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

html:not(.dark) .host-trust-payout-side .host-payout-proof__row:not(.host-payout-proof__row--highlight) {
  background: rgb(255 255 255 / 0.94) !important;
  border-color: rgb(203 213 225 / 0.95) !important;
}

html:not(.dark) .host-trust-payout-side .host-payout-proof__row:not(.host-payout-proof__row--highlight) dt {
  color: #475569 !important;
}

html:not(.dark) .host-trust-payout-side .host-payout-proof__row:not(.host-payout-proof__row--highlight) dd {
  color: #0f172a !important;
}

html.dark .host-trust-payout-side .host-payout-proof__row:not(.host-payout-proof__row--highlight) {
  background: rgb(30 41 59 / 0.88) !important;
  border-color: rgb(71 85 105 / 0.85) !important;
}

html.dark .host-trust-payout-side .host-payout-proof__row:not(.host-payout-proof__row--highlight) dt {
  color: #94a3b8 !important;
}

html.dark .host-trust-payout-side .host-payout-proof__row:not(.host-payout-proof__row--highlight) dd {
  color: #f8fafc !important;
}

html:not(.dark) .host-trust-payout-side .host-payout-section__disclaimer {
  color: #64748b !important;
}

html.dark .host-trust-payout-side .host-payout-section__disclaimer {
  color: #94a3b8 !important;
}

.host-trust-payout-side .host-calculator-disclosure {
  margin: 0;
  max-width: none;
  border-radius: 1rem;
  overflow: hidden;
}

html:not(.dark) .host-trust-payout-side .host-calculator-disclosure {
  border: 1px solid rgb(203 213 225 / 0.95) !important;
  background: rgb(255 255 255 / 0.96) !important;
}

html.dark .host-trust-payout-side .host-calculator-disclosure {
  border: 1px solid rgb(71 85 105 / 0.9) !important;
  background: rgb(30 41 59 / 0.88) !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-disclosure__summary {
  padding: 0.85rem 1rem;
  font-size: 0.9rem;
  font-weight: 800;
  color: #1e293b !important;
  background: rgb(241 245 249 / 0.95) !important;
  border-bottom: 1px solid rgb(226 232 240 / 0.95);
}

html.dark .host-trust-payout-side .host-calculator-disclosure__summary {
  padding: 0.85rem 1rem;
  font-size: 0.9rem;
  font-weight: 800;
  color: #f1f5f9 !important;
  background: rgb(15 23 42 / 0.55) !important;
  border-bottom: 1px solid rgb(51 65 85 / 0.9);
}

html:not(.dark) .host-trust-payout-side .host-calculator-disclosure__summary::after {
  background: #fff;
  border: 1px solid rgb(203 213 225 / 0.95);
  color: #334155;
}

html.dark .host-trust-payout-side .host-calculator-disclosure__summary::after {
  background: rgb(51 65 85 / 0.65);
  border: 1px solid rgb(100 116 139 / 0.85);
  color: #e2e8f0;
}

.host-trust-payout-side .host-calculator-card--in-disclosure {
  margin: 0;
  padding: 1rem;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  background: transparent !important;
}

.host-trust-payout-side .host-calculator-card--in-disclosure::before {
  display: none;
}

html:not(.dark) .host-trust-payout-side .host-calculator-inputs {
  padding: 0.9rem;
  border-radius: 0.85rem;
  background: rgb(248 250 252 / 0.98);
  border: 1px solid rgb(203 213 225 / 0.95);
}

html.dark .host-trust-payout-side .host-calculator-inputs {
  padding: 0.9rem;
  border-radius: 0.85rem;
  background: rgb(15 23 42 / 0.55);
  border: 1px solid rgb(71 85 105 / 0.9);
}

html:not(.dark) .host-trust-payout-side .host-calculator-inputs label > span {
  color: #475569 !important;
}

html.dark .host-trust-payout-side .host-calculator-inputs label > span {
  color: #94a3b8 !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-field {
  background: #fff !important;
  border: 1px solid rgb(148 163 184 / 0.75) !important;
  color: #0f172a !important;
}

html.dark .host-trust-payout-side .host-calculator-field {
  background: rgb(2 6 23 / 0.65) !important;
  border: 1px solid rgb(100 116 139 / 0.8) !important;
  color: #f8fafc !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-field span {
  color: #64748b !important;
}

html.dark .host-trust-payout-side .host-calculator-field span {
  color: #94a3b8 !important;
}

.host-trust-payout-side .host-calculator-field:focus-within {
  border-color: #6366f1 !important;
  box-shadow: 0 0 0 3px rgb(99 102 241 / 0.2);
}

html:not(.dark) .host-trust-payout-side .host-calculator-field input {
  color: #0f172a !important;
}

html.dark .host-trust-payout-side .host-calculator-field input {
  color: #f8fafc !important;
}

.host-trust-payout-side .host-calculator-field input {
  font-size: 1.05rem;
  font-weight: 800;
}

.host-trust-payout-side .host-calculator-results {
  margin-top: 0.85rem;
  gap: 0.55rem;
}

html:not(.dark) .host-trust-payout-side .host-calculator-results > div {
  background: rgb(241 245 249 / 0.95) !important;
  border: 1px solid rgb(203 213 225 / 0.95) !important;
  color: #0f172a !important;
}

html.dark .host-trust-payout-side .host-calculator-results > div {
  background: rgb(15 23 42 / 0.55) !important;
  border: 1px solid rgb(51 65 85 / 0.9) !important;
  color: #f8fafc !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-results span {
  color: #64748b !important;
}

html.dark .host-trust-payout-side .host-calculator-results span {
  color: #94a3b8 !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-results strong {
  color: #0f172a !important;
}

html.dark .host-trust-payout-side .host-calculator-results strong {
  color: #f8fafc !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-results__main {
  background: rgb(238 242 255 / 0.95) !important;
  border-color: rgb(165 180 252 / 0.85) !important;
}

html.dark .host-trust-payout-side .host-calculator-results__main {
  background: rgb(49 46 129 / 0.35) !important;
  border-color: rgb(99 102 241 / 0.45) !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-results__main strong {
  font-size: clamp(1.45rem, 3vw, 1.85rem) !important;
  color: #4338ca !important;
}

html.dark .host-trust-payout-side .host-calculator-results__main strong {
  font-size: clamp(1.45rem, 3vw, 1.85rem) !important;
  color: #c7d2fe !important;
}

html:not(.dark) .host-trust-payout-side .host-calculator-results__details > div {
  background: rgb(255 255 255 / 0.94) !important;
  border-color: rgb(203 213 225 / 0.95) !important;
}

html.dark .host-trust-payout-side .host-calculator-results__details > div {
  background: rgb(30 41 59 / 0.72) !important;
  border-color: rgb(71 85 105 / 0.85) !important;
}

.host-trust-payout-side {
  display: grid;
  gap: 0.85rem;
}

.host-payout-proof__label {
  margin: 0 0 0.65rem;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

html.dark .host-payout-proof__label {
  color: #94a3b8;
}

.host-trust-grid--compact {
  display: grid;
  gap: 0.65rem;
  margin-top: 0.35rem;
}

.host-trust-grid--compact .host-trust-card {
  padding: 0.75rem 0.85rem;
}

.host-trust-grid--compact .host-trust-card strong {
  font-size: 0.88rem;
}

.host-trust-grid--compact .host-trust-card span {
  font-size: 0.82rem;
  line-height: 1.4;
  padding: 0.55rem 0.65rem;
}

.host-pain-card,
.host-automation-card,
.host-contrast-card,
.host-scenario-card,
.host-booking-rules-panel,
.host-manual-comparison-panel {
  border: 1px solid rgb(226 232 240 / 0.95);
  background: rgb(255 255 255 / 0.92);
  box-shadow: 0 14px 40px -30px rgb(15 23 42 / 0.34);
}

html.dark .host-pain-card,
html.dark .host-automation-card,
html.dark .host-contrast-card,
html.dark .host-scenario-card,
html.dark .host-booking-rules-panel,
html.dark .host-manual-comparison-panel {
  background: rgb(30 41 59 / 0.92);
  border-color: rgb(71 85 105 / 0.85);
}

.host-contrast-card,
.host-scenario-card {
  border-radius: 1.1rem;
  padding: 1.15rem 1.2rem;
}

.host-pain-card,
.host-automation-card {
  border-radius: 1.1rem;
  padding: 1.15rem 1.2rem;
}

.host-pain-card h3,
.host-automation-card h3 {
  margin: 0 0 0.45rem;
  color: #0f172a;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: -0.015em;
}

html.dark .host-pain-card h3,
html.dark .host-automation-card h3,
html.dark .host-scenario-card h3 {
  color: #f8fafc;
}

.host-pain-card p,
.host-automation-card p,
.host-scenario-card p,
.host-manual-comparison-panel p {
  margin: 0;
  color: #475569;
  font-size: 0.92rem;
  line-height: 1.55;
}

html.dark .host-pain-card p,
html.dark .host-automation-card p,
html.dark .host-scenario-card p,
html.dark .host-manual-comparison-panel p {
  color: #cbd5e1;
}

.host-automation-card span {
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.75rem;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca;
  font-size: 0.78rem;
  font-weight: 900;
}

html.dark .host-automation-card span {
  background: rgb(67 56 202 / 0.28);
  color: #c7d2fe;
}

.host-scenario-card {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.host-scenario-card__split {
  display: grid;
  gap: 0.7rem;
}

.host-scenario-card__split > div {
  border-radius: 0.85rem;
  padding: 0.85rem;
  border: 1px solid rgb(226 232 240 / 0.86);
  background: rgb(248 250 252 / 0.74);
}

html.dark .host-scenario-card__split > div {
  border-color: rgb(51 65 85 / 0.9);
  background: rgb(15 23 42 / 0.46);
}

.host-scenario-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.45rem;
  counter-reset: scenario-step;
}

.host-scenario-steps li {
  position: relative;
  padding-left: 1.6rem;
  color: #475569;
  font-size: 0.86rem;
  line-height: 1.38;
  counter-increment: scenario-step;
}

html.dark .host-scenario-steps li {
  color: #cbd5e1;
}

.host-scenario-steps li::before {
  content: counter(scenario-step);
  position: absolute;
  left: 0;
  top: 0.02rem;
  display: inline-flex;
  width: 1.05rem;
  height: 1.05rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 900;
}

.host-scenario-steps--manual li::before {
  background: #fee2e2;
  color: #991b1b;
}

.host-scenario-steps--swiftspot li::before {
  background: #dcfce7;
  color: #166534;
}

html.dark .host-scenario-steps--manual li::before {
  background: rgb(127 29 29 / 0.45);
  color: #fecaca;
}

html.dark .host-scenario-steps--swiftspot li::before {
  background: rgb(20 83 45 / 0.45);
  color: #bbf7d0;
}

.host-scenario-card__label {
  margin-bottom: 0.35rem !important;
  color: #4f46e5 !important;
  font-size: 0.7rem !important;
  font-weight: 900;
  letter-spacing: 0.07em;
  line-height: 1.2 !important;
  text-transform: uppercase;
}

html.dark .host-scenario-card__label {
  color: #c7d2fe !important;
}

.host-booking-rules-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(18rem, 0.7fr);
  gap: 1.5rem;
  align-items: center;
  border-radius: 1.35rem;
  padding: clamp(1.15rem, 3vw, 1.75rem);
}

html:not(.dark) .host-booking-rules-panel {
  background:
    radial-gradient(circle at top left, rgb(99 102 241 / 0.12), transparent 32%),
    linear-gradient(135deg, rgb(255 255 255 / 0.96), rgb(248 250 252 / 0.88));
}

html.dark .host-booking-rules-panel {
  background:
    radial-gradient(circle at top left, rgb(129 140 248 / 0.14), transparent 34%),
    linear-gradient(135deg, rgb(30 41 59 / 0.78), rgb(15 23 42 / 0.9));
}

.host-risk-note {
  margin: 0.9rem 0 0;
  border-left: 3px solid #6366f1;
  padding-left: 0.85rem;
  color: #475569;
  font-size: 0.9rem;
  line-height: 1.55;
}

html.dark .host-risk-note {
  color: #cbd5e1;
  border-left-color: #a5b4fc;
}

.host-booking-rules-list {
  display: grid;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.host-booking-rules-list li {
  position: relative;
  border-radius: 0.9rem;
  padding: 0.75rem 0.85rem 0.75rem 2rem;
  background: rgb(255 255 255 / 0.76);
  border: 1px solid rgb(226 232 240 / 0.92);
  color: #1e293b;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.35;
}

html.dark .host-booking-rules-list li {
  background: rgb(15 23 42 / 0.58);
  border-color: rgb(51 65 85 / 0.9);
  color: #e2e8f0;
}

.host-booking-rules-list li::before {
  content: "";
  position: absolute;
  left: 0.85rem;
  top: 1.05rem;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 999px;
  background: #16a34a;
}

.host-manual-comparison-panel {
  max-width: 56rem;
  margin: 0 auto;
  border-radius: 1.35rem;
  padding: clamp(1.15rem, 3vw, 1.75rem);
  text-align: center;
}

.host-manual-comparison-panel h2 {
  margin-bottom: 0.85rem;
}

.host-manual-comparison-panel p + p {
  margin-top: 0.75rem;
}

.host-value-split-grid,
.host-listable-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.host-listable-grid {
  gap: 1.15rem;
}

.host-listable-grid .host-panel-card--listable {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 1.15rem 1.2rem;
}

.host-listable-grid .host-panel-card--listable .host-panel-card__title {
  margin: 0 0 0.15rem;
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f172a;
}

html.dark .host-listable-grid .host-panel-card--listable .host-panel-card__title {
  color: #f8fafc;
}

.host-listable-grid .host-panel-card--listable .host-panel-card__body {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.5;
  color: #334155;
}

html.dark .host-listable-grid .host-panel-card--listable .host-panel-card__body {
  color: #cbd5e1;
}

.host-listable-grid .host-panel-card--listable .host-panel-card__note {
  margin: 0.2rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: #64748b;
}

html.dark .host-listable-grid .host-panel-card--listable .host-panel-card__note {
  color: #94a3b8;
}

.host-demand-row {
  margin-top: 1.65rem;
  text-align: center;
}

.host-demand-row__caption {
  margin: 0 0 0.65rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}

html.dark .host-demand-row__caption {
  color: #94a3b8;
}

.host-demand-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin: 0;
}

.host-demand-chip {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.1rem;
  max-width: 16rem;
  border-radius: 0.65rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid rgb(226 232 240 / 0.75);
  background: rgb(255 255 255 / 0.55);
  text-align: left;
}

html.dark .host-demand-chip {
  background: rgb(15 23 42 / 0.35);
  border-color: rgb(51 65 85 / 0.65);
}

.host-demand-chip strong {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  color: #0f172a;
}

html.dark .host-demand-chip strong {
  color: #f1f5f9;
}

.host-demand-chip span {
  display: block;
  font-size: 0.75rem;
  line-height: 1.35;
  color: #64748b;
}

html.dark .host-demand-chip span {
  color: #94a3b8;
}

.host-step-flow--three .host-step-flow__item {
  max-width: 14rem;
}

.host-operator-metrics--outcomes li strong {
  font-size: 0.88rem;
}

/* Initiation: light brand (aligned with host landing) */
html:not(.dark) body.host-landing-body.host-listing-init-mode,
html:not(.dark):has(body.host-landing-body.host-listing-init-mode),
html:not(.dark) .host-listing-init-page {
  color: #1e293b;
}

html:not(.dark) .host-listing-init-page .host-listing-init-title {
  color: #0f172a;
}

html:not(.dark) .host-listing-init-page .host-listing-init-lead {
  color: #475569;
}

html:not(.dark) .host-listing-init-page .host-listing-init-kicker {
  color: #475569;
}

html:not(.dark) .host-listing-init-page .host-listing-init-actions {
  border-top-color: rgba(148, 163, 184, 0.28);
}

html:not(.dark) .host-listing-init-page .host-listing-init-panel {
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 12px 28px -18px rgba(15, 23, 42, 0.18);
}

html:not(.dark) .host-listing-init-page .host-listing-init-panel-intro p:first-of-type,
html:not(.dark) .host-listing-init-page .host-listing-init-primer p {
  color: #475569;
}

html:not(.dark) .host-listing-init-page .host-listing-init-panel-intro h2,
html:not(.dark) .host-listing-init-page .host-listing-init-primer h3 {
  color: #0f172a;
}

html:not(.dark) .host-listing-init-page .host-listing-init-panel-sub {
  color: #64748b;
}

html:not(.dark) .host-listing-init-page .host-listing-init-panel-skip {
  border-top-color: rgba(148, 163, 184, 0.28);
}

html:not(.dark) .host-listing-init-page .host-listing-init-clear-action {
  color: #64748b;
  background: transparent;
  border: 0;
  text-decoration: underline;
  text-underline-offset: 0.18em;
  font-weight: 600;
  min-height: 0;
  padding: 0.2rem 0.1rem;
  border-radius: 0;
  box-shadow: none;
}

html:not(.dark) .host-listing-init-page .host-listing-init-clear-action:hover,
html:not(.dark) .host-listing-init-page .host-listing-init-clear-action:focus-visible {
  color: #0f172a;
  background: transparent;
  border-color: transparent;
}

html:not(.dark) .host-listing-init-page .host-listing-init-clear-action.is-active {
  color: #b45309;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  text-decoration: none;
}

html:not(.dark) .host-listing-init-page .host-listing-init-option {
  color: #0f172a;
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.42);
}

html:not(.dark) .host-listing-init-page .host-listing-init-option:hover,
html:not(.dark) .host-listing-init-page .host-listing-init-option:focus-within {
  background: #f1f5f9;
  border-color: rgba(100, 116, 139, 0.45);
  box-shadow: 0 12px 28px -24px rgba(15, 23, 42, 0.2);
}

html:not(.dark) .host-listing-init-page .host-listing-init-option.is-selected {
  background:
    radial-gradient(circle at top right, rgba(148, 163, 184, 0.12), transparent 44%),
    #f1f5f9;
  border-color: rgba(100, 116, 139, 0.45);
  box-shadow:
    0 14px 32px -28px rgba(15, 23, 42, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

/* Space count selection: neutral (base styles) — avoid amber wash */

/* Space type selected state uses brand teal (not slate / amber leftovers) */
html:not(.dark) .host-listing-init-page #listing-init-space-type-options .host-listing-init-option.is-selected {
  background: rgba(15, 90, 86, 0.05);
  border-color: rgba(15, 90, 86, 0.45);
  box-shadow: inset 0 0 0 1px rgba(15, 90, 86, 0.1);
}

html:not(.dark) .host-listing-init-page .host-listing-init-option--parking.is-selected {
  background: rgba(15, 90, 86, 0.05);
  border-color: rgba(15, 90, 86, 0.45);
}

html:not(.dark) .host-listing-init-page .host-listing-init-option--storage.is-selected {
  background: rgba(15, 90, 86, 0.05);
  border-color: rgba(15, 90, 86, 0.45);
}

html:not(.dark) .host-listing-init-page .host-listing-init-option.is-selected .host-listing-init-option-icon {
  color: var(--host-product-primary, #0f5a56);
  background: rgba(15, 90, 86, 0.1);
  border-color: rgba(15, 90, 86, 0.2);
}

/* Option icons stay neutral on initiation — color was fighting the calm hub surface */
html:not(.dark) .host-listing-init-page .host-listing-init-option--parking .host-listing-init-option-icon,
html:not(.dark) .host-listing-init-page .host-listing-init-option--storage .host-listing-init-option-icon,
html:not(.dark) .host-listing-init-page .host-listing-init-option-icon,
html:not(.dark) .host-listing-init-page .host-listing-init-option--single .host-listing-init-option-icon,
html:not(.dark) .host-listing-init-page .host-listing-init-option--complex .host-listing-init-option-icon {
  color: #64748b;
  background: #f1f5f9;
  border-color: #e2e8f0;
}

html:not(.dark) .host-listing-init-page .host-listing-init-option-label {
  color: #0f172a;
}

html:not(.dark) .host-listing-init-page .host-listing-init-option-copy {
  color: #64748b;
}

html:not(.dark) .host-listing-init-page .host-listing-init-selected-chip {
  color: #0f5a56;
  background: rgba(15, 90, 86, 0.1);
  border-color: rgba(15, 90, 86, 0.22);
}

html:not(.dark) .host-listing-init-page .host-listing-init-radio {
  border-color: rgba(100, 116, 139, 0.55);
}

html:not(.dark) .host-listing-init-page .host-listing-init-option.is-selected .host-listing-init-radio {
  background: var(--host-product-primary, #0f5a56);
  border-color: var(--host-product-primary-hover, #0c4e4a);
}

html:not(.dark) .host-listing-init-page .host-listing-init-primer {
  background:
    radial-gradient(circle at top right, rgba(245, 158, 11, 0.07), transparent 38%),
    #f8fafc;
  border-color: rgba(148, 163, 184, 0.32);
}

html:not(.dark) .host-listing-init-page .host-listing-init-primer-summary {
  color: #475569;
}

html:not(.dark) .host-listing-init-page .host-listing-init-primer-icon {
  color: #d97706;
  background: rgba(245, 158, 11, 0.1);
  border-color: rgba(245, 158, 11, 0.24);
}

html:not(.dark) .host-listing-init-page .host-listing-init-primer-bullets {
  color: #64748b;
}

html:not(.dark) .host-listing-init-page .host-listing-init-details {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.32);
}

html:not(.dark) .host-listing-init-page .host-listing-init-details > summary {
  color: #334155;
}

html:not(.dark) .host-listing-init-page .host-listing-init-verification {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.32);
}

html:not(.dark) .host-listing-init-page .host-listing-init-verification p {
  color: #0f172a;
}

html:not(.dark) .host-listing-init-page .host-listing-init-verification span {
  color: #475569;
}

html:not(.dark) .host-listing-init-page .host-listing-init-ack-text {
  color: #334155;
}

html:not(.dark) .host-listing-init-page .host-listing-init-cta-hint {
  color: #64748b;
}

html:not(.dark) .host-listing-init-page .host-listing-init-ack {
  background: #f8fafc;
  border-color: rgba(15, 90, 86, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

html:not(.dark) .host-listing-init-page .host-listing-init-ack-input {
  background: #ffffff;
  border-color: rgba(100, 116, 139, 0.45);
}

html:not(.dark) .host-listing-init-top-fade {
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.92) 0%, transparent 100%);
}

@media (max-width: 767px) {
  .host-contrast-grid,
  .host-automation-split,
  .host-scenarios-grid,
  .host-trust-payout-panel,
  .host-pain-grid,
  .host-automation-grid,
  .host-booking-rules-panel {
    grid-template-columns: 1fr;
  }

  .host-value-split-grid,
  .host-listable-grid {
    grid-template-columns: 1fr;
  }

  .host-step-flow {
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
  }

  .host-step-flow--three .host-step-flow__item,
  .host-step-flow__item {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 0.75rem;
    row-gap: 0.35rem;
    align-items: start;
    flex: 1 1 100%;
    max-width: none;
    text-align: left;
    padding: 0.85rem 1rem;
  }

  .host-step-flow__badge {
    grid-column: 1;
    grid-row: 1;
    margin-bottom: 0;
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    font-size: 0.9375rem;
    align-self: center;
  }

  .host-step-flow__title {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    align-self: center;
    font-size: 0.9375rem;
    line-height: 1.25;
  }

  .host-step-flow__summary {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.45;
  }

  .host-demand-chips {
    flex-direction: column;
    align-items: stretch;
  }

  .host-demand-chip {
    max-width: none;
    width: 100%;
  }
}

/* Host landing hero — invitation scale (breathing room for first viewport) */
.host-landing-hero {
  padding-top: 3rem !important;
  padding-bottom: 3.25rem !important;
}

@media (min-width: 640px) {
  .host-landing-hero {
    padding-top: 3.75rem !important;
    padding-bottom: 4rem !important;
  }
}

@media (min-width: 1024px) {
  .host-landing-hero {
    padding-top: 4.5rem !important;
    padding-bottom: 4.75rem !important;
  }
}

.host-landing-hero .host-hero-layout {
  gap: clamp(1.75rem, 4.5vw, 3.5rem);
  grid-template-columns: minmax(0, 1.08fr) minmax(18.5rem, 0.92fr);
}

.host-landing-hero .host-hero-copy {
  max-width: 42rem;
}

.host-landing-hero .host-operator-kicker {
  margin-bottom: 0.9rem;
  padding: 0.34rem 0.62rem;
  font-size: 0.72rem;
}

.host-landing-hero .host-hero-title-single {
  font-size: clamp(1.95rem, 4.5vw, 3.05rem);
}

.host-landing-hero .host-hero-title.mb-5 {
  margin-bottom: 1.15rem !important;
}

.host-landing-hero .host-hero-lead {
  margin-top: 0.65rem !important;
  font-size: 1rem !important;
  line-height: 1.6 !important;
}

@media (min-width: 640px) {
  .host-landing-hero .host-hero-lead {
    font-size: 1.125rem !important;
  }
}

.host-landing-hero .host-hero-copy .mt-6,
.host-landing-hero .host-hero-copy .mt-5 {
  margin-top: 1.5rem !important;
  gap: 0.75rem !important;
}

.host-landing-hero .host-landing-primary-cta,
.host-landing-hero .host-landing-secondary-cta {
  padding: 0.72rem 1.35rem !important;
  font-size: 1rem !important;
  border-radius: 0.8rem !important;
}

.host-landing-hero .host-landing-primary-cta svg {
  width: 1.125rem !important;
  height: 1.125rem !important;
  margin-right: 0.45rem !important;
}

.host-landing-hero .host-operator-metrics {
  gap: 0.65rem;
  margin-top: 1.35rem !important;
  max-width: 34rem;
}

.host-landing-hero .host-operator-metrics li {
  padding: 0.58rem 0.68rem;
  border-radius: 0.82rem;
}

.host-landing-hero .host-operator-metrics span {
  font-size: 0.62rem;
}

.host-landing-hero .host-operator-metrics strong,
.host-landing-hero .host-operator-metrics--outcomes li strong {
  font-size: 0.84rem;
}

.host-landing-hero .host-hero-showcase {
  gap: 0.75rem;
  max-width: 30rem;
}

@media (max-width: 1023px) {
  .host-landing-hero .host-hero-showcase,
  .host-landing-hero .host-capacity-preview {
    max-width: 36rem;
  }

  .host-landing-hero .host-operator-metrics {
    width: min(100%, 34rem);
    margin-top: 1.25rem !important;
  }
}

@media (max-width: 640px) {
  .host-landing-hero {
    padding-top: 2.5rem !important;
    padding-bottom: 2.75rem !important;
  }

  .host-landing-hero .host-hero-title-single {
    font-size: clamp(1.85rem, 8.5vw, 2.4rem) !important;
  }

  .host-landing-hero .host-hero-lead {
    font-size: 0.95rem !important;
  }

  .host-landing-hero .host-landing-primary-cta,
  .host-landing-hero .host-landing-secondary-cta {
    min-height: 2.85rem;
    padding: 0.7rem 1.05rem !important;
    font-size: 0.95rem !important;
  }

  .host-landing-hero .host-operator-metrics li {
    padding: 0.52rem 0.6rem;
  }

  .host-landing-hero .host-hero-showcase,
  .host-landing-hero .host-capacity-preview {
    max-width: 100%;
  }
}

/* Host acquisition hero: operator paper + soft amber edge (not About indigo mist) */
html:not(.dark) .host-landing-hero {
  background:
    radial-gradient(circle at 14% 10%, rgba(245, 158, 11, 0.1), transparent 34%),
    radial-gradient(circle at 86% 20%, rgba(148, 163, 184, 0.1), transparent 32%),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.97) 0%,
      rgba(247, 245, 241, 0.92) 46%,
      rgba(243, 241, 236, 0.88) 100%
    ) !important;
  border-bottom: 1px solid rgba(180, 83, 9, 0.12);
}

html.dark .host-landing-hero {
  background:
    radial-gradient(circle at 18% 12%, rgba(245, 158, 11, 0.14), transparent 26%),
    radial-gradient(circle at 88% 22%, rgba(100, 116, 139, 0.1), transparent 30%),
    linear-gradient(135deg, #080c14 0%, #0b1120 48%, #111827 100%) !important;
  border-bottom-color: rgba(245, 158, 11, 0.18);
}

.host-landing-hero .host-hero-copy h1 span:first-child,
.host-landing-hero .host-hero-lead {
  color: #0f172a !important;
}

html.dark .host-landing-hero .host-hero-copy h1 span:first-child,
html.dark .host-landing-hero .host-hero-lead {
  color: #f8fafc !important;
}

.host-landing-hero .host-hero-lead {
  color: #334155 !important;
}

html.dark .host-landing-hero .host-hero-lead {
  color: #cbd5e1 !important;
}

.host-hero-title-line2 {
  background: none !important;
  -webkit-text-fill-color: initial !important;
  color: #1e293b !important;
}

html.dark .host-hero-title-line2 {
  color: #e2e8f0 !important;
}

.host-landing-hero .host-operator-kicker {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  color: #b45309 !important;
}

html.dark .host-landing-hero .host-operator-kicker {
  color: #fcd34d !important;
}

.host-landing-primary-cta {
  background: #4f46e5 !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

.host-landing-primary-cta:hover {
  background: #4338ca !important;
  filter: none !important;
  box-shadow: none !important;
}

html:not(.dark) .host-landing-secondary-cta,
html:not(.dark) .host-landing-hero .host-landing-secondary-cta,
html:not(.dark) .host-landing-hero .host-landing-secondary-cta:visited {
  background: #fff !important;
  border: 1px solid rgb(203 213 225) !important;
  color: #334155 !important;
  box-shadow: none !important;
  transform: none !important;
}

html:not(.dark) .host-landing-secondary-cta:hover,
html:not(.dark) .host-landing-hero .host-landing-secondary-cta:hover {
  background: #f8fafc !important;
  border-color: rgb(148 163 184) !important;
  color: #0f172a !important;
  box-shadow: none !important;
}

html.dark .host-landing-secondary-cta,
html.dark .host-landing-hero .host-landing-secondary-cta,
html.dark .host-landing-hero .host-landing-secondary-cta:visited {
  background: rgb(30 41 59) !important;
  border-color: rgb(71 85 105) !important;
  color: #e2e8f0 !important;
}

html.dark .host-landing-secondary-cta:hover,
html.dark .host-landing-hero .host-landing-secondary-cta:hover {
  background: rgb(51 65 85) !important;
  border-color: rgb(100 116 139) !important;
  color: #f8fafc !important;
}

/* Auth modal on host marketing landing: frosted scrim + elevated card (no map; light blur OK). */
body.host-landing-body:not(.host-listing-init-mode) #auth-modal.show #auth-modal-backdrop {
  background: rgba(248, 250, 252, 0.92) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  backdrop-filter: blur(6px) !important;
}

html.dark body.host-landing-body:not(.host-listing-init-mode) #auth-modal.show #auth-modal-backdrop {
  background: rgba(2, 6, 23, 0.78) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  backdrop-filter: blur(4px) !important;
}

body.host-landing-body:not(.host-listing-init-mode) #auth-modal.show #auth-modal-content {
  box-shadow:
    0 0 0 1px rgba(148, 163, 184, 0.35),
    0 24px 48px -12px rgba(15, 23, 42, 0.28),
    0 12px 24px -8px rgba(15, 23, 42, 0.12);
}

html.dark body.host-landing-body:not(.host-listing-init-mode) #auth-modal.show #auth-modal-content {
  box-shadow:
    0 0 0 1px rgba(148, 163, 184, 0.22),
    0 24px 48px -12px rgba(0, 0, 0, 0.55);
}

/* Scope choice icons (single location vs property) */
.host-listing-init-option--single .host-listing-init-option-icon {
  color: #475569;
  background: #f1f5f9;
  border-color: #e2e8f0;
}

.host-listing-init-option--complex .host-listing-init-option-icon {
  color: #475569;
  background: #f1f5f9;
  border-color: #e2e8f0;
}



/* single/complex icons: see unified neutral icon block above */

html:not(.dark) .host-listing-init-page .host-listing-init-option--disabled {
  background: #f8fafc;
  border-color: #e2e8f0;
  opacity: 1;
}

html:not(.dark) .host-listing-init-page .host-listing-init-option--disabled .host-listing-init-option-label {
  color: #64748b;
}

html:not(.dark) .host-listing-init-page .host-listing-init-option--disabled .host-listing-init-option-copy {
  color: #94a3b8;
}

html:not(.dark) .host-listing-init-page .host-listing-init-unavailable-chip {
  color: #64748b;
  background: #f1f5f9;
  border-color: #e2e8f0;
}

html.dark .host-listing-init-page .host-listing-init-option--disabled {
  background: rgba(15, 23, 42, 0.42);
  border-color: rgba(148, 163, 184, 0.18);
}

html.dark .host-listing-init-page .host-listing-init-unavailable-chip {
  color: #94a3b8;
  background: rgba(148, 163, 184, 0.1);
  border-color: rgba(148, 163, 184, 0.2);
}

html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-option--disabled {
  background: #f8fafc;
  border-color: #e2e8f0;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-option--disabled {
  background: #0f172a;
  border-color: #334155;
}

html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-option--disabled:hover,
html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-option--disabled:focus-within,
html.dark body.host-listing-init-mode--portal .host-listing-init-option--disabled:hover,
html.dark body.host-listing-init-mode--portal .host-listing-init-option--disabled:focus-within {
  border-color: inherit;
  background: inherit;
  box-shadow: none;
}

/* Returning hosts: portal shell (matches listings/properties chrome) */
html:not(.dark):has(body.host-listing-init-mode--portal),
html:not(.dark) body.host-landing-body.host-listing-init-mode--portal,
html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-page {
  background:
    radial-gradient(ellipse 70% 45% at 12% -10%, rgba(15, 90, 86, 0.06), transparent 55%),
    #f4f6f8;
  background-attachment: scroll;
}

html.dark:has(body.host-listing-init-mode--portal),
html.dark body.host-landing-body.host-listing-init-mode--portal,
html.dark body.host-listing-init-mode--portal .host-listing-init-page {
  background: #0f172a;
  background-attachment: scroll;
}

body.host-listing-init-mode--portal .host-listing-init-page {
  min-height: auto;
  overflow: visible;
}

body.host-listing-init-mode--portal .host-listing-init-hero {
  min-height: auto;
  align-items: flex-start;
  justify-content: flex-start;
  padding-top: 0.5rem;
  padding-bottom: 2rem;
}

body.host-listing-init-mode--portal .host-listing-init-layout {
  max-width: 42rem;
}

body.host-listing-init-mode--portal .host-listing-init-page-header {
  color: inherit;
  gap: 0.65rem;
}

body.host-listing-init-mode--portal .host-listing-init-back-link {
  color: #475569;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-back-link {
  color: #94a3b8;
}

body.host-listing-init-mode--portal .host-listing-init-back-link:hover,
body.host-listing-init-mode--portal .host-listing-init-back-link:focus-visible {
  color: #0f172a;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-back-link:hover,
html.dark body.host-listing-init-mode--portal .host-listing-init-back-link:focus-visible {
  color: #f8fafc;
}

/* Desktop/tablet: breadcrumb is the exit path; hide the duplicate back link. */
@media (min-width: 768px) {
  body.host-listing-init-mode--portal .host-listing-init-back-link--listings {
    display: none;
  }
}

/* Phone: brand bar is chrome; one white card carries all content */
@media (max-width: 767px) {
  body.host-listing-init-mode--portal .host-listing-init-portal-wrap {
    padding-top: 0.15rem;
    padding-bottom: 0.5rem;
  }

  body.host-listing-init-mode--portal .host-listing-init-portal-breadcrumb {
    display: none;
  }

  body.host-listing-init-mode--portal .host-listing-init-hero {
    padding-top: 0.15rem;
    padding-bottom: 1.1rem;
  }

  body.host-listing-init-mode--portal .host-listing-init-title {
    /* Brand bar already says Add listing — keep lead, drop duplicate H1 */
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  body.host-listing-init-mode--portal .host-listing-init-card-head {
    margin-bottom: 0.85rem;
    padding-bottom: 0.75rem;
  }

  body.host-listing-init-mode--portal .host-listing-init-lead {
    margin-top: 0;
    font-size: 0.9rem;
  }

  body.host-listing-init-mode--portal .host-listing-init-kicker {
    display: none;
  }
}

body.host-listing-init-mode--portal .host-listing-init-title {
  font-size: clamp(1.45rem, 3.2vw, 1.75rem);
  font-weight: 800;
  line-height: 1.2;
}

html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-title,
html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-lead {
  color: #0f172a;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-title {
  color: #f8fafc;
}

html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-lead {
  color: #475569;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-lead {
  color: #94a3b8;
}

body.host-listing-init-mode--portal .host-listing-init-panel {
  border-radius: 0.75rem;
  backdrop-filter: none;
}

html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-panel {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

html.dark body.host-listing-init-mode--portal .host-listing-init-panel {
  background: #1e293b;
  border: 1px solid #334155;
  box-shadow: none;
}

html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-option {
  background: #ffffff;
  color: #0f172a;
  border-color: #e2e8f0;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-option {
  background: #0f172a;
  color: #f8fafc;
  border-color: #334155;
}

html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-option:hover,
html:not(.dark) body.host-listing-init-mode--portal .host-listing-init-option:focus-within {
  border-color: #c7d2fe;
  background: #f8fafc;
  box-shadow: 0 4px 12px -8px rgba(99, 102, 241, 0.25);
}

html.dark body.host-listing-init-mode--portal .host-listing-init-option:hover,
html.dark body.host-listing-init-mode--portal .host-listing-init-option:focus-within {
  border-color: #6366f1;
  background: #1e293b;
}

body.host-listing-init-mode--portal .host-listing-init-panel-intro p {
  color: #475569;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-panel-intro p {
  color: #94a3b8;
}

body.host-listing-init-mode--portal .host-listing-init-panel-intro h2 {
  color: inherit;
}

body.host-listing-init-mode--portal .host-listing-init-cta-hint {
  color: #64748b;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-cta-hint {
  color: #94a3b8;
}

/* Portal shares the same subdued CTA treatment */
body.host-listing-init-mode--portal .host-listing-init-cta {
  color: #fff !important;
  background: #334155 !important;
  border-color: #1e293b !important;
}

html.dark body.host-listing-init-mode--portal .host-listing-init-cta {
  color: #0f172a !important;
  background: #e2e8f0 !important;
  border-color: #cbd5e1 !important;
}

@media (max-width: 1023px) {
  body.host-listing-init-mode--portal .host-listing-init-page-header {
    align-items: flex-start;
    text-align: left;
  }
}

/* Host landing: operational scroll motion (paired with hostScrollReveal.js) */
html:has(body.host-landing-body) {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html:has(body.host-landing-body) {
    scroll-behavior: auto;
  }
}

body.host-landing-body .host-motion {
  opacity: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: opacity, transform;
  transition:
    opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    -webkit-transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--host-motion-delay, 0ms);
}

body.host-landing-body .host-motion.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  -webkit-transform: translate3d(0, 0, 0) scale(1);
  will-change: auto;
}

body.host-landing-body .host-motion--hero-left {
  transform: translate3d(-0.55rem, 0, 0);
}

body.host-landing-body .host-motion--hero-right {
  transform: translate3d(0.65rem, 0, 0);
}

body.host-landing-body .host-motion--metric {
  transform: translate3d(-0.4rem, 0, 0);
}

body.host-landing-body .host-motion--intro-split {
  transform: translate3d(0, 0.45rem, 0);
}

body.host-landing-body .host-motion--intro-center {
  transform: translate3d(0, 0.5rem, 0);
}

body.host-landing-body .host-motion--contrast {
  transform: translate3d(0, 0.55rem, 0);
}

body.host-landing-body .host-motion--panel {
  transform: translate3d(0, 0.5rem, 0);
}

body.host-landing-body .host-motion--panel .host-panel-card__list li {
  opacity: 0;
  transform: translate3d(-0.55rem, 0, 0);
  transition:
    opacity 0.42s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}

body.host-landing-body .host-motion--panel.is-visible .host-panel-card__list li {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

body.host-landing-body .host-motion--panel.is-visible .host-panel-card__list li:nth-child(1) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 120ms);
}

body.host-landing-body .host-motion--panel.is-visible .host-panel-card__list li:nth-child(2) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 190ms);
}

body.host-landing-body .host-motion--panel.is-visible .host-panel-card__list li:nth-child(3) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 260ms);
}

body.host-landing-body .host-motion--panel.is-visible .host-panel-card__list li:nth-child(4) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 330ms);
}

body.host-landing-body .host-motion--scenario {
  transform: translate3d(0, 1rem, 0);
}

body.host-landing-body .host-motion--scenario .host-scenario-steps--swiftspot li {
  opacity: 0;
  transform: translate3d(0.65rem, 0, 0);
  transition:
    opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li:nth-child(1) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 160ms);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li:nth-child(2) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 220ms);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li:nth-child(3) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 280ms);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li:nth-child(4) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 340ms);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li:nth-child(5) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 400ms);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li:nth-child(6) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 460ms);
}

body.host-landing-body .host-motion--scenario.is-visible .host-scenario-steps--swiftspot li:nth-child(7) {
  transition-delay: calc(var(--host-motion-delay, 0ms) + 520ms);
}

body.host-landing-body .host-motion--trust-left {
  transform: translate3d(-1.25rem, 0, 0);
}

body.host-landing-body .host-motion--trust-right {
  transform: translate3d(1.35rem, 0, 0);
}

body.host-landing-body .host-motion--trust-right .host-payout-proof__row {
  opacity: 0;
  transform: translate3d(0.85rem, 0, 0);
  transition:
    opacity 0.45s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

body.host-landing-body .host-motion--trust-right.is-visible .host-payout-proof__row {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

body.host-landing-body .host-motion--trust-right.is-visible .host-payout-proof__row:nth-child(1) {
  transition-delay: 140ms;
}

body.host-landing-body .host-motion--trust-right.is-visible .host-payout-proof__row:nth-child(2) {
  transition-delay: 210ms;
}

body.host-landing-body .host-motion--trust-right.is-visible .host-payout-proof__row:nth-child(3) {
  transition-delay: 280ms;
}

body.host-landing-body .host-motion--trust-right.is-visible .host-payout-proof__row:nth-child(4) {
  transition-delay: 350ms;
}

body.host-landing-body .host-motion--listable {
  transform: translate3d(0, 0.9rem, 0) rotate(-0.35deg);
}

body.host-landing-body .host-motion--listable.is-visible {
  transform: translate3d(0, 0, 0) rotate(0deg);
}

body.host-landing-body .host-motion--chip {
  transform: scale(0.94);
}

body.host-landing-body .host-motion--faq {
  transform: translate3d(0.75rem, 0, 0);
}

body.host-landing-body .host-motion--cta {
  transform: translate3d(0, 1rem, 0) scale(0.98);
}

@media (prefers-reduced-motion: reduce) {
  body.host-landing-body .host-motion,
  body.host-landing-body .host-motion--panel .host-panel-card__list li,
  body.host-landing-body .host-motion--scenario .host-scenario-steps--swiftspot li,
  body.host-landing-body .host-motion--trust-right .host-payout-proof__row {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }

  body.host-landing-body .host-landing-orb {
    transform: none !important;
  }
}

/* Capacity-first host marketing (2026) — booking model over fee receipt */

.host-capacity-preview {
  position: relative;
  overflow: hidden;
  max-width: 34rem;
  justify-self: end;
  border-radius: 1.35rem;
  padding: clamp(1.1rem, 2.25vw, 1.55rem);
}

.host-capacity-preview::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at top right, rgb(99 102 241 / 0.18), transparent 36%),
    radial-gradient(circle at bottom left, rgb(148 163 184 / 0.18), transparent 40%);
}

.host-capacity-preview > * {
  position: relative;
  z-index: 1;
}

html:not(.dark) .host-capacity-preview {
  background: linear-gradient(145deg, rgb(255 255 255 / 0.96), rgb(238 242 255 / 0.86));
  border: 1px solid rgb(99 102 241 / 0.18);
  box-shadow:
    0 28px 70px -28px rgb(67 56 202 / 0.28),
    inset 0 1px 0 rgb(255 255 255 / 0.8);
}

html.dark .host-capacity-preview {
  background: linear-gradient(145deg, rgb(15 23 42 / 0.96), rgb(30 27 75 / 0.72));
  border: 1px solid rgb(129 140 248 / 0.24);
  box-shadow: 0 28px 70px -32px rgb(0 0 0 / 0.65);
}

.host-capacity-preview__header span {
  display: block;
  font-size: var(--type-badge-size, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  letter-spacing: var(--letter-spacing-label, 0.04em);
  text-transform: uppercase;
  color: #64748b;
}

html.dark .host-capacity-preview__header span {
  color: #94a3b8;
}

.host-capacity-preview__header strong {
  display: block;
  margin-top: 0.3rem;
  font-size: 1.15rem;
  font-weight: var(--font-weight-bold, 700);
  color: #0f172a;
}

html.dark .host-capacity-preview__header strong {
  color: #f8fafc;
}

.host-capacity-preview__modes {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.host-capacity-preview__modes li {
  border-radius: 0.95rem;
  padding: 0.75rem 0.85rem;
}

html:not(.dark) .host-capacity-preview__modes li {
  background: rgb(255 255 255 / 0.78);
  border: 1px solid rgb(226 232 240 / 0.92);
}

html.dark .host-capacity-preview__modes li {
  background: rgb(15 23 42 / 0.56);
  border: 1px solid rgb(51 65 85 / 0.86);
}

.host-capacity-preview__modes strong {
  display: block;
  font-size: 0.95rem;
  font-weight: 700;
  color: #1e293b;
}

html.dark .host-capacity-preview__modes strong {
  color: #f1f5f9;
}

.host-capacity-preview__modes span {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.84rem;
  line-height: 1.45;
  color: #64748b;
}

html.dark .host-capacity-preview__modes span {
  color: #94a3b8;
}

.host-capacity-preview__foot {
  margin-top: 0.85rem;
  font-size: 0.82rem;
  line-height: 1.5;
  color: #64748b;
}

html.dark .host-capacity-preview__foot {
  color: #94a3b8;
}

.host-capacity-modes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.9rem;
  margin-top: 1.5rem;
}

.host-capacity-mode-card {
  border-radius: 1.15rem;
  padding: 1.15rem 1.2rem 1.25rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.host-capacity-mode-card:hover {
  transform: translateY(-2px);
}

html:not(.dark) .host-capacity-mode-card {
  background: rgb(255 255 255 / 0.94);
  border: 1px solid rgb(226 232 240 / 0.95);
  box-shadow: 0 18px 42px -28px rgb(15 23 42 / 0.3);
}

html.dark .host-capacity-mode-card {
  background: rgb(30 41 59 / 0.78);
  border: 1px solid rgb(71 85 105 / 0.72);
  box-shadow: 0 18px 42px -30px rgb(0 0 0 / 0.7);
}

.host-capacity-mode-card__index {
  margin: 0 0 0.55rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #6366f1;
}

html.dark .host-capacity-mode-card__index {
  color: #a5b4fc;
}

.host-capacity-mode-card h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
}

html.dark .host-capacity-mode-card h3 {
  color: #f8fafc;
}

.host-capacity-mode-card p {
  margin: 0.45rem 0 0;
  font-size: 0.92rem;
  line-height: 1.5;
  color: #64748b;
}

html.dark .host-capacity-mode-card p {
  color: #cbd5e1;
}

.host-booking-flow {
  list-style: none;
  margin: 1.35rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.host-booking-flow__step {
  border-radius: 1rem;
  padding: 0.95rem 1rem;
}

html:not(.dark) .host-booking-flow__step {
  background: linear-gradient(180deg, #ffffff, #f7f5f1);
  border: 1px solid rgb(226 232 240 / 0.95);
}

html.dark .host-booking-flow__step {
  background: linear-gradient(180deg, rgb(15 23 42 / 0.9), rgb(11 17 32 / 0.85));
  border: 1px solid rgb(71 85 105 / 0.75);
}

.host-booking-flow__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #b45309;
}

html.dark .host-booking-flow__label {
  color: #fcd34d;
}

.host-booking-flow__step strong {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.4;
  color: #1e293b;
}

html.dark .host-booking-flow__step strong {
  color: #e2e8f0;
}

.host-payout-proof--quiet {
  padding: 1.15rem 1.2rem;
}

html:not(.dark) .host-payout-proof--quiet {
  background: rgb(248 250 252 / 0.92);
  border: 1px solid rgb(226 232 240);
  box-shadow: none;
}

html.dark .host-payout-proof--quiet {
  background: rgb(15 23 42 / 0.62);
  border: 1px solid rgb(51 65 85 / 0.9);
  box-shadow: none;
}

.host-payout-proof--quiet .host-payout-proof__label {
  margin: 0 0 0.55rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
}

html.dark .host-payout-proof--quiet .host-payout-proof__label {
  color: #94a3b8;
}

.host-payout-proof__keep-line {
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.45;
  color: #1e293b;
}

html.dark .host-payout-proof__keep-line {
  color: #e2e8f0;
}

.host-payout-proof__keep-line strong {
  font-weight: 700;
  color: #312e81;
}

html.dark .host-payout-proof__keep-line strong {
  color: #c7d2fe;
}

.host-payout-proof__sample {
  margin: 0.75rem 0 0;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #475569;
}

html.dark .host-payout-proof__sample {
  color: #94a3b8;
}

.host-payout-proof__sample strong {
  font-weight: 700;
  color: #0f172a;
}

html.dark .host-payout-proof__sample strong {
  color: #f8fafc;
}

.host-payout-proof__sample span {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.8rem;
  color: #64748b;
}

html.dark .host-payout-proof__sample span {
  color: #94a3b8;
}

.host-calculator-results__details--quiet {
  margin-top: 0.55rem;
}

.host-landing-final-cta {
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.host-landing-final-cta--primary {
  color: #312e81;
  background: #fff;
  border: 1px solid rgb(224 231 255);
  box-shadow: 0 14px 28px -18px rgb(15 23 42 / 0.45);
}

.host-landing-final-cta--primary:hover {
  background: #eef2ff;
}

.host-landing-final-cta--secondary {
  color: #fff;
  background: rgb(255 255 255 / 0.12);
  border: 2px solid rgb(255 255 255 / 0.38);
}

.host-landing-final-cta--secondary:hover {
  background: rgb(255 255 255 / 0.2);
}

body.host-landing-body .host-motion--capacity,
body.host-landing-body .host-motion--flow {
  opacity: 0;
  transform: translate3d(0, 0.75rem, 0);
  transition:
    opacity 0.45s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--host-motion-delay, 0ms);
}

body.host-landing-body .host-motion--capacity.is-visible,
body.host-landing-body .host-motion--flow.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (max-width: 900px) {
  .host-capacity-modes,
  .host-booking-flow {
    grid-template-columns: 1fr;
  }

  .host-capacity-preview {
    justify-self: stretch;
    max-width: none;
  }
}

@media (max-width: 1023px) {
  .host-landing-hero .host-capacity-preview {
    max-width: 36rem;
    margin-inline: auto;
  }
}

/* Custom grid layout — coming soon marketing demo */

.host-custom-grid-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 1.35rem;
  align-items: start;
}

.host-custom-grid-copy__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.host-custom-grid-badge {
  flex-shrink: 0;
  border-radius: 999px;
  padding: 0.35rem 0.7rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

html:not(.dark) .host-custom-grid-badge {
  background: rgb(238 242 255);
  border: 1px solid rgb(165 180 252 / 0.55);
  color: #4338ca;
}

html.dark .host-custom-grid-badge {
  background: rgb(30 27 75 / 0.72);
  border: 1px solid rgb(129 140 248 / 0.35);
  color: #c7d2fe;
}

.host-custom-grid-tools {
  list-style: none;
  margin: 1.1rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.host-custom-grid-tools li {
  border-radius: 0.95rem;
  padding: 0.75rem 0.85rem;
}

html:not(.dark) .host-custom-grid-tools li {
  background: rgb(255 255 255 / 0.78);
  border: 1px solid rgb(226 232 240 / 0.92);
}

html.dark .host-custom-grid-tools li {
  background: rgb(15 23 42 / 0.56);
  border: 1px solid rgb(51 65 85 / 0.86);
}

.host-custom-grid-tools strong {
  display: block;
  font-size: 0.92rem;
  font-weight: 700;
  color: #0f172a;
}

html.dark .host-custom-grid-tools strong {
  color: #f8fafc;
}

.host-custom-grid-tools span {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.84rem;
  line-height: 1.45;
  color: #64748b;
}

html.dark .host-custom-grid-tools span {
  color: #94a3b8;
}

.host-custom-grid-footnote {
  margin: 0.85rem 0 0;
  font-size: 0.82rem;
  line-height: 1.5;
  color: #64748b;
}

html.dark .host-custom-grid-footnote {
  color: #94a3b8;
}

.host-layout-demo {
  border-radius: 1.2rem;
  padding: 1rem;
}

html:not(.dark) .host-layout-demo {
  background: linear-gradient(145deg, rgb(255 255 255 / 0.96), rgb(241 245 249 / 0.92));
  border: 1px solid rgb(203 213 225 / 0.9);
  box-shadow: 0 22px 48px -30px rgb(15 23 42 / 0.35);
}

html.dark .host-layout-demo {
  background: linear-gradient(145deg, rgb(15 23 42 / 0.94), rgb(30 41 59 / 0.78));
  border: 1px solid rgb(71 85 105 / 0.72);
  box-shadow: 0 22px 48px -32px rgb(0 0 0 / 0.65);
}

.host-layout-demo__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
}

.host-layout-demo__tool {
  border-radius: 999px;
  padding: 0.28rem 0.62rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

html:not(.dark) .host-layout-demo__tool {
  background: rgb(248 250 252);
  border: 1px solid rgb(226 232 240);
  color: #64748b;
}

html.dark .host-layout-demo__tool {
  background: rgb(15 23 42 / 0.62);
  border: 1px solid rgb(51 65 85 / 0.86);
  color: #94a3b8;
}

html:not(.dark) .host-layout-demo__tool--active,
html.dark .host-layout-demo__tool--active {
  background: rgb(79 70 229);
  border-color: rgb(99 102 241);
  color: #fff;
}

.host-layout-demo__map {
  border-radius: 0.95rem;
  padding: 0.65rem;
  background:
    linear-gradient(90deg, rgb(148 163 184 / 0.12) 1px, transparent 1px),
    linear-gradient(rgb(148 163 184 / 0.12) 1px, transparent 1px),
    linear-gradient(180deg, rgb(226 232 240 / 0.55), rgb(241 245 249 / 0.35));
  background-size: 18px 18px, 18px 18px, auto;
}

html.dark .host-layout-demo__map {
  background:
    linear-gradient(90deg, rgb(71 85 105 / 0.35) 1px, transparent 1px),
    linear-gradient(rgb(71 85 105 / 0.35) 1px, transparent 1px),
    linear-gradient(180deg, rgb(30 41 59 / 0.9), rgb(15 23 42 / 0.75));
  background-size: 18px 18px, 18px 18px, auto;
}

.host-layout-demo__footprint {
  position: relative;
  min-height: 13.5rem;
  border-radius: 0.75rem;
  padding: 0.55rem;
  border: 2px solid rgb(99 102 241 / 0.55);
  background: rgb(255 255 255 / 0.72);
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

html.dark .host-layout-demo__footprint {
  background: rgb(15 23 42 / 0.72);
  border-color: rgb(129 140 248 / 0.45);
}

.host-layout-demo__section {
  display: grid;
  gap: 0.35rem;
  border-radius: 0.55rem;
  padding: 0.45rem;
  border: 1px dashed rgb(148 163 184 / 0.65);
}

.host-layout-demo__section--north {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.host-layout-demo__section--west {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  flex: 1;
}

.host-layout-demo__south {
  display: grid;
  grid-template-columns: 1.1fr 2px 0.9fr;
  gap: 0.45rem;
  align-items: stretch;
  flex: 1;
}

.host-layout-demo__cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  border-radius: 0.45rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: rgb(99 102 241 / 0.14);
  border: 1px solid rgb(99 102 241 / 0.28);
  color: #312e81;
}

html.dark .host-layout-demo__cell {
  background: rgb(99 102 241 / 0.22);
  border-color: rgb(129 140 248 / 0.35);
  color: #e0e7ff;
}

.host-layout-demo__divider {
  background: rgb(79 70 229 / 0.75);
  border-radius: 999px;
}

.host-layout-demo__divider--horizontal {
  height: 2px;
  width: 100%;
}

.host-layout-demo__divider--vertical {
  width: 2px;
  min-height: 100%;
  justify-self: center;
}

.host-layout-demo__lasso {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 5.5rem;
  border-radius: 42% 58% 52% 48% / 48% 42% 58% 52%;
  background: rgb(16 185 129 / 0.16);
  border: 2px solid rgb(16 185 129 / 0.45);
  color: #065f46;
  font-size: 0.82rem;
  font-weight: 700;
}

html.dark .host-layout-demo__lasso {
  background: rgb(16 185 129 / 0.18);
  border-color: rgb(52 211 153 / 0.45);
  color: #a7f3d0;
}

.host-layout-demo__caption {
  margin: 0.7rem 0 0;
  font-size: 0.75rem;
  line-height: 1.45;
  color: #64748b;
}

html.dark .host-layout-demo__caption {
  color: #94a3b8;
}

body.host-landing-body .host-motion--grid-demo {
  opacity: 0;
  transform: translate3d(0.65rem, 0, 0);
  transition:
    opacity 0.45s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--host-motion-delay, 0ms);
}

body.host-landing-body .host-motion--grid-demo.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (max-width: 900px) {
  .host-custom-grid-panel {
    grid-template-columns: 1fr;
  }
}

/* Light mode polish — section rhythm, cards, atmosphere (operator host landing) */
html:not(.dark) .host-landing-orb {
  mix-blend-mode: multiply;
  opacity: 0.26;
}

html:not(.dark) .host-landing-orb--accent {
  opacity: 0.2;
}

html.dark .host-landing-orb--accent {
  opacity: 0.12;
}

html:not(.dark) .host-booking-control-section,
html:not(.dark) .host-problem-section {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.82),
    rgba(238, 241, 244, 0.55)
  );
  border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}

html:not(.dark) .host-custom-grid-section,
html:not(.dark) .host-trust-payout-section {
  background: rgba(255, 255, 255, 0.55);
  border-bottom-color: rgba(180, 83, 9, 0.1) !important;
}

html:not(.dark) .host-automation-section {
  background: linear-gradient(
    180deg,
    rgba(243, 241, 236, 0.55),
    rgba(255, 255, 255, 0.72)
  );
  border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}

html:not(.dark) .host-capacity-mode-card {
  background: linear-gradient(155deg, rgb(255 255 255 / 0.98), rgb(247 245 241 / 0.88));
  border: 1px solid rgb(226 232 240 / 0.95);
  box-shadow: 0 16px 40px -26px rgb(15 23 42 / 0.16);
}

html:not(.dark) .host-capacity-mode-card:hover {
  border-color: rgb(180 83 9 / 0.28);
  box-shadow: 0 22px 48px -24px rgb(15 23 42 / 0.2);
}

html:not(.dark) .host-capacity-preview__modes li {
  background: rgb(255 255 255 / 0.92);
  border: 1px solid rgb(226 232 240 / 0.9);
}

html:not(.dark) .host-contrast-card {
  background: linear-gradient(160deg, rgb(255 255 255 / 0.97), rgb(247 245 241 / 0.9));
  border-color: rgb(226 232 240 / 0.95);
  box-shadow: 0 16px 42px -28px rgb(15 23 42 / 0.16);
}

html:not(.dark) .host-contrast-card__split > div:first-child {
  border-color: rgb(254 202 202 / 0.75) !important;
  background: rgb(254 242 242 / 0.65) !important;
}

html:not(.dark) .host-contrast-card__split > div:last-child {
  border-color: rgb(187 247 208 / 0.8) !important;
  background: rgb(240 253 244 / 0.72) !important;
}

html:not(.dark) .host-panel-card {
  background: linear-gradient(160deg, rgb(255 255 255 / 0.98), rgb(248 250 252 / 0.9));
  border-color: rgb(226 232 240 / 0.95);
  box-shadow: 0 14px 38px -26px rgb(15 23 42 / 0.18);
}

html:not(.dark) .host-panel-card--accent {
  background: linear-gradient(
    155deg,
    rgb(238 242 255 / 0.95) 0%,
    rgb(224 231 255 / 0.82) 55%,
    rgb(255 255 255 / 0.96) 100%
  );
  border-color: rgb(129 140 248 / 0.45);
  box-shadow: 0 18px 44px -26px rgb(79 70 229 / 0.28);
}

html:not(.dark) .host-panel-card__list li::before {
  background: #6366f1;
}

html:not(.dark) .host-custom-grid-tools li {
  background: rgb(255 255 255 / 0.9);
  border: 1px solid rgb(199 210 254 / 0.55);
}

/* Host landing polish — structure + motion (exclude listing initiation) */

@keyframes host-capacity-preview-float {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(0, -0.2rem, 0);
  }
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-copy .mt-5 {
  margin-top: 1.15rem !important;
  gap: 0.65rem !important;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-free-note {
  margin-top: 0.45rem !important;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support,
body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem 1.25rem;
  margin-top: 1.15rem !important;
  padding-top: 0.95rem;
  max-width: 34rem;
  border-top: 1px solid rgb(199 210 254 / 0.48);
  background: transparent;
}

html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support,
html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes {
  border-top-color: rgb(71 85 105 / 0.55);
}

@media (min-width: 1024px) {
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support,
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes {
    justify-content: flex-start;
  }
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support li,
body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes li {
  flex: 1 1 8.25rem;
  max-width: 11rem;
  padding: 0.1rem 0.2rem !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: inherit;
}

html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support span,
html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes span {
  color: #6366f1;
  font-size: 0.6rem;
  font-weight: 800;
}

html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support strong,
html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes strong,
html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes li strong {
  margin-top: 0.12rem;
  color: #475569;
  font-size: 0.8rem !important;
  font-weight: 600;
}

html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support strong,
html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes strong,
html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes li strong {
  margin-top: 0.12rem;
  color: #cbd5e1;
  font-size: 0.8rem !important;
  font-weight: 600;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-layout {
  align-items: start;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-showcase {
  max-width: 32rem;
  padding-block: 0.55rem;
  align-self: start;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-capacity-preview {
  max-width: 36rem;
  width: 100%;
}

@media (max-width: 640px) {
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--support li,
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes li {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  /* Idle float felt gamey — keep capacity preview still after scroll-in */
  body.host-landing-body:not(.host-listing-init-mode) .host-motion--hero-right.is-visible .host-capacity-preview--float {
    animation: none;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-capacity-preview__modes li {
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-listable-grid .host-panel-card--listable {
    transition: transform 0.22s ease, box-shadow 0.22s ease;
  }

  @media (hover: hover) and (pointer: fine) {
    body.host-landing-body:not(.host-listing-init-mode) .host-capacity-preview__modes li:hover {
      transform: translateY(-1px);
    }

    html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-capacity-preview__modes li:hover {
      border-color: rgb(129 140 248 / 0.55);
      box-shadow: 0 10px 24px -18px rgb(79 70 229 / 0.35);
    }

    body.host-landing-body:not(.host-listing-init-mode) .host-capacity-mode-card.host-motion.is-visible:hover,
    body.host-landing-body:not(.host-listing-init-mode) .host-capacity-mode-card:hover {
      transform: translateY(-3px);
    }

    html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-capacity-mode-card:hover {
      box-shadow: 0 24px 48px -22px rgb(79 70 229 / 0.38);
    }

    body.host-landing-body:not(.host-listing-init-mode) .host-listable-grid .host-panel-card--listable.host-motion.is-visible:hover,
    body.host-landing-body:not(.host-listing-init-mode) .host-listable-grid .host-panel-card--listable:hover {
      transform: translateY(-2px);
    }

    html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-listable-grid .host-panel-card--listable:hover {
      box-shadow: 0 20px 44px -24px rgb(15 23 42 / 0.28);
    }
  }

  /* Touch: no idle float — keep cards still after scroll-in */
  @media (hover: none), (pointer: coarse) {
    body.host-landing-body:not(.host-listing-init-mode) .host-capacity-mode-card.host-motion.is-visible,
    body.host-landing-body:not(.host-listing-init-mode) .host-listable-grid .host-panel-card--listable.host-motion.is-visible {
      animation: none;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  body.host-landing-body:not(.host-listing-init-mode) .host-capacity-preview--float,
  body.host-landing-body:not(.host-listing-init-mode) .host-capacity-mode-card,
  body.host-landing-body:not(.host-listing-init-mode) .host-listable-grid .host-panel-card--listable {
    animation: none !important;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-capacity-preview__modes li,
  body.host-landing-body:not(.host-listing-init-mode) .host-listable-grid .host-panel-card--listable {
    transition: none !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Instant Book process scene (hero) + compact side-deal contrast rows        */
/* -------------------------------------------------------------------------- */

@keyframes host-ib-stamp-press {
  0% {
    box-shadow: 0 12px 20px -10px rgba(180, 83, 9, 0);
  }
  42% {
    box-shadow: 0 10px 18px -6px rgba(180, 83, 9, 0.34);
  }
  100% {
    box-shadow: 0 2px 6px -2px rgba(180, 83, 9, 0.16);
  }
}

@keyframes host-ib-stamp-press-dark {
  0% {
    box-shadow: 0 12px 20px -10px rgba(252, 211, 77, 0);
  }
  42% {
    box-shadow: 0 10px 20px -6px rgba(252, 211, 77, 0.28);
  }
  100% {
    box-shadow: 0 2px 8px -2px rgba(252, 211, 77, 0.14);
  }
}

.host-ib-scene {
  position: relative;
  border-radius: 1.2rem;
  padding: 1.1rem 1.15rem 1.15rem;
  overflow: hidden;
  contain: layout;
}

html:not(.dark) .host-ib-scene {
  border: 1px solid rgba(15, 23, 42, 0.1);
  background:
    linear-gradient(165deg, #ffffff 0%, #f7f5f1 55%, #f3f1ec 100%);
  box-shadow: 0 24px 50px -32px rgba(15, 23, 42, 0.28);
}

html.dark .host-ib-scene {
  border: 1px solid rgba(148, 163, 184, 0.22);
  background:
    linear-gradient(165deg, rgba(11, 17, 32, 0.96), rgba(15, 23, 42, 0.9));
  box-shadow: 0 28px 56px -34px rgba(0, 0, 0, 0.7);
}

.host-ib-scene__header {
  margin-bottom: 0.95rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}

.host-ib-scene__header span {
  display: block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #b45309;
}

html.dark .host-ib-scene__header span {
  color: #fcd34d;
}

.host-ib-scene__header strong {
  display: block;
  margin-top: 0.28rem;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.3;
  color: #0f172a;
}

html.dark .host-ib-scene__header strong {
  color: #f8fafc;
}

.host-ib-scene__stage {
  --host-ib-stage-bg: rgba(247, 245, 241, 0.92);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 1.15rem;
  align-items: stretch;
  /* Fixed stage size — beat changes must never reflow the hero. */
  height: 12.5rem;
  min-height: 12.5rem;
  padding: 0.85rem 0.75rem 0.7rem;
  border-radius: 0.95rem;
  overflow: hidden;
}

html:not(.dark) .host-ib-scene__stage {
  background: rgba(247, 245, 241, 0.72);
  border: 1px solid rgba(15, 23, 42, 0.08);
}

html.dark .host-ib-scene__stage {
  --host-ib-stage-bg: rgba(8, 12, 20, 0.92);
  background: rgba(8, 12, 20, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.16);
}

.host-ib-scene__route {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

.host-ib-scene__route path {
  stroke: #b45309;
  stroke-width: 1.15;
  stroke-linecap: round;
  fill: none;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  opacity: 0;
  transition:
    stroke-dashoffset 0.8s cubic-bezier(0.45, 0.08, 0.15, 1),
    opacity 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

html.dark .host-ib-scene__route path {
  stroke: #fcd34d;
}

.host-ib-scene[data-beat="1"] .host-ib-scene__route path {
  stroke-dashoffset: 78;
  opacity: 0.42;
}

.host-ib-scene[data-beat="2"] .host-ib-scene__route path {
  stroke-dashoffset: 32;
  opacity: 0.55;
}

.host-ib-scene[data-beat="3"] .host-ib-scene__route path {
  stroke-dashoffset: 0;
  opacity: 0.38;
}

.host-ib-scene[data-beat="4"] .host-ib-scene__route path {
  stroke-dashoffset: 0;
  opacity: 0.16;
}

.host-ib-scene__thread,
.host-ib-scene__slip {
  position: relative;
  z-index: 1;
  min-height: 0;
}

.host-ib-scene__thread {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.host-ib-scene__place,
.host-ib-scene__slip-kicker,
.host-ib-scene__portal,
.host-ib-scene__slip-dates,
.host-ib-scene__stamp,
.host-ib-scene__bubble {
  margin: 0;
}

.host-ib-scene__place {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 0.55rem;
}

html.dark .host-ib-scene__place {
  color: #94a3b8;
}

.host-ib-scene__bubble {
  max-width: 13.5rem;
  padding: 0.55rem 0.7rem;
  border-radius: 0.85rem;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.35;
  color: #0f172a;
}

html:not(.dark) .host-ib-scene__bubble--ask {
  background: #e7e2d8;
}

html.dark .host-ib-scene__bubble--ask {
  background: #1c2638;
  color: #e2e8f0;
}

.host-ib-scene__bubble--reply {
  margin: 0.4rem 0 0 1.35rem;
}

html:not(.dark) .host-ib-scene__bubble--reply {
  background: #fffcf7;
  border: 1px solid rgba(15, 23, 42, 0.1);
}

html.dark .host-ib-scene__bubble--reply {
  background: #161d2e;
  border: 1px solid rgba(148, 163, 184, 0.22);
  color: #f1f5f9;
}

.host-ib-scene__rail {
  position: absolute;
  z-index: 2;
  left: 16%;
  right: 7%;
  top: 44%;
  height: 2.5rem;
  container-type: inline-size;
  pointer-events: none;
}

.host-ib-scene__ticket {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  height: 2.5rem;
  padding: 0 0.75rem 0 0.55rem;
  border-radius: 0.65rem;
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
  color: #0f172a;
  background: #fff6e4;
  border: 1.5px solid #b45309;
  box-shadow: 0 10px 24px -16px rgba(15, 23, 42, 0.45);
  transform: translate3d(0, 0.2rem, 0) scale(0.96);
  opacity: 0;
  transition:
    transform 0.8s cubic-bezier(0.45, 0.08, 0.15, 1),
    opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform, opacity;
}

.host-ib-scene__ticket::before,
.host-ib-scene__ticket::after {
  content: "";
  position: absolute;
  left: 0.7rem;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--host-ib-stage-bg);
  pointer-events: none;
}

.host-ib-scene__ticket::before {
  top: -0.28rem;
}

.host-ib-scene__ticket::after {
  bottom: -0.28rem;
}

html.dark .host-ib-scene__ticket {
  color: #f8fafc;
  background: #3a2a10;
  border-color: #fcd34d;
  box-shadow: 0 12px 28px -16px rgba(0, 0, 0, 0.7);
}

.host-ib-scene[data-beat="1"] .host-ib-scene__ticket {
  transform: translate3d(0, -0.42rem, 0) scale(1.06);
  opacity: 1;
  box-shadow: 0 16px 28px -10px rgba(15, 23, 42, 0.38);
}

.host-ib-scene[data-beat="2"] .host-ib-scene__ticket {
  transform: translate3d(calc((100cqi - 100%) * 0.52), -0.85rem, 0) scale(1.04);
  opacity: 1;
  box-shadow: 0 20px 32px -12px rgba(15, 23, 42, 0.4);
}

.host-ib-scene[data-beat="3"] .host-ib-scene__ticket {
  transform: translate3d(calc(100cqi - 100%), 0.04rem, 0) scale(1);
  opacity: 1;
  box-shadow: 0 8px 18px -12px rgba(15, 23, 42, 0.32);
}

.host-ib-scene[data-beat="4"] .host-ib-scene__ticket {
  transform: translate3d(calc(100cqi - 100%), 0.18rem, 0) scale(0.96);
  opacity: 0;
  pointer-events: none;
}

html.dark .host-ib-scene[data-beat="1"] .host-ib-scene__ticket,
html.dark .host-ib-scene[data-beat="2"] .host-ib-scene__ticket {
  box-shadow: 0 18px 32px -10px rgba(0, 0, 0, 0.72);
}

.host-ib-scene__ticket-stub {
  width: 0.42rem;
  align-self: stretch;
  margin: 0.28rem 0;
  border-right: 1.5px dashed #b45309;
}

html.dark .host-ib-scene__ticket-stub {
  border-right-color: #fcd34d;
}

.host-ib-scene__slip {
  justify-self: end;
  align-self: stretch;
  width: min(100%, 14.5rem);
  height: 100%;
  min-height: 0;
  padding: 0.9rem 0.9rem 0.75rem 1rem;
  border-radius: 0.9rem;
  background: #fffcf7;
  border: 1.5px solid #0f172a;
  border-left: 1.5px dashed #b45309;
  box-sizing: border-box;
}

html.dark .host-ib-scene__slip {
  background: #161d2e;
  border-color: #e2e8f0;
  border-left-color: #fcd34d;
}

.host-ib-scene__slip-kicker {
  font-size: 0.72rem;
  font-weight: 600;
  color: #64748b;
}

html.dark .host-ib-scene__slip-kicker {
  color: #94a3b8;
}

.host-ib-scene__slip-dates {
  margin-top: 0.45rem;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #0f172a;
}

html.dark .host-ib-scene__slip-dates {
  color: #f8fafc;
}

.host-ib-scene__stamp {
  position: absolute;
  right: 0.7rem;
  top: 2.65rem;
  padding: 0.18rem 0.45rem;
  border: 1.5px solid #b45309;
  border-radius: 0.35rem;
  color: #b45309;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transform: rotate(-16deg) scale(1.38);
}

html.dark .host-ib-scene__stamp {
  border-color: #fcd34d;
  color: #fcd34d;
}

.host-ib-scene__portal {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 1.1rem;
  padding-top: 0.55rem;
  border-top: 0;
  font-size: 0.78rem;
  font-weight: 700;
  color: #312e81;
}

.host-ib-scene__portal::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: rgba(148, 163, 184, 0.28);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

html.dark .host-ib-scene__portal {
  color: #c7d2fe;
}

html.dark .host-ib-scene__portal::before {
  background: rgba(148, 163, 184, 0.22);
}

.host-ib-scene__portal-mark {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 0.15rem;
  background: currentColor;
  flex-shrink: 0;
}

.host-ib-scene__reveal {
  opacity: 0;
  transform: translate3d(0, 0.28rem, 0);
  transition:
    opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
    clip-path 0.45s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.host-ib-scene__bubble--reply.host-ib-scene__reveal {
  clip-path: inset(0 0 100% 0);
  transform: translate3d(0, 0.18rem, 0);
}

.host-ib-scene__slip-dates.host-ib-scene__reveal {
  clip-path: inset(100% 0 0 0);
  transform: translate3d(0, 0.32rem, 0);
}

.host-ib-scene__stamp.host-ib-scene__reveal {
  transform: rotate(-16deg) scale(1.38);
  transition:
    opacity 0.55s cubic-bezier(0.34, 1.35, 0.64, 1),
    transform 0.55s cubic-bezier(0.34, 1.35, 0.64, 1);
}

.host-ib-scene[data-beat="1"] .host-ib-scene__reveal[data-show="1"],
.host-ib-scene[data-beat="2"] .host-ib-scene__reveal[data-show="1"],
.host-ib-scene[data-beat="3"] .host-ib-scene__reveal[data-show="1"],
.host-ib-scene[data-beat="4"] .host-ib-scene__reveal[data-show="1"],
.host-ib-scene[data-beat="3"] .host-ib-scene__reveal[data-show="3"],
.host-ib-scene[data-beat="4"] .host-ib-scene__reveal[data-show="3"],
.host-ib-scene[data-beat="4"] .host-ib-scene__reveal[data-show="4"]:not(.host-ib-scene__stamp) {
  opacity: 1;
  transform: none;
  clip-path: inset(0);
  pointer-events: auto;
}

.host-ib-scene[data-beat="4"] .host-ib-scene__stamp.host-ib-scene__reveal {
  opacity: 1;
  transform: rotate(-4deg) scale(1);
  pointer-events: auto;
  animation: host-ib-stamp-press 0.55s cubic-bezier(0.34, 1.35, 0.64, 1) both;
}

html.dark .host-ib-scene[data-beat="4"] .host-ib-scene__stamp.host-ib-scene__reveal {
  animation-name: host-ib-stamp-press-dark;
}

.host-ib-scene[data-beat="4"] .host-ib-scene__portal::before {
  transform: scaleX(1);
}

.host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__stamp.host-ib-scene__reveal {
  opacity: 0;
  transform: rotate(-10deg) translate3d(0, -0.45rem, 0) scale(1.08);
  animation: none;
  transition-delay: 0ms;
}

.host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__slip-dates.host-ib-scene__reveal,
.host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__portal.host-ib-scene__reveal {
  opacity: 0;
  transform: translate3d(0, 0.16rem, 0);
  clip-path: inset(0 0 80% 0);
  transition-delay: 90ms;
}

.host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__portal::before {
  transform: scaleX(0);
  transform-origin: right center;
  transition-delay: 90ms;
}

.host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__bubble--reply.host-ib-scene__reveal {
  opacity: 0;
  clip-path: inset(0 0 100% 0);
  transform: translate3d(0, 0.14rem, 0);
  transition-delay: 160ms;
}

.host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__route path {
  opacity: 0;
  stroke-dashoffset: 100;
  transition-delay: 70ms;
}

.host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__ticket {
  opacity: 0;
  transition-delay: 0ms;
}

.host-ib-scene--instant .host-ib-scene__ticket,
.host-ib-scene--instant .host-ib-scene__reveal,
.host-ib-scene--instant .host-ib-scene__route path,
.host-ib-scene--instant .host-ib-scene__portal::before {
  transition: none !important;
  animation: none !important;
}

.host-ib-scene__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  margin-top: 0.85rem;
}

.host-ib-scene__caption {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 500;
  color: #64748b;
}

html.dark .host-ib-scene__caption {
  color: #94a3b8;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-ib-scene {
  max-width: 28rem;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 1024px) {
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-ib-scene {
    margin-left: 0;
    margin-right: 0;
    max-width: none;
  }
}

@media (max-width: 900px) {
  .host-ib-scene__stage {
    grid-template-columns: 1fr;
    gap: 0.75rem;
    height: 16.5rem;
    min-height: 16.5rem;
    padding: 0.75rem 0.7rem 0.65rem;
  }

  .host-ib-scene__rail {
    left: 12%;
    right: 12%;
    top: 46%;
    height: 2.1rem;
  }

  .host-ib-scene__ticket {
    height: 2.1rem;
    font-size: 0.72rem;
    padding: 0 0.62rem 0 0.48rem;
  }

  .host-ib-scene[data-beat="1"] .host-ib-scene__ticket {
    transform: translate3d(0, -0.32rem, 0) scale(1.05);
  }

  .host-ib-scene[data-beat="2"] .host-ib-scene__ticket {
    transform: translate3d(calc((100cqi - 100%) * 0.5), -0.55rem, 0) scale(1.03);
  }

  .host-ib-scene[data-beat="3"] .host-ib-scene__ticket,
  .host-ib-scene[data-beat="4"] .host-ib-scene__ticket {
    transform: translate3d(calc(100cqi - 100%), 0.02rem, 0) scale(1);
  }

  .host-ib-scene[data-beat="4"] .host-ib-scene__ticket {
    transform: translate3d(calc(100cqi - 100%), 0.12rem, 0) scale(0.96);
  }

  .host-ib-scene__slip {
    justify-self: stretch;
    width: 100%;
    height: auto;
    min-height: 7.5rem;
  }
}

@media (max-width: 639px) {
  .host-ib-scene {
    padding: 0.7rem 0.75rem 0.8rem;
  }

  .host-ib-scene__header {
    margin-bottom: 0.55rem;
    padding-bottom: 0.5rem;
  }

  .host-ib-scene__header strong {
    font-size: 0.92rem;
  }

  .host-ib-scene__stage {
    gap: 0.55rem;
    padding: 0.55rem 0.5rem 0.5rem;
    /* Phone: side-by-side chat | slip, fixed height so hero never jumps. */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
    align-items: stretch;
    height: 9.75rem;
    min-height: 9.75rem;
  }

  .host-ib-scene__rail {
    left: 8%;
    right: 5%;
    top: 40%;
    height: 1.7rem;
  }

  .host-ib-scene__ticket {
    height: 1.7rem;
    font-size: 0.62rem;
    padding: 0 0.48rem 0 0.38rem;
    border-radius: 0.5rem;
  }

  .host-ib-scene__ticket::before,
  .host-ib-scene__ticket::after {
    width: 0.38rem;
    height: 0.38rem;
    left: 0.52rem;
  }

  .host-ib-scene__ticket::before {
    top: -0.2rem;
  }

  .host-ib-scene__ticket::after {
    bottom: -0.2rem;
  }

  .host-ib-scene[data-beat="1"] .host-ib-scene__ticket {
    transform: translate3d(0, -0.22rem, 0) scale(1.04);
  }

  .host-ib-scene[data-beat="2"] .host-ib-scene__ticket {
    transform: translate3d(calc((100cqi - 100%) * 0.48), -0.38rem, 0) scale(1.02);
  }

  .host-ib-scene[data-beat="3"] .host-ib-scene__ticket {
    transform: translate3d(calc(100cqi - 100%), 0.02rem, 0) scale(1);
  }

  .host-ib-scene[data-beat="4"] .host-ib-scene__ticket {
    transform: translate3d(calc(100cqi - 100%), 0.1rem, 0) scale(0.96);
  }

  .host-ib-scene__place {
    margin-bottom: 0.35rem;
    font-size: 0.62rem;
  }

  .host-ib-scene__bubble {
    max-width: none;
    padding: 0.4rem 0.5rem;
    border-radius: 0.7rem;
    font-size: 0.7rem;
    line-height: 1.3;
  }

  .host-ib-scene__bubble--reply {
    margin: 0.3rem 0 0 0.45rem;
  }

  .host-ib-scene__slip {
    min-height: 0;
    height: 100%;
    padding: 0.6rem 0.55rem 0.5rem 0.65rem;
    border-radius: 0.75rem;
  }

  .host-ib-scene__slip-kicker {
    font-size: 0.62rem;
  }

  .host-ib-scene__slip-dates {
    margin-top: 0.28rem;
    font-size: 0.92rem;
  }

  .host-ib-scene__stamp {
    right: 0.4rem;
    top: 2.15rem;
    padding: 0.12rem 0.35rem;
    font-size: 0.58rem;
  }

  .host-ib-scene__portal {
    margin-top: 0.65rem;
    padding-top: 0.4rem;
    font-size: 0.7rem;
  }

  .host-ib-scene__actions {
    margin-top: 0.55rem;
    gap: 0.45rem 0.75rem;
  }

  .host-ib-scene__caption {
    font-size: 0.68rem;
    line-height: 1.35;
  }
}

/* Phone hero: shorter copy stack so the scene clears the first look. */
@media (max-width: 767px) {
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero {
    padding-top: 1.35rem !important;
    padding-bottom: 1.5rem !important;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-layout {
    gap: 1rem;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-kicker {
    margin-bottom: 0.55rem;
    padding: 0.28rem 0.5rem;
    font-size: 0.66rem;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-title-single,
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-title {
    font-size: clamp(2rem, 8.5vw, 2.75rem) !important;
    line-height: 1.12 !important;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-title.mb-4 {
    margin-bottom: 0.55rem !important;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-lead {
    margin-top: 0.35rem !important;
    font-size: 1rem !important;
    line-height: 1.6 !important;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-copy .mt-5 {
    margin-top: 0.85rem !important;
    gap: 0.5rem !important;
  }

  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-landing-primary-cta,
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-landing-secondary-cta {
    min-height: 2.55rem;
    padding: 0.62rem 0.95rem !important;
    font-size: 0.9rem !important;
  }

  /* Hero must paint immediately — blank first frame reads broken. */
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-motion--hero-left,
  body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-motion--hero-right {
    opacity: 1;
    transform: none;
  }

  /* Keep Spot Assistant off the Play control on the scene card. */
  body.host-landing-body:not(.host-listing-init-mode) #supportChatButton {
    width: 2.35rem !important;
    height: 2.35rem !important;
    min-width: 2.35rem !important;
    min-height: 2.35rem !important;
    bottom: max(0.85rem, env(safe-area-inset-bottom, 0px)) !important;
    right: max(0.65rem, env(safe-area-inset-right, 0px)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .host-ib-scene__ticket,
  .host-ib-scene__reveal,
  .host-ib-scene__route path,
  .host-ib-scene__portal::before,
  .host-ib-scene__stamp {
    transition: none !important;
    animation: none !important;
  }

  .host-ib-scene[data-beat="4"] .host-ib-scene__route path {
    stroke-dashoffset: 0;
    opacity: 0.16;
  }

  .host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__stamp.host-ib-scene__reveal,
  .host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__slip-dates.host-ib-scene__reveal,
  .host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__portal.host-ib-scene__reveal,
  .host-ib-scene.host-ib-scene--fading[data-beat] .host-ib-scene__bubble--reply.host-ib-scene__reveal {
    opacity: 1;
    transform: none;
    clip-path: inset(0);
  }
}

.host-landing-trust-band__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  text-align: center;
}

.host-landing-trust-band .host-operator-metrics--trust-band {
  width: 100%;
  max-width: 40rem;
  margin: 0.35rem auto 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
  justify-items: stretch;
}

.host-landing-trust-band .host-operator-metrics--trust-band li {
  text-align: center;
  padding: 0.7rem 0.55rem;
}

@media (max-width: 639px) {
  .host-landing-trust-band .host-operator-metrics--trust-band {
    gap: 0.45rem;
  }

  .host-landing-trust-band .host-operator-metrics--trust-band li {
    padding: 0.55rem 0.35rem;
  }

  .host-landing-trust-band .host-operator-metrics--trust-band strong {
    font-size: 0.78rem;
    line-height: 1.3;
  }
}

.host-contrast-rows {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-top: 0.65rem;
}

/* Shared track: topic | Manual | SwiftSpot (inherited by colheads + rows) */
.host-problem-section {
  --host-contrast-topic: 10.75rem;
  --host-contrast-gap: 0.8rem;
  --host-contrast-pad-x: 1.15rem;
  --host-contrast-cols: var(--host-contrast-topic) minmax(0, 1fr) minmax(0, 1fr);
}

.host-contrast-row {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
  padding: 1.05rem 1.1rem 1.1rem;
  box-sizing: border-box;
}

/* Soft panel surface so rows aren’t flat white on white section wash */
html:not(.dark) .host-contrast-row {
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.98) 0%, rgba(247, 245, 241, 0.96) 55%, rgba(243, 241, 236, 0.92) 100%);
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.85) inset,
    0 10px 28px -18px rgba(15, 23, 42, 0.22);
}

html.dark .host-contrast-row {
  background:
    linear-gradient(165deg, rgba(30, 41, 59, 0.72) 0%, rgba(11, 17, 32, 0.9) 100%);
  border: 1px solid rgba(71, 85, 105, 0.55);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.04) inset,
    0 14px 32px -22px rgba(0, 0, 0, 0.55);
}

/* Quiet accent edge so each row has a bit of presence */
html:not(.dark) .host-contrast-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.85rem;
  bottom: 0.85rem;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, #f59e0b 0%, #b45309 55%, #0f172a 100%);
  opacity: 0.9;
}

html.dark .host-contrast-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.85rem;
  bottom: 0.85rem;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, #fcd34d 0%, #f59e0b 50%, #64748b 100%);
  opacity: 0.9;
}

.host-contrast-row__title {
  margin: 0 0 0.75rem;
  padding-left: 0.35rem;
  font-size: 0.98rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #0f172a;
}

html.dark .host-contrast-row__title {
  color: #f8fafc;
}

/* Mobile: stacked Manual then SwiftSpot under the topic */
.host-contrast-row__pair {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
}

.host-contrast-row__manual,
.host-contrast-row__swiftspot {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 500;
  border-radius: 0.75rem;
  padding: 0.8rem 0.9rem;
  min-width: 0;
  min-height: 100%;
}

/* Manual: cooler/muted “before” surface */
html:not(.dark) .host-contrast-row__manual {
  color: #475569;
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0.95), rgba(241, 245, 249, 0.98));
  border: 1px solid rgba(148, 163, 184, 0.38);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

/* SwiftSpot: brand-tinted cell */
html:not(.dark) .host-contrast-row__swiftspot {
  color: #1e293b;
  background:
    linear-gradient(
      145deg,
      rgba(238, 242, 255, 0.95) 0%,
      rgba(224, 231, 255, 0.78) 48%,
      rgba(255, 255, 255, 0.92) 100%
    );
  border: 1px solid rgba(99, 102, 241, 0.32);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 8px 18px -14px rgba(79, 70, 229, 0.35);
}

html.dark .host-contrast-row__manual {
  color: #94a3b8;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.55), rgba(2, 6, 23, 0.45));
  border: 1px solid rgba(71, 85, 105, 0.65);
}

html.dark .host-contrast-row__swiftspot {
  color: #e2e8f0;
  background:
    linear-gradient(
      145deg,
      rgba(49, 46, 129, 0.42) 0%,
      rgba(30, 27, 75, 0.38) 55%,
      rgba(15, 23, 42, 0.55) 100%
    );
  border: 1px solid rgba(129, 140, 248, 0.38);
  box-shadow: inset 0 1px 0 rgba(165, 180, 252, 0.08);
}

.host-contrast-row__label {
  display: block;
  margin-bottom: 0.3rem;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}

.host-contrast-row__label--swiftspot {
  color: #4f46e5;
}

html.dark .host-contrast-row__label {
  color: #94a3b8;
}

html.dark .host-contrast-row__label--swiftspot {
  color: #a5b4fc;
}

/* sm+: vertical columns under Manual / SwiftSpot headers */
.host-contrast-colheads {
  display: none;
}

@media (min-width: 640px) {
  .host-contrast-colheads {
    display: grid;
    grid-template-columns: var(--host-contrast-cols);
    column-gap: var(--host-contrast-gap);
    margin: 1.35rem 0 0.55rem;
    padding: 0 var(--host-contrast-pad-x);
    box-sizing: border-box;
    align-items: end;
  }

  .host-contrast-colheads__manual,
  .host-contrast-colheads__swiftspot {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.2;
    color: #64748b;
  }

  .host-contrast-colheads__swiftspot {
    color: #4f46e5;
  }

  html.dark .host-contrast-colheads__manual {
    color: #94a3b8;
  }

  html.dark .host-contrast-colheads__swiftspot {
    color: #a5b4fc;
  }

  /* Title + Manual cell + SwiftSpot cell on the same track as colheads */
  .host-contrast-row {
    display: grid;
    grid-template-columns: var(--host-contrast-cols);
    column-gap: var(--host-contrast-gap);
    row-gap: 0;
    align-items: stretch;
    padding: 1rem var(--host-contrast-pad-x) 1.05rem;
  }

  .host-contrast-row__title {
    margin: 0;
    padding-left: 0.35rem;
    align-self: center;
    min-width: 0;
  }

  /* Promote cells onto the row grid so they line up under headers */
  .host-contrast-row__pair {
    display: contents;
  }

  .host-contrast-row__label--mobile {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .host-contrast-row__manual,
  .host-contrast-row__swiftspot {
    position: relative;
  }
}

@media (prefers-reduced-motion: no-preference) {
  body.host-landing-body .host-contrast-row {
    transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  }

  body.host-landing-body .host-contrast-row:hover {
    transform: translateY(-1px);
  }

  html:not(.dark) body.host-landing-body .host-contrast-row:hover {
    border-color: rgba(79, 70, 229, 0.18);
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.9) inset,
      0 16px 36px -20px rgba(15, 23, 42, 0.28);
  }

  html.dark body.host-landing-body .host-contrast-row:hover {
    border-color: rgba(129, 140, 248, 0.42);
  }
}

.host-capacity-section .host-capacity-modes {
  margin-top: 1.25rem;
}

/* ==========================================================================
   Host landing hierarchy / adventure polish (2026)
   Section rhythm, platform chapter, contrast colheads, brand anchors
   ========================================================================== */

.host-section-intro {
  margin-bottom: 2rem;
}

@media (min-width: 640px) {
  .host-section-intro {
    margin-bottom: 2.35rem;
  }
}

/* Hero brand mark removed — brand appears in the site nav chrome. */
/* Light/dark toggle for other pages: logo-switch.css */

/* Restore gradient accent on second title line */
html:not(.dark) .host-hero-title-line2 {
  background: linear-gradient(95deg, #0f172a 0%, #334155 48%, #b45309 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

html.dark .host-hero-title-line2 {
  background: linear-gradient(95deg, #f8fafc 0%, #e2e8f0 48%, #fcd34d 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* Alternating section atmospheres — operator paper (stone / cool slate / warm gold) */
html:not(.dark) .host-landing-band--chapter.host-booking-control-section {
  background:
    radial-gradient(circle at 12% 0%, rgba(245, 158, 11, 0.08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(238, 241, 244, 0.72)) !important;
  border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}

html.dark .host-landing-band--chapter.host-booking-control-section {
  background:
    radial-gradient(circle at 12% 0%, rgba(245, 158, 11, 0.1), transparent 44%),
    linear-gradient(180deg, #080c14, #0b1120) !important;
  border-bottom-color: rgba(71, 85, 105, 0.75) !important;
}

html:not(.dark) .host-landing-band--cool,
html:not(.dark) .host-landing-band--cool.host-problem-section {
  background: linear-gradient(180deg, rgba(247, 245, 241, 0.55), rgba(238, 241, 244, 0.92)) !important;
  border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}

html.dark .host-landing-band--cool.host-problem-section {
  background: linear-gradient(180deg, #0b1120, #080c14) !important;
  border-bottom-color: rgba(71, 85, 105, 0.7) !important;
}

html:not(.dark) .host-capacity-section.host-landing-band--warm {
  background:
    radial-gradient(circle at 88% 8%, rgba(245, 158, 11, 0.12), transparent 36%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 251, 235, 0.55)) !important;
  border-bottom-color: rgba(245, 158, 11, 0.14) !important;
}

html.dark .host-capacity-section.host-landing-band--warm {
  background:
    radial-gradient(circle at 88% 8%, rgba(245, 158, 11, 0.1), transparent 38%),
    linear-gradient(180deg, #111827, #0b1120) !important;
  border-bottom-color: rgba(71, 85, 105, 0.72) !important;
}

/* Fees/sample section: light stays light, dark stays dark */
html:not(.dark) .host-landing-band--peak.host-trust-payout-section {
  background:
    radial-gradient(circle at 14% 0%, rgba(245, 158, 11, 0.12), transparent 32%),
    radial-gradient(circle at 88% 100%, rgba(148, 163, 184, 0.12), transparent 36%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.96) 48%, rgba(243, 241, 236, 0.75) 100%) !important;
  border-bottom-color: rgba(180, 83, 9, 0.12) !important;
  color: #0f172a;
}

html.dark .host-landing-band--peak.host-trust-payout-section {
  background:
    radial-gradient(circle at 14% 0%, rgba(245, 158, 11, 0.12), transparent 32%),
    radial-gradient(circle at 88% 100%, rgba(100, 116, 139, 0.12), transparent 36%),
    linear-gradient(180deg, #0b1120 0%, #111827 52%, #080c14 100%) !important;
  border-bottom-color: rgba(71, 85, 105, 0.7) !important;
  color: #e2e8f0;
}

/* Light peak: readable slate/indigo type on pale wash */
html:not(.dark) .host-landing-band--peak .host-landing-kicker {
  color: #b45309;
}

html:not(.dark) .host-landing-band--peak h2 {
  color: #0f172a !important;
}

html:not(.dark) .host-landing-band--peak .host-landing-lead {
  color: #475569 !important;
}

html:not(.dark) .host-landing-band--peak .host-booking-rules-list li {
  background: rgba(255, 255, 255, 0.92);
  border-color: rgba(148, 163, 184, 0.35);
  color: #1e293b;
}

html:not(.dark) .host-landing-band--peak .host-risk-note {
  color: #64748b;
  border-left-color: #f59e0b;
}

html:not(.dark) .host-landing-band--peak .host-payout-proof--quiet {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(203, 213, 225, 0.95);
  box-shadow: 0 12px 28px -22px rgba(15, 23, 42, 0.2);
}

html:not(.dark) .host-landing-band--peak .host-payout-proof__label {
  color: #b45309;
}

html:not(.dark) .host-landing-band--peak .host-payout-proof__keep-line {
  color: #1e293b;
}

html:not(.dark) .host-landing-band--peak .host-payout-proof__keep-line strong {
  color: #312e81;
}

html:not(.dark) .host-landing-band--peak .host-payout-proof__sample {
  color: #475569;
}

html:not(.dark) .host-landing-band--peak .host-payout-proof__sample strong {
  color: #0f172a;
}

html:not(.dark) .host-landing-band--peak .host-payout-proof__sample span {
  color: #64748b;
}

html:not(.dark) .host-landing-band--peak .host-calculator-disclosure {
  background: rgba(255, 255, 255, 0.98) !important;
  border-color: rgba(203, 213, 225, 0.95) !important;
}

html:not(.dark) .host-landing-band--peak .host-calculator-disclosure__summary {
  color: #1e293b !important;
  background: rgb(241 245 249 / 0.98) !important;
  border-bottom-color: rgb(226 232 240 / 0.95) !important;
}

html:not(.dark) .host-landing-band--peak .host-payout-section__disclaimer {
  color: #64748b !important;
}

html:not(.dark) .host-landing-band--peak .swiftspot-stripe-trust-inline,
html:not(.dark) .host-landing-band--peak .swiftspot-stripe-trust-inline--host {
  color: #64748b;
}

/* Dark peak: elevated dark cards, light type */
html.dark .host-landing-band--peak .host-landing-kicker {
  color: #fcd34d;
}

html.dark .host-landing-band--peak h2 {
  color: #f8fafc !important;
}

html.dark .host-landing-band--peak .host-landing-lead {
  color: #cbd5e1 !important;
}

html.dark .host-landing-band--peak .host-booking-rules-list li {
  background: rgba(15, 23, 42, 0.72);
  border-color: rgba(71, 85, 105, 0.8);
  color: #e2e8f0;
}

html.dark .host-landing-band--peak .host-risk-note {
  color: #94a3b8;
  border-left-color: #fbbf24;
}

html.dark .host-landing-band--peak .host-payout-proof--quiet {
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(71, 85, 105, 0.85);
  box-shadow: 0 14px 32px -24px rgba(0, 0, 0, 0.55);
}

html.dark .host-landing-band--peak .host-payout-proof__label {
  color: #fcd34d;
}

html.dark .host-landing-band--peak .host-payout-proof__keep-line {
  color: #f1f5f9;
}

html.dark .host-landing-band--peak .host-payout-proof__keep-line strong {
  color: #fde68a;
}

html.dark .host-landing-band--peak .host-payout-proof__sample {
  color: #94a3b8;
}

html.dark .host-landing-band--peak .host-payout-proof__sample strong {
  color: #e2e8f0;
}

html.dark .host-landing-band--peak .host-payout-proof__sample span {
  color: #64748b;
}

html.dark .host-landing-band--peak .host-calculator-disclosure {
  background: rgba(30, 41, 59, 0.92) !important;
  border-color: rgba(71, 85, 105, 0.9) !important;
}

html.dark .host-landing-band--peak .host-calculator-disclosure__summary {
  color: #f1f5f9 !important;
  background: rgba(15, 23, 42, 0.72) !important;
  border-bottom-color: rgba(51, 65, 85, 0.9) !important;
}

html.dark .host-landing-band--peak .host-payout-section__disclaimer {
  color: #94a3b8 !important;
}

html.dark .host-landing-band--peak .swiftspot-stripe-trust-inline,
html.dark .host-landing-band--peak .swiftspot-stripe-trust-inline--host {
  color: #94a3b8;
}

/* Calculator fields inside peak: enforce contrast after open */
html:not(.dark) .host-landing-band--peak .host-calculator-field {
  background: #fff !important;
  border-color: rgb(148 163 184 / 0.75) !important;
  color: #0f172a !important;
}

html:not(.dark) .host-landing-band--peak .host-calculator-field input,
html:not(.dark) .host-landing-band--peak .host-calculator-field span {
  color: #0f172a !important;
}

html:not(.dark) .host-landing-band--peak .host-calculator-field span {
  color: #64748b !important;
}

html.dark .host-landing-band--peak .host-calculator-field {
  background: rgb(2 6 23 / 0.72) !important;
  border-color: rgb(100 116 139 / 0.8) !important;
  color: #f8fafc !important;
}

html.dark .host-landing-band--peak .host-calculator-field input {
  color: #f8fafc !important;
}

html.dark .host-landing-band--peak .host-calculator-field span {
  color: #94a3b8 !important;
}

html:not(.dark) .host-landing-band--peak .host-calculator-results__main {
  background: rgb(238 242 255 / 0.98) !important;
  border-color: rgb(165 180 252 / 0.85) !important;
}

html:not(.dark) .host-landing-band--peak .host-calculator-results__main strong {
  color: #4338ca !important;
}

html.dark .host-landing-band--peak .host-calculator-results__main {
  background: rgb(49 46 129 / 0.4) !important;
  border-color: rgb(99 102 241 / 0.45) !important;
}

html.dark .host-landing-band--peak .host-calculator-results__main strong {
  color: #c7d2fe !important;
}

html:not(.dark) .host-landing-band--peak .host-calculator-inputs {
  background: rgb(248 250 252 / 0.98);
  border: 1px solid rgb(203 213 225 / 0.95);
}

html.dark .host-landing-band--peak .host-calculator-inputs {
  background: rgb(15 23 42 / 0.55);
  border: 1px solid rgb(71 85 105 / 0.9);
}

html:not(.dark) .host-landing-band--soft,
html:not(.dark) .host-space-types-section.host-landing-band--soft,
html:not(.dark) .host-faq-section.host-landing-band--soft {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(243, 241, 236, 0.62)) !important;
  border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}

/* Platform panel — elevated how-it-works chapter */
.host-platform-panel {
  position: relative;
  border-radius: 1.35rem;
  padding: clamp(1.35rem, 3.2vw, 2rem);
  overflow: hidden;
}

.host-platform-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at top right, rgb(245 158 11 / 0.12), transparent 38%),
    radial-gradient(circle at bottom left, rgb(148 163 184 / 0.1), transparent 36%);
}

.host-platform-panel > * {
  position: relative;
  z-index: 1;
}

html:not(.dark) .host-platform-panel {
  background: linear-gradient(145deg, rgb(255 255 255 / 0.98), rgb(247 245 241 / 0.92));
  border: 1px solid rgb(226 232 240 / 0.95);
  box-shadow:
    0 28px 70px -36px rgb(15 23 42 / 0.2),
    inset 0 1px 0 rgb(255 255 255 / 0.85);
}

html.dark .host-platform-panel {
  background: linear-gradient(145deg, rgb(15 23 42 / 0.94), rgb(11 17 32 / 0.9));
  border: 1px solid rgb(71 85 105 / 0.75);
  box-shadow: 0 28px 70px -36px rgb(0 0 0 / 0.7);
}

.host-platform-panel .host-section-intro {
  margin-bottom: 1.65rem;
}

.host-platform-panel .host-booking-flow {
  margin-top: 0;
}

/* Numbered booking flow steps */
.host-booking-flow__step {
  position: relative;
  padding-top: 1.15rem;
  padding-bottom: 1.15rem;
}

.host-booking-flow__index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  margin-bottom: 0.65rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 800;
  background: rgba(245, 158, 11, 0.14);
  color: #b45309;
  border: 1px solid rgba(245, 158, 11, 0.3);
}

html.dark .host-booking-flow__index {
  background: rgba(245, 158, 11, 0.14);
  color: #fcd34d;
  border-color: rgba(252, 211, 77, 0.28);
}

html:not(.dark) .host-platform-panel .host-booking-flow__step {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(226, 232, 240, 0.95);
  box-shadow: 0 12px 28px -22px rgb(15 23 42 / 0.22);
}

html.dark .host-platform-panel .host-booking-flow__step {
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(71, 85, 105, 0.75);
}

/* Capacity mode stronger landmark treatment continues below.
   Contrast table grid is defined earlier with .host-problem-section vars. */
html:not(.dark) .host-capacity-mode-card {
  background:
    linear-gradient(160deg, rgb(255 255 255 / 0.99) 0%, rgb(247 245 241 / 0.88) 100%);
  border: 1px solid rgb(226 232 240 / 0.95);
  box-shadow: 0 18px 44px -26px rgb(15 23 42 / 0.18);
}

html:not(.dark) .host-capacity-mode-card:hover {
  border-color: rgb(180 83 9 / 0.3);
  box-shadow: 0 24px 52px -22px rgb(15 23 42 / 0.22);
}

html.dark .host-capacity-mode-card {
  background:
    linear-gradient(160deg, rgb(30 41 59 / 0.88), rgb(15 23 42 / 0.72));
  border-color: rgb(71 85 105 / 0.8);
}

.host-capacity-mode-card__index {
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  opacity: 0.9;
}

.host-capacity-section .host-capacity-modes {
  margin-top: 1.75rem;
  gap: 1.05rem;
}

/* Listable + demand coupling */
.host-space-types-section .host-listable-grid {
  margin-bottom: 0.25rem;
}

.host-space-types-section .host-demand-row {
  margin-top: 1.75rem;
  padding-top: 1.35rem;
  border-top: 1px solid rgba(99, 102, 241, 0.12);
}

html.dark .host-space-types-section .host-demand-row {
  border-top-color: rgba(71, 85, 105, 0.65);
}

html:not(.dark) .host-space-types-section .host-panel-card--listable {
  box-shadow: 0 16px 40px -26px rgb(15 23 42 / 0.22);
}

/* Trust: demote risk/disclaimer visually; lead with policies + proof */
.host-risk-note {
  margin-top: 1.15rem;
  font-size: 0.82rem;
  opacity: 0.88;
}

.host-trust-payout-copy .host-trust-payout-stripe {
  margin-top: 1.15rem;
}

.host-payout-section__disclaimer {
  font-size: 0.78rem;
  line-height: 1.5;
  opacity: 0.85;
}

/* Fees peak Stripe: inherit copy color from themed peak rules (not forced light-on-dark) */
html:not(.dark) .host-landing-band--peak .swiftspot-stripe-trust-inline__row {
  color: #64748b;
}

html.dark .host-landing-band--peak .swiftspot-stripe-trust-inline__row {
  color: #94a3b8;
}

html.dark .host-landing-band--peak .swiftspot-stripe-trust-inline--host img.swiftspot-stripe-wordmark {
  filter: brightness(1.18) saturate(0.92);
}

/* Final CTA brand mark — dark lockup (social mark + white text) on indigo/navy. */
img.host-landing-final-cta__logo,
.host-landing-final-cta__logo {
  display: block;
  width: auto !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  max-width: 8.75rem !important;
  margin-left: auto;
  margin-right: auto;
  object-fit: contain;
  opacity: 0.96;
}

@media (min-width: 640px) {
  img.host-landing-final-cta__logo,
  .host-landing-final-cta__logo {
    height: 2rem !important;
    min-height: 2rem !important;
    max-height: 2rem !important;
    max-width: 10rem !important;
  }
}

.host-landing-cta-final {
  padding-top: 3.25rem !important;
  padding-bottom: 3.5rem !important;
}

@media (min-width: 640px) {
  .host-landing-cta-final {
    padding-top: 3.75rem !important;
    padding-bottom: 4rem !important;
  }
}

/* FAQ intro breathing room */
.host-faq-intro {
  margin-bottom: 1.75rem;
}

.host-faq-intro .host-landing-kicker {
  margin-bottom: 0.55rem;
}

/* Motion for platform panel */
body.host-landing-body .host-motion--platform {
  transform: translate3d(0, 1rem, 0) scale(0.985);
}

/* Orb presence (marketing only) — sparse warm amber */
html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-orb--single {
  opacity: 0.28;
  background: radial-gradient(circle at 40% 35%, rgba(245, 158, 11, 0.4), rgba(247, 245, 241, 0.15) 52%, transparent 70%) !important;
}

html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-orb--accent {
  opacity: 0.22;
  background: radial-gradient(circle at 55% 40%, rgba(180, 83, 9, 0.22), rgba(238, 241, 244, 0.12) 50%, transparent 72%) !important;
}

html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-orb--single {
  opacity: 0.16;
  background: radial-gradient(circle at 40% 35%, rgba(245, 158, 11, 0.32), transparent 68%) !important;
}

html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-orb--accent {
  opacity: 0.12;
  background: radial-gradient(circle at 55% 40%, rgba(251, 191, 36, 0.18), transparent 70%) !important;
}

/* Slimmer hero outcomes: quiet supporting strip */
body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes {
  margin-top: 1.35rem !important;
  max-width: 28rem;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes li {
  flex: 1 1 auto;
  max-width: none;
}

html:not(.dark) body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes strong {
  font-size: 0.78rem !important;
  color: #334155;
}

html.dark body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-operator-metrics--outcomes strong {
  font-size: 0.78rem !important;
}

/* Hero free note quieter under tighter lead */
body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-free-note {
  margin-top: 0.55rem !important;
}

body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-copy .mt-5 {
  margin-top: 1.45rem !important;
  gap: 0.75rem !important;
}

/* Title spacing with shorter lead */
body.host-landing-body:not(.host-listing-init-mode) .host-landing-hero .host-hero-title.mb-4 {
  margin-bottom: 0.85rem !important;
}

@media (max-width: 639px) {
  .host-contrast-colheads {
    display: none !important;
  }

  .host-contrast-row__pair {
    grid-template-columns: 1fr;
  }
}

/* Shared marketing proof strip (host landing) */
.marketing-proof-strip {
  margin: 1rem 0 0;
}
.marketing-proof-strip__list {
  list-style: none;
  margin: 0;
  padding: 0.75rem 0 0;
  border-top: 1px solid rgb(148 163 184 / 0.35);
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
}
html.dark .marketing-proof-strip__list {
  border-top-color: rgb(71 85 105 / 0.55);
}
.marketing-proof-strip__item {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 5.5rem;
}
.marketing-proof-strip__value {
  font-size: 1.125rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f172a;
  line-height: 1.2;
}
html.dark .marketing-proof-strip__value {
  color: #f8fafc;
}
.marketing-proof-strip__label {
  font-size: 0.6875rem;
  font-weight: 500;
  color: #64748b;
  line-height: 1.3;
}
html.dark .marketing-proof-strip__label {
  color: #94a3b8;
}
.marketing-proof-strip--center-mobile .marketing-proof-strip__list {
  justify-content: center;
}
@media (min-width: 1024px) {
  .host-landing-hero .marketing-proof-strip--center-mobile .marketing-proof-strip__list {
    justify-content: flex-start;
  }
}

/* Host protection honesty section */
.host-protection-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .host-protection-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.host-protection-disclaimer {
  margin: 1.25rem auto 0;
  max-width: 42rem;
  text-align: center;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #64748b;
}
html.dark .host-protection-disclaimer {
  color: #94a3b8;
}
.host-protection-actions {
  margin-top: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem 1.25rem;
}

/* Marketing controls: visible keyboard focus and comfortable touch targets. */
.host-landing-page :is(a, button, summary):focus-visible {
  outline: 3px solid #4f46e5;
  outline-offset: 4px;
}

html.dark .host-landing-page :is(a, button, summary):focus-visible {
  outline-color: #a5b4fc;
}

.host-faq__q:focus-visible {
  outline-offset: -4px;
}

.host-landing-page :is(.host-landing-primary-cta, .host-landing-secondary-cta, .host-faq__q) {
  min-height: 44px;
}

.host-landing-page section[id] {
  scroll-margin-top: 7rem;
}

.host-hero-title {
  text-wrap: balance;
}

/* Host marketing hierarchy: one primary action and fewer nested surfaces. */
body.host-landing-body .host-landing-page .host-hero-title span {
  font-weight: 600;
  letter-spacing: -0.04em;
}
body.host-landing-body .host-landing-page .host-hero-subtitle {
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.55;
}
body.host-landing-body .host-landing-page .host-hero-lead { font-weight: 400; }
body.host-landing-body .host-landing-page .host-hero-sample {
  padding: 1.25rem 0 0;
  border: 0;
  border-top: 1px solid rgb(148 163 184 / 25%);
  border-radius: 0;
  background: transparent;
}
body.host-landing-body .host-landing-page .host-hero-copy .host-landing-secondary-cta {
  background: transparent !important;
  border-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  text-decoration: underline;
  text-underline-offset: 5px;
}
body.host-landing-body .host-landing-page .host-platform-panel {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.host-landing-body .host-landing-page .host-platform-panel::before { display: none; }
body.host-landing-body .host-landing-page .host-platform-panel .host-booking-flow__step {
  padding: 1.25rem 0;
  border: 0;
  border-top: 1px solid rgb(148 163 184 / 25%);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.host-landing-body .host-landing-page .host-booking-flow__step strong { font-weight: 500; }
body.host-landing-body .host-landing-page .host-faq__item {
  border: 0;
  border-bottom: 1px solid rgb(148 163 184 / 25%);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.host-landing-body .host-landing-page .host-faq__q {
  padding: 1.15rem 0;
  font-weight: 600;
}
body.host-landing-body .host-landing-page .host-faq__a {
  margin: 0 0 1.25rem;
  padding: 0 1.25rem 0 0;
  background: transparent;
  border-radius: 0;
  line-height: 1.7;
}
body.host-landing-body .host-landing-page .host-section-intro h2,
body.host-landing-body .host-landing-page .host-faq-intro h2 { font-weight: 600; }
@media (max-width: 767px) {
  body.host-landing-body .host-landing-page .host-hero-copy { text-align: left; }
  body.host-landing-body .host-landing-page .host-hero-subtitle,
  body.host-landing-body .host-landing-page .host-hero-lead { margin-inline: 0; }
  body.host-landing-body .host-landing-page .host-hero-sample { max-width: none; }
  body.host-landing-body .host-landing-page .host-booking-flow { gap: 0; }
  body.host-landing-body .host-landing-page .host-booking-flow__step {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    column-gap: 0.75rem;
  }
  body.host-landing-body .host-landing-page .host-booking-flow__index { grid-row: span 2; }
  body.host-landing-body .host-landing-page .host-booking-flow__label { margin-bottom: 0.4rem; }
  body.host-landing-body .host-landing-page .host-booking-flow__step strong { grid-column: 2; }
}

body.host-landing-body .host-landing-page .host-payout-proof--quiet {
  padding: 1.25rem;
}
body.host-landing-body .host-landing-page .host-calculator-inputs {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
body.host-landing-body .host-landing-page .host-calculator-results > div {
  border: 0;
  border-radius: 0;
  padding: 1rem 0;
  box-shadow: none;
}
body.host-landing-body .host-landing-page .host-calculator-results__details {
  border-top: 1px solid rgb(148 163 184 / 25%);
  background: transparent;
}
body.host-landing-body .host-landing-page .host-calculator-field input {
  min-height: 48px;
  font-size: 1rem;
}
body.host-landing-body .host-landing-page .host-calculator-inputs label > span {
  font-size: 0.875rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}

/* Lower marketing sections share a restrained reading rhythm. */
body.host-landing-body .host-landing-page .host-contrast-row {
  background: transparent;
  border: 0;
  border-top: 1px solid rgb(148 163 184 / 25%);
  border-radius: 0;
  box-shadow: none;
  transform: none;
}
body.host-landing-body .host-landing-page .host-contrast-row::before { display: none; }
body.host-landing-body .host-landing-page :is(.host-contrast-row__manual, .host-contrast-row__swiftspot) {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-weight: 400;
  line-height: 1.65;
}
body.host-landing-body .host-landing-page :is(.host-contrast-row__title, .host-panel-card__title) {
  font-weight: 600;
  font-size: 1.125rem;
}
body.host-landing-body .host-landing-page .host-capacity-mode-card {
  padding: 1.5rem;
  background: transparent;
  box-shadow: none;
  transform: none;
  border-color: rgb(148 163 184 / 25%);
}
body.host-landing-body .host-landing-page .host-protection-card {
  border: 0;
  border-top: 1px solid rgb(148 163 184 / 25%);
  border-radius: 0;
  padding: 1.5rem 0;
  background: transparent;
  box-shadow: none;
}
body.host-landing-body .host-landing-page .host-panel-card--listable {
  box-shadow: none;
  padding: 1.5rem;
}
body.host-landing-body .host-landing-page .host-landing-final-cta--secondary {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  text-decoration: underline;
  text-underline-offset: 5px;
}
body.host-landing-body .host-landing-page .host-landing-final-cta { min-height: 48px; }
body.host-landing-body .host-landing-page #host-final-cta-heading {
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.2;
}
@media (max-width: 639px) {
  body.host-landing-body .host-landing-page .host-contrast-row { padding: 1.5rem 0; }
  body.host-landing-body .host-landing-page .host-contrast-row__title { padding: 0; }
  body.host-landing-body .host-landing-page :is(.host-contrast-row__manual, .host-contrast-row__swiftspot) { padding: 0; }
  body.host-landing-body .host-landing-page .host-contrast-row__pair { gap: 1rem; }
  body.host-landing-body .host-landing-page .host-contrast-rows { gap: 0; }
  body.host-landing-body .host-landing-page .host-protection-grid { gap: 0; }
  body.host-landing-body .host-landing-page :is(.host-space-types-section, .host-capacity-section, .host-protection-section) {
    padding-block: 2.5rem;
  }
}

/* Setup facts remain scannable instead of wrapping into tiny phone tiles. */
body.host-landing-body .host-landing-page .host-operator-metrics--trust-band li {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.host-landing-body .host-landing-page .host-operator-metrics--trust-band strong {
  font-weight: 600;
  line-height: 1.5;
}
body.host-landing-body .host-landing-page .host-hero-partner-note {
  font-weight: 400;
  line-height: 1.65;
}
@media (max-width: 639px) {
  body.host-landing-body .host-landing-page .host-landing-trust-band { padding-block: 2rem; }
  body.host-landing-body .host-landing-page .host-operator-metrics--trust-band {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    width: 100%;
    max-width: none;
  }
  body.host-landing-body .host-landing-page .host-operator-metrics--trust-band li {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    align-items: baseline;
    gap: 1rem;
    max-width: none;
    padding: 0.9rem 0;
    border-top: 1px solid rgb(148 163 184 / 25%);
    text-align: left;
  }
  body.host-landing-body .host-landing-page .host-operator-metrics--trust-band strong {
    margin: 0;
    font-size: 0.9375rem;
  }
  body.host-landing-body .host-landing-page :is(.host-hero-free-note, .host-hero-partner-note) {
    text-align: left;
    font-weight: 400;
    font-size: 0.9375rem;
    line-height: 1.65;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.host-landing-body .host-landing-page .host-faq__q::after { transition: none; }
}

/* Keep booking dates and status separate throughout the scene animation. */
.host-ib-scene .host-ib-scene__stamp.host-ib-scene__reveal {
  position: static;
  display: inline-block;
  margin-top: 0.5rem;
  transform: none;
}
.host-ib-scene__motion {
  min-height: 44px;
  padding: 0.5rem 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.8125rem;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.host-ib-scene__motion[hidden] { display: none; }
@media (max-width: 639px) {
  .host-ib-scene .host-ib-scene__stage {
    height: 12rem;
    min-height: 12rem;
  }
  .host-ib-scene .host-ib-scene__bubble,
  .host-ib-scene .host-ib-scene__slip-kicker { font-size: 0.75rem; }
  .host-ib-scene .host-ib-scene__slip-dates { font-size: 0.9375rem; }
  .host-ib-scene .host-ib-scene__stamp { font-size: 0.6875rem; }
  .host-ib-scene .host-ib-scene__caption { font-size: 0.75rem; }
}