/*
 * Hornea: estilos del sitio. Primero el celular; desde 800 px, escritorio.
 * Colores y tipografías vienen de theme.json (variables --wp--preset--…).
 */

:root {
	--h-radio: 22px;
	--h-sombra: 0 1px 2px rgba(28, 25, 23, .05), 0 12px 32px -16px rgba(68, 40, 10, .22);
	--h-ancho: 1200px;
	--h-acento: var(--wp--preset--color--acento);
	--h-acento-fuerte: var(--wp--preset--color--acento-fuerte);
	--h-acento-solido: var(--wp--preset--color--acento-solido);
	--h-texto: var(--wp--preset--color--texto);
	--h-suave: var(--wp--preset--color--texto-suave);
	--h-borde: var(--wp--preset--color--borde);
}

html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
.h-icono { flex: none; }
.h-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.h-saltar { position: absolute; left: -999px; top: 8px; z-index: 100; background: #fff; padding: .6rem 1rem; border-radius: 10px; }
.h-saltar:focus { left: 8px; }

/* ---------- Contenedor y secciones ---------- */
.h-contenedor { width: min(var(--h-ancho), 100% - 2 * clamp(1rem, 4vw, 2rem)); margin-inline: auto; }
.h-seccion { padding-block: var(--wp--preset--spacing--60); }
.h-seccion--crema { background: var(--wp--preset--color--crema); }
.h-seccion--blanca { background: var(--wp--preset--color--superficie); }
.h-cabecera-seccion { max-width: 720px; margin: 0 auto var(--wp--preset--spacing--50); text-align: center; }
.h-cabecera-seccion h2 { margin: .4rem 0 .9rem; }
.h-ceja { display: inline-flex; align-items: center; gap: .45rem; font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--h-acento-fuerte); }
.h-entrada { font-size: var(--wp--preset--font-size--medio); line-height: 1.6; color: var(--wp--preset--color--texto-cuerpo); }
.h-nota { font-size: .9rem; color: var(--h-suave); }

