/* ==========================================================================
   Membrz Site CSS — mbz.css
   Prefix: mbz-  |  Palette: deep-neutral-mono, no saturated accent
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. CSS Custom Properties
   -------------------------------------------------------------------------- */
:root {
  --mbz-dark-base:          #0C0A0F;
  --mbz-dark-surface:       #1A1720;
  --mbz-dark-border:        #2E2A36;
  --mbz-light-base:         #F7F4F1;
  --mbz-light-alt:          #EDEAE6;
  --mbz-light-border:       #D5D1CC;
  --mbz-ink-primary:        #F0ECE8;
  --mbz-ink-muted:          #9B97A0;
  --mbz-ink-on-light:       #1A1720;
  --mbz-ink-muted-on-light: #5D5967;
  --mbz-font-heading:       'General Sans', Inter, system-ui, -apple-system, sans-serif;
  --mbz-font-body:          'Poppins', system-ui, -apple-system, sans-serif;
  --mbz-nav-h:              64px;
  --mbz-section-v:          88px;
  --mbz-section-v-sm:       56px;
  --mbz-container-w:        1200px;
  --mbz-container-pad:      24px;
  --mbz-radius-card:        12px;
  --mbz-radius-btn:         6px;
  --mbz-radius-input:       6px;
  --mbz-shadow-card:        0 2px 12px rgba(12, 10, 15, 0.18);
  --mbz-shadow-card-dark:   0 2px 16px rgba(12, 10, 15, 0.55);
}

/* --------------------------------------------------------------------------
   2. Base Reset
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--mbz-font-body);
  font-size: 1rem;
  line-height: 1.65;
  background: var(--mbz-light-base);
  color: var(--mbz-ink-on-light);
  -webkit-font-smoothing: antialiased;
}
img, video, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; font-family: inherit; border: none; background: none; }
ul, ol { list-style: none; }
h1, h2, h3, h4, h5, h6 {
  font-family: var(--mbz-font-heading);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

/* --------------------------------------------------------------------------
   3. Typography Scale
   -------------------------------------------------------------------------- */
.mbz-eyebrow {
  font-family: var(--mbz-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mbz-ink-muted);
}
.mbz-eyebrow--on-light { color: var(--mbz-ink-muted-on-light); }

.mbz-h1 { font-size: clamp(2.25rem, 4.5vw, 3.75rem); }
.mbz-h2 { font-size: clamp(1.75rem, 3vw, 2.75rem); }
.mbz-h3 { font-size: clamp(1.25rem, 2vw, 1.75rem); }

.mbz-lead {
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  font-weight: 400;
  line-height: 1.7;
  color: var(--mbz-ink-muted);
}
.mbz-lead--on-light { color: var(--mbz-ink-muted-on-light); }

/* --------------------------------------------------------------------------
   4. Layout Utilities
   -------------------------------------------------------------------------- */
.mbz-container {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-section {
  padding-block: var(--mbz-section-v);
}
.mbz-section--sm {
  padding-block: var(--mbz-section-v-sm);
}

/* Section background tokens */
.mbz-bg--dark {
  background: var(--mbz-dark-base);
  color: var(--mbz-ink-primary);
}
.mbz-bg--dark-alt {
  background: var(--mbz-dark-surface);
  color: var(--mbz-ink-primary);
}
.mbz-bg--light {
  background: var(--mbz-light-base);
  color: var(--mbz-ink-on-light);
}
.mbz-bg--light-alt {
  background: var(--mbz-light-alt);
  color: var(--mbz-ink-on-light);
}

/* Grid helpers */
.mbz-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.mbz-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.mbz-grid-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* --------------------------------------------------------------------------
   5. Navigation
   -------------------------------------------------------------------------- */
.mbz-nav {
  position: sticky;
  top: 0;
  z-index: 900;
  height: var(--mbz-nav-h);
  background: var(--mbz-dark-base);
  border-bottom: 1px solid var(--mbz-dark-border);
  transition: box-shadow 0.2s;
}
.mbz-nav--scrolled {
  box-shadow: 0 2px 20px rgba(12, 10, 15, 0.5);
}
.mbz-nav__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  height: 100%;
  display: flex;
  align-items: center;
  gap: 0;
}
.mbz-nav__logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-right: 40px;
}
.mbz-nav__logo img {
  height: 28px;
  width: auto;
}
.mbz-nav__links {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
}
.mbz-nav__link {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--mbz-ink-muted);
  padding: 6px 14px;
  border-radius: 4px;
  transition: color 0.15s, background 0.15s;
  white-space: nowrap;
}
.mbz-nav__link:hover {
  color: var(--mbz-ink-primary);
  background: rgba(240, 236, 232, 0.07);
}
.mbz-nav__link--active {
  color: var(--mbz-ink-primary);
}
.mbz-nav__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

/* Dropdown */
.mbz-dropdown {
  position: relative;
}
.mbz-dropdown__trigger {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--mbz-ink-muted);
  padding: 6px 14px;
  border-radius: 4px;
  transition: color 0.15s, background 0.15s;
  cursor: pointer;
  background: none;
  border: none;
  font-family: inherit;
  white-space: nowrap;
}
.mbz-dropdown__trigger:hover,
.mbz-dropdown--open .mbz-dropdown__trigger {
  color: var(--mbz-ink-primary);
  background: rgba(240, 236, 232, 0.07);
}
.mbz-dropdown__caret {
  width: 10px;
  height: 10px;
  transition: transform 0.2s;
}
.mbz-dropdown--open .mbz-dropdown__caret {
  transform: rotate(180deg);
}
.mbz-dropdown__menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 200px;
  background: var(--mbz-dark-surface);
  border: 1px solid var(--mbz-dark-border);
  border-radius: var(--mbz-radius-card);
  padding: 6px;
  box-shadow: 0 8px 32px rgba(12, 10, 15, 0.6);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.18s, transform 0.18s, visibility 0.18s;
}
.mbz-dropdown--open .mbz-dropdown__menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.mbz-dropdown__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border-radius: 6px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--mbz-ink-muted);
  transition: color 0.12s, background 0.12s;
}
.mbz-dropdown__item:hover {
  color: var(--mbz-ink-primary);
  background: rgba(240, 236, 232, 0.07);
}
.mbz-dropdown__item-icon {
  width: 16px;
  height: 16px;
  opacity: 0.6;
}

/* Hamburger */
.mbz-nav__hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  gap: 5px;
  margin-left: 8px;
  border-radius: 4px;
  transition: background 0.15s;
}
.mbz-nav__hamburger:hover {
  background: rgba(240, 236, 232, 0.07);
}
.mbz-nav__hamburger-bar {
  width: 22px;
  height: 2px;
  background: var(--mbz-ink-muted);
  border-radius: 2px;
  transition: transform 0.22s, opacity 0.22s;
  transform-origin: center;
}
.mbz-nav__hamburger--active .mbz-nav__hamburger-bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.mbz-nav__hamburger--active .mbz-nav__hamburger-bar:nth-child(2) {
  opacity: 0;
}
.mbz-nav__hamburger--active .mbz-nav__hamburger-bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Mobile nav drawer */
.mbz-nav__mobile {
  display: none;
  position: fixed;
  inset: var(--mbz-nav-h) 0 0 0;
  background: var(--mbz-dark-base);
  padding: 24px var(--mbz-container-pad);
  flex-direction: column;
  gap: 4px;
  overflow-y: auto;
  z-index: 899;
  border-top: 1px solid var(--mbz-dark-border);
}
.mbz-nav__mobile--open {
  display: flex;
}
.mbz-nav__mobile-link {
  display: block;
  font-size: 1rem;
  font-weight: 500;
  color: var(--mbz-ink-muted);
  padding: 12px 4px;
  border-bottom: 1px solid var(--mbz-dark-border);
  transition: color 0.15s;
}
.mbz-nav__mobile-link:hover {
  color: var(--mbz-ink-primary);
}
.mbz-nav__mobile-actions {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* --------------------------------------------------------------------------
   6. Buttons
   -------------------------------------------------------------------------- */
.mbz-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--mbz-font-body);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1;
  padding: 12px 22px;
  border-radius: var(--mbz-radius-btn);
  transition: opacity 0.15s, transform 0.12s, background 0.15s, color 0.15s;
  white-space: nowrap;
}
.mbz-btn:hover { opacity: 0.88; transform: translateY(-1px); }
.mbz-btn:active { opacity: 1; transform: translateY(0); }

.mbz-btn--sm { padding: 9px 18px; font-size: 0.825rem; }
.mbz-btn--lg { padding: 16px 30px; font-size: 1rem; }

