/* ══════════════════════════════════════════════════════════════════════════════
   /mozart/  Landing de venta de Mozart (equipo de agentes). Cargado después de stg.css.
   Superficie de PRODUCTO: base acromática STG + acentos puntuales:
   - degradado pizarra→cobre (tomado de la unidad Mozart del video del hero)
   - skins de rol del instalador: grafito, ámbar, índigo, menta, coral
   Todo con prefijo .mz- para no tocar el resto del sitio.
   ══════════════════════════════════════════════════════════════════════════════ */

@font-face {
  font-family: "Manrope";
  src: url("/fonts/manrope-latin-var.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

.mz-page {
  --mz-ink: #ffffff;
  --mz-dim: rgba(255, 255, 255, 0.64);
  --mz-faint: rgba(255, 255, 255, 0.42);
  --mz-line: rgba(255, 255, 255, 0.1);
  --mz-card: rgba(255, 255, 255, 0.04);
  --mz-card-hi: rgba(255, 255, 255, 0.07);
  --mz-slate: #9dbcc4;
  --mz-copper: #d58e5a;
  --mz-grad: linear-gradient(100deg, #cfe2e6 0%, #9dbcc4 38%, #d58e5a 100%);
  --sk-grafito: #a3aab4;
  --sk-ambar: #f2ab3c;
  --sk-indigo: #8286f8;
  --sk-menta: #4fd6a8;
  --sk-coral: #ff7d69;
  --mz-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --mz-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --sys: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mz-doodle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='210' height='210' fill='none' stroke='%23ffffff' stroke-opacity='0.035' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='28' cy='30' r='9'/%3E%3Cpath d='M70 20h22a6 6 0 0 1 6 6v12a6 6 0 0 1-6 6H80l-8 7v-7h-2a6 6 0 0 1-6-6V26a6 6 0 0 1 6-6z'/%3E%3Cpath d='M150 24l4 8 9 1-7 6 2 9-8-5-8 5 2-9-7-6 9-1z'/%3E%3Cpath d='M30 96c6-8 18-8 22 0s-10 18-11 20c-1-2-17-12-11-20z'/%3E%3Crect x='96' y='84' width='26' height='20' rx='4'/%3E%3Ccircle cx='109' cy='94' r='5'/%3E%3Cpath d='M168 90c10 0 14 8 14 14h-28c0-6 4-14 14-14z'/%3E%3Cpath d='M20 168l10-14 10 14z'/%3E%3Cpath d='M76 160c8-6 16 6 24 0s16-6 24 0'/%3E%3Ccircle cx='170' cy='166' r='3'/%3E%3Ccircle cx='184' cy='176' r='2'/%3E%3C/svg%3E");
}

/* Etiqueta de sección (eyebrow) consistente en toda la landing */
.mz-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 22px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mz-faint);
}
.mz-eyebrow::before {
  content: "";
  width: 18px;
  height: 1px;
  background: currentColor;
}
.mz-grad-text {
  background: var(--mz-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.mz-h2 {
  margin: 0;
  text-wrap: balance;
  color: var(--mz-ink);
  font-size: clamp(36px, 4.6vw, 76px);
  line-height: 1.02;
  letter-spacing: -0.035em;
  font-weight: 400;
}
.mz-lead {
  margin: 24px 0 0;
  max-width: 620px;
  font-size: clamp(17px, 1.35vw, 20px);
  line-height: 1.6;
  color: var(--mz-dim);
}
.mz-section {
  position: relative;
  padding: clamp(88px, 9.5vw, 150px) 0;
}
.mz-wordmark {
  font-family: "Manrope", sans-serif;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: lowercase;
}

/* ── Botones propios (complementan .rr-btn del template) ── */
.mz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 56px;
  padding: 0 28px;
  border-radius: 100px;
  border: 1px solid #fff;
  background: #fff;
  color: #0b0c0e;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.1;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 0.3s var(--mz-ease), background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.mz-btn:hover {
  color: #0b0c0e;
  transform: translateY(-2px);
  background: #eef3f4;
}
.mz-btn i {
  font-size: 19px;
}
.mz-btn--ghost {
  background: transparent;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.3);
}
.mz-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  border-color: #fff;
}
.mz-btn--block {
  width: 100%;
}
.mz-link {
  appearance: none;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(255, 255, 255, 0.4);
  cursor: pointer;
}
.mz-link:hover {
  text-decoration-color: #fff;
  color: #fff;
}
.mz-page .rr-btn,
.mz-page .section-subtitle {
  text-transform: none;
}
.rr-btn .mz-btn-icon {
  margin-right: 10px;
  font-size: 1.15em;
}

/* ══ 1 · HERO: video del producto a pantalla completa ══════════════════════ */
.mz-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 100vh;
  min-height: 100svh;
  background: #000;
  overflow: hidden;
  isolation: isolate;
}
@media (min-width: 992px) {
  .mz-hero {
    margin-top: -60px; /* cancela el padding-top de .inner-main: el video llega al tope, detrás del header */
  }
}
.mz-hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
/* El encuadre del video deja el producto a la izquierda y espacio negro a la derecha.
   Como el fondo del video es negro puro, no hace falta "cover": el marco se ancla a la
   izquierda y el texto ocupa el espacio vacío de la derecha. */
.mz-hero__frame {
  position: absolute;
  left: -2vw;
  top: 50%;
  width: 76vw;
  aspect-ratio: 1920 / 1080;
  transform: translateY(-47%);
  will-change: transform, opacity;
}
.mz-hero__frame picture,
.mz-hero__frame img,
.mz-hero__frame video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mz-hero__frame video {
  opacity: 0;
  transition: opacity 0.9s ease;
}
.mz-hero.is-playing .mz-hero__frame video {
  opacity: 1;
}
/* Fundido inferior del hero hacia el negro del sitio (#111) */
.mz-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 22vh;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(17, 17, 17, 0), #111);
  pointer-events: none;
}
.mz-hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
}
.mz-hero__content {
  width: min(600px, 44vw);
  margin-left: auto;
  padding: 150px 0 130px;
}
.mz-lockup {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 34px;
  color: #fff;
  line-height: 1;
}
.mz-lockup .mz-wordmark {
  font-size: 32px;
  letter-spacing: -0.03em;
}
.mz-lockup__rule {
  flex: 0 0 auto;
  width: 1px;
  height: 30px;
  background: rgba(255, 255, 255, 0.3);
}
.mz-lockup__by {
  display: inline-flex;
  flex-direction: column;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 9px;
  line-height: 1.5;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
}
.mz-hero__title {
  margin: 0;
  text-wrap: balance;
  color: #fff;
  font-size: clamp(44px, 5.4vw, 92px);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.035em;
}
.mz-hero__title span {
  font-family: var(--font_ppeditor);
  letter-spacing: -0.01em;
  background: var(--mz-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  padding-right: 0.06em; /* la itálica se recorta sin este respiro */
}
.mz-hero__title.is-b {
  font-size: clamp(40px, 4.6vw, 80px);
}
.mz-hero__sub {
  margin: 28px 0 0;
  max-width: 540px;
  font-size: clamp(17px, 1.3vw, 19px);
  line-height: 1.58;
  color: rgba(255, 255, 255, 0.7);
}
.mz-hero__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 30px;
  margin-top: 40px;
}
.mz-play {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: #fff;
  font-size: 17px;
  letter-spacing: -0.01em;
}
.mz-play__icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.35);
  transition: border-color 0.3s ease, transform 0.4s var(--mz-ease);
}
.mz-play__icon::before {
  content: "";
  margin-left: 3px;
  border-left: 11px solid #fff;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
}
.mz-play:hover {
  color: #fff;
}
.mz-play:hover .mz-play__icon {
  border-color: #fff;
  transform: scale(1.08);
}
.mz-hero__alt {
  margin: 22px 0 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--mz-faint);
}
.mz-hero__caption {
  position: absolute;
  left: max(24px, calc((100vw - 1320px) / 2 + 12px));
  bottom: 40px;
  z-index: 2;
  display: flex;
  align-items: baseline;
  gap: 14px;
  max-width: 460px;
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.5);
}
.mz-hero__caption b {
  flex: 0 0 auto;
  font-weight: 500;
  color: #fff;
}
.mz-hero__caption b::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 1px;
  margin-right: 12px;
  vertical-align: middle;
  background: rgba(255, 255, 255, 0.5);
}

