/* ==========================================================================
   Mamá Yoguini — propuesta B (octubre 2026)

   Sistema visual nuevo, cargado sobre main.css y v2.css. Ideas de partida:

   1. Lienzo arena y paneles muy redondeados que se apilan, con una crucecita
      "+" en las esquinas como marca de retícula. TODO el contenido de TODAS
      las páginas va dentro de un panel del mismo ancho (--ancho-panel): la
      cabecera, cada sección, los bloques de color y el pie. Regla de las
      plantillas: <section class="section"><div class="container">.
   2. Una sola familia para los titulares, Red Hat Display (grotesca, peso
      medio, muy apretada). Lo que se quiere destacar va en el verde de la
      marca, no en otra tipografía.
   3. Botones píldora en tinta oscura con la flecha dentro de un círculo.
   4. Pasteles por etapa: salvia = embarazo, melocotón = posparto, lila = mujer
      y online, rosa = encuentros. Los mismos en el horario, las tarjetas y la
      ficha de cada clase.
   ========================================================================== */

:root {
	--tinta: #2B2533;
	--tinta-suave: #655B6D;
	/* Tres tonos con distancia suficiente para que cada caja se distinga de su fondo:
	   lienzo (fondo del móvil) > arena (paneles y franjas alternas, cajas sobre blanco) > blanco */
	--arena: #E4DACB;
	--arena-2: #F1EADF;
	--hueso: #F1EADF;
	--banda: #EEE6DA;
	--linea: rgba(43,37,51,.12);
	--borde-caja: rgba(43,37,51,.1);
	--p-salvia: #DCEBE1;
	--p-melocoton: #F6D3BC; /* más intenso que al principio: el tono claro casi no se distinguía de la franja arena */
	--p-lila: #EADDF4;
	--p-rosa: #F9E0E8;
	--ancho-panel: 1320px;
	--flecha-oscura: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2533' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
	--flecha-clara: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
	--flecha-diagonal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2533' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E");

	/* Los nombres antiguos apuntan a la paleta nueva, para que todo lo heredado cambie con ella */
	--color-cream: var(--arena);
	--color-cream-alt: var(--arena-2);
	--color-purple-dark: var(--tinta);
	--color-text: var(--tinta);
	--color-text-soft: var(--tinta-suave);
	--color-sage-pale: var(--p-salvia);
	--color-lilac-pale: var(--p-lila);
	--pres-fondo: var(--p-salvia);
	--onl-fondo: var(--p-lila);
	--font-heading: 'Red Hat Display', 'Plus Jakarta Sans', system-ui, sans-serif;
	--radius-sm: 14px;
	--radius-md: 22px;
	--radius-lg: 32px;
	--shadow-soft: 0 20px 44px -28px rgba(43,37,51,.28);
	--shadow-card: 0 20px 44px -28px rgba(43,37,51,.28);
	--container-w: 1180px;
}

body { background: var(--arena); color: var(--tinta); }
h1, h2, h3, h4 { font-weight: 500; letter-spacing: -.022em; line-height: 1.08; color: var(--tinta); }
h1 { font-size: clamp(2.2rem, 5vw, 3.7rem); }
h2 { font-size: clamp(1.75rem, 3.5vw, 2.75rem); }
h3 { font-size: 1.3rem; font-weight: 600; letter-spacing: -.012em; line-height: 1.2; }
h1 em, h2 em, h3 em, .acento { font-style: normal; color: var(--color-green-action); }
a { color: var(--tinta); }
a:hover { color: var(--color-green-action); }
.prose a, .ins-check a, .form-consent a { text-decoration: underline; text-underline-offset: 3px; }
.eyebrow { font-family: var(--font-body); font-size: .72rem; font-weight: 600; letter-spacing: .16em; color: var(--tinta-suave); margin-bottom: 1.1em; }
.eyebrow--light { color: rgba(255,255,255,.75); }
.section-header { max-width: 760px; margin-bottom: 44px; }
.section-header--grande { max-width: 940px; }
.section-header--grande h2 { font-size: clamp(1.85rem, 3.9vw, 3.1rem); }
.section-header p:not(.eyebrow):not(.modo) { font-size: 1.05rem; }

/* ==========================================================================
   Botones
   ========================================================================== */