.mbz-btn--primary-dark {
  background: var(--mbz-ink-primary);
  color: var(--mbz-dark-base);
  border: 2px solid transparent;
}
.mbz-btn--outline-dark {
  background: transparent;
  color: var(--mbz-ink-primary);
  border: 2px solid rgba(240, 236, 232, 0.4);
}
.mbz-btn--outline-dark:hover {
  border-color: var(--mbz-ink-primary);
}
.mbz-btn--primary-light {
  background: var(--mbz-dark-base);
  color: var(--mbz-ink-primary);
  border: 2px solid transparent;
}
.mbz-btn--outline-light {
  background: transparent;
  color: var(--mbz-ink-on-light);
  border: 2px solid var(--mbz-dark-border);
}
.mbz-btn--ghost-dark {
  background: transparent;
  color: var(--mbz-ink-muted);
  border: 1px solid var(--mbz-dark-border);
  font-weight: 500;
}
.mbz-btn--ghost-dark:hover {
  color: var(--mbz-ink-primary);
  border-color: var(--mbz-ink-muted);
}
.mbz-btn--text-dark {
  background: transparent;
  color: var(--mbz-ink-muted);
  border: none;
  padding-inline: 4px;
  font-weight: 500;
}
.mbz-btn--text-dark:hover {
  color: var(--mbz-ink-primary);
  opacity: 1;
  transform: none;
}
.mbz-btn--text-light {
  background: transparent;
  color: var(--mbz-ink-muted-on-light);
  border: none;
  padding-inline: 4px;
  font-weight: 500;
}
.mbz-btn--text-light:hover {
  color: var(--mbz-ink-on-light);
  opacity: 1;
  transform: none;
}

/* --------------------------------------------------------------------------
   7. Footer
   -------------------------------------------------------------------------- */
.mbz-footer {
  background: var(--mbz-dark-base);
  color: var(--mbz-ink-primary);
  padding-block: 64px 40px;
  border-top: 1px solid var(--mbz-dark-border);
}
.mbz-footer__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 48px;
}
.mbz-footer__brand-logo {
  height: 28px;
  width: auto;
  margin-bottom: 16px;
}
.mbz-footer__tagline {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted);
  line-height: 1.6;
  max-width: 260px;
  margin-bottom: 20px;
}
.mbz-footer__contact-line {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted);
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.mbz-footer__contact-line a {
  color: var(--mbz-ink-muted);
  transition: color 0.15s;
}
.mbz-footer__contact-line a:hover { color: var(--mbz-ink-primary); }

.mbz-footer__col-heading {
  font-family: var(--mbz-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--mbz-ink-muted);
  margin-bottom: 16px;
}
.mbz-footer__links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mbz-footer__links a {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted);
  transition: color 0.15s;
}
.mbz-footer__links a:hover { color: var(--mbz-ink-primary); }

.mbz-footer__bottom {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--mbz-dark-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.mbz-footer__copy {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted);
}
.mbz-footer__legal-links {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
.mbz-footer__legal-links a {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted);
  transition: color 0.15s;
}
.mbz-footer__legal-links a:hover { color: var(--mbz-ink-primary); }

/* --------------------------------------------------------------------------
   8. Cookie Banner
   -------------------------------------------------------------------------- */
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: var(--mbz-dark-surface);
  border-top: 1px solid var(--mbz-dark-border);
  box-shadow: 0 -4px 24px rgba(12, 10, 15, 0.4);
}
.cookie-banner__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding: 20px var(--mbz-container-pad);
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.cookie-banner__text {
  flex: 1;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted);
  min-width: 200px;
}
.cookie-banner__text a {
  color: var(--mbz-ink-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.cookie-banner__actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
  flex-wrap: wrap;
}
.cookie-banner__btn {
  font-family: var(--mbz-font-body);
  font-size: 0.8rem;
  font-weight: 600;
  padding: 9px 18px;
  border-radius: var(--mbz-radius-btn);
  cursor: pointer;
  transition: opacity 0.15s;
  border: none;
}
.cookie-banner__btn:hover { opacity: 0.85; }
.cookie-banner__btn--primary {
  background: var(--mbz-ink-primary);
  color: var(--mbz-dark-base);
  border: none;
}
.cookie-banner__btn--secondary {
  background: transparent;
  color: var(--mbz-ink-muted);
  border: 1px solid var(--mbz-dark-border);
}

/* --------------------------------------------------------------------------
   9. Home Hero (full-bleed raster background)
   -------------------------------------------------------------------------- */
.mbz-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--mbz-dark-base);
}
.mbz-hero__bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}
.mbz-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    rgba(12, 10, 15, 0.7) 0%,
    rgba(12, 10, 15, 0.6) 40%,
    rgba(12, 10, 15, 0.85) 100%
  );
}
.mbz-hero__content {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-top: var(--mbz-nav-h);
}
.mbz-hero__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-block: 80px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.mbz-hero__eyebrow {
  font-family: var(--mbz-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mbz-ink-muted);
}
.mbz-hero__h1 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(2.25rem, 4.5vw, 3.75rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--mbz-ink-primary);
  max-width: 780px;
}
.mbz-hero__sub {
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  color: var(--mbz-ink-muted);
  max-width: 560px;
  line-height: 1.7;
}
.mbz-hero__ctas {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 8px;
}

/* --------------------------------------------------------------------------
   10. Feature-Dark Hero (slim gradient header, not full-bleed)
   -------------------------------------------------------------------------- */
.mbz-feature-hero {
  background: linear-gradient(to bottom, var(--mbz-dark-base), var(--mbz-dark-surface) 100%);
  padding-top: calc(var(--mbz-nav-h) + 64px);
  padding-bottom: 80px;
  position: relative;
  overflow: hidden;
}
.mbz-feature-hero__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  display: flex;
  align-items: center;
  gap: 64px;
}
.mbz-feature-hero__text {
  flex: 1;
  min-width: 0;
}
.mbz-feature-hero__eyebrow {
  font-family: var(--mbz-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mbz-ink-muted);
  margin-bottom: 16px;
}
.mbz-feature-hero__h1 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.025em;
  color: var(--mbz-ink-primary);
  margin-bottom: 16px;
}
.mbz-feature-hero__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted);
  line-height: 1.7;
  margin-bottom: 28px;
  max-width: 520px;
}
.mbz-feature-hero__visual {
  flex: 0 0 420px;
  max-width: 420px;
}
.mbz-feature-hero--centered {
  text-align: center;
}
.mbz-feature-hero--centered .mbz-feature-hero__inner {
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.mbz-feature-hero--centered .mbz-feature-hero__sub {
  margin-inline: auto;
}
.mbz-feature-hero--raster-bg {
  background: var(--mbz-dark-base);
  position: relative;
}
.mbz-feature-hero--raster-bg .mbz-feature-hero__bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}
.mbz-feature-hero--raster-bg .mbz-feature-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(12,10,15,0.72) 0%, rgba(12,10,15,0.88) 100%);
}
.mbz-feature-hero--raster-bg .mbz-feature-hero__inner {
  position: relative;
  z-index: 2;
}

/* --------------------------------------------------------------------------
   11. Subpage-Light Hero
   -------------------------------------------------------------------------- */
.mbz-subhero {
  background: var(--mbz-light-base);
  padding-top: calc(var(--mbz-nav-h) + 48px);
  padding-bottom: 56px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-subhero__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  text-align: center;
}
.mbz-subhero__eyebrow {
  font-family: var(--mbz-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mbz-ink-muted-on-light);
  margin-bottom: 14px;
}
.mbz-subhero__h1 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.75rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.025em;
  color: var(--mbz-ink-on-light);
  margin-bottom: 16px;
}
.mbz-subhero__sub {
  font-size: 1.05rem;
  color: var(--mbz-ink-muted-on-light);
  max-width: 540px;
  margin-inline: auto;
  line-height: 1.7;
}

/* --------------------------------------------------------------------------
   12. Blog-List Header
   -------------------------------------------------------------------------- */
.mbz-blog-header {
  background: var(--mbz-light-base);
  padding-top: calc(var(--mbz-nav-h) + 40px);
  padding-bottom: 48px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-blog-header__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-blog-header__h1 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}
.mbz-blog-header__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted-on-light);
}

/* --------------------------------------------------------------------------
   13. Article Header
   -------------------------------------------------------------------------- */
.mbz-article-hero {
  background: var(--mbz-light-base);
  padding-top: 0;
  padding-bottom: 0;
}
.mbz-article-hero__inner {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-bottom: 40px;
}
.mbz-article-back {
  background: var(--mbz-light-base);
  padding-top: calc(var(--mbz-nav-h) + 32px);
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  margin-bottom: 32px;
}
.mbz-article-back__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  transition: color 0.15s;
}
.mbz-article-back__link:hover { color: var(--mbz-ink-on-light); }
.mbz-article-hero__meta {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted-on-light);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.mbz-article-hero__date {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted-on-light);
}
.mbz-article-hero__title {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  line-height: 1.2;
  letter-spacing: -0.02em;
  max-width: 800px;
  margin-bottom: 0;
}
.mbz-article-hero__byline {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  margin-top: 12px;
}
.mbz-article-hero__cover-wrap {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  margin-bottom: 0;
}
.mbz-article-hero__cover {
  width: 100%;
  max-height: 480px;
  object-fit: cover;
  border-radius: var(--mbz-radius-card);
}