@media (max-width: 1199px) {
  .mz-hero__content {
    width: min(520px, 48vw);
  }
}
/* Tablet y móvil: el producto arriba (encuadre ampliado y anclado a la izquierda),
   el texto abajo sobre el mismo negro. */
@media (max-width: 991px) {
  .mz-hero {
    display: block;
  }
  .mz-hero__frame {
    left: -5vw;
    top: 72px;
    width: 128vw;
    transform: none;
  }
  .mz-hero__frame::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 32%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000);
  }
  .mz-hero__content {
    width: 100%;
    max-width: 620px;
    margin: 0;
    padding: calc(72px + 60vw) 0 40px;
  }
  .mz-hero__caption {
    position: static;
    max-width: none;
    padding-bottom: 72px;
  }
}
@media (max-width: 767px) {
  .mz-hero__frame {
    left: -6vw;
    width: 150vw;
  }
  .mz-hero__content {
    padding-top: calc(72px + 76vw);
  }
  .mz-lockup {
    margin-bottom: 24px;
  }
  .mz-lockup .mz-wordmark {
    font-size: 28px;
  }
  .mz-hero__title {
    font-size: clamp(38px, 10.6vw, 48px);
    line-height: 1;
  }
  .mz-hero__title.is-b {
    font-size: clamp(34px, 9.4vw, 44px);
  }
  .mz-hero__sub {
    margin-top: 20px;
    font-size: 16.5px;
  }
  .mz-hero__cta {
    margin-top: 30px;
    gap: 18px;
  }
  .mz-hero__cta .rr-btn {
    width: 100%;
    justify-content: center;
    padding: 19px 22px;
    font-size: 16px;
  }
}

/* ── Franja de confianza bajo el hero ── */
.mz-proofbar {
  border-top: 1px solid var(--mz-line);
  border-bottom: 1px solid var(--mz-line);
}
.mz-proofbar__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.mz-proofbar__item {
  padding: 34px 26px;
  border-left: 1px solid var(--mz-line);
}
.mz-proofbar__item:first-child {
  border-left: 0;
  padding-left: 0;
}
.mz-proofbar__num {
  display: block;
  margin-bottom: 8px;
  color: #fff;
  font-family: var(--font_bdogrotesk);
  font-size: clamp(26px, 2.4vw, 36px);
  letter-spacing: -0.03em;
  line-height: 1;
}
.mz-proofbar__label {
  font-size: 14.5px;
  line-height: 1.45;
  color: var(--mz-dim);
}
@media (max-width: 991px) {
  .mz-proofbar__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .mz-proofbar__item {
    padding: 26px 18px;
  }
  .mz-proofbar__item:nth-child(odd) {
    border-left: 0;
    padding-left: 0;
  }
  .mz-proofbar__item:nth-child(n + 3) {
    border-top: 1px solid var(--mz-line);
  }
}

/* ══ 2 · LA IDEA: una frase grande que se enciende palabra por palabra ═════ */
.mz-idea {
  background: #0a0a0b;
}
.mz-idea__text {
  margin: 0;
  max-width: 1180px;
  color: #fff;
  font-family: var(--font_bdogrotesk);
  font-size: clamp(36px, 5.3vw, 88px);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -0.04em;
}
.mz-idea__text em {
  font-style: normal;
}
.mz-w {
  display: inline-block;
  opacity: 0.14;
  will-change: opacity;
}
.mz-idea__stays {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin: clamp(56px, 7vw, 100px) 0 0;
  padding: 0;
  list-style: none;
}
.mz-idea__stays li {
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  font-size: clamp(19px, 1.6vw, 24px);
  line-height: 1.35;
  letter-spacing: -0.015em;
  color: #fff;
}
.mz-idea__stays li span {
  display: block;
  margin-bottom: 14px;
  font-family: var(--mz-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--mz-faint);
}
@media (max-width: 767px) {
  .mz-idea__stays {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* ══ 3 · CÓMO TRABAJA: réplica de WhatsApp (iOS, modo oscuro) + ventana de la oficina ══ */
.mz-work__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(40px, 6vw, 110px);
  align-items: center;
}
.mz-steps {
  margin: 44px 0 0;
  padding: 0;
  list-style: none;
}
.mz-step {
  position: relative;
  padding: 22px 0 22px 64px;
  border-top: 1px solid var(--mz-line);
  opacity: 0.42;
  transition: opacity 0.5s ease;
}
.mz-step:last-child {
  border-bottom: 1px solid var(--mz-line);
}
.mz-step.is-active,
.mz-step.is-done {
  opacity: 1;
}
.mz-step__num {
  position: absolute;
  left: 0;
  top: 25px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  color: var(--mz-faint);
}
.mz-step::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  height: 1px;
  width: 0;
  background: rgba(255, 255, 255, 0.7);
  transition: width 0.9s var(--mz-ease);
}
.mz-step.is-active::before,
.mz-step.is-done::before {
  width: 100%;
}
.mz-step__title {
  margin: 0 0 6px;
  color: #fff;
  font-size: 24px;
  letter-spacing: -0.02em;
}
.mz-step__text {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  color: var(--mz-dim);
}
.mz-work__actions {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 34px;
}
@keyframes mzMsgIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

.mz-stage {
  position: relative;
  min-height: 664px;
}

