@font-face {
  font-family: "Vigou Founders Grotesk";
  src: url("/assets/fonts/brand/founders-grotesk-semibold.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 600;
}

:root {
  color-scheme: light;
  --legal-ink: oklch(0.15 0.014 155);
  --legal-ink-soft: oklch(0.34 0.014 152);
  --legal-muted: oklch(0.48 0.012 150);
  --legal-canvas: oklch(0.985 0.002 150);
  --legal-surface: oklch(1 0 0);
  --legal-surface-soft: oklch(0.965 0.008 145);
  --legal-line: oklch(0.91 0.006 150);
  --legal-primary: oklch(0.43 0.08 153.19);
  --legal-primary-deep: oklch(0.32 0.02 145.14);
  --legal-accent: oklch(0.63 0.18 41.79);
  --legal-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --legal-font-brand: "Vigou Founders Grotesk", var(--legal-font);
  --legal-radius: 14px;
  --legal-ease: cubic-bezier(.16, 1, .3, 1);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  min-width: 320px;
  min-height: 100%;
  margin: 0;
  background: var(--legal-canvas);
  color: var(--legal-ink);
  font: 400 1rem/1.65 var(--legal-font);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a {
  color: inherit;
  text-underline-offset: .2em;
}

a:focus-visible {
  outline: 3px solid color-mix(in oklch, var(--legal-primary) 28%, transparent);
  outline-offset: 4px;
}

.legal-shell {
  width: min(100% - clamp(2rem, 8vw, 8rem), 1120px);
  margin-inline: auto;
  padding-bottom: clamp(3rem, 7vw, 5.5rem);
}

.legal-nav {
  position: sticky;
  z-index: 10;
  top: 0;
  display: flex;
  min-height: 78px;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  border-bottom: 1px solid var(--legal-line);
  background: color-mix(in oklch, var(--legal-canvas) 88%, transparent);
  -webkit-backdrop-filter: blur(16px) saturate(120%);
  backdrop-filter: blur(16px) saturate(120%);
}

.legal-brand {
  display: inline-flex;
  align-items: baseline;
  color: var(--legal-ink);
  font-family: var(--legal-font-brand);
  font-size: 1.75rem;
  font-weight: 600;
  letter-spacing: -.04em;
  line-height: 1;
  text-decoration: none;
}

.legal-brand span { color: var(--legal-accent); }

.legal-home {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: .45rem;
  color: var(--legal-ink-soft);
  font-size: .9375rem;
  font-weight: 600;
  text-decoration: none;
  transition: color 180ms var(--legal-ease), transform 180ms var(--legal-ease);
}

.legal-home:hover { color: var(--legal-primary); transform: translateY(-1px); }

.legal-header {
  display: grid;
  padding-block: clamp(4rem, 9vw, 7.5rem) clamp(3rem, 6vw, 5rem);
  border-bottom: 1px solid var(--legal-line);
}

.legal-eyebrow {
  margin: 0 0 1rem;
  color: var(--legal-primary);
  font-size: .8125rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.legal-header h1 {
  max-width: 18ch;
  margin: 0;
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  font-weight: 600;
  letter-spacing: -.04em;
  line-height: 1.04;
  text-wrap: balance;
}

.legal-updated {
  margin: 1.5rem 0 0;
  color: var(--legal-muted);
  font-size: .9375rem;
}

.legal-content { counter-reset: legal-section; }

.legal-content section {
  display: grid;
  gap: 1rem clamp(2rem, 7vw, 6rem);
  padding-block: clamp(2.25rem, 5vw, 3.75rem);
  border-bottom: 1px solid var(--legal-line);
  scroll-margin-top: 96px;
}

.legal-content h2 {
  margin: 0;
  color: var(--legal-ink);
  font-size: clamp(1.15rem, 1.05rem + .35vw, 1.35rem);
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.3;
  text-wrap: balance;
}

.legal-content p,
.legal-content ul {
  max-width: 68ch;
  margin: 0;
  color: var(--legal-ink-soft);
  font-size: clamp(1rem, .97rem + .12vw, 1.0625rem);
  line-height: 1.75;
  text-wrap: pretty;
}

.legal-content ul { padding-left: 1.25rem; }
.legal-content li + li { margin-top: .55rem; }

.legal-content a {
  color: var(--legal-primary);
  font-weight: 600;
  overflow-wrap: anywhere;
}

.legal-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem 1.5rem;
  margin-top: clamp(2.5rem, 5vw, 4rem);
  padding: 1.5rem clamp(1.25rem, 3vw, 2rem);
  border-radius: var(--legal-radius);
  background: var(--legal-primary-deep);
  color: color-mix(in oklch, white 78%, var(--legal-primary-deep));
  font-size: .875rem;
}

.legal-footer span:first-child { margin-right: auto; }

.legal-footer a {
  min-height: 40px;
  align-items: center;
  color: white;
  text-decoration: none;
  display: inline-flex;
}

.legal-footer a:hover { color: color-mix(in oklch, white 76%, var(--legal-accent)); }

@media (min-width: 760px) {
  .legal-header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
  }

  .legal-eyebrow { grid-column: 1 / -1; }
  .legal-updated { justify-self: end; margin: 0 0 .25rem; }

  .legal-content section {
    grid-template-columns: minmax(12rem, .38fr) minmax(0, 1fr);
  }

  .legal-content h2 { grid-column: 1; }
  .legal-content p,
  .legal-content ul { grid-column: 2; }
}

@media (max-width: 600px) {
  .legal-shell { width: min(100% - 2rem, 1120px); }
  .legal-nav { min-height: 68px; }
  .legal-brand { font-size: 1.55rem; }
  .legal-home { font-size: .875rem; }
  .legal-header { padding-top: 3.5rem; }
  .legal-footer { align-items: flex-start; flex-direction: column; }
  .legal-footer span:first-child { margin: 0 0 .25rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}