/* --------------------------------------------------------------------------
   14. Article Body / Prose
   -------------------------------------------------------------------------- */
.mbz-article-layout {
  background: var(--mbz-light-base);
}
.mbz-article-body {
  background: var(--mbz-light-base);
  padding-block: 48px 80px;
  max-width: 680px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  font-size: 1rem;
  line-height: 1.8;
  color: var(--mbz-ink-on-light);
}
.mbz-article-body h2 {
  font-family: var(--mbz-font-heading);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-top: 40px;
  margin-bottom: 16px;
  letter-spacing: -0.015em;
}
.mbz-article-body h3 {
  font-family: var(--mbz-font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-top: 32px;
  margin-bottom: 12px;
}
.mbz-article-body p { margin-bottom: 20px; }
.mbz-article-body a {
  color: var(--mbz-ink-on-light);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.mbz-article-body ul, .mbz-article-body ol {
  margin-bottom: 20px;
  padding-left: 24px;
}
.mbz-article-body ul { list-style: disc; }
.mbz-article-body ol { list-style: decimal; }
.mbz-article-body li { margin-bottom: 6px; }
.mbz-article-body blockquote {
  border-left: 3px solid var(--mbz-dark-border);
  padding-left: 20px;
  margin: 24px 0;
  color: var(--mbz-ink-muted-on-light);
  font-style: italic;
}

/* Article CTA */
.mbz-article-cta {
  padding-block: var(--mbz-section-v);
}
.mbz-article-cta__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  text-align: center;
}
.mbz-article-cta__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--mbz-ink-primary);
  margin-bottom: 16px;
}
.mbz-article-cta__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted);
  max-width: 560px;
  margin-inline: auto;
  margin-bottom: 32px;
  line-height: 1.7;
}
.mbz-article-cta__actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Article related */
.mbz-article-related {
  background: var(--mbz-light-alt);
  padding-block: var(--mbz-section-v);
  border-top: 1px solid var(--mbz-light-border);
}
.mbz-article-related__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-article-related__heading {
  font-family: var(--mbz-font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 28px;
}
.mbz-article-related__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.mbz-related-card {
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  padding: 24px;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.18s ease, transform 0.18s ease;
}
.mbz-related-card:hover {
  box-shadow: var(--mbz-shadow-card);
  transform: translateY(-2px);
}
.mbz-related-card__date {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--mbz-ink-muted-on-light);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 10px;
  display: block;
}
.mbz-related-card__title {
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  line-height: 1.45;
  margin-bottom: 12px;
  text-decoration: none;
  display: block;
}
.mbz-related-card__title:hover {
  color: var(--mbz-ink-muted-on-light);
}
.mbz-related-card__excerpt {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
  flex: 1;
}

/* --------------------------------------------------------------------------
   15. Trust Band / Stats
   -------------------------------------------------------------------------- */
.mbz-trust-band {
  background: var(--mbz-dark-surface);
  border-top: 1px solid var(--mbz-dark-border);
  border-bottom: 1px solid var(--mbz-dark-border);
  padding-block: 48px;
}
.mbz-trust-band__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-trust-band__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}
.mbz-trust-band__stat {
  text-align: center;
  padding-block: 8px;
  border-right: 1px solid var(--mbz-dark-border);
}
.mbz-trust-band__stat:last-child { border-right: none; }
.mbz-trust-band__stat-text {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--mbz-ink-muted);
  line-height: 1.5;
}
.mbz-trust-band__stat-icon {
  font-size: 1rem;
  color: var(--mbz-ink-muted);
  margin-bottom: 8px;
}

/* --------------------------------------------------------------------------
   16. How-It-Works Brief (3 steps on homepage)
   -------------------------------------------------------------------------- */
.mbz-steps {
  background: var(--mbz-light-base);
}
.mbz-steps__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-block: var(--mbz-section-v);
}
.mbz-steps__header {
  text-align: center;
  margin-bottom: 56px;
}
.mbz-steps__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}
.mbz-steps__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted-on-light);
  max-width: 500px;
  margin-inline: auto;
}
.mbz-steps__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  position: relative;
}
.mbz-steps__step {
  text-align: center;
  padding: 32px 24px;
}
.mbz-steps__num {
  width: 48px;
  height: 48px;
  background: var(--mbz-dark-base);
  color: var(--mbz-ink-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mbz-font-heading);
  font-size: 1.25rem;
  font-weight: 800;
  margin: 0 auto 16px;
}
.mbz-steps__icon {
  width: 28px;
  height: 28px;
  margin: 0 auto 14px;
  color: var(--mbz-ink-on-light);
  opacity: 0.6;
}
.mbz-steps__name {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 8px;
}
.mbz-steps__desc {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.6;
}

/* How-It-Works page: vertical timeline */
.mbz-timeline {
  padding-block: var(--mbz-section-v);
}
.mbz-timeline__inner {
  max-width: 780px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-timeline__items {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.mbz-timeline__items::before {
  content: '';
  position: absolute;
  left: 20px;
  top: 24px;
  bottom: 24px;
  width: 2px;
  background: var(--mbz-light-border);
}
.mbz-timeline__item {
  display: flex;
  gap: 28px;
  align-items: flex-start;
}
.mbz-timeline__num {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background: var(--mbz-dark-base);
  color: var(--mbz-ink-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 800;
  z-index: 1;
  position: relative;
}
.mbz-timeline__content { flex: 1; min-width: 0; }
.mbz-timeline__phase {
  font-family: var(--mbz-font-heading);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 10px;
}
.mbz-timeline__details {
  list-style: disc;
  padding-left: 20px;
}
.mbz-timeline__details li {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  margin-bottom: 5px;
  line-height: 1.6;
}

/* --------------------------------------------------------------------------
   17. Features Grid
   -------------------------------------------------------------------------- */
.mbz-features {
  background: var(--mbz-light-alt);
}
.mbz-features__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-block: var(--mbz-section-v);
}
.mbz-features__header {
  text-align: center;
  margin-bottom: 48px;
}
.mbz-features__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}
.mbz-features__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted-on-light);
  max-width: 480px;
  margin-inline: auto;
}
.mbz-features__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.mbz-feature-card {
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  padding: 32px 28px;
  transition: box-shadow 0.2s;
}
.mbz-feature-card:hover {
  box-shadow: var(--mbz-shadow-card);
}
.mbz-feature-card__icon {
  width: 40px;
  height: 40px;
  color: var(--mbz-ink-on-light);
  margin-bottom: 16px;
  opacity: 0.7;
}
.mbz-feature-card__title {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 8px;
}
.mbz-feature-card__desc {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
}

/* --------------------------------------------------------------------------
   18. Proof / Testimonials
   -------------------------------------------------------------------------- */
.mbz-proof {
  background: var(--mbz-dark-base);
}
.mbz-proof__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-block: var(--mbz-section-v);
}
.mbz-proof__header {
  text-align: center;
  margin-bottom: 48px;
}
.mbz-proof__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-primary);
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}
.mbz-proof__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted);
  max-width: 480px;
  margin-inline: auto;
}
.mbz-proof__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}
.mbz-testimonial {
  background: var(--mbz-dark-surface);
  border: 1px solid var(--mbz-dark-border);
  border-radius: var(--mbz-radius-card);
  padding: 32px 28px;
}
.mbz-testimonial__quote {
  font-size: 1rem;
  color: var(--mbz-ink-primary);
  line-height: 1.7;
  margin-bottom: 20px;
}
.mbz-testimonial__quote::before { content: '\201C'; }
.mbz-testimonial__quote::after { content: '\201D'; }
.mbz-testimonial__author {
  font-size: 0.825rem;
  color: var(--mbz-ink-muted);
  font-weight: 600;
}
.mbz-testimonial__role {
  font-size: 0.775rem;
  color: var(--mbz-ink-muted);
  font-weight: 400;
  margin-top: 2px;
}

/* --------------------------------------------------------------------------
   19. Pricing
   -------------------------------------------------------------------------- */