/* — Teléfono — */
.mz-phone {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  width: 312px;
  height: 664px;
  padding: 10px;
  border-radius: 56px;
  background: linear-gradient(150deg, #3a3c40 0%, #18191c 22%, #0c0d0f 60%, #1d1e21 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.12),
    inset 0 0 0 3px #050506,
    0 60px 110px rgba(0, 0, 0, 0.65),
    0 20px 40px rgba(0, 0, 0, 0.45);
}
.mz-phone::before,
.mz-phone::after {
  content: "";
  position: absolute;
  width: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, #2a2b2f, #141517);
}
.mz-phone::before { left: -2px; top: 132px; height: 58px; box-shadow: 0 74px 0 #1b1c1f; }
.mz-phone::after { right: -2px; top: 170px; height: 88px; }
.mz-phone__screen {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: 46px;
  overflow: hidden;
  background: #0b141a;
  font-family: var(--sys);
  -webkit-font-smoothing: antialiased;
  color: #e9edef;
}
.mz-wa-top {
  position: relative;
  z-index: 3;
  background: #1f2c33;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04);
}
.mz-ios-status {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
  padding: 16px 28px 0 34px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.mz-ios-island {
  position: absolute;
  top: 11px;
  left: 50%;
  width: 98px;
  height: 29px;
  border-radius: 20px;
  background: #000;
  transform: translateX(-50%);
}
.mz-ios-icons {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.mz-ios-icons svg {
  display: block;
  fill: currentColor;
}
.mz-wa-head {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 4px 14px 10px 8px;
}
.mz-wa-back {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #21c063;
  font-size: 15px;
}
.mz-wa-back svg {
  width: 12px;
  height: 20px;
}
.mz-wa-avatar {
  position: relative;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  background: radial-gradient(circle at 50% 50%, #22343c 0%, #111a1f 70%);
}
.mz-wa-avatar canvas {
  position: absolute;
  inset: 2px;
  width: 32px;
  height: 32px;
}
.mz-wa-who {
  flex: 1;
  min-width: 0;
  line-height: 1.15;
}
.mz-wa-who strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
}
.mz-wa-status {
  font-size: 12.5px;
  color: #8696a0;
}
.mz-wa-actions {
  display: inline-flex;
  gap: 20px;
  color: #21c063;
}
.mz-wa-actions svg {
  width: 22px;
  height: 22px;
}
.mz-wa-body {
  position: relative;
  flex: 1;
  overflow: hidden;
  background-color: #0b141a;
  background-image: var(--mz-doodle);
  background-size: 210px 210px;
}
.mz-wa-day {
  position: absolute;
  top: 10px;
  left: 50%;
  z-index: 2;
  padding: 5px 12px;
  border-radius: 8px;
  background: #182229;
  font-size: 12.5px;
  color: #8696a0;
  transform: translateX(-50%);
  box-shadow: 0 1px 0.5px rgba(11, 20, 26, 0.13);
}
.mz-chat {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 44px 14px 10px;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, transparent 40px, #000 104px);
  mask-image: linear-gradient(to bottom, transparent 0, transparent 40px, #000 104px);
}
.mz-msg {
  position: relative;
  flex: 0 0 auto;
  max-width: 82%;
  margin-top: 8px;
  padding: 6px 8px 8px 9px;
  border-radius: 8px;
  font-size: 15px;
  line-height: 20px;
  color: #e9edef;
  box-shadow: 0 1px 0.5px rgba(11, 20, 26, 0.13);
  animation: mzMsgIn 0.32s var(--mz-ease) both;
  overflow-wrap: break-word;
}
.mz-msg--me {
  align-self: flex-end;
  border-top-right-radius: 0;
  background: #005c4b;
}
.mz-msg--mz {
  align-self: flex-start;
  border-top-left-radius: 0;
  background: #202c33;
}
.mz-msg::before {
  content: "";
  position: absolute;
  top: 0;
  width: 8px;
  height: 13px;
  background: inherit;
}
.mz-msg--me::before {
  right: -8px;
  clip-path: polygon(0 0, 100% 0, 0 100%);
}
.mz-msg--mz::before {
  left: -8px;
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}
.mz-msg__text::after {
  content: "";
  display: inline-block;
  width: 62px;
}
.mz-msg--me .mz-msg__text::after {
  width: 80px;
}
.mz-msg__meta {
  position: absolute;
  right: 8px;
  bottom: 4px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  line-height: 1;
  color: rgba(233, 237, 239, 0.6);
}
.mz-ticks {
  width: 16px;
  height: 11px;
  color: #8696a0;
  transition: color 0.3s ease;
}
.mz-msg.is-read .mz-ticks {
  color: #53bdeb;
}
/* Documento PDF */
.mz-msg--doc {
  width: 82%;
  padding: 3px 3px 8px;
}
.mz-msg--doc .mz-msg__text {
  display: block;
  padding: 0 6px;
}
.mz-doc {
  margin-bottom: 6px;
  border-radius: 6px;
  overflow: hidden;
  background: #1a252b;
}
.mz-doc__preview {
  position: relative;
  height: 96px;
  overflow: hidden;
  background: #3b4a54;
}
.mz-doc__page {
  position: absolute;
  left: 18px;
  right: 18px;
  top: 12px;
  bottom: -30px;
  padding: 11px 12px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  color: #111;
}
.mz-doc__page b {
  display: block;
  font-size: 10px;
  letter-spacing: -0.01em;
}
.mz-doc__page em {
  display: block;
  margin: 1px 0 8px;
  font-style: normal;
  font-size: 7px;
  color: #777;
}
.mz-doc__page i {
  display: block;
  height: 3px;
  margin-top: 4px;
  border-radius: 2px;
  background: #e3e3e3;
}
.mz-doc__page i:nth-of-type(2) { width: 82%; }
.mz-doc__page i:nth-of-type(3) { width: 90%; }
.mz-doc__page i:nth-of-type(4) { width: 60%; }
.mz-doc__row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
}
.mz-doc__icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 26px;
  height: 32px;
  border-radius: 3px;
  background: #e5484d;
  font-size: 7.5px;
  font-weight: 800;
  color: #fff;
}
.mz-doc__name {
  min-width: 0;
  font-size: 13.5px;
  line-height: 1.25;
}
.mz-doc__name small {
  display: block;
  margin-top: 2px;
  font-size: 11.5px;
  color: #8696a0;
}
/* Botones de respuesta rápida */
.mz-replies {
  flex: 0 0 auto;
  align-self: flex-start;
  display: grid;
  gap: 2px;
  width: 82%;
  margin-top: 2px;
  animation: mzMsgIn 0.32s var(--mz-ease) both;
}
.mz-replies span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 10px;
  border-radius: 8px;
  background: #202c33;
  font-size: 14.5px;
  color: #53bdeb;
  transition: background 0.25s ease;
}
.mz-replies span svg {
  width: 14px;
  height: 14px;
}
.mz-replies span.is-picked {
  background: #2a3942;
}
.mz-wa-input {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 12px 30px;
  background: #1f2c33;
  color: #e9edef;
}
.mz-wa-input svg {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
}
.mz-wa-field {
  flex: 1;
  display: flex;
  align-items: center;
  height: 34px;
  padding: 0 14px;
  border-radius: 18px;
  background: #2a3942;
  font-size: 14.5px;
  color: #8696a0;
}
.mz-ios-home {
  position: absolute;
  left: 50%;
  bottom: 8px;
  z-index: 4;
  width: 124px;
  height: 5px;
  border-radius: 3px;
  background: rgba(233, 237, 239, 0.9);
  transform: translateX(-50%);
}

/* — Ventana de la oficina (lo que pasa en la unidad Mozart) — */
.mz-office {
  position: absolute;
  left: 276px;
  right: 0;
  top: 66px;
  z-index: 1;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: #1c1d20;
  box-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.8), 0 40px 90px rgba(0, 0, 0, 0.55);
  overflow: hidden;
  font-family: var(--sys);
  -webkit-font-smoothing: antialiased;
}
.mz-win-bar {
  position: relative;
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 14px 0 52px;
  background: linear-gradient(#2a2b2f, #242528);
  border-bottom: 1px solid rgba(0, 0, 0, 0.55);
}
.mz-win-lights {
  display: flex;
  gap: 8px;
}
.mz-win-lights i {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ff5f57;
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.25);
}
.mz-win-lights i:nth-child(2) { background: #febc2e; }
.mz-win-lights i:nth-child(3) { background: #28c840; }
.mz-win-title {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.82);
  pointer-events: none;
}
.mz-win-body {
  padding: 14px 18px 16px 52px;
}
.mz-win-label {
  display: block;
  margin: 2px 0 6px 8px;
  font-size: 11.5px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.42);
}
.mz-team-list {
  display: grid;
  gap: 1px;
  margin: 0 0 14px;
  padding: 0;
  list-style: none;
}
.mz-agent {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 10px;
  padding: 7px 8px;
  border-radius: 8px;
  font-size: 13.5px;
  color: #f2f2f3;
  transition: background 0.4s ease, color 0.4s ease;
}
.mz-agent canvas {
  width: 22px;
  height: 22px;
  transition: opacity 0.5s ease;
}
.mz-agent em {
  font-style: normal;
  font-size: 12px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: rgba(255, 255, 255, 0.45);
  transition: color 0.4s ease;
}
.mz-agent.is-sleep {
  color: rgba(255, 255, 255, 0.55);
}
.mz-agent.is-sleep canvas {
  opacity: 0.32;
}
.mz-agent.is-working {
  background: rgba(255, 255, 255, 0.05);
}
.mz-agent.is-working em {
  color: var(--c);
}
.mz-agent__bar {
  grid-column: 2 / -1;
  display: none;
  height: 3px;
  margin-top: 7px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}
.mz-agent.is-working .mz-agent__bar {
  display: block;
}
.mz-agent__bar i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: 3px;
  background: var(--c);
}
.mz-log {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 10px;
  height: 196px;
  margin: 0;
  padding: 0 8px;
  list-style: none;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 40px);
  mask-image: linear-gradient(to bottom, transparent 0, #000 40px);
}
.mz-log li {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  column-gap: 9px;
  align-items: start;
  font-size: 12.5px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.68);
  animation: mzMsgIn 0.4s var(--mz-ease) both;
}
.mz-log b {
  font-weight: 600;
  color: #fff;
}
.mz-log time {
  font-size: 11.5px;
  font-variant-numeric: tabular-nums;
  color: rgba(255, 255, 255, 0.36);
}
.mz-av {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--c) 20%, transparent);
  font-size: 10px;
  font-weight: 700;
  color: var(--c);
}
@media (min-width: 1200px) and (max-width: 1399px) {
  .mz-phone {
    width: 300px;
  }
  .mz-office {
    left: 264px;
  }
}
@media (max-width: 1199px) {
  .mz-work__grid {
    grid-template-columns: 1fr;
  }
  .mz-stage {
    max-width: 780px;
  }
}
@media (max-width: 767px) {
  .mz-stage {
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .mz-phone {
    position: relative;
    width: min(312px, 86vw);
    height: 640px;
  }
  .mz-office {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    width: 100%;
    margin-top: -48px;
  }
  .mz-win-bar {
    padding-left: 14px;
  }
  .mz-win-body {
    padding: 12px 10px 14px;
  }
  .mz-log {
    height: 176px;
  }
}

/* Banda "Pídele algo a Mozart" (solo visible con número de demostración configurado) */
.mz-ask {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  flex-wrap: wrap;
  margin-top: clamp(70px, 8vw, 120px);
  padding: 34px 38px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(157, 188, 196, 0.16), transparent 55%),
    radial-gradient(120% 140% at 100% 100%, rgba(213, 142, 90, 0.14), transparent 55%),
    rgba(255, 255, 255, 0.03);
}
.mz-ask[hidden] {
  display: none;
}
.mz-ask h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: clamp(24px, 2.2vw, 32px);
  letter-spacing: -0.02em;
}
.mz-ask p {
  margin: 0;
  max-width: 560px;
  font-size: 16px;
  line-height: 1.55;
  color: var(--mz-dim);
}

