/* Itzú · «Menciones» sales page (funnel /menciones) — on top of deidades.css */
.mz-phone { position: relative; width: min(300px, 78vw); margin: 0 auto; aspect-ratio: 9 / 16; border-radius: 30px; background: #1d1916; padding: 9px; box-shadow: 0 2px 0 #e7dccb, 22px 34px 60px rgba(60,35,15,.34); transform: rotate(2deg); }
.mz-phone video { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 22px; background: #2b2622; }
.mz-phone button { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px 12px 14px; border: 0; border-radius: 999px; background: #fbf7f0; color: #8a2e1f; font: 700 15px/1 Inter, sans-serif; cursor: pointer; box-shadow: 0 10px 26px rgba(0,0,0,.35); white-space: nowrap; }
.mz-phone button span { width: 30px; height: 30px; border-radius: 50%; background: #8a2e1f; position: relative; flex: 0 0 auto; }
.mz-phone button span::after { content: ''; position: absolute; left: 12px; top: 8px; border: 7px solid transparent; border-left: 11px solid #fff; }
.mz-phone button:focus-visible { outline: 3px solid #f0b98a; outline-offset: 3px; }
.mz-phone.is-playing button, .mz-phone.is-playing .dz-badge { display: none; }
.mz-phone .dz-badge { right: -18px; top: 26px; }
.mz-turn { max-width: 62ch; margin-top: 14px; font-size: 19px; line-height: 1.5; }
.mz .dz-band--deep h2 { max-width: 24ch; }
.mz-steps li { background: #fff; }
@media (max-width: 820px) { .mz-phone { transform: none; width: min(260px, 70vw); } .mz-phone .dz-badge { right: -8px; } }

/* 13 nov v2 — the video is the first thing after the headline on phones and plays silently on its own; tap = with sound */
.mz-phone video { cursor: pointer; }
.mz-phone .dz-badge { width: 84px; height: 84px; font-size: 12px; }
@media (max-width: 820px) {
  .mz .dz-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .mz .dz-hero > div:first-child { display: contents; }
  .mz .dz-hero .dz-kick { order: 1; margin: 0; } .mz .dz-hero h1 { order: 2; }
  .mz .dz-hero .mz-phone { order: 3; margin: 8px auto 6px; }
  .mz .dz-hero .dz-lead { order: 4; margin: 6px 0 4px; } .mz .dz-hero .dz-ticks { order: 5; margin-bottom: 8px; }
  .mz .dz-hero .dz-cta { order: 6; justify-self: center; } .mz .dz-hero .dz-trust { order: 7; }
}

/* 13 nov v3 — explainer in the hero, the Radharani example in its own section */
.mz-ex { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: center; margin-top: 8px; }
.mz-phone--sm { width: min(230px, 62vw); transform: rotate(-2deg); box-shadow: 18px 28px 50px rgba(0,0,0,.35); }
.mz-phone--sm button { bottom: 18px; font-size: 14px; padding: 10px 16px 10px 12px; }
@media (max-width: 820px) { .mz-ex { grid-template-columns: minmax(0, 1fr); gap: 22px; } .mz-phone--sm { transform: none; margin: 0 auto; } }
.mz-ex { align-items: start; } .mz-ex .mz-turn { margin-top: 6px; }