.mbz-pricing {
  background: var(--mbz-light-base);
}
.mbz-pricing__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-block: var(--mbz-section-v);
}
.mbz-pricing__header {
  text-align: center;
  margin-bottom: 48px;
}
.mbz-pricing__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}
.mbz-pricing__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted-on-light);
  max-width: 460px;
  margin-inline: auto;
}
.mbz-pricing__tiers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: start;
}
.mbz-pricing__card {
  background: var(--mbz-light-base);
  border: 1.5px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  padding: 36px 28px;
  transition: box-shadow 0.2s;
}
.mbz-pricing__card:hover {
  box-shadow: var(--mbz-shadow-card);
}
.mbz-pricing__card--featured {
  background: var(--mbz-dark-base);
  border-color: var(--mbz-dark-surface);
  color: var(--mbz-ink-primary);
  box-shadow: 0 4px 32px rgba(12, 10, 15, 0.25);
  position: relative;
}
.mbz-pricing__featured-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--mbz-ink-primary);
  color: var(--mbz-dark-base);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 4px 14px;
  border-radius: 20px;
  white-space: nowrap;
}
.mbz-pricing__tier-name {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 8px;
}
.mbz-pricing__card--featured .mbz-pricing__tier-name {
  color: var(--mbz-ink-primary);
}
.mbz-pricing__price {
  font-family: var(--mbz-font-heading);
  font-size: 2.5rem;
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 4px;
}
.mbz-pricing__card--featured .mbz-pricing__price {
  color: var(--mbz-ink-primary);
}
.mbz-pricing__price-unit {
  font-size: 1rem;
  font-weight: 600;
  vertical-align: super;
  font-family: var(--mbz-font-body);
}
.mbz-pricing__billing {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted-on-light);
  margin-bottom: 8px;
}
.mbz-pricing__card--featured .mbz-pricing__billing {
  color: var(--mbz-ink-muted);
}
.mbz-pricing__fee {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--mbz-ink-muted-on-light);
  background: var(--mbz-light-alt);
  padding: 6px 10px;
  border-radius: 4px;
  margin-bottom: 20px;
  display: inline-block;
}
.mbz-pricing__card--featured .mbz-pricing__fee {
  color: var(--mbz-ink-muted);
  background: rgba(255,255,255,0.07);
}
.mbz-pricing__features {
  list-style: none;
  margin-bottom: 28px;
}
.mbz-pricing__feature-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  padding-block: 6px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-pricing__feature-item:last-child { border-bottom: none; }
.mbz-pricing__card--featured .mbz-pricing__feature-item {
  color: var(--mbz-ink-muted);
  border-color: var(--mbz-dark-border);
}
.mbz-pricing__feature-check {
  color: var(--mbz-ink-muted-on-light);
  flex-shrink: 0;
  margin-top: 1px;
}
.mbz-pricing__card--featured .mbz-pricing__feature-check {
  color: var(--mbz-ink-muted);
}
.mbz-pricing__note {
  font-size: 0.775rem;
  color: var(--mbz-ink-muted-on-light);
  margin-top: 12px;
  font-style: italic;
}
.mbz-pricing__card--featured .mbz-pricing__note {
  color: var(--mbz-ink-muted);
}

/* Pricing FAQ */
.mbz-pricing-faq {
  background: var(--mbz-light-alt);
}
.mbz-pricing-faq__inner {
  max-width: 720px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-block: var(--mbz-section-v);
}
.mbz-pricing-faq__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 40px;
}
.mbz-faq__list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid var(--mbz-light-border);
}
.mbz-faq__item {
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-faq__trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 0;
  font-family: var(--mbz-font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--mbz-ink-on-light);
  text-align: left;
  background: none;
  border: none;
  cursor: pointer;
  transition: color 0.15s;
}
.mbz-faq__trigger:hover { color: var(--mbz-ink-on-light); }
.mbz-faq__icon {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  color: var(--mbz-ink-muted-on-light);
  transition: transform 0.22s;
}
.mbz-faq__item--open .mbz-faq__icon {
  transform: rotate(45deg);
}
.mbz-faq__body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}
.mbz-faq__item--open .mbz-faq__body {
  max-height: 400px;
}
.mbz-faq__answer {
  padding-bottom: 20px;
  font-size: 0.9rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.7;
}

/* --------------------------------------------------------------------------
   20. Creator Stories
   -------------------------------------------------------------------------- */
.mbz-creator-story {
  padding-block: var(--mbz-section-v);
}
.mbz-creator-story__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.mbz-creator-story--flip .mbz-creator-story__inner {
  direction: rtl;
}
.mbz-creator-story--flip .mbz-creator-story__text,
.mbz-creator-story--flip .mbz-creator-story__visual {
  direction: ltr;
}
.mbz-creator-story__img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  object-position: center top;
  border-radius: var(--mbz-radius-card);
}
.mbz-creator-story__label {
  font-family: var(--mbz-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--mbz-ink-muted-on-light);
  margin-bottom: 12px;
}
.mbz-creator-story__h3 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.3rem, 2.2vw, 1.75rem);
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  margin-bottom: 14px;
}
.mbz-creator-story__body {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.7;
  margin-bottom: 20px;
}
.mbz-creator-story__quote {
  font-style: italic;
  font-size: 0.9rem;
  color: var(--mbz-ink-muted-on-light);
  border-left: 3px solid var(--mbz-dark-border);
  padding-left: 14px;
  margin-top: 16px;
}
.mbz-creator-story__attr {
  display: block;
  font-style: normal;
  font-size: 0.775rem;
  font-weight: 600;
  margin-top: 6px;
  color: var(--mbz-ink-muted-on-light);
}

/* --------------------------------------------------------------------------
   21. Outcome Metrics (dark bg)
   -------------------------------------------------------------------------- */
.mbz-metrics {
  background: var(--mbz-dark-base);
  padding-block: var(--mbz-section-v);
}
.mbz-metrics__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-metrics__header {
  text-align: center;
  margin-bottom: 48px;
}
.mbz-metrics__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-primary);
  letter-spacing: -0.025em;
  margin-bottom: 10px;
}
.mbz-metrics__sub {
  font-size: 0.9rem;
  color: var(--mbz-ink-muted);
  font-style: italic;
}
.mbz-metrics__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.mbz-metric {
  text-align: center;
  padding: 28px;
  background: var(--mbz-dark-surface);
  border: 1px solid var(--mbz-dark-border);
  border-radius: var(--mbz-radius-card);
}
.mbz-metric__value {
  font-family: var(--mbz-font-heading);
  font-size: 2.25rem;
  font-weight: 800;
  color: var(--mbz-ink-primary);
  letter-spacing: -0.03em;
  margin-bottom: 6px;
  line-height: 1;
}
.mbz-metric__label {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted);
  margin-bottom: 8px;
  line-height: 1.5;
}
.mbz-metric__source {
  font-size: 0.75rem;
  color: var(--mbz-ink-muted);
  opacity: 0.65;
  font-style: italic;
}

/* --------------------------------------------------------------------------
   22. About: Mission and Team
   -------------------------------------------------------------------------- */
.mbz-mission {
  padding-block: var(--mbz-section-v);
}
.mbz-mission__inner {
  max-width: 720px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-mission__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  margin-bottom: 20px;
}
.mbz-mission__body p {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.8;
  margin-bottom: 18px;
}
.mbz-mission__body p:last-child { margin-bottom: 0; }

.mbz-team {
  padding-block: var(--mbz-section-v);
  background: var(--mbz-light-alt);
}
.mbz-team__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-team__header {
  text-align: center;
  margin-bottom: 48px;
}
.mbz-team__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.025em;
  margin-bottom: 10px;
}
.mbz-team__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted-on-light);
}
.mbz-team__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.mbz-team-card {
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  padding: 32px 24px;
  text-align: center;
  box-shadow: var(--mbz-shadow-card);
}
.mbz-team-card__avatar-wrap {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 20px;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
}
.mbz-team-card__avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
.mbz-team-card__initials {
  font-family: var(--mbz-font-heading);
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--mbz-ink-muted);
}
.mbz-team-card__name {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 4px;
}
.mbz-team-card__role {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--mbz-ink-muted-on-light);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 12px;
}
.mbz-team-card__bio {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
}

.mbz-lisbon-story {
  padding-block: var(--mbz-section-v);
}
.mbz-lisbon-story__inner {
  max-width: 680px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-lisbon-story__body p {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.8;
  margin-bottom: 14px;
}
.mbz-lisbon-story__address {
  margin-top: 24px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.5;
}
.mbz-lisbon-story__address-icon {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--mbz-ink-muted-on-light);
}

/* --------------------------------------------------------------------------
   23. Contact
   -------------------------------------------------------------------------- */
.mbz-contact {
  padding-block: var(--mbz-section-v);
}
.mbz-contact__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 64px;
  align-items: start;
}
.mbz-contact__form-col { min-width: 0; }
.mbz-contact__info-col {
  padding-top: 8px;
}
.mbz-contact__info-heading {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 20px;
}
.mbz-contact__info-line {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.5;
}
.mbz-contact__info-line a {
  color: var(--mbz-ink-muted-on-light);
  transition: color 0.15s;
}
.mbz-contact__info-line a:hover { color: var(--mbz-ink-on-light); }
.mbz-contact__info-line i { flex-shrink: 0; margin-top: 2px; }

/* --------------------------------------------------------------------------
   24. Forms (shared form styles)
   -------------------------------------------------------------------------- */