/* ══ 4 · TU EQUIPO: cuatro roles, cada uno con su orbe ════════════════════ */
.mz-team {
  background: #0a0a0b;
}
.mz-team__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 40px;
  flex-wrap: wrap;
  margin-bottom: 60px;
}
.mz-team__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.mz-role {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 26px;
  border-radius: 22px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012));
  overflow: hidden;
  transition: transform 0.5s var(--mz-ease), border-color 0.4s ease;
}
.mz-role:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 255, 255, 0.14);
}
.mz-role__orb {
  position: relative;
  width: 116px;
  height: 116px;
  margin: 0 0 26px -8px;
}
/* Halo: luz difusa del color del rol, respira lento detrás del orbe de puntos */
.mz-halo {
  position: absolute;
  inset: -26px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--c) 60%, transparent) 0%, color-mix(in srgb, var(--c) 18%, transparent) 38%, transparent 66%);
  filter: blur(18px);
  opacity: 0.55;
  animation: mzHalo 7s ease-in-out infinite;
  pointer-events: none;
}
@keyframes mzHalo {
  0%, 100% { transform: scale(0.9); opacity: 0.42; }
  50% { transform: scale(1.08); opacity: 0.7; }
}
.mz-role__orb canvas {
  position: relative;
  display: block;
  width: 116px;
  height: 116px;
}
.mz-role__name {
  position: relative;
  margin: 0 0 10px;
  color: #fff;
  font-size: 23px;
  letter-spacing: -0.02em;
}
.mz-role__desc {
  position: relative;
  margin: 0;
  font-size: 15.5px;
  line-height: 1.55;
  color: var(--mz-dim);
}
/* Mensaje de ejemplo, con la forma real de una burbuja de WhatsApp */
.mz-bubble {
  position: relative;
  align-self: flex-start;
  max-width: calc(100% - 8px);
  margin: 26px 0 0 8px;
  padding: 7px 9px 8px 10px;
  border-radius: 9px;
  border-top-left-radius: 0;
  background: #202c33;
  font-family: var(--sys);
  font-size: 14px;
  line-height: 1.4;
  color: #e9edef;
  -webkit-font-smoothing: antialiased;
}
.mz-bubble::before {
  content: "";
  position: absolute;
  top: 0;
  left: -8px;
  width: 8px;
  height: 13px;
  background: #202c33;
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}
.mz-bubble time {
  display: block;
  margin-top: 2px;
  text-align: right;
  font-size: 11px;
  color: rgba(233, 237, 239, 0.55);
}
.mz-team__foot {
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
  margin-top: 46px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--mz-dim);
}
.mz-team__foot strong {
  color: #fff;
  font-weight: 500;
}
.mz-slots {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.mz-slots canvas {
  width: 22px;
  height: 22px;
}
.mz-slots i {
  width: 14px;
  height: 14px;
  margin: 0 4px;
  border-radius: 50%;
  border: 1px dashed rgba(255, 255, 255, 0.28);
}
@media (max-width: 1199px) {
  .mz-team__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .mz-team__grid {
    grid-template-columns: 1fr;
  }
}

/* ══ 5 · EL ORGANISMO: cinco mosaicos con animación mínima ═══════════════ */
.mz-bento {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
  margin-top: 64px;
}
.mz-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 300px;
  padding: 30px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: var(--mz-card);
  overflow: hidden;
}
.mz-tile--wide {
  grid-column: span 3;
}
.mz-tile--third {
  grid-column: span 2;
}
.mz-tile__name {
  margin: 0 0 10px;
  color: #fff;
  font-size: 30px;
  letter-spacing: -0.03em;
}
.mz-tile__text {
  margin: 0;
  max-width: 420px;
  font-size: 16px;
  line-height: 1.55;
  color: var(--mz-dim);
}
.mz-tile__viz {
  position: relative;
  margin-top: auto;
  padding-top: 28px;
}
.mz-tile:not(.is-in) * {
  animation-play-state: paused !important;
}
/* Interfaces reales dentro de los mosaicos: tipografía del sistema, nada de monoespaciada */
.mz-ui {
  line-height: 1.4;
  font-family: var(--sys);
  -webkit-font-smoothing: antialiased;
}
/* Pulso: monitor de estado, una barra por revisión de 5 minutos */
.mz-uptime__head,
.mz-uptime__foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.5);
}
.mz-uptime__ok {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: rgba(255, 255, 255, 0.85);
}
.mz-uptime__ok::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4fd6a8;
}
.mz-uptime__row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin-top: 9px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.78);
}
.mz-uptime__head + .mz-uptime__row {
  margin-top: 14px;
}
.mz-beats {
  display: grid;
  grid-template-columns: repeat(24, minmax(0, 1fr));
  gap: 3px;
}
.mz-beats i {
  height: 20px;
  border-radius: 2px;
  background: rgba(79, 214, 168, 0.5);
}
.mz-beats i.is-warn {
  background: #f2ab3c;
}
.mz-beats i.is-new {
  animation: mzBeatIn 0.7s var(--mz-ease) both;
}
@keyframes mzBeatIn {
  from { opacity: 0; transform: scaleY(0.2); }
  to { opacity: 1; transform: none; }
}
.mz-uptime__foot {
  margin-top: 14px;
  font-size: 12px;
}
.mz-uptime__foot b {
  font-weight: 500;
  color: #f2c27a;
}