.btn {
	font-family: var(--font-heading); font-weight: 600; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase;
	min-height: 52px; padding: 0 26px; border-radius: 999px; gap: 14px;
}
.btn:hover { transform: none; }
.btn--lg { min-height: 58px; padding: 0 30px; font-size: .84rem; }
.btn--small { min-height: 42px; padding: 0 20px; font-size: .74rem; }
.btn--primary, .btn--online { background: var(--tinta); color: #fff; padding-right: 7px; }
.btn--primary:hover, .btn--online:hover { background: #17131C; color: #fff; }
.btn--online { background: var(--color-purple); }
.btn--online:hover { background: var(--color-purple-hover); }
/* La flecha: un círculo claro dentro de la píldora, que se desliza al pasar el ratón */
.btn--primary::after, .btn--online::after {
	content: ''; flex: none; width: 38px; height: 38px; border-radius: 50%;
	background: #fff var(--flecha-oscura) center / 16px no-repeat; transition: transform .2s ease;
}
.btn--lg.btn--primary::after, .btn--lg.btn--online::after { width: 44px; height: 44px; }
.btn--primary:hover::after, .btn--online:hover::after { transform: translateX(3px); }
.btn--small.btn--primary { padding-right: 20px; }
.btn--small.btn--primary::after { content: none; }
.btn--block { justify-content: space-between; padding-left: 26px; }
.btn--block.btn--small, .btn--block.btn--outline, .btn--block.btn--ghost { justify-content: center; }
.btn--ghost, .btn--outline, .btn--outline-light { background: transparent; color: var(--tinta); border-color: rgba(43,37,51,.3); }
.btn--ghost:hover, .btn--outline:hover, .btn--outline-light:hover { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.btn--sage { background: var(--p-salvia); color: var(--tinta); }
.btn--gold { background: var(--p-melocoton); color: var(--tinta); }
.btn--sage:hover, .btn--gold:hover { background: var(--tinta); color: #fff; }
.btn--disabled::after { opacity: .6; }
.tarifa--online .btn--primary { background: var(--color-purple); }

.link-arrow { font-family: var(--font-heading); font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--tinta); border-bottom: 1px solid rgba(43,37,51,.35); padding-bottom: 4px; }
.link-arrow:hover { color: var(--color-green-action); border-color: currentColor; }

.chip { font-family: var(--font-heading); font-size: .76rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; border-color: rgba(43,37,51,.3); color: var(--tinta); min-height: 40px; padding: 0 18px; }
.chip.is-active, .chip:hover { background: var(--tinta); border-color: var(--tinta); }
.chipito { display: inline-flex; align-items: center; padding: 5px 12px; border-radius: 999px; background: rgba(255,255,255,.9); color: var(--tinta); font-size: .72rem; font-weight: 600; line-height: 1.3; }
.chipito--color { background: var(--hueso); }
.chipito--prenatal { background: var(--p-salvia); }
.chipito--posparto { background: var(--p-melocoton); }
.chipito--mujer { background: var(--p-lila); }
.chipito--especial { background: var(--p-rosa); }
.modo { font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; padding: 6px 13px 6px 11px; }
.flecha { flex: none; width: 44px; height: 44px; border-radius: 50%; background: #fff var(--flecha-diagonal) center / 17px no-repeat; transition: transform .25s ease; }

/* ==========================================================================
   Paneles: todo el contenido va en tarjetas grandes del mismo ancho

   Tres formas de llegar al mismo panel, para que no quede ninguna página fuera:
     .section > .container        el patrón normal de las plantillas
     .container.section           páginas sencillas con un único bloque (blog,
                                  talleres, legales, 404)
     main > .container            cualquier bloque suelto que se cuele
   ========================================================================== */
.section { padding-top: 6px; padding-bottom: 6px; }
.section--alt, .section--white { background: none; }
.panel, .section > .container, .container.section, main > .container:not(.section) {
	position: relative; background: #fff; border-radius: var(--radius-lg);
	max-width: var(--ancho-panel); width: calc(100% - 24px); margin-left: auto; margin-right: auto;
	padding: clamp(44px, 6vw, 88px) clamp(20px, 5vw, 72px);
	box-shadow: 0 18px 38px -32px rgba(43,37,51,.5);
}
.container.section, main > .container:not(.section) { margin-top: 12px; margin-bottom: 12px; }
.panel::before, .panel::after, .section > .container::before, .section > .container::after,
.container.section::before, .container.section::after {
	content: '+'; position: absolute; top: 18px; font: 300 22px/1 var(--font-heading); color: #C9BFB2; pointer-events: none;
}
.panel::before, .section > .container::before, .container.section::before { left: 22px; }
.panel::after, .section > .container::after, .container.section::after { right: 22px; }
.section--alt > .container { background: var(--arena-2); }
.section--alt > .container::before, .section--alt > .container::after { color: #BDB1A1; }
/* Texto largo dentro de un panel: el panel mide lo de siempre, el texto va en una columna cómoda de leer */
.section > .container.section--narrow-inner, .container.section.section--narrow { max-width: var(--ancho-panel); }
.section > .container.section--narrow-inner > *, .container.section.section--narrow > * { max-width: 780px; margin-left: auto; margin-right: auto; }

/* Tarjetas dentro de un panel: un tono por debajo del panel que las contiene */
.card { background: var(--hueso); box-shadow: none; border: 1px solid var(--borde-caja); border-radius: var(--radius-md); }
.section--alt .card { background: #fff; }

/* Cabecera de página (título + entradilla), siempre igual y siempre dentro del primer panel */
.page-header-block { max-width: 820px; margin: 0 auto 40px; text-align: center; }
.page-header-block .prose, .page-header-block .page-lead { text-align: center; color: var(--tinta-suave); font-size: 1.05rem; max-width: 640px; margin-left: auto; margin-right: auto; }
.page-header-block .modo { margin-bottom: 16px; }
.page-title { font-size: clamp(2.2rem, 5vw, 3.7rem); }

/* ==========================================================================
   Cabecera: una píldora flotante
   ========================================================================== */
.site-header { background: transparent; border-bottom: 0; padding-top: 10px; }
.site-header__inner {
	max-width: var(--ancho-panel); width: calc(100% - 24px); background: #fff; border-radius: 999px;
	padding: 9px 10px 9px 26px; box-shadow: 0 14px 30px -22px rgba(43,37,51,.35);
}
.site-logo-img { max-height: 44px; }
.primary-menu { gap: 26px; }
.primary-menu a { font-family: var(--font-heading); font-size: .9rem; font-weight: 500; color: var(--tinta); }
.primary-menu a:hover { color: var(--color-green-action); }
.primary-menu .sub-menu { border-radius: 20px; padding: 10px; box-shadow: 0 24px 50px -24px rgba(43,37,51,.4); margin-top: 8px; }
.primary-menu .sub-menu a:hover { background: var(--hueso); }
.dropdown-arrow { border-color: var(--tinta); }
.nav-login { font-family: var(--font-heading); font-weight: 500; }
.nav-reserva { min-height: 46px; padding: 0 6px 0 20px; font-size: .76rem; }
.nav-reserva::after { width: 34px; height: 34px; }
.nav-toggle-btn__txt, .nav-toggle-btn__mas { display: none; }

@media (max-width: 1040px) {
	.site-header__inner { padding: 8px 8px 8px 20px; }
	.nav-toggle-btn {
		flex-direction: row; align-items: center; gap: 10px; width: auto; height: 44px; padding: 0 16px 0 18px;
		border-radius: 999px; background: var(--hueso);
	}
	.nav-toggle-btn__txt { display: block; font: 600 .76rem/1 var(--font-heading); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta); }
	.nav-toggle-btn__txt--cerrar { display: none; }
	.nav-toggle-btn__mas { display: block; position: relative; width: 14px; height: 14px; transition: transform .25s ease; }
	.nav-toggle-btn__mas::before, .nav-toggle-btn__mas::after { content: ''; position: absolute; left: 0; top: 6px; width: 14px; height: 2px; background: var(--tinta); border-radius: 2px; }
	.nav-toggle-btn__mas::after { transform: rotate(90deg); }
	.nav-toggle-checkbox:checked ~ .nav-toggle-btn .nav-toggle-btn__mas { transform: rotate(45deg); }
	.nav-toggle-checkbox:checked ~ .nav-toggle-btn .nav-toggle-btn__txt--abrir { display: none; }
	.nav-toggle-checkbox:checked ~ .nav-toggle-btn .nav-toggle-btn__txt--cerrar { display: block; }
	.nav-toggle-checkbox:checked ~ .nav-toggle-btn { background: #fff; }

	/* Panel del menú: lienzo arena y enlaces grandes */
	.primary-nav { background: var(--arena-2); padding: 96px 22px 28px; gap: 6px; }
	.primary-menu { gap: 0; }
	.primary-menu > li { border-bottom: 1px solid var(--linea); }
	.primary-menu a { color: var(--tinta); font-size: 1.75rem; font-weight: 500; letter-spacing: -.02em; min-height: 62px; }
	.primary-menu .sub-menu, .primary-menu li:hover > .sub-menu, .primary-menu li:focus-within > .sub-menu { border-left: 0; padding: 0 0 14px; margin: 0; border-radius: 0; }
	.primary-menu .sub-menu a { color: var(--tinta-suave); font-size: 1.05rem; letter-spacing: 0; min-height: 42px; }
	.primary-menu .sub-menu a:hover { color: var(--tinta); }
	.submenu-toggle::before { border-color: var(--tinta); }
	.nav-acciones { border-top: 0; margin-top: auto; padding-top: 22px; }
	.nav-reserva, .nav-reserva:hover { background: var(--tinta); color: #fff; min-height: 58px; font-size: .84rem; padding: 0 8px 0 26px; justify-content: space-between; }
	.nav-reserva::after { width: 42px; height: 42px; }
	.nav-login, .nav-login:hover { color: var(--tinta); }
}

/* ==========================================================================
   Portada
   ========================================================================== */
.hero3 { padding: 10px 0 6px; }
.hero3__panel {
	display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); column-gap: clamp(24px, 4vw, 64px);
	grid-template-areas: "etiqueta etiqueta" "lema visual" "texto visual"; align-items: start;
	padding-top: clamp(44px, 5vw, 64px); padding-bottom: clamp(36px, 5vw, 64px);
}
.hero3__grid { display: contents; }
.hero3__label { grid-area: etiqueta; margin: 0 0 clamp(14px, 2.4vw, 30px); }
.hero3__lema {
	grid-area: lema; margin: 0 0 clamp(24px, 3.4vw, 44px);
	font-family: var(--font-heading); font-weight: 500; text-transform: uppercase; letter-spacing: -.045em; line-height: .9;
	font-size: clamp(3.3rem, 8.3vw, 7.2rem); color: var(--tinta);
}
.hero3__lema span { display: block; white-space: nowrap; }
.hero3__lema .acento { color: var(--color-green-action); }
.hero3__texto { grid-area: texto; max-width: 560px; }
.hero3__titulo { font-size: clamp(1.25rem, 1.9vw, 1.6rem); font-weight: 600; letter-spacing: -.015em; line-height: 1.25; margin-bottom: .6em; }
.hero3__lead { color: var(--tinta-suave); font-size: 1.05rem; margin-bottom: 1.6em; }
.hero3 .hero__ctas { gap: 10px; margin: 0; }
.hero3__visual { grid-area: visual; align-self: start; display: flex; flex-direction: column; gap: 10px; }
/* Tres fotos en mosaico: una grande a la izquierda y dos cuadradas a la derecha */
.hero3__fotos { display: grid; grid-template-columns: 1.5fr 1fr; grid-template-rows: 1fr 1fr; gap: 10px; }
.hero3__fotos .foto { background: var(--p-salvia); min-height: 0; border-radius: 24px; }
.hero3__fotos .foto:nth-child(1) { grid-row: 1 / span 2; }
.hero3__fotos .foto:nth-child(2) { aspect-ratio: 1 / 1; background: var(--p-lila); }
.hero3__fotos .foto:nth-child(3) { aspect-ratio: 1 / 1; background: var(--p-melocoton); }
.hero3__fotos--1 { grid-template-columns: 1fr; grid-template-rows: auto; }
.hero3__fotos--1 .foto:nth-child(1) { grid-row: auto; aspect-ratio: 1 / 1.1; }
.hero3__fotos--2 .foto:nth-child(2) { grid-row: 1 / span 2; aspect-ratio: auto; }
.hero3 .plazas-ahora {
	position: static; width: auto; margin: 0; background: var(--hueso); box-shadow: none;
	border-radius: var(--radius-md); border: 1px solid var(--borde-caja); padding: 16px 18px 8px;
}
.plazas-ahora__titulo { font-family: var(--font-heading); letter-spacing: .1em; font-size: .72rem; color: var(--tinta); }
.plazas-ahora li + li { border-top-color: var(--linea); }
.plazas-ahora a strong { font-family: var(--font-heading); font-weight: 600; color: var(--tinta); }

/* Cinta que se desliza */
.cinta { display: flex; overflow: hidden; max-width: var(--ancho-panel); width: calc(100% - 24px); margin: 12px auto 0; background: var(--p-lila); border-radius: 999px; padding: 15px 0; }
.cinta__pista { display: flex; flex: none; list-style: none; margin: 0; padding: 0; animation: cinta 40s linear infinite; }
.cinta__pista li { position: relative; white-space: nowrap; padding: 0 34px; font: 600 .78rem/1.2 var(--font-heading); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta); }
.cinta__pista li::after { content: '+'; position: absolute; right: -5px; top: -2px; font-weight: 300; font-size: 1rem; color: var(--tinta-suave); }
@keyframes cinta { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) { .cinta__pista { animation: none; } }

/* Elige tu momento: tres tarjetas con la foto a sangre */
.etapas3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.etapa3 {
	position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between;
	min-height: clamp(440px, 44vw, 560px); padding: 18px; border-radius: 26px; background: var(--tinta); color: #fff; text-decoration: none;
}
.etapa3:hover { color: #fff; }
.etapa3__foto { position: absolute; inset: 0; z-index: -2; }
.etapa3__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.etapa3::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(43,37,51,.28) 0%, rgba(43,37,51,0) 28%, rgba(43,37,51,.72) 70%, rgba(43,37,51,.94) 100%); }
.etapa3:hover .etapa3__foto img { transform: scale(1.05); }
.etapa3:hover .flecha { transform: rotate(45deg); }
.etapa3__arriba { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.etapa3__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.etapa3__abajo { display: block; padding: 6px 6px 8px; }
.etapa3 h3 { color: #fff; font-size: clamp(1.7rem, 2.4vw, 2.1rem); font-weight: 500; letter-spacing: -.025em; margin: 12px 0 8px; }
.etapa3__texto { display: block; color: rgba(255,255,255,.9); font-size: .96rem; line-height: 1.55; max-width: 34ch; }
.etapa3__mas { display: inline-block; margin-top: 16px; font: 600 .76rem/1 var(--font-heading); letter-spacing: .08em; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,.6); padding-bottom: 5px; }

/* Dos formas de practicar */
.modos__grid { max-width: none; gap: 14px; }
.modo-card { border: 0; box-shadow: none; border-radius: 28px; padding: clamp(26px, 3.4vw, 44px); background: var(--p-salvia); }
.modo-card--online { background: var(--p-lila); }
.modo-card .modo { background: rgba(255,255,255,.75); }
.modo-card h3 { font-size: clamp(1.5rem, 2.2vw, 1.95rem); font-weight: 500; letter-spacing: -.025em; margin-bottom: .5em; }
.modo-card > p, .modo-card .lista-check { color: var(--tinta); }
.modo-card > p { opacity: .82; }
.lista-check li { padding: 10px 0 10px 30px; border-top: 1px solid var(--linea); }
.lista-check { gap: 0; }
.lista-check li::before { top: 1.15em; border-color: var(--tinta); }
.modo-card__precio { font-family: var(--font-heading); color: var(--tinta); margin-top: auto; padding-top: 22px; }
.modo-card__precio strong { font-family: var(--font-heading); font-weight: 500; font-size: 3rem; letter-spacing: -.04em; }
.modos__mas { background: var(--tinta); font-family: var(--font-heading); font-weight: 300; width: 52px; height: 52px; margin: 0 -33px; z-index: 2; border: 5px solid var(--arena-2); box-sizing: content-box; }
.modos__combo p { background: #fff; border-radius: 999px; }

/* Refugio */
.two-col__media { border-radius: 26px; }
.valores { gap: 14px; }
.valores li { border-radius: var(--radius-md); background: var(--p-salvia); padding: 26px; }
.valores li:nth-child(3n+2) { background: var(--p-melocoton); }
.valores li:nth-child(3n) { background: var(--p-lila); }
.valores strong { font-family: var(--font-heading); font-weight: 600; font-size: 1.15rem; letter-spacing: -.01em; }
.valores li > span:last-child { color: var(--tinta); opacity: .8; }

/* Talleres y blog */
.taller-card, .post-card { border-radius: 24px; border: 0; }
.taller-card__media, .post-card__media { border-radius: 24px 24px 0 0; }
.taller-card--abierto { border: 0; box-shadow: 0 0 0 2px var(--tinta); }
.badge { border-radius: 999px; font-family: var(--font-heading); letter-spacing: .06em; text-transform: uppercase; font-size: .68rem; padding: 6px 12px; background: #fff; color: var(--tinta); }
.estado-abiertas { background: var(--p-salvia); color: var(--tinta); }
.estado-proximamente { background: #fff; color: var(--tinta); }
.estado-completo, .estado-finalizado { background: var(--tinta); color: #fff; }
.card__title { font-weight: 600; letter-spacing: -.012em; }
.taller-card__meta { color: var(--tinta-suave); font-weight: 600; }
.taller-card__precio { font-family: var(--font-heading); font-size: 1.15rem; }
.post-card__category { background: var(--p-salvia); color: var(--tinta); }
.post-card__readmore { color: var(--tinta); }

/* Testimonios */
.testimonios-grid { gap: 14px; }
.testimonio-card { background: var(--p-salvia); border: 0; border-radius: 26px; padding: 30px 28px; }
.testimonio-card:nth-child(3n+2) { background: var(--p-lila); }
.testimonio-card:nth-child(3n) { background: var(--p-melocoton); }
.testimonio-card::before { content: '“'; display: block; font: 500 3.6rem/.7 var(--font-heading); color: var(--tinta); margin-bottom: 12px; height: 30px; }
.testimonio-card__texto, .testimonio-card blockquote p { font-family: var(--font-heading); font-style: normal; font-weight: 500; font-size: 1.08rem; line-height: 1.45; letter-spacing: -.01em; }
.testimonio-card__autor { font: 600 .76rem/1.3 var(--font-heading); letter-spacing: .08em; text-transform: uppercase; }
.testimonio-card__rol { color: var(--tinta); opacity: .7; }
.testimonio-card__estrellas { display: none; }
.testimonio-card:hover { transform: none; box-shadow: none; }

/* Comunidad: panel oscuro */
.comunidad { background: none; }
.comunidad > .container { background: var(--tinta); }
.comunidad > .container::before, .comunidad > .container::after { color: rgba(255,255,255,.35); }
.comunidad__title { font-size: clamp(1.9rem, 4vw, 3.2rem); }
.comunidad__highlight { font-style: normal; color: var(--p-melocoton); }
.comunidad__grid { max-width: 860px; gap: 12px; }
.comunidad__card { border-radius: 20px; border-color: rgba(255,255,255,.18); padding: 18px 20px; }
.comunidad__card-text strong { font-family: var(--font-heading); font-weight: 600; }

/* Llamada final */
.cta-final { padding-top: 6px; padding-bottom: 6px; }
.cta-final > .container.cta-final__inner { max-width: var(--ancho-panel); border-radius: var(--radius-lg); background: var(--color-green-action); padding: clamp(48px, 7vw, 104px) 24px; }
.cta-final__inner::before, .cta-final__inner::after { color: rgba(255,255,255,.4) !important; }
.cta-final__inner h2 { font-size: clamp(2rem, 4.6vw, 3.6rem); max-width: 16ch; margin-left: auto; margin-right: auto; }
.cta-final__inner .btn--primary::after { background-color: var(--tinta); background-image: var(--flecha-clara); }
.cta-final__inner .btn--primary { color: var(--tinta); }

/* Pie */
.site-footer { max-width: var(--ancho-panel); width: calc(100% - 24px); margin: 6px auto 12px; border-radius: var(--radius-lg); overflow: hidden; background: var(--tinta); }
.footer__inner { padding: 64px clamp(22px, 5vw, 72px) 48px; max-width: none; }
.footer__nav-col .footer__nav-title { font-family: var(--font-heading); color: var(--p-salvia); letter-spacing: .14em; font-size: .7rem; }
.footer__nav-col a, .footer__contact a { color: #fff; }
.footer__nav-col a:hover, .footer__contact a:hover { color: var(--p-salvia); }
.footer__bottom-inner { max-width: none; padding-left: clamp(22px, 5vw, 72px); padding-right: clamp(22px, 5vw, 72px); }
.whatsapp-float { box-shadow: 0 16px 30px -14px rgba(0,0,0,.45); }

/* ==========================================================================
   Tarifas
   ========================================================================== */
.tarifas { gap: 14px; }
.tarifa { border: 0; box-shadow: none; border-radius: 28px; padding: 30px 30px 26px; background: var(--p-salvia); }
.tarifas--varias .tarifa:nth-child(2) { background: var(--p-melocoton); }
.tarifa--online, .tarifas--varias .tarifa--online { background: var(--p-lila); border-top: 0; }
.tarifa--destacada { border: 0; }
.tarifa .modo { background: rgba(255,255,255,.75); }
.tarifa__titulo { font-size: 1.25rem; font-weight: 600; text-transform: uppercase; letter-spacing: .01em; }
.tarifa__precio { font-family: var(--font-heading); font-weight: 500; font-size: 3.4rem; letter-spacing: -.045em; margin: 10px 0 14px; }
.tarifa__precio span { font-family: var(--font-body); font-weight: 500; letter-spacing: 0; color: var(--tinta); opacity: .7; }
.tarifa__frecuencia, .tarifa__nota { color: var(--tinta); opacity: .75; }
.tarifa__lista li { border-bottom: 0; border-top: 1px solid var(--linea); padding: 10px 0 10px 28px; }
.tarifa__lista li::before { border-color: var(--tinta); top: 1.15em; }
.tarifa__promo { background: #fff; color: var(--tinta); border-radius: 12px; }
.tarifa__condicion { color: var(--tinta); }
.tarifa:hover { transform: none; }

/* ==========================================================================
   Horario
   ========================================================================== */
.horario-panel .section-header { margin-bottom: 22px; }
.horario-filters { margin: 0 0 30px; }
.horario-matriz { display: none; }
.horario-matriz__fila { display: grid; grid-template-columns: 64px repeat(var(--dias), minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.horario-matriz__dia { text-align: center; font: 600 .92rem/1 var(--font-heading); padding: 12px 0 14px; border-bottom: 2px solid var(--linea); }
.horario-matriz__hora { align-self: center; font: 500 .95rem/1 var(--font-heading); color: var(--tinta-suave); }
.horario-matriz__celda { min-height: 92px; border-radius: 16px; background: var(--hueso); display: flex; flex-direction: column; gap: 6px; }
.horario-matriz__celda:has(.horario-slot:not(.is-hidden)) { background: none; }
.horario-slot {
	border-radius: 16px; padding: 13px 14px; gap: 8px; font-family: var(--font-heading); text-align: left;
	background: var(--p-salvia); color: var(--tinta); border: 1px solid rgba(43,37,51,.05); transition: transform .15s ease, box-shadow .15s ease;
}
.horario-slot--posparto { background: var(--p-melocoton); color: var(--tinta); }
.horario-slot--mujer { background: var(--p-lila); color: var(--tinta); }
.horario-slot--especial { background: var(--p-rosa); color: var(--tinta); }
.horario-slot:hover, .horario-slot:focus-visible { transform: translateY(-2px); box-shadow: 0 14px 24px -16px rgba(43,37,51,.45); }
.horario-slot--completo { opacity: .6; }
.horario-slot__titulo { font-weight: 600; font-size: .9rem; line-height: 1.25; letter-spacing: -.01em; color: var(--tinta); }
.horario-slot__hora { font-weight: 600; color: var(--tinta); }
.horario-slot__plazas-text { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-body); font-size: .76rem; font-weight: 500; color: var(--tinta); opacity: .75; margin: 0; }
.horario-slot__plazas-text::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #3FA36B; flex: none; }
.horario-slot--completo .horario-slot__plazas-text::before { background: var(--tinta-suave); }
.horario-matriz .horario-slot { flex: 1; min-height: 92px; justify-content: space-between; }
.horario-matriz .horario-slot__hora { display: none; }
.horario-day { background: none; box-shadow: none; padding: 0; min-height: 0; }
.horario-day__title { font-weight: 600; }
.horario-leyenda { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; margin: 26px 0 0; padding: 0; font-size: .82rem; color: var(--tinta-suave); }
.horario-leyenda__item { display: inline-flex; align-items: center; gap: 8px; }
.horario-leyenda__item::before { content: ''; width: 14px; height: 14px; border-radius: 5px; background: var(--p-salvia); border: 1px solid rgba(43,37,51,.08); }
.horario-leyenda__item--posparto::before { background: var(--p-melocoton); }
.horario-leyenda__item--mujer::before { background: var(--p-lila); }
.horario-leyenda__item--especial::before { background: var(--p-rosa); }
.horario-pagina .section-footer-cta { margin-top: 26px; }
@media (min-width: 900px) {
	.horario-matriz { display: block; }
	.horario-pagina .horario-grid { display: none; }
}

/* Ficha de una clase */
.horario-detail { background: rgba(43,37,51,.5); }
.horario-detail__card { background: #fff !important; border: 0; border-radius: 28px; padding: 30px 28px 26px; max-width: 440px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.5); }
.horario-detail__close { top: 16px; right: 16px; width: 40px; height: 40px; border-radius: 50%; background: var(--hueso); color: var(--tinta); font-size: .9rem; }
.horario-detail__chips { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 48px 18px 0; }
.horario-detail__card h3 { font-size: 1.8rem; font-weight: 500; letter-spacing: -.025em; margin-bottom: 14px; }
.horario-detail__datos { margin: 0 0 22px; }
.horario-detail__datos div { display: flex; gap: 16px; padding: 13px 0; border-top: 1px solid var(--linea); }
.horario-detail__datos div[hidden] { display: none; }
.horario-detail__datos dt { flex: none; width: 66px; font: 600 .68rem/1.9 var(--font-heading); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-suave); }
.horario-detail__datos dd { margin: 0; font-size: .96rem; }

.horario-lista ul { box-shadow: none; border: 1px solid var(--linea); border-radius: 22px; }
.horario-lista__hueco + .horario-lista__hueco { border-top-color: var(--linea); }
.horario-lista__cuando strong { font-family: var(--font-heading); font-weight: 600; }
.horario-lista__reservar { font-family: var(--font-heading); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; border-color: rgba(43,37,51,.3); color: var(--tinta); }
.horario-lista__reservar:hover { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.horario-lista__titulo { font-weight: 600; }

.clases-tipo, .faq-item { background: var(--hueso); box-shadow: none; border-radius: 20px; }
.section--alt .faq-item, .section--alt .clases-tipo { background: #fff; }
.clases-tipo summary, .faq-item summary { font-family: var(--font-heading); font-weight: 600; font-size: 1.05rem; letter-spacing: -.01em; color: var(--tinta); }
.faq-item summary::after { color: var(--tinta); font-weight: 300; font-size: 1.6rem; line-height: 1; }
.clases-tipo summary::after { border-color: var(--tinta); }

/* ==========================================================================
   Páginas de clase, online, sobre mí, contacto
   ========================================================================== */
.clase-hero { padding-top: 6px; }
/* Cabecera de las páginas de clase y de yoga online: misma rejilla y mismo marco de foto */
.clase-hero__grid, .clase-hero .two-col { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.clase-hero__foto, .clase-hero .two-col__media { aspect-ratio: 4 / 4.4; border-radius: 26px; max-width: 460px; margin-left: auto; width: 100%; order: 0; }
.clase-hero h1 { font-size: clamp(2.4rem, 5.4vw, 4.2rem); letter-spacing: -.035em; margin-bottom: .4em; }
.clase-hero__lead, .clase-hero .two-col__text .prose > p:first-child { font-family: var(--font-heading); font-weight: 500; font-size: clamp(1.15rem, 1.7vw, 1.4rem); line-height: 1.4; letter-spacing: -.012em; color: var(--tinta); max-width: 560px; margin-bottom: 1.4em; }
.clase-hero .two-col__text .prose { color: var(--tinta-suave); max-width: 560px; margin-bottom: 1.4em; }
.clase-hero .hero__ctas { margin: 0; gap: 10px; }
.quien-card { box-shadow: none; background: var(--hueso); border-radius: 24px; text-align: left; padding: 28px; }
.section--alt .quien-card { background: #fff; }
.quien-card__icon { width: 56px; height: 56px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; margin-bottom: 18px; }
.section--alt .quien-card__icon { background: var(--arena-2); }
.quien-card h3 { font-size: 1.15rem; font-weight: 600; }
.quien-card:hover { transform: none; box-shadow: none; }
.pasos-grid__num { background: none; color: var(--tinta); border: 1px solid rgba(43,37,51,.3); font-family: var(--font-heading); font-weight: 500; width: 52px; height: 52px; }
.etapas-online__item h3, .etapas-online__item h3 a { color: var(--tinta); }
.etapas-online__item { padding: 24px; background: var(--hueso); border-radius: 22px; }
.section--alt .etapas-online__item { background: #fff; }
.carrusel { border-radius: 24px; }
.carrusel__btn { background: #fff; color: var(--tinta); }
.carrusel__btn:hover { background: var(--tinta); color: #fff; }
.pricing-block { border-radius: 28px; }
.pricing-block__price { font-family: var(--font-heading); font-weight: 500; letter-spacing: -.04em; }
.hero-highlights li { background: var(--hueso); border-radius: 999px; padding: 8px 14px; }

.sobre-mi-hero h1 { font-style: normal; }
.sobre-mi-card h2 { font-style: normal; font-weight: 600; font-size: 1.45rem; color: var(--tinta); }
.sobre-mi-card blockquote { background: var(--p-lila); font-family: var(--font-heading); font-style: normal; font-weight: 500; font-size: 1.15rem; }
.sobre-mi-outro h2 { font-style: normal; }

.contacto-form label, .ins-label, .ins-grupo > legend { font-family: var(--font-heading); font-weight: 600; color: var(--tinta); }
.contacto-form input, .contacto-form textarea,
.ins input[type="text"], .ins input[type="email"], .ins input[type="tel"], .ins input[type="date"], .ins select, .ins textarea {
	background: var(--hueso); border: 1.5px solid transparent; border-radius: 14px;
}
.contacto-form input:focus, .contacto-form textarea:focus, .ins input:focus, .ins select:focus, .ins textarea:focus { border-color: var(--tinta); background: #fff; }
.contacto-map__activar { border-radius: 20px; }
.form-success { background: var(--p-salvia); border-radius: 16px; }

/* Blog */

/* ==========================================================================
   Inscripción
   ========================================================================== */
.ins__titulo { font-family: var(--font-heading); font-weight: 500; font-size: 1.75rem; letter-spacing: -.025em; }
.ins__progreso-texto { font-family: var(--font-heading); letter-spacing: .12em; font-size: .7rem; color: var(--tinta-suave); }
.ins__progreso-barra { background: var(--arena-2); height: 4px; }
.ins__progreso-barra span { background: var(--tinta); }
.ins-op { border: 1.5px solid var(--linea); border-radius: 16px; background: #fff; }
.ins-op:hover { border-color: rgba(43,37,51,.4); }
.ins-op:has(input:checked) { border-color: var(--tinta); background: var(--p-salvia); }
.ins-op--posparto:has(input:checked) { background: var(--p-melocoton); }
.ins-op--mujer:has(input:checked) { background: var(--p-lila); }
.ins-op input, .ins-check input { accent-color: var(--tinta); }
.ins-op__texto strong { font-family: var(--font-heading); font-weight: 600; }
.ins-explica { background: var(--hueso); border-radius: 16px; }
.ins__rama-titulo { font-family: var(--font-heading); color: var(--tinta); }
.ins-precio { border-radius: 14px; }
.ins-datos li strong { font-family: var(--font-heading); }

/* ==========================================================================
   Landings
   ========================================================================== */
.landing-page { background: var(--arena); }
.landing-header { padding: 22px 24px 12px; }
.landing-destacado { font-style: normal; color: var(--color-green-action); }
.landing-hero-texto h1 { font-size: clamp(2.3rem, 5vw, 4rem); letter-spacing: -.035em; }
.landing-precio-sec { background: none; }
.landing-precio-sec > .container { background: var(--p-lila); }
.landing-precio-card { background: #fff !important; border: 0; border-radius: 28px; }
.landing-precio-nombre { font-style: normal; }
.landing-precio-cifra { font-family: var(--font-heading); font-weight: 500; letter-spacing: -.04em; font-size: 2.8rem; }
.landing-oferta { background: var(--hueso); }
.landing-frase-final p { font-family: var(--font-heading); font-style: normal; font-weight: 500; letter-spacing: -.02em; font-size: clamp(1.5rem, 2.8vw, 2.2rem); line-height: 1.2; color: var(--tinta); }
.landing-fixedbar { background: var(--tinta); }
.landing-fixedbar .btn { background: #fff; color: var(--tinta); padding-right: 7px; }
.landing-fixedbar .btn:hover { background: var(--p-salvia); color: var(--tinta); }
.landing-fixedbar .btn::after { background-color: var(--tinta); background-image: var(--flecha-clara); width: 32px; height: 32px; }

/* ==========================================================================
   Móvil
   ========================================================================== */
@media (max-width: 960px) {
	.hero3__panel { grid-template-columns: 1fr; grid-template-areas: "etiqueta" "lema" "texto" "visual"; }
	.hero3__lema { font-size: clamp(3.2rem, 15.2vw, 6.4rem); }
	.hero3__visual { margin-top: 34px; }
	.modos__mas { margin: -31px auto; border-color: var(--arena-2); }
	.clase-hero .two-col__media { max-width: 360px; margin: 0 auto; }
}

@media (max-width: 760px) {
	.panel, .section > .container, .container.section, main > .container:not(.section) { width: calc(100% - 16px); border-radius: 26px; padding: 46px 18px 40px; }
	.container.section, main > .container:not(.section) { margin-top: 8px; margin-bottom: 8px; }
	.panel::before, .panel::after, .section > .container::before, .section > .container::after, .container.section::before, .container.section::after { top: 13px; font-size: 19px; }
	.panel::before, .section > .container::before, .container.section::before { left: 16px; }
	.panel::after, .section > .container::after, .container.section::after { right: 16px; }
	.section { padding-top: 4px; padding-bottom: 4px; }
	.section-header { margin-bottom: 30px; }
	.site-header { padding-top: 8px; }
	.site-header__inner, .cinta, .site-footer { width: calc(100% - 16px); }
	.hero3 { padding-top: 8px; }
	.hero3__panel { padding-top: 46px; padding-bottom: 28px; }
	.hero3 .hero__ctas { flex-direction: column; align-items: stretch; }
	.hero3 .hero__ctas .btn--primary { justify-content: space-between; }
	.cinta { padding: 13px 0; margin-top: 8px; }
	.etapas3 { grid-template-columns: 1fr; gap: 10px; }
	.etapa3 { min-height: 430px; border-radius: 24px; padding: 14px; }
	.modo-card { border-radius: 24px; }
	.cta-final > .container.cta-final__inner { width: calc(100% - 16px); border-radius: 26px; padding: 56px 20px; }
	.cta-final__ctas .btn--primary { justify-content: space-between; }
	.site-footer { border-radius: 26px; margin-bottom: 8px; }
	.footer__inner { padding-top: 48px; }
	.horario-filters { margin: 0 -18px 22px; padding: 2px 18px 8px; }
	.horario-day + .horario-day { margin-top: 6px; }
	.horario-day__title { font-size: 1.05rem; padding: 6px 2px; margin-bottom: 8px; border-bottom: 2px solid var(--linea); }
	.horario-slot { grid-template-columns: 54px 1fr; padding: 14px; row-gap: 4px; }
	.horario-slot__hora { grid-row: span 2; align-self: start; }
	.horario-slot__titulo, .horario-slot__plazas-text { grid-column: 2; grid-row: auto; text-align: left; max-width: none; }
	.horario-detail__card { padding: 26px 22px 22px; }
	.tarifa { border-radius: 24px; padding: 26px 22px 22px; }
	.testimonio-card { border-radius: 22px; }
	.ins__nav .btn--primary { justify-content: space-between; }
	.barra-movil { background: rgba(255,255,255,.97); border-top: 1px solid var(--borde-caja); }
	.barra-movil__reserva { justify-content: space-between; white-space: nowrap; padding-left: 20px; font-size: .76rem; }
	.barra-movil__reserva::after { width: 34px; height: 34px; }
	.barra-movil__wa { min-height: 52px; text-transform: none; letter-spacing: 0; font-size: .9rem; }
}

/* Ajustes tras la primera revisión */
/* "¿Qué es Mamá Yoguini?" y sus tres ideas forman un solo panel */
.refugio > .container:first-child:not(:last-child) { border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding-bottom: 0; }
.refugio > .container + .container { border-radius: 0 0 var(--radius-lg) var(--radius-lg); padding-top: 48px; }
.refugio > .container + .container::before, .refugio > .container + .container::after { content: none; }
.valores { margin-top: 0; }
.comunidad .section-header p.comunidad__lead { color: rgba(255,255,255,.82); }
/* Con dos talleres, a mitad y mitad en vez de dejar un hueco */
.talleres-grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 820px; margin-left: auto; margin-right: auto; }
.modo-card__ctas .btn { justify-content: space-between; text-align: left; }
.btn { text-align: left; }
.btn--ghost, .btn--outline, .btn--small, .chip { text-align: center; }
@media (max-width: 760px) {
	.refugio > .container:first-child:not(:last-child) { border-radius: 26px 26px 0 0; }
	.refugio > .container + .container { border-radius: 0 0 26px 26px; padding-top: 32px; }
	.talleres-grid:has(> :nth-child(2):last-child) { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Un mismo formato en todas las páginas
   ========================================================================== */

/* Tarifas: todas las tarjetas de una fila miden lo mismo y el botón queda abajo */
.tarifas--varias { align-items: stretch; }
.tarifa { display: flex; flex-direction: column; }
.tarifa .modo { align-self: flex-start; }
.tarifa__lista { margin-bottom: 22px; }
.tarifa .btn { margin-top: auto; }
.page-template-page-clases .precios-sec { margin-top: 0; }

/* Bloque puente (invitación a la otra modalidad): un panel de color, del ancho de todos */
.section > .container.puente { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-top: 0; padding-top: clamp(30px, 4vw, 52px); padding-bottom: clamp(30px, 4vw, 52px); }
.section > .container.puente--online { background: var(--p-lila); }
.section > .container.puente--presencial { background: var(--p-salvia); }
.section > .container.puente::before, .section > .container.puente::after { color: rgba(43,37,51,.3); }
.puente__titulo { font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 500; letter-spacing: -.025em; }
.puente__texto p:last-child { color: var(--tinta); opacity: .8; }

/* Horario y precios */
.horario-pagina .page-header-block { margin-bottom: 48px; }
.clases-tipos { margin-top: 0; }
.clases-tipo { margin-bottom: 10px; }

/* Contacto */
.contacto-layout { margin-top: 0; gap: 14px; }
.contacto-llegar, .contacto-faq { margin-top: 0; }
.contacto-llegar h2 { font-size: clamp(1.75rem, 3.5vw, 2.75rem); }
.contacto-bloque__titulo { font-weight: 600; }
.section > .container.colaboracion-card { max-width: var(--ancho-panel); margin-top: 0; margin-bottom: 0; border-top: 0; text-align: center; }
.colaboracion-card .section-header { margin-bottom: 18px; }

/* Inscripción: el formulario es una caja dentro del panel */
.ins-pagina .ins-layout { align-items: start; }
.ins-caja { background: var(--hueso); border-radius: 28px; padding: clamp(22px, 3vw, 36px); }
.ins-intro { top: 110px; }
.ins-hecho { max-width: 620px; margin: 0 auto; text-align: center; padding: 0; }
.ins__nav { background: transparent; }

/* Taller */
.taller-single__hero { max-width: none; padding: 0; }
.taller-single__image { margin-top: 0; border-radius: 26px; }
.taller-single__layout { padding: 40px 0 0; }
.taller-single__notas { background: var(--hueso); border-radius: 16px; }
.taller-info-card__precio-box { background: var(--p-salvia); border-radius: 16px; }
.taller-info-card__precio { font-family: var(--font-heading); font-weight: 500; letter-spacing: -.03em; }
.taller-info-card__precio-label { color: var(--tinta); }

/* Blog */
body.single-post { background: var(--arena); }
.post-hero { border-bottom: 0; }
.post-hero__media { border-radius: 26px; }
.post-content { max-width: 720px; }
.post-relacionados { margin-top: 0; }
.nav-links, .pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 36px; }
.page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(43,37,51,.25); font: 600 .8rem/1 var(--font-heading); }
.page-numbers.current, .page-numbers:hover { background: var(--tinta); border-color: var(--tinta); color: #fff; }

/* Sobre mí */
.sobre-mi-hero { padding-bottom: 6px; }
.sobre-mi-card { box-shadow: none; background: none; padding: 0; border-radius: 0; max-width: 780px; }
.sobre-mi-outro { border-radius: 26px; }

/* Gracias y landings */
.ty-main { max-width: 640px; margin: 0 auto; padding: 0; }
.ty-pasos { background: var(--hueso); border-radius: 22px; }
.landing-form-card { box-shadow: none; }
.landing-ins-caja { background: var(--hueso); }

@media (max-width: 760px) {
	.ins-caja { margin: 0; padding: 20px 14px 18px; border-radius: 22px; }
	.ins__nav { background: var(--hueso); box-shadow: 0 -12px 14px -12px rgba(43,37,51,.18); }
	.section > .container.puente .btn { width: 100%; justify-content: space-between; }
	.taller-single__layout { padding-top: 26px; }
	.page-header-block { margin-bottom: 30px; }
	.horario-pagina .page-header-block { margin-bottom: 36px; }
}

/* Sobre mí: el recuadro "De ahí nació..." en pastel, para no repetir el verde del panel final que va justo debajo */
.sobre-mi-outro { background: var(--p-salvia); color: var(--tinta); }
.sobre-mi-outro h2 { color: var(--tinta); font-weight: 500; }
.sobre-mi-outro p { color: var(--tinta); opacity: .85; }
.sobre-mi-outro__icon { display: none; }

/* Campos de formulario: blancos y con borde, porque siempre van dentro de una caja de tono hueso */
.contacto-form input, .contacto-form textarea,
.ins input[type="text"], .ins input[type="email"], .ins input[type="tel"], .ins input[type="date"], .ins select, .ins textarea {
	background-color: #fff; border: 1.5px solid var(--linea);
}

/* ==========================================================================
   Ordenador (desde 1041px): página ancha

   En el móvil y la tableta todo va en paneles apilados, que es donde mejor
   funcionan. En pantallas grandes los paneles dejaban el contenido encajonado
   en una columna con mucho margen muerto a los lados, y todas las secciones
   pesaban lo mismo. Aquí cada sección pasa a ser una franja a todo el ancho
   (blanca, arena o de color) con el contenido centrado; las cajas se quedan
   para lo que es una pieza: tarjetas, precios, horario, formularios.

   La regla sigue siendo una sola para todas las páginas: lo que en móvil es
   un panel, en ordenador es una franja.
   ========================================================================== */
.hero3__fondo { display: none; }

@media (min-width: 1041px) {
	:root { --franja: calc(var(--container-w) + 96px); }
	body, body.single-post, .landing-page { background: #fff; }
	.section, .cta-final { padding-top: 0; padding-bottom: 0; }

	.panel, .section > .container, .container.section, main > .container:not(.section),
	.section > .container.section--narrow-inner, .container.section.section--narrow {
		background: none; border-radius: 0; box-shadow: none; width: auto; max-width: var(--franja);
		padding: clamp(72px, 7.4vw, 112px) 48px; margin-top: 0; margin-bottom: 0;
	}
	.panel::before, .panel::after, .section > .container::before, .section > .container::after,
	.container.section::before, .container.section::after { top: 30px; }
	.panel::before, .section > .container::before, .container.section::before { left: 48px; }
	.panel::after, .section > .container::after, .container.section::after { right: 48px; }
	/* Dos franjas blancas seguidas: sin duplicar el aire entre ellas */
	.section:not(.section--alt):not(.comunidad):not(.cta-final):not(.puente-sec):not(.landing-precio-sec)
		+ .section:not(.section--alt):not(.comunidad):not(.cta-final):not(.puente-sec):not(.landing-precio-sec) > .container { padding-top: 0; }
	.section:not(.section--alt):not(.comunidad):not(.cta-final):not(.puente-sec):not(.landing-precio-sec)
		+ .section:not(.section--alt):not(.comunidad):not(.cta-final):not(.puente-sec):not(.landing-precio-sec) > .container::before,
	.section:not(.section--alt):not(.comunidad):not(.cta-final):not(.puente-sec):not(.landing-precio-sec)
		+ .section:not(.section--alt):not(.comunidad):not(.cta-final):not(.puente-sec):not(.landing-precio-sec) > .container::after { content: none; }

	/* El color pasa del panel a la franja entera */
	.section--alt { background: var(--banda); }
	.section--alt > .container { background: none; }
	.comunidad { background: var(--tinta); }
	.comunidad > .container { background: none; }
	.cta-final { background: var(--color-green-action); }
	.cta-final > .container.cta-final__inner { background: none; border-radius: 0; max-width: var(--franja); padding: clamp(84px, 8vw, 128px) 48px; }
	.puente-sec--online { background: var(--p-lila); }
	.puente-sec--presencial { background: var(--p-salvia); }
	.section > .container.puente--online, .section > .container.puente--presencial { background: none; }
	.landing-precio-sec { background: var(--p-lila); }
	.landing-precio-sec > .container { background: none; }
	.refugio > .container:first-child:not(:last-child), .refugio > .container + .container { border-radius: 0; }
	.modos__mas { border-color: var(--banda); }

	/* Cinta y pie, a todo el ancho */
	.cinta { max-width: none; width: auto; margin: 0; border-radius: 0; padding: 17px 0; }
	.site-footer { max-width: none; width: auto; margin: 0; border-radius: 0; }
	.footer__inner, .footer__bottom-inner { max-width: var(--franja); margin-left: auto; margin-right: auto; padding-left: 48px; padding-right: 48px; }

	/* La cabecera sigue siendo una píldora que flota sobre la página */
	.site-header__inner { border: 1px solid var(--borde-caja); }

	/* Portada: foto a toda pantalla con el texto encima */
	.hero3 { padding: 0; }
	.hero3--fondo { position: relative; isolation: isolate; margin-top: -80px; background: var(--arena-2); }
	.hero3__fondo { display: block; position: absolute; inset: 0; z-index: -2; }
	.hero3__fondo img { width: 100%; height: 100%; object-fit: cover; object-position: 68% 38%; }
	/* Velo claro a la izquierda: el texto se lee siempre, tenga la foto lo que tenga debajo */
	.hero3--fondo::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(244,239,232,.94) 0%, rgba(244,239,232,.82) 32%, rgba(244,239,232,.3) 52%, rgba(244,239,232,0) 66%); }
	.hero3--fondo .hero3__panel {
		grid-template-columns: minmax(0, 1fr); grid-template-areas: "etiqueta" "lema" "texto" "visual"; grid-template-rows: auto auto auto 1fr;
		min-height: min(calc(100vh - 96px), 860px); padding-top: 128px; padding-bottom: 28px;
	}
	.hero3--fondo .hero3__panel::before, .hero3--fondo .hero3__panel::after { top: 112px; color: rgba(43,37,51,.35); }
	/* Tamaño pensado para que lema, texto, botones y la barra de plazas quepan en la primera pantalla de un portátil */
	.hero3--fondo .hero3__lema { font-size: clamp(4.4rem, 7.4vw, 7.6rem); margin-bottom: clamp(20px, 2.2vw, 32px); }
	.hero3--fondo .hero3__texto { max-width: 540px; }
	.hero3--fondo .hero3__lead { color: var(--tinta); opacity: .82; }
	.hero3--fondo .btn--ghost { background: rgba(255,255,255,.7); }
	.hero3--fondo .btn--ghost:hover { background: var(--tinta); }
	/* Sobre la foto solo van el lema, el texto y los botones. El mosaico y el recuadro
	   de plazas libres son del móvil y la tableta; aquí se quitaron (tapaban la foto). */
	.hero3--fondo .hero3__visual { display: none; }
	.hero3--fondo .hero3__panel { grid-template-areas: "etiqueta" "lema" "texto"; grid-template-rows: auto; align-content: center; padding-bottom: 72px; }

	/* Páginas interiores: primera franja con algo menos de aire arriba */
	.clase-hero > .container, .horario-pagina > .container, .contacto-pagina > .container, .ins-pagina > .container,
	.sobre-mi-hero > .container, .post-hero > .container, .taller-single > .container, main > .container.section:first-child { padding-top: 56px; }
}

/* Portátiles de poca altura (768 px): la portada se compacta para que el lema,
   los botones y la barra de plazas quepan sin hacer scroll */
@media (min-width: 1041px) and (max-height: 840px) {
	.hero3--fondo .hero3__panel { padding-top: 106px; min-height: calc(100vh - 96px); }
	.hero3--fondo .hero3__panel::before, .hero3--fondo .hero3__panel::after { top: 88px; }
	.hero3--fondo .hero3__label { margin-bottom: 12px; }
	.hero3--fondo .hero3__panel { padding-bottom: 44px; }
	.hero3--fondo .hero3__lema { font-size: clamp(3.8rem, 12.4vh, 6.6rem); margin-bottom: 22px; }
	.hero3--fondo .hero3__titulo { font-size: 1.35rem; }
}

/* ==========================================================================
   Botones: un solo sistema

   Principal   píldora oscura (lila si es de online) con la flecha en un
               círculo. Texto a la izquierda y flecha a la derecha SIEMPRE,
               mida lo que mida el botón.
   Secundario  píldora con borde, sin flecha, texto centrado.
   Tamaños     pequeño 42 · normal 52 · grande 58. En una misma fila, el mismo.
   ========================================================================== */
.btn--primary, .btn--online { justify-content: space-between; text-align: left; padding-left: 26px; padding-right: 7px; }
.btn--lg.btn--primary, .btn--lg.btn--online { padding-left: 30px; }
.btn--small.btn--primary, .btn--small.btn--online { padding-left: 20px; padding-right: 6px; }
.btn--small.btn--primary::after, .btn--small.btn--online::after { content: ''; width: 30px; height: 30px; background-size: 13px; }
.btn--block.btn--small.btn--primary { justify-content: space-between; }
.btn--secondary, .btn--sage, .btn--gold { background: transparent; color: var(--tinta); border-color: rgba(43,37,51,.3); justify-content: center; text-align: center; }
.btn--secondary:hover, .btn--sage:hover, .btn--gold:hover { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.btn--ghost, .btn--outline, .btn--outline-light { justify-content: center; }
.nav-reserva { padding-left: 20px; padding-right: 6px; }
.horario-lista__reservar { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; }
.card__footer .btn { width: 100%; }

/* ==========================================================================
   Páginas de clase (prenatal, posparto, mujer)
   ========================================================================== */
.datos { display: flex; flex-wrap: wrap; margin: 34px 0 0; padding-top: 22px; border-top: 1px solid var(--linea); max-width: 560px; }
.datos div { padding-right: 26px; margin-right: 26px; border-right: 1px solid var(--linea); }
.datos div:last-child { padding-right: 0; margin-right: 0; border-right: 0; }
.datos dt { font: 600 .68rem/1.4 var(--font-heading); letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-suave); margin-bottom: 4px; }
.datos dd { margin: 0; font: 600 1.05rem/1.3 var(--font-heading); letter-spacing: -.01em; color: var(--tinta); }

/* Dos columnas: texto a la izquierda, piezas (tarjetas o cajas) a la derecha */
.split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 4.5vw, 64px); align-items: start; }
.split--solo { grid-template-columns: minmax(0, 780px); justify-content: center; }
.split--solo:has(> .filas-icono), .split--solo:has(> .split__cajas) { grid-template-columns: minmax(0, 1fr); }
.split--solo > .filas-icono, .split--solo > .split__cajas { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.split__texto p { color: var(--tinta-suave); font-size: 1.03rem; line-height: 1.7; }
.split__texto p:first-child { color: var(--tinta); font-size: 1.12rem; }
.split__texto > :last-child { margin-bottom: 0; }

.filas-icono { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.filas-icono li { display: flex; align-items: flex-start; gap: 16px; background: #fff; border: 1px solid var(--borde-caja); border-radius: 20px; padding: 20px 22px; }
.filas-icono__icono { flex: none; width: 48px; height: 48px; border-radius: 50%; background: var(--arena-2); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; line-height: 1; }
.filas-icono__texto { display: flex; flex-direction: column; gap: 3px; }
.filas-icono__texto strong { font: 600 1.08rem/1.3 var(--font-heading); letter-spacing: -.01em; color: var(--tinta); }
.filas-icono__texto span { color: var(--tinta-suave); font-size: .95rem; line-height: 1.55; }

.split__cajas { display: flex; flex-direction: column; gap: 12px; }
.caja { background: var(--hueso); border: 1px solid var(--borde-caja); border-radius: 24px; padding: clamp(22px, 2.6vw, 32px); }
.caja h3 { font-size: 1.3rem; margin-bottom: .7em; }
.caja .prose p { color: var(--tinta-suave); font-size: .98rem; line-height: 1.65; }
.caja .prose > :last-child { margin-bottom: 0; }

.clase-beneficios .beneficios-grid { max-width: 980px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.clase-beneficios .beneficios-grid li { align-items: center; gap: 14px; background: #fff; border: 1px solid var(--borde-caja); border-radius: 16px; padding: 15px 18px; font-weight: 500; line-height: 1.4; }
.clase-beneficios .beneficios-grid__check { position: relative; flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--p-salvia); }
.clase-beneficios .beneficios-grid__check::after { content: ''; position: absolute; left: 8px; top: 9px; width: 11px; height: 6px; border-left: 2px solid var(--tinta); border-bottom: 2px solid var(--tinta); transform: rotate(-45deg); }

.enlaces-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
.enlace-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; background: var(--hueso); border: 1px solid var(--borde-caja); border-radius: 24px; padding: 26px 28px; color: var(--tinta); }
.enlace-card:hover { color: var(--tinta); border-color: rgba(43,37,51,.35); }
.enlace-card:hover .flecha { transform: rotate(45deg); }
.enlace-card h3 { font-size: 1.22rem; margin: 0 0 6px; }
.enlace-card p { margin: 0; color: var(--tinta-suave); font-size: .95rem; }
.enlace-card__texto { display: block; }

@media (min-width: 900px) {
	/* Etapas con dos tipos de clase (posparto): los dos horarios, lado a lado */
	.clase-horario .horario-lista:has(.horario-lista__clase + .horario-lista__clase) { max-width: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
}
@media (max-width: 960px) {
	.clase-hero__grid, .clase-hero .two-col, .split { grid-template-columns: minmax(0, 1fr); }
	.clase-hero__foto, .clase-hero .two-col__media { max-width: 360px; margin: 0 auto; order: 2; }
}
@media (max-width: 760px) {
	.clase-hero .hero__ctas { flex-direction: column; align-items: stretch; }
	.datos { margin-top: 26px; row-gap: 14px; }
	.datos div { padding-right: 18px; margin-right: 18px; }
	.clase-beneficios .beneficios-grid { grid-template-columns: minmax(0, 1fr); }
	.enlace-card { padding: 22px 20px; }
	.filas-icono li { padding: 18px; }
}

/* Retrato de Gema en "¿Qué es Mamá Yoguini?": vertical, encuadrado en la cara */
.refugio .two-col__media { aspect-ratio: 4 / 4.5; border-radius: 26px; }
.refugio .two-col__media img { object-position: 50% 22%; }
@media (max-width: 960px) { .refugio .two-col__media { max-width: 440px; margin: 0 auto; width: 100%; aspect-ratio: 1 / 1; } }

/* Datos clave de la cabecera de clase en el móvil: una fila por dato, etiqueta a la izquierda y valor a la derecha */
@media (max-width: 760px) {
	.datos { display: block; padding-top: 6px; }
	.datos div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; margin: 0; border-right: 0; border-bottom: 1px solid var(--linea); }
	.datos div:last-child { border-bottom: 0; padding-bottom: 0; }
	.datos dt { margin: 0; }
	.datos dd { text-align: right; }
}

/* Final de una entrada del blog: enlaces en tarjetas y llamada a reservar */
.post-cierre { background: none; margin: 0; padding-left: 0; padding-right: 0; border-radius: 0; max-width: none; }
.post-cierre__cta { margin-top: 36px; padding-top: 32px; border-top: 1px solid var(--linea); text-align: center; }
.post-cierre__cta p { color: var(--tinta-suave); font-size: 1rem; margin-bottom: 1.2em; }
.post-cierre__cta p a { text-decoration: underline; text-underline-offset: 3px; }

/* Redes del pie: al pasar el ratón el círculo se vuelve blanco y el icono oscuro.
   (Antes fondo e icono quedaban los dos en verde y el icono desaparecía.) */
.footer__social a { transition: background .15s ease, color .15s ease, border-color .15s ease; }
.footer__social a:hover, .footer__social a:focus-visible { background: #fff; border-color: #fff; color: var(--tinta); }
.post-cierre .section-header h2 { font-size: clamp(1.75rem, 3.5vw, 2.75rem); margin-bottom: 0; }

/* Etiquetas de filtro (horario y categorías del blog): el texto siempre centrado.
   En el blog son enlaces, no botones, y el texto se quedaba pegado arriba. */
.chip { display: inline-flex; align-items: center; justify-content: center; line-height: 1.2; text-align: center; white-space: nowrap; }
a.chip:hover { color: #fff; }
/* En el blog las categorías son pocas: en el móvil se centran y, si no caben, bajan de línea
   (en el horario se deslizan de lado, porque ahí conviene no empujar la rejilla hacia abajo) */
@media (max-width: 760px) {
	.page-template-page-blog .horario-filters { flex-wrap: wrap; justify-content: center; overflow: visible; margin: 0 0 24px; padding: 0; }
}

/* Tarjetas de precio: un borde fino las recorta sobre cualquier fondo (blanco o arena) */
.tarifa, .tarifa--destacada { border: 1px solid rgba(43,37,51,.1); }
