/* Brand bridge: legal pages inherit the Cyca palette from styles.css.
   Cream page, warm cards — no plain white/gray anywhere. */
:root{
  --bg:            #efe9d8;
  --card:          #fffdf3;
  --ink:           #0b2018;
  --ink-soft:      #4a6152;
  --green:         #14804a;
  --green-bright:  #2cbf6d;
  --green-deep:    #003c26;
  --dark:          #0b2018;
  --on-dark:       #f6f2e2;
  --on-dark-soft:  #a9c6b4;
  --shadow-hover:  0 20px 44px -20px rgba(0,60,38,.28);
  --r-card:        24px;
  --ease:          cubic-bezier(.4,0,.2,1);
}
body{ background: var(--bg); color: var(--ink); }

/* ============================================================
   legal.css — content-first legal pages. Inherits the site
   design system (tokens in styles.css). Readable measure,
   sticky TOC, print-friendly.
   ============================================================ */

.legal-wrap {
  max-width: 1200px; margin-inline: auto;
  padding-inline: clamp(20px, 4vw, 40px);
  padding-top: 108px; padding-bottom: clamp(64px, 8vw, 120px);
  display: grid; gap: clamp(28px, 4vw, 56px);
}
@media (min-width: 1024px) {
  .legal-wrap { grid-template-columns: 260px minmax(0, 1fr); align-items: start; }
}

/* ---------------- Sticky table of contents ---------------- */
.toc {
  position: static;
  background: var(--card); border-radius: var(--r-card);
  padding: 24px;
}
@media (min-width: 1024px) {
  .toc { position: sticky; top: 84px; max-height: calc(100vh - 108px); overflow: auto; }
}
.toc h2 {
  font-size: 13px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--ink-soft); margin-bottom: 14px;
}
.toc ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; counter-reset: toc; }
.toc a {
  display: block; padding: 7px 10px; border-radius: 10px;
  font-size: 14.5px; line-height: 1.35; color: var(--ink-soft);
  transition: background 200ms var(--ease), color 200ms var(--ease);
}
.toc a:hover { background: rgba(0,60,38,.07); color: var(--ink); }
.toc a.is-active { background: rgba(0, 83, 54, 0.08); color: var(--green); font-weight: 600; }
.toc__back {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 18px; padding-top: 16px;
  border-top: 1px solid rgba(0,60,38,0.12);
  font-size: 14px; font-weight: 600; color: var(--green);
}
.toc__back:hover { color: var(--green-deep); }

/* ---------------- Document body ---------------- */
.doc { min-width: 0; }
.doc__head { margin-bottom: 36px; }
.doc__head h1 {
  font-size: clamp(34px, 5vw, 56px); font-weight: 800;
  letter-spacing: -0.02em; line-height: 1.05; margin-bottom: 14px;
}
.doc__dates { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 14.5px; color: var(--ink-soft); }
.doc__dates b { color: var(--ink); font-weight: 600; }