/* Relevo: lista de procesos; un trabajador despierta, trabaja y vuelve a dormir */
.mz-task {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  font-size: 13px;
  color: #fff;
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity 0.45s ease, transform 0.45s var(--mz-ease);
}
.mz-task.is-on {
  opacity: 1;
  transform: none;
}
.mz-task small {
  margin-left: auto;
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.45);
}
.mz-procs {
  display: grid;
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.mz-procs__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}
.mz-cap {
  display: flex;
  gap: 4px;
}
.mz-cap i {
  width: 16px;
  height: 5px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.12);
  transition: background 0.4s ease;
}
.mz-cap i.on {
  background: rgba(255, 255, 255, 0.7);
}

/* Herencia: notas de la versión vigente */
.mz-release {
  padding: 16px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.035);
}
.mz-release__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.mz-app-icon {
  position: relative;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: radial-gradient(circle at 50% 40%, #23272b, #0d0e10 75%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.mz-app-icon canvas {
  width: 32px;
  height: 32px;
}
.mz-release__head strong {
  display: block;
  font-size: 14.5px;
  font-weight: 600;
  color: #fff;
}
.mz-release__head small {
  display: block;
  margin-top: 1px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}
.mz-release ul {
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.mz-release li {
  display: flex;
  gap: 10px;
  font-size: 13px;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.78);
}
.mz-release li i {
  margin-top: 4px;
  font-size: 11px;
  color: #4fd6a8;
}
.mz-release__foot {
  margin-top: 14px;
  padding-top: 11px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}

/* Tu sí: notificación del celular con acciones */
.mz-notif {
  position: relative;
  min-height: 178px;
}
.mz-notif__card {
  display: flex;
  gap: 11px;
  padding: 12px 14px 13px 12px;
  border-radius: 22px;
  background: rgba(64, 64, 68, 0.62);
  -webkit-backdrop-filter: blur(24px) saturate(170%);
  backdrop-filter: blur(24px) saturate(170%);
  box-shadow: inset 0 0 0 0.5px rgba(255, 255, 255, 0.08), 0 14px 34px rgba(0, 0, 0, 0.35);
  color: #fff;
  opacity: 0;
  transform: translateY(-16px) scale(0.98);
  transition: opacity 0.45s ease, transform 0.6s var(--mz-ease);
}
.mz-notif.is-in .mz-notif__card {
  opacity: 1;
  transform: none;
}
.mz-notif__card .mz-app-icon {
  width: 38px;
  height: 38px;
  border-radius: 9px;
}
.mz-notif__card .mz-app-icon canvas {
  width: 28px;
  height: 28px;
}
.mz-notif__top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  line-height: 1.2;
}
.mz-notif__top b {
  font-weight: 600;
}
.mz-notif__top time {
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.5);
}
.mz-notif__card p {
  margin: 2px 0 0;
  font-size: 14px;
  line-height: 1.32;
  color: rgba(255, 255, 255, 0.9);
}
.mz-notif__actions {
  margin-top: 8px;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(64, 64, 68, 0.62);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  opacity: 0;
  transform: translateY(-6px) scale(0.98);
  transition: opacity 0.4s ease, transform 0.5s var(--mz-ease);
}
.mz-notif.is-actions .mz-notif__actions {
  opacity: 1;
  transform: none;
}
.mz-notif__actions span {
  display: block;
  padding: 11px 15px;
  font-size: 15px;
  color: #fff;
  transition: background 0.2s ease;
}
.mz-notif__actions span + span {
  border-top: 0.5px solid rgba(255, 255, 255, 0.12);
  color: #ff6961;
}
.mz-notif__actions span.is-press {
  background: rgba(255, 255, 255, 0.16);
}
/* Sello (sin cambios) */
.mz-seal-rules {
  display: grid;
  gap: 8px;
}
.mz-seal-rules span {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.78);
  overflow: hidden;
}
.mz-seal-rules span i {
  color: var(--sk-coral);
  font-size: 11px;
}
.mz-seal-rules span::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 40%;
  left: -40%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.08), transparent);
  animation: mzShine 3.4s ease-in-out infinite;
}
.mz-seal-rules span:nth-child(2)::after { animation-delay: 0.3s; }
.mz-seal-rules span:nth-child(3)::after { animation-delay: 0.6s; }
@keyframes mzShine {
  to { left: 120%; }
}
.mz-fineprint {
  margin: 34px 0 0;
  max-width: 760px;
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--mz-faint);
}
@media (max-width: 1199px) {
  .mz-tile--wide,
  .mz-tile--third {
    grid-column: span 3;
  }
  .mz-tile--third:last-child {
    grid-column: span 6;
  }
}
@media (max-width: 767px) {
  .mz-bento {
    grid-template-columns: 1fr;
  }
  .mz-tile--wide,
  .mz-tile--third,
  .mz-tile--third:last-child {
    grid-column: auto;
    min-height: 0;
  }
}

/* ══ 6 · PRIVACIDAD: qué vive en tu oficina y qué viaja ═══════════════════ */
.mz-privacy__head {
  margin-bottom: clamp(44px, 5vw, 72px);
}
.mz-privacy__head .mz-h2 {
  max-width: 1120px;
}
.mz-privacy__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(40px, 6vw, 100px);
  align-items: center;
}
.mz-map {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) 70px minmax(0, 0.95fr);
  align-items: center;
}
.mz-office-box {
  position: relative;
  padding: 26px 22px 22px;
  border-radius: 24px;
  border: 1px dashed rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.025);
}
.mz-office-box__label {
  position: absolute;
  top: -11px;
  left: 20px;
  padding: 0 10px;
  background: #111;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mz-dim);
}
.mz-unit {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, #3a4a4f, #23292c 60%, #1a1d1f);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
}
.mz-unit .mz-wordmark {
  font-size: 18px;
}
.mz-unit small {
  margin-left: auto;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.55);
}
.mz-keeps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.mz-keeps li {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 11px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  font-size: 13.5px;
  line-height: 1.3;
  color: #fff;
}
.mz-keeps i {
  color: var(--mz-slate);
  font-size: 13px;
}
.mz-wires {
  position: relative;
  align-self: stretch;
}
.mz-wires span {
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.55) 0 6px, transparent 6px 12px);
  background-size: 24px 2px;
  animation: mzFlow 1.2s linear infinite;
  opacity: 0.6;
}
.mz-wires span:nth-child(1) { top: 18%; }
.mz-wires span:nth-child(2) { top: 50%; }
.mz-wires span:nth-child(3) { top: 82%; }
@keyframes mzFlow {
  to { background-position: 24px 0; }
}
.mz-ext {
  display: grid;
  gap: 12px;
}
.mz-ext__node {
  padding: 16px 16px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
}
.mz-ext__node strong {
  display: block;
  margin-bottom: 4px;
  color: #fff;
  font-size: 14.5px;
  font-weight: 600;
}
.mz-ext__node span {
  display: block;
  font-size: 13px;
  line-height: 1.45;
  color: var(--mz-dim);
}
.mz-privacy__points {
  margin: 34px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 14px;
}
.mz-privacy__points li {
  display: flex;
  gap: 14px;
  font-size: 16px;
  line-height: 1.55;
  color: var(--mz-dim);
}
.mz-privacy__points i {
  margin-top: 4px;
  color: var(--mz-slate);
}
@media (max-width: 1199px) {
  .mz-privacy__grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 767px) {
  .mz-map {
    grid-template-columns: 1fr;
  }
  .mz-wires {
    height: 46px;
  }
  .mz-wires span {
    top: 0 !important;
    bottom: 0;
    left: 50%;
    right: auto;
    width: 2px;
    height: auto;
    background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0 6px, transparent 6px 12px);
    background-size: 2px 24px;
    animation-name: mzFlowY;
  }
  .mz-wires span:nth-child(n + 2) {
    display: none;
  }
  @keyframes mzFlowY {
    to { background-position: 0 24px; }
  }
}

