/* Legal pages sit on the landing system but keep a longer reading measure.
   Consumes tokens.css (colour + type + space + radii). --legal-col / --legal-measure
   now live in tokens.css. */
body.legal-page{
  min-height:100vh;
}

body.legal-page header.site{
  position:sticky;
  top:0;
  background:color-mix(in srgb,var(--ground-paper) 84%,transparent);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  border-bottom:1px solid color-mix(in srgb,var(--line-default) 72%,transparent);
  padding-block:clamp(14px,2vw,22px);
}

@supports not (backdrop-filter:blur(16px)){
  body.legal-page header.site{background:var(--ground-paper)}
}

.legal-shell{
  width:var(--legal-col);
  margin:0 auto;
  padding:clamp(58px,9vw,92px) 0 clamp(72px,11vw,124px);
}

.page-h1{
  font-family:var(--font-serif);
  font-weight:var(--weight-regular);
  font-size:var(--size-display-2);
  line-height:var(--leading-display);
  letter-spacing:var(--tracking-display);
  color:var(--text-ink);
  margin:0 0 .35em;
  text-wrap:balance;
}

.meta{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:12px 24px;
  margin:0 0 clamp(34px,6vw,56px);
  padding-bottom:18px;
  border-bottom:1px solid var(--line-default);
  font-family:var(--font-mono);
  font-size:var(--size-meta);
  letter-spacing:var(--tracking-normal);
  color:var(--text-ink-faint);
}

.intro{
  max-width:58ch;
  margin:0 0 clamp(34px,6vw,54px);
  color:var(--text-body);
  font-size:var(--size-lead);
  line-height:var(--leading-reading);
}

.legal-shell h2{
  max-width:var(--legal-measure);
  margin:clamp(46px,7vw,70px) 0 .65em;
  font-family:var(--font-serif);
  font-weight:var(--weight-regular);
  font-size:var(--size-heading);
  line-height:var(--leading-tight);
  letter-spacing:var(--tracking-display);
  color:var(--text-ink);
  text-wrap:balance;
}

.legal-shell p,
.legal-shell ul{
  max-width:var(--legal-measure);
}

.legal-shell p{
  margin:0 0 1.15em;
  color:var(--text-body);
}

.legal-shell ul{
  margin:0 0 1.2em;
  padding-left:1.25em;
  color:var(--text-body);
}

.legal-shell li{padding-left:.15em}
.legal-shell li + li{margin-top:.65em}

.legal-shell strong{
  color:var(--text-ink);
  font-weight:var(--weight-semibold);
}

.legal-shell code{
  display:inline-block;
  padding:.08em .36em;
  border:1px solid var(--line-default);
  border-radius:var(--radius-sm);
  background:var(--ground-surface);
  color:var(--text-ink);
  font-family:var(--font-mono);
  font-size:.86em;
}

.legal-shell a,
.legal-foot a{
  color:var(--magenta-deep);
  text-decoration-color:color-mix(in srgb,var(--magenta-deep) 42%,transparent);
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}

.legal-shell a:hover,
.legal-foot a:hover{
  color:var(--magenta-fill);
  text-decoration-color:currentColor;
}

.toc{
  max-width:var(--legal-measure);
  margin:0 0 clamp(44px,7vw,72px);
  padding:18px 0;
  border-top:1px solid var(--line-default);
  border-bottom:1px solid var(--line-default);
}

.toc ol{
  columns:2;
  column-gap:34px;
  margin:0;
  padding-left:1.35em;
  font-family:var(--font-mono);
  font-size:var(--size-meta);
  line-height:var(--leading-loose);
  letter-spacing:var(--tracking-normal);
  color:var(--text-ink-faint);
}

.toc li{
  break-inside:avoid;
  margin:0 0 .3em;
  padding-left:.15em;
}

.toc a{
  color:var(--text-ink-soft);
  text-decoration:none;
}

.toc a:hover{
  color:var(--magenta-deep);
  text-decoration:underline;
}

body.legal-page footer.site-foot{
  width:var(--legal-col);
  margin:0 auto;
}

.legal-foot-row{
  display:flex;
  justify-content:space-between;
  gap:12px 24px;
  flex-wrap:wrap;
}

.legal-foot-nav{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

.legal-foot-nav a{
  text-decoration:none;
}

@media (max-width:640px){
  body.legal-page header.site{
    align-items:flex-start;
    flex-wrap:wrap;
    gap:18px;
  }

  .legal-shell{
    padding-top:clamp(42px,12vw,64px);
  }

  .page-h1{
    font-size:2.65rem;
  }

  .intro{
    font-size:1.06rem;
  }

  .legal-shell h2{
    font-size:1.65rem;
  }

  .toc ol{
    columns:1;
  }
}