.mbz-form__group {
  margin-bottom: 20px;
}
.mbz-form__label {
  display: block;
  font-size: 0.825rem;
  font-weight: 600;
  color: var(--mbz-ink-on-light);
  margin-bottom: 6px;
}
.mbz-form__input,
.mbz-form__textarea {
  display: block;
  width: 100%;
  font-family: var(--mbz-font-body);
  font-size: 0.9rem;
  color: var(--mbz-ink-on-light);
  background: var(--mbz-light-base);
  border: 1.5px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-input);
  padding: 11px 14px;
  transition: border-color 0.15s, box-shadow 0.15s;
  outline: none;
}
.mbz-form__input:focus,
.mbz-form__textarea:focus {
  border-color: var(--mbz-ink-on-light);
  box-shadow: 0 0 0 3px rgba(26, 23, 32, 0.1);
}
.mbz-form__input::placeholder,
.mbz-form__textarea::placeholder {
  color: var(--mbz-ink-muted-on-light);
  opacity: 0.7;
}
.mbz-form__textarea {
  resize: vertical;
  min-height: 130px;
}
.mbz-form__error {
  font-size: 0.8rem;
  color: #8B1A1A;
  margin-top: 5px;
  display: none;
}
.mbz-form__error--visible { display: block; }

.mbz-form__feedback {
  padding: 14px 16px;
  border-radius: var(--mbz-radius-input);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5;
  display: none;
}
.mbz-form__feedback--visible { display: block; }
.mbz-form__feedback--success {
  background: rgba(26, 23, 32, 0.06);
  color: var(--mbz-ink-on-light);
  border: 1px solid var(--mbz-light-border);
}
.mbz-form__feedback--error {
  background: rgba(139, 26, 26, 0.06);
  color: #6B1010;
  border: 1px solid rgba(139, 26, 26, 0.2);
}

/* Contact form feedback */
#mbz-contact-feedback {
  margin-top: 16px;
}

/* Auth forms on light card (override) */
.mbz-auth-form .mbz-form__label {
  color: var(--mbz-ink-on-light);
}
.mbz-auth-form .mbz-form__input {
  background: var(--mbz-light-alt);
  border-color: var(--mbz-light-border);
}
.mbz-auth-form .mbz-form__input:focus {
  background: var(--mbz-light-base);
  border-color: var(--mbz-ink-on-light);
}

/* --------------------------------------------------------------------------
   25. Blog Card Grid
   -------------------------------------------------------------------------- */
.mbz-blog-grid {
  padding-block: var(--mbz-section-v);
}
.mbz-blog-grid__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-blog-grid__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.mbz-blog-card {
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  overflow: hidden;
  transition: box-shadow 0.2s, transform 0.2s;
  display: flex;
  flex-direction: column;
}
.mbz-blog-card:hover {
  box-shadow: var(--mbz-shadow-card);
  transform: translateY(-2px);
}
.mbz-blog-card__cover {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  object-position: center;
  display: block;
}
.mbz-blog-card__body {
  padding: 20px 20px 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.mbz-blog-card__date {
  font-size: 0.75rem;
  color: var(--mbz-ink-muted-on-light);
  font-weight: 500;
  margin-bottom: 8px;
}
.mbz-blog-card__title {
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  line-height: 1.3;
  margin-bottom: 10px;
  letter-spacing: -0.01em;
  flex: 1;
}
.mbz-blog-card__excerpt {
  font-size: 0.825rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.6;
}

/* --------------------------------------------------------------------------
   26. Auth (fullscreen dark card)
   -------------------------------------------------------------------------- */
.mbz-auth-page {
  min-height: 100vh;
  background: radial-gradient(ellipse at 50% 40%, #1A1720 0%, #0E0C14 45%, #0C0A0F 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px var(--mbz-container-pad);
}
.mbz-auth-card {
  width: 100%;
  max-width: 420px;
  background: var(--mbz-light-base);
  border-radius: var(--mbz-radius-card);
  box-shadow: var(--mbz-shadow-card-dark);
  padding: 40px 36px;
}
.mbz-auth-card__logo {
  display: flex;
  justify-content: center;
  margin-bottom: 28px;
}
.mbz-auth-card__logo img {
  height: 32px;
  width: auto;
}
.mbz-auth-card__heading {
  font-family: var(--mbz-font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  text-align: center;
  margin-bottom: 8px;
  letter-spacing: -0.02em;
}
.mbz-auth-card__sub {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  text-align: center;
  margin-bottom: 28px;
}
.mbz-auth-form-view { display: block; width: 100%; }
.mbz-auth-confirm-view { display: none; }
.mbz-auth-confirm-view--visible { display: block; }
.mbz-auth-confirm-view--visible + .mbz-auth-form-view { display: none; }
.mbz-auth-confirm {
  text-align: center;
  padding: 16px 0;
}
.mbz-auth-confirm__icon {
  font-size: 2.5rem;
  color: var(--mbz-ink-muted-on-light);
  margin-bottom: 16px;
}
.mbz-auth-confirm__heading {
  font-family: var(--mbz-font-heading);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 10px;
}
.mbz-auth-confirm__body {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.6;
}
.mbz-auth-error {
  font-size: 0.825rem;
  color: #6B1010;
  background: rgba(139, 26, 26, 0.06);
  border: 1px solid rgba(139, 26, 26, 0.2);
  border-radius: 4px;
  padding: 10px 12px;
  margin-bottom: 14px;
  display: none;
  line-height: 1.5;
}
.mbz-auth-error--visible { display: block; }
.mbz-auth-divider {
  text-align: center;
  font-size: 0.8rem;
  color: var(--mbz-ink-muted-on-light);
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--mbz-light-border);
}
.mbz-auth-divider a {
  color: var(--mbz-ink-on-light);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.mbz-auth-legal {
  font-size: 0.75rem;
  color: var(--mbz-ink-muted-on-light);
  text-align: center;
  margin-top: 16px;
  line-height: 1.5;
}
.mbz-auth-legal a {
  color: var(--mbz-ink-muted-on-light);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* --------------------------------------------------------------------------
   27. Legal Prose
   -------------------------------------------------------------------------- */
.mbz-legal-header {
  background: var(--mbz-light-base);
  padding-top: calc(var(--mbz-nav-h) + 48px);
  padding-bottom: 40px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-legal-header__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-legal-header__h1 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  margin-bottom: 8px;
}
.mbz-legal-header__updated {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted-on-light);
}
.mbz-legal-content {
  background: var(--mbz-light-base);
  padding-block: 48px 80px;
}
.mbz-legal-prose {
  max-width: 720px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  font-size: 0.9375rem;
  line-height: 1.8;
  color: var(--mbz-ink-on-light);
}
.mbz-legal-prose h2 {
  font-family: var(--mbz-font-heading);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-top: 40px;
  margin-bottom: 14px;
}
.mbz-legal-prose h3 {
  font-family: var(--mbz-font-heading);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-top: 28px;
  margin-bottom: 10px;
}
.mbz-legal-prose p { margin-bottom: 14px; }
.mbz-legal-prose ul { list-style: disc; padding-left: 22px; margin-bottom: 14px; }
.mbz-legal-prose li { margin-bottom: 5px; }

/* --------------------------------------------------------------------------
   28. Inline Mock: Payout Split Panel (dark card)
   -------------------------------------------------------------------------- */
.mbz-mock-payout {
  background: var(--mbz-dark-surface);
  border: 1px solid var(--mbz-dark-border);
  border-radius: var(--mbz-radius-card);
  padding: 28px 24px;
  max-width: 360px;
  box-shadow: var(--mbz-shadow-card-dark);
}
.mbz-mock-payout__event {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--mbz-dark-border);
}
.mbz-mock-payout__rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}
.mbz-mock-payout__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mbz-mock-payout__recipient {
  font-size: 0.9rem;
  color: var(--mbz-ink-muted);
  display: flex;
  align-items: center;
  gap: 8px;
}
.mbz-mock-payout__recipient-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-mock-payout__pct {
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mbz-ink-primary);
}
.mbz-mock-payout__bar-wrap {
  height: 4px;
  background: var(--mbz-dark-border);
  border-radius: 2px;
  width: 100%;
  margin-top: 4px;
}
.mbz-mock-payout__bar {
  height: 100%;
  border-radius: 2px;
  background: var(--mbz-ink-muted);
}
.mbz-mock-payout__badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #2D6A4F;
  background: rgba(45, 106, 79, 0.15);
  border-radius: 4px;
  padding: 4px 10px;
  margin-top: 12px;
  border: 1px solid rgba(45, 106, 79, 0.25);
}

/* --------------------------------------------------------------------------
   29. Inline Mock: Door Scan Notification (dark card)
   -------------------------------------------------------------------------- */