/* ══ 7 · HECHO PARA COLOMBIA ══════════════════════════════════════════════ */
.mz-local {
  overflow: hidden;
  background: #0a0a0b;
}
.mz-local__mark {
  position: absolute;
  right: -2vw;
  bottom: -0.18em;
  z-index: 0;
  font-family: var(--font_bdogrotesk);
  font-weight: 600;
  font-size: clamp(120px, 22vw, 380px);
  line-height: 1;
  letter-spacing: -0.05em;
  color: #fff;
  opacity: 0.045;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}
.mz-local .container {
  position: relative;
  z-index: 1;
}
.mz-local__coords {
  display: block;
  margin-top: 18px;
  font-family: var(--mz-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--mz-faint);
}
.mz-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 70px;
}
.mz-stat {
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
}
.mz-stat__num {
  display: block;
  color: #fff;
  font-family: var(--font_bdogrotesk);
  font-size: clamp(56px, 6.4vw, 104px);
  line-height: 0.95;
  letter-spacing: -0.05em;
}
.mz-stat__label {
  display: block;
  margin-top: 14px;
  max-width: 280px;
  font-size: 15.5px;
  line-height: 1.5;
  color: var(--mz-dim);
}
@media (max-width: 767px) {
  .mz-stats {
    grid-template-columns: 1fr;
    gap: 30px;
    margin-top: 50px;
  }
}

/* ══ 8 · PRUEBA: lo usamos en casa ═══════════════════════════════════════ */
.mz-home {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(30px, 5vw, 80px);
  align-items: center;
  padding: clamp(36px, 4vw, 60px);
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background:
    radial-gradient(80% 120% at 100% 0%, rgba(79, 214, 168, 0.1), transparent 60%),
    rgba(255, 255, 255, 0.03);
}
.mz-home__since {
  display: block;
  font-family: var(--font_bdogrotesk);
  font-size: clamp(48px, 6vw, 96px);
  line-height: 0.95;
  letter-spacing: -0.045em;
  color: #fff;
}
.mz-home__since small {
  display: block;
  margin-bottom: 14px;
  font-family: var(--font_dmsans);
  font-size: 13px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mz-faint);
}
.mz-home p {
  margin: 0 0 26px;
  font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.6;
  color: var(--mz-dim);
}
.mz-home p strong {
  color: #fff;
  font-weight: 500;
}
@media (max-width: 991px) {
  .mz-home {
    grid-template-columns: 1fr;
  }
}

/* ══ 9 · FRENTE A CONTRATAR: 168 contra 42 ═══════════════════════════════ */
.mz-week {
  margin-top: 60px;
  padding: clamp(22px, 3vw, 38px);
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.025);
}
.mz-week__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 30px;
  margin-bottom: 26px;
  font-size: 14.5px;
  color: var(--mz-dim);
}
.mz-week__legend span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.mz-week__legend i {
  width: 14px;
  height: 14px;
  border-radius: 4px;
}
.mz-week__legend .k-person {
  background: #fff;
}
.mz-week__legend .k-mz {
  background: var(--mz-grad);
}
.mz-week__legend b {
  color: #fff;
  font-weight: 500;
}
.mz-week__grid {
  display: grid;
  grid-template-columns: 26px repeat(24, 1fr);
  gap: 4px;
}
.mz-week__day {
  display: flex;
  align-items: center;
  font-family: var(--mz-mono);
  font-size: 11px;
  color: var(--mz-faint);
}
.mz-cell {
  min-width: 0;
  align-self: center; /* sin stretch: la altura sale del ancho, no al revés */
  aspect-ratio: 1.3;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.06);
  transition: background 0.45s ease, transform 0.45s var(--mz-ease);
}
.mz-week.is-person .mz-cell.p {
  background: #fff;
}
.mz-week.is-mozart .mz-cell:not(.p) {
  background: var(--mc, #9dbcc4); /* color por columna (pizarra → cobre), lo fija el JS */
}
.mz-week__hours {
  display: grid;
  grid-template-columns: 26px repeat(24, 1fr);
  gap: 4px;
  margin-top: 8px;
  font-family: var(--mz-mono);
  font-size: 10px;
  color: var(--mz-faint);
}
.mz-week__hours span {
  grid-column: span 6;
}
.mz-week__hours span:first-child {
  grid-column: 2 / span 6;
}
@media (max-width: 575px) {
  .mz-week__grid,
  .mz-week__hours {
    gap: 2px;
    grid-template-columns: 18px repeat(24, 1fr);
  }
  .mz-cell {
    border-radius: 2px;
  }
}

/* Comparación fila a fila. La columna de Mozart es una superficie un poco más clara,
   con luz en el borde superior; sin bordes de color ni brillos. */
.mz-vs {
  position: relative;
  display: grid;
  grid-template-columns: minmax(140px, 0.7fr) minmax(0, 1fr) minmax(0, 1fr);
  margin-top: 26px;
}
.mz-vs__row {
  display: contents;
}
.mz-vs__label,
.mz-vs__cell {
  position: relative;
  z-index: 1;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.mz-vs__label {
  padding: 26px 20px 26px 0;
  font-size: 13.5px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.5);
}
.mz-vs__cell {
  padding: 24px 30px;
  font-size: 16px;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.72);
}
.mz-vs__cell.is-mz {
  color: #fff;
  background: #1a1b1e;
  border-top-color: rgba(255, 255, 255, 0.06);
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.05), inset -1px 0 0 rgba(255, 255, 255, 0.05);
}
.mz-vs__head .mz-vs__cell.is-mz {
  border-radius: 24px 24px 0 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), inset 1px 0 0 rgba(255, 255, 255, 0.05), inset -1px 0 0 rgba(255, 255, 255, 0.05);
}
.mz-vs__foot .mz-vs__cell.is-mz {
  border-radius: 0 0 24px 24px;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.05), inset 1px 0 0 rgba(255, 255, 255, 0.05), inset -1px 0 0 rgba(255, 255, 255, 0.05);
}
.mz-vs__cell strong {
  display: block;
  margin-bottom: 6px;
  font-family: var(--font_bdogrotesk);
  font-size: clamp(24px, 2.2vw, 32px);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: #fff;
}
.mz-vs__cell:not(.is-mz) strong {
  color: rgba(255, 255, 255, 0.88);
}
.mz-vs__cell small {
  display: block;
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.45);
}
/* Cabecera */
.mz-vs__head .mz-vs__label,
.mz-vs__head .mz-vs__cell {
  border-top: 0;
}
.mz-vs__head .mz-vs__cell {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-top: 30px;
  padding-bottom: 22px;
}
.mz-vs__head h3 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -0.02em;
  color: #fff;
}
.mz-vs__head h3.mz-wordmark {
  font-size: 28px;
}
.mz-vs__head p {
  margin: 4px 0 0;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
}
.mz-vs__unit {
  display: block;
  width: 118px;
  height: auto;
  margin: -10px 0 12px -8px;
  mix-blend-mode: lighten;
}
.mz-vs__foot .mz-vs__label,
.mz-vs__foot .mz-vs__cell {
  border-top: 0;
}
.mz-vs__foot .mz-vs__cell.is-mz {
  padding-top: 4px;
  padding-bottom: 32px;
}
@media (max-width: 767px) {
  .mz-vs {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .mz-vs__head .mz-vs__cell.is-mz {
    border-radius: 18px 18px 0 0;
  }
  .mz-vs__foot .mz-vs__cell.is-mz {
    border-radius: 0 0 18px 18px;
  }
  .mz-vs__head .mz-vs__label,
  .mz-vs__foot .mz-vs__label,
  .mz-vs__foot .mz-vs__cell:not(.is-mz) {
    display: none;
  }
  .mz-vs__foot .mz-vs__cell.is-mz {
    grid-column: 2;
  }
  .mz-vs__label {
    grid-column: 1 / -1;
    padding: 18px 50% 2px 0;
    /* la columna de Mozart sigue continua detrás de la etiqueta */
    background: linear-gradient(90deg, transparent 50%, #1a1b1e 50%);
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.05);
  }
  .mz-vs__cell {
    padding: 10px 14px 18px;
    border-top: 0;
    font-size: 14.5px;
  }
  .mz-vs__head .mz-vs__cell {
    padding: 22px 14px 14px;
  }
  .mz-vs__unit {
    width: 86px;
  }
  .mz-vs__foot .mz-vs__cell .mz-btn {
    width: 100%;
    padding: 0 12px;
    font-size: 15px;
  }
}
.mz-sources {
  margin: 22px 0 0;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--mz-faint);
}

