/* ==========================================================================
   Everglades Communications — legal documents
   Loads after style.css and reuses its tokens, nav, buttons and footer.
   These pages deliberately drop the canvas landscape: they are paperwork,
   and they should read like paperwork.
   ========================================================================== */

body.legal { overflow-x: visible; }

/* ---------- document head ---------- */
.doc-head {
  padding: 140px var(--gutter) 0;
  max-width: 1200px; margin: 0 auto;
}
.doc-head .back {
  font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
  color: var(--ink-50); text-decoration: none; display: inline-block; margin-bottom: 28px;
}
.doc-head .back:hover { color: var(--ink); }
.doc-head .kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: .14em;
  color: var(--saw); margin: 0 0 14px;
}
.doc-head h1 {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(38px, 6.4vw, 76px); line-height: 1.02; letter-spacing: -.015em;
  margin: 0 0 26px; max-width: 20ch;
}
.doc-head .standfirst {
  font-size: clamp(17px, 1.5vw, 20px); line-height: 1.55;
  color: var(--ink-70); max-width: 58ch; margin: 0 0 40px;
}

/* the filing strip — effective date, version, entity */
.doc-meta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1px; background: var(--rule);
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
.doc-meta > div { background: var(--paper); padding: 18px 20px 20px; }
.doc-meta dt {
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em;
  color: var(--ink-50); margin: 0 0 7px;
}
.doc-meta dd { margin: 0; font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; }

/* ---------- body: sticky contents beside the text ---------- */
.doc-wrap {
  max-width: 1200px; margin: 0 auto; padding: 0 var(--gutter);
  display: grid; grid-template-columns: 220px minmax(0, 1fr);
  gap: clamp(32px, 6vw, 88px);
  align-items: start;
}
.toc {
  position: sticky; top: 96px; padding-top: 56px;
  max-height: calc(100vh - 120px); overflow-y: auto; overscroll-behavior: contain;
}
.toc h2 {
  font-family: var(--mono); font-weight: 400; font-size: 10px; letter-spacing: .14em;
  color: var(--ink-50); margin: 0 0 14px;
}
.toc ol { list-style: none; margin: 0; padding: 0; }
.toc li { margin: 0 0 9px; line-height: 1.35; }
.toc a {
  text-decoration: none; color: var(--ink-70); font-size: 14px;
  display: grid; grid-template-columns: 26px 1fr; gap: 4px;
}
.toc a .n {
  font-family: var(--mono); font-size: 11px; color: var(--ink-50);
}
.toc a:hover { color: var(--ink); }
.toc a:hover .n { color: var(--saw); }

.doc { padding: 56px 0 24px; max-width: 72ch; }
.doc section { margin: 0 0 52px; scroll-margin-top: 92px; }
.doc h2 {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(24px, 2.6vw, 31px); line-height: 1.2; letter-spacing: -.01em;
  margin: 0 0 16px; display: grid; grid-template-columns: 52px 1fr; align-items: baseline;
}
.doc h2 .num {
  font-family: var(--mono); font-size: 12px; color: var(--saw); letter-spacing: .08em;
}
.doc h3 {
  font-family: var(--body); font-weight: 700; font-size: 16px;
  margin: 28px 0 10px; color: var(--ink);
}
.doc p, .doc li { font-size: 16.5px; line-height: 1.68; color: var(--ink-70); }
.doc p { margin: 0 0 15px; }
.doc strong { color: var(--ink); font-weight: 700; }
.doc a { color: var(--water); text-decoration: underline; text-underline-offset: 2px; }
.doc ul, .doc ol { margin: 0 0 15px; padding-left: 22px; }
.doc li { margin: 0 0 8px; }
.doc li::marker { color: var(--ink-30); }

/* a defined term, and the ledger-style tables the compliance copy leans on */
.doc dl.terms { margin: 0 0 15px; }
.doc dl.terms dt { font-weight: 700; color: var(--ink); margin: 14px 0 4px; font-size: 16px; }
.doc dl.terms dd { margin: 0; font-size: 16.5px; line-height: 1.68; color: var(--ink-70); }

.doc .table-wrap { overflow-x: auto; margin: 0 0 18px; }
.doc table { border-collapse: collapse; width: 100%; min-width: 460px; }
.doc th {
  font-family: var(--mono); font-weight: 400; font-size: 10px; letter-spacing: .12em;
  color: var(--ink-50); text-align: left; padding: 0 14px 10px 0;
  border-bottom: 1px solid var(--rule);
}
.doc td {
  font-size: 15.5px; line-height: 1.5; color: var(--ink-70);
  padding: 13px 14px 13px 0; border-bottom: 1px solid var(--rule-soft); vertical-align: top;
}
.doc td:first-child { color: var(--ink); font-weight: 500; white-space: nowrap; }
.doc td.mono, .doc th.mono { font-family: var(--mono); font-size: 13px; }

/* a callout for the clauses a reader must not skim past */
.doc .notice {
  border-left: 2px solid var(--saw); padding: 4px 0 4px 20px; margin: 0 0 20px;
}
.doc .notice p { margin: 0 0 10px; }
.doc .notice p:last-child { margin: 0; }
.doc .notice.hard { border-left-color: var(--water); }

.doc .updated {
  margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--rule);
  font-family: var(--mono); font-size: 11px; letter-spacing: .06em;
  color: var(--ink-50); line-height: 1.9;
}

/* legal pages sit close to their footer; the long scroll gap is for the landscape */
body.legal .footer { margin-top: clamp(80px, 12vh, 140px); }

@media (max-width: 900px) {
  .doc-wrap { grid-template-columns: 1fr; gap: 0; }
  .toc {
    position: static; padding: 44px 0 0;
    border-bottom: 1px solid var(--rule); padding-bottom: 28px;
  }
  .toc ol { columns: 2; column-gap: 28px; }
  .doc { padding-top: 40px; }
}
@media (max-width: 560px) {
  .toc ol { columns: 1; }
  .doc h2 { grid-template-columns: 40px 1fr; }
}

/* ---------- print: a compliance reviewer will put this on paper ---------- */
@media print {
  .nav, .toc, .doc-head .back, .footer .inner { display: none; }
  body.legal { background: #fff; color: #000; font-size: 11pt; }
  .doc-head { padding: 0 0 12pt; }
  .doc-head h1 { font-size: 24pt; margin-bottom: 10pt; }
  .doc-head .standfirst { font-size: 11pt; margin-bottom: 16pt; }
  .doc-wrap { display: block; padding: 0; }
  .doc { max-width: none; padding: 0; }
  .doc section { margin-bottom: 18pt; page-break-inside: avoid; }
  .doc h2 { font-size: 14pt; page-break-after: avoid; }
  .doc p, .doc li, .doc td { font-size: 10.5pt; color: #000; }
  .doc a { color: #000; text-decoration: none; }
  .footer { background: none; color: #000; margin: 0; padding: 12pt 0 0; }
  .footer .legal { color: #000; border-top: 1px solid #000; }
}


/* Casing lives in CSS so the markup keeps real, copyable text. */
.doc-head .kicker, .toc h2, .doc .updated { text-transform: uppercase; }