.mbz-mock-door {
  background: var(--mbz-dark-surface);
  border: 1px solid var(--mbz-dark-border);
  border-radius: var(--mbz-radius-card);
  padding: 24px 22px;
  max-width: 300px;
  box-shadow: var(--mbz-shadow-card-dark);
}
.mbz-mock-door__scan-icon {
  font-size: 1.75rem;
  color: var(--mbz-ink-muted);
  margin-bottom: 14px;
  text-align: center;
}
.mbz-mock-door__status {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  font-weight: 700;
  color: #2D9B6A;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--mbz-dark-border);
}
.mbz-mock-door__status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2D9B6A;
  flex-shrink: 0;
}
.mbz-mock-door__detail {
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  margin-bottom: 8px;
}
.mbz-mock-door__detail-label {
  color: var(--mbz-ink-muted);
}
.mbz-mock-door__detail-value {
  color: var(--mbz-ink-primary);
  font-weight: 600;
}
.mbz-mock-door__timestamp {
  font-size: 0.7rem;
  color: var(--mbz-ink-muted);
  text-align: right;
  margin-top: 12px;
  opacity: 0.7;
}

/* --------------------------------------------------------------------------
   30. Final CTA Section
   -------------------------------------------------------------------------- */
.mbz-cta-section {
  background: var(--mbz-dark-base);
  text-align: center;
}
.mbz-cta-section__inner {
  max-width: 640px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  padding-block: var(--mbz-section-v);
}
.mbz-cta-section__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.75rem);
  font-weight: 800;
  color: var(--mbz-ink-primary);
  letter-spacing: -0.025em;
  margin-bottom: 14px;
}
.mbz-cta-section__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted);
  margin-bottom: 32px;
  line-height: 1.6;
}
.mbz-cta-section__btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

/* Integrations note (how-it-works) */
.mbz-integrations-note {
  padding-block: 64px;
  background: var(--mbz-light-alt);
  border-top: 1px solid var(--mbz-light-border);
}
.mbz-integrations-note__inner {
  max-width: 680px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  text-align: center;
}
.mbz-integrations-note__h3 {
  font-family: var(--mbz-font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 10px;
}
.mbz-integrations-note__body {
  font-size: 0.9rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.7;
}
.mbz-integrations-note__body a {
  color: var(--mbz-ink-on-light);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Device compat section */
.mbz-device-compat {
  padding-block: var(--mbz-section-v);
}
.mbz-device-compat__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  text-align: center;
}
.mbz-device-compat__h3 {
  font-family: var(--mbz-font-heading);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 12px;
}
.mbz-device-compat__body {
  font-size: 0.9rem;
  color: var(--mbz-ink-muted-on-light);
  max-width: 520px;
  margin-inline: auto;
  line-height: 1.7;
}
.mbz-device-compat__icons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin-top: 28px;
}
.mbz-device-compat__icon-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  color: var(--mbz-ink-muted-on-light);
}

/* Payouts: splits flow section */
.mbz-splits-how {
  padding-block: var(--mbz-section-v);
}
.mbz-splits-how__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-splits-how__header {
  text-align: center;
  margin-bottom: 48px;
}
.mbz-splits-how__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.025em;
  margin-bottom: 12px;
}
.mbz-splits-how__sub {
  font-size: 1rem;
  color: var(--mbz-ink-muted-on-light);
  max-width: 480px;
  margin-inline: auto;
}

/* Payouts: steps list */
.mbz-payout-steps {
  padding-block: var(--mbz-section-v);
  background: var(--mbz-light-alt);
}
.mbz-payout-steps__inner {
  max-width: 680px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-payout-steps__h2 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  margin-bottom: 32px;
  text-align: center;
}
.mbz-payout-step {
  display: flex;
  gap: 20px;
  margin-bottom: 28px;
}
.mbz-payout-step__num {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--mbz-dark-base);
  color: var(--mbz-ink-primary);
  font-family: var(--mbz-font-heading);
  font-weight: 800;
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}
.mbz-payout-step__content { flex: 1; min-width: 0; }
.mbz-payout-step__title {
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 4px;
}
.mbz-payout-step__desc {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
}

/* --------------------------------------------------------------------------
   31. Fade-In Animation (IntersectionObserver + failsafe)
   -------------------------------------------------------------------------- */
.mbz-fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
.mbz-fade-in--visible {
  opacity: 1;
  transform: translateY(0);
}

/* --------------------------------------------------------------------------
   32. Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .mbz-feature-hero__visual { flex: 0 0 320px; max-width: 320px; }
  .mbz-contact__inner { grid-template-columns: 1fr; gap: 40px; }
  .mbz-contact__info-col { padding-top: 0; }
}

@media (max-width: 768px) {
  :root {
    --mbz-section-v: 60px;
    --mbz-section-v-sm: 40px;
  }
  .mbz-nav__links,
  .mbz-nav__actions { display: none; }
  .mbz-nav__hamburger { display: flex; }

  .mbz-hero__inner { padding-block: 56px; }

  .mbz-feature-hero__inner {
    flex-direction: column;
    gap: 40px;
  }
  .mbz-feature-hero__visual {
    flex: none;
    max-width: 100%;
    width: 100%;
    order: -1;
  }

  .mbz-trust-band__stats { grid-template-columns: 1fr; gap: 24px; }
  .mbz-trust-band__stat { border-right: none; border-bottom: 1px solid var(--mbz-dark-border); padding-bottom: 20px; }
  .mbz-trust-band__stat:last-child { border-bottom: none; }

  .mbz-steps__grid { grid-template-columns: 1fr; gap: 20px; }

  .mbz-features__grid { grid-template-columns: repeat(2, 1fr); }
  .mbz-proof__grid { grid-template-columns: 1fr; }

  .mbz-pricing__tiers { grid-template-columns: 1fr; }

  .mbz-creator-story__inner { grid-template-columns: 1fr; gap: 32px; }
  .mbz-creator-story--flip .mbz-creator-story__inner { direction: ltr; }

  .mbz-metrics__grid { grid-template-columns: 1fr; gap: 16px; }

  .mbz-team__grid { grid-template-columns: 1fr; gap: 20px; }

  .mbz-blog-grid__cards { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .mbz-blog-listing .mbz-blog-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }

  .mbz-article-related__cards { grid-template-columns: repeat(2, 1fr); }

  .mbz-footer__inner { grid-template-columns: 1fr; gap: 32px; }
  .mbz-footer__bottom { flex-direction: column; align-items: flex-start; }

  .mbz-grid-2 { grid-template-columns: 1fr; }
  .mbz-grid-3 { grid-template-columns: 1fr; }
  .mbz-grid-4 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .mbz-features__grid { grid-template-columns: 1fr; }
  .mbz-blog-grid__cards { grid-template-columns: 1fr; }
  .mbz-blog-listing .mbz-blog-grid { grid-template-columns: 1fr; }
  .mbz-hero__ctas { flex-direction: column; align-items: stretch; }
  .mbz-hero__ctas .mbz-btn { text-align: center; justify-content: center; }
  .mbz-cta-section__btns { flex-direction: column; align-items: stretch; }
  .mbz-cta-section__btns .mbz-btn { text-align: center; justify-content: center; }
  .mbz-auth-card { padding: 32px 24px; }

  .mbz-article-related__cards { grid-template-columns: 1fr; }

  .mbz-contact__inner { grid-template-columns: 1fr; }
}

/* Overflow prevention */
.mbz-table-scroll { overflow-x: auto; }
pre, code {
  overflow-x: auto;
  max-width: 100%;
}

/* --------------------------------------------------------------------------
   33. Agent-3 Additions: Orphan fixes (payouts.html + pricing.html)
   -------------------------------------------------------------------------- */

/* A. mbz-ui-mock -- payout split UI panel (dark card in feature hero) */
.mbz-ui-mock {
  background: var(--mbz-dark-surface);
  border: 1px solid var(--mbz-dark-border);
  border-radius: var(--mbz-radius-card);
  padding: 24px;
  font-family: var(--mbz-font-body);
  min-width: 260px;
  max-width: 340px;
}
.mbz-ui-mock__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--mbz-dark-border);
}
.mbz-ui-mock__label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--mbz-ink-primary);
}
.mbz-ui-mock__badge {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 20px;
  white-space: nowrap;
  background: var(--mbz-dark-border);
  color: var(--mbz-ink-muted);
}
.mbz-ui-mock__badge--green {
  background: rgba(74, 222, 128, 0.15);
  color: #4ade80;
}
.mbz-ui-mock__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 9px;
  border-bottom: 1px solid var(--mbz-dark-border);
}
.mbz-ui-mock__row-label {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted);
}
.mbz-ui-mock__row-value {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--mbz-ink-primary);
  font-family: var(--mbz-font-heading);
}
.mbz-ui-mock__total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  margin-top: 2px;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--mbz-ink-muted);
}
.mbz-ui-mock__total-value {
  font-size: 1rem;
  font-weight: 700;
  color: #4ade80;
  font-family: var(--mbz-font-heading);
}

