/* Shared shell for /privacy, /terms and /cookies.
   Long-form prose: one readable measure, a sticky contents rail on desktop,
   and the site's Oswald/Montserrat pairing. No third family. */

.v-lg {
  background: #ffffff;
  color: #0e1f19;
  font-family: "Montserrat", Arial, sans-serif;
}

/* ---- masthead ------------------------------------------------------ */
.v-lg__head {
  background: radial-gradient(ellipse 120% 100% at 50% 0%, #0d2a20 0%, #061410 60%, #04100c 100%);
  padding: clamp(7rem, 12vw, 10rem) clamp(1.5rem, 4vw, 4rem) clamp(3rem, 5vw, 4.5rem);
}
.v-lg__head-in { max-width: 1240px; margin: 0 auto; }
.v-lg__eyebrow {
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase;
  color: #14E185; margin: 0 0 clamp(14px, 2vw, 20px);
}
.v-lg__head h1 {
  font-family: "Oswald", Arial, sans-serif; font-weight: 700; text-transform: uppercase;
  font-size: clamp(2rem, 5.2vw, 4rem); line-height: 1.02; letter-spacing: -0.02em;
  color: #ffffff; margin: 0 0 clamp(16px, 2.4vw, 22px); max-width: 18ch;
}
.v-lg__lede {
  font-size: clamp(14.5px, 1.1vw, 16.5px); line-height: 1.8;
  color: #a8c4b8; max-width: 62ch; margin: 0;
}
.v-lg__meta {
  margin: clamp(24px, 3vw, 32px) 0 0; padding-top: clamp(18px, 2.4vw, 24px);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: flex; flex-wrap: wrap; gap: 8px 32px;
  font-size: 12.5px; color: #8fb3a3;
}
.v-lg__meta b { color: #ffffff; font-weight: 600; }

/* ---- body + contents rail ------------------------------------------ */
.v-lg__body {
  max-width: 1240px; margin: 0 auto;
  padding: clamp(3rem, 6vw, 5.5rem) clamp(1.5rem, 4vw, 4rem) clamp(4rem, 8vw, 7rem);
  display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(2.5rem, 6vw, 5rem);
  align-items: start;
}
.v-lg__toc { position: sticky; top: 104px; }
.v-lg__toc h2 {
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase;
  color: #5d7d70; margin: 0 0 16px;
}
.v-lg__toc ol { list-style: none; margin: 0; padding: 0; counter-reset: toc; }
.v-lg__toc li { counter-increment: toc; }
.v-lg__toc a {
  display: block; padding: 7px 0 7px 30px; position: relative;
  font-size: 13px; line-height: 1.45; color: #4d6a5e; text-decoration: none;
  border-left: 2px solid transparent; transition: color 180ms ease, border-color 180ms ease;
}
.v-lg__toc a::before {
  content: counter(toc); position: absolute; left: 12px; top: 7px;
  font-size: 11px; font-weight: 700; color: #a8bdb3;
}
.v-lg__toc a:hover { color: #0e1f19; }
.v-lg__toc a.is-on {
  color: #04120c; font-weight: 600; border-left-color: #14E185;
}
.v-lg__toc a.is-on::before { color: #14E185; }

.v-lg__doc { max-width: 74ch; }
.v-lg__doc section + section { margin-top: clamp(2.6rem, 4.5vw, 3.6rem); }
.v-lg__doc h2 {
  font-family: "Oswald", Arial, sans-serif; font-weight: 600; text-transform: uppercase;
  font-size: clamp(1.15rem, 2.1vw, 1.6rem); line-height: 1.15; letter-spacing: -0.01em;
  color: #04120c; margin: 0 0 clamp(14px, 1.8vw, 18px);
  padding-bottom: 12px; border-bottom: 1px solid #e3eae6;
  scroll-margin-top: 104px;
}
.v-lg__doc h3 {
  font-family: "Oswald", Arial, sans-serif; font-weight: 600;
  font-size: clamp(0.98rem, 1.4vw, 1.12rem); line-height: 1.3;
  color: #0e1f19; margin: clamp(22px, 3vw, 30px) 0 10px;
}
.v-lg__doc p,
.v-lg__doc li {
  font-size: 15px; line-height: 1.85; color: #3c554a; margin: 0 0 14px;
}
/* tw-base preflight sets `list-style: none` on every ul/ol, so content
   lists need it put back explicitly — styling ::marker alone does nothing
   when there is no marker to style. The TOC above deliberately keeps the
   preflight reset and draws its own numbers. */
.v-lg__doc ul { list-style: disc outside; }
.v-lg__doc ol { list-style: decimal outside; }
.v-lg__doc ul, .v-lg__doc ol { margin: 0 0 16px; padding-left: 22px; }
.v-lg__doc li { margin-bottom: 8px; }
.v-lg__doc li::marker { color: #14E185; }
.v-lg__doc strong { color: #0e1f19; font-weight: 600; }
.v-lg__doc a { color: #0d7a4d; text-decoration: underline; text-underline-offset: 3px; }
.v-lg__doc a:hover { color: #14E185; }

/* definition-style rows, used for the data tables */
.v-lg__table {
  width: 100%; border-collapse: collapse; margin: 0 0 18px;
  font-size: 14px; display: block; overflow-x: auto;
}
.v-lg__table th, .v-lg__table td {
  text-align: left; padding: 12px 16px; border-bottom: 1px solid #e3eae6;
  vertical-align: top; line-height: 1.65;
}
.v-lg__table th {
  font-family: "Oswald", Arial, sans-serif; font-weight: 600; color: #04120c;
  text-transform: uppercase; font-size: 11.5px; letter-spacing: 0.1em;
  background: #f5f8f6; white-space: nowrap;
}
.v-lg__table td { color: #3c554a; }

/* callout for the grievance officer / things that need real values */
.v-lg__note {
  background: #f2f8f5; border-left: 3px solid #14E185;
  padding: clamp(18px, 2.4vw, 24px) clamp(20px, 2.6vw, 26px);
  margin: 0 0 18px; border-radius: 0 4px 4px 0;
}
.v-lg__note p:last-child { margin-bottom: 0; }
.v-lg__note h3 { margin-top: 0; }

/* Entity facts as a definition list rather than prose. Registered-party
   details are the part a reader scans for rather than reads, and keeping each
   label next to its value makes an unfilled one obvious instead of hiding it
   inside a paragraph. */
.v-lg__facts {
  margin: 0 0 22px; padding: 18px 20px;
  background: #f4f8f6; border: 1px solid #e3eae6; border-radius: 10px;
  display: grid; grid-template-columns: minmax(150px, auto) 1fr; gap: 8px 22px;
}
.v-lg__facts dt {
  font-weight: 700; color: #0b7a58; font-size: 0.92em;
}
.v-lg__facts dd { margin: 0; }
@media (max-width: 620px) {
  .v-lg__facts { grid-template-columns: 1fr; gap: 3px 0; }
  .v-lg__facts dd { margin-bottom: 10px; }
}

/* placeholder pending real registered-entity details */
.v-lg__tbd {
  background: #fff4d6; color: #6b4e00; font-weight: 600;
  padding: 1px 7px; border-radius: 3px; font-size: 0.94em;
}

@media (max-width: 900px) {
  .v-lg__body { grid-template-columns: 1fr; gap: 2rem; }
  .v-lg__toc {
    position: static; border-bottom: 1px solid #e3eae6; padding-bottom: 20px;
  }
  .v-lg__toc ol {
    display: flex; flex-wrap: wrap; gap: 4px 8px;
  }
  .v-lg__toc a { padding: 6px 12px; border-left: 0; border-radius: 3px; background: #f5f8f6; }
  .v-lg__toc a::before { display: none; }
  .v-lg__toc a.is-on { background: #04120c; color: #ffffff; }
}