/* =========================================================================
   legal.css — mise en page des pages statiques (mentions légales, CGU,
   confidentialité, cookies). Réutilise les variables de style.css ; pas de
   dépendance à app.js, ces pages restent lisibles même si le script principal
   échoue à charger.
   ========================================================================= */

.legal-header {
	padding: calc(env(safe-area-inset-top) + 18px) var(--pad) 0;
}

.legal-header__back {
	color: var(--text-soft);
	text-decoration: none;
	font-size: 13px;
}
.legal-header__back:hover {
	color: var(--text);
}
.legal-header__back:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
}

.legal {
	flex: 1;
	width: 100%;
	max-width: 640px;
	margin: 0 auto;
	padding: 28px var(--pad) 60px;
}

.legal h1 {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 4px;
}

.legal__updated {
	color: var(--text-faint);
	font-size: 12px;
	margin: 0 0 32px;
}

.legal h2 {
	font-size: 15px;
	font-weight: 600;
	margin: 36px 0 10px;
}

.legal p,
.legal li {
	color: var(--text-soft);
	line-height: 1.65;
}

.legal strong {
	color: var(--text);
}

.legal a {
	color: var(--accent);
	text-decoration: none;
}
.legal a:hover {
	text-decoration: underline;
}

.legal table {
	width: 100%;
	border-collapse: collapse;
	margin: 16px 0;
	font-size: 13px;
}

.legal th,
.legal td {
	text-align: left;
	padding: 8px 10px;
	border-bottom: 1px solid var(--line);
	vertical-align: top;
}

.legal th {
	color: var(--text-faint);
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.legal-footer {
	flex: none;
	padding: 18px var(--pad) calc(env(safe-area-inset-bottom) + 18px);
	border-top: 1px solid var(--line-soft);
}

.legal-footer nav {
	max-width: 640px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
}

.legal-footer a {
	color: var(--text-faint);
	font-size: 11px;
	text-decoration: none;
}
.legal-footer a:hover {
	color: var(--text-soft);
}