/* Plain summary callout */
.summary {
  background: #f4f0d4; border-radius: 20px;
  padding: 24px 26px; margin-bottom: 44px;
}
.summary h2 {
  font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--green); margin-bottom: 10px;
  display: flex; align-items: center; gap: 8px;
}
.summary p { color: #3f5347; font-size: 16.5px; line-height: 1.6; max-width: 68ch; }
.summary p + p { margin-top: 10px; }
.summary strong { color: var(--ink); font-weight: 700; }

/* Sections */
.doc section { scroll-margin-top: 90px; margin-bottom: 46px; }
.doc h2.sec-title {
  font-size: clamp(22px, 2.4vw, 30px); font-weight: 800; letter-spacing: -0.015em;
  line-height: 1.2; margin-bottom: 14px; padding-top: 6px;
}
.doc .plain {
  border-left: 3px solid var(--green-bright);
  padding: 2px 0 2px 16px; margin-bottom: 18px;
  color: var(--ink); font-size: 16.5px; line-height: 1.6; max-width: 68ch;
}
.doc .plain b { font-weight: 700; }
.doc p, .doc li { max-width: 72ch; line-height: 1.7; color: #3c5145; }
.doc p + p { margin-top: 14px; }
.doc ul, .doc ol { margin-top: 14px; padding-left: 22px; display: grid; gap: 9px; }
.doc li::marker { color: var(--green); }
.doc strong { color: var(--ink); font-weight: 600; }
.doc a:not(.pill):not(.toc__back) {
  color: var(--green); text-decoration: underline; text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.doc a:not(.pill):not(.toc__back):hover { color: var(--green-deep); }
.doc code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9em; background: rgba(0,60,38,.09); padding: 2px 6px; border-radius: 6px;
}

/* Definition / key-value table */
.deftable { width: 100%; border-collapse: collapse; margin-top: 16px; font-size: 16px; }
.deftable th, .deftable td { text-align: left; padding: 12px 14px; vertical-align: top; border-bottom: 1px solid rgba(0,60,38,0.12); }
.deftable th { font-weight: 700; color: var(--ink); width: 34%; }
.deftable td { color: #3c5145; }
.deftable tr:last-child th, .deftable tr:last-child td { border-bottom: 0; }
.table-scroll { overflow-x: auto; }

/* Callout — important notice */
.note {
  border-radius: 16px; padding: 18px 20px; margin-top: 18px;
  background: #fdf1ea; border: 1px solid rgba(255, 59, 48, 0.24);
}
.note b { color: #b3271f; }
.note p { color: #6b3a36; max-width: 68ch; }

/* Cross-links to sibling docs */
.crosslinks { margin-top: 56px; padding-top: 32px; border-top: 1px solid rgba(0,60,38,0.14); }
.crosslinks h2 { font-size: 18px; font-weight: 700; margin-bottom: 18px; }
.crosslinks .grid { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .crosslinks .grid { grid-template-columns: 1fr 1fr; } }
.xlink {
  display: block; background: var(--card); border-radius: 18px; padding: 18px 20px;
  transition: transform 250ms var(--ease), box-shadow 250ms var(--ease);
}
@media (hover: hover) { .xlink:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); } }
.xlink:active { transform: scale(0.98); }
.xlink b { display: block; font-size: 16px; font-weight: 700; color: var(--ink); margin-bottom: 3px; }
.xlink span { font-size: 14.5px; color: var(--ink-soft); }

/* ---------------- Legal hub ---------------- */
.hub { max-width: 900px; margin-inline: auto; padding-inline: clamp(20px,4vw,40px);
       padding-top: 120px; padding-bottom: clamp(64px,8vw,120px); }
.hub__head { margin-bottom: 40px; }
.hub__wm { height: 46px; width: auto; margin-bottom: 20px; }
.hub__head h1 { font-size: clamp(38px, 6vw, 64px); font-weight: 800; letter-spacing: -0.02em; line-height: 1.04; }
.hub__head p { margin-top: 16px; font-size: 19px; color: var(--ink-soft); max-width: 60ch; line-height: 1.6; }
.hub__grid { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 700px) { .hub__grid { grid-template-columns: 1fr 1fr; } }
.hub__card {
  position: relative; display: block;
  background: var(--card); border-radius: var(--r-card); padding: 28px;
  transition: transform 250ms var(--ease), box-shadow 250ms var(--ease);
}
@media (hover: hover) { .hub__card:hover { transform: translateY(-6px); box-shadow: var(--shadow-hover); } }
.hub__card:active { transform: scale(0.98); }
.hub__card h2 { font-size: 21px; font-weight: 700; letter-spacing: -0.01em; margin-bottom: 8px; }
.hub__card p { font-size: 15.5px; color: var(--ink-soft); line-height: 1.55; max-width: 42ch; }
.hub__card .go {
  margin-top: 16px; display: inline-flex; align-items: center; gap: 6px;
  font-size: 14.5px; font-weight: 600; color: var(--green);
}
.hub__note { margin-top: 36px; font-size: 15px; color: var(--ink-soft); }

/* ---------------- Print ---------------- */
@media print {
  .nav, .toc, .crosslinks, .site-footer, .legal-cta { display: none !important; }
  body { background: #fff; font-size: 11pt; }
  .legal-wrap { display: block; padding: 0; max-width: none; }
  .doc section { break-inside: avoid; margin-bottom: 22pt; }
  .doc h2.sec-title { break-after: avoid; font-size: 14pt; }
  .summary { border: 1pt solid #999; background: #fff; }
  .doc p, .doc li { max-width: none; color: #000; }
  a { color: #000 !important; text-decoration: none !important; }
  .doc__head h1 { font-size: 22pt; }
}

/* Site footer lives in styles.css — single source, one footer sitewide. */