/* ARYF Legal pages — Privacy Policy, Terms of Service, Legal info.
 * Shared stylesheet. Inherits all tokens from home.css; this file only
 * adds prose typography rules for legal body content.
 *
 * No hero on these pages — they're text-and-information, premium but
 * quiet. A bare title block leads the body container directly. */

/* Modest top breathing room. The7 hooks add 100px padding-top to #main
 * on desktop (cleared to 0 on mobile <=1240px), so this stacks on top
 * of that. Tuned to feel composed, not airy-empty. */
.aryf-legal-section {
	padding-top: clamp(32px, 5vh, 60px);
}
/* Mobile loses the 100px #main clearance — restore some top space so
 * the title doesn't crowd the menu. */
@media (max-width: 1240px) {
	.aryf-legal-section {
		padding-top: clamp(48px, 8vh, 96px);
	}
}

/* Bare title block — eyebrow + h1, separated from the body by a thin
 * divider. Looks composed without screaming. */
.aryf-legal__header {
	margin-bottom: clamp(2rem, 4vw, 3rem);
	padding-bottom: clamp(1.4rem, 2.5vw, 2rem);
	border-bottom: 1px solid var(--c-border);
}

.aryf-legal__eyebrow {
	display: block;
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--c-blue);
	margin: 0 0 0.7rem;
}

.aryf-legal__title {
	font-size: clamp(1.85rem, 3.2vw, 2.6rem);
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: -0.022em;
	margin: 0;
	background: var(--text-grad-h2);
	-webkit-background-clip: text;
	        background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
@supports not (background-clip: text) {
	.aryf-legal__title { color: var(--c-text); }
}

/* Body container — narrow, generous line-height, readable for long-form. */
.aryf-legal__body {
	max-width: 760px;
	margin: 0 auto;
	color: var(--c-text-soft);
	font-size: 1.025rem;
	line-height: 1.75;
}

.aryf-legal__body > * + * {
	margin-top: 1.1rem;
}

/* Section heading */
.aryf-legal__body h2 {
	font-size: clamp(1.35rem, 2vw, 1.65rem);
	font-weight: 600;
	letter-spacing: -0.018em;
	margin-top: clamp(2.4rem, 4vw, 3.2rem);
	margin-bottom: 0.85rem;
	color: var(--c-text);
	text-shadow: var(--text-shadow-depth);
	scroll-margin-top: 100px;
}
.aryf-legal__body h2:first-child {
	margin-top: 0;
}

/* Sub-heading */
.aryf-legal__body h3 {
	font-size: 1.12rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	margin-top: 1.8rem;
	margin-bottom: 0.6rem;
	color: var(--c-text);
	text-shadow: var(--text-shadow-depth);
}

/* Body paragraphs */
.aryf-legal__body p {
	margin: 0 0 1.05rem;
	color: var(--c-text-soft);
}
.aryf-legal__body p:last-child {
	margin-bottom: 0;
}

/* Bold inline emphasis — use the primary text color so it pops. */
.aryf-legal__body strong {
	color: var(--c-text);
	font-weight: 600;
}

/* Links — accent color, subtle underline on hover. */
.aryf-legal__body a {
	color: var(--c-blue);
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, var(--c-blue) 30%, transparent);
	transition: border-color var(--dur-fast) ease, color var(--dur-fast) ease;
}
.aryf-legal__body a:hover {
	color: color-mix(in srgb, var(--c-blue) 80%, white 20%);
	border-bottom-color: var(--c-blue);
}

/* Bullet lists — custom-marker, design-system colored. */
.aryf-legal__body ul {
	list-style: none;
	padding: 0;
	margin: 0 0 1.1rem;
}
.aryf-legal__body ul li {
	position: relative;
	padding-left: 1.4rem;
	margin: 0 0 0.55rem;
	color: var(--c-text-soft);
}
.aryf-legal__body ul li:last-child {
	margin-bottom: 0;
}
.aryf-legal__body ul li::before {
	content: '';
	position: absolute;
	left: 0.2rem;
	top: 0.7em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--c-blue);
	opacity: 0.85;
}

/* Nested list (rare in legal but possible). */
.aryf-legal__body ul ul {
	margin-top: 0.5rem;
	margin-left: 0.5rem;
}
.aryf-legal__body ul ul li::before {
	background: var(--c-text-mute);
	width: 4px;
	height: 4px;
}

/* Numbered list — uses the section number style. */
.aryf-legal__body ol {
	list-style: decimal;
	padding-left: 1.4rem;
	margin: 0 0 1.1rem;
	color: var(--c-text-soft);
}
.aryf-legal__body ol li {
	margin: 0 0 0.55rem;
	padding-left: 0.3rem;
}
.aryf-legal__body ol li::marker {
	color: var(--c-blue);
	font-weight: 600;
}

/* Contact block at the end — slightly more breathing room. */
.aryf-legal__body .aryf-legal__contact {
	margin-top: 2.5rem;
	padding: 1.4rem 1.6rem;
	background: var(--surface-card);
	border: 1px solid var(--c-border);
	border-radius: var(--r-card);
	box-shadow: var(--shadow-card);
}
.aryf-legal__body .aryf-legal__contact > * + * { margin-top: 0.4rem; }