/* B. Pricing page -- new card structure classes */
.mbz-pricing__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: start;
  margin-bottom: 24px;
}
.mbz-pricing__card-header {
  margin-bottom: 20px;
}
.mbz-pricing__plan-name {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 10px;
}
.mbz-pricing__card--featured .mbz-pricing__plan-name {
  color: var(--mbz-ink-primary);
}
.mbz-pricing__price-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 6px;
}
.mbz-pricing__price-period {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  font-weight: 400;
}
.mbz-pricing__card--featured .mbz-pricing__price-period {
  color: var(--mbz-ink-muted);
}
.mbz-pricing__price-note {
  font-size: 0.8125rem;
  color: var(--mbz-ink-muted-on-light);
  margin-top: 4px;
}
.mbz-pricing__card--featured .mbz-pricing__price-note {
  color: var(--mbz-ink-muted);
}
.mbz-pricing__badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--mbz-ink-primary);
  color: var(--mbz-dark-base);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 4px 14px;
  border-radius: 20px;
  white-space: nowrap;
}
.mbz-pricing__cta {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 24px;
  box-sizing: border-box;
}
.mbz-pricing__stripe-note {
  font-size: 0.8125rem;
  color: var(--mbz-ink-muted-on-light);
  text-align: center;
  margin-top: 20px;
  max-width: 680px;
  margin-inline: auto;
  line-height: 1.6;
  display: block;
}

/* B2. Pricing feature list items (bare li, no per-item class) */
.mbz-pricing__features li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  padding-block: 6px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-pricing__features li:last-child { border-bottom: none; }
.mbz-pricing__card--featured .mbz-pricing__features li {
  color: var(--mbz-ink-muted);
  border-color: var(--mbz-dark-border);
}
.mbz-pricing__features li i {
  flex-shrink: 0;
  margin-top: 3px;
  font-size: 0.75rem;
  color: var(--mbz-ink-muted-on-light);
}
.mbz-pricing__card--featured .mbz-pricing__features li i {
  color: var(--mbz-ink-muted);
}

/* C. FAQ section wrapper */
.mbz-faq-section {
  padding-block: var(--mbz-section-v);
}
.mbz-faq-section__inner {
  max-width: 720px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-faq-section__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 40px;
}
.mbz-faq {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--mbz-light-border);
}
.mbz-faq__caret {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  color: var(--mbz-ink-muted-on-light);
  transition: transform 0.22s;
}
.mbz-faq__item--open .mbz-faq__caret {
  transform: rotate(180deg);
}

/* D. CTA section alias classes (agent-2 used different BEM names) */
.mbz-cta-section__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.75rem);
  font-weight: 800;
  color: var(--mbz-ink-primary);
  letter-spacing: -0.025em;
  margin-bottom: 14px;
}
.mbz-cta-section__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

/* E. Page body modifiers */
.mbz-page--light-top { background: var(--mbz-light-base); }
.mbz-page--dark-top  { background: var(--mbz-dark-base); }

/* F. Feature hero mock column (right-column visual container in two-col hero) */
.mbz-feature-hero__mock {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* G. Split flow -- 4-step how-it-works section (payouts.html) */
.mbz-split-flow { padding-block: var(--mbz-section-v); }
.mbz-split-flow__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-split-flow__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 48px;
}
.mbz-split-flow__steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  align-items: start;
}
.mbz-split-flow__step {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.mbz-split-flow__step-num {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--mbz-dark-surface);
  color: var(--mbz-ink-primary);
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.mbz-split-flow__step-title {
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin: 0;
}
.mbz-split-flow__step-body {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
  margin: 0;
}

/* H. Split models -- 3-card feature grid (payouts.html) */
.mbz-split-models { padding-block: var(--mbz-section-v); }
.mbz-split-models__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-split-models__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 48px;
}
.mbz-split-models__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: start;
}
.mbz-split-models__card {
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mbz-split-models__icon {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  color: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-split-models__card-title {
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin: 0;
}
.mbz-split-models__card-body {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
  margin: 0;
}

/* I. Trust note -- horizontal layout trust section (payouts.html) */
.mbz-trust-note { padding-block: calc(var(--mbz-section-v) * 0.65); }
.mbz-trust-note__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
.mbz-trust-note__icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  color: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-trust-note__text { flex: 1; }
.mbz-trust-note__heading {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 6px;
}
.mbz-trust-note__body {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
  margin: 0;
}

/* --------------------------------------------------------------------------
   34. Agent-3 Additions: Remaining site-wide orphan fixes
   -------------------------------------------------------------------------- */

/* ---- Body page modifiers ---- */
.mbz-page--auth {
  background: var(--mbz-light-base);
  min-height: 100vh;
}

/* ---- Form field alias (agent-2 used mbz-form__field vs agent-1 mbz-form__group) ---- */
.mbz-form__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
}
.mbz-form__label--on-light {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--mbz-ink-on-light);
}
.mbz-form__select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%235D5967' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
}

/* ---- Auth card sub-elements (agent-2 BEM names) ---- */
.mbz-auth-card__logo-link {
  display: block;
  text-align: center;
  margin-bottom: 24px;
}
.mbz-auth-card__form {
  width: 100%;
}
.mbz-auth-card__forgot-row {
  display: flex;
  justify-content: flex-end;
  margin-top: -8px;
  margin-bottom: 20px;
}
.mbz-auth-card__forgot-link {
  font-size: 0.8125rem;
  color: var(--mbz-ink-muted-on-light);
  text-decoration: none;
}
.mbz-auth-card__forgot-link:hover { color: var(--mbz-ink-on-light); }
.mbz-auth-card__submit {
  margin-top: 8px;
  width: 100%;
}
.mbz-auth-card__submit .mbz-btn { width: 100%; justify-content: center; }
.mbz-auth-card__switch {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  text-align: center;
  margin-top: 20px;
}
.mbz-auth-card__switch a { color: var(--mbz-ink-on-light); font-weight: 500; }
.mbz-auth-card__legal {
  font-size: 0.8rem;
  color: var(--mbz-ink-muted-on-light);
  text-align: center;
  margin-top: 16px;
  line-height: 1.5;
}
.mbz-auth-card__legal a { color: var(--mbz-ink-muted-on-light); text-decoration: underline; }
.mbz-auth-card__confirm {
  display: none;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 16px 0;
  gap: 12px;
}
.mbz-auth-card__confirm--visible { display: flex; }
.mbz-auth-card__confirm-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(74,222,128,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  color: #4ade80;
}
.mbz-auth-card__confirm-heading {
  font-family: var(--mbz-font-heading);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
}
.mbz-auth-card__confirm-text {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.6;
  max-width: 320px;
}

/* ---- About page components ---- */
.mbz-about-story { padding-block: var(--mbz-section-v); }
.mbz-about-story__inner {
  max-width: 720px;
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-about-story__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.25rem, 2vw, 1.6rem);
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 16px;
}
.mbz-about-story__body {
  font-size: 1rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.75;
}
.mbz-about-story__body p { margin-bottom: 14px; }

/* Feature hero text-only and centered inner modifiers */
.mbz-feature-hero--text-only .mbz-feature-hero__inner {
  grid-template-columns: 1fr;
  max-width: 720px;
  margin-inline: auto;
}
.mbz-feature-hero__inner--centered {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 680px;
  margin-inline: auto;
}
.mbz-feature-hero__inner--centered .mbz-feature-hero__h1 { max-width: 580px; }