/* ══ 10 · PLANES Y PILOTO (sobre .pricing-stg del template) ══════════════ */
.mz-pilot {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(28px, 4vw, 60px);
  align-items: center;
  margin-bottom: 70px;
}
.mz-seal {
  position: relative;
  width: 168px;
  height: 168px;
  flex: 0 0 auto;
}
.mz-seal svg {
  width: 100%;
  height: 100%;
  animation: mzOrbit 22s linear infinite;
}
.mz-seal text {
  fill: rgba(255, 255, 255, 0.7);
  font-size: 10.6px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-family: var(--font_dmsans);
}
.mz-seal__core {
  position: absolute;
  inset: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--mz-grad);
  color: #0b0c0e;
  text-align: center;
  line-height: 1;
  box-shadow: 0 16px 50px rgba(213, 142, 90, 0.25);
}
.mz-seal__core b {
  font-family: var(--font_bdogrotesk);
  font-size: 46px;
  font-weight: 500;
  letter-spacing: -0.04em;
}
.mz-seal__core span {
  margin-top: 2px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.mz-pilot .mz-h2 {
  font-size: clamp(34px, 4vw, 64px);
}
.mz-pilot__metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}
.mz-pilot__metrics li {
  padding: 9px 16px;
  border-radius: 100px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05);
  font-size: 14px;
  color: rgba(255, 255, 255, 0.85);
}
.mz-pilot__terms {
  margin: 18px 0 0;
  font-size: 16px;
  line-height: 1.55;
  color: var(--mz-dim);
}
@media (max-width: 767px) {
  .mz-pilot {
    grid-template-columns: 1fr;
  }
  .mz-seal {
    width: 140px;
    height: 140px;
  }
  .mz-seal__core {
    inset: 24px;
  }
  .mz-seal__core b {
    font-size: 38px;
  }
}

.mz-plans .pricing-price .amount {
  font-size: 28px;
}
.mz-plans .pricing-price .per {
  display: block;
  margin: 6px 0 0;
}
.mz-plans .pricing-btn {
  cursor: pointer;
  font-family: inherit;
}
.mz-plans .pricing-features li {
  font-size: 14.5px;
}
.mz-plans .pricing-icon .mz-orb-sm {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 30%, rgba(255, 255, 255, 0.9), transparent 34%),
    radial-gradient(circle at 50% 55%, var(--c), color-mix(in srgb, var(--c) 30%, #000));
}
.mz-extras {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
  margin-top: 24px;
}
.mz-extra {
  padding: 26px 28px;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
}
.mz-extra h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 19px;
  letter-spacing: -0.01em;
}
.mz-extra p {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: var(--mz-dim);
}
@media (max-width: 767px) {
  .mz-extras {
    grid-template-columns: 1fr;
  }
}

/* Cohorte fundadora + unidad Mozart (próximamente) */
.mz-cohort {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  align-items: center;
  gap: 30px;
  margin-top: 70px;
  border-radius: 28px;
  border: 1px solid rgba(213, 142, 90, 0.3);
  background: #000;
  overflow: hidden;
}
.mz-cohort__img {
  position: relative;
  align-self: stretch;
  min-height: 320px;
}
.mz-cohort__img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 30% 50%;
  -webkit-mask-image: linear-gradient(to right, #000 60%, transparent);
  mask-image: linear-gradient(to right, #000 60%, transparent);
}
.mz-cohort__tag {
  display: block;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #e9b48c;
}
.mz-cohort__body {
  padding: 44px 44px 44px 0;
}
.mz-cohort__body h3 {
  margin: 14px 0 12px;
  color: #fff;
  font-size: clamp(28px, 2.8vw, 42px);
  line-height: 1.05;
  letter-spacing: -0.03em;
}
.mz-cohort__body p {
  margin: 0 0 26px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--mz-dim);
}
@media (max-width: 991px) {
  .mz-cohort {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .mz-cohort__img {
    min-height: 220px;
  }
  .mz-cohort__img img {
    -webkit-mask-image: linear-gradient(to bottom, #000 60%, transparent);
    mask-image: linear-gradient(to bottom, #000 60%, transparent);
  }
  .mz-cohort__body {
    padding: 0 28px 34px;
  }
}

/* ══ 11 · PARA LÍDERES ════════════════════════════════════════════════════ */
.mz-leaders {
  position: relative;
  padding: clamp(80px, 9vw, 130px) 0;
  background: #000;
  overflow: hidden;
}
.mz-leaders::before {
  content: "";
  position: absolute;
  right: -10vw;
  top: 50%;
  width: 46vw;
  aspect-ratio: 1;
  transform: translateY(-50%);
  border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, rgba(255, 125, 105, 0.35), rgba(255, 125, 105, 0.06) 45%, transparent 70%);
  filter: blur(10px);
  pointer-events: none;
}
.mz-leaders__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}
.mz-leaders .mz-eyebrow {
  color: color-mix(in srgb, var(--sk-coral) 80%, #fff);
}
.mz-leaders p {
  margin: 18px 0 0;
  max-width: 560px;
  font-size: 18px;
  line-height: 1.55;
  color: var(--mz-dim);
}

/* ══ 12 · FAQ (template) + CIERRE en fondo claro ═════════════════════════ */
.mz-faq .accordion-body p {
  font-size: 18px;
  line-height: 1.6;
}
.mz-close {
  position: relative;
  padding: clamp(90px, 10vw, 150px) 0;
  background: #f2f0eb;
  color: #111;
}
.mz-close__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: clamp(40px, 6vw, 100px);
  align-items: center;
}
.mz-close .mz-eyebrow {
  color: rgba(17, 17, 17, 0.5);
}
.mz-close h2 {
  margin: 0;
  color: #111;
  font-size: clamp(44px, 6vw, 100px);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.045em;
}
.mz-close__sub {
  margin: 26px 0 0;
  max-width: 520px;
  font-size: 18px;
  line-height: 1.6;
  color: rgba(17, 17, 17, 0.66);
}
.mz-close .mz-btn--xl {
  margin-top: 40px;
  min-height: 72px;
  padding: 0 40px;
  border-color: #111;
  background: #111;
  color: #fff;
  font-size: 18px;
}
.mz-close .mz-btn--xl:hover {
  background: #2a2c30;
  color: #fff;
}
.mz-close__note {
  margin: 18px 0 0;
  font-size: 14px;
  color: rgba(17, 17, 17, 0.55);
}
.mz-formcard {
  padding: clamp(26px, 3vw, 40px);
  border-radius: 26px;
  background: #111;
  color: #fff;
  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.18);
}
.mz-formcard h3 {
  margin: 0 0 6px;
  color: #fff;
  font-size: 24px;
  letter-spacing: -0.02em;
}
.mz-formcard > p {
  margin: 0 0 22px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--mz-dim);
}
@media (max-width: 991px) {
  .mz-close__grid {
    grid-template-columns: 1fr;
  }
}

