/* ==========================================================================
   dreomar.com · la web pública (24-oct-2026) · tema Dre UI azul sobre liz.css
   Apple UI / iOS: el blanco lleva el peso, secciones con fondo propio (blanco · gris · cielo · noche),
   widgets que flotan, íconos de app, botones grandes. Azul Luz en la palabra clave. Cero amarillo.
   Celular primero: compacto y cuadrado, todo centrado. Las cabeceras con video van igual en escritorio: texto centrado arriba
   y el video a todo el ancho del contenedor debajo (nada de columnas texto | video).
   Las piezas del pago, el carrito y gracias (mt-*, mp-*, pv-*, transf-*) vienen de la base (abajo).
   ========================================================================== */

/* ── Suelo y secciones ─────────────────────────────────────────────────── */
html[data-zona="sitio"] body { background: #FFFFFF; }
.dw-web { overflow-x: clip; }
.dw-web .dos-columnas > *, .dw-hero-rejilla > *, .pago-rejilla > * { min-width: 0; }
.fondo-blanco { background: #FFFFFF; }
.fondo-suelo { background: var(--suelo); }
.fondo-cielo { background: linear-gradient(180deg, #E4F0FF 0%, #F5F9FF 100%); }
.fondo-noche { background: #000000; }
.oscuro { color: var(--texto); }
.dw-sec { padding-block: 32px; }
.dw-sec-chica { padding-block: 16px; }
@media (min-width: 768px) { .dw-sec { padding-block: 64px; } .dw-sec-chica { padding-block: 32px; } }
.dw-sub { margin: 26px 0 12px; font-size: 18px; font-weight: 750; letter-spacing: -0.02em; }
.dw-sub:first-child { margin-top: 0; }
.dw-h2 { font-size: 24px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.12; }
@media (min-width: 768px) { .dw-sub { font-size: 21px; } .dw-h2 { font-size: 30px; } }
.dw-centro { justify-content: center; text-align: center; margin-inline: auto; }
.dw-centro-texto { text-align: center; }
.chev { width: 18px; height: 18px; color: var(--texto-3); }
.solo-movil { display: inline-grid; }
@media (min-width: 1024px) { .barra .solo-movil { display: none; } }
.barra .sin-ancho { display: inline; }
@media (min-width: 1280px) { .barra .sin-ancho { display: none; } }

/* Filas de lista hechas con <span>: título y detalle en su línea */
.dw-web .fila .cuerpo .t, .dw-web .fila .cuerpo .s, .dw-menu .fila .cuerpo .t, .hoja .fila .cuerpo .t, .hoja .fila .cuerpo .s { display: block; }

/* ── Chip, encabezado, botones y confianza ─────────────────────────────── */
.dw-chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 650; line-height: 1; white-space: nowrap; color: var(--texto); background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 8px 18px -12px var(--sombra); }
.dw-chip .emoji { font-family: var(--letra-emoji); font-size: 14px; }
.oscuro .dw-chip { color: #FFFFFF; background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }
@media (min-width: 768px) { .dw-chip { height: 34px; padding: 0 14px; font-size: 13.5px; } }
.dw-cabeza { margin-bottom: 20px; text-align: center; }
.dw-cabeza .etiqueta { margin-bottom: 10px; }
.dw-cabeza .bajada { margin-top: 8px; }
@media (min-width: 768px) { .dw-cabeza { margin-bottom: 36px; } }
@media (min-width: 900px) { .dw-cabeza.izq { text-align: left; } .dw-cabeza.izq .etiqueta { justify-content: flex-start; } .dw-cabeza.izq .titulo, .dw-cabeza.izq .bajada { margin-inline: 0; text-align: left; } }
.dw-web .hero-bajada { margin: 12px auto 0; font-size: 16px; line-height: 1.5; color: var(--texto-2); max-width: 34rem; text-wrap: balance; }
@media (min-width: 768px) { .dw-web .hero-bajada { font-size: 19px; } }
.dw-botones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; justify-content: center; }
.dw-botones > * { flex: 0 1 auto; }
@media (max-width: 479px) { .dw-hero .dw-botones > .btn, .dw-hero .dw-botones > .btn-sec { flex: 1 1 100%; } }
/* (P1) en el celular, los botones apilados miden lo mismo en todos los bloques */
@media (max-width: 479px) {
  .dw-botones:not(.dw-columna) > .btn, .dw-botones:not(.dw-columna) > .btn-sec, .bloque-estado-acciones > .btn, .bloque-estado-acciones > .btn-sec { flex: 1 1 100%; justify-content: center; }
  .dw-botones.dw-columna > .btn { align-self: stretch; justify-content: center; }
}
.dw-hero .h1 br + em { display: block; text-wrap: balance; }
.dw-confianza { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: center; font-size: 13px; font-weight: 600; color: var(--texto-2); }
.dw-confianza li { display: inline-flex; align-items: center; gap: 6px; }
.dw-confianza svg { width: 16px; height: 16px; color: var(--acento); flex-shrink: 0; }
.dw-nota { display: block; margin-top: 10px; font-size: 12.5px; line-height: 1.5; color: var(--texto-2); text-align: center; }
.dw-nota svg { display: inline-block; width: 14px; height: 14px; vertical-align: -2px; margin-right: 5px; }
.dw-nota a { color: inherit; text-decoration: underline; }
.dw-cuenta { margin: 0 0 12px; font-size: 13.5px; font-weight: 600; color: var(--texto-2); }
.dw-pildora-precio { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 13.5px; font-weight: 750; background: rgba(255, 255, 255, .2); }

/* ── Barra, menú y pie ─────────────────────────────────────────────────── */
.dw-barra { background: color-mix(in srgb, #FFFFFF 82%, transparent); }
.dw-barra .dentro { height: 56px; }
.dw-marca { display: inline-flex; align-items: center; color: var(--texto); }
.dw-barra nav a { font-size: 13.5px; font-weight: 550; }
.dw-barra .acciones { gap: 6px; }
.dw-barra .redondo { width: 38px; height: 38px; }
.dw-barra .redondo .punto { background: var(--acento-boton); }
.dw-barra-cta { min-height: 36px; padding: 0 14px; font-size: 13.5px; }
@media (max-width: 359px) { .dw-marca .logo-liz .firma { display: none; } }
.dw-menu { max-height: calc(100vh - 56px - var(--alto-cinta)); overflow-y: auto; padding: 12px var(--margen) 24px; background: var(--suelo); }
.dw-menu a.fila { display: flex; padding: 11px 0; font-size: 16px; font-weight: 600; border-bottom: 0; justify-content: flex-start; }
.dw-menu .fila .cuerpo { flex: 1; }
.dw-pie { background: #FFFFFF; box-shadow: inset 0 1px 0 var(--linea); padding-block: 36px 40px; }
body:has([data-barra-fija]) .dw-pie { padding-bottom: 104px; }
@media (min-width: 768px) { body:has([data-barra-fija]) .dw-pie { padding-bottom: 40px; } }
.dw-pie .pie-frase { margin-top: 12px; max-width: 300px; color: var(--texto-2); }
.dw-pie-oficio { display: block; margin-top: 6px; font-size: 14px; font-weight: 550; color: var(--texto-2); }
.dw-pie-boton { padding: 0; border: 0; background: none; font: inherit; color: var(--texto-2); cursor: pointer; text-align: left; }
.dw-pie-boton:hover { color: var(--texto); }
.dw-pie h4 .emoji { font-size: 13px; letter-spacing: 0; margin-right: 2px; }
.dw-redes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 14px; }
.dw-red { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--texto-2); }
.dw-red .icono { width: 30px; height: 30px; }
.dw-red .icono svg { width: 16px; height: 16px; }
@media (max-width: 767px) { .dw-pie .columnas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 14px; } .dw-pie .pie-marca { grid-column: 1 / -1; } }

/* ── Héroe ─────────────────────────────────────────────────────────────── */
/* Portada, vitrinas, /mejora, /edito-tu-video (y su Ulloa Media) y /dreomar: el mismo esquema en todas las medidas.
   Chip, título, bajada, botón y confianza centrados arriba; el video (o la foto) debajo, en la misma .contenedor que el resto de la página. */
.dw-hero { background: #FFFFFF; padding: 28px 0 28px; }
.dw-hero-chico { padding: 32px 0 20px; }
.dw-hero-rejilla { display: grid; gap: 24px; }
.dw-hero-texto { text-align: center; }
.dw-hero-texto .etiqueta { justify-content: center; margin-bottom: 12px; }
.dw-hero-texto .dw-checks { width: fit-content; max-width: 100%; margin-inline: auto; }
.dw-hero .h1 em, .dw-um .titulo em { color: var(--luz-texto); }
@media (min-width: 1024px) { .dw-hero .h1 { font-size: clamp(52px, 4.2vw, 58px); } .dw-hero-chico .titulo { font-size: 52px; } }
@media (min-width: 900px) {
  .dw-hero { padding: 56px 0 40px; }
  .dw-hero-chico { padding: 56px 0 28px; }
  .dw-hero-rejilla { gap: 40px; }
}
/* La foto vertical de /dreomar va centrada debajo del texto, sin estirarse */
.dw-hero-foto img { width: 100%; max-width: 280px; margin-inline: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 28px; box-shadow: 0 40px 80px -40px rgba(17, 24, 39, .45); }
@media (min-width: 900px) { .dw-hero-foto img { max-width: 360px; } }

/* Vitrina: el héroe tipo App Store */
.dw-app { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 14px; }
.dw-sellos { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.dw-hero-precio { margin-top: 14px; }
.dw-hero-precio .precio { justify-content: center; }
.dw-hero .precio-bloque { align-items: center; }
.dw-web .precio-bloque { display: flex; flex-direction: column; gap: 4px; }
.dw-web .precio { align-items: center; gap: 8px; }
.dw-web .precio .insignia { height: 22px; font-size: 11.5px; }
.dw-web .cuotas-linea { font-size: 13px; color: var(--texto-2); }
.dw-web .oferta-hasta { display: flex; gap: 8px; align-items: center; font-size: 12.5px; color: var(--urgente); font-weight: 600; }
.dw-web .oferta-hasta svg { width: 14px; height: 14px; }

/* ── Video de venta (VSL) ──────────────────────────────────────────────── */
.dw-video { margin: 0; }
/* 16:9 a todo el ancho de su contenedor, con el radio de los widgets (22 en el celular, 28 en escritorio) */
.dw-video-marco { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radio-widget); overflow: hidden; background: #000; box-shadow: 0 0 0 1px var(--linea), 0 30px 60px -30px rgba(17, 24, 39, .55); }
.dw-video-marco video, .dw-video-marco iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; object-fit: contain; }
.dw-video-pildora { position: absolute; top: 12px; left: 12px; display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 650; pointer-events: none; }
.dw-video-pildora svg { width: 12px; height: 12px; }
@media (min-width: 768px) { .dw-video-pildora { top: 16px; left: 16px; height: 34px; padding: 0 14px; font-size: 13.5px; } }
.dw-video.jugando .dw-video-pildora { display: none; }
.dw-video figcaption { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 10px; font-size: 13px; font-weight: 600; color: var(--texto-2); }
.dw-video figcaption svg { width: 13px; height: 13px; color: var(--acento); }
.dw-video-error { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #FFFFFF; text-align: center; padding: 16px; background: radial-gradient(70% 70% at 50% 40%, #0B2A55 0%, #000 100%); }
.dw-video-error svg { width: 28px; height: 28px; color: var(--luz); }
/* 25-oct · VSL solo: vista previa muda en bucle + capa «Toca para escuchar» (o el play grande si no arranca solo). La capa vive
   DENTRO del marco (isolation): nunca pasa por encima de la barra de arriba, la barra de compra ni el aviso de cookies. */
.dw-video-marco { isolation: isolate; }
.dw-vsl-capa { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; width: 100%; padding: 12px; border: 0; margin: 0; cursor: pointer; font: inherit; color: #FFFFFF; background: radial-gradient(70% 80% at 50% 50%, rgba(0, 0, 0, .34) 0%, rgba(0, 0, 0, .12) 70%, rgba(0, 0, 0, .04) 100%); -webkit-tap-highlight-color: transparent; }
.dw-vsl-capa:focus-visible { outline: 3px solid var(--luz); outline-offset: -3px; }
.dw-vsl-boton { pointer-events: none; gap: 10px; border-radius: 999px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32), inset 0 -2px 0 rgba(0, 0, 0, .14), 0 0 0 6px rgba(15, 110, 240, .22), 0 18px 40px -14px rgba(0, 0, 0, .7); animation: dw-vsl-latido 2.4s var(--curva) infinite; }
.dw-vsl-boton svg { width: 20px; height: 20px; }
@media (hover: hover) { .dw-vsl-capa:hover .dw-vsl-boton { filter: brightness(1.08); } }
.dw-vsl-capa:active .dw-vsl-boton { transform: scale(.97); }
@keyframes dw-vsl-latido { 0%, 100% { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32), inset 0 -2px 0 rgba(0, 0, 0, .14), 0 0 0 6px rgba(15, 110, 240, .22), 0 18px 40px -14px rgba(0, 0, 0, .7); } 50% { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32), inset 0 -2px 0 rgba(0, 0, 0, .14), 0 0 0 12px rgba(15, 110, 240, .08), 0 18px 40px -14px rgba(0, 0, 0, .7); } }
.dw-vsl-play { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; color: #FFFFFF; background: var(--degradado-boton); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32), 0 0 0 6px rgba(15, 110, 240, .22), 0 18px 40px -14px rgba(0, 0, 0, .7); pointer-events: none; transition: transform .16s var(--curva); }
.dw-vsl-play svg { width: 26px; height: 26px; margin-left: 3px; }
.dw-vsl-capa:active .dw-vsl-play { transform: scale(.94); }
@media (min-width: 768px) { .dw-vsl-play { width: 76px; height: 76px; } .dw-vsl-play svg { width: 30px; height: 30px; } }
.dw-vsl-quieto .dw-vsl-capa { background: rgba(0, 0, 0, .12); }
.dw-vsl-previa .dw-video-pildora, .dw-vsl-sonando .dw-video-pildora { display: none; }
@media (max-width: 380px) { .dw-vsl-boton { min-height: 42px; padding: 0 16px; font-size: 14px; } }
@media (prefers-reduced-motion: reduce) { .dw-vsl-boton { animation: none; } }

/* ── Herramientas (dock) ───────────────────────────────────────────────── */
.dw-sec-dock { background: #FFFFFF; padding: 0 0 28px; }
.dw-dock { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 14px 12px; }
.dw-dock-t { font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-3); }
.dw-dock ul, .dw-logos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 16px; }
@media (max-width: 767px) { .dw-dock ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); justify-items: center; } } /* 4 + 4, como hoy (no 5 + 3) */
.dw-dock li, .dw-logos li { display: grid; justify-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; color: var(--texto-2); }
.dw-logo { width: 44px; height: 44px; border-radius: 28%; object-fit: cover; background: #FFFFFF; box-shadow: 0 0 0 1px var(--linea), 0 8px 16px -10px var(--sombra); }
@media (min-width: 768px) { .dw-dock { flex-direction: row; justify-content: center; gap: 24px; padding: 16px 24px; } .dw-logo { width: 48px; height: 48px; } }

/* ── Datos ─────────────────────────────────────────────────────────────── */
.dw-datos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
@media (min-width: 768px) { .dw-datos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; } }
.dw-datos:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dw-dato { display: flex; flex-direction: column; gap: 2px; padding: 14px; min-width: 0; }
.dw-dato b { font-size: 26px; font-weight: 800; letter-spacing: -0.035em; line-height: 1.05; }
.dw-dato span { font-size: 13px; line-height: 1.35; color: var(--texto-2); }
.dw-dato .dw-dato-r { font-size: 12px; font-weight: 650; color: var(--texto-3); }
@media (min-width: 768px) { .dw-dato { padding: 20px; } .dw-dato b { font-size: 34px; } }
/* Las 4 cifras de los cursos: en el celular, una fila compacta */
@media (max-width: 767px) { .dw-datos-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; } .dw-datos-4 .dw-dato { padding: 10px 6px; align-items: center; text-align: center; border-radius: 16px; } .dw-datos-4 .dw-dato b { font-size: 19px; } .dw-datos-4 .dw-dato span { font-size: 11px; } }
.dw-sec-datos { padding: 20px 0; }
@media (min-width: 768px) { .dw-sec-datos { padding: 40px 0; } }

/* ── Cursos: fila compacta en el celular, tarjeta en escritorio ─────────── */
.dw-cursos { display: grid; gap: 10px; }
.dw-curso { position: relative; display: grid; grid-template-columns: 116px minmax(0, 1fr); align-items: stretch; }
.dw-curso-foto { display: block; background: var(--widget-2); }
.dw-curso-foto picture, .dw-curso-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dw-curso-info { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 12px 14px; min-width: 0; }
.dw-curso-info .dw-sellos { justify-content: flex-start; }
.dw-curso-info .insignia { height: 21px; font-size: 11px; }
.dw-curso-t { font-size: 16px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.2; color: var(--texto); }
.dw-curso-meta { font-size: 12.5px; color: var(--texto-2); }
.dw-curso-precio .monto { font-size: 19px; }
.dw-curso-cta { display: none; }
@media (max-width: 899px) { .dw-curso-t::after { content: ""; position: absolute; inset: 0; } }
@media (min-width: 900px) {
  .dw-cursos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .dw-curso { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; }
  .dw-curso-foto { aspect-ratio: 16 / 9; }
  .dw-curso-info { padding: 18px 20px 20px; gap: 6px; }
  .dw-curso-t { font-size: 21px; }
  .dw-curso-precio { margin-top: 6px; }
  .dw-curso-precio .monto { font-size: 26px; }
  .dw-curso-cta { display: inline-flex; margin-top: auto; }
  .dw-curso-info > .dw-curso-precio { margin-bottom: 14px; }
}

/* ── Carriles (deslizan en el celular; rejilla en escritorio) ───────────── */
.dw-carril { display: grid; grid-auto-flow: column; grid-auto-columns: 84%; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; margin-inline: calc(-1 * var(--margen)); padding: 4px var(--margen) 18px; scroll-padding-inline: var(--margen); scrollbar-width: none; }
.dw-carril::-webkit-scrollbar { display: none; }
.dw-carril-item { scroll-snap-align: start; min-width: 0; display: flex; }
.dw-carril-item > * { flex: 1; }
@media (min-width: 640px) { .dw-carril { grid-auto-columns: 46%; } }
@media (min-width: 900px) { .dw-carril-3 { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; margin: 0; padding: 0; gap: 16px; } }

/* Clips de clase y pasos de la portada */
.dw-clip-caja { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.dw-clip-caja video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dw-sonido { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; color: #FFFFFF; }
.dw-sonido svg { width: 17px; height: 17px; }
.dw-sonido[aria-pressed="true"] { background: var(--acento-boton); }
.dw-clip-pildora { position: absolute; left: 10px; bottom: 10px; display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 650; }
.dw-paso, .dw-clip-tarjeta { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.dw-paso-texto, .dw-clip-texto { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px 18px 18px; flex: 1; }
.dw-paso-texto h3 { font-size: 19px; font-weight: 750; letter-spacing: -0.02em; }
.dw-paso-texto p, .dw-clip-texto p { font-size: 14.5px; line-height: 1.5; color: var(--texto-2); }
.dw-paso-texto .btn-sec { margin-top: auto; }
.dw-clip-k { font-size: 12px; font-weight: 650; color: var(--texto-3); }
.dw-clip-texto b { font-size: 17px; font-weight: 750; letter-spacing: -0.02em; }

/* ── Muro de virales ───────────────────────────────────────────────────── */
.dw-muro { display: grid; grid-auto-flow: column; grid-auto-columns: 42%; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; margin-inline: calc(-1 * var(--margen)); padding: 4px var(--margen) 18px; scroll-padding-inline: var(--margen); scrollbar-width: none; }
.dw-muro::-webkit-scrollbar { display: none; }
@media (min-width: 640px) { .dw-muro { grid-auto-columns: 28%; } }
@media (min-width: 1024px) { .dw-muro { grid-auto-columns: calc((100% - 40px) / 5); margin-inline: 0; padding-inline: 0; } }
.dw-reel { position: relative; margin: 0; aspect-ratio: 9 / 16; border-radius: 22px; overflow: hidden; background: #111; scroll-snap-align: start; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), 0 24px 48px -28px rgba(0, 0, 0, .9); }
.dw-reel video { width: 100%; height: 100%; object-fit: cover; }
.dw-reel-vistas { position: absolute; left: 8px; bottom: 8px; display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px; border-radius: 999px; font-size: 12.5px; font-weight: 750; font-variant-numeric: tabular-nums; }
.dw-reel-vistas svg { width: 11px; height: 11px; }

/* ── Dos columnas, «Sin humo», incluido y banda ─────────────────────────── */
.dw-dos { display: grid; gap: 12px; }
@media (min-width: 768px) { .dw-dos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
.dw-lista-t { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 750; }
.dw-lista-t svg { width: 20px; height: 20px; padding: 3px; border-radius: 999px; color: #FFFFFF; }
.dw-lista-no .dw-lista-t svg { background: var(--urgente); }
.dw-lista-si .dw-lista-t svg { background: var(--ok); }
.dw-lista-no ul, .dw-lista-si ul { list-style: none; margin: 8px 0 0; padding: 0; }
.dw-lista-no li, .dw-lista-si li { padding: 10px 0; font-size: 15px; line-height: 1.4; box-shadow: inset 0 1px 0 var(--linea); }
.dw-lista-no li { color: var(--texto-2); }
.dw-incluido { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 900px) { .dw-incluido { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } .dw-incluido:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); } .dw-incluido:has(> :nth-child(6)) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dw-inc { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px; color: var(--texto); }
.dw-inc.bisel { padding: 12px; } /* (I6) el bisel suma 2 px de borde: así el título queda a la misma altura que en las otras */
.dw-inc b { font-size: 15px; font-weight: 750; letter-spacing: -0.01em; line-height: 1.25; }
.dw-inc p { font-size: 13.5px; line-height: 1.45; color: var(--texto-2); }
.dw-inc .enlace { margin-top: auto; font-size: 13.5px; }
.dw-inc .insignia { height: 21px; font-size: 11px; }
@media (min-width: 768px) { .dw-inc { padding: 20px; } .dw-inc.bisel { padding: 18px; } }
.dw-banda { display: flex; align-items: center; gap: 14px; width: 100%; margin-top: 12px; border: 0; text-align: left; font: inherit; color: var(--texto); cursor: pointer; }
.dw-banda-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dw-banda-t b { font-size: 16px; font-weight: 750; letter-spacing: -0.01em; }
.dw-banda-t > span { font-size: 13.5px; line-height: 1.45; color: var(--texto-2); }
@media (max-width: 479px) { .dw-banda > .btn-sec { display: none; } }

/* ── Opiniones ─────────────────────────────────────────────────────────── */
@media (min-width: 900px) { .dw-carril-3.dw-max-3 > .dw-carril-item:nth-child(n+4), .dw-carril-3.dw-max-6 > .dw-carril-item:nth-child(n+7) { display: none; } }
.dw-opinion { margin: 0; display: flex; flex-direction: column; gap: 14px; }
.dw-opinion blockquote { margin: 0; font-size: 15px; line-height: 1.55; color: var(--texto); }
.dw-opinion figcaption { display: flex; align-items: center; gap: 10px; }
.dw-opinion figcaption > span { display: flex; flex-direction: column; }
.dw-opinion figcaption b { font-size: 14px; }
.dw-opinion figcaption span span { font-size: 12.5px; color: var(--texto-3); }
.dw-opinion .avatar { background: var(--degradado-boton); }

/* ── Preguntas ─────────────────────────────────────────────────────────── */
.dw-faq details { border-radius: 18px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 10px 24px -22px var(--sombra); padding: 0 16px; }
.dw-faq details + details { margin-top: 8px; }
.dw-faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 0; font-weight: 650; font-size: 15.5px; line-height: 1.35; }
.dw-faq summary::-webkit-details-marker { display: none; }
.dw-faq summary .mas { flex-shrink: 0; width: 26px; height: 26px; border-radius: 999px; display: grid; place-items: center; color: var(--acento); background: var(--acento-suave); transition: transform .25s var(--curva); }
.dw-faq summary .mas svg { width: 14px; height: 14px; }
.dw-faq details[open] summary .mas { transform: rotate(45deg); }
.dw-faq details p { padding-bottom: 16px; font-size: 15px; line-height: 1.6; color: var(--texto-2); }
.fondo-suelo .dw-faq details, .fondo-blanco .dw-faq details { background: var(--widget); }
.fondo-blanco .dw-faq details { background: var(--suelo); box-shadow: none; }
.dw-faq-portada .dw-faq + .dw-faq { margin-top: 8px; }
@media (max-width: 767px) { .dw-faq-portada .dw-faq:first-child details:nth-child(n+5), .dw-faq-portada .dw-faq + .dw-faq { display: none; } }
@media (min-width: 900px) { .dw-faq-portada { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; align-items: start; } .dw-faq-portada .dw-faq + .dw-faq { margin-top: 0; } .contenedor.estrecho:has(.dw-faq-portada) { max-width: calc(1104px + 2 * var(--margen)); } }
.dw-faq-grupo + .dw-faq-grupo { margin-top: 28px; }
.dw-faq-grupo { scroll-margin-top: calc(140px + var(--alto-cinta)); }
.dw-web section[id] { scroll-margin-top: calc(72px + var(--alto-cinta)); }

/* ── Cierre (noche) ────────────────────────────────────────────────────── */
.dw-cierre-rejilla { display: grid; gap: 24px; align-items: center; }
.dw-cierre-foto { position: relative; max-width: 360px; margin-inline: auto; width: 100%; }
.dw-cierre-foto img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 28px; }
.dw-cierre-pildora { position: absolute; left: 12px; bottom: 12px; display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 650; }
.dw-cierre-texto { text-align: center; }
.dw-frase { margin-top: 14px; font-size: 26px; font-weight: 800; letter-spacing: -0.035em; line-height: 1.12; color: var(--texto); text-wrap: balance; }
.dw-frase em { font-style: normal; color: var(--luz); }
.dw-firma { margin-top: 10px; font-size: 14px; color: var(--texto-2); }
@media (min-width: 900px) { .dw-cierre-rejilla { grid-template-columns: .85fr 1.15fr; gap: 56px; } .dw-cierre-foto { max-width: none; } .dw-cierre-texto { text-align: left; } .dw-cierre-texto .dw-botones { justify-content: flex-start; } .dw-frase { font-size: 42px; } }
.dw-cifras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
.dw-cifras > div, .dw-cifras > a { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 16px; color: var(--texto); background: rgba(255, 255, 255, .07); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); text-align: left; }
.dw-cifras b { font-size: 24px; font-weight: 800; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.dw-cifras span { font-size: 12.5px; color: var(--texto-2); }
.dw-cifras small { font-size: 11.5px; color: var(--texto-3); }
.dw-cifras.chicas > div { background: var(--widget-2); box-shadow: none; padding: 10px 12px; }
.dw-cifras.chicas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.dw-cifras.chicas b { font-size: 20px; }
@media (min-width: 768px) { .dw-cifras { grid-template-columns: repeat(4, minmax(0, 1fr)); } .dw-cifras.grandes b { font-size: 36px; } .dw-cifras.chicas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* 29-oct: con TikTok al lado de Instagram hay 5 cifras (Quién soy, cierre) y 4 en el profesor: sin huecos en ningún ancho */
.dw-cifras.chicas:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 767px) { .dw-cifras:not(.chicas):has(> :nth-child(5):last-child) > :last-child { grid-column: 1 / -1; } }
@media (min-width: 768px) { .dw-cifras:has(> :nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); } .dw-cifras.chicas:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.dw-cierre-lista { max-width: 560px; margin: 18px auto 0; text-align: left; }

/* ── Portada como dreomar.com (24-oct): piezas que vuelven ─────────────── */
@media (max-width: 899px) { .dw-solo-ancho { display: none !important; } }
@media (min-width: 900px) { .dw-solo-angosto { display: none !important; } }
.dw-columna { flex-direction: column; align-items: center; }
.emoji, .dw-dock-t .emoji, .dw-reel-vistas .emoji { font-family: var(--letra-emoji); }
/* Hero: los flotantes «+1B vistas generadas» y «+1,000 creadores formados» (desde 1360 px) */
.dw-hero-video { position: relative; }
.dw-flotante { display: none; }
@media (min-width: 1360px) {
  .dw-flotante { position: absolute; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 12px 18px 12px 12px; border-radius: 18px; box-shadow: 0 0 0 1px var(--linea), 0 24px 48px -20px rgba(17, 24, 39, .45); animation: dw-flota 6s ease-in-out infinite; }
  /* Como la portada de hoy: «+1B» arriba a la izquierda y «+1,000» abajo a la derecha; con el video sonando se apartan (no lo tapan) */
  .dw-flotante { transition: opacity .3s ease; }
  .dw-flotante-1 { left: -72px; top: 16%; }
  .dw-flotante-2 { right: -72px; bottom: 18%; animation-delay: -3s; }
  .dw-hero-video:has(.jugando) .dw-flotante { opacity: 0; pointer-events: none; }
  .dw-flotante b { display: block; font-size: 22px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; }
  .dw-flotante span span { display: block; font-size: 12.5px; color: var(--texto-2); }
}
@keyframes dw-flota { 50% { transform: translateY(-6px); } }
@media (prefers-reduced-motion: reduce) { .dw-flotante { animation: none; } }
/* Tarjetas de curso de la portada: ícono, descripción, «Ahorras» y la fila del celular con su chevron */
.dw-curso-foto { position: relative; }
.dw-curso-sello { position: absolute; left: 8px; bottom: 8px; }
.dw-curso-sello .icono { width: 30px; height: 30px; border-radius: 9px; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .55); }
.dw-curso-sello .icono svg { width: 16px; height: 16px; }
.dw-curso-cabeza { display: flex; align-items: center; gap: 12px; min-width: 0; }
.dw-curso-cabeza .icono { width: 44px; height: 44px; border-radius: 13px; flex-shrink: 0; }
.dw-curso-desc { margin: 2px 0 0; font-size: 14px; line-height: 1.45; color: var(--texto-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.9em; }
.dw-ahorras { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 11.5px; font-weight: 700; color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.dw-curso-portada { grid-template-columns: 116px minmax(0, 1fr) 30px; }
.dw-curso-chevron { align-self: center; color: var(--texto-3); }
.dw-curso-chevron svg { width: 18px; height: 18px; }
/* (C1 de la auditoría de diseño) el precio de la tarjeta no salta de línea; el «−50%», como en la vieja, desde 430 px */
@media (max-width: 899px) {
  .dw-curso-precio .precio { flex-wrap: nowrap; gap: 6px; }
  .dw-curso-precio .monto { font-size: 18px; white-space: nowrap; }
  .dw-curso-precio .antes { font-size: 12.5px; white-space: nowrap; }
  .dw-curso-precio .insignia { height: 20px; padding: 0 7px; font-size: 11px; flex-shrink: 0; }
  .dw-curso-portada { grid-template-columns: 116px minmax(0, 1fr) 24px; }
}
/* (I4) las 4 cifras de la portada en el celular: «11h 44m» en una línea */
@media (max-width: 767px) { .dw-datos-4 .dw-dato { padding: 10px 4px; } .dw-datos-4 .dw-dato b { font-size: 16px; white-space: nowrap; letter-spacing: -0.04em; } }
@media (max-width: 429px) { .dw-curso-portada .dw-curso-precio .insignia { display: none; } }
@media (min-width: 900px) {
  .dw-curso-portada { grid-template-columns: minmax(0, 1fr); }
  .dw-curso-portada .dw-curso-info > .dw-curso-precio { margin-bottom: 4px; }
  .dw-curso-portada .dw-ahorras { margin-bottom: 14px; }
}
/* 4. Precio y garantía de CapCut PC */
.dw-pc-caja { display: grid; gap: 16px; }
@media (min-width: 900px) { .dw-pc-caja { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; padding: 28px; } }
.dw-pc-izq { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; min-width: 0; }
.dw-pc-cabeza { display: flex; align-items: center; gap: 12px; }
.dw-pc-k { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 650; color: var(--texto-2); }
.dw-pc-t { font-size: 22px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; }
.dw-pc-chip { display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px 0 4px; border-radius: 999px; font-size: 13px; font-weight: 650; background: var(--widget-2); }
.dw-pc-chip .icono { border-radius: 999px; }
.dw-pc-monto { font-size: 56px; font-weight: 800; letter-spacing: -0.045em; line-height: 1; color: var(--ok); }
@media (min-width: 768px) { .dw-pc-monto { font-size: 68px; } }
.dw-pc-antes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.dw-pc-antes s { font-size: 14px; color: var(--texto-3); }
.dw-pc-antes .insignia { height: 22px; font-size: 11.5px; }
.dw-pc-boton { width: 100%; margin-top: 4px; }
.dw-pc-linea { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin: 0; font-size: 13px; color: var(--texto-2); }
.dw-pc-linea svg { width: 14px; height: 14px; color: var(--acento); }
.dw-pc-der { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.dw-pc-incluye { flex: 1; padding: 16px; }
.dw-pc-incluye .lista { margin-top: 8px; }
.dw-pc-garantia { display: flex; align-items: center; gap: 14px; padding: 16px; }
.dw-pc-garantia > span:last-child { display: flex; flex-direction: column; gap: 3px; }
.dw-pc-garantia b { font-size: 18px; font-weight: 750; letter-spacing: -0.02em; }
.dw-pc-garantia span span { font-size: 14px; line-height: 1.45; color: var(--texto-2); }
/* 5. Muro de virales que pasa solo (como el de dreomar.com): 1 fila en el celular, 2 en sentidos opuestos desde 768 px */
.dw-muro-mq { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
@media (max-width: 767px) { .dw-muro-mq { margin-inline: calc(-1 * var(--margen)); } .dw-mq-ancho { display: none; } }
@media (min-width: 768px) { .dw-mq-movil { display: none; } .dw-mq-ancho { display: grid; gap: 18px; } }
.dw-mq-fila { display: flex; width: max-content; }
.dw-mq-pista { display: flex; flex-shrink: 0; gap: 16px; padding: 4px 16px 4px 0; animation: dw-mq 60s linear infinite; }
.dw-mq-pista.inv { animation-name: dw-mq-inv; animation-delay: -7.5s; }
@keyframes dw-mq { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@keyframes dw-mq-inv { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@media (hover: hover) { .dw-muro-mq:hover .dw-mq-pista { animation-play-state: paused; } }
.dw-mq-i { flex-shrink: 0; }
.dw-mq-i .dw-reel { width: 100%; border-radius: 20px; scroll-snap-align: none; }
.dw-mq-i .dw-reel-vistas { left: 50%; bottom: 8px; transform: translateX(-50%); white-space: nowrap; gap: 4px; padding: 0 9px; font-size: 12px; }
@media (min-width: 768px) { .dw-mq-i .dw-reel { border-radius: 24px; } .dw-mq-i .dw-reel-vistas { bottom: 12px; height: 30px; padding: 0 11px; font-size: 13px; } }
/* Portada, como la de hoy: cada viral en su iPhone (aro oscuro y la isla arriba), el mismo aro que los teléfonos del pack */
.dw-virales-portada .dw-mq-i { padding: 6px 0; }
.dw-virales-portada .dw-mq-i .dw-reel { box-shadow: 0 0 0 4px #1C1C1E, 0 0 0 5px rgba(255, 255, 255, .14), 0 24px 48px -28px rgba(0, 0, 0, .9); }
.dw-virales-portada .dw-mq-i .dw-reel::before { content: ""; position: absolute; z-index: 2; top: 7px; left: 50%; width: 32%; height: 13px; border-radius: 999px; background: #000; transform: translateX(-50%); pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
  .dw-mq-pista { animation: none; }
  .dw-mq-pista[aria-hidden], .dw-mq-i[aria-hidden] { display: none; }
  .dw-muro-mq { overflow-x: auto; scrollbar-width: none; -webkit-mask-image: none; mask-image: none; }
  .dw-mq-movil, .dw-mq-ancho > .dw-mq-fila { overflow-x: auto; scrollbar-width: none; }
}
/* 6. Pack de Subtítulos CapCut */
.dw-pack-rejilla { display: grid; gap: 14px; align-items: center; }
.dw-pack-texto { display: contents; }
.dw-pack-videos { margin-block: 10px; }
.dw-pack-texto > *, .dw-pack-videos { min-width: 0; }
@media (max-width: 899px) {
  .dw-pack-chips, .dw-pack-bajada { justify-content: center; text-align: center; }
  .dw-pack-titulo { flex-direction: column; text-align: center; }
  .dw-pack-compra .dw-pack-precio, .dw-pack-compra .btn { flex: 1 1 100%; }
  .dw-pack-chips { order: 1; } .dw-pack-titulo { order: 2; } .dw-pack-bajada { order: 3; } .dw-pack-videos { order: 4; } .dw-pack-ahora { order: 5; } .dw-pack-pasos { order: 6; } .dw-pack-compra { order: 7; }
}
@media (min-width: 900px) {
  .dw-pack-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 48px; row-gap: 14px; align-items: start; }
  .dw-pack-texto > * { grid-column: 1; }
  .dw-pack-videos { grid-column: 2; grid-row: 1 / span 6; align-self: center; margin-block: 0; }
}
.dw-pack-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dw-chip-logo { width: 18px; height: 18px; border-radius: 5px; }
.dw-pack-titulo { display: flex; align-items: center; gap: 14px; }
.dw-pack-caja { width: 64px; height: auto; flex-shrink: 0; filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .3)); }
.dw-pack-titulo .dw-h2 { font-size: 30px; }
@media (min-width: 768px) { .dw-pack-caja { width: 84px; } .dw-pack-titulo .dw-h2 { font-size: 40px; } }
.dw-pack-bajada { font-size: 16px; line-height: 1.5; color: var(--texto-2); }
.dw-pack-ahora { display: flex; align-items: center; gap: 8px; padding: 8px; }
.dw-pack-ahora > div { flex: 1; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: var(--widget-2); }
.dw-pack-ahora small { display: block; font-size: 12px; color: var(--texto-3); }
.dw-pack-ahora s { font-size: 18px; font-weight: 750; color: var(--texto-2); }
.dw-pack-ahora b { font-size: 20px; font-weight: 800; color: var(--ok); }
.dw-pack-flecha { display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; border-radius: 50%; color: #FFFFFF; background: var(--acento-boton); }
.dw-pack-flecha svg { width: 14px; height: 14px; }
.dw-pack-compra { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.dw-pack-precio { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 10px 16px; }
.dw-pack-precio small { font-size: 12px; color: var(--texto-3); }
.dw-pack-precio .precio { display: flex; align-items: center; gap: 8px; }
.dw-pack-precio .monto { font-size: 24px; font-weight: 800; color: var(--ok); }
.dw-pack-precio .antes { font-size: 12.5px; color: var(--texto-3); }
.dw-pack-precio .insignia { height: 21px; font-size: 11px; }
.dw-pack-compra .btn { flex: 1 1 180px; }
.dw-pack-videos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; width: 100%; max-width: 460px; margin-inline: auto; }
.dw-pack-tel { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.dw-pack-tel .dw-reel { width: 100%; border-radius: 30px; box-shadow: 0 0 0 5px #1C1C1E, 0 0 0 6px rgba(255, 255, 255, .14), 0 30px 60px -30px rgba(0, 0, 0, .7); }
/* 7 y 11. «Te llevas más que clases» y «Y además, incluido»: tarjetas con su miniatura */
@media (min-width: 768px) { .dw-incluido.dw-incluido-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.dw-inc-mini > p { margin-bottom: 6px; }
.dw-mini-caja { width: 100%; margin-top: auto; padding: 10px; border-radius: 14px; background: var(--widget-2); }
.dw-mini-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.dw-mini-tiles li { display: grid; place-items: center; min-height: 52px; padding: 6px 4px; border-radius: 10px; text-align: center; font-size: 11.5px; font-weight: 650; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-mini-pasos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.dw-mini-pasos li { display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 650; }
.dw-mini-pasos .icono, .dw-mini-aviso .icono, .dw-mini-prompt .icono { border-radius: 7px; }
.dw-mini-aviso { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-mini-aviso > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.dw-mini-aviso b { font-size: 13px; }
.dw-mini-aviso span span { font-size: 11.5px; color: var(--texto-3); }
.dw-mini-prompt { display: flex; align-items: center; gap: 10px; }
.dw-mini-prompt code { flex: 1; font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--texto-2); white-space: normal; }
.dw-mini-mes { display: grid; grid-template-columns: 1fr 1fr; text-align: center; }
.dw-mini-mes > span { display: flex; flex-direction: column; gap: 2px; padding: 4px; }
.dw-mini-mes > span + span { box-shadow: inset 1px 0 0 var(--linea); }
.dw-mini-mes b { font-size: 18px; font-weight: 800; letter-spacing: -0.02em; }
.dw-mini-mes > span:first-child b { color: var(--ok); }
.dw-mini-mes small { font-size: 11.5px; color: var(--texto-3); }
.dw-mini-chat { display: flex; flex-direction: column; gap: 6px; }
.dw-mini-chat span { align-self: flex-start; max-width: 90%; padding: 6px 10px; border-radius: 14px; font-size: 12.5px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-mini-chat .yo { align-self: flex-end; color: #FFFFFF; background: var(--acento-boton); box-shadow: none; }
.dw-banda-n { font-size: 28px; font-weight: 800; letter-spacing: -0.035em; vertical-align: -2px; }
.dw-banda .btn-sec svg { width: 15px; height: 15px; }
.dw-lista-t .insignia { margin-left: auto; height: 22px; font-size: 11.5px; }
/* 8. Así se ve cada curso por dentro: carril en el celular; zigzag con línea de tiempo en escritorio */
.dw-pasos2 { display: grid; grid-auto-flow: column; grid-auto-columns: 84%; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; margin-inline: calc(-1 * var(--margen)); padding: 4px var(--margen) 18px; scroll-padding-inline: var(--margen); scrollbar-width: none; }
.dw-pasos2::-webkit-scrollbar { display: none; }
@media (min-width: 640px) { .dw-pasos2 { grid-auto-columns: 46%; } }
.dw-paso2 { scroll-snap-align: start; display: flex; flex-direction: column; min-width: 0; border-radius: var(--radio-widget); overflow: hidden; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 10px 24px -22px var(--sombra); }
.dw-paso2-texto { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px 18px 18px; flex: 1; min-width: 0; }
.dw-paso2-texto h3 { font-size: 19px; font-weight: 750; letter-spacing: -0.02em; }
.dw-paso2-filas { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.dw-paso2-filas li { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; line-height: 1.45; color: var(--texto-2); }
.dw-paso2-filas .icono { width: 24px; height: 24px; border-radius: 7px; flex-shrink: 0; margin-top: 1px; }
.dw-paso2-filas .icono svg { width: 13px; height: 13px; }
.dw-paso2-texto > .btn.ancho, .dw-paso2-texto > .btn-sec { margin-top: auto; }
.dw-paso2-cab { display: inline-flex; align-items: center; gap: 10px; }
.dw-paso2-cab .icono { border-radius: 10px; }
.dw-paso2-n { position: absolute; left: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 11px; border-radius: 999px; font-size: 12.5px; font-weight: 650; }
.dw-paso2-minis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.dw-mini { display: flex; flex-direction: column; gap: 6px; padding: 0; border: 0; background: none; font: inherit; text-align: left; color: var(--texto); cursor: pointer; }
.dw-mini-img { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000000; box-shadow: 0 0 0 1px var(--linea); }
.dw-mini-img img { width: 100%; height: 100%; object-fit: cover; opacity: .82; transition: opacity .2s var(--curva); }
.dw-mini:hover .dw-mini-img img { opacity: 1; }
.dw-mini-img svg { position: absolute; left: 50%; top: 50%; width: 32px; height: 32px; padding: 9px; transform: translate(-50%, -50%); border-radius: 50%; color: #FFFFFF; background: rgba(0, 0, 0, .55); }
.dw-mini-t { font-size: 13px; font-weight: 650; }
@media (min-width: 768px) {
  .dw-pasos2 { position: relative; grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; scroll-snap-type: none; margin: 0; padding: 0; gap: 56px; }
  .dw-pasos2::before { content: ""; position: absolute; left: 50%; top: 48px; bottom: 48px; width: 2px; transform: translateX(-1px); border-radius: 2px; background: linear-gradient(180deg, var(--luz), var(--lila), var(--turquesa)); opacity: .55; }
  .dw-paso2 { display: grid; grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr); gap: 32px; align-items: center; overflow: visible; border-radius: 0; background: none; box-shadow: none; }
  .dw-paso2-texto { grid-column: 1; grid-row: 1; padding: 0; }
  .dw-paso2-ico { grid-column: 2; grid-row: 1; justify-self: center; position: relative; z-index: 1; border-radius: 22px; box-shadow: 0 0 0 8px var(--fondo-sec, #FFFFFF); }
  .dw-paso2-media { grid-column: 3; grid-row: 1; min-width: 0; }
  .dw-paso2.par .dw-paso2-texto { grid-column: 3; }
  .dw-paso2.par .dw-paso2-media { grid-column: 1; }
  .dw-paso2-media .dw-clip-caja { border-radius: var(--radio-widget); box-shadow: 0 0 0 1px var(--linea), 0 30px 60px -34px rgba(17, 24, 39, .55); }
  .dw-paso2 .dw-clip-pildora { top: 12px; bottom: auto; left: 12px; }
  .dw-paso2-n { left: 12px; bottom: 12px; }
  .dw-paso2-texto h3 { font-size: 28px; letter-spacing: -0.03em; }
  .dw-paso2-filas li { font-size: 15.5px; }
}
.fondo-blanco .dw-paso2-ico { --fondo-sec: #FFFFFF; }
html[data-theme="dark"] .fondo-blanco .dw-paso2-ico { --fondo-sec: #000000; }
/* 9. Con qué vas a trabajar */
.dw-apps3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dw-app3 { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 26px 16px 16px; text-align: center; color: var(--texto); }
.dw-app3-logo { width: 72px; height: 72px; margin-bottom: 10px; border-radius: 22%; object-fit: cover; box-shadow: 0 0 0 1px var(--linea), 0 14px 28px -16px var(--sombra); }
.dw-app3 > b { font-size: 19px; font-weight: 750; letter-spacing: -0.02em; }
.dw-app3 > span { font-size: 14px; color: var(--texto-2); }
.dw-app3-ins { position: absolute; top: 14px; right: 14px; height: 22px; font-size: 11px; }
.dw-app3 > .dw-app3-pie { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; margin-top: 16px; padding: 8px 8px 8px 12px; border-radius: 12px; font-size: 12.5px; font-weight: 650; color: var(--texto); background: var(--widget-2); }
.dw-app3-cursos { display: flex; gap: 4px; }
.dw-app3-cursos .icono { width: 26px; height: 26px; border-radius: 8px; }
/* 10. Así estudias conmigo y «Por dentro» de las vitrinas: capturas del aula en una ventana */
.dw-laminas { display: grid; grid-auto-flow: column; grid-auto-columns: 82%; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; margin-inline: calc(-1 * var(--margen)); padding: 4px var(--margen) 18px; scroll-padding-inline: var(--margen); scrollbar-width: none; }
.dw-laminas::-webkit-scrollbar { display: none; }
/* Escritorio: las 4 láminas a la vista, 2 × 2 y centradas (antes 2 columnas y las otras 2 escondidas sin barra ni flechas) */
@media (min-width: 768px) { .dw-laminas { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-columns: auto; gap: 16px; overflow: visible; scroll-snap-type: none; margin-inline: 0; padding-inline: 0; } }
.dw-lamina { margin: 0; padding: 10px; display: flex; flex-direction: column; gap: 10px; scroll-snap-align: start; color: var(--texto); }
.dw-ventana { border-radius: 14px; overflow: hidden; background: var(--widget-2); box-shadow: 0 0 0 1px var(--linea); }
.dw-ventana-barra { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px; }
.dw-ventana-barra i { width: 8px; height: 8px; border-radius: 50%; background: rgba(127, 127, 127, .45); }
.dw-ventana-barra span { flex: 1; max-width: 60%; margin-inline: auto; display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 20px; border-radius: 999px; font-size: 11px; color: var(--texto-3); background: var(--widget); }
.dw-ventana-barra svg { width: 10px; height: 10px; }
.dw-ventana img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: top; }
.dw-ventana-comunidad { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; aspect-ratio: 16 / 10.4; background: var(--fondo-rosa); }
.dw-ventana-comunidad b { font-size: 16px; font-weight: 750; }
.dw-lamina figcaption { display: flex; align-items: center; gap: 10px; padding: 0 4px 4px; }
.dw-lamina figcaption > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.dw-lamina figcaption b { font-size: 14.5px; }
.dw-lamina figcaption span span { font-size: 13px; color: var(--texto-2); }
.dw-chips-ico { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.dw-chips-ico li { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px 0 5px; border-radius: 999px; font-size: 13px; font-weight: 650; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-chips-ico .icono { width: 22px; height: 22px; border-radius: 999px; }
.dw-chips-ico .icono svg { width: 12px; height: 12px; }
.dw-chips-ico.chicos { margin-top: 10px; }
/* 14. Opiniones: la nota, las barras, Instagram, las ★ y el muro (1 + «Ver N más» en el celular; columnas desde 640 px) */
/* Las ★ (texto ★★★★★ o íconos): UNA regla para todo el sitio (la fusión A+B había dejado tres que se pisaban). Doradas como en la
   dreomar.com de hoy (#FBBC04); el tema decía azul (liz.css --estrella): lo decide Omar (contenido.js · pendientes). */
.dw-estrellas { display: inline-flex; gap: 1px; flex-shrink: 0; font-size: 15px; letter-spacing: 1px; line-height: 1; white-space: nowrap; color: #FBBC04; }
.dw-estrellas svg { width: 15px; height: 15px; }
.dw-opinion figcaption .dw-estrellas { margin-left: auto; align-self: flex-start; margin-top: 4px; }
/* Vitrinas: el nombre con las ★ debajo y las comillas azules en la esquina (como la vitrina de hoy) */
.dw-op-vitrina figcaption > span:first-of-type { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.dw-op-vitrina figcaption .dw-estrellas { margin: 0; align-self: flex-start; font-size: 14px; color: #FBBC04; }
.dw-op-comillas { margin-left: auto; align-self: flex-start; font: 700 44px/0.8 Georgia, 'Times New Roman', serif; color: var(--acento); opacity: .45; }
.dw-nota-op { display: grid; gap: 14px; align-items: center; margin-bottom: 16px; padding: 18px; }
.dw-nota-op:not(.con-barras) { width: fit-content; max-width: 100%; margin-inline: auto; padding: 16px 22px; }
@media (min-width: 768px) { .dw-nota-op.con-barras { grid-template-columns: auto minmax(0, 1fr) minmax(0, 260px); gap: 32px; padding: 22px 28px; } }
.dw-nota-num { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 14px; align-items: center; }
.dw-nota-num b { grid-row: 1 / 3; font-size: 52px; font-weight: 800; letter-spacing: -0.045em; line-height: 1; }
.dw-nota-num .dw-estrellas { font-size: 20px; letter-spacing: 2px; align-self: end; }
.dw-nota-quien { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--texto-2); align-self: start; }
.dw-caras { display: flex; }
.dw-caras img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px var(--widget); }
.dw-caras img + img { margin-left: -8px; }
.dw-nota-barras { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.dw-nota-barras li { display: grid; grid-template-columns: 30px minmax(0, 1fr) 28px; align-items: center; gap: 8px; font-size: 12px; color: var(--texto-2); }
.dw-nota-barras li > i { display: block; height: 6px; border-radius: 999px; overflow: hidden; background: var(--widget-2); }
.dw-nota-barras li > i > i { display: block; height: 100%; border-radius: inherit; background: var(--degradado-boton); }
.dw-nota-red { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 16px; color: var(--texto); background: var(--widget-2); }
.dw-nota-red > span:last-child { display: flex; flex-direction: column; }
.dw-nota-red b { font-size: 14px; }
.dw-nota-red span span { font-size: 13px; color: var(--texto-2); }
.dw-muro-op { display: grid; gap: 12px; }
@media (max-width: 639px) { .dw-muro-op:not(.todas) .dw-op-extra { display: none; } }
/* En el celular (1 columna) y de 640 a 1023 (2 columnas, por filas) manda el orden real (order); desde 1024, 3 columnas que se leen por filas */
@media (min-width: 640px) { .dw-muro-op { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; } .dw-op-ver { display: none; } }
@media (min-width: 1024px) { .dw-muro-op { display: block; columns: 3; column-gap: 16px; } .dw-muro-op-i { break-inside: avoid; margin-bottom: 16px; } }
/* 17. Cierre: las dos píldoras arriba del retrato, el pie «Omar Ulloa ✓» y el panel final */
.dw-cierre-pildoras { position: absolute; left: 12px; right: 12px; top: 12px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
.dw-cierre-pildoras .dw-cierre-pildora { position: static; gap: 6px; }
.dw-cierre-pildora svg { width: 13px; height: 13px; }
.dw-cierre-quien { position: absolute; left: 12px; right: 12px; bottom: 12px; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 16px; text-align: left; }
.dw-cierre-quien .emoji { font-size: 22px; }
.dw-cierre-quien > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.dw-cierre-quien b { font-size: 15px; display: inline-flex; align-items: center; gap: 6px; }
.dw-cierre-quien span span { font-size: 12.5px; color: rgba(255, 255, 255, .78); }
.dw-cierre-panel { display: grid; gap: 16px; margin-top: 28px; padding: 20px; border-radius: var(--radio-widget); text-align: center; background: rgba(255, 255, 255, .07); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
@media (min-width: 900px) { .dw-cierre-panel { grid-template-columns: minmax(0, 1fr) auto; align-items: center; margin-top: 40px; padding: 24px 28px; text-align: left; } }
.dw-cierre-panel-t { display: flex; flex-direction: column; gap: 10px; }
.dw-cierre-panel-t p { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--texto-2); }
.dw-cierre-panel-t .icono { border-radius: 7px; flex-shrink: 0; }
.dw-cierre-panel-b { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.oscuro .dw-chips-ico li { color: #FFFFFF; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
/* Las secciones que se ven en los dos tamaños cambian de fondo en el celular (sin dos fondos iguales seguidos) */
@media (max-width: 767px) {
  .dw-swap.fondo-blanco { background: var(--suelo); }
  .dw-swap.fondo-suelo { background: #FFFFFF; }
  html[data-theme="dark"] .dw-web .dw-swap.fondo-blanco { background: #0B0B0D; }
  html[data-theme="dark"] .dw-web .dw-swap.fondo-suelo { background: #000000; }
  .dw-swap.fondo-blanco .dw-faq details { background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 10px 24px -22px var(--sombra); }
}

/* ── Temario ───────────────────────────────────────────────────────────── */
.dw-temario-rejilla { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) { .dw-temario-rejilla { grid-template-columns: 320px minmax(0, 1fr); gap: 32px; } .dw-temario-lado { position: sticky; top: calc(var(--alto-cinta) + 80px); } }
.dw-resumen { padding: 6px var(--relleno-widget); }
.dw-temario { padding-block: 4px; }
.dw-mod + .dw-mod { box-shadow: inset 0 1px 0 var(--linea); }
.dw-mod summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto 18px; gap: 12px; align-items: center; padding: 14px 0; }
.dw-mod summary::-webkit-details-marker { display: none; }
/* 29-oct: módulo anunciado (contenido.js · llega): la misma fila, sin desplegable */
.dw-mod-fila { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px 0; }
.dw-mod-n { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; font-size: 13px; font-weight: 800; color: var(--acento); background: var(--acento-suave); }
.dw-mod-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dw-mod-k { font-size: 11.5px; font-weight: 650; color: var(--texto-3); display: flex; align-items: center; gap: 6px; }
.dw-mod-k .insignia { height: 19px; font-size: 11px; padding: 0 7px; }
.dw-mod-t b { font-size: 15px; font-weight: 700; line-height: 1.3; }
.dw-mod-d { display: flex; flex-direction: column; align-items: flex-end; font-size: 12.5px; color: var(--texto-2); white-space: nowrap; }
.dw-mod-d b { font-size: 13px; color: var(--texto); }
.dw-mod .mas { color: var(--texto-3); transition: transform .25s var(--curva); }
.dw-mod .mas svg { width: 18px; height: 18px; }
.dw-mod[open] .mas { transform: rotate(180deg); }
.dw-clases { list-style: none; margin: 0 0 12px; padding: 4px 14px; border-radius: 14px; background: var(--widget-2); }
.dw-clases li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; font-size: 14px; line-height: 1.4; }
.dw-clases li + li { box-shadow: inset 0 1px 0 var(--linea); }
.dw-clases li .num { color: var(--texto-3); flex-shrink: 0; }
.dw-ver-mods { margin: 6px 0 12px; }
@media (max-width: 899px) { .dw-temario:not(.todos) .dw-mod:nth-of-type(n+6) { display: none; } }
@media (min-width: 900px) { .dw-ver-mods { display: none; } }

/* ── Kit, precio con bisel y garantía ───────────────────────────────────── */
.dw-kit-cabeza { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.dw-kit-cabeza b { font-size: 18px; font-weight: 750; letter-spacing: -0.02em; }
.dw-kit-items { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 768px) { .dw-kit-items { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; } }
.dw-kit-items li { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 650; line-height: 1.3; }
.dw-kit-items img, .dw-kit-vacio { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 12px; background: var(--widget-2); }
.dw-kit-vacio { display: grid; place-items: center; color: var(--texto-3); }
.dw-precio-caja { display: grid; gap: 18px; }
@media (min-width: 900px) { .dw-precio-caja { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 32px; align-items: stretch; } .dw-precio-caja .dw-pagas { justify-content: center; } .dw-garantia { grid-column: 1 / -1; } }
.dw-pagas .precio .insignia { display: none; } /* (C3) ya lo dice la píldora «Lanzamiento · −50%» */
.dw-llevas .kicker { margin-bottom: 6px; }
.dw-llevas .lista { margin-top: 10px; }
.dw-pagas { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px; text-align: center; border-radius: var(--radio-panel); }
.dw-pagas-k { font-size: 13px; font-weight: 650; color: var(--texto-2); }
.dw-pagas .precio { justify-content: center; }
@media (max-width: 479px) {
  .dw-pagas .precio { flex-direction: column; gap: 2px; } /* (C3) monto y tachado apilados: los 3 bloques miden lo mismo */
  /* «Quiero el curso · USD 60.00 →» cabe entero a 375 (pedía 306 px de 277 y empujaba la caja 31 px fuera de su marco) */
  .dw-precio-caja { grid-template-columns: minmax(0, 1fr); }
  .dw-pagas { padding: 16px 12px; }
  .dw-pagas .btn { padding-inline: 14px; gap: 6px; }
}
@media (max-width: 370px) { .dw-pagas .btn { padding-inline: 10px; font-size: 14px; } }
@media (max-width: 340px) { .dw-pagas .btn .flecha { display: none; } }
.dw-precio-grande .monto { font-size: 44px; }
@media (min-width: 768px) { .dw-precio-grande .monto { font-size: 52px; } }
.dw-pagas-s { font-size: 13px; }
.dw-pagas .btn { width: 100%; margin-top: 4px; }
.dw-seguro { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--texto-2); }
.dw-seguro svg { width: 14px; height: 14px; }
.dw-garantia { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 16px; background: color-mix(in srgb, var(--ok) 8%, var(--widget)); text-align: left; }
.dw-garantia > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.dw-garantia b { font-size: 15px; }
.dw-garantia span span { font-size: 13.5px; line-height: 1.45; color: var(--texto-2); }
.dw-garantia .enlace { font-size: 13px; display: inline; }

/* ── Vitrina como dreomar.com (24-oct): piezas que vuelven ─────────────── */
.dw-sellos .insignia .emoji { font-size: 12px; }
.dw-temario-linea { margin: -6px 0 0; font-size: 14px; font-weight: 650; color: var(--texto-2); text-align: center; }
.dw-resumen-n { display: flex; align-items: center; gap: 12px; padding: 14px 0 6px; }
.dw-resumen-n > span { display: flex; flex-direction: column; }
.dw-resumen-n b { font-size: 44px; font-weight: 800; letter-spacing: -0.045em; line-height: 1; }
.dw-resumen-n span span { font-size: 13.5px; font-weight: 600; color: var(--texto-2); }
.dw-inc-lista { padding-block: 4px; }
.dw-inc-lista .insignia { height: 22px; font-size: 11.5px; }
.dw-inc-rejilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.dw-kit-cabeza .icono { width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0; }
.dw-kit-cabeza .icono + b, .dw-kit-cabeza h3 { flex: 1; min-width: 0; }
.dw-kit-cabeza h3 { font-size: 24px; font-weight: 800; letter-spacing: -0.03em; }
@media (min-width: 768px) { .dw-kit-items.dw-kit-8 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; } }
.dw-kit-8 li { padding: 6px; border-radius: 14px; background: var(--widget-2); }
.dw-kit-8 img, .dw-kit-8 .dw-kit-vacio { border-radius: 10px; }
.dw-kit-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; }
.dw-kit-accion { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 650; color: var(--acento); }
.dw-kit-accion svg { width: 12px; height: 12px; }
.dw-kit-mas { justify-content: center; text-align: center; }
.dw-kit-mas .dw-kit-vacio { display: grid; place-items: center; background: none; }
.dw-acceso { display: flex; flex-direction: column; gap: 8px; }
.dw-acceso-panel { margin-top: auto; }
.dw-acceso-cuerpo { display: grid; gap: 8px; padding: 10px; }
.dw-acceso-cab { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.dw-acceso-cab b { flex: 1; min-width: 0; }
.dw-acceso-cab .insignia { height: 21px; font-size: 11px; }
.dw-acceso-fila { display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: 12px; font-size: 13px; font-weight: 600; background: var(--widget); }
.dw-acceso-fila img { width: 56px; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.dw-acceso-fila > span:nth-child(2) { flex: 1; min-width: 0; }
.dw-acceso-fila .insignia { height: 21px; font-size: 11px; }
.dw-acceso-fila .icono { border-radius: 999px; }
.dw-no-solo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; margin-top: 16px; background: var(--fondo-rosa); }
.dw-no-solo-t > p { margin: 6px 0 8px; }
.dw-no-solo-t .insignia { height: 22px; font-size: 11.5px; }
.dw-chat { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 18px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-chat-cab { display: flex; align-items: center; gap: 10px; padding-bottom: 10px; margin-bottom: 2px; box-shadow: inset 0 -1px 0 var(--linea); }
.dw-chat-cab > span:last-child { display: flex; flex-direction: column; }
.dw-chat-cab b { font-size: 14px; }
.dw-chat-cab span span { font-size: 12px; color: var(--texto-3); }
.dw-chat-m { align-self: flex-start; max-width: 85%; padding: 8px 12px; border-radius: 16px; font-size: 13.5px; line-height: 1.4; background: var(--widget-2); }
.dw-chat-m.yo { align-self: flex-end; color: #FFFFFF; background: var(--acento-boton); }
.dw-profe-foto-caja { position: relative; width: 100%; max-width: 260px; margin-inline: auto; }
@media (min-width: 768px) { .dw-profe-foto-caja { max-width: none; } }
.dw-profe-lugar { position: absolute; left: 10px; top: 10px; bottom: auto; gap: 6px; background: rgba(255, 255, 255, .94); color: #111114; box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .35); } /* píldora blanca sobre la foto, como la de hoy (la de cristal gris daba 3.6:1) */
.dw-faq-2 .dw-faq + .dw-faq { margin-top: 8px; }
@media (min-width: 1024px) { .dw-faq-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; align-items: start; } .dw-faq-2 .dw-faq + .dw-faq { margin-top: 0; } }

/* ── Profesor ──────────────────────────────────────────────────────────── */
.dw-profe { display: grid; gap: 18px; align-items: center; text-align: center; }
.dw-profe-foto { width: 100%; max-width: 260px; margin-inline: auto; aspect-ratio: 1; object-fit: cover; border-radius: 20px; }
.dw-profe-texto { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.dw-profe-apps { margin-top: 12px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
@media (min-width: 768px) { .dw-profe { grid-template-columns: 240px minmax(0, 1fr); gap: 32px; text-align: left; } .dw-profe-texto, .dw-profe-apps { align-items: flex-start; } .dw-profe-apps .dw-logos { justify-content: flex-start; } }

/* ── Tienda y fichas ───────────────────────────────────────────────────── */
.dw-filtros-barra { position: sticky; top: calc(var(--alto-cinta) + 56px); z-index: 30; background: color-mix(in srgb, #FFFFFF 86%, transparent); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); box-shadow: inset 0 -1px 0 var(--linea); }
@media (max-width: 767px) { .dw-filtros-barra { position: static; } } /* como /recursos de hoy: la barra solo se pega en escritorio */
.dw-chips { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; padding: 10px var(--margen); margin-inline: calc(-1 * var(--margen)); }
.dw-chips::-webkit-scrollbar { display: none; }
.dw-chips.dw-centro { justify-content: flex-start; }
@media (min-width: 768px) { .dw-chips { justify-content: center; } .dw-chips.dw-centro { justify-content: center; flex-wrap: wrap; } }
.dw-filtro { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border: 0; border-radius: 999px; cursor: pointer; font: inherit; font-size: 13.5px; font-weight: 650; color: var(--texto-2); background: var(--widget-2); white-space: nowrap; transition: background .2s, color .2s; }
.dw-filtro .num { opacity: .6; font-weight: 600; }
.dw-filtro[aria-pressed="true"] { color: #FFFFFF; background: #0B0B0F; }
.dw-filtro[aria-pressed="true"] .num { opacity: .75; }
.dw-tienda { display: grid; gap: 12px; }
@media (min-width: 640px) { .dw-tienda { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .dw-tienda { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.dw-prod { display: grid; grid-template-columns: 96px minmax(0, 1fr); grid-template-areas: "foto info" "botones botones"; gap: 12px 14px; padding: 12px; }
.dw-prod-foto { grid-area: foto; aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: var(--widget-2); }
.dw-prod-foto img { width: 100%; height: 100%; object-fit: cover; }
.dw-prod-foto .portada, .dw-prod-foto .portada-tipo { height: 100%; aspect-ratio: auto; border-radius: 0; }
.dw-prod-info { grid-area: info; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.dw-prod-info .insignia { height: 21px; font-size: 11px; }
.dw-prod-t { font-size: 16px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.25; color: var(--texto); }
.dw-prod-f { font-size: 12.5px; color: var(--texto-2); }
.dw-prod-info .precio .monto { font-size: 20px; }
.dw-prod-botones { grid-area: botones; display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
@media (min-width: 640px) { .dw-prod { grid-template-columns: minmax(0, 1fr); grid-template-areas: "foto" "info" "botones"; grid-template-rows: auto 1fr auto; padding: 14px; } .dw-prod-foto { aspect-ratio: 16 / 10; } .dw-prod-botones { justify-content: flex-start; } }
.dw-pronto { display: grid; gap: 10px; }
@media (min-width: 768px) { .dw-pronto { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dw-pronto-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; color: var(--texto); }
.dw-pronto-item > span:nth-child(2) { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dw-pronto-item b { font-size: 15px; }
.dw-pronto-item span span { font-size: 13px; color: var(--texto-2); }
/* ── Tienda (24-oct): la de dreomar.com de hoy, pieza por pieza (sitio.js · /shop) ── */
/* «Próximamente» o «Precio por confirmar» en lugar del precio: gris y más chico (no es un precio verde) */
.precio .monto.sin-precio { color: var(--texto-2); font-size: 22px; letter-spacing: -0.02em; }
.precio.chico .monto.sin-precio { font-size: 16px; }
.dw-tienda-hero .dw-fecha { margin: 0 0 6px; font-size: 13px; font-weight: 600; color: var(--texto-2); }
.dw-tienda-h1 { margin: 0; }
.dw-tienda-hero .hero-bajada { margin: 10px auto 0; }
.dw-seg-caja { display: flex; justify-content: center; margin: 4px 0 14px; }
.dw-seg { grid-auto-columns: auto; }
.dw-seg-op { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 18px; border-radius: 999px; font-size: 14px; font-weight: 650; color: var(--texto-2); text-decoration: none; }
.dw-seg-op svg { width: 16px; height: 16px; }
.dw-seg-op[aria-current="true"] { color: var(--texto); background: var(--perilla); box-shadow: 0 0 0 .5px rgba(0,0,0,.04), 0 3px 8px rgba(0,0,0,.14); }
.dw-familias { margin: 0 0 16px; }
.dw-familias .dw-chips { padding-block: 4px; }
a.dw-filtro { text-decoration: none; }
.dw-filtro svg { width: 16px; height: 16px; }
.dw-filtro .icono.xs { width: 20px; height: 20px; border-radius: 6px; }
.dw-filtro .icono.xs svg { width: 12px; height: 12px; color: #fff; }
.dw-filtro-n { font-variant-numeric: tabular-nums; opacity: .6; font-weight: 600; }
.dw-filtro[aria-current="true"] { color: #FFFFFF; background: #0B0B0F; }
.dw-filtro[aria-current="true"] .dw-filtro-n { opacity: .75; }
.dw-packs { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .dw-packs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 1100px) { .dw-packs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.dw-pack { display: flex; flex-direction: column; min-width: 0; padding: 8px; }
.dw-pack-media { position: relative; display: block; aspect-ratio: 16 / 11; border-radius: 14px; overflow: hidden; background: var(--widget-2); }
.dw-pack-media .dw-clip, .dw-ficha-media .dw-clip { display: block; width: 100%; height: 100%; object-fit: cover; }
.dw-pack-media .portada, .dw-pack-media .portada-tipo { height: 100%; aspect-ratio: auto; border-radius: 0; }
.dw-pack-pronto { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; background: #FFFFFF; color: #0B0B0F; font-size: 11.5px; font-weight: 750; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.dw-pack-apps { position: absolute; right: 8px; bottom: 8px; display: inline-flex; gap: 3px; padding: 3px; border-radius: 9px; background: rgba(0,0,0,.55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.dw-papp { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; overflow: hidden; font-size: 11px; font-weight: 800; letter-spacing: -.02em; color: #fff; background: #1C1C1E; }
.dw-papp img { width: 100%; height: 100%; object-fit: cover; }
.dw-papp-premiere { color: #9999FF; background: #00005B; }
.dw-papp-aftereffects { color: #9999FF; background: #00005B; }
.dw-papp-finalcut { color: #fff; background: linear-gradient(150deg, #3A3A3C, #0B0B0F); }
@media (max-width: 639px) { .dw-pack-apps .dw-papp:nth-child(n + 4) { display: none; } }
.dw-pack-info { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; padding: 10px 6px 4px; }
.dw-pack-fam { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 650; color: var(--texto-2); }
.dw-pack-fam .icono.xs { width: 20px; height: 20px; border-radius: 6px; }
.dw-pack-fam .icono.xs svg { width: 12px; height: 12px; color: #fff; }
.dw-pack-t { font-size: 15px; font-weight: 750; letter-spacing: -0.015em; line-height: 1.25; color: var(--texto); text-decoration: none; }
.dw-pack-s { font-size: 12.5px; line-height: 1.35; color: var(--texto-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dw-pack-pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 8px; margin-top: auto; padding-top: 8px; min-height: 40px; }
.dw-pack-precio { white-space: nowrap; font-size: 17px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--ok); }
.dw-pack-precio.gris { color: var(--texto-2); }
.dw-pack-pie .dw-pack-precio { display: inline; padding: 0; } /* en la tarjeta es solo la cifra (no hereda la caja de precio de la ficha) */
.dw-pack-estado { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; margin-left: auto; border-radius: 999px; background: var(--widget-2); color: var(--texto-2); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
@media (max-width: 380px) { .dw-pack-estado { padding: 0 9px; font-size: 11.5px; } }
.dw-sin-packs { padding: 8px; }
.dw-tienda-cursos { margin-top: var(--hueco); }
.dw-tgar { display: grid; gap: 12px; }
@media (min-width: 768px) { .dw-tgar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dw-tgar-item { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 20px 16px; text-align: center; }
.dw-tgar-item b { font-size: 16px; font-weight: 750; letter-spacing: -0.01em; }
.dw-tgar-item span:last-child { font-size: 14px; color: var(--texto-2); }
.dw-pago-seguro { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px; margin-top: 16px; text-align: center; }
.dw-pago-r { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; }
.dw-pago-r svg { width: 16px; height: 16px; }
.dw-pago-marcas { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0; padding: 0; list-style: none; }
/* Cada marca en su píldora blanca, también en oscuro (son colores de otros, pensados para fondo blanco), como la dreomar.com de hoy */
.dw-pago-marca { display: inline-grid; place-items: center; height: 32px; min-width: 54px; padding: 0 8px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.08), 0 6px 14px -8px rgba(0,0,0,.35); font-size: 12px; font-weight: 750; color: #111; }
.dw-pago-marca svg { display: block; height: 12px; width: auto; max-width: 46px; }
.dw-pago-marca svg.alto { height: 20px; }
@media (min-width: 640px) { .dw-pago-marca { height: 36px; min-width: 62px; padding: 0 12px; } }
.dw-pago-nota { flex-basis: 100%; font-size: 13px; color: var(--texto-2); }
.dw-ficha-media { position: relative; aspect-ratio: 16 / 11; border-radius: 22px; overflow: hidden; background: var(--widget-2); }
.dw-ficha-apps { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.dw-ficha-apps .dw-papp { width: 26px; height: 26px; font-size: 11px; }
.dw-caracts { display: grid; gap: 12px; }
@media (min-width: 768px) { .dw-caracts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dw-caract { display: flex; flex-direction: column; gap: 6px; padding: 18px; }
.dw-caract b { font-size: 16px; font-weight: 750; }
.dw-caract p { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--texto-2); }
.dw-pt { background: var(--degradado-boton); color: #FFFFFF; justify-content: flex-end; }
.dw-pt .grande { font-family: var(--letra-display); font-size: 22px; font-weight: 800; letter-spacing: -0.03em; color: #FFFFFF; }
.dw-pt-ico { position: absolute; top: 14px; right: 14px; opacity: .4; }
.dw-pt-ico svg { width: 40px; height: 40px; }
.dw-ficha-rejilla { display: grid; gap: 20px; margin-top: 12px; }
@media (min-width: 900px) { .dw-ficha-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: start; } }
.dw-ficha-foto .portada, .dw-ficha-foto .portada-tipo { aspect-ratio: 4 / 3; border-radius: 22px; }
.dw-ficha-info { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.dw-ficha-t { font-size: 30px; }
@media (min-width: 900px) { .dw-ficha-t { font-size: 44px; } }
.dw-ficha-info .hero-bajada { margin: 0; }
.dw-ficha-info .widget { width: 100%; }
.dw-ficha-cta { width: 100%; justify-content: flex-start; margin-top: 4px; }
.dw-ficha-cta > * { flex: 1 1 auto; }

/* ── Recursos ──────────────────────────────────────────────────────────── */
.dw-filtros { display: flex; flex-direction: column; gap: 4px; padding-top: 10px; }
.dw-filtros .dw-chips { padding-block: 6px 10px; justify-content: flex-start; }
@media (min-width: 900px) { .dw-filtros { flex-direction: row; align-items: center; gap: 16px; padding-block: 10px; } .dw-filtros .dw-chips { margin: 0; padding: 0; } }
.dw-buscador { display: block; width: 100%; max-width: 440px; }
.dw-buscador.dw-centro { margin: 16px auto 0; }
.dw-buscador .entrada { background: var(--widget-2); box-shadow: none; font-size: 16px; }
.dw-recursos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 768px) { .dw-recursos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } }
@media (min-width: 1100px) { .dw-recursos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } }
.dw-rec { display: flex; flex-direction: column; color: var(--texto); }
.dw-rec-portada { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
.dw-rec-portada:not(.dw-rec-tipo) { background: var(--widget-2); }
.dw-rec-portada img { width: 100%; height: 100%; object-fit: cover; }
/* 26-oct: portadas nuevas en 16:9 (su medida real); en las listas, todas las cajas a 16:9 para que las filas queden parejas */
.dw-rec-portada-nueva, .dw-recursos .dw-rec-portada { aspect-ratio: 16 / 9; }
/* Sin portada: un mosaico de color por categoría con su ícono (nunca un hueco gris ni el título repetido) */
.dw-rec-tipo { display: grid; place-items: center; color: #FFFFFF; box-shadow: none; }
.dw-rec-tipo::after { content: ""; position: absolute; inset: 0; background: radial-gradient(90% 80% at 85% 0%, rgba(255,255,255,.28), transparent 60%); }
.dw-rec-ico { position: relative; z-index: 1; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 28%; background: rgba(255, 255, 255, .18); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35); }
.dw-rec-ico svg { width: 30px; height: 30px; }
.dw-rec-rejilla .dw-rec-ico, .dw-rec-izq .dw-rec-ico { width: 88px; height: 88px; }
.dw-rec-rejilla .dw-rec-ico svg, .dw-rec-izq .dw-rec-ico svg { width: 44px; height: 44px; }
.dw-rec-cat { position: absolute; z-index: 2; top: 9px; left: 9px; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.dw-rec-tipo .dw-rec-cat { position: absolute; }
.dw-rec-info { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px 12px; flex: 1; }
.dw-rec-info b { font-size: 14px; font-weight: 650; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dw-rec-pie { margin-top: auto; }
.dw-rec-pie .insignia svg { width: 12px; height: 12px; }
.dw-esqueleto { animation: dw-pulso 1.4s ease-in-out infinite; pointer-events: none; }
.dw-esqueleto .dw-rec-portada, .dw-esqueleto b, .dw-esqueleto span, .dw-rec-portada.dw-esqueleto { background: var(--widget-2); color: transparent; border-radius: 6px; }
@keyframes dw-pulso { 50% { opacity: .55; } }
.dw-rec-rejilla { display: grid; gap: 18px; margin-top: 10px; }
@media (min-width: 900px) { .dw-rec-rejilla { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 40px; align-items: start; } .dw-rec-caja { position: sticky; top: calc(var(--alto-cinta) + 76px); } }
.dw-rec-izq { display: flex; flex-direction: column; gap: 14px; }
.dw-rec-izq .dw-rec-portada, .dw-rec-rejilla > .dw-rec-portada { border-radius: 22px; }
.dw-rec-caja { display: flex; flex-direction: column; gap: 12px; }
.dw-rec-k { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; color: var(--texto-2); }
.dw-rec-k .insignia { margin-left: auto; }
.dw-rec-t { font-size: 28px; font-weight: 800; letter-spacing: -0.035em; line-height: 1.1; }
@media (min-width: 768px) { .dw-rec-t { font-size: 34px; } }
.dw-rec-datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(64px, 1fr)); margin: 2px 0; padding: 10px 0; box-shadow: inset 0 1px 0 var(--linea), inset 0 -1px 0 var(--linea); }
.dw-rec-datos div { text-align: center; }
.dw-rec-datos div + div { box-shadow: inset 1px 0 0 var(--linea); }
.dw-rec-datos dt { font-size: 11px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-3); }
.dw-rec-datos dd { margin: 2px 0 0; font-size: 13.5px; font-weight: 700; }
.dw-prompt-cabeza { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.dw-prompt pre { margin: 0; max-height: 280px; overflow: auto; white-space: pre-wrap; font: 13.5px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; padding: 12px; border-radius: 12px; background: var(--widget-2); }
.dw-fila-curso { display: flex; align-items: center; gap: 14px; padding: 12px; color: var(--texto); }
.dw-fila-curso img { width: 96px; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 12px; flex-shrink: 0; }
.dw-fila-curso .precio .monto { font-size: 18px; }
@media (max-width: 479px) { .dw-fila-curso > .btn { display: none; } }

/* ── Formularios (recursos, cotización, aplicación) ────────────────────── */
.dw-form { display: flex; flex-direction: column; gap: 12px; text-align: left; }
.dw-form .entrada { font-size: 16px; } /* 16 px: sin zoom en iPhone */
.dw-form .campo label { font-size: 13px; font-weight: 650; color: var(--texto-2); }
.mt-form .campo .mt-error { display: none; font-size: 12.5px; font-weight: 600; color: var(--urgente); }
.mt-form .campo.mt-mal .mt-error { display: block; }
.mt-form .campo.mt-mal .entrada, .mt-form .campo.mt-mal .dw-tel-cod { box-shadow: inset 0 0 0 2px var(--urgente); }
.mt-form .campo.mt-mal .dw-opciones { border-radius: 14px; box-shadow: 0 0 0 2px var(--urgente); padding: 4px; }
.dw-tel { display: flex; align-items: stretch; }
.dw-tel-cod { display: grid; place-items: center; min-width: 58px; padding: 0 10px; border-radius: 14px 0 0 14px; font-size: 15px; font-weight: 650; color: var(--texto-2); background: var(--widget-2); box-shadow: inset 0 0 0 1px var(--linea); }
.dw-tel .entrada { border-radius: 0 14px 14px 0; }
.dw-tel-cod[hidden] { display: none; }
.dw-tel-cod[hidden] + .entrada { border-radius: 14px; }
.dw-opciones { display: flex; flex-wrap: wrap; gap: 8px; }
.dw-opcion { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 12px; border-radius: 999px; font-size: 13.5px; font-weight: 600; cursor: pointer; background: var(--widget-2); box-shadow: inset 0 0 0 1px var(--linea); }
.dw-opcion input { accent-color: var(--acento); }
.dw-opcion:has(input:checked) { color: var(--acento); background: var(--acento-suave); box-shadow: inset 0 0 0 1.5px var(--acento); }
.dw-grupo { border: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.dw-grupo legend { float: left; width: 100%; padding: 0; margin-bottom: 4px; font-size: 16px; font-weight: 750; letter-spacing: -0.01em; }
.dw-grupo legend + * { clear: both; }
.dw-listo { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; padding: 6px 0; }
.dw-listo .btn, .dw-listo .widget { width: 100%; }
.dw-hoja .dw-form { margin-top: 4px; }
.dw-form .caja-error { margin-top: -2px; }

/* ── Recursos como dreomar.com (24-oct): la oferta de arriba, la tarjeta con «Gratis» y «PDF», los cursos de abajo,
      «Qué trae», «El prompt» cerrado, el permiso «Mándame más prompts y tips» y la hoja de descarga ── */
.dw-rec-hero-rejilla { display: grid; gap: 20px; align-items: center; }
.dw-rec-hero-t { text-align: center; }
.dw-rec-hero-t .etiqueta { display: flex; justify-content: center; margin-bottom: 10px; }
.dw-rec-hero-t .titulo { font-size: 38px; font-weight: 800; letter-spacing: -0.04em; line-height: 1.05; }
.dw-rec-hero-t .bajada { margin-top: 8px; font-size: 16px; color: var(--texto-2); }
.dw-rec-hero-t .dw-chips-ico { margin-top: 14px; }
@media (min-width: 900px) {
  .dw-rec-hero-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 460px); gap: 40px; }
  .dw-rec-hero-t { text-align: left; }
  .dw-rec-hero-t .titulo, .dw-rec-hero-t .bajada { margin-inline: 0; text-align: left; }
  .dw-rec-hero-t .etiqueta, .dw-rec-hero-t .dw-chips-ico { justify-content: flex-start; }
  .dw-rec-hero-t .titulo { font-size: 52px; }
  .dw-rec-hero-t .bajada { font-size: 18px; }
}
.dw-oferta { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 12px; padding: 10px; align-items: center; }
.dw-oferta-foto { position: relative; display: block; border-radius: 14px; overflow: hidden; }
.dw-oferta-foto img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 11; object-fit: cover; }
.dw-oferta-pct { position: absolute; left: 6px; bottom: 6px; height: 22px; font-size: 11.5px; background: #FFFFFF; }
.dw-oferta-info { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.dw-oferta-cab { display: flex; align-items: center; gap: 10px; }
.dw-oferta-cab > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.dw-oferta-cab b { font-size: 16px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.2; }
.dw-oferta-datos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; color: var(--texto-2); }
.dw-oferta-datos li { display: inline-flex; align-items: center; gap: 4px; }
.dw-oferta-datos svg { width: 13px; height: 13px; color: var(--acento); }
.dw-oferta-cta { grid-column: 1 / -1; justify-content: space-between; padding-right: 6px; }
.dw-oferta-cta .dw-pildora-precio.dw-oferta-precio { gap: 6px; height: 34px; padding: 0 12px; color: #087A45; background: #FFFFFF; }
.dw-oferta-precio s { font-size: 11.5px; font-weight: 600; color: #56565B; } /* la píldora es blanca en los dos modos: colores fijos */
.dw-oferta-precio .flecha { width: 15px; height: 15px; color: #0B0B0F; }
/* Celular, como la de hoy: la foto apilada y entera a todo el ancho (en 150 px se cortaba «…dita como un PRO») */
@media (max-width: 599px) { .dw-oferta { grid-template-columns: minmax(0, 1fr); } .dw-oferta-foto img { aspect-ratio: 16 / 9; } }
@media (min-width: 600px) { .dw-oferta-foto img { aspect-ratio: 16 / 9; } }
@media (min-width: 900px) { .dw-oferta { grid-template-columns: 200px minmax(0, 1fr); } }
.dw-rec { position: relative; }
.dw-rec-nombre { font-size: 14px; font-weight: 650; line-height: 1.3; color: var(--texto); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dw-rec-nombre::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.dw-rec-pie { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dw-rec-gratis { position: relative; z-index: 1; border: 0; cursor: pointer; font: inherit; font-size: 12px; font-weight: 700; height: 28px; padding: 0 11px; }
.dw-rec-pdf { font-size: 11.5px; font-weight: 700; letter-spacing: .04em; color: var(--texto-3); }
.dw-curso-rec { display: flex; flex-direction: column; overflow: hidden; color: var(--texto); }
.dw-curso-rec-foto { position: relative; display: block; }
.dw-curso-rec-foto img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.dw-curso-rec-foto .icono { position: absolute; left: 10px; bottom: 10px; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .55); }
.dw-curso-rec-info { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 14px 16px 16px; flex: 1; }
.dw-curso-rec-info > b { font-size: 18px; font-weight: 750; letter-spacing: -0.02em; }
.dw-curso-rec-lema { font-size: 14px; color: var(--texto-2); }
.dw-curso-rec-info .precio { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.dw-curso-rec-info .monto { font-size: 22px; font-weight: 800; color: var(--ok); }
.dw-curso-rec-info .insignia { height: 21px; font-size: 11px; }
.dw-curso-rec-linea { font-size: 13px; color: var(--texto-3); }
.dw-curso-rec-info .btn-sec { margin-top: auto; }
.dw-curso-rec-info .dw-curso-rec-linea + .btn-sec { margin-top: 10px; }
.dw-que-trae { display: flex; flex-direction: column; gap: 6px; }
.dw-que-trae-t { font-size: 17px; font-weight: 750; letter-spacing: -0.02em; }
.dw-que-trae-apps { display: flex; align-items: center; gap: 10px; margin-top: 4px; padding-top: 10px; box-shadow: inset 0 1px 0 var(--linea); font-size: 13px; font-weight: 600; color: var(--texto-2); }
.dw-que-trae-logos { display: flex; }
.dw-que-trae-logos .dw-logo { width: 28px; height: 28px; border-radius: 8px; }
.dw-que-trae-logos .dw-logo + .dw-logo { margin-left: -6px; }
.dw-prompt-cerrado .dw-prompt-velo { position: relative; border-radius: 12px; overflow: hidden; background: var(--widget-2); }
.dw-prompt-lineas { display: grid; gap: 9px; padding: 14px; filter: blur(3px); opacity: .55; }
.dw-prompt-lineas i { display: block; height: 9px; border-radius: 999px; background: var(--texto-3); }
.dw-prompt-abrir { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 12px; }
.dw-prompt-abrir b { font-size: 14.5px; }
.dw-prompt-cabeza .insignia svg { width: 12px; height: 12px; }
.dw-form-frase { margin: 0 0 2px; font-size: 14.5px; color: var(--texto-2); }
.dw-permiso { display: flex; align-items: flex-start; gap: 12px; padding: 12px; border-radius: 14px; cursor: pointer; background: var(--widget-2); }
.dw-permiso input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.dw-switch { position: relative; flex-shrink: 0; width: 46px; height: 28px; border-radius: 999px; background: rgba(120, 120, 128, .32); transition: background .2s var(--curva); }
.dw-switch::after { content: ""; position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 2px 6px rgba(0, 0, 0, .25); transition: transform .2s var(--curva); }
.dw-permiso input:checked + .dw-switch { background: #34C759; }
.dw-permiso input:checked + .dw-switch::after { transform: translateX(18px); }
.dw-permiso input:focus-visible + .dw-switch { outline: 2px solid var(--acento); outline-offset: 2px; }
.dw-permiso > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.dw-permiso b { font-size: 14.5px; }
.dw-permiso small { font-size: 12.5px; color: var(--texto-2); }
.dw-permiso small a { color: inherit; text-decoration: underline; }
.hoja .dw-permiso { background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-hoja-cab { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.dw-hoja-mini { flex-shrink: 0; width: 60px; height: 60px; border-radius: 14px; overflow: hidden; }
.dw-hoja-mini .dw-rec-portada { aspect-ratio: 1; height: 100%; }
.dw-hoja-mini .dw-rec-cat, .dw-hoja-mini .dw-rec-ico { display: none; }
.dw-hoja-cab-t { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dw-hoja-cab-t > b { font-size: 17px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.25; }
.dw-listo-curso { display: flex; align-items: center; gap: 12px; padding: 10px; text-align: left; }
.dw-listo-curso img { width: 72px; }
.dw-listo-curso > svg { width: 18px; height: 18px; color: var(--texto-3); flex-shrink: 0; }
/* Celular, como la ficha de hoy (es donde aterriza ManyChat): portada → título y «Descargar gratis» → «Qué trae» → el prompt.
   .dw-rec-izq se deshace (display: contents) para que su portada, «Qué trae» y el prompt se ordenen junto a la caja. */
@media (max-width: 899px) {
  .dw-rec-izq { display: contents; }
  .dw-rec-izq > .dw-rec-portada { order: 1; } .dw-rec-caja { order: 2; } .dw-rec-izq > .dw-que-trae { order: 3; } .dw-rec-izq > .dw-prompt { order: 4; }
}

/* ── Planes y pasos ────────────────────────────────────────────────────── */
.dw-planes { display: grid; gap: 14px; }
@media (min-width: 900px) { .dw-planes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; } .dw-planes-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 880px; margin-inline: auto; } }
.dw-plan { display: flex; flex-direction: column; gap: 12px; }
.dw-plan-cabeza { display: flex; align-items: center; gap: 12px; }
.dw-plan-cabeza > span:last-child { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.dw-plan-cabeza h3 { font-size: 21px; font-weight: 800; letter-spacing: -0.025em; }
.dw-plan .precio .monto { font-size: 34px; }
.dw-plan .dw-sellos { justify-content: flex-start; }
.dw-plan > .btn, .dw-plan > .btn-sec { margin-top: auto; }
.dw-plan .dw-nota { text-align: left; }
.dw-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; text-align: left; }
.dw-checks li { display: flex; align-items: flex-start; gap: 8px; font-size: 14.5px; line-height: 1.45; }
.dw-checks svg { width: 18px; height: 18px; flex-shrink: 0; margin-top: 1px; color: var(--ok); }
.dw-checks.dw-no li { color: var(--texto-3); }
.dw-checks.dw-no svg { color: var(--texto-3); }
.oscuro .dw-checks svg { color: var(--luz); }
.dw-pasos { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
@media (min-width: 768px) { .dw-pasos { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; } }
.dw-pasos li { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.dw-paso-n { width: 30px; height: 30px; border-radius: 999px; display: grid; place-items: center; font-size: 14px; font-weight: 800; color: var(--acento); background: var(--acento-suave); }
.dw-pasos b { font-size: 16px; font-weight: 750; }
.dw-pasos span:not(.dw-paso-n) { font-size: 14px; line-height: 1.45; color: var(--texto-2); }
.dw-um .dw-hero-texto .dw-checks { margin-top: 16px; }

/* ── Quién soy ─────────────────────────────────────────────────────────── */
.dw-cita { margin: 28px 0 0; font-family: var(--letra-firma); font-style: italic; font-size: 28px; line-height: 1.25; color: var(--texto); text-align: center; }
.dw-barras { display: flex; flex-direction: column; gap: 4px; }
.dw-barra-fila { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) 44px; gap: 10px; align-items: center; padding: 8px 0; font-size: 14px; }
.dw-barra-pista { height: 8px; border-radius: 999px; background: var(--widget-2); overflow: hidden; }
.dw-barra-pista i { display: block; height: 100%; border-radius: inherit; background: var(--degradado-boton); }
.dw-barra-fila b { text-align: right; }

/* ── Legales y estados ─────────────────────────────────────────────────── */
.dw-legal h1 { margin-top: 10px; font-size: 32px; }
@media (min-width: 768px) { .dw-legal h1 { font-size: 44px; } }
.dw-legal > .texto-3 { margin-top: 6px; font-size: 13.5px; }
.dw-legal h2 { margin-top: 28px; font-size: 18px; font-weight: 750; letter-spacing: -0.01em; scroll-margin-top: calc(90px + var(--alto-cinta)); }
.dw-legal p, .dw-legal li { margin-top: 8px; font-size: 15.5px; color: var(--texto-2); line-height: 1.65; }
.dw-legal ul { padding-left: 20px; }
.dw-legal a { color: var(--acento); }
.dw-indice { margin: 20px 0; padding: 14px 18px; border-radius: 16px; background: var(--suelo); }
.dw-indice ol { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.9; }
@media (min-width: 768px) { .dw-indice ol { columns: 2; column-gap: 32px; } }
.dw-indice li { margin: 0 0 8px; break-inside: avoid; } /* las 2 columnas del índice empiezan a la misma altura */
.dw-legal-pie { margin-top: 32px; }
.dw-estado { min-height: 60vh; display: grid; align-content: center; background: var(--suelo); }
.dw-estado .bloque-estado { background: var(--widget); border-radius: var(--radio-widget); box-shadow: 0 0 0 1px var(--linea), 0 24px 48px -30px var(--sombra); }

/* ── Barra de compra fija (celular) ────────────────────────────────────── */
.dw-barra-fija { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 45; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 9px 9px 16px; border-radius: 20px; transform: translateY(150%); transition: transform .3s var(--curva); }
.dw-barra-fija.visible { transform: none; }
.dw-barra-fija .barra-fija-t { display: flex; flex-direction: column; min-width: 0; }
.dw-barra-fija .barra-fija-t b { font-size: 14px; font-weight: 750; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dw-barra-fija .barra-fija-t span { font-size: 12.5px; color: var(--texto-2); white-space: nowrap; }
.dw-barra-fija .barra-fija-t span b { display: inline; font-size: 12.5px; color: var(--ok); }
.dw-barra-fija .barra-fija-t s { color: var(--texto-3); }
.dw-barra-fija .btn { min-height: 42px; padding: 0 18px; flex-shrink: 0; }
.dw-barra-precio > .icono { width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0; margin-left: -6px; }
.dw-barra-precio .barra-fija-t { flex: 1; gap: 1px; }
.dw-barra-fija .barra-fija-t .dw-bp-precio { display: flex; align-items: center; gap: 6px; }
.dw-barra-fija .barra-fija-t .dw-bp-precio b { flex-shrink: 0; overflow: visible; text-overflow: clip; font-size: 17px; font-weight: 800; letter-spacing: -0.02em; color: var(--ok); }
.dw-barra-precio .btn .flecha { width: 16px; height: 16px; }
.dw-bp-precio s { font-size: 12px; color: var(--texto-3); }
.dw-bp-precio .insignia { height: 19px; padding: 0 6px; font-size: 11px; }
@media (max-width: 379px) { .dw-bp-portada .dw-bp-precio s { display: none; } }
@media (max-width: 369px) { .dw-barra-precio .dw-bp-precio s { display: none; } }
@media (max-width: 429px) { .dw-bp-precio .insignia { display: none; } }
@media (min-width: 768px) { .dw-barra-fija { display: none; } }

@media (prefers-reduced-motion: reduce) {
  .dw-esqueleto { animation: none; }
  .dw-barra-fija { transition: none; }
}

/* ══════════════════════════════════════════════════════════════════════════
   Pago, carrito, «Lo más vendido» y gracias: piezas de la base (estados premium), con la paleta nueva
   ══════════════════════════════════════════════════════════════════════════ */
/* ── Tienda y producto ─────────────────────────────────────────────────── */
.hero-tienda { background: linear-gradient(180deg, #EAF3FF 0%, #FFFFFF 100%); padding-bottom: 8px; }
.seg-scroll { max-width: 100%; overflow-x: auto; scrollbar-width: none; display: inline-grid; grid-auto-columns: max-content; overscroll-behavior-x: contain; }
@media (max-width: 520px) { .seg-scroll { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); } .seg-scroll button { padding: 0 14px; } }
.seg-scroll::-webkit-scrollbar { display: none; }
.destacado-tienda { display: grid; gap: 18px; color: inherit; }
.pt-blush { background: radial-gradient(110% 90% at 100% 0%, #F7FAFF 0%, transparent 60%), #8EC8FF; }
.pt-oliva-liz { background: radial-gradient(110% 90% at 100% 0%, #EAF8EF 0%, transparent 60%), #34C759; }
.pt-lila-liz { background: radial-gradient(110% 90% at 100% 0%, #F2F2F7 0%, transparent 60%), #5E5CE6; }
.pt-agua { background: radial-gradient(110% 90% at 100% 0%, #EAF3FF 0%, transparent 60%), #22B8F0; }
.ficha-t { font-size: clamp(32px, 4vw, 52px); font-weight: 600; line-height: 1.05; margin-top: 14px; }
@media (max-width: 899px) { .producto-liz .ficha { text-align: left !important; } .producto-liz .ficha p { margin-inline: 0; } }
.paso-n { font-size: 22px; font-style: italic; color: #1473FF; width: 28px; }

/* Carrito */
.linea-carrito { gap: 12px; }
.mini-portada { flex-shrink: 0; width: 64px; display: block; }
.mini-portada .portada, .mini-portada .portada-tipo { aspect-ratio: 1/1; border-radius: 12px; padding: 6px; }
.mini-portada .sobre, .mini-portada .sobre-tipo, .mini-portada .sub-tipo { display: none; }
.mini-portada .portada-tipo .grande { font-size: 13px; line-height: 1.05; }
.mini-portada.grande { width: 76px; }

/* ── Para marcas ───────────────────────────────────────────────────────── */
.servicio { display: flex; flex-direction: column; gap: 10px; }
.servicio b { font-size: 18px; }
.servicio .precio { align-items: baseline; gap: 6px; }
.servicio p { font-size: 14px; }
.condiciones { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 24px; }

/* ── Pago ──────────────────────────────────────────────────────────────── */
.pago-liz { min-height: calc(100vh - 60px - var(--alto-cinta)); }
.pago-rejilla { display: grid; gap: 16px; align-items: start; }
@media (min-width: 900px) { .pago-rejilla { grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: 24px; } .pago-aside { position: sticky; top: calc(var(--alto-cinta) + 76px); } }
.opcion-radio { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: var(--widget-2); cursor: pointer; box-shadow: inset 0 0 0 1px var(--linea); transition: box-shadow .2s; }
.opcion-radio:has(input:checked) { background: #EAF3FF; box-shadow: inset 0 0 0 2px #1D1D1F; }
.opcion-radio input { width: 18px; height: 18px; accent-color: #1D1D1F; flex-shrink: 0; }
.opcion-radio .cuerpo { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.opcion-radio .cuerpo span { font-size: 13px; }
.bumps { display: flex; flex-direction: column; gap: 12px; }
/* 26-oct: «Añade a tu pedido» (bumps del catálogo y todo lo de la tienda que se vende): miniatura, nombre, lo que trae y +precio */
.bumps-lista { display: grid; gap: 10px; }
.bump-foto { flex-shrink: 0; display: block; width: 64px; height: 44px; border-radius: 10px; overflow: hidden; background: var(--widget-2); box-shadow: 0 0 0 1px var(--linea); }
.bump-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bump { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 16px; background: #FFFFFF; cursor: pointer; box-shadow: inset 0 0 0 1px var(--linea); }
.bump:has(input:checked) { background: #EAF8EF; box-shadow: inset 0 0 0 2px var(--ok); }
.bump input { width: 20px; height: 20px; accent-color: var(--ok); flex-shrink: 0; }
.bump .mini-portada { width: 52px; }
.bump .cuerpo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bump .cuerpo b { font-size: 14px; line-height: 1.25; }
.bump .cuerpo span { font-size: 12.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bump-precio { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; font-size: 15px; white-space: nowrap; }
.bump-precio s { font-size: 12px; color: var(--texto-3); }
/* En el celular el precio va debajo del nombre (el nombre no se parte en 3 líneas) */
@media (max-width: 480px) {
  .bump { display: grid; grid-template-columns: auto auto minmax(0, 1fr); grid-template-areas: "c f t" "c f p"; column-gap: 12px; row-gap: 2px; padding: 12px; }
  .bump > input { grid-area: c; } .bump > .bump-foto, .bump > .mini-portada { grid-area: f; } .bump > .cuerpo { grid-area: t; } .bump > .bump-precio { grid-area: p; align-items: flex-start; flex-direction: row; gap: 6px; align-items: baseline; }
  .bump .mini-portada { display: block; width: 52px; }
  .bump-foto { width: 60px; height: 42px; border-radius: 9px; }
  .bump-precio { font-size: 14.5px; }
}
.metodo-detalle { font-size: 13.5px; color: var(--texto-2); }

/* ── Gracias ───────────────────────────────────────────────────────────── */
.gracias-liz { min-height: calc(100vh - var(--alto-cinta)); background: radial-gradient(70% 50% at 50% 0%, #EAF3FF 0%, transparent 70%), linear-gradient(180deg, #EAF3FF 0%, #FFFFFF 60%); display: grid; place-items: center; }
.gracias-lista { width: 100%; margin-top: 22px; padding-block: 4px; }
.gracias-lista .fila + .fila { border-top: 1px solid var(--linea); }

/* ── Legal ─────────────────────────────────────────────────────────────── */
/* ── Métodos de pago (17-oct): el componente de #/pagar ─────────── */
.metodos-pago { display: flex; flex-direction: column; gap: 12px; }
.mp-lista { display: grid; gap: 10px; }
.mp-opcion { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 72px; padding: 14px 16px; border-radius: 18px; background: var(--widget-2); cursor: pointer; box-shadow: inset 0 0 0 1px var(--linea); transition: box-shadow .2s, background-color .2s; -webkit-tap-highlight-color: transparent; }
.mp-opcion input, .mp-cuenta input { position: absolute; inset: 0; opacity: 0; margin: 0; pointer-events: none; }
.mp-opcion:has(input:checked) { background: #EAF3FF; box-shadow: inset 0 0 0 2px #1D1D1F; }
.mp-opcion:has(input:focus-visible), .mp-cuenta:has(input:focus-visible) { outline: 3px solid color-mix(in srgb, var(--acento) 55%, transparent); outline-offset: 3px; }
.mp-cuerpo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mp-cuerpo b { font-size: 15.5px; line-height: 1.2; }
.mp-sub { font-size: 13px; line-height: 1.35; color: var(--texto-2); }
/* 26-oct (Omar): los logos de la tarjeta (SVG 38×24 con su fondo), en una fila debajo del nombre. En el celular la fila va de borde a
   borde de la opción (debajo del ícono también) para que quepan los 6 sin partirse. */
.mp-opcion.con-logos { grid-template-rows: auto auto; row-gap: 8px; }
.mp-opcion.con-logos > .icono { grid-column: 1; grid-row: 1 / 3; }
.mp-opcion.con-logos > .mp-cuerpo { grid-column: 2; grid-row: 1; align-self: end; }
.mp-opcion.con-logos > .mp-punto, .mp-opcion.con-logos > .mp-pronto { grid-column: 3; grid-row: 1 / 3; }
.mp-marcas { grid-column: 2; grid-row: 2; align-self: start; display: flex; flex-wrap: wrap; gap: 6px; }
.mp-logo { display: block; width: 38px; height: 24px; flex-shrink: 0; border-radius: 5px; box-shadow: 0 0 0 1px rgba(17, 24, 39, .12), 0 1px 2px rgba(17, 24, 39, .06); }
.mp-logo[hidden] { display: none; }
@media (max-width: 480px) {
  .mp-opcion.con-logos > .icono, .mp-opcion.con-logos > .mp-punto, .mp-opcion.con-logos > .mp-pronto { grid-row: 1; }
  .mp-opcion.con-logos > .mp-cuerpo { align-self: center; }
  .mp-marcas { grid-column: 1 / -1; gap: 5px; }
  .mp-logo { width: 36px; height: 23px; }
}
.mp-punto { width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 2px rgba(17, 24, 39, .28); transition: box-shadow .2s var(--curva); }
.mp-opcion:has(input:checked) .mp-punto { box-shadow: inset 0 0 0 7px #1D1D1F; background: #FFFFFF; }
.mp-pronto { display: none; padding: 4px 9px; border-radius: 999px; font-size: 11px; font-weight: 600; white-space: nowrap; color: var(--texto-2); background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--linea); }
.mp-opcion.apagado { cursor: not-allowed; background: transparent; box-shadow: inset 0 0 0 1px var(--linea); }
.mp-opcion.apagado .mp-pronto { display: inline-block; }
.mp-opcion.apagado .mp-punto { display: none; }
.mp-opcion.apagado > .icono, .mp-opcion.apagado .mp-cuerpo { opacity: .5; filter: grayscale(.6); }
/* Transferencia: Zelle · US$ · RD$ */
.mp-cuentas { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; }
.mp-cuentas[hidden] { display: none; }
.mp-aviso { margin: 10px 0 0; padding: 10px 12px; border-radius: 14px; background: #EAF3FF; font-size: 13px; line-height: 1.45; color: var(--texto); }
.mp-aviso[hidden] { display: none; }
.mp-cuenta { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 84px; padding: 12px 6px; border-radius: 16px; background: #FFFFFF; text-align: center; cursor: pointer; box-shadow: inset 0 0 0 1px var(--linea); transition: box-shadow .2s, background-color .2s; -webkit-tap-highlight-color: transparent; }
.mp-cuenta svg { width: 18px; height: 18px; color: var(--texto-2); margin-bottom: 2px; }
.mp-cuenta b { font-size: 13.5px; line-height: 1.2; }
.mp-cuenta span { font-size: 12px; color: var(--texto-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.mp-cuenta:has(input:checked) { background: #EAF3FF; box-shadow: inset 0 0 0 2px #1D1D1F; }
.mp-cuenta:has(input:checked) svg { color: #1D1D1F; }
.mp-cuenta.apagado { cursor: not-allowed; opacity: .5; }
.mp-cuenta b { white-space: nowrap; }
@media (max-width: 420px) { .mp-cuenta b { font-size: 12.5px; } .mp-cuenta { padding-inline: 4px; } .mp-opcion { gap: 12px; padding: 12px 14px; } }

/* Botón de pagar mientras abre Stripe/PayPal o prepara la transferencia */
.giro { display: inline-block; width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: giro .7s linear infinite; flex-shrink: 0; }
.giro.grande { width: 24px; height: 24px; margin-top: 18px; color: var(--texto-3); }
@keyframes giro { to { transform: rotate(360deg); } }
.btn.cargando { cursor: progress; filter: none; transform: none; }
.btn[data-boton-pagar]:disabled:not(.cargando) { opacity: .5; cursor: not-allowed; }

/* Datos de la transferencia (los manda el servidor) */
.transf { display: flex; flex-direction: column; align-items: center; gap: 18px; max-width: 560px; margin: 0 auto; }
.transf-tarjeta { width: 100%; display: flex; flex-direction: column; gap: 18px; }
.transf-cabeza { display: flex; align-items: center; gap: 14px; }
.transf-cabeza .kicker { display: inline-flex; }
.transf-cabeza h1 { margin-top: 6px; font-size: clamp(22px, 3.2vw, 28px); font-weight: 600; line-height: 1.15; }
.transf-monto { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-radius: 18px; background: #EAF3FF; box-shadow: inset 0 0 0 1px #8EC8FF; }
.transf-monto > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.transf-monto span { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-2); }
.transf-monto b, html[data-zona="sitio"] main .transf-monto b { font-size: clamp(28px, 7vw, 36px); font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
.transf-monto small { font-size: 13px; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.transf-datos { display: flex; flex-direction: column; }
.tr-fila { display: flex; align-items: center; gap: 12px; padding: 12px 2px; }
.tr-fila + .tr-fila { border-top: 1px solid var(--linea); }
.tr-dato { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tr-dato span { font-size: 12px; color: var(--texto-3); }
.tr-dato b { font-size: 15px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.tr-copiar { flex-shrink: 0; display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 12px; background: var(--widget-2); color: var(--texto); cursor: pointer; transition: background-color .2s, transform .16s var(--curva); -webkit-tap-highlight-color: transparent; }
.tr-copiar svg { width: 18px; height: 18px; }
.transf-monto .tr-copiar { background: #FFFFFF; }
@media (hover: hover) { .tr-copiar:hover { background: #3D9BFF; } }
.tr-copiar:active { transform: scale(.94); }
.tr-copiar.copiado { color: var(--ok); }
.transf-nota { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: 16px; background: var(--acento-suave); }
.transf-nota svg { width: 18px; height: 18px; flex-shrink: 0; margin-top: 2px; color: var(--texto); }
.transf-nota p { font-size: 13.5px; line-height: 1.5; color: var(--texto-2); }
.transf-nota b { color: var(--texto); overflow-wrap: anywhere; }

/* ── Móvil: tienda, fichas y pago (17-oct) ── */
/* Piezas comunes: subtítulo, carrusel con scroll-snap, contador, barra fija y errores junto al campo */
.mt-sub { margin: 0 0 12px; font-family: var(--letra-display); font-size: 22px; font-weight: 600; line-height: 1.15; color: var(--texto); }
@media (min-width: 768px) { .mt-sub { font-size: 28px; margin-bottom: 16px; } }
.mt-formato { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-3); }
.mt-cuenta-n { display: inline-grid; place-items: center; min-width: 22px; height: 22px; margin: 0 auto 0 8px; padding: 0 7px; border-radius: 999px; font-size: 12px; font-weight: 700; background: #3D9BFF; color: #1D1D1F; }
.mt-carrusel { display: grid; grid-auto-flow: column; grid-auto-columns: 82%; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--margen); padding: 4px var(--margen) 16px; margin-inline: calc(-1 * var(--margen)); scrollbar-width: none; }
.mt-carrusel::-webkit-scrollbar { display: none; }
.mt-carrusel > * { scroll-snap-align: start; min-width: 0; }
.mt-carrusel.mt-uno { grid-auto-columns: 100%; }
@media (min-width: 640px) { .mt-carrusel { grid-auto-columns: 46%; } }
@media (min-width: 1024px) {
  .mt-carrusel { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 16px; overflow: visible; margin-inline: 0; padding: 4px 0 0; }
  .mt-relacionados .mt-carrusel > :nth-child(n+4) { display: none; }
}
.mt-error { display: none; font-size: 12.5px; font-weight: 600; line-height: 1.3; color: #B4232A; }
.campo.mt-mal .mt-error { display: block; }
.campo.mt-mal .entrada { background: #FFF6F5; box-shadow: inset 0 0 0 2px #D9534F; }
@media (max-width: 767px) { .mt-form .entrada, .mt-lead .entrada { font-size: 16px; } } /* 16 px: el iPhone no hace zoom al escribir */
@media (max-width: 767px) { .mt-solo-escritorio { display: none; } }
.mt-agregar.activo { background: #3D9BFF; color: #1D1D1F; }

/* Tienda: título corto, chips fijos, destacados y tarjetas compactas */
.mt-hero-tienda { padding: 18px 0 4px; text-align: center; }
.mt-hero-tienda .h1 { margin-top: 8px; font-size: clamp(28px, 7.6vw, 56px); }
html[data-zona="sitio"] .mt-hero-tienda .h1 { font-size: clamp(28px, 7.6vw, 56px); }
@media (max-width: 639px) { .mt-hero-tienda .kicker { display: none; } .mt-hero-tienda .h1 { margin-top: 0; } }
@media (min-width: 900px) { .mt-hero-tienda { padding: 44px 0 8px; } }
.mt-chips-barra { position: sticky; top: calc(var(--alto-cinta) + 56px); z-index: 30; background: color-mix(in srgb, #FFFFFF 86%, transparent); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); box-shadow: inset 0 -1px 0 var(--linea); }
.mt-chips { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; padding: 10px var(--margen); margin-inline: calc(-1 * var(--margen)); scroll-padding-inline: var(--margen); }
.mt-chips::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .mt-chips { justify-content: center; } }
.mt-chip { flex-shrink: 0; min-height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--linea); font: 600 14px/1 var(--letra); color: var(--texto-2); cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color .2s, color .2s; }
.mt-chip[aria-pressed="true"] { background: #1D1D1F; color: #FFFFFF; box-shadow: none; }
.mt-bloque { padding: 18px 0 6px; background: var(--suelo); }
.mt-bloque-lista { padding-bottom: 44px; }
@media (min-width: 900px) { .mt-bloque { padding-top: 32px; } .mt-bloque-lista { padding-bottom: 72px; } }
/* Destacado (carrusel) */
.mt-dest { display: flex; flex-direction: column; gap: 12px; padding: 12px; color: inherit; }
.mt-dest-foto { display: block; flex-shrink: 0; aspect-ratio: 16/10; border-radius: 16px; overflow: hidden; background: #3D9BFF; }
.mt-dest-foto img { width: 100%; height: 100%; object-fit: cover; }
.mt-dest-foto .portada, .mt-dest-foto .portada-tipo { aspect-ratio: auto; height: 100%; border-radius: 0; }
.mt-dest-texto { flex: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 0 4px 4px; min-width: 0; }
.mt-dest-t, html[data-zona="sitio"] main .mt-dest-t { font-family: var(--letra-display); font-size: 19px; font-weight: 600; line-height: 1.2; color: var(--texto); }
.mt-dest-nota { font-size: 13px; font-weight: 600; color: var(--texto-2); }
.mt-dest-cta { margin-top: auto; }
.mt-dest .mt-prod-botones { width: 100%; margin-top: auto; }
@media (max-width: 639px) {
  .mt-carrusel-dest { grid-auto-columns: 74%; }
  .mt-dest { gap: 10px; padding: 10px; }
  .mt-dest-foto { aspect-ratio: 2/1; }
  .mt-dest-foto .portada-tipo { padding: 12px; }
  .mt-dest-foto .portada-tipo .grande { font-size: 26px; }
  .mt-dest-t, html[data-zona="sitio"] main .mt-dest-t { font-size: 17px; }
  .mt-dest-boot .insignia { font-size: 11px; }
  html[data-zona="sitio"] main .mt-dest-nota { font-size: 12.5px; line-height: 1.4; }
}
@media (min-width: 640px) {
  .mt-uno .mt-dest { flex-direction: row; align-items: center; gap: 24px; padding: 16px; }
  .mt-uno .mt-dest-foto { width: 46%; }
  .mt-uno .mt-dest-t { font-size: 28px; }
}
/* Tarjeta compacta: foto a la izquierda, nombre y precio, y los dos botones */
.mt-lista { display: grid; gap: 10px; }
.mt-prod { display: grid; grid-template-columns: 96px minmax(0, 1fr); grid-template-areas: "foto info" "foto botones"; grid-template-rows: 1fr auto; column-gap: 14px; row-gap: 10px; padding: 12px; border-radius: 20px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 18px 36px -30px var(--sombra); }
.mt-prod-foto { grid-area: foto; display: block; min-height: 96px; border-radius: 14px; overflow: hidden; background: #3D9BFF; }
.mt-prod-foto .portada, .mt-prod-foto .portada-tipo { aspect-ratio: auto; height: 100%; min-height: 96px; border-radius: 0; }
.mt-prod-info { grid-area: info; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mt-prod-nombre { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-family: var(--letra-display); font-size: 17px; font-weight: 600; line-height: 1.2; color: var(--texto); }
.mt-prod .precio { margin-top: 2px; }
.mt-prod-botones { grid-area: botones; display: flex; align-items: center; gap: 8px; }
.mt-prod-botones .btn, .mt-prod-botones .btn-sec { min-height: 44px; padding: 0 14px; font-size: 13.5px; }
.mt-prod-botones > :last-child { flex: 1; }
.mt-prod-botones svg { width: 17px; height: 17px; }
@media (max-width: 639px) {
  .mt-prod-foto .portada-tipo { padding: 8px; }
  .mt-prod-foto .sobre, .mt-prod-foto .sobre-tipo, .mt-prod-foto .sub-tipo { display: none; }
  .mt-prod-foto .portada-tipo .grande { font-size: 15px; line-height: 1.05; }
}
@media (max-width: 389px) { .mt-prod-botones .mt-agregar { width: 44px; padding: 0; flex-shrink: 0; } .mt-prod-botones .mt-agregar span { display: none; } }
@media (min-width: 640px) {
  .mt-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .mt-prod { grid-template-columns: minmax(0, 1fr); grid-template-areas: "foto" "info" "botones"; grid-template-rows: auto 1fr auto; row-gap: 12px; padding: 14px; }
  .mt-prod-foto { aspect-ratio: 16/10; min-height: 0; }
  .mt-prod-nombre { font-size: 20px; }
}
@media (min-width: 1024px) { .mt-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Recursos gratis: dos tarjetas lado a lado */
.mt-gratis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mt-gratis-item { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px; color: inherit; }
html[data-zona="sitio"] main .mt-gratis-item b, .mt-gratis-item b { font-size: 15px; line-height: 1.25; }
.mt-gratis-cta { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; min-height: 28px; font-size: 13.5px; font-weight: 600; color: #1D1D1F; }
.mt-gratis-cta svg { width: 16px; height: 16px; }

/* Ficha de producto */
.mt-ficha, html[data-zona="sitio"] .seccion.mt-ficha { padding-top: 14px; }
.mt-ficha .atras { margin-bottom: 10px; }
.mt-ficha-rejilla { display: grid; gap: 18px; }
@media (max-width: 899px) { .mt-ficha-foto .portada.grande, .mt-ficha-foto .portada-tipo.grande { aspect-ratio: 16/10; } }
@media (min-width: 900px) { .mt-ficha, html[data-zona="sitio"] .seccion.mt-ficha { padding-top: 40px; } .mt-ficha-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: start; } .mt-ficha-foto { position: sticky; top: calc(var(--alto-cinta) + 80px); } }
.mt-ficha-info .ficha-t { margin-top: 8px; }
.mt-ficha-precio { margin-top: 10px; }
.mt-vinetas { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.mt-vinetas li { display: flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 500; line-height: 1.35; }
.mt-ficha-cta { display: flex; gap: 10px; margin-top: 18px; }
.mt-ficha-cta > .btn, .mt-ficha-cta > .btn-sec { min-height: 52px; }
.mt-ficha-cta > .ancho, .mt-cta-principal { flex: 1; }
.mt-ficha-cta .mt-agregar { flex-shrink: 0; padding: 0 18px; }
.mt-entrega { display: flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 12.5px; color: var(--texto-3); }
html[data-zona="sitio"] main .mt-entrega { font-size: 12.5px; }
.mt-entrega svg { width: 14px; height: 14px; flex-shrink: 0; }
.mt-acordeon { margin-top: 22px; }
.mt-acordeon .lista { padding-bottom: 12px; }
.mt-acordeon .widget { padding: 0 0 12px; background: transparent; box-shadow: none; }
.mt-acordeon .widget > b:first-child, .mt-acordeon .widget > div:first-child > b { display: none; }
.mt-acordeon .widget > div:first-child { padding-top: 0 !important; }
.mt-relacionados { padding-block: 28px 36px; }
@media (min-width: 900px) { .mt-relacionados { padding-block: 56px 72px; } }

/* Carrito (hoja): total y «Pagar» fijos al pie de la hoja */
.mt-carrito-lista .redondo { width: 44px; height: 44px; }
.mt-sugeridos .btn-sec { min-height: 40px; }
.mt-carrito-pie { position: sticky; bottom: -22px; z-index: 1; display: grid; gap: 8px; margin: 14px -18px -22px; padding: 10px 18px calc(16px + env(safe-area-inset-bottom)); background: var(--suelo); box-shadow: 0 -1px 0 var(--linea); }
.mt-carrito-pie .fila { padding-block: 4px; }
@media (min-width: 768px) { .mt-carrito-pie { bottom: -28px; margin: 14px -28px -28px; padding: 12px 28px 22px; } }

/* Pago: resumen plegable con el total a la vista y el botón fijo abajo en el celular */
.mt-pago-t { font-size: 24px; font-weight: 600; }
@media (min-width: 768px) { .mt-pago-t { font-size: 28px; } }
.mt-datos .dos-campos { display: grid; gap: 12px; } /* (I2) */
.mt-dos-fijo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 420px) { .mt-dos-fijo { grid-template-columns: minmax(0, 1fr); } }
.mt-resumen { padding: 10px 14px; }
.mt-resumen > summary { list-style: none; display: flex; align-items: center; gap: 12px; min-height: 52px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.mt-resumen > summary::-webkit-details-marker { display: none; }
.mt-resumen .mini-portada { width: 80px; }
/* 26-oct (Omar): la portada del curso entera, horizontal 16:9 y sin recortar (en escritorio, arriba y a todo lo ancho) */
.mt-resumen .mini-portada .portada { aspect-ratio: 16 / 9; padding: 0; border-radius: 10px; box-shadow: 0 0 0 1px var(--linea); }
@media (max-width: 899px) { .mt-resumen > summary { gap: 10px; } .mt-resumen .mini-portada { width: 68px; } .mt-resumen .mini-portada .portada { border-radius: 8px; } html[data-zona="sitio"] main .mt-total, .mt-total { font-size: 18px; } }
.mt-resumen .mini-portada .portada img { object-position: 50% 50%; }
.mt-resumen-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
html[data-zona="sitio"] main .mt-resumen-t b, .mt-resumen-t b { font-size: 14.5px; line-height: 1.25; white-space: normal; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } /* (I3) */
/* En el celular el nombre corto («CapCut Móvil») para que quepa junto al total; en escritorio, el largo */
.mt-resumen-t b .mt-t-corto { display: none; }
@media (max-width: 899px) { .mt-resumen-t b .mt-t-largo { display: none; } .mt-resumen-t b .mt-t-corto { display: inline; } }
.mt-resumen-t b span { font-size: inherit; color: inherit; white-space: inherit; }
.mt-resumen-t > span { font-size: 12.5px; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html[data-zona="sitio"] main .mt-total, .mt-total { font-size: 20px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.mt-chev { display: grid; place-items: center; flex-shrink: 0; width: 28px; height: 28px; border-radius: 999px; background: var(--widget-2); transition: transform .25s var(--curva); }
.mt-chev svg { width: 16px; height: 16px; }
.mt-resumen[open] .mt-chev { transform: rotate(180deg); }
.mt-cupon .entrada { min-height: 44px; }
.mt-cupon .btn-sec { min-height: 44px; }
@media (max-width: 899px) {
  .mt-pago { padding-top: 12px; padding-bottom: calc(108px + env(safe-area-inset-bottom)); }
  .mt-pago .mt-atras { margin-bottom: 8px; }
  /* 27-oct: el aside se deshace para que el resumen vaya arriba y «Añade a tu pedido» después de los métodos */
  .mt-pago-aside { display: contents; }
  .mt-pago-aside .mt-resumen { order: -1; }
  .mt-pago-aside .bumps { order: 1; }
  .mt-pagar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 46; padding: 10px var(--margen) calc(10px + env(safe-area-inset-bottom)); background: color-mix(in srgb, #FFFFFF 88%, transparent); -webkit-backdrop-filter: blur(18px) saturate(170%); backdrop-filter: blur(18px) saturate(170%); box-shadow: 0 -1px 0 var(--linea), 0 -18px 30px -24px var(--sombra); }
  .mt-pagar .btn { max-width: 560px; margin-inline: auto; display: flex; min-height: 54px; }
  .mt-pago .transf { padding-bottom: 72px; }
}
@media (min-width: 900px) {
  .mt-pago .mt-atras { margin-bottom: 14px; }
  .mt-resumen { padding: 18px; }
  .mt-resumen > summary { flex-wrap: wrap; row-gap: 14px; }
  .mt-resumen .mini-portada { width: 100%; }
  .mt-resumen .mini-portada .portada { border-radius: 14px; }
  .mt-resumen[open] .mt-total { display: none; }
  .mt-pago-aside { gap: 12px; }
  .mt-pago-aside .bumps { margin-top: 6px; }
  .mt-pago-aside:has(.bumps) { position: static; } /* con los añadidos es más alto que la pantalla: fijo cortaría la lista */
  /* En la columna angosta el precio va debajo del nombre, como en el celular (el nombre no se parte en 3 líneas) */
  .mt-pago-aside .bumps { padding: 18px; }
  .mt-pago-aside .bump { display: grid; grid-template-columns: auto auto minmax(0, 1fr); grid-template-areas: "c f t" "c f p"; column-gap: 12px; row-gap: 2px; }
  .mt-pago-aside .bump > input { grid-area: c; } .mt-pago-aside .bump > .bump-foto, .mt-pago-aside .bump > .mini-portada { grid-area: f; } .mt-pago-aside .bump > .cuerpo { grid-area: t; }
  .mt-pago-aside .bump > .bump-precio { grid-area: p; flex-direction: row; gap: 6px; align-items: baseline; font-size: 14.5px; }
}
.tr-copiar { width: 44px; height: 44px; }

/* Gracias: un mensaje y un botón */
.mt-gracias-cta { width: 100%; max-width: 380px; }
@media (max-width: 639px) { .mt-gracias .icono.xl { margin-top: 20px !important; } .mt-gracias .h1 { margin-top: 14px !important; } }

/* The Content Casa y Para marcas: héroe más corto, tarjetas en carrusel y chips en una fila */
@media (max-width: 899px) { .mt-hero-corto .hero-visual { max-width: 240px; } }
.mt-casa-puntos { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; text-align: left; }
.mt-casa-puntos li { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px; border-radius: 16px; background: rgba(255,255,255,.75); box-shadow: inset 0 0 0 1px var(--linea); font-size: 13.5px; font-weight: 500; line-height: 1.35; color: var(--texto); }
.mt-casa-puntos li:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (min-width: 768px) { .mt-casa-puntos li { flex-direction: row; align-items: center; gap: 10px; font-size: 15px; } }
@media (max-width: 639px) { .casa-mock .casa-cats, .casa-mock .casa-post ~ .casa-post ~ .casa-post { display: none; } }
@media (max-width: 639px) {
  .mt-carrusel-movil { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 80%; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--margen); padding: 4px var(--margen) 14px; margin-inline: calc(-1 * var(--margen)); scrollbar-width: none; }
  .mt-carrusel-movil::-webkit-scrollbar { display: none; }
  .mt-carrusel-movil > * { scroll-snap-align: start; }
  .mt-fila-chips { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; padding: 2px var(--margen); margin: 12px calc(-1 * var(--margen)) 0; }
  .mt-fila-chips::-webkit-scrollbar { display: none; }
  .mt-fila-chips > * { flex-shrink: 0; }
}
.mt-plegable > summary { list-style: none; display: flex; align-items: center; gap: 8px; padding: 16px 0; font-size: 15.5px; font-weight: 600; cursor: pointer; }
.mt-plegable > summary::-webkit-details-marker { display: none; }
.mt-plegable > summary .mas { display: grid; place-items: center; flex-shrink: 0; width: 26px; height: 26px; margin-left: auto; border-radius: 999px; background: var(--widget-2); transition: transform .25s var(--curva); }
.mt-plegable[open] > summary { box-shadow: inset 0 -1px 0 var(--linea); }
.mt-plegable[open] > summary .mas { transform: rotate(45deg); }
.mt-mas-campos > summary { list-style: none; display: flex; align-items: center; gap: 6px; min-height: 44px; font-size: 14px; font-weight: 600; color: var(--texto); cursor: pointer; }
.mt-mas-campos > summary::-webkit-details-marker { display: none; }
.mt-mas-campos > summary svg { width: 16px; height: 16px; margin-left: auto; transition: transform .25s var(--curva); }
.mt-mas-campos[open] > summary svg { transform: rotate(180deg); }
.mt-mas-campos > .pila { margin-top: 8px; }

/* Checklist y calculadora: el formulario entra casi completo en la primera pantalla */
@media (max-width: 639px) {
  .mt-lead .mt-ayuda { display: none; }
  .mt-lead > h2 { margin-bottom: 14px; }
  .mt-lead .dos-campos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Masterclass que ya pasó: estado corto con el paso siguiente */
.mv-pagina .hero-master.mv-pasada { padding-block: 48px; text-align: center; }
.mv-pasada .contenedor { display: flex; flex-direction: column; align-items: center; }
.mv-pasada .h1 { margin-top: 16px; }
.mv-pasada .hero-bajada { margin-inline: auto; color: #D1D1D6; }
.mv-pasada .hero-bajada em { font-style: italic; }
/* Ajuste tras medir a 390 px: chips más compactos (dos filas como mucho) y capturas más angostas */
@media (max-width: 639px) {
  .mv-chips { gap: 6px; }
  .mv-chip { height: 30px; padding: 0 10px; gap: 5px; font-size: 12px; }
  .mv-chip svg { width: 13px; height: 13px; }
  .mv-muro .mv-pista { grid-auto-columns: 62%; }
  .mv-productos .mv-pista { grid-auto-columns: 74%; }
  .mv-pagina .form-master h2.serif { font-size: 22px; }
  .mv-pagina .hero-master .mv-con-liz { margin-top: 12px; }
}
.mv-sobre > .mv-dos { grid-column: 1 / -1; margin-top: 0; }
@media (min-width: 900px) { .mv-sobre-foto { grid-row: span 2; } .mv-sobre > .mv-dos { grid-column: 2; align-self: start; } }

/* Auditoría de diseño (17-oct): los flotantes no tapan nada en el pago ni con la barra fija */
body:has(form[data-enviar="pagar"]) #lz-web, body:has(form[data-enviar="pagar"]) .flotantes-liz, body:has(.transf) #lz-web, body:has(.transf) .flotantes-liz { display: none; }
@media (max-width: 767px) {
  body.con-barra-compra .flotantes-liz { display: none; }
  body.con-barra-compra #lz-web .lz-lanzador { transform: scale(.82); transform-origin: bottom right; }
}
/* Auditoría 17-oct (A2): con la barra fija visible en el celular, WhatsApp se oculta (LIZA atiende) y LIZA se achica; el pie deja aire para la barra */
@media (max-width: 767px) {
  .flotantes.flotantes-liz { transition: bottom .35s var(--curva), opacity .25s; }
  body.con-barra-compra .flotantes.flotantes-liz { opacity: 0; pointer-events: none; }
  body.con-barra-compra #lz-web .lz-lanzador { transform: scale(.82); transform-origin: bottom right; transition: transform .25s var(--curva); }
}
.revela-precio .cuenta.mv-cuenta-abre { width: 100%; max-width: 320px; }

/* 18-oct: inscripción por etapas (abierta / cerrada), masterclass «próximamente» y nota de las cuotas en el pago */
.insc-cierre { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 18px; padding: 14px 12px 12px; border-radius: 20px; background: var(--acento-suave); }
.insc-cierre .kicker { color: var(--texto); }
.insc-cierre .cuenta { width: 100%; max-width: 320px; }
.metodos > span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.metodos > i { font-style: normal; opacity: .55; }
.insc-nota { margin-top: 10px; text-align: center; font-size: 13px; font-weight: 600; color: var(--texto-2); }
.insc-cerrada { min-height: 62vh; background: linear-gradient(180deg, #EAF3FF 0%, #FFFFFF 100%); }
.insc-cerrada .contenedor { display: flex; flex-direction: column; align-items: center; text-align: center; }
.insc-cerrada .h1 { margin-top: 14px; font-size: clamp(36px, 10vw, 60px); line-height: 1.04; }
.insc-cerrada .h1 em { color: #1473FF; }
.insc-cerrada .form-master { width: 100%; margin-top: 22px; text-align: left; }
.insc-tienda { margin-top: 18px; }
.mv-pasada .kicker { color: #3D9BFF; justify-content: center; }
.mc-proxima { width: 100%; max-width: 520px; margin: 24px auto 0; text-align: left; }
.mp-cuotas { background: var(--widget-2); color: var(--texto-2); }
.casa-intro { margin-top: 12px; max-width: 34rem; }
.casa-planes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; margin-top: 18px; }
.casa-plan { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 16px 8px; border-radius: 18px; background: var(--widget-2); box-shadow: inset 0 0 0 1px var(--linea); text-align: center; }
.casa-plan:last-child { background: #EAF3FF; box-shadow: inset 0 0 0 2px #8EC8FF; }

/* ── Estados premium (18-oct): gracias por estado, datos de transferencia dentro de gracias y error del pago ── */
.gracias-botones { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 22px; }
.gracias-transf { width: 100%; margin-top: 22px; text-align: left; }
.gracias-transf .transf-h { margin-top: 6px; font-size: clamp(20px, 3vw, 24px); font-weight: 600; line-height: 1.15; }
.mt-gracias .bajada b { overflow-wrap: anywhere; }
.mt-gracias .bajada b.sin-corte { white-space: nowrap; overflow-wrap: normal; }
.mt-pagar .pago-error { margin-bottom: 10px; }
@media (max-width: 899px) {
  .mt-pagar .pago-error { max-width: 560px; margin-inline: auto; margin-bottom: 8px; padding: 10px 12px; }
  .mt-pago:has(.pago-error) { padding-bottom: calc(230px + env(safe-area-inset-bottom)); }
}
.mt-cupon-msg { margin-top: 8px; }
/* 20-oct (PDF de Liz, punto 1): en Playfair el 0 parece una O; en «De 0 a Creadora UGC» va en Inter */
.cero { font-family: var(--letra); font-style: normal; font-weight: 500; font-size: .9em; letter-spacing: 0; }

/* 22-oct (navegación): página suelta (#/inscripcion) sin menú pero sin trampa: «Volver» a la izquierda y el logo, que lleva al inicio */
.barra-sola .dentro { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; justify-items: center; }
.barra-sola .dentro > :first-child { justify-self: start; }
.barra-sola-hueco { width: 40px; height: 40px; }
.barra-sola a[href="#/"] { display: inline-flex; color: inherit; }

/* ══ 22-oct · Tienda que vende (TIENDA.md): precio, tarjetas, fichas, carrito, pago y «Lo más vendido» ══════════════════════ */
/* Precio: la cifra manda (moneda chica, centavos arriba). Verde y rojo SOLO con una oferta real (con fecha de fin). */
.precio-bloque { display: flex; flex-direction: column; gap: 4px; }
.precio .monto .mon { font-size: .48em; font-weight: 700; letter-spacing: 0; margin-right: 2px; vertical-align: .7em; }
.precio .monto .cent { font-size: .5em; font-weight: 700; letter-spacing: 0; vertical-align: .62em; }
[data-zona="sitio"] .precio.con-oferta .monto { color: var(--ok); }
.precio .antes { font-weight: 600; color: var(--texto-3); }
.pct-oferta { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 800; letter-spacing: 0; color: #fff; background: var(--urgente); white-space: nowrap; }
.precio .pct-oferta { align-self: center; }
.cuotas-linea { font-size: 13.5px; font-weight: 500; color: var(--texto-2); }
.cuotas-linea b { color: var(--texto); font-weight: 700; }
.oferta-hasta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 2px; font-size: 12.5px; font-weight: 600; }
.oh-fin { display: inline-flex; align-items: center; gap: 5px; color: var(--urgente); }
.oh-fin svg { width: 14px; height: 14px; flex-shrink: 0; }
.oh-ahorro { padding: 2px 8px; border-radius: 999px; font-size: 12px; color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.texto-oferta { color: var(--urgente); font-weight: 600; }

/* Confianza: una línea corta con lo que de verdad pasa (cómo llega, pago seguro, pagos) */
.fx-confianza { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; font-weight: 600; color: var(--texto-2); }
.fx-confianza li { display: inline-flex; align-items: center; gap: 6px; }
.fx-confianza svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--acento); }
.tt-confianza { justify-content: center; margin-top: 12px; }
@media (max-width: 639px) { .tt-confianza { gap: 6px 12px; font-size: 12px; } .tt-confianza li:last-child { display: none; } }

/* Insignias al lado del nombre (ya no encima de la foto) */
.tt-insignias { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 2px; }
.insignia.suave { color: #3C3C43; background: #EAF3FF; }
.insignia.vendido { color: #3D9BFF; background: #1D1D1F; }
.insignia.vendido svg { width: 13px; height: 13px; }
.mt-sub-s { margin-left: 6px; font-family: var(--letra); font-size: 13px; font-weight: 600; color: var(--texto-3); vertical-align: middle; }

/* Tarjeta de producto: en el celular, foto a la izquierda y los dos botones abajo; en carruseles y escritorio, foto arriba */
.tt-lista { display: grid; gap: 12px; }
.tt-prod { display: grid; grid-template-columns: 104px minmax(0, 1fr); grid-template-areas: "foto info" "botones botones"; column-gap: 14px; row-gap: 12px; padding: 12px; border-radius: 22px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 18px 36px -30px var(--sombra); min-width: 0; }
.tt-foto { grid-area: foto; display: block; align-self: start; aspect-ratio: 1/1; border-radius: 16px; overflow: hidden; background: #3D9BFF; }
.tt-foto .portada, .tt-foto .portada-tipo { aspect-ratio: auto; height: 100%; border-radius: 0; }
.tt-foto .portada-tipo { padding: 10px; }
.tt-foto .portada-tipo .grande { font-size: 18px; line-height: 1.05; }
.tt-foto .sub-tipo { display: none; }
.tt-info { grid-area: info; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tt-nombre, html[data-zona="sitio"] main .tt-nombre { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-family: var(--letra-display); font-size: 17px; font-weight: 600; line-height: 1.2; color: var(--texto); }
.tt-formato { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; color: var(--texto-3); }
.tt-precio { margin-top: 6px; }
.tt-precio .precio .monto { font-size: 24px; }
.tt-botones { grid-area: botones; display: flex; align-items: center; gap: 8px; }
.tt-botones .btn, .tt-botones .btn-sec { min-height: 44px; padding: 0 14px; font-size: 13.5px; }
.tt-botones .mt-comprar, .tt-botones .tt-ver { flex: 1; }
.tt-botones svg { width: 17px; height: 17px; }
.tt-prod.tt-vertical { grid-template-columns: minmax(0, 1fr); grid-template-areas: "foto" "info" "botones"; grid-template-rows: auto 1fr auto; height: 100%; }
.tt-vertical .tt-foto { aspect-ratio: 16/10; }
.tt-vertical .tt-foto .portada-tipo { padding: 14px; }
.tt-vertical .tt-foto .portada-tipo .grande { font-size: 26px; }
@media (max-width: 389px) { .tt-botones .mt-agregar { width: 44px; padding: 0; flex-shrink: 0; } .tt-botones .mt-agregar span { display: none; } }
@media (min-width: 640px) {
  .tt-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .tt-lista .tt-prod { grid-template-columns: minmax(0, 1fr); grid-template-areas: "foto" "info" "botones"; grid-template-rows: auto 1fr auto; padding: 14px; }
  .tt-lista .tt-foto { aspect-ratio: 16/10; }
  .tt-lista .tt-foto .portada-tipo { padding: 16px; }
  .tt-lista .tt-foto .portada-tipo .grande { font-size: 28px; }
  .tt-nombre, html[data-zona="sitio"] main .tt-nombre { font-size: 20px; }
}
@media (min-width: 1024px) { .tt-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.mv-productos .tt-prod { height: 100%; }
.mt-carrusel-dest > .tt-prod { height: 100%; }

/* El bootcamp arriba de la tienda: foto, cuenta regresiva real y el botón */
.tt-boot { display: grid; overflow: hidden; border-radius: 26px; background: linear-gradient(180deg, #EAF3FF 0%, #F7FAFF 100%); box-shadow: 0 0 0 1px var(--linea), 0 30px 60px -40px rgba(17, 24, 39,.6); }
.tt-boot-foto { display: block; aspect-ratio: 2/1; overflow: hidden; background: #8EC8FF; }
.tt-boot-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.tt-boot-texto { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 16px; min-width: 0; }
.tt-boot-k { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700; color: var(--texto); }
.tt-boot-t, html[data-zona="sitio"] main .tt-boot-t { font-family: var(--letra-display); font-size: 26px; font-weight: 600; line-height: 1.1; color: var(--texto); }
.tt-boot .tt-precio .precio .monto { font-size: 30px; }
.tt-boot-cuenta { width: 100%; max-width: 360px; margin-top: 6px; }
.tt-boot-cta { width: 100%; margin-top: 8px; }
@media (min-width: 768px) {
  .tt-boot { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .tt-boot-foto { aspect-ratio: auto; height: 100%; min-height: 320px; }
  .tt-boot-texto { justify-content: center; padding: 28px 32px; gap: 8px; }
  .tt-boot-t, html[data-zona="sitio"] main .tt-boot-t { font-size: 36px; }
  .tt-boot-cta { width: auto; }
}
.tt-ayuda { display: flex; align-items: center; gap: 12px; margin-top: 16px; padding: 14px 16px; color: inherit; }
.tt-ayuda > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; gap: 2px; }
html[data-zona="sitio"] main .tt-ayuda b, .tt-ayuda b { font-size: 15px; }
.tt-ayuda > span:nth-child(2) > span { font-size: 13px; color: var(--texto-2); }

/* Ficha de producto: lo que incluye, el precio y el botón arriba, sin abrir nada */
.fx-sub, html[data-zona="sitio"] main .fx-sub { margin-top: 8px; font-size: 15px; line-height: 1.55; color: var(--texto-2); }
.fx-incluye { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.fx-incluye li { display: flex; gap: 12px; align-items: flex-start; }
.fx-incluye li > span:last-child { display: flex; flex-direction: column; gap: 1px; min-width: 0; padding-top: 2px; }
.fx-incluye b, html[data-zona="sitio"] main .fx-incluye b { font-size: 14.5px; font-weight: 600; line-height: 1.3; }
.fx-incluye li > span:last-child > span { font-size: 13px; line-height: 1.4; color: var(--texto-2); }
.fx-compra { margin-top: 18px; padding: 16px; border-radius: 22px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 24px 48px -34px var(--sombra); }
.fx-compra .mt-ficha-precio { margin-top: 0; }
.fx-compra .mt-ficha-cta { margin-top: 14px; }
.fx-ancla { display: flex; gap: 8px; align-items: flex-start; margin-top: 10px; font-size: 13px; line-height: 1.45; color: var(--texto-2); }
.fx-ancla svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; color: var(--ok); }
.fx-resultado { margin-top: 16px; padding: 14px 16px; border-radius: 18px; background: #EAF3FF; }
.fx-resultado p, html[data-zona="sitio"] main .fx-resultado p { margin-top: 6px; font-family: var(--letra-display); font-size: 18px; font-weight: 500; line-height: 1.35; color: var(--texto); }
.fx-para { margin-top: 16px; }
.fx-para .lista-check { margin-top: 8px; }
.fx-desc { margin-top: 16px; }
@media (max-width: 899px) { .mt-ficha-foto .portada-tipo.grande { aspect-ratio: 2/1; } .mt-ficha-foto .portada-tipo.grande .grande { font-size: 34px; } }
.mt-ficha-foto .portada.subida { aspect-ratio: auto; background: #FFFFFF; }
.mt-ficha-foto .portada.subida img { height: auto; max-height: 72vh; object-fit: contain; }
@media (min-width: 900px) { .fx-compra { padding: 20px; } }
.fx-temas { display: grid; gap: 12px; }
.fx-tema { display: flex; flex-direction: column; gap: 8px; }
@media (min-width: 768px) { .fx-temas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.fx-pasos { list-style: none; margin: 0 auto; padding: 0; display: grid; gap: 10px; max-width: 720px; }
.fx-pasos li { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 18px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); font-size: 14.5px; font-weight: 500; line-height: 1.4; }
.fx-pasos b, html[data-zona="sitio"] main .fx-pasos b { flex-shrink: 0; width: 34px; height: 34px; border-radius: 999px; display: grid; place-items: center; font-family: var(--letra-display); font-style: italic; font-size: 18px; font-weight: 600; color: #1D1D1F; background: #3D9BFF; }
@media (min-width: 900px) { .fx-pasos { max-width: none; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); } .fx-pasos li { flex-direction: column; align-items: flex-start; padding: 18px; } .fx-pasos:has(> li:nth-child(3):last-child) { --n: 3; } }
.fx-cifras { grid-column: 1 / -1; }
@media (min-width: 900px) { .fx-liz .fx-cifras { grid-column: 2; } }
.fx-cierre .precio-bloque { align-items: center; margin-top: 12px; }
.fx-cierre .precio .monto { font-size: 40px; }

/* Carrito */
.tc-n { display: inline-grid; place-items: center; min-width: 24px; height: 24px; margin-left: 6px; padding: 0 7px; border-radius: 999px; font-family: var(--letra); font-size: 13px; font-weight: 700; vertical-align: middle; background: #3D9BFF; color: #1D1D1F; }
.linea-carrito .mini-portada { width: 60px; }
.lc-precio { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; flex-shrink: 0; }
.lc-precio s { font-size: 12px; color: var(--texto-3); }
.mt-sug-k { margin: 16px 0 4px; }
.mini-portada.chica { width: 44px; }
.mt-sugeridos .fila { gap: 10px; }
.mt-sugeridos .btn-sec { min-height: 40px; padding: 0 12px; gap: 4px; }
.mt-sugeridos .btn-sec svg { width: 15px; height: 15px; }
@media (max-width: 389px) { .mt-sugeridos .btn-sec span { display: none; } .mt-sugeridos .btn-sec { width: 40px; padding: 0; } }
.mt-carrito-conf { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--texto-2); }
.mt-carrito-conf svg { width: 14px; height: 14px; }

/* Pago: «Cómo lo pagas» en dos tarjetas arriba, lo de hoy y lo que falta en palabras */
.mt-planes { display: flex; flex-direction: column; gap: 12px; }
.mt-planes-op { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mt-plan { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 14px 12px 12px; border-radius: 18px; background: var(--widget-2); box-shadow: inset 0 0 0 1px var(--linea); cursor: pointer; -webkit-tap-highlight-color: transparent; transition: box-shadow .2s, background-color .2s; }
.mt-plan input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.mt-plan:has(input:checked) { background: #EAF3FF; box-shadow: inset 0 0 0 2px #1D1D1F; }
.mt-plan:has(input:focus-visible) { outline: 3px solid color-mix(in srgb, var(--acento) 55%, transparent); outline-offset: 3px; }
.mt-plan-ins { margin-bottom: 4px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .02em; color: #3D9BFF; background: #1D1D1F; white-space: nowrap; }
.mt-plan-t { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-2); }
.mt-plan-m, html[data-zona="sitio"] main .mt-plan-m { margin-top: 2px; font-size: clamp(22px, 6.4vw, 28px); font-weight: 800; letter-spacing: -.03em; line-height: 1.05; color: var(--texto); }
.mt-plan-s { font-size: 12.5px; font-weight: 700; color: var(--texto); }
.mt-plan-d { font-size: 12.5px; line-height: 1.35; color: var(--texto-2); }
.mt-plan-nota { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--texto-2); }
.mt-plan-nota svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--ok); }
.mt-hoy .s { font-size: 13px; }
.mt-sugerencia { margin-top: 6px; font-size: 13.5px; font-weight: 500; color: var(--texto); }
.mt-sugerencia[hidden] { display: none; }
.mt-sugerencia .enlace { font-size: inherit; text-decoration: underline; text-underline-offset: 3px; }
.mt-cupon-plegable { margin-top: 10px; }
.mt-cupon-plegable > summary { list-style: none; display: inline-flex; align-items: center; min-height: 36px; font-size: 13.5px; font-weight: 600; color: var(--acento); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.mt-cupon-plegable > summary::-webkit-details-marker { display: none; }
.mt-cupon-plegable[open] > summary { color: var(--texto-2); text-decoration: none; }
.mt-pagar-nota { margin-top: 8px; text-align: center; font-size: 12.5px; font-weight: 600; color: var(--texto-2); }
/* 26-oct: el total se lee de un vistazo (como Stripe y Shopify); pagando en pesos, los US$ y la tasa debajo de «Total» */
html[data-zona="sitio"] main .mt-total-grande, .mt-total-grande { font-size: 24px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mt-total-fila { align-items: center; }
.mt-total-fila [data-total-usd] { margin-top: 2px; font-size: 12.5px; font-weight: 500; color: var(--texto-2); }
.mt-total-fila [data-total-usd][hidden] { display: none; }
/* Debajo del botón, en una sola línea si cabe: cuándo llega · 7 días de garantía */
.mt-pagar-pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; column-gap: 12px; row-gap: 2px; margin-top: 8px; }
.mt-pagar-pie .mt-pagar-nota { margin-top: 0; }
/* 2-nov (pauta: tarjetas de RD que no pasan): «¿Tu tarjeta no pasa? Paga por transferencia · Escríbenos», debajo de Pagar, siempre a la vista */
.mt-pagar-ayuda { margin: 6px 0 0; text-align: center; font-size: 12.5px; color: var(--texto-2); }
.mt-pagar-ayuda[hidden], .mt-pagar-ayuda [hidden] { display: none; }
.mt-ayuda-enlace { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--acento); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.mt-garantia-linea { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--texto-2); }
.mt-garantia-linea svg { width: 14px; height: 14px; flex-shrink: 0; color: var(--ok); }
.metodos-pago > .mt-pago-t { margin-bottom: 2px; }
@media (max-width: 899px) { .mt-pagar-pie { margin-top: 6px; } .mt-pagar-pie .mt-pagar-nota { margin-top: 0; } .mt-garantia-linea { font-size: 12px; } }
@media (max-width: 899px) { .mt-pagar-nota { margin-top: 6px; font-size: 12px; } .mt-pago { padding-bottom: calc(154px + env(safe-area-inset-bottom)); } /* 2-nov: +22 px por la línea de ayuda */ }
.caja-error-s { font-size: 13.5px; line-height: 1.45; color: var(--texto-2); }
.pago-ya { background: #EAF8EF; box-shadow: inset 0 0 0 1px rgba(40, 110, 80, .22); }
.pago-ya .caja-error-t svg { color: var(--ok); }
.metodos .pct-oferta, .mv-oferta .pct-oferta { height: 20px; font-size: 11.5px; vertical-align: 2px; }
.opcion-cuotas { position: relative; }
.o-ins { margin-bottom: 4px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; color: #3D9BFF; background: #1D1D1F; white-space: nowrap; }

.velo.velo-centro { align-items: center; padding: 20px; }
/* 24-oct: pop-up de CapCut PC (el de dreomar.com): abajo en el celular, centrado desde 640 px, con el fondo oscurecido del .velo */
.velo.velo-pop { align-items: flex-end; padding: 16px; }
@media (min-width: 640px) { .velo.velo-pop { align-items: center; padding: 20px; } }
.hoja.pop-pc { position: relative; width: 100%; max-width: 420px; max-height: calc(100dvh - 32px); overflow-y: auto; padding: 0; border-radius: 28px; animation: pv-entra .34s var(--curva) both; }
.hoja.pop-pc .asa { display: none; }
@keyframes pv-entra { from { opacity: 0; transform: translateY(16px) scale(.96); } to { opacity: 1; transform: none; } }
.pp-foto { position: relative; }
.pp-foto img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.pp-x { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; color: #FFFFFF; }
.pp-x svg { width: 16px; height: 16px; }
.pp-sello { position: absolute; left: 10px; bottom: 10px; display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 700; }
.pp-cuerpo { display: flex; flex-direction: column; align-items: stretch; padding: 18px 20px 12px; text-align: left; }
.pp-curso { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 650; color: var(--texto-2); }
.pp-t { margin: 10px 0 0; font-size: 24px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; text-wrap: balance; }
.pp-texto { margin: 6px 0 0; font-size: 15px; line-height: 1.4; color: var(--texto-2); }
.pp-lista { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 7px; }
.pp-lista li { display: flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 550; }
.pp-lista .icono { width: 24px; height: 24px; border-radius: 7px; flex-shrink: 0; }
.pp-lista .icono svg { width: 13px; height: 13px; }
.pp-precio { margin-top: 16px; }
.pp-precio .monto { font-size: 26px; }
.pp-cta { margin-top: 14px; }
.pp-ahora-no { margin-top: 4px; padding: 10px 16px; border: 0; background: none; font: inherit; font-size: 14px; font-weight: 600; color: var(--texto-2); cursor: pointer; -webkit-tap-highlight-color: transparent; }
@media (prefers-reduced-motion: reduce) { .hoja.pop-pc { animation: fundido .2s ease both; } }
/* 26-oct (Omar: «en el celular tapa demasiado, tiene que ser más pequeño para que se pueda cerrar de una vez, pero verlo, y no tan
   invasivo; chequéalo también en web»): menos velo (sin desenfoque: se sigue viendo la página detrás) y una tarjeta más baja.
   Celular: foto corta, solo título, precio, botón y «Ahora no» (≈40 % de la pantalla, antes ≈90 %). Computadora: más estrecha. */
.velo.velo-pop, html[data-theme="dark"] .velo.velo-pop { background: rgba(0, 0, 0, .38); -webkit-backdrop-filter: none; backdrop-filter: none; }
.hoja.pop-pc { max-width: 380px; box-shadow: 0 24px 60px -18px rgba(0, 0, 0, .55); }
.pp-foto img { aspect-ratio: 16 / 8; object-position: center 35%; }
.pp-t { font-size: 22px; }
/* Computadora: tarjeta en la esquina de abajo a la derecha, sin velo ni bloqueo: la página se sigue viendo, se puede desplazar y usar */
@media (min-width: 640px) {
  .velo.velo-pop, html[data-theme="dark"] .velo.velo-pop { background: transparent; pointer-events: none; align-items: flex-end; justify-content: flex-end; padding: 24px; animation: none; }
  .velo.velo-pop .hoja { pointer-events: auto; }
  body:has(.velo.velo-pop) { overflow: auto !important; }
  .hoja.pop-pc { max-width: 340px; border: 1px solid var(--borde, rgba(255, 255, 255, .1)); }
  .pp-lista { display: none; }
  .pp-cuerpo { padding: 14px 18px 8px; }
  .pp-t { margin-top: 8px; font-size: 20px; }
  .pp-texto { font-size: 14px; }
  .pp-precio { margin-top: 10px; }
  .pp-precio .monto { font-size: 22px; }
  .pp-cta { margin-top: 12px; }
}
@media (max-width: 639px) {
  .velo.velo-pop { padding: 12px; }
  .hoja.pop-pc { max-width: 360px; margin: 0 auto; border-radius: 22px; }
  .pp-foto img { aspect-ratio: 16 / 6; }
  .pp-sello, .pp-curso, .pp-texto, .pp-lista { display: none; }
  .pp-x { top: 8px; right: 8px; width: 34px; height: 34px; }
  .pp-cuerpo { padding: 12px 16px 4px; }
  .pp-t { margin: 0; font-size: 19px; }
  .pp-precio { margin-top: 6px; }
  .pp-precio .monto { font-size: 21px; }
  .pp-cta { margin-top: 10px; min-height: 46px; }
  .pp-ahora-no { margin-top: 0; padding: 9px 16px; font-size: 13.5px; }
}
/* 4-nov (Omar): pop-up Black Friday del pack de los 3 cursos. Negro en los dos temas, BLACK en Archivo condensada, Friday en
   Instrument Serif azul, las 3 portadas en abanico y el precio grande. Mismo tamaño y sitio que el de CapCut PC. */
.hoja.pop-bf, html[data-theme] .velo .hoja.pop-bf { --bf-azul: #3D9BFF; color: #FFFFFF; background: radial-gradient(120% 70% at 50% 0%, #0B2A5C 0%, #050814 55%, #000000 100%); border: 1px solid rgba(61, 155, 255, .28); box-shadow: 0 0 0 1px rgba(0, 0, 0, .4), 0 28px 70px -20px rgba(11, 99, 217, .55); }
.bf-cab { position: relative; padding: 18px 18px 0; text-align: center; }
.bf-cab::after { content: ""; position: absolute; left: 10%; right: 10%; bottom: -10px; height: 90px; background: radial-gradient(closest-side, rgba(61, 155, 255, .32), transparent); pointer-events: none; }
.bf-sello { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 12px; border-radius: 999px; font-size: 11.5px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; color: #FFFFFF; background: rgba(61, 155, 255, .16); border: 1px solid rgba(61, 155, 255, .4); }
.bf-sello::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--bf-azul); box-shadow: 0 0 10px var(--bf-azul); animation: bf-late 1.6s ease-in-out infinite; }
@keyframes bf-late { 50% { opacity: .35; } }
.bf-marca { display: flex; align-items: baseline; justify-content: center; gap: 8px; margin-top: 10px; line-height: .82; }
.bf-marca b { font-family: var(--letra-cond); font-stretch: 62%; font-weight: 900; font-size: 74px; letter-spacing: -0.01em; color: #FFFFFF; }
.bf-marca i { font-family: var(--letra-firma); font-style: italic; font-weight: 400; font-size: 52px; letter-spacing: -0.02em; color: var(--bf-azul); }
.bf-fotos { position: relative; z-index: 1; display: block; height: 96px; margin: 14px auto 0; max-width: 300px; }
.bf-fotos img { position: absolute; top: 50%; width: 48%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; border-radius: 10px; border: 1.5px solid rgba(255, 255, 255, .9); box-shadow: 0 14px 28px -12px rgba(0, 0, 0, .8); }
.bf-fotos img:nth-child(1) { left: 0; transform: translateY(-44%) rotate(-8deg); }
.bf-fotos img:nth-child(2) { left: 26%; z-index: 2; transform: translateY(-56%); }
.bf-fotos img:nth-child(3) { right: 0; transform: translateY(-44%) rotate(8deg); }
.bf-cuerpo { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: stretch; padding: 14px 20px 10px; text-align: center; }
.bf-t { margin: 0; font-size: 21px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; color: #FFFFFF; text-wrap: balance; }
.bf-linea { margin: 4px 0 0; font-size: 13px; font-weight: 550; color: rgba(255, 255, 255, .62); }
.bf-precio { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 10px; }
.bf-monto { font-size: 56px; font-weight: 900; letter-spacing: -0.045em; line-height: 1; color: #FFFFFF; }
.bf-monto small { font-size: .42em; font-weight: 800; letter-spacing: -0.01em; vertical-align: .9em; margin-right: 2px; color: rgba(255, 255, 255, .7); }
.bf-antes { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left; }
.bf-antes s { font-size: 17px; font-weight: 650; color: rgba(255, 255, 255, .5); }
.bf-antes span { display: inline-flex; height: 22px; align-items: center; padding: 0 8px; border-radius: 6px; font-size: 12px; font-weight: 750; color: #FFFFFF; background: #0B63D9; }
.bf-cta { margin-top: 14px; color: #FFFFFF; background: linear-gradient(135deg, #3D9BFF 0%, #0F6AF5 48%, #0B57D0 100%); box-shadow: 0 10px 30px -10px rgba(61, 155, 255, .8), inset 0 1px 0 rgba(255, 255, 255, .25); }
.bf-mas { display: inline-flex; align-self: center; align-items: center; gap: 4px; margin-top: 10px; font-size: 13.5px; font-weight: 650; color: rgba(255, 255, 255, .78); text-decoration: none; }
.bf-mas svg { width: 12px; height: 12px; }
.hoja.pop-bf .bf-no { color: rgba(255, 255, 255, .55); }
@media (prefers-reduced-motion: reduce) { .bf-sello::before { animation: none; } }
@media (min-width: 640px) { .hoja.pop-bf { max-width: 350px; border-color: rgba(61, 155, 255, .28); } }
@media (max-width: 639px) {
  .bf-cab { padding-top: 14px; }
  .bf-marca b { font-size: 58px; }
  .bf-marca i { font-size: 42px; }
  .bf-fotos { height: 74px; max-width: 240px; margin-top: 10px; }
  .bf-linea, .bf-mas { display: none; }
  .bf-cuerpo { padding: 10px 16px 4px; }
  .bf-t { font-size: 18px; }
  .bf-precio { margin-top: 6px; }
  .bf-monto { font-size: 38px; }
  .bf-cta { margin-top: 10px; min-height: 46px; }
}
/* 24-oct: banner de cookies (el de dreomar.com): abajo, encima de todo; Rechazar y Aceptar del mismo tamaño */
/* Va encima de la barra fija del celular o de la de pago (--barra-abajo): ninguna tapa a la otra. ANDREA sube encima de él (andrea.css). */
.dw-cookies { position: fixed; left: 0; right: 0; bottom: var(--barra-abajo, 0px); z-index: 85; padding: 12px; padding-bottom: max(12px, env(safe-area-inset-bottom)); pointer-events: none; transition: bottom .3s var(--curva); }
.dw-cookies-caja { pointer-events: auto; max-width: 768px; margin-inline: auto; padding: 14px 16px; border-radius: 18px; background: var(--widget); color: var(--texto); box-shadow: 0 0 0 1px var(--linea), 0 24px 60px -18px rgba(0, 0, 0, .45); animation: pv-entra .3s var(--curva) both; }
.dw-cookies-fila { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.dw-cookies-fila p { flex: 1 1 260px; margin: 0; font-size: 14px; line-height: 1.5; color: var(--texto-2); }
.dw-cookies-par { white-space: nowrap; } /* «Personalizar · Privacidad» no se separan (a 1440 «· Privacidad» quedaba sola) */
.dw-cookies-enlace { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--texto); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.dw-cookies-enlace.suave { font-weight: 500; color: var(--texto-2); }
.dw-cookies-botones { display: flex; gap: 8px; flex: 1 1 100%; }
.dw-cookies-botones > * { flex: 1 1 0; min-height: 42px; justify-content: center; }
.dw-cookies-x { display: none; flex-shrink: 0; width: 32px; height: 32px; place-items: center; padding: 0; border: 0; border-radius: 10px; background: none; color: var(--texto-3); cursor: pointer; }
.dw-cookies-x svg { width: 16px; height: 16px; }
.dw-cookies-x:hover { color: var(--texto); background: var(--widget-2); }
@media (min-width: 640px) { .dw-cookies { padding: 16px; } .dw-cookies-botones { flex: 0 0 auto; } .dw-cookies-botones > * { flex: 0 0 auto; min-width: 104px; } .dw-cookies-x { display: grid; } }
.dw-cookies-cat { display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; box-shadow: inset 0 1px 0 var(--linea); }
.dw-cookies-cat[hidden] { display: none; }
@media (min-width: 640px) { .dw-cookies-cat { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dw-cookies-cat > .btn-sec { grid-column: 1 / -1; justify-self: start; } }
.dw-cookies-op { display: flex; gap: 10px; padding: 4px; cursor: pointer; }
.dw-cookies-op input { flex-shrink: 0; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--acento-boton); }
.dw-cookies-op > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.dw-cookies-op b { font-size: 14px; }
.dw-cookies-op span span { font-size: 12.5px; line-height: 1.45; color: var(--texto-2); }
@media (prefers-reduced-motion: reduce) { .dw-cookies-caja { animation: none; } .dw-cookies { transition: none; } }
/* 26-oct (Omar): en /pagar del celular, franja compacta ARRIBA (abajo tapaba «Nombre» en el navegador de Instagram). Mismo texto y mismos dos botones. */
@media (max-width: 639px) {
  body.cookies-arriba .dw-cookies { top: 0; bottom: auto; padding: 8px; padding-top: max(8px, env(safe-area-inset-top)); }
  body.cookies-arriba .dw-cookies-caja { padding: 10px 12px; border-radius: 14px; }
  body.cookies-arriba .dw-cookies-fila { flex-wrap: nowrap; gap: 10px; }
  body.cookies-arriba .dw-cookies-fila p { flex: 1 1 auto; min-width: 0; font-size: 12.5px; line-height: 1.35; }
  body.cookies-arriba .dw-cookies-par { white-space: normal; }
  body.cookies-arriba .dw-cookies-botones { flex: 0 0 auto; gap: 6px; }
  body.cookies-arriba .dw-cookies-botones > * { flex: 0 0 auto; min-height: 40px; padding-inline: 12px; font-size: 14px; }
}
/* 2-nov (Omar: «hazlo discreto»): el aviso es UNA línea chica abajo a la izquierda (arriba en /pagar del celular), sin botones grandes.
   Se va sola al bajar o al cambiar de página (sitio.js · cerrarAviso). «Ajustes» abre el panel completo de arriba. El × se ve siempre. */
.dw-cookies .dw-cookies-x { display: grid; }
.dw-cookies.linea { right: auto; max-width: 100%; padding: 10px; padding-bottom: max(10px, env(safe-area-inset-bottom)); }
.dw-cookies.linea .dw-cookies-caja { display: flex; align-items: center; gap: 4px; max-width: 360px; margin: 0; padding: 6px 4px 6px 14px; border-radius: 999px; box-shadow: 0 0 0 1px var(--linea), 0 10px 30px -14px rgba(0, 0, 0, .4); }
.dw-cookies.linea p { margin: 0; font-size: 12.5px; line-height: 1.35; color: var(--texto-2); }
.dw-cookies.linea .dw-cookies-x { width: 28px; height: 28px; border-radius: 999px; }
.dw-cookies.linea .dw-cookies-x svg { width: 14px; height: 14px; }
@media (max-width: 639px) {
  body.cookies-arriba .dw-cookies.linea { left: 0; right: 0; padding: 6px; padding-top: max(6px, env(safe-area-inset-top)); }
  body.cookies-arriba .dw-cookies.linea .dw-cookies-caja { margin-inline: auto; padding: 4px 4px 4px 12px; border-radius: 999px; }
}
/* 22-oct: ajustes tras mirar las capturas */
html[data-zona="sitio"] .seccion.mt-pago { padding-top: 12px; }
@media (min-width: 900px) { html[data-zona="sitio"] .seccion.mt-pago { padding-top: 32px; } .mt-ficha-info .ficha-t { font-size: clamp(32px, 3.4vw, 46px); } }
.mini-portada .portada { padding: 0; }
.mini-portada .portada img { border-radius: inherit; object-position: 78% 30%; } /* (I3) */
/* Portada subida desde el panel en la ficha: entera (sin recorte ni etiquetas encima) y, en el celular, sin empujar lo que incluye */
@media (max-width: 899px) { .mt-ficha-foto .portada.subida img { max-height: 38vh; margin-inline: auto; } .mt-ficha-foto .portada.subida { background: var(--widget-2); } }
.hoja input[type="datetime-local"] { min-width: 0; max-width: 100%; }
/* La caja de compra no se sale en celulares angostos: «Agregar» queda en ícono */
.mt-ficha-cta { min-width: 0; }
.mt-ficha-cta .mt-cta-principal { min-width: 0; }
@media (max-width: 430px) { .fx-compra .mt-agregar { width: 56px; padding: 0; flex-shrink: 0; } .fx-compra .mt-agregar span { display: none; } }
/* La caja de «no se completó» no tapa el formulario en el celular: botones chicos en una fila */
@media (max-width: 899px) { .mt-pagar .caja-error-acciones .btn-sec { min-height: 36px; padding: 0 12px; font-size: 13px; } .mt-pagar .caja-error-s { font-size: 12.5px; } .mt-pagar .caja-error { gap: 8px; } }
/* «Ya tienes esta compra»: el botón de pagar se esconde mientras la caja lo dice (al cambiar el correo vuelve) */
.mt-pagar:has(.pago-ya) [data-boton-pagar], .mt-pagar:has(.pago-ya) .mt-pagar-pie { display: none; }

/* Sin ningún método de cobro conectado: qué pasa y cómo seguir (el botón pasa a «Escríbeme para pagar») */
.mp-ninguno { display: flex; align-items: flex-start; gap: 12px; margin-top: 12px; padding: 12px 14px; border-radius: 14px; background: var(--acento-suave); }
.mp-ninguno[hidden] { display: none; } /* 26-oct: el display:flex pisaba hidden y salía con la tarjeta elegida */
.mp-ninguno p { font-size: 14px; line-height: 1.5; color: var(--texto-2); }
.mp-ninguno b { color: var(--texto); }
.mp-lista.mp-todos-apagados { opacity: .7; }
/* Ficha de recurso en el celular (ManyChat aterriza aquí): la portada más baja para que el formulario se vea pronto */
@media (max-width: 899px) { .dw-rec-izq .dw-rec-portada { aspect-ratio: 21 / 9; } .dw-rec-izq .dw-rec-portada.dw-rec-portada-nueva { aspect-ratio: 16 / 9; } .dw-rec-izq .dw-rec-ico { width: 64px; height: 64px; } .dw-rec-izq .dw-rec-ico svg { width: 32px; height: 32px; } .dw-rec-ficha { padding-top: 12px; } }
@media (max-width: 767px) { .dw-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dw-pasos li { padding: 14px; } }
@media (max-width: 899px) { .dw-hero-foto img { max-width: 280px; } }

/* ── fb: quién soy, FAQ, legales, aplicación, gracias/descarga/404 y pago (24-oct, lado a lado con la dreomar.com de hoy) ── */
/* /dreomar · el retrato con su píldora, el cristal con el nombre y los dos flotantes de escritorio */
.dw-retrato { position: relative; width: 100%; max-width: 420px; margin-inline: auto; }
.dw-retrato-marco { position: relative; border-radius: 28px; overflow: hidden; box-shadow: 0 40px 80px -40px rgba(17, 24, 39, .45); }
.dw-retrato .dw-retrato-marco img { display: block; width: 100%; max-width: none; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 0; box-shadow: none; }
.dw-retrato-pildora { position: absolute; top: 14px; left: 14px; display: inline-flex; align-items: center; gap: 4px; height: 32px; padding: 0 12px; border-radius: 999px; background: rgba(255,255,255,.92); color: #111; font-size: 13px; font-weight: 650; box-shadow: 0 6px 18px -10px rgba(0,0,0,.4); }
.dw-retrato-cristal { position: absolute; left: 12px; right: 12px; bottom: 12px; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 18px; background: rgba(24, 24, 27, .48); -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4); color: #fff; text-align: left; }
.dw-retrato-cristal b { display: inline-flex; align-items: center; gap: 5px; font-size: 15px; font-weight: 700; letter-spacing: -0.01em; }
.dw-retrato-cristal small { display: block; font-size: 12.5px; color: rgba(255,255,255,.78); }
.dw-verificado { display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 999px; background: #1D9BF0; color: #fff; flex-shrink: 0; }
.dw-verificado svg { width: 10px; height: 10px; stroke-width: 3.2; }
.dw-flot { display: none; }
@media (min-width: 900px) {
  .dw-flot { position: absolute; display: flex; flex-direction: column; gap: 4px; width: 170px; padding: 14px 16px; text-align: left; z-index: 1; }
  .dw-flot-a { top: 52px; left: -96px; }
  .dw-flot-b { right: -88px; top: 46%; }
  .dw-flot-r { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--texto-2); }
  .dw-flot b { font-size: 30px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; color: var(--texto); }
  .dw-flot small { font-size: 12.5px; color: var(--texto-2); }
  .dw-flot-barras { display: flex; align-items: flex-end; gap: 4px; height: 34px; margin-top: 4px; }
  .dw-flot-barras i { flex: 1; border-radius: 4px; background: linear-gradient(180deg, #FF6FB1, #E83E8C); }
}
/* La historia: «Capítulo n» sobre la época, y la cita con comillas y firma */
.dw-capitulo { display: block; font-size: 12px; font-weight: 650; color: var(--texto-3); }
.dw-cita-caja { margin: 32px 0 0; display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.dw-cita-caja .dw-cita { margin: 0; }
.dw-firma { display: inline-flex; align-items: center; gap: 10px; text-align: left; }
.dw-firma img { width: 44px; height: 44px; border-radius: 999px; object-fit: cover; box-shadow: 0 0 0 2px var(--widget), 0 0 0 3.5px var(--acento-suave); }
.dw-firma b { display: inline-flex; align-items: center; gap: 5px; font-size: 15px; font-weight: 700; }
.dw-firma small { display: block; font-size: 13px; color: var(--texto-2); }
/* La audiencia: «Top 4» al lado del título del widget */
.dw-barras-cabeza { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
/* I6 · «Empieza aquí» y «Gratis» en la esquina: no empujan el título (los títulos de una fila quedan a la misma altura) */
.dw-inc > .insignia { position: absolute; top: 14px; right: 14px; margin: 0; }
@media (min-width: 768px) { .dw-inc > .insignia { top: 20px; right: 20px; } }
/* El 🎁 de la primera fila del cierre, en su caja blanca como en la web de hoy */
.dw-ico-emoji { background: var(--widget); box-shadow: inset 0 0 0 1px var(--linea); font-size: 15px; line-height: 1; }
/* P1 · botones apilados del mismo ancho en el celular (cierre de /dreomar y los estados de gracias, descarga y 404) */
@media (max-width: 479px) {
  .dw-botones-iguales > .btn, .dw-botones-iguales > .btn-sec, .dw-estado .bloque-estado-acciones > .btn, .dw-estado .bloque-estado-acciones > .btn-sec, .dw-estado .bloque-estado-acciones > a { flex: 1 1 100%; justify-content: center; }
}
/* /faq · el buscador con «/», «Prueba con:», el mosaico de temas y cada tema con su cabecera (como la de hoy) */
.dw-buscador { position: relative; }
.dw-kbd { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); display: none; place-items: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 7px; background: var(--widget-2); box-shadow: inset 0 0 0 1px var(--linea); font: 600 12px/1 var(--letra); color: var(--texto-2); }
@media (min-width: 768px) { .dw-kbd { display: grid; } }
.dw-prueba { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 14px; }
.dw-prueba > span { font-size: 14px; color: var(--texto-2); }
.dw-prueba .dw-filtro { cursor: pointer; font: inherit; font-size: 14px; }
.dw-temas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 28px; }
@media (min-width: 900px) { .dw-temas { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; } }
.dw-tema { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px; color: var(--texto); text-decoration: none; }
.dw-tema .icono { margin-bottom: 8px; }
.dw-tema b { font-size: 15.5px; font-weight: 750; letter-spacing: -0.01em; }
.dw-tema span:last-child { font-size: 13.5px; color: var(--texto-2); }
.dw-faq-cabeza { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 12px; margin-bottom: 14px; }
.dw-faq-cabeza .icono { grid-row: span 2; }
.dw-faq-t { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -0.025em; line-height: 1.15; }
.dw-faq-bajada { display: none; margin: 0; font-size: 15px; color: var(--texto-2); }
.dw-faq-cabeza .insignia { justify-self: start; }
@media (min-width: 900px) {
  .dw-faq-grupo { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 40px; align-items: start; }
  .dw-faq-grupo + .dw-faq-grupo { margin-top: 48px; }
  .dw-faq-cabeza { position: sticky; top: 96px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin: 0; }
  .dw-faq-t { font-size: 30px; }
  .dw-faq-bajada { display: block; }
}
/* Lo que va debajo de una respuesta: la lista de cursos (con su precio) y las 3 herramientas del curso de IA */
.dw-faq-lista { list-style: none; margin: -6px 0 16px; padding: 0; display: grid; gap: 8px; }
.dw-faq-lista li { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--texto-2); }
.dw-faq-lista li b { color: var(--texto); font-weight: 650; }
.dw-faq-precio { margin-left: auto; color: var(--ok) !important; }
.dw-faq-apps { list-style: none; margin: -6px 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dw-faq-apps li { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px 0 6px; border-radius: 999px; background: var(--widget-2); font-size: 14px; }
.dw-faq-apps img { width: 22px; height: 22px; border-radius: 6px; }
.dw-faq-apps span { color: var(--texto-2); }
/* Debajo del bloque de pago: el «Pago seguro» con los logos y la fila de la factura, en un widget */
.dw-faq-pago { display: grid; gap: 16px; margin-top: 12px; }
@media (min-width: 900px) { .dw-faq-pago { grid-template-columns: minmax(0, 1fr) minmax(0, 340px); align-items: center; } }
.dw-pago-seguro.izq { justify-content: flex-start; text-align: left; margin-top: 0; }
.dw-pago-seguro.izq .dw-pago-r { flex-basis: 100%; }
.dw-pago-seguro.izq .dw-pago-marcas { justify-content: flex-start; }
.dw-faq-factura { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 16px; background: var(--widget-2); }
.dw-faq-factura b { display: block; font-size: 15.5px; font-weight: 700; }
.dw-faq-factura span span { display: block; font-size: 14.5px; color: var(--texto-2); }
@media (max-width: 899px) { .dw-temas > .dw-tema:last-child:nth-child(odd) { grid-column: 1 / -1; } }
/* Legales: al final, «← Volver al inicio», el enlace a la otra página y la línea de la empresa con su RNC (como la web de hoy) */
.dw-legal-fin { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--linea); display: grid; gap: 10px; }
.dw-legal-nav { display: flex; flex-wrap: wrap; gap: 8px; font-size: 15px; }
.dw-legal-nav span { color: var(--texto-3); }
.dw-legal-rnc { margin: 0; font-size: 13.5px; color: var(--texto-2); }
/* /aplicaciontrabajo: el «*» de lo obligatorio, la letra pequeña del consentimiento y el campo trampa fuera de la vista */
.dw-req { color: var(--urgente); font-weight: 700; }
.dw-letra-chica { margin: 10px 0 0; font-size: 13px; line-height: 1.45; color: var(--texto-2); text-align: center; }
.dw-trampa { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* ── fb-tienda: la tienda y las fichas de packs como la dreomar.com de hoy, con la piel nueva (24-oct) ── */
/* Tienda: los 7 packs sin hueco (C5): el Pack de Subtítulos, el real, va destacado: fila entera en celular y tablet, 2 columnas en
   escritorio con el mismo alto que las de al lado; su video de títulos entero sobre negro. Con un filtro no cambia nada. */
.dw-packs > .dw-pack:first-child:nth-last-child(7) { grid-column: 1 / -1; }
.dw-packs > .dw-pack:first-child:nth-last-child(7) .dw-pack-media { aspect-ratio: 2 / 1; background: #000; }
.dw-packs > .dw-pack:first-child:nth-last-child(7) .dw-pack-media .dw-clip { object-fit: contain; }
@media (min-width: 1100px) {
  .dw-packs > .dw-pack:first-child:nth-last-child(7) { grid-column: span 2; }
  .dw-packs > .dw-pack:first-child:nth-last-child(7) .dw-pack-media { aspect-ratio: 3 / 1; }
}
/* En el celular, como la de hoy: la línea de lo que trae no sale y las apps son 3 + «+2» */
@media (max-width: 639px) { .dw-pack-s { display: none; } }
.dw-pack-apps .dw-papp.dw-papp-mas { display: none; color: #fff; background: rgba(255,255,255,.16); font-size: 11px; }
@media (max-width: 639px) { .dw-pack-apps .dw-papp.dw-papp-mas { display: inline-grid; } }

/* Ficha de un pack: cabecera de app, tarjeta de compra (pegada a la derecha en escritorio) y lo que resuelve dudas */
.dw-pficha { display: grid; gap: 16px; }
@media (min-width: 768px) { .dw-pficha { gap: 20px; } }
@media (min-width: 1024px) {
  .dw-pficha { grid-template-columns: minmax(0, 1fr) 360px; column-gap: 32px; align-items: start; }
  .dw-pf-cab { grid-column: 1; grid-row: 1; }
  .dw-pf-compra { grid-column: 2; grid-row: 1 / span 2; position: sticky; top: calc(var(--alto-cinta) + 76px); }
  .dw-pf-cuerpo { grid-column: 1; grid-row: 2; }
}
.dw-pf-cab { min-width: 0; }
.dw-pf-app { display: flex; align-items: flex-start; gap: 16px; margin-top: 8px; }
@media (min-width: 768px) { .dw-pf-app { gap: 24px; } }
.dw-pf-logo { flex-shrink: 0; display: grid; width: 104px; height: 104px; border-radius: 23%; overflow: hidden; box-shadow: 0 0 0 1px var(--linea), 0 16px 30px -18px var(--sombra); }
.dw-pf-logo img { display: block; width: 100%; height: 100%; object-fit: cover; background: #000; }
.dw-pf-logo .icono { width: 100%; height: 100%; border-radius: 0; }
.dw-pf-logo .icono > svg { width: 46%; height: 46%; }
@media (min-width: 768px) { .dw-pf-logo { width: 128px; height: 128px; } }
.dw-pf-nombre { flex: 1; min-width: 0; padding-top: 2px; }
@media (min-width: 768px) { .dw-pf-nombre { padding-top: 8px; } }
.dw-pf-t { font-size: 26px; font-weight: 750; line-height: 1.08; letter-spacing: -0.03em; text-wrap: balance; overflow-wrap: anywhere; }
@media (min-width: 768px) { .dw-pf-t { font-size: 40px; } }
.dw-pf-d { margin-top: 6px; font-size: 15px; line-height: 1.38; color: var(--texto-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (min-width: 768px) { .dw-pf-d { font-size: 18px; } }
.dw-pf-pildoras { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.dw-pf-fam { padding-left: 5px; }
.dw-pf-fam .icono.xs { width: 22px; height: 22px; border-radius: 999px; }
.dw-pf-fam .icono.xs svg { width: 12px; height: 12px; color: #fff; }
.dw-pf-compartir { display: none; margin-left: auto; }
@media (min-width: 768px) { .dw-pf-compartir { display: grid; } }

.dw-pf-caja { padding: 14px; }
@media (min-width: 768px) { .dw-pf-caja { padding: 22px; } }
.dw-pf-pronto { display: flex; flex-direction: column; align-items: center; gap: 4px; padding-top: 4px; text-align: center; }
.dw-pf-reloj { margin-bottom: 8px; font-family: var(--letra-emoji); font-size: 26px; }
.dw-pf-pronto b { font-size: 22px; font-weight: 750; letter-spacing: -0.02em; }
.dw-pf-pronto span:last-child { font-size: 15px; color: var(--texto-2); }
.dw-pf-precio { display: flex; flex-direction: column; gap: 4px; }
.dw-pf-botones { display: grid; gap: 10px; margin-top: 16px; }
.dw-pf-gar { margin-top: 14px; }
.dw-pf-gar .fila { padding-block: 11px; }
.dw-pago-seguro.dw-pf-pagos { justify-content: flex-start; gap: 10px 8px; margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--linea); text-align: left; }
.dw-pf-pagos .dw-pago-r { flex-basis: 100%; }
.dw-pf-pagos .dw-pago-marcas { justify-content: flex-start; }
.dw-pf-pagos .dw-pago-nota { font-size: 12.5px; }

.dw-pf-cuerpo { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
@media (min-width: 768px) { .dw-pf-cuerpo { gap: 20px; } }
.dw-pf-datos { display: flex; padding: 16px 0; }
.dw-pf-dato { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 0 10px; text-align: center; }
.dw-pf-dato + .dw-pf-dato { box-shadow: -1px 0 0 var(--linea); }
.dw-pf-dato-e { font-size: 12px; font-weight: 600; color: var(--texto-2); }
.dw-pf-dato b { font-size: 22px; font-weight: 750; line-height: 1.15; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.dw-pf-dato-d { font-size: 12.5px; line-height: 1.3; color: var(--texto-2); }
.dw-pf-rayo { font-family: var(--letra-emoji); font-size: 20px; }
.dw-pf-h2 { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.dw-pf-h2 h2, .dw-pf-bloque-t { font-size: 22px; font-weight: 750; line-height: 1.2; letter-spacing: -0.025em; }
@media (min-width: 768px) { .dw-pf-h2 h2 { font-size: 26px; } }
.dw-pf-emoji { font-family: var(--letra-emoji); font-size: 16px; }
.dw-pf-vistas { display: flex; gap: 12px; margin-inline: calc(-1 * var(--margen)); padding: 0 var(--margen) 8px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--margen); scrollbar-width: none; }
.dw-pf-vistas::-webkit-scrollbar { display: none; }
.dw-pf-vista { flex: 0 0 80%; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 22px; background: #000; scroll-snap-align: start; box-shadow: 0 0 0 1px var(--linea), 0 18px 36px -24px var(--sombra); }
.dw-pf-vista > img, .dw-pf-vista > video { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 640px) { .dw-pf-vista { flex-basis: 46%; } }
@media (min-width: 768px) { .dw-pf-vista { border-radius: 28px; } }
@media (min-width: 1024px) { .dw-pf-vistas { margin-inline: 0; padding-inline: 0; scroll-padding-inline: 0; } .dw-pf-vista { flex-basis: 44%; } }
.dw-pf-vertical { width: 100%; max-width: 380px; margin-inline: auto; padding: 10px; }
@media (min-width: 768px) { .dw-pf-vertical { padding: 12px; } }
.dw-pf-vertical-marco { position: relative; aspect-ratio: 9 / 16; overflow: hidden; border-radius: 14px; background: #000; }
@media (min-width: 768px) { .dw-pf-vertical-marco { border-radius: 16px; } }
.dw-pf-vertical-marco video { display: block; width: 100%; height: 100%; object-fit: contain; }
.dw-pf-bloque { padding: 20px; }
@media (min-width: 768px) { .dw-pf-bloque { padding: 24px; } .dw-pf-bloque .lista, .dw-pf-gar { --sangria: 50px; } }
.dw-pf-bloque .lista { margin-top: 6px; }
.dw-pf-acordeon { margin-top: 12px; padding: 0 2px; border-radius: 14px; background: var(--widget-2); }
.dw-pf-acordeon .dw-faq details { background: transparent; box-shadow: none; border-radius: 0; }
.dw-pf-acordeon .dw-faq details + details { margin-top: 0; box-shadow: 0 -1px 0 var(--linea); }
.dw-pf-apps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 8px; margin: 16px 0 0; padding: 0; list-style: none; }
@media (min-width: 640px) { .dw-pf-apps { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.dw-pf-apps li { display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; line-height: 1.2; text-align: center; }
.dw-pf-apps .dw-papp { width: 40px; height: 40px; border-radius: 23%; font-size: 15px; box-shadow: 0 12px 24px -12px rgba(0,0,0,.5); }
@media (min-width: 768px) { .dw-pf-apps .dw-papp { width: 56px; height: 56px; font-size: 20px; } }
.dw-pficha-pagina > .dw-sec:first-child { padding-top: 12px; }
@media (min-width: 768px) { .dw-pficha-pagina > .dw-sec:first-child { padding-top: 24px; } }
.dw-pf-logo img[src$="pack-estilos.webp"] { object-position: 50% 48%; }
/* Las 3 garantías de la tienda: en escritorio, tres tarjetas; en el celular, una lista como la de hoy */
.dw-tgar-item > span.dw-tgar-txt { display: flex; flex-direction: column; align-items: inherit; gap: 6px; font-size: inherit; color: var(--texto); }
@media (max-width: 639px) {
  .dw-tgar { gap: 0; padding: 4px 16px; border-radius: var(--radio-widget); background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 1px 2px color-mix(in srgb, var(--sombra) 40%, transparent), 0 24px 48px -30px var(--sombra); }
  .dw-tgar-item { flex-direction: row; align-items: center; gap: 14px; padding: 13px 0; border-radius: 0; background: none; box-shadow: none; text-align: left; }
  .dw-tgar-item + .dw-tgar-item { box-shadow: inset 0 1px 0 var(--linea); }
  .dw-tgar-item > span.dw-tgar-txt { align-items: flex-start; gap: 2px; }
  .dw-tgar-item b { font-size: 15px; }
  .dw-tgar-item > .icono { width: 32px; height: 32px; }
}
/* Las preguntas de la ficha, en su tarjeta (en oscuro el fondo «blanco» es negro y se perdían) */
.dw-pficha .dw-pf-sec .dw-faq details { background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 10px 24px -22px var(--sombra); }
/* ── fb-servicio: /mejora y /edito-tu-video como la dreomar.com de hoy (24-oct noche) — planes a la misma altura (C2), «Ahorras»,
   prueba con estrellas, nota del precio, preguntas en dos columnas, ilustraciones de los pasos y el formulario de cotización en 3 pasos ── */
/* C2 · el precio a la misma altura en las tres tarjetas de edición y en las dos mentorías */
@media (min-width: 900px) {
  .dw-planes .dw-plan-cabeza { min-height: 60px; }
  .dw-planes .dw-plan > p.texto-2 { min-height: 3em; }
}
.dw-planes-2 .dw-plan > .dw-checks { flex-grow: 1; }
.dw-plan-inc { margin-bottom: -4px; font-size: 14px; font-weight: 750; letter-spacing: -0.01em; }
.dw-plan .dw-checks .enlace { display: inline; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
/* P1 · el título del héroe de /mejora sin una palabra sola («Es tu cuenta / en pantalla.») */
.dw-hero-mejora .h1 br + em { display: block; text-wrap: balance; }
/* ★★★★★ 4.9 · 100+ sesiones */
.dw-nota-prueba { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 6px; margin-top: 14px; font-size: 13.5px; font-weight: 600; color: var(--texto-2); }
.dw-nota-prueba b { color: var(--texto); font-weight: 800; }
.dw-dato .dw-estrellas { margin: 2px 0; }
.dw-dato .dw-estrellas svg { width: 13px; height: 13px; }
.dw-pasos-nota { margin-top: 14px; font-size: 13.5px; }
.dw-pasos-nota b { color: var(--texto); font-weight: 700; }
/* «Sin sorpresas en el precio» con sus formas de pago */
.dw-precio-nota { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; max-width: 880px; margin: var(--hueco) auto 0; padding: 16px 18px; text-align: left; }
.dw-precio-nota-t { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.dw-precio-nota-t b { font-size: 16px; font-weight: 750; letter-spacing: -0.01em; }
.dw-precio-nota-t span { font-size: 13.5px; line-height: 1.45; color: var(--texto-2); }
.dw-precio-nota-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dw-precio-nota-chips li { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px 0 6px; border-radius: 999px; font-size: 13px; font-weight: 650; background: var(--widget-2); }
/* Preguntas en dos columnas (la primera abierta) y «¿Otra duda?» */
.dw-faq-2 { display: grid; gap: 8px; }
@media (min-width: 900px) { .dw-faq-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; } .contenedor.estrecho:has(> .dw-faq-2) { max-width: calc(1104px + 2 * var(--margen)); } }
.dw-otra-duda { align-items: center; gap: 10px; }
.dw-otra-duda > span { font-size: 14.5px; font-weight: 600; color: var(--texto-2); }
/* /edito-tu-video · en el celular va primero el plan más elegido (Pro), como hoy */
@media (max-width: 899px) { .dw-planes .dw-plan-destacado { order: -1; } }
.dw-plan .precio-bloque { gap: 6px; }
.dw-plan-ahorro { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 22px; }
.dw-plan-ahorro .antes { font-size: 14px; font-weight: 600; color: var(--texto-2); text-decoration: line-through; }
.dw-plan-ahorro .insignia { height: 22px; font-size: 11.5px; }
/* Muro: el detalle de cada cifra («En mis videos»…) en escritorio, como hoy */
/* Ilustraciones de los pasos de /edito-tu-video (decorativas) */
.dw-pasos li .dw-mini { display: flex; flex-direction: column; gap: 6px; width: 100%; margin-top: 8px; padding: 10px; border-radius: 14px; background: var(--widget-2); font-size: 12px; line-height: 1.3; color: var(--texto); }
.dw-pasos li .dw-mini span, .dw-pasos li .dw-mini b { color: inherit; font-size: inherit; }
.dw-pasos li .dw-mini-ops { display: flex; flex-wrap: wrap; gap: 6px; }
.dw-pasos li .dw-mini-op { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 4px; padding: 6px 7px; border-radius: 10px; font-weight: 650; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-pasos li .dw-mini-op.si { color: var(--acento); background: var(--acento-suave); box-shadow: 0 0 0 1.5px var(--acento); }
.dw-pasos li .dw-mini-op svg { width: 12px; height: 12px; margin-left: auto; flex-shrink: 0; }
.dw-pasos li .dw-mini-boton { display: block; padding: 6px; border-radius: 999px; text-align: center; font-weight: 700; color: #FFFFFF; background: var(--degradado-boton); }
.dw-pasos li .dw-mini-msj { align-self: flex-start; max-width: 92%; padding: 6px 9px; border-radius: 12px 12px 12px 4px; font-weight: 600; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-pasos li .dw-mini-msj.mio { align-self: flex-end; border-radius: 12px 12px 4px 12px; color: #FFFFFF; background: var(--acento); box-shadow: none; }
.dw-pasos li .dw-mini-msj small { display: block; margin-top: 1px; font-size: 11px; opacity: .7; }
.dw-pasos li .dw-mini-arch { position: relative; overflow: hidden; display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 10px; font-weight: 600; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.dw-pasos li .dw-mini-arch > svg { width: 14px; height: 14px; flex-shrink: 0; color: var(--acento); }
.dw-pasos li .dw-mini-arch > svg:last-child { color: var(--ok); }
.dw-pasos li .dw-mini-arch > span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dw-pasos li .dw-mini-arch i { position: absolute; left: 0; bottom: 0; height: 2px; width: var(--pct, 0); background: var(--acento); }
.dw-pasos li .dw-mini-arch small { font-size: 11px; color: var(--texto-2); }
.dw-pasos li .dw-mini-final { flex-wrap: wrap; row-gap: 4px; }
.dw-pasos li .dw-mini-final > span { flex: 1 1 calc(100% - 20px); white-space: normal; }
.dw-pasos li .dw-mini-final b, .dw-pasos li .dw-mini-final small { display: block; }
.dw-pasos li .dw-mini-final .insignia { flex: none; height: 20px; margin-left: 20px; padding: 0 7px; font-size: 11px; color: var(--ok); }
.dw-pasos li .dw-mini-final .insignia svg { width: 11px; height: 11px; color: var(--ok); }
/* En el celular cada paso a todo el ancho, con su ilustración a la derecha */
@media (max-width: 767px) {
  .dw-pasos:has(.dw-mini) { grid-template-columns: minmax(0, 1fr); }
  .dw-pasos:has(.dw-mini) li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 46%); column-gap: 12px; row-gap: 6px; align-items: start; align-content: start; }
  .dw-pasos:has(.dw-mini) li > :not(.dw-mini) { grid-column: 1; }
  .dw-pasos:has(.dw-mini) li .dw-mini { grid-column: 2; grid-row: 1 / span 3; align-self: center; margin-top: 0; }
}

/* El formulario de cotización: hoja de iOS, 3 pasos con su indicador arriba y la botonera pegada abajo */
.hoja.dw-cot-hoja { max-width: 660px; padding-top: 0; padding-bottom: 0; }
.dw-cot-hoja > .asa { margin: 10px auto 0; }
.dw-hoja .dw-form.dw-cot { gap: 0; margin-top: 0; }
.dw-cot-arriba { position: sticky; top: 0; z-index: 3; margin: 0 -18px; padding: 10px 18px 12px; background: color-mix(in srgb, var(--suelo) 88%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 1px 0 var(--linea); }
@media (min-width: 768px) { .dw-cot-arriba { margin: 0 -28px; padding: 22px 28px 14px; } }
.hoja .cabecera.dw-cot-cabeza { justify-content: flex-start; margin-bottom: 12px; }
.dw-cot-cabeza-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.hoja .dw-cot-cabeza-t h3 { font-size: 19px; line-height: 1.2; }
.dw-cot-cabeza-t > span { font-size: 13px; font-weight: 500; color: var(--texto-2); }
.dw-cot-pasos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dw-cot-pasos li { position: relative; display: flex; justify-content: center; }
.dw-cot-pasos li:not(:last-child)::after { content: ""; position: absolute; top: 15px; left: calc(50% + 22px); right: calc(-50% + 22px); height: 3px; border-radius: 3px; background: var(--linea); transition: background .25s var(--curva); }
.dw-cot-pasos li.hecho::after { background: var(--acento); }
.dw-cot-pasos button { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0; border: 0; background: none; font: inherit; color: var(--texto-2); cursor: default; }
.dw-cot-pasos button:disabled { opacity: 1; }
.dw-cot-pasos li.hecho button { color: var(--acento); cursor: pointer; }
.dw-cot-pasos li.aqui button { color: var(--texto); }
.dw-cot-bola { width: 32px; height: 32px; border-radius: 999px; display: grid; place-items: center; font-size: 14px; font-weight: 750; color: var(--texto-2); background: var(--widget); box-shadow: inset 0 0 0 2px var(--linea); transition: background .25s var(--curva), box-shadow .25s var(--curva); }
.dw-cot-bola svg { display: none; width: 16px; height: 16px; stroke-width: 3; }
.hecho .dw-cot-bola { color: #FFFFFF; background: var(--acento); box-shadow: none; }
.hecho .dw-cot-bola .num { display: none; }
.hecho .dw-cot-bola svg { display: block; }
.aqui .dw-cot-bola { color: #FFFFFF; background: var(--degradado-boton); box-shadow: 0 0 0 4px var(--acento-suave); }
.dw-cot-corto { font-size: 13px; font-weight: 650; }
.dw-cot-pasos button:focus-visible { outline: 2px solid var(--acento); outline-offset: 3px; border-radius: 10px; }
.dw-cot-cuerpo { padding: 20px 0 10px; }
.dw-cot-tit h3 { font-size: 26px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; outline: none; scroll-margin-top: 140px; }
.dw-cot-tit p { margin-top: 4px; font-size: 15px; line-height: 1.4; color: var(--texto-2); }
.dw-cot-paso { display: flex; flex-direction: column; gap: 26px; margin-top: 22px; }
.dw-cot-grupo { min-width: 0; margin: 0; padding: 0; border: 0; display: flex; flex-direction: column; gap: 8px; border-radius: 18px; transition: box-shadow .2s; }
fieldset.dw-cot-grupo { display: block; }
fieldset.dw-cot-grupo > legend { float: left; width: 100%; margin-bottom: 8px; }
fieldset.dw-cot-grupo > legend + * { clear: both; }
fieldset.dw-cot-grupo > .dw-cot-ayuda { margin-bottom: 10px; }
.dw-cot-gt { display: flex; align-items: center; gap: 7px; margin: 0; padding: 0 2px; font-size: 16px; font-weight: 750; letter-spacing: -0.015em; line-height: 1.3; color: var(--texto); }
.dw-cot-gt .emoji { font-size: 17px; line-height: 1; }
.dw-cot-ob { margin-left: 2px; font-weight: 800; color: var(--acento); }
.dw-cot-op-txt { font-weight: 500; color: var(--texto-2); }
.dw-cot-ayuda { margin: -2px 2px 0; font-size: 13.5px; line-height: 1.4; color: var(--texto-2); }
.dw-cot-pegado { margin-top: -12px; }
.dw-cot-lista { border-radius: 16px; overflow: hidden; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 8px 22px -18px var(--sombra); }
.dw-cot-lista > :not([hidden]) ~ * { box-shadow: inset 0 1px 0 var(--linea); }
.dw-cot-fecha { margin-top: -16px; }
.dw-cot-resalta { box-shadow: 0 0 0 3px color-mix(in srgb, var(--acento) 45%, transparent); }
.dw-cot-lista > .dw-cot-resalta { box-shadow: inset 0 0 0 2px var(--acento); }
/* Plan (y presupuesto): una fila con ícono, nombre, precio y el check redondo */
.dw-cot-plan { position: relative; display: flex; align-items: center; gap: 10px; padding: 12px; cursor: pointer; transition: background .15s; }
.dw-cot-plan input, .dw-cot-op input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.dw-cot-plan:has(input:checked) { background: var(--acento-suave); }
.dw-cot-plan:has(input:focus-visible), .dw-cot-op:has(input:focus-visible) { outline: 2px solid var(--acento); outline-offset: -2px; }
.dw-cot-plan-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dw-cot-plan-t > span { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.dw-cot-plan-t b { font-size: 17px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.2; }
.dw-cot-presu .dw-cot-plan-t b { font-size: 16px; font-weight: 650; }
.dw-cot-plan-t small { font-size: 13px; line-height: 1.35; color: var(--texto-2); }
.dw-cot-plan-t .insignia { height: 20px; padding: 0 8px; font-size: 11px; color: #FFFFFF; background: var(--acento); }
.dw-cot-precio { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.dw-cot-precio b { font-size: 15px; font-weight: 800; letter-spacing: -0.02em; color: var(--ok); white-space: nowrap; }
.dw-cot-precio small { font-size: 12px; font-weight: 500; color: var(--texto-2); }
.dw-cot-check { flex-shrink: 0; width: 22px; height: 22px; border-radius: 999px; display: grid; place-items: center; color: transparent; box-shadow: inset 0 0 0 2px var(--linea); transition: background .2s var(--curva), box-shadow .2s var(--curva); }
.dw-cot-check svg { width: 14px; height: 14px; stroke-width: 3; }
input:checked ~ .dw-cot-check { color: #FFFFFF; background: var(--acento); box-shadow: none; }
/* Opciones grandes (tipo de contenido, duración, qué eres, plataformas, para cuándo) */
.dw-cot-ops { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 560px) { .dw-cot-ops.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); } .dw-cot-ops.cuatro { grid-template-columns: repeat(4, minmax(0, 1fr)); } .dw-cot-ops.tres .dw-cot-op.ancha { grid-column: auto; } }
.dw-cot-op { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-height: 64px; padding: 12px 38px 12px 12px; border-radius: 16px; cursor: pointer; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); transition: background .15s, box-shadow .15s; }
.dw-cot-op:has(input:checked) { background: var(--acento-suave); box-shadow: 0 0 0 2px var(--acento); }
.dw-cot-op.ancha { grid-column: 1 / -1; }
.dw-cot-op .emoji { font-size: 22px; line-height: 1; }
.dw-cot-op .icono.sm { width: 32px; height: 32px; }
.dw-cot-op-t b { display: block; font-size: 15px; font-weight: 700; line-height: 1.25; }
.dw-cot-op-t small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.3; color: var(--texto-2); }
.dw-cot-op .dw-cot-check { position: absolute; top: 10px; right: 10px; width: 22px; height: 22px; }
.compactas .dw-cot-op { min-height: 48px; justify-content: center; padding: 10px 34px 10px 12px; }
.compactas .dw-cot-op-t b { font-variant-numeric: tabular-nums; }
.dw-cot-barras { display: flex; align-items: flex-end; gap: 3px; margin-top: 8px; }
.dw-cot-barras i { width: 5px; border-radius: 3px; background: var(--linea); }
.dw-cot-barras i:nth-child(1) { height: 6px; } .dw-cot-barras i:nth-child(2) { height: 9px; } .dw-cot-barras i:nth-child(3) { height: 12px; } .dw-cot-barras i:nth-child(4) { height: 15px; } .dw-cot-barras i:nth-child(5) { height: 18px; }
.dw-cot-barras i.si { background: linear-gradient(to top, #1A7BFF, #62B6FF); }
/* ¿Cuántos videos al mes?: el número grande y el stepper de iOS */
.dw-cot-videos { display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
.dw-cot-videos-n { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.dw-cot-videos-n input { width: 2.6ch; padding: 0; border: 0; background: transparent; font: inherit; font-size: 32px; font-weight: 800; letter-spacing: -0.04em; line-height: 1.05; color: var(--texto); -moz-appearance: textfield; appearance: textfield; }
.dw-cot-videos-n input::-webkit-inner-spin-button, .dw-cot-videos-n input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.dw-cot-videos-n input:focus-visible { outline: 2px solid var(--acento); outline-offset: 2px; border-radius: 6px; }
.dw-cot-videos-n small { font-size: 13px; font-weight: 650; color: var(--texto-2); }
.dw-cot-stepper { flex-shrink: 0; display: flex; align-items: center; padding: 4px; border-radius: 999px; background: var(--widget-2); }
.dw-cot-stepper button { width: 44px; height: 44px; border: 0; border-radius: 999px; display: grid; place-items: center; background: none; color: var(--texto); cursor: pointer; transition: transform .15s, background .15s; }
.dw-cot-stepper button:hover:not(:disabled) { background: var(--widget); }
.dw-cot-stepper button:active:not(:disabled) { transform: scale(.9); }
.dw-cot-stepper button:disabled { opacity: .35; cursor: default; }
.dw-cot-stepper button svg { width: 20px; height: 20px; }
.dw-cot-stepper i { width: 1px; height: 20px; background: var(--linea); }
.dw-cot-nota { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 10px 14px; font-size: 14px; line-height: 1.4; color: var(--texto-2); }
.dw-cot-nota > svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; color: var(--ok); stroke-width: 3; }
.dw-cot-nota .insignia { flex-shrink: 0; height: 22px; }
/* Filas de campo (como Ajustes) */
.dw-cot-fila { display: flex; align-items: center; gap: 12px; padding: 10px 14px; transition: background .15s; }
.dw-cot-fila:focus-within { background: color-mix(in srgb, var(--acento) 5%, transparent); }
.dw-cot-fila-c { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.dw-cot-fila-c label { font-size: 13px; font-weight: 650; color: var(--texto-2); }
.dw-cot-entrada { width: 100%; min-width: 0; padding: 4px 0; border: 0; outline: none; background: transparent; font: inherit; font-size: 17px; color: var(--texto); }
.dw-cot-entrada::placeholder { color: var(--texto-3); }
textarea.dw-cot-entrada { min-height: 84px; resize: vertical; line-height: 1.4; }
input[type="date"].dw-cot-entrada { min-height: 34px; }
.dw-cot-fila .dw-cot-ayuda { margin: 2px 0 2px; font-size: 12.5px; }
.dw-cot-red { flex-shrink: 0; height: 24px; }
.dw-cot-mas { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 8px 14px; border: 0; background: none; font: inherit; font-size: 15.5px; font-weight: 650; color: var(--acento); text-align: left; cursor: pointer; }
.dw-cot-mas:hover { background: color-mix(in srgb, var(--acento) 5%, transparent); }
.dw-cot-mas > span { width: 32px; height: 32px; flex-shrink: 0; border-radius: 9px; display: grid; place-items: center; background: var(--acento-suave); }
.dw-cot-mas > span svg { width: 18px; height: 18px; }
.dw-cot-mas.centro { justify-content: center; min-height: 44px; font-size: 15px; }
.dw-cot-pedido { display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
/* La botonera pegada abajo: el aviso azul, «‹ Atrás · Continuar →» y la nota del envío */
.dw-cot-botonera { position: sticky; bottom: 0; z-index: 3; margin: 6px -18px 0; padding: 12px 18px calc(12px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--suelo) 90%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 -1px 0 var(--linea); }
@media (min-width: 768px) { .dw-cot-botonera { margin: 6px -28px 0; padding: 14px 28px 20px; } }
.dw-cot-botones { display: flex; gap: 10px; }
.dw-cot-botones .btn { flex: 1; }
.dw-cot-botones .btn-sec { flex-shrink: 0; padding-inline: 16px; }
.dw-cot-aviso { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 10px; padding: 10px 12px; border-radius: 16px; font-size: 14.5px; font-weight: 550; line-height: 1.4; color: var(--texto); background: var(--acento-suave); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--acento) 25%, transparent); animation: fundido .2s ease both; }
.dw-cot-aviso .icono { flex-shrink: 0; margin-top: 1px; }
.dw-cot-aviso .icono svg { width: 62%; height: 62%; }
.dw-cot-nota-envio { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 9px; font-size: 12.5px; font-weight: 600; color: var(--texto-2); }
.dw-cot-nota-envio svg { width: 13px; height: 13px; flex-shrink: 0; }
.dw-cot-listo .dw-h2 { outline: none; }
.dw-cot-sigue { width: 100%; text-align: left; }
.dw-cot-sigue > b { display: block; margin: 6px 2px 8px; font-size: 16px; font-weight: 750; }
@media (prefers-reduced-motion: reduce) { .dw-cot-aviso { animation: none; } .dw-cot-stepper button:active:not(:disabled) { transform: none; } }

/* ── Re-auditoría 24-oct §5 (mejora, edito, dreomar, faq) ── */
/* 1 · Las ★ del 4.9 doradas también dentro de una cifra («.dw-dato span» las pintaba de gris) */
.dw-dato .dw-estrellas, .dw-nota-prueba .dw-estrellas { color: #FBBC04; }

/* 8 · /mejora en oscuro: las preguntas sobre «fondo blanco» (#000 en oscuro) recuperan su caja */
html[data-theme="dark"] .fondo-blanco .dw-faq details { background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
@media (prefers-color-scheme: dark) { html:not([data-theme]) .fondo-blanco .dw-faq details { background: #1C1C1E; box-shadow: 0 0 0 1px rgba(255, 255, 255, .10); } }

/* 7 · El ícono de color de cada pregunta (como la web de hoy); la respuesta va alineada con el texto, no con el ícono */
.dw-faq details.con-ico summary { justify-content: flex-start; gap: 12px; }
.dw-faq details.con-ico summary .dw-faq-p { flex: 1; min-width: 0; }
.dw-faq details.con-ico summary .mas { margin-left: auto; }
.dw-faq-ico > svg { width: 50%; height: 50%; }
.dw-faq-ico .emoji { font-size: 17px; line-height: 1; }
.dw-faq details.con-ico > :not(summary) { margin-left: 44px; }
@media (min-width: 768px) { .dw-faq details.con-ico > :not(summary) { margin-left: 48px; } }

/* 11 · /edito a 375: «¿Otra cantidad de videos?» enseña su botón «Cotizar a mi medida», a lo ancho debajo (como la vieja) */
@media (max-width: 479px) {
  #planes .dw-banda { flex-wrap: wrap; }
  #planes .dw-banda > .btn-sec { display: flex; flex: 1 1 100%; justify-content: center; }
}

/* 2 · Teléfono hueco de los cierres: marco de iPhone en CSS, pantalla en degradado azul, ▶ y la píldora */
.dw-tel-hueco { width: 188px; margin: 32px auto 0; }
.dw-tel-marco { position: relative; display: block; aspect-ratio: 9 / 19.5; padding: 7px; border-radius: 40px; background: #1D1D1F; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .14), 0 0 0 1px rgba(0, 0, 0, .22), 0 40px 70px -34px rgba(0, 0, 0, .55); }
.dw-tel-marco::before, .dw-tel-marco::after { content: ""; position: absolute; width: 3px; }
.dw-tel-marco::before { left: -3px; top: 17%; height: 22.3%; border-radius: 2px 0 0 2px; background: linear-gradient(180deg, #3A3A3C 0 16%, transparent 16% 31%, #3A3A3C 31% 62%, transparent 62% 69%, #3A3A3C 69% 100%); }
.dw-tel-marco::after { right: -3px; top: 26%; height: 10%; border-radius: 0 2px 2px 0; background: #3A3A3C; }
.dw-tel-pantalla { position: relative; display: flex; flex-direction: column; height: 100%; border-radius: 33px; overflow: hidden; color: #FFFFFF;
  background: radial-gradient(70% 55% at 25% 32%, rgba(142, 140, 245, .65) 0%, rgba(142, 140, 245, 0) 70%), radial-gradient(70% 60% at 72% 72%, rgba(34, 184, 240, .55) 0%, rgba(34, 184, 240, 0) 70%), linear-gradient(152deg, #5E5CE6 0%, #1473FF 100%); }
.tel-rosa .dw-tel-pantalla { background: radial-gradient(70% 55% at 18% 15%, rgba(98, 182, 255, .65) 0%, rgba(98, 182, 255, 0) 70%), radial-gradient(70% 60% at 81% 84%, rgba(255, 55, 95, .45) 0%, rgba(255, 55, 95, 0) 70%), linear-gradient(160deg, #1473FF 0%, #3F3DBD 100%); }
.dw-tel-pantalla::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, .12) 0%, rgba(255, 255, 255, 0) 35%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .3) 100%); }
.dw-tel-barra { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; height: 34px; padding: 0 18px 0 22px; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.dw-tel-isla { position: absolute; left: 50%; top: 9px; width: 31%; height: 18px; border-radius: 999px; background: #000000; transform: translateX(-50%); }
.dw-tel-senal { display: inline-flex; align-items: flex-end; gap: 1.5px; }
.dw-tel-senal i { width: 3px; border-radius: 1px; background: #FFFFFF; }
.dw-tel-senal i:nth-child(1) { height: 4px; } .dw-tel-senal i:nth-child(2) { height: 6px; } .dw-tel-senal i:nth-child(3) { height: 8px; }
.dw-tel-senal b { width: 16px; height: 8px; margin-left: 4px; padding: 1.5px; border-radius: 3px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .75); background: #FFFFFF content-box; }
.dw-tel-centro { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 12px 12px 34px; text-align: center; }
.dw-tel-play { width: 42px; height: 42px; border-radius: 999px; display: grid; place-items: center; background: rgba(255, 255, 255, .16); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 0 0 1px rgba(255, 255, 255, .18), 0 12px 28px -12px rgba(0, 0, 0, .45); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.dw-tel-play svg { width: 18px; height: 18px; margin-left: 2px; }
.dw-tel-pildora { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 6px 12px; border-radius: 999px; font-size: 12px; font-weight: 650; line-height: 1.2; letter-spacing: -0.005em; text-wrap: balance; background: rgba(18, 18, 22, .42); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 0 1px rgba(255, 255, 255, .14), 0 8px 20px -10px rgba(0, 0, 0, .5); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.dw-tel-abajo { position: absolute; z-index: 1; left: 50%; bottom: 24px; transform: translateX(-50%); white-space: nowrap; }
.dw-tel-abajo svg { width: 13px; height: 13px; flex-shrink: 0; }
.dw-tel-home { position: absolute; z-index: 1; left: 50%; bottom: 8px; width: 36%; height: 4px; border-radius: 999px; background: rgba(255, 255, 255, .85); transform: translateX(-50%); }
@media (min-width: 768px) { .dw-tel-pildora { font-size: 13px; } }
/* El cierre con su teléfono: en el celular, debajo del botón; desde 900 px, al lado (a la izquierda en /mejora y /dreomar, a la
   derecha en /edito-tu-video, como hoy) y el texto alineado a la izquierda, el bloque centrado */
.dw-cierre-tel-rejilla { display: grid; justify-items: center; }
.dw-cierre-tel-texto { width: 100%; max-width: 860px; }
@media (min-width: 900px) {
  .dw-cierre-tel-rejilla { grid-template-columns: 232px minmax(0, 620px); justify-content: center; align-items: center; justify-items: stretch; gap: 72px; }
  .dw-cierre-tel.tel-der .dw-cierre-tel-rejilla { grid-template-columns: minmax(0, 620px) 232px; }
  .dw-cierre-tel.tel-izq .dw-tel-hueco { order: -1; }
  .dw-cierre-tel .dw-tel-hueco { width: 232px; margin: 0; }
  .dw-cierre-tel .dw-tel-marco { padding: 8px; border-radius: 44px; }
  .dw-cierre-tel .dw-tel-pantalla { border-radius: 36px; }
  .dw-cierre-tel-texto { text-align: left; }
  .dw-cierre-tel-texto > .titulo { margin-inline: 0; text-align: left; }
  .dw-cierre-tel-texto .dw-cierre-lista { margin-inline: 0; }
  .dw-cierre-tel-texto .dw-botones, .dw-cierre-tel-texto .dw-nota-prueba { justify-content: flex-start; }
  .dw-cierre-tel-texto .dw-nota { text-align: left; margin-inline: 0; }
}

/* 3 · El muro propio de /edito-tu-video: 2 carriles también en el celular, la píldora abajo a la izquierda, «🔥 Top» arriba */
@media (max-width: 767px) { .dw-muro-propio .dw-mq-movil { display: grid; gap: 14px; } }
.dw-muro-propio .dw-mq-i .dw-reel-vistas { left: 8px; transform: none; gap: 5px; padding: 0 10px; }
.dw-muro-propio .dw-reel-vistas svg { width: 12px; height: 12px; }
.dw-reel-top { position: absolute; z-index: 1; left: 8px; top: 8px; display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 9px; border-radius: 999px; font-size: 11px; font-weight: 750; color: #FFFFFF; }
@media (min-width: 768px) { .dw-muro-propio .dw-mq-i .dw-reel-vistas { left: 10px; } .dw-reel-top { left: 10px; top: 10px; height: 26px; font-size: 12px; } }
/* Las cifras +1B · 85.5M · 312K, debajo de los reels, en un widget de 3 columnas con su ícono (como la vieja) */
.dw-muro-cifras { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; padding: 16px 0; }
.dw-muro-cifras:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dw-muro-cifras > div { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 0 6px; text-align: center; }
.dw-muro-cifras > div + div { box-shadow: -1px 0 0 var(--linea); }
.dw-muro-cifras .icono { width: 40px; height: 40px; }
.dw-muro-cifras b { margin-top: 10px; font-size: 24px; font-weight: 800; letter-spacing: -0.035em; line-height: 1; font-variant-numeric: tabular-nums; }
.dw-muro-cifras > div > span:not(.icono) { margin-top: 4px; font-size: 13px; font-weight: 700; color: var(--texto); }
.dw-muro-cifras small { font-size: 12px; line-height: 1.3; color: var(--texto-2); }
@media (min-width: 768px) {
  .dw-muro-cifras { margin-top: 32px; padding: 24px 0; }
  .dw-muro-cifras .icono { width: 48px; height: 48px; }
  .dw-muro-cifras b { margin-top: 12px; font-size: 44px; }
  .dw-muro-cifras > div > span:not(.icono) { font-size: 16px; }
  .dw-muro-cifras small { font-size: 14px; }
}

/* 4 · /dreomar: la historia como la línea de tiempo de hoy. En el celular, tarjetas con su ícono en la línea de la izquierda;
   desde 900 px, alterna izquierda y derecha y del otro lado va la época en grande con degradado */
.dw-linea { --anillo: var(--suelo); position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
html[data-theme="dark"] .dw-linea { --anillo: #0B0B0D; }
@media (prefers-color-scheme: dark) { html:not([data-theme]) .dw-linea { --anillo: #000000; } }
.dw-linea::before { content: ""; position: absolute; left: 26px; top: 30px; bottom: 30px; width: 3px; margin-left: -1.5px; border-radius: 999px; background: linear-gradient(180deg, #1A7BFF 0%, #5E5CE6 28%, #FF375F 52%, #22B8F0 76%, #1A7BFF 100%); }
.dw-linea-i { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 12px; align-items: start;
  --caja: radial-gradient(70% 55% at 30% 25%, rgba(142, 140, 245, .65) 0%, rgba(142, 140, 245, 0) 70%), radial-gradient(70% 60% at 88% 85%, rgba(34, 184, 240, .6) 0%, rgba(34, 184, 240, 0) 70%), linear-gradient(170deg, #5E5CE6 0%, #1473FF 100%);
  --epoca: linear-gradient(90deg, #62B6FF, #1A7BFF); }
.dw-linea-i[data-tono="indigo"] { --caja: radial-gradient(70% 55% at 20% 25%, rgba(127, 216, 250, .65) 0%, rgba(127, 216, 250, 0) 70%), radial-gradient(70% 60% at 84% 88%, rgba(94, 92, 230, .6) 0%, rgba(94, 92, 230, 0) 70%), linear-gradient(220deg, #0A84FF 0%, #3F3DBD 100%); --epoca: linear-gradient(90deg, #8E8CF5, #5E5CE6); }
.dw-linea-i[data-tono="rosa"] { --caja: radial-gradient(70% 55% at 30% 30%, rgba(98, 182, 255, .65) 0%, rgba(98, 182, 255, 0) 70%), radial-gradient(70% 60% at 76% 70%, rgba(255, 55, 95, .5) 0%, rgba(255, 55, 95, 0) 70%), linear-gradient(176deg, #1473FF 0%, #3F3DBD 100%); --epoca: linear-gradient(90deg, #FF8FA8, #D61F49); }
.dw-linea-i[data-tono="cian"] { --caja: radial-gradient(70% 55% at 26% 22%, rgba(127, 216, 250, .7) 0%, rgba(127, 216, 250, 0) 70%), radial-gradient(70% 60% at 80% 85%, rgba(94, 92, 230, .55) 0%, rgba(94, 92, 230, 0) 70%), linear-gradient(165deg, #0A8FC4 0%, #1473FF 100%); --epoca: linear-gradient(90deg, #7FD8FA, #0A8FC4); }
.dw-linea-i:last-child { --epoca: linear-gradient(90deg, #1A7BFF, #5E5CE6); }
.dw-linea-nodo { grid-column: 1; grid-row: 1; display: flex; justify-content: center; padding-top: 12px; }
.dw-linea-nodo > .icono { width: 44px; height: 44px; outline: 4px solid var(--anillo); }
.dw-linea-nodo > .icono > svg { width: 50%; height: 50%; }
.dw-linea-tarjeta { grid-column: 2; grid-row: 1; min-width: 0; padding: 8px; overflow: hidden; }
.dw-linea-caja { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 10; border-radius: 16px; overflow: hidden; color: #FFFFFF; background: var(--caja); }
.dw-linea-caja::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, .12) 0%, rgba(255, 255, 255, 0) 35%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .3) 100%); }
.dw-linea-caja-ico { position: relative; z-index: 1; width: 44px; height: 44px; border-radius: 28%; display: grid; place-items: center; background: rgba(255, 255, 255, .16); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 0 0 1px rgba(255, 255, 255, .18), 0 12px 28px -12px rgba(0, 0, 0, .45); }
.dw-linea-caja-ico svg { width: 22px; height: 22px; }
.dw-linea-pildora { position: absolute; z-index: 1; left: 8px; top: 8px; display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 650; letter-spacing: -0.005em; color: #FFFFFF; }
.dw-linea-t { padding: 14px 8px 10px; }
.dw-linea-t h3 { margin: 0; font-size: 20px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.2; }
.dw-linea-t p { margin-top: 6px; font-size: 15px; line-height: 1.45; color: var(--texto-2); }
.dw-linea-epoca { display: none; }
@media (min-width: 900px) {
  .dw-linea::before { left: 50%; top: 48px; bottom: 48px; }
  .dw-linea-i { grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr); gap: 0 24px; align-items: center; }
  .dw-linea-nodo { grid-column: 2; padding: 0; }
  .dw-linea-nodo > .icono { width: 56px; height: 56px; }
  .dw-linea-tarjeta { grid-column: 1; display: flex; align-items: center; gap: 16px; }
  .dw-linea-i.der .dw-linea-tarjeta { grid-column: 3; }
  .dw-linea-caja { width: 46%; flex-shrink: 0; aspect-ratio: 4 / 3; border-radius: 20px; }
  .dw-linea-pildora { display: none; }
  .dw-linea-t { flex: 1; min-width: 0; padding: 12px 16px 12px 0; }
  .dw-linea-t h3 { font-size: 22px; }
  .dw-linea-t p { font-size: 16px; }
  .dw-linea-epoca { display: block; grid-column: 3; grid-row: 1; min-width: 0; }
  .dw-linea-i.der .dw-linea-epoca { grid-column: 1; text-align: right; }
  .dw-linea-epoca .dw-capitulo { font-size: 13px; font-weight: 700; color: var(--texto-2); font-variant-numeric: tabular-nums; }
  .dw-epoca-grande { display: block; margin-top: 2px; padding-bottom: .08em; font-size: 32px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.05; background-image: var(--epoca); -webkit-background-clip: text; background-clip: text; color: transparent; }
}
@media (min-width: 1100px) { .dw-epoca-grande { font-size: 44px; } }

/* 5 · /dreomar · audiencia: «101K Por Reel» y «2.3% Engagement» a todo el ancho (2 columnas, bajo las dos tarjetas); en el
   celular, cada país con su % en una fila y la barra debajo (sin «Estados / Unidos» partido) */
@media (min-width: 768px) { .dw-datos.dw-datos-par { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
@media (max-width: 479px) {
  .dw-audiencia .dw-barra-fila { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "n p" "b b"; gap: 8px 10px; }
  .dw-audiencia .dw-barra-fila > span:first-child { grid-area: n; }
  .dw-audiencia .dw-barra-fila > b { grid-area: p; }
  .dw-audiencia .dw-barra-pista { grid-area: b; }
}

/* Muro de virales con «reducir movimiento»: el carril que va al revés (.inv) también se queda quieto (su animation-name pisaba el
   «animation: none» y quedaba corrido casi entero fuera de vista: en /dreomar, /edito-tu-video y la portada) */
@media (prefers-reduced-motion: reduce) { .dw-muro-mq .dw-mq-pista.inv { animation: none; } }
@media (prefers-reduced-motion: reduce) { .dw-muro-mq .dw-mq-fila { margin-inline: auto; } } /* quieto y centrado cuando cabe */

/* ══ 25-oct · Correcciones de Omar: sin huecos muertos, todo cuadrado (celular 375 y escritorio 1440, claro y oscuro) ══ */
/* 1 · Menos aire entre la barra y el chip del héroe, en todas las páginas (portada, vitrinas, tienda, mentorías, servicio, FAQ…) */
.dw-hero { padding-top: 16px; }
.dw-hero-chico { padding-top: 16px; padding-bottom: 16px; }
@media (min-width: 900px) { .dw-hero { padding-top: 28px; } .dw-hero-chico { padding-top: 28px; padding-bottom: 20px; } }
/* 5 · Ritmo vertical: secciones y cabezas más juntas (antes 64 + 64 px entre un botón y el chip de la sección siguiente) */
.dw-sec { padding-block: 28px; }
.dw-sec-chica { padding-block: 16px; }
@media (min-width: 768px) { .dw-sec { padding-block: 44px; } .dw-sec-chica { padding-block: 24px; } .dw-cabeza { margin-bottom: 28px; } }
.dw-sec-dock { padding-bottom: 20px; }
/* 7 · Vitrinas: las opiniones siguen a la tira de datos (mismo fondo) sin otro hueco encima */
.dw-sec-datos + .dw-op-sube { padding-top: 4px; }
@media (min-width: 768px) { .dw-sec-datos { padding-bottom: 24px; } .dw-sec-datos + .dw-op-sube { padding-top: 12px; } }
/* 2 · «Marcas con las que trabajo»: 9 logos; en el celular 5 + 4, centrados */
@media (max-width: 767px) {
  .dw-dock ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 0; }
  .dw-dock li { flex: 0 0 20%; min-width: 0; font-size: 10.5px; }
  .dw-dock li span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
/* 6 · La lámina de la comunidad: su captura (16:10) cubre la caja; si todavía no existe, se ve la caja con el ícono */
.dw-ventana-comunidad { position: relative; }
.dw-ventana .dw-ventana-foto { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: top; }
/* 8 · Tienda: 6 packs = 3 + 3 en escritorio (sin el hueco de 4 + 2) */
@media (min-width: 1100px) { .dw-packs.dw-packs-n6, .dw-packs.dw-packs-n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* 9 · Tienda: «Descarga inmediata · Pago único · Es tuyo» en fila (ícono a la izquierda) y pegado al pago seguro */
@media (min-width: 640px) {
  .dw-tgar-item { flex-direction: row; justify-content: center; gap: 12px; padding: 14px 16px; text-align: left; }
  .dw-tgar-item > span.dw-tgar-txt { align-items: flex-start; gap: 2px; }
  .dw-tgar-item b { font-size: 15px; }
}
.dw-tgar + .dw-pago-seguro { margin-top: 14px; }
/* 10 · Cierres con teléfono (/mejora, /edito-tu-video, /dreomar): teléfono más chico y el bloque centrado en su altura */
@media (min-width: 900px) {
  .dw-cierre-tel-rejilla { grid-template-columns: 200px minmax(0, 620px); gap: 56px; }
  .dw-cierre-tel.tel-der .dw-cierre-tel-rejilla { grid-template-columns: minmax(0, 620px) 200px; }
  .dw-cierre-tel .dw-tel-hueco { width: 200px; }
}
.dw-cierre-tel-texto > :first-child { margin-top: 0; }
.dw-cierre-tel-texto > :last-child { margin-bottom: 0; }
/* …y mide lo mismo que la lámina de al lado (antes, 16:10.4 la hacía más alta que las ventanas con barra + 16:9) */
.dw-lamina > .dw-ventana-comunidad { aspect-ratio: auto; flex: 1 1 auto; min-height: 180px; }

/* ── 26-oct (Omar): el botón de comprar va directo al pago, «Más info» a la vitrina y la oferta de los 3 cursos ─────────── */
.dw-mas-info { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 3px; align-self: center; margin-top: 8px; padding: 2px 4px; font-size: 13px; font-weight: 650; color: var(--texto-2); }
.dw-mas-info svg { width: 14px; height: 14px; }
.dw-mas-info:hover { color: var(--acento); }
/* Tarjeta de curso de la portada: en el celular la fila entera lleva al pago (antes el título se estiraba sobre la fila y abría la vitrina) */
.dw-curso-toque { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.dw-curso.con-toque .dw-curso-t::after { content: none; }
@media (max-width: 899px) { .dw-curso .dw-mas-info { align-self: flex-start; margin: 0 0 0 -4px; font-size: 12.5px; } }
@media (min-width: 900px) { .dw-curso-toque { display: none; } }
.pp-mas-info { margin-top: 6px; }
.dw-oferta-mas { grid-column: 1 / -1; justify-self: center; margin-top: -4px; }

/* Las 3 portadas en abanico */
.dw-p3-fotos { position: relative; display: block; height: 118px; }
.dw-p3-fotos img { position: absolute; top: 50%; width: 46%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; border-radius: 12px; border: 2px solid var(--widget); box-shadow: 0 12px 26px -14px rgba(0, 0, 0, .55); }
.dw-p3-fotos img:nth-child(1) { left: 1%; transform: translateY(-46%) rotate(-7deg); }
.dw-p3-fotos img:nth-child(2) { left: 27%; z-index: 2; transform: translateY(-56%); }
.dw-p3-fotos img:nth-child(3) { right: 1%; transform: translateY(-46%) rotate(7deg); }
.dw-p3-fotos.mini { width: 58px; height: 28px; flex-shrink: 0; }
.dw-p3-fotos.chicas { width: 64px; height: 40px; }
.dw-p3-fotos.mini img, .dw-p3-fotos.chicas img { width: 28px; height: 28px; aspect-ratio: 1; border-radius: 50%; transform: translateY(-50%); }
.dw-p3-fotos.chicas img { width: 36px; height: 36px; border-radius: 11px; }
.dw-p3-fotos.mini img, .dw-p3-fotos.chicas img { object-position: 70% 30%; }
.dw-p3-fotos.mini img:nth-child(1), .dw-p3-fotos.chicas img:nth-child(1) { left: 0; }
.dw-p3-fotos.mini img:nth-child(2) { left: 15px; }
.dw-p3-fotos.mini img:nth-child(3) { left: 30px; right: auto; }
.dw-p3-fotos.chicas img:nth-child(2) { left: 14px; transform: translateY(-50%) rotate(-4deg); }
.dw-p3-fotos.chicas img:nth-child(3) { left: 28px; right: auto; transform: translateY(-50%) rotate(5deg); }
.dw-p3-fotos.grande { height: 0; padding-bottom: 62%; }
.dw-p3-fotos.grande img { width: 56%; border-radius: 16px; }
.dw-p3-fotos.grande img:nth-child(2) { left: 22%; }

/* La tarjeta destacada (portada, tienda y vitrinas) */
.dw-cursos + .dw-p3 { margin-top: 16px; }
.dw-p3 { display: grid; gap: 14px; align-items: center; }
.dw-p3-info { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; text-align: center; }
.dw-p3-sellos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.dw-p3-t { margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; }
.dw-p3-cursos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 14px; font-size: 13.5px; font-weight: 600; color: var(--texto-2); }
.dw-p3-cursos li { display: inline-flex; align-items: center; gap: 6px; }
.dw-p3-cursos .icono.xs svg { width: 13px; height: 13px; }
.dw-p3-precio .precio { justify-content: center; }
.dw-p3-precio .monto { font-size: 30px; }
.dw-p3-compra { display: flex; flex-direction: column; align-items: stretch; }
.dw-p3-compra .btn { justify-content: center; }
.dw-p3-vitrina { margin-top: 16px; }
.dw-p3-compacta .dw-p3-fotos { height: 96px; }
.dw-p3-compacta .dw-p3-t { font-size: 21px; }
@media (min-width: 900px) {
  .dw-p3 { grid-template-columns: 300px minmax(0, 1fr) 270px; gap: 28px; padding: 22px 28px; }
  .dw-p3-fotos { height: 150px; }
  .dw-p3-info { align-items: flex-start; text-align: left; }
  .dw-p3-sellos, .dw-p3-cursos, .dw-p3-precio .precio { justify-content: flex-start; }
  .dw-p3-t { font-size: 30px; }
  .dw-p3-compacta { grid-template-columns: 220px minmax(0, 1fr) 260px; }
  .dw-p3-compacta .dw-p3-fotos { height: 110px; }
  .dw-p3-compacta .dw-p3-t { font-size: 24px; }
}

/* La línea de la vitrina, debajo del botón del héroe: «O los 3 cursos por USD 99 · Ahorras USD 56 ›» */
.dw-p3-linea { display: inline-flex; align-items: center; gap: 10px; max-width: 100%; margin-top: 12px; padding: 6px 12px 6px 8px; border-radius: 999px; font-size: 13.5px; font-weight: 650; line-height: 1.25; text-align: left; color: var(--texto); background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 8px 18px -12px var(--sombra); }
.dw-p3-linea > svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--texto-3); }
.dw-p3-linea:hover > svg { color: var(--acento); }

/* El aviso del carrito y del pago */
.dw-p3-aviso { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.widget.dw-p3-aviso { padding: 12px 14px; }
.dw-p3-aviso-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 12.5px; line-height: 1.35; color: var(--texto-2); }
.dw-p3-aviso-t b { font-size: 14.5px; font-weight: 750; letter-spacing: -0.01em; color: var(--texto); }
.dw-p3-aviso .btn { white-space: nowrap; }
.dw-p3-aviso-hoja { margin: 4px 0 14px; }
@media (max-width: 459px) { .dw-p3-aviso { grid-template-columns: 64px minmax(0, 1fr); } .dw-p3-aviso .btn { grid-column: 1 / -1; justify-content: center; } }
.hoja .dw-p3-aviso { grid-template-columns: 64px minmax(0, 1fr); }
.hoja .dw-p3-aviso .btn { grid-column: 1 / -1; justify-content: center; }
/* 26-oct: en el pago, las 3 portadas 16:9 en abanico (no en círculos) y más aire */
.dw-p3-aviso-pago { grid-template-columns: 112px minmax(0, 1fr) auto; gap: 14px; }
.widget.dw-p3-aviso-pago { padding: 14px 16px; }
.dw-p3-fotos.pago { width: 112px; height: 64px; flex-shrink: 0; }
.dw-p3-fotos.pago img { width: 62%; border-radius: 8px; border-width: 1.5px; box-shadow: 0 8px 16px -10px rgba(0, 0, 0, .5); }
.dw-p3-fotos.pago img:nth-child(1) { left: 0; transform: translateY(-50%) rotate(-6deg); }
.dw-p3-fotos.pago img:nth-child(2) { left: 19%; transform: translateY(-58%); }
.dw-p3-fotos.pago img:nth-child(3) { left: auto; right: 0; transform: translateY(-46%) rotate(6deg); }
.dw-p3-aviso-pago .dw-p3-aviso-t b { font-size: 15.5px; }
@media (max-width: 459px) { .dw-p3-aviso-pago { grid-template-columns: 96px minmax(0, 1fr); gap: 12px; } .dw-p3-fotos.pago { width: 96px; height: 56px; } }
/* La portada chica del pack (carrito, pago, gracias): las 3 portadas en franjas */
.portada.dw-p3-port { display: flex; gap: 1px; overflow: hidden; background: var(--linea); }
.portada.dw-p3-port img { flex: 1 1 0; min-width: 0; width: auto; height: 100%; object-fit: cover; object-position: 70% 30%; }
.mini-portada .portada.dw-p3-port { padding: 0; }

/* ── 26-oct: la entrada gratis a la comunidad (/comunidad/unirme) ─────────── */
.dw-cg-rejilla { display: grid; gap: 14px; max-width: 980px; }
.dw-cg-puntos .fila .cuerpo .s { font-size: 13px; }
.dw-cg-form .dw-form { display: flex; flex-direction: column; gap: 12px; }
.dw-cg-form .dw-listo { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.dw-cg-banda { margin-top: 20px; }
@media (min-width: 900px) { .dw-cg-rejilla { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 24px; align-items: start; } }
/* 26-oct: el @ y las redes en «Únete gratis a la comunidad» */
.dw-arroba { position: relative; }
.dw-arroba > span { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-weight: 600; color: var(--texto-3); pointer-events: none; }
.dw-arroba .entrada { padding-left: 30px; }
.dw-cg-redes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 520px) { .dw-cg-redes { grid-template-columns: 1fr; } }

/* 28-oct: /curso-ia · reserva pagada del curso con Liz Turra (video arriba y grande, formulario vertical) */
.dw-ia-video { margin: 22px auto 4px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.dw-ia-marco { position: relative; width: min(68vw, 260px); aspect-ratio: 9 / 16; border-radius: 22px; overflow: hidden; background: #000; box-shadow: 0 18px 50px rgba(0, 0, 0, .35); }
.dw-ia-marco video { width: 100%; height: 100%; object-fit: cover; display: block; }
.dw-ia-sonido { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 0; border-radius: 999px;
  background: rgba(0, 0, 0, .62); color: #fff; font: 600 13px/1 inherit; white-space: nowrap; cursor: pointer; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.dw-ia-sonido svg { width: 16px; height: 16px; }
.dw-ia-video figcaption { display: flex; flex-direction: column; gap: 2px; text-align: center; font-size: 14px; line-height: 1.4; }
.dw-ia-video figcaption span { color: var(--texto-2); }
.dw-ia-nota { margin-top: 10px; font-size: 14px; }
.dw-ia-fila { display: inline-flex; align-items: center; gap: 12px; margin-top: 14px; font-weight: 600; line-height: 1.4; text-align: left; }
.dw-ia .contenedor { max-width: 560px; }
.dw-ia-form { display: flex; flex-direction: column; gap: 14px; }
.dw-ia-precio { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.dw-ia-precio s { font-size: 20px; }
.dw-ia-precio b { font-size: 46px; font-weight: 800; letter-spacing: -0.04em; line-height: 1; color: var(--luz-texto, var(--acento)); }
.dw-ia-precio-nota { flex-basis: 100%; font-size: 14px; line-height: 1.45; }
.dw-ia-k { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.dw-ia-metodos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dw-ia-metodo { position: relative; display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--linea); border-radius: 14px; cursor: pointer; }
.dw-ia-metodo input { position: absolute; opacity: 0; pointer-events: none; }
.dw-ia-metodo .dw-ia-punto { margin-left: auto; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--linea); flex-shrink: 0; }
.dw-ia-metodo:has(input:checked) { border-color: var(--luz, var(--acento)); box-shadow: 0 0 0 1px var(--luz, var(--acento)) inset; }
.dw-ia-metodo:has(input:checked) .dw-ia-punto { border: 5px solid var(--luz, var(--acento)); }
.dw-ia-metodo:has(input:focus-visible) { outline: 2px solid var(--luz, var(--acento)); outline-offset: 2px; }
.dw-ia-aviso { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; background: rgba(255, 176, 32, .12); font-size: 14px; font-weight: 600; }
.dw-ia-aviso svg { width: 18px; height: 18px; flex-shrink: 0; }
@media (min-width: 900px) {
  .dw-ia-video { flex-direction: row; align-items: flex-end; justify-content: center; gap: 22px; }
  .dw-ia-marco { width: 270px; }
  .dw-ia-video figcaption { text-align: left; padding-bottom: 8px; }
  .dw-ia-precio b { font-size: 54px; }
}

/* 29-oct: el curso con Liz en la barra (punto de «nuevo»), en la portada y en la tienda */
.dw-nav-nuevo { display: inline-block; width: 6px; height: 6px; margin-left: 5px; border-radius: 50%; background: var(--luz, var(--acento)); vertical-align: super; }
.dw-iac { display: grid; grid-template-columns: 112px 1fr; gap: 16px; align-items: center; padding: 14px; margin-top: 18px; }
.dw-sec-chica .dw-iac { margin-top: 0; }
.dw-iac-foto { display: block; aspect-ratio: 9 / 16; border-radius: 16px; overflow: hidden; background: #000; }
.dw-iac-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dw-iac-info { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.dw-iac-sellos { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; }
.dw-iac-t { font-size: 22px; line-height: 1.15; letter-spacing: -0.02em; font-weight: 750; margin: 0; }
.dw-iac-t a { color: inherit; text-decoration: none; }
.dw-iac-s { font-size: 14px; line-height: 1.4; margin: 0; }
.dw-iac-precio { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 2px; }
.dw-iac-precio b { font-size: 30px; font-weight: 800; letter-spacing: -0.04em; line-height: 1; color: var(--luz-texto, var(--acento)); }
.dw-iac-compra { grid-column: 1 / -1; }
@media (min-width: 760px) {
  .dw-iac { grid-template-columns: 120px 1fr 260px; gap: 24px; padding: 16px 24px 16px 16px; }
  .dw-iac-compra { grid-column: auto; }
  .dw-iac-t { font-size: 26px; }
}
.dw-barra nav a { white-space: nowrap; }
@media (min-width: 1024px) and (max-width: 1199px) { .dw-barra nav a { padding: 0 8px; font-size: 13px; } }