/*
 * Páginas legales: Privacy Policy y Terms of Service.
 *
 * Referencia: docs/pages/privacy-desktop.txt (1365:10799), terms-desktop.txt
 * (1365:10891) y sus móviles. Solo consume tokens.
 */

.acturion-legal {
	--legal-badge:  48px;   /* [figma] círculo del número */
	--legal-narrow: 605px;  /* [figma] ancho de la cláusula «Contact» */
	--legal-intro:  711px;  /* [figma] ancho del bloque de portada */

	padding-block: var(--acturion-space-section);
	color: var(--acturion-dark-blue);
}

/* ---------------------------------------------------------------- Portada */
/* [figma] titular en [102,174] y párrafo 156 más abajo, los dos dentro de 711. */

.acturion-legal__hero {
	max-width: var(--legal-intro);
}

/* [figma MCP] el título legal va en MEDIUM 85/0.9 (1365:10887), a diferencia de los
   titulares de sección que son Regular — mismo estilo que los H1 de los heros. */
.acturion-legal__title {
	margin: 0;
	font-size: var(--acturion-h1);
	font-weight: var(--acturion-weight-medium);
	line-height: var(--acturion-lh-heading);
}

.acturion-legal__intro {
	margin: var(--acturion-space-10) 0 0;
	font-size: var(--acturion-body);
	line-height: var(--acturion-lh-body);
}

/* ---------------------------------------------------------------- Cláusulas */
/* [figma] el contenido abre 100 por debajo de la portada y las cláusulas se
   separan 64 entre sí (la 1 acaba en 116 y la 2 abre en 180). */

.acturion-legal__list {
	list-style: none;
	margin: var(--acturion-space-section) 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--acturion-space-9);
}

.acturion-legal__clause--narrow {
	max-width: var(--legal-narrow);
}

/* [figma] fila de 48: círculo en 0 y título en 72, o sea 24 de separación. */
.acturion-legal__head {
	display: flex;
	align-items: center;
	gap: var(--acturion-space-5);
	min-height: var(--legal-badge);
}

.acturion-legal__number {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--legal-badge);
	height: var(--legal-badge);
	border: 1px solid var(--acturion-dark-blue);
	border-radius: 50%;
	/* [figma MCP] el número va en BodyText_21 (caja de 25 = 21×1.2). */
	font-size: var(--acturion-body-21);
	line-height: 1;
}

/* [figma MCP] el título de cláusula es el subtítulo Medium 32/0.9 (1365:10807). */
.acturion-legal__clause-title {
	margin: 0;
	font-size: var(--acturion-subtitle);
	font-weight: var(--acturion-weight-medium);
	line-height: 0.9;
}

/* [figma] el cuerpo arranca en 72 desde el borde de la cláusula: 48 de la fila + 24. */
.acturion-legal__text {
	margin: var(--acturion-space-5) 0 0;
	font-size: var(--acturion-body);
	line-height: var(--acturion-lh-body);
}

/* ---------------------------------------------------------------- Listas */
/* [figma] filas de 24 cada 32 (8 de hueco), icono a la izquierda y texto en 40. */

.acturion-legal__points {
	list-style: none;
	margin: var(--acturion-space-5) 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--acturion-space-2);
}

.acturion-legal__point {
	display: flex;
	align-items: flex-start;
	gap: var(--acturion-space-4);
	font-size: var(--acturion-body);
	line-height: var(--acturion-lh-body);
}

.acturion-legal__point-icon {
	flex: 0 0 auto;
	display: inline-flex;
	/* Centra la flecha con la primera línea del texto: la caja del icono es 24 y la
	   línea de 18 a 1.2 mide 21.6. */
	margin-top: 1px;
}

/* Un párrafo que sigue a una lista recupera el aire de la lista, no el de la fila. */
.acturion-legal__points + .acturion-legal__text {
	margin-top: var(--acturion-space-6);
}