/**
 * Componentes de contenido. Usa los tokens --ov-* del tema.
 */

/* ---------- Resumen de puntos clave ---------- */

.ov-tldr {
	margin: var(--ov-space-xl, 2rem) 0;
	padding: var(--ov-space-lg, 1.5rem);
	border-left: 4px solid var(--ov-ambar, #D4A44E);
	border-radius: 0 var(--ov-radius-md, 10px) var(--ov-radius-md, 10px) 0;
	background-color: var(--ov-bg-alt, #fff);
}

.ov-tldr__titulo {
	margin: 0 0 var(--ov-space-sm, .75rem);
	font-family: var(--ov-font-display, sans-serif);
	font-size: var(--ov-text-sm, .875rem);
	text-transform: uppercase;
	letter-spacing: var(--ov-tracking-label, .12em);
	color: var(--ov-azul, #183B56);
}

.ov-tldr__cuerpo > :last-child { margin-bottom: 0; }
.ov-tldr__cuerpo ul { margin: 0; padding-left: 1.2em; }
.ov-tldr__cuerpo li { margin-bottom: .4em; }

/* ---------- CTA en el cuerpo ---------- */

.ov-cta-bloque {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ov-space-md, 1rem);
	margin: var(--ov-space-xl, 2rem) 0;
}

.ov-cta-bloque__nota {
	font-size: var(--ov-text-sm, .875rem);
	color: var(--ov-text-muted, rgba(17,17,17,.6));
}

/* ---------- Preguntas frecuentes ---------- */

.ov-faq { margin: var(--ov-space-2xl, 3rem) 0; }

.ov-faq__titulo { margin-bottom: var(--ov-space-lg, 1.5rem); }

.ov-faq__item {
	border-bottom: 1px solid var(--ov-border-soft, rgba(17,17,17,.08));
}

.ov-faq__pregunta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ov-space-md, 1rem);
	padding: var(--ov-space-md, 1rem) 0;
	cursor: pointer;
	list-style: none;
}

.ov-faq__pregunta::-webkit-details-marker { display: none; }

/* El H3 vive dentro del summary para conservar la jerarquía real:
   H1 página → H2 sección FAQ → H3 cada pregunta. */
.ov-faq__pregunta h3 {
	margin: 0;
	font-size: var(--ov-text-lg, 1.25rem);
}

.ov-faq__pregunta::after {
	content: "+";
	flex-shrink: 0;
	font-family: var(--ov-font-display, sans-serif);
	font-size: 1.5rem;
	line-height: 1;
	color: var(--ov-ambar, #D4A44E);
	transition: transform 180ms ease;
}

.ov-faq__item[open] .ov-faq__pregunta::after { content: "−"; }

.ov-faq__respuesta {
	padding-bottom: var(--ov-space-md, 1rem);
	color: var(--ov-text-muted, rgba(17,17,17,.6));
}

.ov-faq__respuesta > :last-child { margin-bottom: 0; }

/* ---------- Compartir ---------- */

.ov-compartir {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ov-space-sm, .75rem);
	margin-top: var(--ov-space-2xl, 3rem);
	padding-top: var(--ov-space-lg, 1.5rem);
	border-top: 1px solid var(--ov-border-soft, rgba(17,17,17,.08));
}

.ov-compartir__label {
	font-family: var(--ov-font-display, sans-serif);
	font-size: var(--ov-text-sm, .875rem);
	text-transform: uppercase;
	letter-spacing: var(--ov-tracking-label, .12em);
}

.ov-compartir__btn {
	padding: .45em 1.1em;
	border: 1px solid var(--ov-border, rgba(17,17,17,.16));
	border-radius: var(--ov-radius-pill, 999px);
	background: none;
	color: var(--ov-text, #111);
	font-size: var(--ov-text-sm, .875rem);
	text-decoration: none;
	cursor: pointer;
	transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.ov-compartir__btn:hover {
	background-color: var(--ov-obsidian, #111);
	border-color: var(--ov-obsidian, #111);
	color: var(--ov-hueso, #F4F1EA);
}

/* ---------- Enlazado por clusters ---------- */

.ov-cluster {
	margin: var(--ov-space-2xl, 3rem) 0;
	padding: var(--ov-space-lg, 1.5rem);
	border-radius: var(--ov-radius-lg, 18px);
	background-color: var(--ov-bg-alt, #fff);
}

.ov-cluster__titulo {
	margin-bottom: var(--ov-space-md, 1rem);
	font-size: var(--ov-text-lg, 1.25rem);
}

.ov-cluster__lista { margin: 0; padding: 0; list-style: none; }
.ov-cluster__lista li + li { margin-top: var(--ov-space-xs, .5rem); }

.ov-cluster__lista a {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	color: var(--ov-azul, #183B56);
}

.ov-cluster__lista a::before { content: "→"; color: var(--ov-ambar, #D4A44E); }

/* ---------- Barra fija de llamada en móvil ---------- */

.ov-barra-movil { display: none; }

@media (max-width: 767px) {
	.ov-barra-movil {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 900;
		display: grid;
		grid-auto-flow: column;
		grid-auto-columns: 1fr;
		background-color: var(--ov-obsidian, #111);
		border-top: 1px solid rgba(244,241,234,.18);
		/* Respeta la barra de gestos de iOS. */
		padding-bottom: env(safe-area-inset-bottom, 0);
	}

	.ov-barra-movil__btn {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: .4em;
		padding: .95rem .5rem;
		color: var(--ov-hueso, #F4F1EA);
		font-family: var(--ov-font-body, sans-serif);
		font-size: var(--ov-text-sm, .875rem);
		font-weight: 700;
		text-decoration: none;
	}

	.ov-barra-movil__btn + .ov-barra-movil__btn {
		border-left: 1px solid rgba(244,241,234,.18);
	}

	.ov-barra-movil__btn--llamar {
		background-color: var(--ov-ambar, #D4A44E);
		color: var(--ov-obsidian, #111);
	}

	/* Deja aire para que la barra no tape el final del contenido. */
	body { padding-bottom: 56px; }
}