/* ── Loku Legal Pages ─────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600;8..60,700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --raspberry-500: #F30061;
  --raspberry-50:  #FDE8EE;
  --worn-cherry-500: #C1124D;
  --peach-500: #FF7A45;
  --peach-50:  #FFF1EC;
  --neutral-0:   #FFFFFF;
  --neutral-50:  #F5F5F5;
  --neutral-100: #EDEDED;
  --neutral-200: #CFCFCF;
  --neutral-400: #949494;
  --neutral-600: #6B6B6B;
  --neutral-700: #4A4A4A;
  --neutral-900: #212121;
  --font-serif: "Source Serif 4", "New York", Georgia, serif;
  --font-sans:  -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif;
  --max: 920px;
  --pad: clamp(20px, 4vw, 36px);
  --radius-md: 16px;
  --radius-lg: 20px;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.6;
  color: var(--neutral-900);
  background: var(--neutral-50);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--raspberry-500); text-decoration: none; transition: color 0.15s; }
a:hover { color: var(--worn-cherry-500); text-decoration: underline; }

/* ── NAV ── */
.legal-nav {
  background: var(--neutral-0);
  border-bottom: 1px solid var(--neutral-100);
  position: sticky; top: 0; z-index: 50;
  backdrop-filter: blur(12px) saturate(140%);
  -webkit-backdrop-filter: blur(12px) saturate(140%);
}
.legal-nav-inner {
  max-width: var(--max); margin: 0 auto;
  padding: 14px var(--pad);
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px;
}
.wordmark {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-serif); font-weight: 600;
  font-size: 24px; letter-spacing: -0.03em;
  color: var(--neutral-900);
  text-decoration: none;
}
.wordmark:hover { text-decoration: none; color: var(--neutral-900); }
.wordmark img { height: 30px; width: auto; display: block; transform: translateY(-1px); }
.wordmark .dot { color: var(--raspberry-500); }
.back-link {
  font-size: 14px; font-weight: 500;
  color: var(--neutral-600);
}
.back-link:hover { color: var(--neutral-900); text-decoration: none; }

/* ── PAGE ── */
.legal-page {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(40px, 6vw, 72px) var(--pad) clamp(60px, 8vw, 96px);
  background: var(--neutral-0);
  min-height: calc(100vh - 200px);
}
.legal-header {
  margin-bottom: 32px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--neutral-100);
}
.legal-eyebrow {
  display: inline-block;
  font-size: 12px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--peach-500);
  background: var(--peach-50);
  padding: 5px 12px;
  border-radius: 999px;
  margin-bottom: 16px;
}
.legal-page h1 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(36px, 5vw, 52px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 0 0 12px;
  color: var(--neutral-900);
}
.legal-meta {
  font-size: 14px;
  color: var(--neutral-600);
  margin: 0;
}

/* ── CALLOUT ── */
.legal-callout {
  background: linear-gradient(180deg, var(--peach-50) 0%, #FFF8F4 100%);
  border: 1px solid #FFD9C5;
  border-radius: var(--radius-lg);
  padding: 24px 28px;
  margin: 32px 0;
}
.legal-callout strong:first-child {
  display: block;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 18px;
  color: var(--worn-cherry-500);
  letter-spacing: -0.01em;
  margin-bottom: 8px;
}
.legal-callout p {
  margin: 8px 0 0;
  font-size: 15px;
  color: var(--neutral-700);
  line-height: 1.55;
}
.legal-callout ul { margin: 8px 0 0 0; padding-left: 20px; }
.legal-callout li { margin: 6px 0; font-size: 15px; color: var(--neutral-700); }

/* ── TOC ── */
.legal-toc {
  background: var(--neutral-50);
  border: 1px solid var(--neutral-100);
  border-radius: var(--radius-md);
  padding: 24px 28px;
  margin: 32px 0 48px;
}
.legal-toc h2 {
  margin: 0 0 14px;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--neutral-600);
}
.legal-toc ol {
  margin: 0; padding: 0;
  list-style: none;
  counter-reset: toc-counter;
  columns: 2;
  column-gap: 32px;
}
@media (max-width: 640px) { .legal-toc ol { columns: 1; } }
.legal-toc li {
  counter-increment: toc-counter;
  padding: 4px 0;
  break-inside: avoid;
  font-size: 15px;
}
.legal-toc li::before {
  content: counter(toc-counter) ". ";
  color: var(--neutral-400);
  font-variant-numeric: tabular-nums;
}
.legal-toc a {
  color: var(--neutral-700);
  font-weight: 500;
}
.legal-toc a:hover { color: var(--raspberry-500); }

/* ── CONTENT ── */
.legal-content section {
  scroll-margin-top: 80px;
  margin-bottom: 48px;
}
.legal-content h2 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: clamp(24px, 3vw, 30px);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--neutral-900);
  margin: 0 0 18px;
  padding-top: 8px;
}
.legal-content h3 {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 19px;
  line-height: 1.3;
  color: var(--neutral-900);
  margin: 28px 0 10px;
}
.legal-content h4 {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 16px;
  line-height: 1.3;
  color: var(--neutral-900);
  margin: 20px 0 8px;
}
.legal-content p {
  margin: 0 0 14px;
  color: var(--neutral-700);
  line-height: 1.65;
}
.legal-content strong { color: var(--neutral-900); font-weight: 600; }
.legal-content ul, .legal-content ol {
  margin: 0 0 16px;
  padding-left: 24px;
  color: var(--neutral-700);
}
.legal-content li { margin: 6px 0; line-height: 1.6; }
.legal-content li > p { margin: 6px 0; }
.legal-content .uppercase-block {
  font-size: 14px;
  letter-spacing: 0.01em;
  background: var(--neutral-50);
  border-left: 3px solid var(--neutral-200);
  padding: 14px 18px;
  margin: 16px 0;
  border-radius: 0 8px 8px 0;
  color: var(--neutral-700);
}
.legal-content .lead {
  font-size: 18px;
  color: var(--neutral-900);
  font-weight: 500;
  line-height: 1.55;
  margin-bottom: 18px;
}

/* ── TABLES ── */
.legal-table-wrap {
  overflow-x: auto;
  margin: 16px 0 24px;
  border: 1px solid var(--neutral-100);
  border-radius: 12px;
}
.legal-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  line-height: 1.5;
}
.legal-content th,
.legal-content td {
  text-align: left;
  vertical-align: top;
  padding: 12px 14px;
  border-bottom: 1px solid var(--neutral-100);
}
.legal-content th {
  background: var(--neutral-50);
  font-weight: 600;
  color: var(--neutral-900);
  font-size: 13px;
}
.legal-content tr:last-child td { border-bottom: none; }
.legal-content td ul { margin: 0; padding-left: 18px; }
.legal-content td ul li { margin: 3px 0; }

/* ── FOOTER ── */
.legal-foot {
  border-top: 1px solid var(--neutral-100);
  background: var(--neutral-0);
}
.legal-foot-inner {
  max-width: var(--max); margin: 0 auto;
  padding: 24px var(--pad);
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; color: var(--neutral-600);
  gap: 12px;
}
.legal-foot-links { display: flex; gap: 18px; }
.legal-foot-links a { color: var(--neutral-600); }
.legal-foot-links a:hover { color: var(--neutral-900); text-decoration: none; }
@media (max-width: 540px) {
  .legal-foot-inner { flex-direction: column; align-items: flex-start; }
}

/* ── DIVIDER ── */
hr.section-break {
  border: none;
  border-top: 1px solid var(--neutral-100);
  margin: 32px 0;
}