/*
 * Baby Bloom — Página "Terapias".
 * Se encola solo en is_page('terapias'). Reutiliza tokens.css, base.css y el
 * sistema de franjas .bbet-* (estimulacion.css). Aquí viven los componentes
 * propios: hero, tarjetas de servicio con icono, sección familia, CTA y el
 * acordeón de preguntas frecuentes (acotado a .bb-terapias). Sin scroll horizontal.
 */

.bb-terapias { overflow-x: clip; }
.bb-terapias-page > .bb-terapias-cta { margin-bottom: 0; }

/* ===================================================================== *
 * Iconografía de servicios (máscaras SVG recolorables)
 * ===================================================================== */
.bb-terapia-ico {
	display: inline-block; width: 30px; height: 30px; flex: none;
	background-color: currentColor;
	-webkit-mask-position: center; mask-position: center;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-size: contain; mask-size: contain;
}
.bb-terapia-ico--dialogo { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.5 7.2L4 20l.9-4.3A8 8 0 1 1 21 12z'/%3E%3Cpath d='M8.5 11h7M8.5 14h4'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.5 7.2L4 20l.9-4.3A8 8 0 1 1 21 12z'/%3E%3Cpath d='M8.5 11h7M8.5 14h4'/%3E%3C/svg%3E"); }
.bb-terapia-ico--bloques { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='12' width='8' height='8' rx='1.5'/%3E%3Crect x='13' y='12' width='8' height='8' rx='1.5'/%3E%3Crect x='8' y='3' width='8' height='8' rx='1.5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='12' width='8' height='8' rx='1.5'/%3E%3Crect x='13' y='12' width='8' height='8' rx='1.5'/%3E%3Crect x='8' y='3' width='8' height='8' rx='1.5'/%3E%3C/svg%3E"); }
.bb-terapia-ico--corazon { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.6-7-9.7A4.3 4.3 0 0 1 12 6a4.3 4.3 0 0 1 7 4.3C19 15.4 12 20 12 20z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.6-7-9.7A4.3 4.3 0 0 1 12 6a4.3 4.3 0 0 1 7 4.3C19 15.4 12 20 12 20z'/%3E%3C/svg%3E"); }
.bb-terapia-ico--cerebro { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='8' r='2'/%3E%3Ccircle cx='17' cy='6' r='2'/%3E%3Ccircle cx='18' cy='15' r='2'/%3E%3Ccircle cx='8' cy='17' r='2'/%3E%3Cpath d='M8 8l7-1.5M7.5 9.5l.3 5.7M9.7 16.4 16 15M17.5 8l.4 5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='8' r='2'/%3E%3Ccircle cx='17' cy='6' r='2'/%3E%3Ccircle cx='18' cy='15' r='2'/%3E%3Ccircle cx='8' cy='17' r='2'/%3E%3Cpath d='M8 8l7-1.5M7.5 9.5l.3 5.7M9.7 16.4 16 15M17.5 8l.4 5'/%3E%3C/svg%3E"); }
.bb-terapia-ico--movimiento { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='14' cy='5' r='2'/%3E%3Cpath d='M14 8l-2 4 3 2 1 5'/%3E%3Cpath d='M12 12 8 11 5 14'/%3E%3Cpath d='M15 14l4 1'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='14' cy='5' r='2'/%3E%3Cpath d='M14 8l-2 4 3 2 1 5'/%3E%3Cpath d='M12 12 8 11 5 14'/%3E%3Cpath d='M15 14l4 1'/%3E%3C/svg%3E"); }
.bb-terapia-ico--familia { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='2.4'/%3E%3Ccircle cx='16' cy='8' r='2.4'/%3E%3Cpath d='M3.5 19c0-2.7 2-4.5 4.5-4.5s4.5 1.8 4.5 4.5'/%3E%3Cpath d='M13 18.4c.4-2.3 2.2-3.9 4.4-3.9 2.3 0 4.1 1.8 4.1 4.5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='2.4'/%3E%3Ccircle cx='16' cy='8' r='2.4'/%3E%3Cpath d='M3.5 19c0-2.7 2-4.5 4.5-4.5s4.5 1.8 4.5 4.5'/%3E%3Cpath d='M13 18.4c.4-2.3 2.2-3.9 4.4-3.9 2.3 0 4.1 1.8 4.1 4.5'/%3E%3C/svg%3E"); }
.bb-terapia-ico--alimento { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 11h14a7 7 0 0 1-14 0z'/%3E%3Cpath d='M12 11V7a3 3 0 0 1 3-3'/%3E%3Cpath d='M4 21h16'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 11h14a7 7 0 0 1-14 0z'/%3E%3Cpath d='M12 11V7a3 3 0 0 1 3-3'/%3E%3Cpath d='M4 21h16'/%3E%3C/svg%3E"); }
.bb-terapia-ico--agua { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3s6 6.5 6 10.5a6 6 0 0 1-12 0C6 9.5 12 3 12 3z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3s6 6.5 6 10.5a6 6 0 0 1-12 0C6 9.5 12 3 12 3z'/%3E%3C/svg%3E"); }

/* ===================================================================== *
 * 1. Hero (rosa muy suave, 2 columnas, visual de marca)
 * ===================================================================== */
.bb-terapias-hero__inner { display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: center; padding-block: var(--bb-hero-pad-y); }
.bb-terapias-hero h1 { font-family: var(--bb-font-heading); font-size: var(--bb-text-4xl); line-height: 1.15; color: var(--bb-ink); margin: .5rem 0 .9rem; }
.bb-terapias-hero__lead { font-size: 1.12rem; line-height: 1.6; color: var(--bb-text-default); max-width: 52ch; margin: 0 0 1.6rem; }
.bb-terapias-hero__ctas { display: flex; flex-wrap: wrap; gap: .9rem; }
.bb-terapias-hero__visual { position: relative; display: grid; place-items: center; min-height: var(--bb-hero-flor); }
.bb-terapias-hero__flor { width: var(--bb-hero-flor); height: var(--bb-hero-flor); display: block; background: linear-gradient(145deg, var(--bb-amor) 0%, var(--bb-alegria) 55%, var(--bb-calma) 110%);
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20119.82%20118.3%22%3E%3Cpath%20d%3D%22M118.48%2C43.84c-4.04-13.34-16.29-21.93-29.54-21.92C85.1%2C9.23%2C73.33%2C0%2C59.39%2C0c-12.85%2C0-23.87%2C7.86-28.51%2C19.03-12.1%2C0-23.58%2C7.16-28.51%2C19.03-5.35%2C12.87-1.33%2C27.28%2C8.9%2C35.7-5.09%2C12.23-1.85%2C26.84%2C8.91%2C35.69%2C10.77%2C8.85%2C25.72%2C9.19%2C36.74%2C1.83%2C10.23%2C8.42%2C25.15%2C9.56%2C36.74%2C1.82%2C11.59-7.74%2C16.26-21.95%2C12.41-34.63%2C11.02-7.35%2C16.44-21.3%2C12.4-34.63Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20119.82%20118.3%22%3E%3Cpath%20d%3D%22M118.48%2C43.84c-4.04-13.34-16.29-21.93-29.54-21.92C85.1%2C9.23%2C73.33%2C0%2C59.39%2C0c-12.85%2C0-23.87%2C7.86-28.51%2C19.03-12.1%2C0-23.58%2C7.16-28.51%2C19.03-5.35%2C12.87-1.33%2C27.28%2C8.9%2C35.7-5.09%2C12.23-1.85%2C26.84%2C8.91%2C35.69%2C10.77%2C8.85%2C25.72%2C9.19%2C36.74%2C1.83%2C10.23%2C8.42%2C25.15%2C9.56%2C36.74%2C1.82%2C11.59-7.74%2C16.26-21.95%2C12.41-34.63%2C11.02-7.35%2C16.44-21.3%2C12.4-34.63Z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
}
.bb-terapias-hero__img { position: absolute; width: min(220px, 48vw); height: auto; }
.bb-terapias-hero__flor { overflow: hidden; }
.bb-terapias-hero__photo { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ===================================================================== *
 * 2. Alivio (abierto, sin tarjetas)
 * ===================================================================== */
.bb-terapias-alivio__inner { text-align: center; }
.bb-terapias-alivio h2 { font-family: var(--bb-font-heading); font-size: var(--bb-text-2xl); color: var(--bb-ink); margin: .4rem auto .9rem; max-width: 22ch; }
.bb-terapias-alivio p { color: var(--bb-text-default); line-height: 1.7; max-width: 64ch; margin: 0 auto; }
.bb-terapias-alivio__quote { font-family: var(--bb-font-heading); font-weight: 700; font-size: var(--bb-text-xl); color: var(--bb-amor-700); margin: 1.8rem auto 0; max-width: 34ch; line-height: 1.35; }

/* ===================================================================== *
 * 3. Áreas — tarjetas de servicio (máx. 3 columnas, altura uniforme)
 * ===================================================================== */
.bb-terapias-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; align-items: stretch; }
.bb-terapia-card {
	background: #fff; border: 1px solid var(--bb-border-subtle); border-radius: var(--bb-radius-lg);
	box-shadow: var(--bb-shadow-sm); padding: 1.8rem 1.6rem; display: flex; flex-direction: column;
	border-top: 4px solid var(--bb-gris-300); transition: transform .18s ease, box-shadow .18s ease;
}
.bb-terapia-card:hover { transform: translateY(-4px); box-shadow: var(--bb-shadow-md); }
.bb-terapia-card__ico { width: 56px; height: 56px; border-radius: var(--bb-radius-full); display: grid; place-items: center; margin-bottom: 1rem; }
.bb-terapia-card__title { font-family: var(--bb-font-heading); font-size: 1.2rem; color: var(--bb-ink); line-height: 1.25; margin: 0 0 .5rem; }
.bb-terapia-card__text { color: var(--bb-text-muted); line-height: 1.55; margin: 0 0 1.2rem; }
.bb-terapia-card__cta { margin-top: auto; display: inline-flex; align-items: center; gap: .4rem; font-family: var(--bb-font-body); font-weight: 600; color: var(--bb-action-secondary); text-decoration: none; align-self: flex-start; padding: .35rem .1rem; border-radius: var(--bb-radius-sm); }
.bb-terapia-card__cta:hover { gap: .65rem; color: var(--bb-action-secondary-hover); }
.bb-terapia-card__cta:hover span:first-child { text-decoration: underline; }
/* Tintes por servicio (borde superior + icono) */
.bb-terapia-card--calma { border-top-color: var(--bb-calma); }
.bb-terapia-card--calma .bb-terapia-card__ico { background: var(--bb-calma-100); color: var(--bb-calma-700); }
.bb-terapia-card--alegria { border-top-color: var(--bb-alegria); }
.bb-terapia-card--alegria .bb-terapia-card__ico { background: var(--bb-alegria-100); color: var(--bb-alegria-700); }
.bb-terapia-card--amor { border-top-color: var(--bb-amor); }
.bb-terapia-card--amor .bb-terapia-card__ico { background: var(--bb-amor-100); color: var(--bb-amor-700); }
.bb-terapia-card--creatividad { border-top-color: var(--bb-creatividad); }
.bb-terapia-card--creatividad .bb-terapia-card__ico { background: var(--bb-creatividad-100); color: var(--bb-creatividad-700); }
.bb-terapia-card--equilibrio { border-top-color: var(--bb-equilibrio); }
.bb-terapia-card--equilibrio .bb-terapia-card__ico { background: var(--bb-equilibrio-100); color: var(--bb-equilibrio-700); }

/* ===================================================================== *
 * 6. La familia forma parte
 * ===================================================================== */
.bb-terapias-familia__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.bb-terapias-familia__list li { background: var(--bb-bg-page); border: 1px solid var(--bb-border-subtle); border-radius: var(--bb-radius-md); padding: 1.5rem 1.4rem; }
.bb-terapias-familia__list .bb-terapia-ico { color: var(--bb-amor-700); margin-bottom: .6rem; }
.bb-terapias-familia__list h3 { font-family: var(--bb-font-heading); font-size: 1.08rem; color: var(--bb-ink); margin: 0 0 .4rem; }
.bb-terapias-familia__list p { margin: 0; color: var(--bb-text-muted); line-height: 1.55; }

/* ===================================================================== *
 * 7. FAQ — acordeón accesible (acotado a .bb-terapias)
 * ===================================================================== */
.bb-terapias .bb-accordion { background: #fff; border: 1px solid var(--bb-border-default); border-radius: var(--bb-radius-lg); overflow: hidden; }
.bb-terapias .bb-accordion__item + .bb-accordion__item { border-top: 1px solid var(--bb-border-subtle); }
.bb-terapias .bb-accordion__heading { margin: 0; font: inherit; }
.bb-terapias .bb-accordion__trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: none; border: 0; cursor: pointer; text-align: left; padding: 1.15rem 1.3rem; min-height: 56px; font-family: var(--bb-font-heading); font-weight: 700; font-size: 1.02rem; color: var(--bb-ink); line-height: 1.35; }
.bb-terapias .bb-accordion__trigger:hover { background: var(--bb-calma-100); }
.bb-terapias .bb-accordion__chevron { flex: none; color: var(--bb-confianza); transition: transform .2s ease; }
.bb-terapias .bb-accordion__trigger[aria-expanded="true"] .bb-accordion__chevron { transform: rotate(180deg); }
.bb-terapias .bb-accordion__inner { padding: 0 1.3rem 1.25rem; }
.bb-terapias .bb-accordion__inner p { margin: 0; line-height: 1.65; max-width: 64ch; color: var(--bb-text-default); }
/* Sin JS, los paneles quedan visibles; con JS se colapsan sin parpadeo. */
.bb-js .bb-terapias .bb-accordion__panel { display: none; }
.bb-js .bb-terapias .bb-accordion__panel.is-open { display: block; }

/* ===================================================================== *
 * 8. CTA final (rosa, conecta con el footer)
 * ===================================================================== */
.bb-terapias-cta { background: var(--bb-amor); }
.bb-terapias-cta__inner { text-align: center; }
.bb-terapias-cta__kicker { color: #FCE3F0; }
.bb-terapias-cta h2 { font-family: var(--bb-font-heading); font-size: var(--bb-text-3xl); color: #fff; line-height: 1.2; margin: .5rem auto .9rem; max-width: 24ch; }
.bb-terapias-cta p { color: #FBE7F1; line-height: 1.65; max-width: 58ch; margin: 0 auto; }
.bb-terapias-cta__actions { margin-top: 1.8rem; display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; }

/* ===================================================================== *
 * Responsive
 * ===================================================================== */
@media (max-width: 980px) {
	.bb-terapias-grid { grid-template-columns: repeat(2, 1fr); }
	.bb-terapias-familia__list { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
	.bb-terapias-hero__inner { grid-template-columns: 1fr; text-align: center; }
	.bb-terapias-hero__lead { margin-inline: auto; }
	.bb-terapias-hero__ctas { justify-content: center; }
	.bb-terapias-hero__visual { order: -1; min-height: 0; }
}
@media (max-width: 600px) {
	.bb-terapias-grid { grid-template-columns: 1fr; }
	.bb-terapias-hero__ctas .bb-btn,
	.bb-terapias-cta__actions .bb-btn { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.bb-terapia-card, .bb-terapias .bb-accordion__chevron { transition: none; }
}