/**
 * FAQs — Figma 6501:20796
 *
 * Estructura: fila de título como mwm-por-que (416px vacía + titular en columna ancha) → 100px → lista.
 * Cada ítem: flujo en bloque (no flex fila): pregunta max 416px,
 * debajo respuesta max 856px alineada a la derecha (items-end), gap 12px.
 * Entre ítems: 48px.
 */

/* Contenedor interior: solo separa título de lista (gap 100px, centrado como Figma). */
.mwm-faqs .mwm-faqs__inner {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 100px;
	width: 100%;
	max-width: 1296px;
	margin-inline: auto;
}

/* Cabecera: rejilla como .mwm-por-que; titular en la segunda columna (la del intro en Por qué). */
.mwm-faqs .mwm-faqs__inner > .wp-block-columns.mwm-faqs__title-columns {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	align-self: stretch;
	gap: 24px;
	align-items: flex-start;
}

.mwm-faqs .mwm-faqs__title-columns > .wp-block-column:first-child {
	flex-basis: 416px;
	flex-grow: 0;
	flex-shrink: 0;
	max-width: 100%;
	padding-top: 0;
	box-sizing: border-box;
}

.mwm-faqs .mwm-faqs__title-columns > .wp-block-column:last-child {
	flex: 1 1 auto;
	min-width: 0;
	padding-top: 24px;
	box-sizing: border-box;
}

/* Lista de FAQs: solo separación vertical entre ítems (48px). */
.mwm-faqs .mwm-faqs__list {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 48px;
	width: 100%;
	margin: 0;
	padding: 0;
}

.mwm-faqs .mwm-faqs__list.wp-block-group {
	border: none;
	background: none;
}

/*
 * Ítem: bloque encadenado (pregunta → respuesta), sin flex en el par.
 * Forzamos display:block por si el grupo WP inyecta flex.
 */
.mwm-faqs .mwm-faqs__item {
	display: block !important;
	width: 100%;
	margin: 0;
	padding: 0;
}

.mwm-faqs .mwm-faqs__item.wp-block-group {
	border: none;
	background: none;
}

.mwm-faqs .mwm-faqs__item > .mwm-faqs__question {
	max-width: 416px;
	width: 100%;
}

/* Respuesta debajo de la pregunta, alineación derecha (Figma FAQ Answer Container items-end). */
.mwm-faqs .mwm-faqs__item > .mwm-faqs__answer-cell {
	display: block !important;
	box-sizing: border-box;
	width: 100%;
	max-width: 856px;
	margin-top: 12px;
	margin-left: auto;
	margin-right: 0;
	padding: 0;
}

.mwm-faqs .mwm-faqs__answer-cell.wp-block-group {
	border: none;
	background: none;
}

.mwm-faqs .mwm-faqs__answer-cell .mwm-faqs__answer + .mwm-faqs__answer {
	margin-top: 1em !important;
}

@media (max-width: 781px) {

	.mwm-faqs .mwm-faqs__inner {
		align-items: stretch;
		gap: 48px;
	}

	.mwm-faqs .mwm-faqs__title-columns > .wp-block-column:first-child {
		flex-basis: 100%;
		padding-top: 0;
	}

	/* Columna 416px vacía: sin franja al apilar. */
	.mwm-faqs .mwm-faqs__title-columns > .wp-block-column:first-child:empty {
		display: none;
	}

	.mwm-faqs .mwm-faqs__title-columns > .wp-block-column:last-child {
		padding-top: 0;
	}

	.mwm-faqs .mwm-faqs__item > .mwm-faqs__answer-cell {
		margin-left: 0;
		max-width: none;
	}

	.mwm-faqs .mwm-faqs__item > .mwm-faqs__question {
		max-width: none;
	}
}

/* ── Tipografía (Figma) ─────────────────────────────────────────────────── */

.mwm-faqs h2.wp-block-heading.mwm-faqs__title {
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: var(--wp--preset--font-size--heading-2) !important;
	font-weight: 400 !important;
	letter-spacing: -0.01em !important;
	line-height: 1.3 !important;
	margin: 0 !important;
}

.mwm-faqs h3.wp-block-heading.mwm-faqs__question {
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--x-large) !important;
	font-weight: 400 !important;
	letter-spacing: -0.01em !important;
	line-height: 1.3 !important;
	margin: 0 !important;
}

.mwm-faqs:not(.mwm-faqs--tax-bicolor):not(.mwm-bicolor-default-cream):not(.mwm-bicolor-default-blue) p.mwm-faqs__answer {
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 400 !important;
	line-height: 1.3 !important;
	color: var(--wp--preset--color--quaternary) !important;
	margin: 0 !important;
}

