/* =====================================================================
   Legal pages (privacy, cookies, terms, Modern Slavery Statement,
   fraud warning, accessibility). Loaded after site.css; uses its tokens.
   Layout: navy page hero → one white section with a 12-column split, the same column order on every page:
   text (left) + grey box (right): "On this page" contents on the long pages, an aside on the short ones.
   The box is first in the source, so it comes before the text on small screens.
   ===================================================================== */

/* hero: "Last updated" line under the lead */
.legal-updated { margin-top: 20px; font-size: var(--lw-size-sm); color: var(--lw-color-on-dark-muted); }
.legal-updated time { color: #E3EAF1; font-weight: 700; }

/* layout */
.legal-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--lw-space-7); }
.legal-layout > * { min-width: 0; }
@media (min-width: 1024px) {
  .legal-layout { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--lw-gutter); }
  .legal-layout--toc > .legal-body { grid-column: 1 / span 7; grid-row: 1; }
  .legal-layout--toc > .legal-toc { grid-column: 9 / span 4; grid-row: 1; }
  .legal-layout--aside > .legal-body { grid-column: 1 / span 7; grid-row: 1; }
  .legal-layout--aside > .legal-aside { grid-column: 9 / span 4; grid-row: 1; }
}
/* a summary box ("In short") is first in the source, so it comes before the text on small screens */

/* contents box */
.legal-toc { align-self: start; background: var(--lw-color-surface); border-top: 3px solid var(--lw-color-dark); padding: 22px 22px 24px; }
@media (min-width: 1024px) {
  .legal-toc { position: sticky; top: calc(var(--lw-header-h) + 24px); max-height: calc(100vh - var(--lw-header-h) - 48px); overflow-y: auto; }
}
.legal-toc h2 { margin: 0 0 12px; font-size: var(--lw-size-xs); font-weight: 700; line-height: 1.4; letter-spacing: .18em; text-transform: uppercase; color: var(--lw-color-text-muted); }
.legal-toc ol { list-style: none; margin: 0; padding: 0; counter-reset: toc; display: grid; gap: 2px; }
.legal-toc li { counter-increment: toc; display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: baseline; }
.legal-toc li::before { content: counter(toc) "."; font-size: 13px; font-weight: 700; color: var(--lw-color-text-muted); font-variant-numeric: tabular-nums; }
.legal-toc a { display: inline-block; padding: 5px 0; font-size: 15px; line-height: 1.4; text-decoration: none; color: var(--lw-color-link); }
.legal-toc a:hover { text-decoration: underline; }

/* text column */
.legal-body { max-width: 72ch; }
.legal-body > section { padding-top: var(--lw-space-6); margin-top: var(--lw-space-6); border-top: 1px solid var(--lw-color-border); }
.legal-body > section:first-child { padding-top: 0; margin-top: 0; border-top: 0; }
.legal-body > .legal-intro + section { margin-top: var(--lw-space-6); }
.legal-body h2 { font-size: clamp(22px, calc(22px + (100vw - 390px) * 4 / 1050), 26px); line-height: 1.25; }
.legal-body h3 { margin-top: 26px; font-size: clamp(17px, calc(17px + (100vw - 390px) * 2 / 1050), 19px); line-height: 1.35; }
.legal-body h2 + h3 { margin-top: 18px; }
.legal-body p, .legal-body ul, .legal-body ol, .legal-body dl, .legal-body .table-wrap, .legal-body .legal-callout { margin-top: 14px; }
.legal-body h2 + p, .legal-body h3 + p, .legal-body h3 + ul, .legal-body h2 + ul { margin-top: 10px; }
.legal-body ul, .legal-body ol { padding-left: 1.3em; }
.legal-body li + li { margin-top: 8px; }
.legal-body li::marker { color: var(--lw-color-text-muted); }
.legal-body a { overflow-wrap: anywhere; }
.legal-intro p { font-size: var(--lw-size-lg); line-height: 1.55; }
.legal-intro p + p { margin-top: 14px; }

/* definitions */
.legal-terms { display: grid; gap: 0; border-top: 1px solid var(--lw-color-border); }
.legal-terms > div { padding: 12px 0; border-bottom: 1px solid var(--lw-color-border); }
.legal-terms dt { font-weight: 700; color: var(--lw-color-heading); }
.legal-terms dd { margin: 4px 0 0; }
.legal-body > section > .legal-terms:last-child > div:last-child { border-bottom: 0; padding-bottom: 0; }
@media (min-width: 768px) {
  .legal-terms > div { display: grid; grid-template-columns: minmax(150px, 28%) minmax(0, 1fr); gap: 20px; }
  .legal-terms dd { margin: 0; }
}

/* highlighted box inside the text (fraud "never" list, purpose blocks) */
.legal-callout { background: var(--lw-color-surface); border-left: 4px solid var(--lw-color-accent); padding: 20px 22px 22px; }
.legal-callout h3 { margin-top: 0; }
.legal-callout ul { margin-top: 10px; }

/* "purpose → lawful basis" blocks on the privacy notice */
.legal-purposes { list-style: none; padding: 0 !important; display: grid; gap: 0; border-top: 1px solid var(--lw-color-border); }
.legal-purposes > li { margin: 0 !important; padding: 14px 0 16px; border-bottom: 1px solid var(--lw-color-border); }
.legal-purposes h3 { margin: 0; font-size: 17px; }
.legal-purposes p { margin-top: 6px !important; }
.legal-purposes .legal-basis { font-size: 15px; color: var(--lw-color-text-muted); }
.legal-purposes .legal-basis strong { color: var(--lw-color-text); }

/* cookie table: two columns, wraps cleanly at 390 px */
.legal-body .data-table { font-size: 15px; }
.legal-body .data-table th, .legal-body .data-table td { padding: 12px 12px; }
.legal-body .data-table th:first-child, .legal-body .data-table td:first-child { padding-left: 0; }
.legal-body .data-table th:last-child, .legal-body .data-table td:last-child { padding-right: 0; }
.legal-body .data-table tbody th { font-weight: 700; width: 46%; }
.legal-yes { font-weight: 700; color: var(--lw-color-energy-text); }
.legal-no { font-weight: 700; color: var(--lw-color-heading); }

/* domains list on the fraud page */
.legal-domains { list-style: none; padding: 0 !important; display: flex; flex-wrap: wrap; gap: 10px; }
.legal-domains li { margin: 0 !important; padding: 8px 14px; border: 1px solid var(--lw-color-border-strong); border-radius: var(--lw-radius); background: #fff; font-weight: 700; color: var(--lw-color-heading); font-variant-ligatures: none; }

/* aside box (short pages): reuse .aside-box, add sticky on desktop */
.legal-aside { align-self: start; }
.legal-aside h2 { font-size: 20px; line-height: 1.25; margin-bottom: 10px; }
@media (min-width: 1024px) { .legal-aside { position: sticky; top: calc(var(--lw-header-h) + 24px); } }
.legal-aside ul.legal-aside__points { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.legal-aside ul.legal-aside__points li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.5; }
.legal-aside ul.legal-aside__points li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 9px; height: 9px; border-radius: 50%; background: var(--lw-color-accent); }
.legal-aside p + p { margin-top: 10px; }

/* Modern Slavery Statement: statement text set as published, no extra chrome inside */
.legal-statement > section > h3 { margin-top: 22px; }

/* an aside that only repeats the text below it is shown beside the text on wide screens only */
@media (max-width: 1023px) { .legal-aside--wide-only { display: none; } }
/* the section rule below the table already closes it */
.legal-body > section > .table-wrap:last-child .data-table tbody tr:last-child > * { border-bottom: 0; }