/* Modo reel: capa que se pone encima de una demo de kit-prospeccion.
   Quita la barra de "vista previa" y la nota de la falla, y añade la
   portada del día, la marca de agua y el cierre. No toca la demo original. */

:root {
  --mr-fondo: #0b0b0d;
  --mr-texto: #f4f1ec;
  --mr-suave: #a7a29a;
  --mr-acento: #ff7a1a;
}

/* Lo que nunca sale en un reel */
.pv,
.note-sec { display: none !important; }

/* En la sección del chat queda solo el celular: el texto de al lado habla de la falla */
.chat-sec .chat-copy { display: none !important; }
.chat-sec .phone { margin-left: auto; margin-right: auto; }

html { scrollbar-width: none; }
html::-webkit-scrollbar { display: none; }

/* Las animaciones de aparición se disparan antes, para que no queden huecos al bajar */
.rv { transition-duration: .45s !important; }

/* Portada y cierre */
.mr-capa {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; flex-direction: column; justify-content: center;
  padding: 0 9vw;
  background: radial-gradient(120% 70% at 50% 110%, rgba(255,122,26,.28), transparent 60%), var(--mr-fondo);
  color: var(--mr-texto);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  transition: opacity .6s ease;
  cursor: pointer;
}
.mr-capa.mr-fuera { opacity: 0; pointer-events: none; }
.mr-dia {
  font-size: clamp(56px, 22vw, 120px); font-weight: 900; line-height: .9;
  letter-spacing: -.03em;
}
.mr-dia span { color: var(--mr-acento); }
.mr-negocio {
  margin-top: 18px; font-size: clamp(22px, 7.5vw, 40px); font-weight: 800; line-height: 1.1;
}
.mr-zona { margin-top: 8px; font-size: clamp(15px, 4.6vw, 22px); color: var(--mr-suave); }
.mr-linea {
  margin-top: 28px; width: 0; height: 3px; background: var(--mr-acento);
  transition: width 1.6s ease;
}
.mr-capa.mr-viva .mr-linea { width: 64px; }
.mr-cierre-txt {
  font-size: clamp(30px, 10vw, 54px); font-weight: 900; line-height: 1.05; letter-spacing: -.02em;
}
.mr-cierre-txt span { color: var(--mr-acento); }
.mr-cierre-sub { margin-top: 16px; font-size: clamp(15px, 4.6vw, 22px); color: var(--mr-suave); }
/* Cierre escrito letra a letra */
.mr-cursor {
  display: inline-block; width: .08em; height: .9em; margin-left: .06em; vertical-align: -.08em;
  background: var(--mr-acento); animation: mr-parpadeo 1s steps(2) infinite;
}
@keyframes mr-parpadeo { 50% { opacity: 0; } }
.mr-cierre-txt .mr-escrito { color: var(--mr-texto); }
.mr-cierre-txt .mr-escrito span { color: var(--mr-acento); }
.mr-capa .mr-cierre-sub { opacity: 0; transform: translateY(8px); transition: opacity .5s, transform .5s; }
.mr-capa.mr-listo .mr-cierre-sub { opacity: 1; transform: none; }

/* Marca de agua */
.mr-marca {
  position: fixed; right: 14px; bottom: 84px; z-index: 9998;
  padding: 6px 10px; border-radius: 6px;
  background: rgba(11,11,13,.62); color: #fff;
  font: 600 12px/1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  backdrop-filter: blur(4px);
}
.mr-sin-puntero, .mr-sin-puntero * { cursor: none !important; }