/* ---------- Botones ---------- */
.h-botones { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; }
.h-boton { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 48px; padding: .8rem 1.5rem; border-radius: 999px; font-weight: 600; font-size: 1rem; text-decoration: none !important; transition: background-color .15s, transform .15s, box-shadow .15s; }
.h-boton:active { transform: scale(.98); }
.h-boton--principal { background: var(--h-acento-solido); color: var(--h-texto) !important; box-shadow: 0 10px 24px -12px rgba(217, 119, 6, .7); }
.h-boton--principal:hover { background: #fbbf24; }
.h-boton--secundario { background: #fff; color: var(--h-texto) !important; border: 1px solid var(--h-borde); }
.h-boton--secundario:hover { border-color: #d6d3d1; background: #fffdf8; }
.h-boton--claro { background: #fff; color: var(--h-texto) !important; }
.h-boton:focus-visible, a:focus-visible, summary:focus-visible { outline: 2px solid var(--h-acento-fuerte); outline-offset: 3px; }

/* ---------- Encabezado ---------- */
.h-encabezado { position: sticky; top: 0; z-index: 50; background: rgba(250, 250, 249, .86); backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px); border-bottom: 1px solid rgba(231, 229, 228, .7); }


.h-encabezado .h-contenedor { display: flex; align-items: center; gap: 1rem; min-height: 68px; }
.h-logo { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none !important; color: var(--h-texto) !important; }
.h-logo img { width: 36px; height: 36px; border-radius: 10px; }
.h-logo span { font-family: var(--wp--preset--font-family--titulos); font-weight: 700; font-size: 1.45rem; letter-spacing: -.02em; }
.h-nav { margin-left: auto; display: none; }
.h-nav ul { display: flex; gap: .25rem; list-style: none; margin: 0; padding: 0; }
.h-nav a { display: block; padding: .55rem .85rem; border-radius: 999px; color: var(--wp--preset--color--texto-cuerpo) !important; text-decoration: none !important; font-weight: 500; font-size: .95rem; }
.h-nav a:hover, .h-nav a[aria-current="page"] { background: var(--wp--preset--color--acento-suave); color: var(--h-acento-fuerte) !important; }
.h-encabezado .h-boton { display: none; min-height: 42px; padding: .55rem 1.1rem; font-size: .92rem; }
.h-menu { margin-left: auto; position: relative; }
.h-menu summary { list-style: none; cursor: pointer; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: var(--h-texto); }
.h-menu summary::-webkit-details-marker { display: none; }
.h-menu[open] summary { background: var(--wp--preset--color--acento-suave); }
.h-menu .h-menu__cerrar, .h-menu[open] .h-menu__abrir { display: none; }
.h-menu[open] .h-menu__cerrar { display: block; }
.h-menu__panel { position: absolute; right: 0; top: calc(100% + 10px); width: min(300px, 86vw); background: #fff; border: 1px solid var(--h-borde); border-radius: 18px; box-shadow: var(--h-sombra); padding: .6rem; }
.h-menu__panel ul { list-style: none; margin: 0 0 .5rem; padding: 0; }
.h-menu__panel a:not(.h-boton) { display: block; padding: .8rem 1rem; border-radius: 12px; color: var(--h-texto) !important; text-decoration: none !important; font-weight: 500; }
.h-menu__panel a:not(.h-boton):hover { background: var(--wp--preset--color--crema); }
.h-menu__panel .h-boton { width: 100%; }
@media (min-width: 900px) {
	.h-nav { display: block; }
	.h-encabezado .h-boton { display: inline-flex; }
	.h-menu { display: none; }
}

/* ---------- Portada ---------- */
.h-portada { position: relative; overflow: hidden; padding-block: clamp(2.5rem, 6vw, 5rem) clamp(3rem, 7vw, 6rem); background: radial-gradient(circle at 78% 40%, #fde5b8 0, #fbf1e2 38%, var(--wp--preset--color--fondo) 72%); }
.h-portada .h-contenedor { display: grid; gap: clamp(2rem, 5vw, 3rem); align-items: center; }
.h-portada h1 { margin: 1rem 0 1.2rem; font-size: var(--wp--preset--font-size--portada); }
.h-portada h1 em { font-style: normal; color: var(--h-acento-fuerte); }
.h-portada .h-entrada { max-width: 34rem; margin-bottom: 1.8rem; }
.h-insignia { display: inline-flex; align-items: center; gap: .5rem; padding: .4rem .9rem .4rem .5rem; border-radius: 999px; background: #fff; border: 1px solid #f5d9a8; font-size: .85rem; font-weight: 600; color: var(--h-acento-fuerte); }
.h-insignia b { background: var(--h-acento-solido); color: var(--h-texto); border-radius: 999px; padding: .15rem .55rem; font-size: .75rem; }
.h-portada__imagen img { width: 100%; filter: drop-shadow(0 30px 40px rgba(68, 40, 10, .12)); }
.h-portada .h-nota { margin-top: 1.1rem; display: flex; align-items: center; gap: .45rem; }
@media (min-width: 960px) {
	.h-portada .h-contenedor { grid-template-columns: 1fr 1.25fr; }
	.h-portada__imagen { margin-right: -6vw; }
}

/* ---------- Tarjetas de beneficios ---------- */
.h-tarjetas { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.h-tarjeta { background: #fff; border: 1px solid var(--h-borde); border-radius: var(--h-radio); padding: 1.6rem; box-shadow: var(--h-sombra); }
.h-tarjeta h3 { font-size: 1.3rem; margin: 1rem 0 .5rem; }
.h-tarjeta p { margin: 0; color: var(--wp--preset--color--texto-cuerpo); }
.h-tarjeta__icono { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; background: var(--wp--preset--color--acento-suave); color: var(--h-acento-fuerte); }

/* ---------- Filas de funciones ---------- */
.h-funcion { display: grid; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; padding-block: clamp(1.5rem, 4vw, 3rem); }
.h-funcion__imagen img { border-radius: var(--h-radio); box-shadow: var(--h-sombra); width: 100%; }
.h-funcion h3 { font-size: var(--wp--preset--font-size--titulo); margin: .6rem 0 1rem; }
.h-lista { list-style: none; margin: 1.3rem 0 0; padding: 0; display: grid; gap: .75rem; }
.h-lista li { display: flex; gap: .7rem; align-items: flex-start; }
.h-lista li .h-icono { margin-top: .2rem; color: var(--h-acento); }
@media (min-width: 900px) {
	.h-funcion { grid-template-columns: 1.1fr 1fr; }
	.h-funcion--invertida .h-funcion__imagen { order: 2; }
}

/* ---------- Grilla de funciones menores ---------- */
.h-grilla { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.h-mini { display: flex; gap: .9rem; align-items: flex-start; padding: 1.2rem; border-radius: 18px; background: #fff; border: 1px solid var(--h-borde); }
.h-mini .h-tarjeta__icono { width: 44px; height: 44px; border-radius: 13px; }
.h-mini h3 { font-size: 1.05rem; margin: 0 0 .25rem; font-family: var(--wp--preset--font-family--texto); font-weight: 600; letter-spacing: 0; }
.h-mini p { margin: 0; font-size: .95rem; color: var(--h-suave); }
.h-pro { display: inline-block; margin-left: .35rem; font-size: .68rem; font-weight: 700; padding: .1rem .45rem; border-radius: 999px; background: var(--h-acento-solido); color: var(--h-texto); vertical-align: middle; letter-spacing: .04em; }

/* ---------- Para quién ---------- */
.h-oficios { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.h-oficio { border-radius: var(--h-radio); padding: 1.6rem; background: #fff; border: 1px solid var(--h-borde); }
.h-oficio .h-tarjeta__icono { background: var(--c-suave); color: var(--c); }
.h-oficio h3 { font-size: 1.35rem; margin: 1rem 0 .4rem; }
.h-oficio p { margin: 0; color: var(--h-suave); }

/* ---------- Banda oscura (seguridad) ---------- */
.h-banda-oscura { background: radial-gradient(circle at 15% 20%, #2a1d0c 0, var(--wp--preset--color--noche) 55%); color: #d6d3d1; }
.h-banda-oscura h2, .h-banda-oscura h3 { color: #fafaf9; }
.h-banda-oscura .h-ceja { color: #fbbf24; }
.h-banda-oscura .h-funcion__imagen img { box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .8); border-radius: 0; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .5)); }
.h-banda-oscura .h-lista li .h-icono { color: #fbbf24; }
.h-banda-oscura a { color: #fbbf24; }

/* ---------- Planes ---------- */
.h-planes { display: grid; gap: 1.2rem; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); max-width: 880px; margin-inline: auto; }
.h-plan { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--h-borde); border-radius: 26px; padding: 2rem; box-shadow: var(--h-sombra); }
.h-plan--pro { border: 2px solid var(--h-acento-solido); background: linear-gradient(180deg, #fffaf0 0, #fff 40%); }
.h-plan__nombre { font-family: var(--wp--preset--font-family--titulos); font-size: 1.6rem; font-weight: 600; color: var(--h-texto); display: flex; align-items: center; gap: .6rem; }
.h-plan__precio { font-family: var(--wp--preset--font-family--titulos); font-size: 2.6rem; font-weight: 600; color: var(--h-texto); margin: .6rem 0 .2rem; line-height: 1.1; }
.h-plan__periodo { font-family: var(--wp--preset--font-family--texto); font-size: 1rem; font-weight: 500; color: var(--h-suave); }
.h-plan__otros { font-size: .9rem; color: var(--h-suave); margin: 0 0 .4rem; }
.h-plan__fundador { font-size: .92rem; font-weight: 600; color: var(--h-acento-fuerte); background: #fff4dc; border-radius: 14px; padding: .7rem .9rem; margin: 0 0 1rem; }
.h-plan .h-lista { margin-bottom: 1.6rem; }
.h-plan .h-boton { margin-top: auto; }
.h-tabla-planes { width: 100%; max-width: 880px; margin: var(--wp--preset--spacing--50) auto 0; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--h-borde); border-radius: var(--h-radio); overflow: hidden; font-size: .95rem; }
.h-tabla-planes th, .h-tabla-planes td { padding: .9rem 1rem; text-align: left; border-bottom: 1px solid var(--h-borde); }
.h-tabla-planes tr:last-child td { border-bottom: 0; }
.h-tabla-planes thead th { background: var(--wp--preset--color--crema); font-weight: 700; color: var(--h-texto); }
.h-tabla-planes td + td, .h-tabla-planes th + th { text-align: center; width: 26%; }
.h-tabla-planes td:last-child { font-weight: 600; color: var(--h-acento-fuerte); }

/* ---------- Preguntas frecuentes ---------- */
.h-preguntas { max-width: 800px; margin-inline: auto; display: grid; gap: .7rem; }
.h-pregunta { background: #fff; border: 1px solid var(--h-borde); border-radius: 18px; }
.h-pregunta summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.15rem 1.3rem; font-weight: 600; color: var(--h-texto); font-size: 1.05rem; }
.h-pregunta summary::-webkit-details-marker { display: none; }
.h-pregunta summary::after { content: "+"; flex: none; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 999px; background: var(--wp--preset--color--acento-suave); color: var(--h-acento-fuerte); font-size: 1.3rem; font-weight: 500; transition: transform .2s; }
.h-pregunta[open] summary::after { transform: rotate(45deg); }
.h-pregunta p { margin: 0; padding: 0 1.3rem 1.25rem; color: var(--wp--preset--color--texto-cuerpo); }

/* ---------- Llamado final ---------- */
.h-llamado { border-radius: 30px; padding: clamp(2rem, 6vw, 4rem); text-align: center; background: radial-gradient(circle at 20% 0, #fcd34d 0, var(--h-acento-solido) 45%, #d97706 100%); color: var(--h-texto); box-shadow: 0 30px 60px -30px rgba(180, 83, 9, .6); }
.h-llamado h2 { margin: 0 0 .8rem; }
.h-llamado p { max-width: 36rem; margin: 0 auto 1.6rem; color: #292524; font-size: 1.1rem; }
.h-llamado .h-botones { justify-content: center; }
.h-llamado .h-boton--secundario { background: rgba(255, 255, 255, .55); border-color: transparent; }

/* ---------- Cabecera de página interna ---------- */
.h-cabecera-pagina { padding-block: clamp(2.5rem, 7vw, 5rem) clamp(1.5rem, 4vw, 2.5rem); background: radial-gradient(circle at 80% 0, #fde9c4 0, var(--wp--preset--color--fondo) 60%); text-align: center; }
.h-cabecera-pagina h1 { font-size: var(--wp--preset--font-size--titulo); margin: .6rem 0 .9rem; }
.h-cabecera-pagina .h-entrada { max-width: 40rem; margin: 0 auto; }
.h-migas { font-size: .85rem; color: var(--h-suave); }
.h-migas a { color: var(--h-suave) !important; }

/* ---------- Soporte ---------- */
.h-contacto { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); max-width: 880px; margin-inline: auto; }
.h-contacto a.h-tarjeta { text-decoration: none !important; display: block; transition: transform .15s, box-shadow .15s; }
.h-contacto a.h-tarjeta:hover { transform: translateY(-2px); }
.h-contacto .h-tarjeta strong { display: block; color: var(--h-acento-fuerte); margin-top: .6rem; word-break: break-word; }

/* ---------- Páginas legales ---------- */
.h-legal { max-width: 760px; margin-inline: auto; padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60); }
.h-legal h2 { font-size: 1.55rem; margin: 2.4rem 0 .8rem; }
.h-legal h3 { font-size: 1.2rem; margin: 1.6rem 0 .6rem; }
.h-legal ul, .h-legal ol { padding-left: 1.3rem; }
.h-legal li { margin-bottom: .35rem; }
.h-legal table { width: 100%; border-collapse: collapse; font-size: .92rem; margin: 1rem 0; display: block; overflow-x: auto; }
.h-legal th, .h-legal td { border: 1px solid var(--h-borde); padding: .6rem .7rem; text-align: left; vertical-align: top; }
.h-legal th { background: var(--wp--preset--color--crema); }
.h-legal .h-vigencia { color: var(--h-suave); font-style: italic; }

/* ---------- Pie de página ---------- */
.h-pie { background: var(--wp--preset--color--noche); color: #a8a29e; padding-block: var(--wp--preset--spacing--60) 2rem; font-size: .95rem; }
.h-pie a { color: #d6d3d1 !important; text-decoration: none !important; }
.h-pie a:hover { color: #fbbf24 !important; }
.h-pie__grilla { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.h-pie .h-logo { color: #fafaf9 !important; }
.h-pie h2 { font-family: var(--wp--preset--font-family--texto); font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: #78716c; margin: 0 0 1rem; font-weight: 700; }
.h-pie ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.h-pie__marca p { margin: 1rem 0 0; max-width: 18rem; }
.h-pie__base { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid #292524; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; justify-content: space-between; font-size: .85rem; }

/* ---------- 404 ---------- */
.h-404 { text-align: center; padding-block: var(--wp--preset--spacing--70); }
.h-404 .h-numero { font-family: var(--wp--preset--font-family--titulos); font-size: clamp(5rem, 18vw, 9rem); line-height: 1; color: var(--h-acento-solido); }

/* ---------- Animación de entrada ---------- */
@media (prefers-reduced-motion: no-preference) {
	.js .h-aparece { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s cubic-bezier(.2, .8, .2, 1); }
	.js .h-aparece.h-visible { opacity: 1; transform: none; }
}

/* ---------- Ajustes de la estructura de WordPress ---------- */
/* WordPress envuelve el encabezado: el contenedor es el que queda fijo. */
.h-encabezado-fijo { position: sticky; top: 0; z-index: 50; }
.admin-bar .h-encabezado-fijo { top: 32px; }
@media (max-width: 782px) { .admin-bar .h-encabezado-fijo { top: 46px; } }
.h-encabezado { position: static; }
/* Sin espacios entre encabezado, contenido y pie. */
.wp-site-blocks > * + * { margin-block-start: 0; }
main#contenido > * { margin-block: 0; }

/* ---------- Ajustes finos de adaptación ---------- */
/* Tablets: tres tarjetas en fila en vez de 2 + 1. */
.h-tarjetas, .h-oficios { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
/* Celular: botones a lo ancho, más fáciles de tocar y alineados. */
@media (max-width: 560px) {
	.h-portada .h-botones .h-boton, .h-llamado .h-botones .h-boton { flex: 1 1 100%; }
	.h-tabla-planes { font-size: .88rem; }
	.h-tabla-planes th, .h-tabla-planes td { padding: .75rem .6rem; }
	.h-plan { padding: 1.6rem; }
}
/* El botón de contacto se oculta en el encabezado del celular, pero sí va dentro del menú. */
.h-encabezado .h-menu__panel .h-boton { display: flex; margin-top: .25rem; }
/* El relleno cuenta dentro del ancho en todos los elementos del tema
   (sin esto, el botón del menú del celular se salía del panel). */
[class^="h-"], [class*=" h-"], [class^="h-"] *, [class*=" h-"] * { box-sizing: border-box; }
/* En celulares (≤600 px) la barra de administración de WordPress no es
   fija: se va al bajar. El encabezado debe pegarse arriba del todo. */
@media (max-width: 600px) { .admin-bar .h-encabezado-fijo { top: 0; } }
/* Fondo casi opaco: el efecto de vidrio dejaba ver el texto de atrás. */
.h-encabezado { background: rgba(250, 250, 249, .97); }

/* Tarjetas con borde difuminado del degradado ámbar (el mismo del llamado
   final). La tarjeta se dibuja con ::after (blanco) y el resplandor con
   ::before, detrás, para que el degradado asome solo por los bordes. */
.h-tarjeta, .h-oficio, .h-mini { position: relative; isolation: isolate; border-color: rgba(245, 158, 11, .3); }
.h-tarjeta::before, .h-oficio::before, .h-mini::before {
	content: ""; position: absolute; inset: -4px; z-index: -2; border-radius: inherit; pointer-events: none;
	background: linear-gradient(135deg, #fcd34d 0%, #f59e0b 55%, #d97706 100%);
	filter: blur(10px); opacity: .55; transition: opacity .2s ease, filter .2s ease;
}
.h-tarjeta::after, .h-oficio::after, .h-mini::after {
	content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: #fff; pointer-events: none;
}
.h-tarjeta:hover::before, .h-oficio:hover::before, .h-mini:hover::before { opacity: .78; filter: blur(12px); }
@media (prefers-reduced-motion: reduce) {
	.h-tarjeta::before, .h-oficio::before, .h-mini::before { transition: none; }
}

/* Quién está detrás de Hornea (Koltor Group) */
.h-koltor { display: grid; gap: 2rem; align-items: center; grid-template-columns: 1fr; max-width: 920px; margin-inline: auto; padding: clamp(1.6rem, 4vw, 2.6rem); }
.h-koltor__logo { display: flex; justify-content: center; }
.h-koltor__logo img { width: min(100%, 320px); height: auto; }
.h-koltor h2 { margin: .2rem 0 .6rem; font-size: clamp(1.5rem, 3.4vw, 2rem); }
.h-koltor p { margin: 0 0 .7rem; color: var(--wp--preset--color--texto-cuerpo); }
.h-koltor__datos { display: flex; flex-wrap: wrap; gap: .5rem .9rem; margin: 1rem 0 0; padding: 0; list-style: none; font-size: .92rem; color: var(--h-suave); }
.h-koltor__datos li { background: #fffbeb; border: 1px solid rgba(245, 158, 11, .3); border-radius: 999px; padding: .25rem .8rem; }
@media (min-width: 800px) { .h-koltor { grid-template-columns: 300px 1fr; gap: 3rem; } }

/* Marca del propietario en el pie */
.h-pie__koltor { display: flex; align-items: center; gap: .7rem; margin-top: 1.1rem; font-size: .88rem; color: #a8a29e; }
.h-pie__koltor img { width: 38px; height: auto; flex-shrink: 0; }
.h-pie__koltor a { color: #fff; font-weight: 600; text-decoration: none; }
.h-pie__koltor a:hover { text-decoration: underline; }

/* Carrusel de pantallas de la app */
.h-carrusel { position: relative; }
.h-carrusel__pista { display: flex; gap: 1.1rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 1rem; padding: .4rem .2rem 1.4rem; scrollbar-width: none; -webkit-overflow-scrolling: touch; border-radius: 12px; }
.h-carrusel__pista::-webkit-scrollbar { display: none; }
.h-carrusel__pista:focus-visible { outline: 2px solid var(--h-acento, #f59e0b); outline-offset: 4px; }
.h-carrusel__item { flex: 0 0 min(72%, 280px); margin: 0; scroll-snap-align: center; text-align: center; }
.h-carrusel__item img { width: 100%; height: auto; display: block; }
.h-carrusel__item figcaption { margin-top: .6rem; display: flex; flex-direction: column; gap: .25rem; padding-inline: .3rem; }
.h-carrusel__item figcaption strong { font-family: var(--wp--preset--font-family--titulo, inherit); font-size: 1.1rem; }
.h-carrusel__item figcaption span { color: var(--h-suave); font-size: .95rem; line-height: 1.5; }
.h-carrusel__flecha { position: absolute; top: 38%; z-index: 2; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(245, 158, 11, .35); background: #fff; color: var(--h-texto); display: none; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 8px 22px -8px rgba(68, 40, 10, .35); }
.h-carrusel__flecha--prev { left: -12px; transform: rotate(180deg); }
.h-carrusel__flecha--next { right: -12px; }
.h-carrusel__flecha:hover { background: #fffbeb; }
@media (hover: hover) and (pointer: fine) { .h-carrusel__flecha:not([hidden]) { display: inline-flex; } }
@media (min-width: 1000px) { .h-carrusel__item { flex-basis: calc((100% - 3.3rem) / 4); } .h-carrusel__pista { justify-content: center; } }

/* Insignia oficial de Google Play (cuando se agrega el archivo) */
.h-play-insignia { display: inline-flex; line-height: 0; }
.h-play-insignia img { height: 56px; width: auto; }

/* Ícono de Google Play dentro de los botones */
.h-play-icono { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; background: #fff; flex-shrink: 0; box-shadow: 0 1px 2px rgba(28, 25, 23, .15); }
.h-play-icono img { width: 18px; height: 18px; display: block; }

/* Distintivo "Próximamente en Google Play" (mientras no hay enlace) */
.h-play-proximo { display: inline-flex; align-items: center; gap: .7rem; margin: 1.1rem 0 .2rem; padding: .55rem 1.1rem .55rem .7rem; border-radius: 14px; background: #1c1917; color: #fff; line-height: 1.15; box-shadow: 0 10px 24px -12px rgba(28, 25, 23, .6); }
.h-play-proximo > span:last-child { display: flex; flex-direction: column; text-align: left; }
.h-play-proximo small { font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; color: #d6d3d1; }
.h-play-proximo strong { font-size: 1.15rem; font-weight: 700; }
.h-llamado__play { display: flex; justify-content: center; margin: -.4rem 0 1.4rem; }
.h-llamado .h-play-proximo { margin: 0; }

/* Ayuda: guías en video */
.h-guias { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); gap: 2rem 1.6rem; max-width: 760px; margin-inline: auto; }
.h-guia { background: #fff; border: 1px solid var(--h-borde); border-radius: var(--h-radio); padding: 1.4rem 1.4rem 1.2rem; box-shadow: var(--h-sombra); display: flex; flex-direction: column; gap: .5rem; }
.h-guia video { width: 100%; max-width: 270px; aspect-ratio: 1 / 2; height: auto; border-radius: 22px; background: #1c1917; display: block; margin: 0 auto .6rem; }
.h-guia h3 { font-size: 1.2rem; margin: .2rem 0 0; }
.h-guia__resumen { margin: 0; }
.h-guia__duracion { display: inline-block; margin-left: .35rem; font-size: .85rem; color: var(--h-acento); font-weight: 600; white-space: nowrap; }
.h-guia__pasos { margin-top: .6rem; border-top: 1px solid var(--h-borde); padding-top: .7rem; }
.h-guia__pasos summary { cursor: pointer; font-weight: 600; }
.h-guia__pasos ol, .h-guia__texto ol { margin: .7rem 0 0; padding-left: 1.3rem; display: grid; gap: .5rem; }
.h-guia__texto { padding: 0 1.3rem 1.2rem; }
.h-guia__texto p { margin-top: 0; }