/* ficha-wp.css — piezas de las fichas armadas desde WordPress que no estaban en la maqueta */
.p-hero .p-gallery .main-img img{height:auto}
/* Imagen sin fondo, como en WordPress (hero_image de cada producto): sin recuadro, sombra ni fondo. */
.p-hero .p-gallery .main-img{background:none;box-shadow:none;border-radius:0}
.p-hero .p-gallery .main-img img{border-radius:0}
/* Imagen centrada en su columna y a la altura del texto (pedido LH 2026-10-19). */
.p-hero .wrap{align-items:center}
.p-hero .p-gallery{position:static}
.p-hero .p-gallery .main-img{display:flex;justify-content:center;align-items:center}
.p-hero .p-gallery .main-img img{width:auto;max-width:100%;max-height:520px;object-fit:contain}
/* Selector de moneda alineado con el precio. */
.p-info .p-price-row{align-items:center;flex-wrap:wrap}
.wp-texto{max-width:860px}
.wp-texto h2{margin-top:40px}
.wp-texto p,.wp-texto li{color:var(--text-muted);font-size:16px;line-height:1.65;margin-bottom:12px}
.wp-texto ul{padding-left:22px;margin-bottom:16px}
.wp-texto img{width:100%;height:auto;border-radius:12px;margin-bottom:12px}
.wp-texto a{color:var(--violet)}
.video-16x9{position:relative;aspect-ratio:16/9;max-width:960px;margin:0 auto;border-radius:12px;overflow:hidden;background:#000}
.video-16x9 iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.wp-video h2{text-align:center}
.temario{width:100%;border-collapse:collapse;margin-top:28px;font-family:var(--plex);font-size:15px;background:#fff;border-radius:12px;overflow:hidden}
.temario th,.temario td{padding:10px 14px;border-bottom:1px solid #E5E5E5;text-align:left}
.temario th{background:var(--dark-2);color:#fff;font-weight:600}
.temario td:first-child,.temario th:first-child{width:48px;text-align:center;color:var(--violet)}
.temario td:last-child{white-space:nowrap;color:var(--text-muted)}
.temario tr:last-child td{font-weight:600;color:var(--black)}
.academia .centro{text-align:center;margin-top:32px}
.alumnos{padding:72px 0}
.alumnos h3{font-family:var(--serif);font-weight:400;font-size:clamp(24px,3vw,32px);margin-bottom:12px}
.alumnos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.alumnos-grid figure .video-thumb img{width:100%;height:auto;border-radius:12px;display:block}
.alumnos-grid figcaption{display:flex;align-items:center;gap:6px;margin-top:8px;font-family:var(--plex);font-weight:600}
.alumnos-grid figcaption img{width:20px;height:auto;display:inline-block}
.p-reviews .r-card{border:1px solid #EFEFEF}
footer .legal a{color:var(--text-on-dark-muted)}
@media(max-width:560px){.temario{font-size:13.5px}.temario th,.temario td{padding:8px 8px}}
@media(max-width:920px){footer .cols{grid-template-columns:1fr 1fr;gap:28px}footer .cols>div:first-child{grid-column:1/-1}}
@media(max-width:480px){.p-sticky-bar{width:calc(100vw - 24px);justify-content:space-between}.p-sticky-bar .btn{padding:10px 16px}}
/* Texto que viene tal cual de WordPress (contenido del producto) */
.wp-despues{padding-top:0}
.wp-texto h2{font-family:var(--serif);font-weight:400;font-size:clamp(24px,3vw,32px);line-height:1.25;margin-bottom:16px}
.wp-texto ul.wp-block-list{padding-left:22px}
.wp-texto figure{margin:0 0 24px}
.wp-texto iframe{display:block;width:100%;max-width:100%;height:auto;aspect-ratio:16/9;border:0;border-radius:12px;background:#000}
.wp-texto .wp-block-embed__wrapper{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000}
.wp-texto .wp-block-embed__wrapper iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.wp-texto .wp-block-media-text{display:grid;grid-template-columns:44% 1fr !important;gap:28px;align-items:center;margin:24px 0}
.wp-texto .wp-block-media-text img{margin:0}
.wp-texto .has-text-align-center{text-align:left}
.wp-texto .ficha-tecnica{border:1px solid #E5E5E5;border-radius:8px;overflow:hidden;margin:36px 0;font-family:var(--plex);font-size:15px;width:100%}
.wp-texto .ficha-item{display:flex;flex-wrap:wrap;border-bottom:1px solid #E5E5E5;align-items:flex-start}
.wp-texto .ficha-item:last-child{border-bottom:none}
.wp-texto .ficha-item:nth-child(odd){background:#F9F9F9}
.wp-texto .ficha-item:nth-child(even){background:#fff}
.wp-texto .ficha-pregunta{flex:0 0 30%;font-weight:600;color:var(--text-dark);padding:16px 20px;margin:0;line-height:1.4}
.wp-texto .ficha-respuesta{flex:1;padding:16px 20px;margin:0;color:var(--text-muted);line-height:1.5}
.wp-texto .ficha-respuesta p,.wp-texto .ficha-respuesta li{font-size:15px;margin-bottom:6px}
.wp-texto table.tablepress{width:100%;border-collapse:collapse;margin:20px 0 36px;font-family:var(--plex);font-size:15px;background:#fff;border-radius:12px;overflow:hidden}
.wp-texto table.tablepress th,.wp-texto table.tablepress td{padding:10px 14px;border-bottom:1px solid #E5E5E5;text-align:left}
.wp-texto table.tablepress thead th{background:var(--dark-2);color:#fff;font-weight:600}
.wp-texto table.tablepress td:last-child{white-space:nowrap;color:var(--text-muted)}
@media(max-width:720px){
  .wp-texto .wp-block-media-text{grid-template-columns:1fr !important}
  .wp-texto .ficha-pregunta{flex-basis:100%;padding-bottom:4px}
  .wp-texto .ficha-respuesta{padding-top:4px}
  .wp-texto table.tablepress{font-size:13.5px}
  .wp-texto table.tablepress th,.wp-texto table.tablepress td{padding:8px}
}
/* Precio con descuento, como lo arma WooCommerce */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.mb-precio del{font-size:.62em;font-weight:400;color:var(--text-muted);margin-right:8px;opacity:.8}
.mb-precio ins{text-decoration:none}
/* Suscripción (Fluent Forms #112) */
.mb-novedades{padding:64px 0;background:var(--dark-2);color:#fff;text-align:center}
.mb-novedades .kicker{color:var(--violet)}
.mb-novedades h3{font-family:var(--serif);font-weight:400;font-size:clamp(22px,3vw,30px);margin:8px 0 24px}
.mb-novedades form{max-width:480px;margin:0 auto}
.mb-novedades .ff-t-container,.mb-novedades .ff-t-cell{display:block}
.mb-novedades .ff-el-group{margin-bottom:12px}
.mb-novedades .ff-el-form-control{width:100%;padding:12px 14px;border-radius:8px;border:1px solid #ccc;font:inherit;font-size:16px}
.mb-novedades .ff-btn-submit{width:100%;padding:12px 18px;font:inherit;font-weight:600;cursor:pointer;border:1px solid transparent}
.mb-novedades .ff-message-success{color:#fff;margin-top:12px}
.mb-novedades .error.text-danger{color:#ffb4c6;font-size:14px;margin-top:6px;text-align:left}

/* ---- Repaso de diseño 2026-10-19 (crítica con capturas; reglas medibles en el control automático) ---- */
/* Alumnos: fotos verticales a su tamaño (230x409), 4 columnas en compu, 2 en celular. */
.alumnos-grid{grid-template-columns:repeat(4,1fr)}
.alumnos-grid figure{margin:0;display:flex;flex-direction:column;align-items:center}
.alumnos-grid figure .video-thumb{max-width:230px;width:100%}
.alumnos-grid figure .video-thumb img{aspect-ratio:9/16;object-fit:cover}
.alumnos-grid figcaption{justify-content:center}
@media(max-width:720px){.alumnos-grid{grid-template-columns:repeat(2,1fr);gap:14px}}
/* Imagen principal: las de WordPress están cortadas a la derecha (allá salen por el borde de la pantalla): se difumina ese borde. */
.p-hero .p-gallery .main-img img{-webkit-mask-image:linear-gradient(to right,#000 78%,transparent);mask-image:linear-gradient(to right,#000 78%,transparent)}
/* Huecos entre secciones del mismo fondo. */
.p-hero{padding-bottom:24px}
.p-hero+.p-learn,.p-learn+.p-reviews,.wp-despues+.academia{padding-top:16px}
/* Mismo borde izquierdo en todas las secciones: el texto de WordPress usa el ancho de la página y las líneas largas se limitan. */
.wp-texto{max-width:var(--maxw)}
.wp-texto>p,.wp-texto>ul,.wp-texto>h2,.wp-texto>h3{max-width:760px}
/* Academia: las 4 tarjetas en una fila (2 y 1 en pantallas chicas). */
.academia .cards{grid-template-columns:repeat(4,1fr)}
@media(max-width:920px){.academia .cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.academia .cards{grid-template-columns:1fr}}
/* Reseñas: columnas tipo revista, sin tarjetas estiradas vacías. */
.p-reviews .r-list{display:block;columns:3 320px;column-gap:22px}
.p-reviews .r-card{break-inside:avoid;margin-bottom:22px}
/* Preguntas frecuentes: una sola columna (la de la izquierda quedaba vacía). */
.p-faq2 .faq-layout{grid-template-columns:1fr;max-width:860px}
.p-faq2 .faq-intro{position:static}
/* Temario (TablePress): la fila del total en negrita. */
.wp-texto table.tablepress tr:last-child td{font-weight:600;color:var(--black)}
/* "Educando a astrólogos": la imagen es de 286x286, no se agranda. */
.p-instructor .video-thumb{max-width:520px;width:100%;justify-self:center}
.p-instructor .video-thumb img{max-width:100%;border-radius:16px}
/* Huecos entre secciones del mismo fondo (blanco). */
.p-reviews{padding-bottom:32px}
.alumnos{padding-bottom:24px}
.alumnos+.p-related{padding-top:40px}
/* Fin del texto de WordPress: sin margen sobrante antes de "Academia". */
.wp-texto>:last-child{margin-bottom:0}
.wp-despues{padding-bottom:40px}
/* Caja de compra fija a la derecha del texto (compu ≥ 1100 px); reemplaza a la barra flotante. */
.caja-compra{display:none}
@media(min-width:1100px){
  .cuerpo{max-width:var(--maxw);margin:0 auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
  .cuerpo .wrap{max-width:none;padding:0}
  .cuerpo-main{min-width:0}
  .caja-compra{display:block;position:sticky;top:96px;margin-top:16px}
  .cc-card{background:#fff;border:1px solid #E5E5E5;border-radius:16px;box-shadow:0 8px 32px rgba(2,1,1,.08);padding:24px;display:flex;flex-direction:column;gap:14px}
  .cc-nombre{font-family:var(--serif);font-size:22px;line-height:1.25;color:var(--black)}
  .cc-rating{font-family:var(--plex);font-size:14px;color:var(--text-muted);display:flex;gap:6px;align-items:center}
  .cc-rating .stars{color:#E8A33D;letter-spacing:1px}
  .cc-rating a{color:var(--text-muted)}
  .cc-precio{font-family:var(--plex);font-size:30px;font-weight:700;color:var(--black);line-height:1.1}
  .caja-compra .p-currency{width:auto;align-self:flex-start}
  .caja-compra .btn{width:100%;justify-content:center;text-align:center}
  .p-sticky-bar{display:none!important}
}
.cuerpo+.academia{padding-top:16px}
/* Videos: foto con botón de reproducir; el video se abre encima de la página (como el lightbox de WordPress). */
.video-thumb{position:relative;display:block;padding:0;border:0;background:none;cursor:pointer;border-radius:12px;overflow:hidden}
.video-thumb img{display:block;width:100%;height:auto;transition:transform .3s}
.video-thumb:hover img{transform:scale(1.03)}
.video-thumb .play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(2,1,1,.55);box-shadow:0 4px 18px rgba(0,0,0,.3)}
.video-thumb .play::after{content:"";position:absolute;left:26px;top:20px;border-left:18px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}
.video-thumb:focus-visible{outline:3px solid var(--violet);outline-offset:3px}
.mb-video{position:fixed;inset:0;z-index:200;background:rgba(2,1,1,.85);display:flex;align-items:center;justify-content:center;padding:24px}
.mb-video[hidden]{display:none}
.mb-video-caja{position:relative;width:min(960px,100%)}
.mb-video-caja.vertical{width:min(420px,100%,calc((100vh - 96px) * 9 / 16))}
.mb-video-marco{position:relative;aspect-ratio:16/9;background:#000;border-radius:12px;overflow:hidden}
.mb-video-caja.vertical .mb-video-marco{aspect-ratio:9/16}
.mb-video-marco iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.mb-video-cerrar{position:absolute;right:0;top:-44px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.mb-video-cerrar:focus-visible{outline:2px solid #fff}

/* ---- Crítica de UX/UI 2026-10-19 (aplicado por decisión LH) ---- */
/* 2. Violeta un poco más oscuro: blanco sobre violeta y violeta sobre blanco ≥ 4.5:1 (antes 3.3:1).
      En fondos oscuros queda el violeta original, que ahí se lee mejor. */
:root{--violet:#7C53D5;--violet-claro:#9C7DDF}
.mb-novedades .kicker,.p-instructor .kicker{color:var(--violet-claro)}
/* Toques cómodos con el dedo (≥ 44 px): selector de moneda, enlace a reseñas, recorrido de arriba. */
.p-currency{min-height:44px}
.p-rating a{position:relative}
.p-rating a::before{content:"";position:absolute;left:0;right:0;top:-12px;bottom:-12px}
.breadcrumb a,nav.breadcrumb a,.crumbs a{display:inline-block;padding:13px 0}
@media(max-width:720px){
  /* 1. Botón de compra en la primera pantalla del celular: imagen principal más baja. */
  .p-hero{padding-top:8px}
  .p-hero .wrap{gap:12px}
  .p-hero .p-gallery .main-img img{max-height:200px}
  .p-info h1{margin-bottom:6px}
  .p-info .p-rating{margin-bottom:4px}
  /* Botón inmediatamente debajo del precio; los beneficios después (lo normal en tiendas en celular). */
  .p-info{display:flex;flex-direction:column}
  .p-info>.p-price-row~*{order:2}
  .p-info>.p-cta{order:1;margin:10px 0 14px}
  /* Zoom: la frase gancho va debajo del botón (con título de 2 renglones + recuadro de fecha no entraba; Atacires 28/10). */
  .p-info:has(>.zoom-cuando)>.p-tagline{order:2;margin-bottom:14px}
  .breadcrumb a{padding:6px 0}
  /* 3. Página más corta en celular. */
  .p-related .r-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .p-related .r-prod{padding:8px}
  .p-related .r-prod .rp-title{font-size:13px}
  .wp-texto .ficha-tecnica.plegable .ficha-pregunta{cursor:pointer;position:relative;padding-right:40px}
  .wp-texto .ficha-tecnica.plegable .ficha-pregunta::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);color:var(--violet);font-size:20px;font-weight:400}
  .wp-texto .ficha-tecnica.plegable .ficha-item.abierta .ficha-pregunta::after{content:"–"}
  .wp-texto .ficha-tecnica.plegable .ficha-item:not(.abierta) .ficha-respuesta{display:none}
  .wp-texto table.tablepress.recortada tbody tr.oculta{display:none}
  .ver-temario{display:block;width:100%;margin:-24px 0 32px;min-height:44px;font-family:var(--plex);font-weight:600;font-size:15px;color:var(--violet);background:#fff;border:1px solid #E5E5E5;border-radius:8px;cursor:pointer}
}
/* Beneficios de arriba: la negrita viene de WordPress en algunos; peso medio y parejo (crítica UX/UI). */
.p-bullets li,.p-bullets strong,.p-bullets b{font-weight:500;color:inherit}
/* Botones "Comprar ahora": dos tamaños. Grande (arriba, caja de compra, Academia); compacto solo en la barra flotante. */
.academia .centro .btn,.caja-compra .btn{font-size:16px;padding:16px 32px;line-height:20px}
.academia .centro .btn{min-width:320px}
@media(max-width:720px){.academia .centro .btn{display:block;width:100%;min-width:0}}

/* Orden de venta (LH 2026-10-21): qué incluye, temario, profesora en el cuerpo, preguntas y cierre con garantía. */
.p-incluye{padding:56px 0 8px}
.p-incluye h2,.p-faq h2,.p-cierre h2{font-family:var(--serif);font-weight:400;font-size:clamp(24px,3vw,32px);line-height:1.25;margin-bottom:20px}
.incluye{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px 28px}
.incluye li{position:relative;padding-left:30px;font-size:16px;line-height:1.5;color:var(--text-dark)}
.incluye li::before{content:"✓";position:absolute;left:0;top:0;color:var(--violet);font-weight:700}
.tm{display:grid;gap:20px;margin-top:8px}
.tm h3{font-family:var(--plex);font-size:17px;font-weight:600;margin:0 0 8px;color:var(--black)}
.tm ol{margin:0;padding-left:24px}
.tm li{color:var(--text-muted);font-size:15.5px;line-height:1.55;margin-bottom:4px}
.tm .tm-plus{font-size:14.5px;margin-top:8px}
.cuerpo-main .p-instructor{border-radius:16px;padding:48px 40px;margin:24px 0}
.cuerpo-main .p-instructor .wrap{grid-template-columns:1fr;gap:28px}
.p-instructor .profe-texto a{color:var(--violet-claro)}
.p-faq{padding-top:40px}
.p-faq .ficha-tecnica{margin-top:0}
.p-cierre{padding:24px 0 64px;text-align:center}
.p-cierre p{color:var(--text-muted);font-size:16px;line-height:1.6;max-width:620px;margin:0 auto 12px}
.p-cierre .centro{margin-top:20px}
/* Botones del encabezado: del ancho de su texto, uno al lado del otro y alineados a la izquierda (LH 2026-10-21: el botón a todo lo ancho queda feo). */
.p-info .p-cta{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:12px}
.p-info .p-cta .btn{width:auto;margin:0}
.p-info .p-cta .ver-video{padding:14px 24px;border-width:1px}
@media(max-width:560px){.cuerpo-main .p-instructor{padding:36px 20px;border-radius:0}}

/* Ajustes de celular (repaso LH 2026-10-21). */
.p-reviews .r-card .r-who .r-verified{color:var(--violet)}            /* sin verde: colores de marca */
.p-faq{padding:40px 0 16px}
.p-cierre{padding:16px 0 40px}
.p-cierre+*,.cuerpo+.alumnos{padding-top:40px}
.p-info .p-cta .btn{min-width:220px}
@media(max-width:560px){
  .cuerpo-main .p-instructor{padding:40px 0;border-radius:0;margin:16px 0}
  .p-incluye{padding-top:40px}
  .p-info .p-cta .btn{min-width:0;width:100%;max-width:300px}
}
.tm.recortado li.oculta,.tm.recortado .tm-curso.oculta{display:none}
.tm+.ver-temario{margin:16px 0 8px}
.tm.recortado .tm-plus.oculta{display:none}
/* Safari respetaba el height="300" de la foto en tarjetas angostas (estirada y recortada). */
.p-related .r-prod img{height:auto;flex:none;align-self:stretch}

/* Encabezado: Ingresar lila con ícono y Carrito blanco con ícono, como en WordPress;
   sin el verde lima de la maqueta (LH 2026-10-22). */
.hdr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.hdr-btn svg{width:18px;height:18px;flex:none}
.hdr-txt{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hdr-ingresar{background:var(--violet);border-color:var(--violet);color:#fff}
.hdr-ingresar:hover{background:#8667D6;border-color:#8667D6;color:#fff}
.hdr-carrito{background:#fff;border-color:#fff;color:#1a1a1a}
.hdr-carrito:hover{background:#EFE9FB;border-color:#EFE9FB;color:#1a1a1a}
.mega-nav>li>a:hover,.mega-nav>li.open>a,.mega-col a:hover{color:#B9A3EC}
.mobile-menu .btn.hdr-btn{display:flex}
.mobile-menu a.hdr-ingresar,.mobile-menu a.hdr-ingresar:hover{color:#fff}
.mobile-menu a.hdr-carrito,.mobile-menu a.hdr-carrito:hover{color:#1a1a1a}
.mobile-menu a:hover{color:#B9A3EC}
/* El menú nunca parte "Acerca de Mí" / "La Academia" en dos renglones (LH 22/10):
   en pantallas medianas se achican los espacios; en las angostas, los botones
   quedan solo con el ícono (el texto sigue para lectores de pantalla). */
.mega-nav>li>a{white-space:nowrap}
.nav .actions{flex:none}
.hdr-btn{position:relative}
.actions .hdr-txt{max-width:120px}
@media(max-width:1280px){.nav{gap:14px}.mega-nav>li>a{padding:8px 9px}.actions .hdr-btn{padding-left:14px;padding-right:14px}}
@media(max-width:960px){.actions .hdr-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.actions .hdr-btn{padding:8px 11px;gap:0}}

/* Menú "Hola, <nombre>" con sesión (lo arma el portero), como el de WordPress (LH 22/10). */
.hdr-cuenta{position:relative}
.hdr-chev{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;margin-left:2px;flex:none}
.hdr-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:210px;background:#fff;border-radius:8px;box-shadow:0 12px 32px rgba(0,0,0,.28);padding:6px 0;margin:0;list-style:none;display:none;z-index:80;text-align:left}
.hdr-cuenta.abierto .hdr-menu{display:block}
.hdr-menu a{display:block;padding:9px 18px;color:#1a1a1a;text-decoration:none;font-family:var(--plex);font-size:15px;white-space:nowrap}
.hdr-menu a:hover,.hdr-menu a:focus-visible{background:#EFE9FB;color:#1a1a1a}
.hdr-sep{height:1px;background:#e6e6e6;margin:6px 0}
.hdr-cuenta-cel{margin-top:16px;border-top:1px solid rgba(255,255,255,.12);padding-top:6px}
.hdr-cuenta-titulo{display:flex;align-items:center;gap:8px;color:#B9A3EC;font-family:var(--plex);font-weight:600;font-size:17px;padding:12px 0 6px}
.hdr-cuenta-titulo svg{width:18px;height:18px;flex:none}
.mobile-menu .hdr-cuenta-cel a{padding:11px 0 11px 26px}

/* Carrito solo con ícono en el encabezado de compu (LH 22/10): libera lugar para "Hola, <nombre>".
   En el menú del celular sigue con texto. */
.actions .hdr-carrito{padding:8px 0;width:44px;height:40px;gap:0}
.actions .hdr-carrito .hdr-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.actions .hdr-carrito svg{width:20px;height:20px}
.actions .hdr-ingresar .hdr-txt{max-width:200px}

/* Celular y tablet: cuenta y carrito en la barra, como WordPress (logo solo ícono) (LH 22/10). */
@media(max-width:920px){
  .nav{gap:10px}
  .nav-logo{margin-right:auto;line-height:0}
  .nav-logo img{width:33px;height:32px}
  .nav .actions{display:flex;gap:8px}
  .actions .hdr-ingresar{padding:8px 12px;gap:6px}
  .actions .hdr-ingresar .hdr-txt{position:static;width:auto;height:auto;clip:auto;overflow:hidden;text-overflow:ellipsis;max-width:120px}
  .actions .hdr-carrito{width:40px;height:38px}
  .burger{margin-left:4px}
}
@media(max-width:360px){
  .actions .hdr-ingresar .hdr-txt{position:absolute;width:1px;height:1px;clip:rect(0 0 0 0)}
  .actions .hdr-ingresar{padding:8px 10px}
}
/* Testimonios: las columnas no pueden ser más anchas que la pantalla (a 320 px se salían 26 px). */
.alumnos-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.alumnos-grid figure{min-width:0}
.alumnos-grid figcaption{flex-wrap:wrap}
@media(max-width:720px){.alumnos-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Barra fija de compra en celulares chicos: el título se achica (con "…") y el botón entra entero. */
@media(max-width:480px){.p-sticky-bar .sb-info{min-width:0;flex:1}.p-sticky-bar .sb-info .sb-title{max-width:100%}}
@media(max-width:360px){.p-sticky-bar{gap:8px;padding-left:12px}.p-sticky-bar .btn{padding:10px 12px;font-size:13px}}
/* Tablet: "Comprar ahora" en la primera pantalla (en 768 px la imagen lo empujaba abajo). */
@media(min-width:721px) and (max-width:920px){.p-hero .p-gallery .main-img img{max-height:300px}.p-hero .wrap{gap:16px}.p-hero{padding-top:8px}}
/* Chat de soporte sin tapar la compra (comparación lado a lado con WordPress, 22/10):
   en celular es un círculo con el ícono; con la barra fija de compra a la vista sube por encima;
   con el menú del celular abierto se esconde. */
@media(max-width:720px){
  body #sai-launcher{width:52px;height:52px;padding:0;justify-content:center;gap:0;right:14px;bottom:16px}
  body #sai-launcher>span:not(.sai-launcher-ico){display:none}
  body #sai-launcher .sai-launcher-ico{font-size:22px}
}
body:has(.p-sticky-bar.show) #sai-launcher{bottom:96px}
@media(max-width:920px){body:has(.p-sticky-bar.show) #sai-launcher{bottom:80px}}
body:has(#menu-toggle:checked) #sai-launcher{display:none}
/* Celular/tablet: menú a la izquierda del logo, como en WordPress (no salta de lado al pasar de una página a otra). */
@media(max-width:920px){.nav .burger{order:-1;margin-left:0;margin-right:6px}}
/* Celulares chicos (≤360 px): imagen más baja para que "Comprar ahora" quede arriba y lejos del chat. */
@media(max-width:360px){.p-hero .p-gallery .main-img img{max-height:110px}.p-info .p-kicker{margin-bottom:4px}.p-info h1{font-size:26px}}
/* ≤360 px: el chat no entra junto a "Comprar ahora" (botón a todo el ancho): aparece al bajar,
   cuando se ve la barra fija de compra (y queda por encima de ella). */
@media(max-width:360px){body:not(:has(.p-sticky-bar.show)) #sai-launcher{display:none}}

/* Insignia de reseñas del pie, como WordPress (22/10). El plugin la achica con JavaScript
   (escala ~0,56 para que entre en la columna) y recién ahí la muestra (visibility); acá lo mismo con zoom, sin script. */
footer .cr-trustbadgef{margin:18px 0 0}
footer .cr-badge.badge-vs{zoom:.56;max-width:none;visibility:visible}
@media (max-width:600px){footer .cr-badge.badge-vs{zoom:.5}}
@media (max-width:380px){footer .cr-badge.badge-vs{zoom:.42}}
/* Redes del pie con ícono lila, como WordPress (22/10). */
footer .red-ico{width:14px;height:14px;fill:#9C7DDF;vertical-align:-2px;margin-right:8px;flex:none}

/* Ficha de curso en vivo (Zoom): cuándo empieza, encuentros y profesora, arriba del precio. */
.zoom-cuando{margin:14px 0 16px;padding:14px 16px;background:var(--lavanda,#E9E5F1);border-radius:10px;display:grid;gap:6px;max-width:520px}
.zoom-cuando p{margin:0;font-size:15px;line-height:1.45;color:var(--text-dark,#202020)}
.zoom-cuando .zc-fecha{font-weight:600;color:#3d2a73;font-size:16px}
.zoom-cuando .zc-ico{margin-right:8px}
.zoom-cuando .ctz{display:block;font-weight:400;font-size:14px;color:#5b4a8a;margin-top:2px}
.zoom-cuando .ctz:empty{display:none}
.zoom-cuando .zc-ya{font-weight:600;color:#3d2a73}
.zoom-cuando .zc-grabado{font-size:14px;color:var(--text-muted,#555)}
.zoom-cuando .zc-cerrado{font-weight:600;color:#3d2a73}
@media(max-width:720px){.zoom-cuando{margin:8px 0 10px;padding:12px 14px}.zoom-cuando p{font-size:14.5px}}
/* Fotos chicas del texto de WordPress (p. ej. la de la profesora, tamaño "medium" 200×300): a su tamaño, no a todo lo ancho. */
.wp-texto figure.size-medium img,.wp-texto figure.size-thumbnail img{width:auto;max-width:min(100%,300px);height:auto}
.wp-texto figure.aligncenter.size-medium,.wp-texto figure.aligncenter.size-thumbnail{text-align:center}
.wp-texto figure.aligncenter.size-medium img,.wp-texto figure.aligncenter.size-thumbnail img{margin:0 auto;display:block}
/* "Sobre <profesora>" igual en todas las fichas (LH 2026-10-27): foto a la izquierda, entera, ancho fijo; texto a la derecha. */
.wp-texto .profe-bio{display:flex;gap:32px;align-items:flex-start;margin:8px 0 32px}
.wp-texto .profe-bio .profe-foto{flex:0 0 240px;width:240px;max-width:240px;height:auto;border-radius:12px;margin:0}
.wp-texto .profe-bio .profe-bio-texto{flex:1;min-width:0}
.wp-texto .profe-bio .profe-bio-texto>:first-child{margin-top:0}
@media(max-width:720px){.wp-texto .profe-bio{flex-direction:column;gap:16px}.wp-texto .profe-bio .profe-foto{flex:none;width:180px;max-width:180px}}
/* Enlaces "#…" dentro de la ficha: el título de destino queda debajo del menú fijo, no tapado. */
html{scroll-padding-top:96px}
/* Bloques que en WordPress tenían estilos propios (ficha STA): con el diseño del sitio (LH 2026-10-27). */
.wp-texto .wb-caja{background:#faf8fe;border:1px solid #ece6f9;border-radius:16px;padding:28px 32px;margin:32px 0}
.wp-texto .wb-caja>:first-child{margin-top:0}.wp-texto .wb-caja>:last-child{margin-bottom:0}
.wp-texto .wb-acento{border-left:5px solid var(--violet)}
.wp-texto .wb-centro{text-align:center}
.wp-texto .wb-cita{margin:16px 0;padding:14px 18px;border-left:3px solid var(--violet);background:#fff;font-style:italic;border-radius:0 8px 8px 0}
.wp-texto .wb-dos-col{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin:8px 0 24px}
.wp-texto .wb-lista{list-style:none;padding:0;margin:0}
.wp-texto .wb-lista li{padding:10px 0;border-bottom:1px solid #eee;margin:0}
.wp-texto .wb-con-foto{display:flex;gap:28px;align-items:center}
.wp-texto .wb-con-foto>div{flex:1;min-width:0}
.wp-texto .wb-con-foto>.wb-foto{flex:0 0 140px}
.wp-texto .wb-con-foto .wb-foto img{width:140px;height:auto;margin:0;border-radius:8px}
.wp-texto .wb-destacado{color:var(--violet);font-weight:600;letter-spacing:.04em;margin-bottom:4px}
.wp-texto .wb-testimonio{text-align:center;font-style:italic;color:#555}
.wp-texto .wb-video{margin:32px 0}
.wp-texto .wb-caja .btn{margin-top:4px}
@media(max-width:720px){.wp-texto .wb-caja{padding:20px}.wp-texto .wb-dos-col{grid-template-columns:1fr}.wp-texto .wb-con-foto{flex-direction:column;align-items:flex-start}}
.wp-texto .wb-caja a.btn-primary{color:#fff;text-decoration:none}
.wp-texto .wb-caja a.btn-secondary{color:var(--violet);text-decoration:none}
/* Texto de WordPress: el primer elemento no suma margen arriba (un h2 inicial dejaba 40 px de hueco, Aspectos). */
.wp-texto > :first-child{margin-top:0}
/* Bloque "productos elegidos" de WooCommerce dentro del texto (Astroquiz en Aspectos): a su tamaño, sin estirarse. */
.wp-texto .wc-block-grid__products{list-style:none;margin:16px 0;padding:0}
.wp-texto .wc-block-grid__product{max-width:262px}
.wp-texto .wc-block-grid__product-image img{width:auto;max-width:100%;height:auto}
/* Celular chico: "queda grabado" ya está en las preguntas; así el botón entra en la primera pantalla. */
@media(max-width:380px){.zoom-cuando{margin:6px 0 8px;padding:10px 12px;gap:4px}.zoom-cuando .zc-grabado{display:none}}
/* Foro del curso (cursos de 2+ encuentros). En celular chico va en "Qué incluye" y en las preguntas. */
.zoom-cuando .zc-foro{font-size:14px;color:var(--text-muted,#555)}
@media(max-width:380px){.zoom-cuando .zc-foro{display:none}}
@media(max-width:380px){.p-info:has(>.zoom-cuando)>.p-cta{margin-top:4px}}
/* Producto recomendado dentro del texto (p. ej. Astroquiz): tarjeta con foto, estrellas, precio y botón. */
.p-elegidos{display:grid;gap:12px;margin:20px 0 8px;max-width:560px}
.p-elegido{display:flex;gap:18px;align-items:center;padding:14px;border:1px solid #e4def0;border-radius:14px;background:#faf8fd;text-decoration:none;color:inherit;transition:box-shadow .2s,border-color .2s}
.p-elegido:hover{border-color:#9C7DDF;box-shadow:0 6px 20px rgba(124,83,213,.15)}
.p-elegido img{width:120px;height:auto;border-radius:10px;flex:none;margin:0}
.p-elegido .pe-info{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.p-elegido .pe-nombre{font-weight:600;font-size:18px;color:var(--text-dark,#202020)}
.p-elegido .pe-stars{font-size:14px;color:#555}.p-elegido .pe-stars span{color:#E2A13B;letter-spacing:1px}
.p-elegido .pe-precio{font-weight:600;font-size:16px;color:var(--text-dark,#202020)}
.p-elegido .pe-btn{margin-top:6px;pointer-events:none}
@media(max-width:480px){.p-elegido{gap:12px;padding:12px}.p-elegido img{width:92px}.p-elegido .pe-nombre{font-size:16px}}
/* Bloque "verso" de WordPress (frase destacada; Dracónica 28/10): en WordPress sale en letra
   de máquina de escribir con fondo gris. Acá, como cita: letra del texto, cursiva, borde lila. */
.wp-texto pre.wp-block-verse{font-family:inherit;font-size:1.15em;font-style:italic;line-height:1.5;white-space:pre-wrap;background:none;border-left:3px solid var(--violet);padding:4px 0 4px 18px;margin:24px 0;color:inherit;overflow:visible}
/* Ficha Zoom con estrellas (Dracónica 28/10): recuadro de fecha + estrellas empujaban
   "Inscribirme" fuera de la primera pantalla del celular. Imagen de arriba un poco más baja. */
@media(min-width:361px) and (max-width:720px){.p-hero:has(.zoom-cuando) .p-gallery .main-img img{max-height:170px}}
@media(max-width:360px){.p-hero:has(.zoom-cuando):has(.p-rating) .p-gallery .main-img img{max-height:80px}}
/* La frase "verso" como primera cosa de la sección: sin margen arriba (si no, hueco grande). */
.wp-texto>pre.wp-block-verse:first-child{margin-top:0}
/* Ningún bloque preformateado del texto se sale de costado en celular (Señores del Tiempo 28/10). */
.wp-texto pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%}
/* Tabla común de WordPress dentro del texto (Señores del Tiempo: técnicas con enlace a su video).
   Sin esto las celdas quedaban pegadas, como enlaces sueltos. En celular, una celda por renglón. */
.wp-texto figure.wp-block-table{margin:20px 0 32px;overflow-x:auto}
.wp-texto figure.wp-block-table table{width:100%;border-collapse:collapse;font-family:var(--plex);font-size:15px;background:#fff;border:1px solid #E5E5E5;border-radius:12px;overflow:hidden}
.wp-texto figure.wp-block-table td,.wp-texto figure.wp-block-table th{padding:12px 16px;border:1px solid #E5E5E5;text-align:left;vertical-align:top}
.wp-texto figure.wp-block-table.is-style-stripes tbody tr:nth-child(odd){background:#F8F8F8}
@media(max-width:560px){.wp-texto figure.wp-block-table:not(:has(thead)) tr{display:flex;flex-direction:column}.wp-texto figure.wp-block-table:not(:has(thead)) td{border-width:0 0 1px}}
/* Tablet, ficha Zoom con frase gancho y estrellas (Señores del Tiempo 28/10): "Inscribirme" quedaba
   24 px debajo de la primera pantalla. Imagen de arriba un poco más baja (300 → 240 px). */
@media(min-width:721px) and (max-width:920px){.p-hero:has(.zoom-cuando):has(.p-tagline):has(.p-rating) .p-gallery .main-img img{max-height:240px}}