/* legal.css: plain reading layout with an in-page index (privacy, terms, affiliates). Loaded after hub.css. Tokens only. */

.ph .c-stats { margin-top: clamp(28px, 4vw, 56px); }

.l-wrap { display: grid; gap: var(--space-6); }
@media (min-width: 1000px) {
  .l-wrap { grid-template-columns: 17rem minmax(0, 1fr); gap: var(--space-9); align-items: start; }
  .l-toc { position: sticky; top: calc(var(--nav-h) + 24px); max-height: calc(100vh - var(--nav-h) - 48px); max-height: calc(100dvh - var(--nav-h) - 48px); overflow-y: auto; }
}

/* In-page index */
.l-toc details { border-top: 1px solid var(--text); }
.l-toc summary { display: flex; align-items: center; justify-content: space-between; min-height: 56px; font-family: var(--font-display); font-weight: 600; font-size: 0.8125rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text); list-style: none; }
.l-toc summary::-webkit-details-marker { display: none; }
.l-toc summary .i { width: 20px; height: 20px; transition: transform var(--dur-3) var(--ease-out); }
.l-toc details[open] summary .i { transform: rotate(45deg); }
@media (min-width: 1000px) { .l-toc summary { pointer-events: none; } .l-toc summary .i { display: none; } }
.l-toc ol { display: grid; }
.sec .l-toc li a:not(.c-btn):not(.c-link) { text-decoration: none; }
.l-toc li a { display: flex; gap: 10px; align-items: baseline; min-height: 44px; padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--text-dim); text-decoration: none; font-weight: 600; font-size: 0.9375rem; line-height: 1.3; }
.sec .l-toc li a:not(.c-btn):not(.c-link):hover { color: var(--text); text-decoration: underline; }
.l-toc__n { flex: none; min-width: 1.6em; font-family: var(--font-mono); font-size: 0.8125rem; color: var(--text-faint); }

/* Reading column */
.l-body { max-width: 72ch; }
.l-summary { border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface); padding: var(--space-5); margin-bottom: var(--space-7); }
.l-summary__h { font-family: var(--font-display); font-weight: 600; font-size: 0.8125rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-dim); margin-bottom: var(--space-2); }
.l-summary p:not(.l-summary__h) { color: var(--text); line-height: 1.65; }

.l-body h2 { font-size: var(--step-2); line-height: 1.15; letter-spacing: -0.02em; margin: var(--space-8) 0 var(--space-4); padding-top: var(--space-5); border-top: 1px solid var(--line); scroll-margin-top: calc(var(--nav-h) + 16px); }
.l-body > h2:first-of-type, .l-summary + h2 { margin-top: 0; }
.l-body h2 .legal-num { display: block; margin-bottom: var(--space-2); font-family: var(--font-display); font-weight: 600; font-size: 0.8125rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-dim); }
.l-body h3 { font-size: var(--step-1); line-height: 1.25; letter-spacing: -0.015em; margin: var(--space-6) 0 var(--space-2); }
.l-body p, .l-body li { line-height: 1.7; }
.l-body p { margin-bottom: var(--space-4); color: var(--text); }
.l-body ul, .l-body ol { margin: 0 0 var(--space-4); padding-left: 1.4em; list-style: disc; }
.l-body ol { list-style: decimal; }
.l-body li { margin-bottom: 6px; padding-left: 4px; }
.l-body li::marker { color: var(--text-faint); }
.l-body a { color: var(--brand); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; font-weight: 600; overflow-wrap: anywhere; }
.l-body a:hover { color: var(--brand-strong); }
.l-body strong { font-weight: 700; }

/* Tables (affiliate commissions and any legal table) */
.l-body table, .legal-table { width: 100%; border-collapse: collapse; margin: var(--space-5) 0 var(--space-6); font-size: 0.9375rem; }
.l-body th, .l-body td { text-align: left; padding: 14px 16px 14px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.l-body thead th { font-family: var(--font-display); font-weight: 600; font-size: 0.8125rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-dim); border-bottom: 1px solid var(--text); }
.l-body td:last-child, .l-body th:last-child { text-align: right; font-variant-numeric: tabular-nums; padding-right: 0; }

/* Affiliate call to action at the end of the body */
.aff-cta { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.aff-cta .c-hero__ctas { margin-top: 0; }
.aff-cta .c-btn { text-decoration: none; }
.l-body a.c-btn { font-weight: 700; text-decoration: none; }
.l-body a.c-btn--primary { color: var(--on-brand); }
.l-body a.c-btn:not(.c-btn--primary) { color: var(--text); }