/* ── Formulario de tres campos (cierre + modal) ── */
.mz-form {
  display: grid;
  gap: 12px;
}
.mz-field {
  position: relative;
}
.mz-field input {
  width: 100%;
  height: 58px;
  padding: 22px 16px 6px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
  font: inherit;
  font-size: 16px; /* 16px evita el zoom automático en iOS */
  transition: border-color 0.2s ease, background 0.2s ease;
}
.mz-field label {
  position: absolute;
  left: 17px;
  top: 19px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.5);
  pointer-events: none;
  transition: transform 0.2s ease, font-size 0.2s ease, color 0.2s ease;
  transform-origin: left top;
}
.mz-field input:focus,
.mz-field input:not(:placeholder-shown) {
  outline: none;
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.08);
}
.mz-field input:focus + label,
.mz-field input:not(:placeholder-shown) + label {
  transform: translateY(-11px);
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.6);
}
.mz-field input::placeholder {
  color: transparent;
}
.mz-field input[aria-invalid="true"] {
  border-color: #ff8a80;
}
/* Celular con indicativo (versión en español: Colombia, México, Panamá u otro país) */
.mz-tel {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 8px;
}
.mz-field select {
  width: 100%;
  height: 58px;
  padding: 22px 30px 6px 16px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23fff' stroke-opacity='.6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center / 12px;
  color: #fff;
  font: inherit;
  font-size: 16px;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.mz-field select:focus {
  outline: none;
  border-color: rgba(255, 255, 255, 0.5);
  background-color: rgba(255, 255, 255, 0.08);
}
.mz-field select + label {
  transform: translateY(-11px);
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.6);
}
.mz-field select option {
  color: #111;
  background: #fff;
}
.mz-consent {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  margin: 4px 0 2px;
  font-size: 12.5px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
}
.mz-consent input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  accent-color: #fff;
}
.mz-consent a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.mz-form__status {
  min-height: 18px;
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.7);
}
.mz-form__status.is-err {
  color: #ff9d94;
}
.mz-form__status a {
  color: #fff;
  text-decoration: underline;
}
.mz-form .mz-btn {
  margin-top: 4px;
  min-height: 58px;
}
.mz-form .mz-btn[disabled] {
  opacity: 0.6;
  pointer-events: none;
}
.mz-form__alt {
  margin: 4px 0 0;
  text-align: center;
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.55);
}
.mz-form__alt a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ══ CTA FIJO (fuera de #smooth-wrapper) ═════════════════════════════════ */
.mz-sticky {
  position: fixed;
  right: 82px;
  bottom: 20px;
  z-index: 950;
  display: flex;
  gap: 8px;
  padding: 7px;
  border-radius: 100px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(14, 16, 20, 0.62);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  backdrop-filter: blur(20px) saturate(160%);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
  transform: translateY(140%);
  opacity: 0;
  transition: transform 0.5s var(--mz-ease), opacity 0.4s ease;
}
.mz-sticky.is-visible {
  transform: none;
  opacity: 1;
}
.mz-sticky .mz-btn {
  min-height: 48px;
  padding: 0 22px;
  font-size: 15px;
}
.mz-sticky .mz-btn--ghost {
  border-color: transparent;
}
@media (max-width: 767px) {
  .mz-sticky {
    left: 12px;
    right: 12px;
    bottom: max(12px, env(safe-area-inset-bottom));
    border-radius: 22px;
  }
  .mz-sticky .mz-btn {
    flex: 1;
    padding: 0 12px;
  }
  .mz-sticky .mz-btn:first-child {
    flex: 1.5;
  }
  .mz-page .progress-wrap {
    display: none; /* con la barra fija, el "volver arriba" estorba en móvil */
  }
}

/* ══ MODAL (hoja inferior en móvil, tarjeta centrada en desktop) ═════════ */
.mz-modal {
  position: fixed;
  inset: 0;
  z-index: 1100;
  visibility: hidden;
}
.mz-modal.is-open {
  visibility: visible;
}
.mz-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.62);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity 0.35s ease;
}
.mz-modal.is-open .mz-modal__backdrop {
  opacity: 1;
}
.mz-modal__sheet {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(480px, calc(100% - 32px));
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 36px 32px 30px;
  border-radius: 26px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: linear-gradient(to bottom, rgba(24, 26, 30, 0.96), rgba(14, 16, 19, 0.98));
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.6);
  transform: translate(-50%, -46%) scale(0.97);
  opacity: 0;
  transition: transform 0.45s var(--mz-ease), opacity 0.35s ease;
}
.mz-modal.is-open .mz-modal__sheet {
  transform: translate(-50%, -50%);
  opacity: 1;
}
.mz-modal__close {
  position: absolute;
  top: 14px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  color: rgba(255, 255, 255, 0.7);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.mz-modal__close:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}
.mz-modal__title {
  margin: 0 0 6px;
  padding-right: 30px;
  color: #fff;
  font-size: 26px;
  line-height: 1.15;
  letter-spacing: -0.02em;
}
.mz-modal__sub {
  margin: 0 0 22px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--mz-dim);
}
@media (max-width: 575px) {
  .mz-modal__sheet {
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    width: 100%;
    max-height: 92vh;
    padding: 30px 20px max(24px, env(safe-area-inset-bottom));
    border-radius: 24px 24px 0 0;
    border-bottom: 0;
    transform: translateY(100%);
  }
  .mz-modal.is-open .mz-modal__sheet {
    transform: none;
  }
}
body.mz-lock {
  overflow: hidden;
}

/* Cursor custom del template: los nodos que crea el JS también lo heredan */
@media (hover: hover) and (pointer: fine) {
  .mz-chat *,
  .mz-log *,
  .mz-beats * {
    cursor: none;
  }
}

/* ══ Movimiento reducido ═════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .mz-page *,
  .mz-page *::before,
  .mz-page *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .mz-w {
    opacity: 1;
  }
}

/* El header oculto (.transformed) conserva su sombra y asoma sobre la sección clara del cierre */
.mz-page .header-sticky.transformed .header-area__inner {
  box-shadow: none;
}

/* Ajustes de piezas reales: tarjeta de notificación, unidad en el diagrama, íconos de planes */
.mz-notif__card > div {
  flex: 1;
  min-width: 0;
}
.mz-unit img {
  width: 34px;
  height: auto;
  margin: -6px 0 -6px -4px;
  mix-blend-mode: lighten;
}
.mz-plans .pricing-icon canvas {
  width: 32px;
  height: 32px;
}

/* Precios reales: entrada en el hero y pago único de implementación */
.mz-hero__price {
  margin: 26px 0 0;
  font-size: 15px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.62);
}
.mz-hero__price b {
  font-weight: 600;
  color: #fff;
}
.mz-hero__price + .mz-hero__alt {
  margin-top: 6px;
}
.mz-extra p.mz-extra__price {
  margin: 0 0 10px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.75);
}
.mz-extra__price b {
  font-family: var(--font_bdogrotesk);
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: #fff;
}
.mz-plans .pricing-price .amount {
  letter-spacing: -0.03em;
}
.mz-plans .pricing-setup {
  margin-top: 12px;
  font-size: 13px;
}