/* Team section heading and card info */
.mbz-team__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 32px;
}
.mbz-team-card__avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}
.mbz-team-card__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Values section */
.mbz-values { padding-block: var(--mbz-section-v); }
.mbz-values__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-values__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 48px;
}
.mbz-values__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.mbz-value-card {
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mbz-value-card__icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  color: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-value-card__title {
  font-family: var(--mbz-font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin: 0;
}
.mbz-value-card__body {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
  margin: 0;
}

/* ---- Creators page components ---- */
.mbz-creators-hero {
  position: relative;
  overflow: hidden;
  padding-block: calc(var(--mbz-section-v) * 1.5) var(--mbz-section-v);
}
.mbz-creators-hero--bg-photo {
  background: var(--mbz-dark-base);
}
.mbz-creators-hero__bg-img {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.mbz-creators-hero__bg-img-el {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  opacity: 0.35;
}
.mbz-creators-hero__inner {
  position: relative;
  z-index: 1;
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-creators-hero__h1 {
  font-family: var(--mbz-font-heading);
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 800;
  color: var(--mbz-ink-primary);
  letter-spacing: -0.03em;
  line-height: 1.1;
  max-width: 680px;
  margin-bottom: 20px;
}
.mbz-creators-hero__sub {
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  color: var(--mbz-ink-muted);
  max-width: 560px;
  line-height: 1.65;
  margin-bottom: 32px;
}

/* Proof stats bar */
.mbz-proof-stats { padding-block: calc(var(--mbz-section-v) * 0.7); }
.mbz-proof-stats__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  text-align: center;
}
.mbz-proof-stats__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.mbz-proof-stats__number {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.025em;
}
.mbz-proof-stats__label {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.4;
}

/* Creator stories section */
.mbz-creator-stories { padding-block: var(--mbz-section-v); }
.mbz-creator-stories__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-creator-stories__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 56px;
}
.mbz-creator-story--forward,
.mbz-creator-story--reverse {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 48px;
  align-items: center;
  padding-block: 40px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-creator-story--forward:last-child,
.mbz-creator-story--reverse:last-child { border-bottom: none; }
.mbz-creator-story--reverse { grid-template-columns: 1.35fr 1fr; }
.mbz-creator-story--reverse .mbz-creator-story__portrait { order: 2; }
.mbz-creator-story--reverse .mbz-creator-story__content { order: 1; }
.mbz-creator-story__portrait {
  border-radius: var(--mbz-radius-card);
  overflow: hidden;
  aspect-ratio: 4/5;
}
.mbz-creator-story__portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.mbz-creator-story__content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.mbz-creator-story__meta { display: flex; flex-direction: column; gap: 4px; }
.mbz-creator-story__name {
  font-family: var(--mbz-font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
}
.mbz-creator-story__role {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
}
.mbz-creator-story__outcomes {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mbz-creator-story__outcomes li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.5;
}
.mbz-creator-story__outcomes li i {
  flex-shrink: 0;
  margin-top: 3px;
  color: var(--mbz-ink-muted-on-light);
  font-size: 0.875rem;
}
.mbz-creator-story__cta { align-self: flex-start; margin-top: 8px; }

/* Creator types grid */
.mbz-creator-types { padding-block: var(--mbz-section-v); }
.mbz-creator-types__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-creator-types__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 48px;
}
.mbz-creator-types__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.mbz-creator-type-card {
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
  padding: 24px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mbz-creator-type-card__icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  color: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-creator-type-card__title {
  font-family: var(--mbz-font-heading);
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin: 0;
}
.mbz-creator-type-card__body {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.6;
  margin: 0;
}

/* ---- Door scanning page ---- */
.mbz-door-flow { padding-block: var(--mbz-section-v); }
.mbz-door-flow__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-door-flow__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 48px;
}
.mbz-door-flow__steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  align-items: start;
}
.mbz-door-flow__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
}
.mbz-door-flow__step-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  color: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-door-flow__step-title {
  font-family: var(--mbz-font-heading);
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin: 0;
}
.mbz-door-flow__step-body {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
  margin: 0;
}
.mbz-door-features { padding-block: var(--mbz-section-v); }
.mbz-door-features__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-door-features__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 48px;
}
.mbz-door-features__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.mbz-door-features__item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 20px;
  background: var(--mbz-light-base);
  border: 1px solid var(--mbz-light-border);
  border-radius: var(--mbz-radius-card);
}
.mbz-door-features__item-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-door-features__item-title {
  font-family: var(--mbz-font-heading);
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin: 0 0 6px;
}
.mbz-door-features__item-body {
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.6;
  margin: 0;
}

/* Door scan UI mock (scan result card) */
.mbz-ui-mock--scan {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 32px 24px;
}
.mbz-ui-mock__scan-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(74,222,128,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: #4ade80;
  margin-bottom: 4px;
}
.mbz-ui-mock__status {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 20px;
}
.mbz-ui-mock__status--valid {
  background: rgba(74,222,128,0.15);
  color: #4ade80;
}
.mbz-ui-mock__scan-detail {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--mbz-ink-primary);
}
.mbz-ui-mock__scan-detail--muted {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--mbz-ink-muted);
}

/* ---- How-it-works page ---- */
.mbz-phase-flow { padding-block: var(--mbz-section-v); }
.mbz-phase-flow__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
  display: flex;
  flex-direction: column;
  gap: 0;
}
.mbz-phase-flow__phase {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 32px;
  padding-block: 40px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-phase-flow__phase:last-child { border-bottom: none; }
.mbz-phase-flow__phase-num {
  font-family: var(--mbz-font-heading);
  font-size: 2.5rem;
  font-weight: 800;
  color: var(--mbz-dark-border);
  line-height: 1;
  padding-top: 4px;
}
.mbz-phase-flow__phase-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mbz-phase-flow__phase-title {
  font-family: var(--mbz-font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin: 0;
}
.mbz-phase-flow__phase-body {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.7;
  margin: 0;
  max-width: 640px;
}
.mbz-phase-flow__checklist {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mbz-phase-flow__checklist li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.5;
}
.mbz-phase-flow__checklist li i {
  flex-shrink: 0;
  margin-top: 2px;
  font-size: 0.8125rem;
}

/* Features section heading alias */
.mbz-features__heading {
  font-family: var(--mbz-font-heading);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--mbz-ink-on-light);
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: 48px;
}
.mbz-feature-card__body {
  font-size: 0.9375rem;
  color: var(--mbz-ink-muted-on-light);
  line-height: 1.65;
  margin: 0;
}

/* ---- Blog listing (backstage/index.html) ---- */
.mbz-blog-listing { padding-block: var(--mbz-section-v); }
.mbz-blog-listing__inner {
  max-width: var(--mbz-container-w);
  margin-inline: auto;
  padding-inline: var(--mbz-container-pad);
}
.mbz-blog-listing .mbz-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.mbz-blog-card--featured {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
  margin-bottom: 48px;
  padding-bottom: 48px;
  border-bottom: 1px solid var(--mbz-light-border);
}
.mbz-blog-card--featured .mbz-blog-card__cover-link { border-radius: var(--mbz-radius-card); overflow: hidden; }
.mbz-blog-card__cover-link {
  display: block;
  overflow: hidden;
  border-radius: var(--mbz-radius-card);
  line-height: 0;
}
.mbz-blog-card__cover-link img { transition: transform 0.35s ease; width: 100%; object-fit: cover; }
.mbz-blog-card__cover-link:hover img { transform: scale(1.04); }
.mbz-blog-card__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}
.mbz-blog-card__read-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--mbz-ink-on-light);
  text-decoration: none;
  margin-top: 12px;
}
.mbz-blog-card__read-link:hover { text-decoration: underline; }

/* ---- Contact page ---- */
.mbz-contact__form {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mbz-contact__form-wrap { min-width: 0; }
.mbz-contact__form-heading {
  font-family: var(--mbz-font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--mbz-ink-on-light);
  margin-bottom: 20px;
}
.mbz-contact__form-submit { margin-top: 8px; }
.mbz-contact__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mbz-contact__info-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.mbz-contact__info-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.mbz-contact__info-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--mbz-dark-surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  color: var(--mbz-ink-muted);
  flex-shrink: 0;
}
.mbz-contact__info-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--mbz-ink-muted-on-light);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 2px;
}
.mbz-contact__info-value {
  font-size: 0.9375rem;
  color: var(--mbz-ink-on-light);
  text-decoration: none;
  line-height: 1.5;
  display: block;
}
.mbz-contact__response-note {
  margin-top: 24px;
  padding: 14px 16px;
  background: var(--mbz-light-border);
  border-radius: 8px;
  font-size: 0.875rem;
  color: var(--mbz-ink-on-light);
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Responsive additions for agent-3 classes
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .mbz-creator-types__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .mbz-pricing__grid { grid-template-columns: 1fr; }
  .mbz-split-flow__steps { grid-template-columns: repeat(2, 1fr); }
  .mbz-split-models__grid { grid-template-columns: 1fr; }
  .mbz-values__grid { grid-template-columns: 1fr; }
  .mbz-proof-stats__inner { grid-template-columns: 1fr; gap: 20px; text-align: left; }
  .mbz-creator-story--forward,
  .mbz-creator-story--reverse {
    grid-template-columns: 1fr;
  }
  .mbz-creator-story--reverse .mbz-creator-story__portrait,
  .mbz-creator-story--reverse .mbz-creator-story__content { order: unset; }
  .mbz-creator-types__grid { grid-template-columns: 1fr; }
  .mbz-door-flow__steps { grid-template-columns: repeat(2, 1fr); }
  .mbz-door-features__grid { grid-template-columns: 1fr; }
  .mbz-phase-flow__phase { grid-template-columns: 48px 1fr; gap: 20px; }
  .mbz-blog-card--featured { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .mbz-cta-section__actions { flex-direction: column; align-items: stretch; }
  .mbz-cta-section__actions .mbz-btn { text-align: center; justify-content: center; }
  .mbz-split-flow__steps { grid-template-columns: 1fr; }
  .mbz-trust-note__inner { flex-direction: column; }
  .mbz-door-flow__steps { grid-template-columns: 1fr; }
}