/* =========================================================================
   Legal pages — refined reference-doc chrome for /privacy/ and /terms/
   (EN+FR). Layered over the generic page.php / page.css shell via the
   .is-legal body class set by inc/legal.php. No manifest hero, no
   page-cta — these are reference docs, not pitches.
   ========================================================================= */

/* Re-page the wrapper: legal pages get a tighter measure than the generic
   960px column so the body reads like a long-form document, not a marketing
   page. */
.id30-page--legal {
	max-width: 760px;
	padding: 140px 24px 120px;
}

@media (min-width: 900px) {
	.id30-page--legal { padding-top: 168px; }
}

/* --- Header ----------------------------------------------------------- */

.id30-page--legal .id30-page__header {
	margin-bottom: 56px;
	border-bottom: 1px solid var(--color-line);
	padding-bottom: 32px;
}

/* Eyebrow — echoes .id30-page-manifest__stamp at a smaller scale. */
.id30-page__stamp {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 24px;
	font-family: var(--font-mono);
	font-size: 11px;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--color-ember);
}
.id30-page__stamp-tick {
	display: inline-block;
	width: 18px;
	height: 1px;
	background-color: var(--color-ember);
}

.id30-page--legal .id30-page__title {
	font-family: var(--font-title);
	font-weight: 300;
	font-size: clamp(2rem, 4.6vw, 3.4rem);
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: var(--color-ink);
	margin: 0 0 20px;
	max-width: 24ch;
}

.id30-page__updated {
	margin: 0;
	font-family: var(--font-mono);
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var(--color-slate);
}

/* --- Body typography -------------------------------------------------- */

.id30-page--legal .id30-page__content {
	font-family: var(--font-body);
	font-size: 17px;
	line-height: 1.75;
	color: var(--color-graphite);
	max-width: 70ch;
}

.id30-page--legal .id30-page__content p { margin: 0 0 22px; }
.id30-page--legal .id30-page__content p:last-child { margin-bottom: 0; }

/* H2 — section break with a small ember rule above, the same brand
   signature used on the manifest hero but reduced for body context. */
.id30-page--legal .id30-page__content h2 {
	position: relative;
	font-family: var(--font-title);
	font-weight: 400;
	font-size: clamp(1.4rem, 2.4vw, 1.7rem);
	line-height: 1.2;
	letter-spacing: -0.012em;
	color: var(--color-ink);
	margin: 64px 0 18px;
	padding-top: 20px;
}
.id30-page--legal .id30-page__content h2::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 28px;
	height: 1px;
	background-color: var(--color-ember);
	opacity: 0.85;
}
.id30-page--legal .id30-page__content > h2:first-child { margin-top: 0; }

/* H3 — sub-section, no rule, slightly tighter rhythm. */
.id30-page--legal .id30-page__content h3 {
	font-family: var(--font-title);
	font-weight: 500;
	font-size: 1.1rem;
	line-height: 1.3;
	letter-spacing: -0.005em;
	color: var(--color-graphite);
	margin: 36px 0 12px;
}

/* Inline elements. */
.id30-page--legal .id30-page__content a {
	color: var(--color-ember);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: color 180ms var(--ease-spring);
}
.id30-page--legal .id30-page__content a:hover,
.id30-page--legal .id30-page__content a:focus-visible {
	color: var(--color-deep);
}

.id30-page--legal .id30-page__content strong { font-weight: 600; color: var(--color-ink); }

.id30-page--legal .id30-page__content code {
	font-family: var(--font-mono);
	font-size: 0.92em;
	background: var(--color-line);
	padding: 1px 6px;
	border-radius: 3px;
	color: var(--color-ink);
}

/* Lists — bring back markers (base reset strips ul list-style) and align
   them ember to match the inline link colour. */
.id30-page--legal .id30-page__content ul,
.id30-page--legal .id30-page__content ol {
	list-style: revert;
	padding-left: 1.4em;
	margin: 0 0 22px;
}
.id30-page--legal .id30-page__content li {
	margin-bottom: 8px;
}
.id30-page--legal .id30-page__content li::marker { color: var(--color-ember); }

/* Blockquote. */
.id30-page--legal .id30-page__content blockquote {
	margin: 28px 0;
	padding: 4px 0 4px 20px;
	border-left: 2px solid var(--color-ember);
	color: var(--color-slate);
	font-style: italic;
}
.id30-page--legal .id30-page__content blockquote p:last-child { margin-bottom: 0; }

/* Tables. */
.id30-page--legal .id30-page__content table {
	width: 100%;
	border-collapse: collapse;
	margin: 24px 0;
	font-size: 15px;
}
.id30-page--legal .id30-page__content th,
.id30-page--legal .id30-page__content td {
	padding: 10px 12px;
	text-align: left;
	border-bottom: 1px solid var(--color-line);
}
.id30-page--legal .id30-page__content th {
	font-family: var(--font-title);
	font-weight: 500;
	color: var(--color-ink);
}
.id30-page--legal .id30-page__content tr:nth-child(even) td {
	background: var(--color-paper);
}

/* Horizontal rule. */
.id30-page--legal .id30-page__content hr {
	border: 0;
	border-top: 1px solid var(--color-line);
	margin: 48px 0;
}

/* Address block — useful for the legal entity in /terms/. */
.id30-page--legal .id30-page__content address {
	font-style: normal;
	color: var(--color-graphite);
	margin: 0 0 22px;
	line-height: 1.6;
}
