/* Legal pages: Privacy, Terms, Cookies.

   One document layout for all three: a quiet header with tabs between the
   documents, a sticky contents list that follows the reader, and numbered
   sections in a readable column. The wording of each policy is unchanged;
   the "Last updated" line is shown as a draft notice because the policies
   are still templates awaiting legal review. */

.lg { --ink: #161727; --body: #434357; --mute: #70707f; --line: rgba(22, 23, 39, .1); --accent: #5a29ad; font-family: 'Sora', system-ui, sans-serif; }

.lg-hero { position: relative; overflow: hidden; padding: 56px 0 0; background: linear-gradient(180deg, #f8f8f9, #fff); border-bottom: 1px solid var(--line); }
.lg-hero::before { content: ""; position: absolute; inset: 0; background-image: repeating-linear-gradient(0deg, rgba(22, 23, 39, .035) 0 1px, transparent 1px 30px); -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); mask-image: linear-gradient(180deg, #000, transparent 85%); pointer-events: none; }
.lg-hero .container { position: relative; }
.lg-kick { font: 700 12px 'Sora', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.lg-h1 { margin-top: 14px; font: 700 clamp(34px, 4.4vw, 52px)/1.06 'Sora', sans-serif; letter-spacing: -.035em; color: var(--ink); }
.lg-sub { margin-top: 14px; max-width: 640px; font-size: 17px; line-height: 1.6; color: var(--body); }
.lg-draft { display: inline-flex; align-items: center; gap: 10px; margin-top: 20px; padding: 9px 14px; border-radius: 10px; background: #fdf4e5; border: 1px solid rgba(154, 91, 0, .25); font-size: 13.5px; font-weight: 500; color: #7a4a05; }
.lg-draft::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #d97706; flex-shrink: 0; }
.lg-tabs { display: flex; gap: 4px; margin-top: 32px; overflow-x: auto; }
.lg-tabs a { padding: 12px 16px; border-bottom: 2px solid transparent; font-size: 14.5px; font-weight: 600; color: var(--mute); white-space: nowrap; transition: color .2s, border-color .2s; }
.lg-tabs a:hover { color: var(--ink); }
.lg-tabs a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--accent); }

.lg-body { padding: 48px 0 88px; }
.lg-grid { display: grid; gap: 32px; }
@media (min-width: 1000px) { .lg-grid { grid-template-columns: 240px minmax(0, 1fr); gap: 72px; align-items: start; } }
.lg-toc { position: relative; }
@media (min-width: 1000px) { .lg-toc { position: sticky; top: 110px; } }
.lg-toc p { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--mute); }
.lg-toc ol { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 2px; counter-reset: t; }
.lg-toc a { display: flex; gap: 10px; padding: 8px 12px; border-radius: 8px; border-left: 2px solid transparent; font-size: 14px; line-height: 1.35; color: var(--body); counter-increment: t; transition: background .2s, color .2s, border-color .2s; }
.lg-toc a::before { content: counter(t, decimal-leading-zero); font: 600 12px ui-monospace, Menlo, monospace; color: var(--mute); padding-top: 1px; }
.lg-toc a:hover { background: #f7f6f9; color: var(--ink); }
.lg-toc a.on { background: #f5f2fa; border-left-color: var(--accent); color: var(--ink); font-weight: 600; }
@media (max-width: 999px) { .lg-toc ol { grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); } }

.lg-doc { max-width: 720px; counter-reset: s; }
.lg-sec { padding: 28px 0; border-top: 1px solid var(--line); scroll-margin-top: 100px; counter-increment: s; }
.lg-sec:first-child { border-top: none; padding-top: 0; }
.lg-sec h2 { display: flex; align-items: baseline; gap: 14px; font: 600 22px/1.3 'Sora', sans-serif; letter-spacing: -.015em; color: var(--ink); }
.lg-sec h2::before { content: counter(s, decimal-leading-zero); font: 600 13px ui-monospace, Menlo, monospace; color: var(--accent); }
.lg-sec p { margin-top: 14px; font-size: 16px; line-height: 1.75; color: var(--body); }
.lg-sec a { color: var(--accent); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.lg-contact { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin-top: 28px; padding: 24px 26px; border-radius: 18px; background: #161727; color: #fff; }
.lg-contact b { display: block; font: 600 18px 'Sora', sans-serif; }
.lg-contact span { font-size: 14px; color: rgba(255, 255, 255, .65); }
.lg-contact a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 10px; background: #fff; color: #161727; font-size: 14.5px; font-weight: 600; text-decoration: none; }