/* ==================================================================
   Legal pages — shares the landing page's design system.
   Wider measure than the funnel: these are documents, not squeeze
   pages, so the column is sized for sustained reading.
   ================================================================== */
:root{
  --page:        oklch(11%   0.038 265);
  --bg:          oklch(17%   0.055 265);
  --surface-1:   oklch(21.5% 0.066 265);
  --line:        oklch(31%   0.072 265);
  --line-strong: oklch(39%   0.092 265);

  --ink:         oklch(97% 0.007 265);
  --ink-2:       oklch(80% 0.024 265);
  --ink-3:       oklch(61% 0.038 265);

  --brand:       oklch(52% 0.185 265);
  --brand-lift:  oklch(66% 0.175 258);
  --alert:       oklch(79% 0.125 66);

  --space-xs: 8px;  --space-sm: 12px; --space-md: 16px;
  --space-lg: 24px; --space-xl: 32px; --space-2xl: 48px;

  --radius-md: 6px;
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
}

*,*::before,*::after{ box-sizing:border-box }
body,h1,h2,h3,p,ul,ol,li,figure{ margin:0; padding:0 }
h1,h2,h3{ font-size:inherit; font-weight:inherit }
li{ list-style:none }
a{ color:inherit }

html{ -webkit-text-size-adjust:100% }

body{
  background:var(--page);
  color:var(--ink-2);
  font-family:'Archivo', system-ui, sans-serif;
  font-weight:400;
  line-height:1.72;          /* light-on-dark needs extra leading */
  font-kerning:normal;
  -webkit-font-smoothing:antialiased;
  min-height:100dvh;
}

.doc{
  max-width:720px; margin-inline:auto;
  background:var(--bg);
  min-height:100dvh;
  padding-bottom:var(--space-2xl);
}
@media (min-width:760px){
  .doc{ border-inline:1px solid var(--line) }
}

:where(a,button):focus-visible{
  outline:2px solid var(--brand-lift);
  outline-offset:3px;
  border-radius:4px;
}

/* ---------- masthead ---------- */
.masthead{
  display:flex; align-items:center; gap:var(--space-sm);
  padding:var(--space-lg) var(--space-lg) 0;
}
.masthead-logo{
  flex:none; line-height:0; border-radius:50%;
  transition:transform 160ms var(--ease-out-quart);
}
.masthead-logo:hover{ transform:scale(1.04) }
.masthead-avatar{
  display:block; width:52px; height:52px;
  border-radius:50%;
  border:1px solid var(--line-strong);
  background-position:center; background-size:cover;
  box-shadow:0 0 0 3px oklch(52% 0.185 265 / .2);
}
.masthead-name{
  font-family:'Azeret Mono', monospace;
  font-size:.8125rem; font-weight:600;
  letter-spacing:.13em; text-transform:uppercase;
  color:var(--ink); white-space:nowrap;
}
.masthead-rule{ flex:1; height:1px; background:var(--line); min-width:12px }

/* ---------- document head ---------- */
.doc-head{ padding:var(--space-xl) var(--space-lg) 0 }
.doc-title{
  font-variation-settings:'wdth' 104;
  font-weight:900;
  letter-spacing:-0.024em; line-height:1.1;
  font-size:clamp(1.7rem, 6.4vw, 2.3rem);
  color:var(--ink);
  text-wrap:balance;
}
.doc-meta{
  margin-top:var(--space-sm);
  font-family:'Azeret Mono', monospace;
  font-size:.6875rem; font-weight:500;
  letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink-3);
}


/* ---------- body ---------- */
.doc-body{ padding:var(--space-xl) var(--space-lg) 0 }
.doc-body > * + *{ margin-top:var(--space-md) }

.doc-body h2{
  margin-top:var(--space-2xl);
  font-variation-settings:'wdth' 104;
  font-weight:800; font-size:1.15rem;
  letter-spacing:-0.012em; line-height:1.3;
  color:var(--ink);
}
.doc-body h2 .num{
  font-family:'Azeret Mono', monospace;
  font-size:.75rem; font-weight:500;
  letter-spacing:.06em;
  color:var(--ink-3);
  margin-right:9px;
}
.doc-body h3{
  margin-top:var(--space-lg);
  font-weight:700; font-size:1rem;
  color:var(--ink);
}
.doc-body p{ max-width:68ch }
.doc-body strong{ color:var(--ink); font-weight:700 }

.doc-body ul{ max-width:68ch; display:flex; flex-direction:column; gap:9px }
.doc-body li{
  display:grid; grid-template-columns:16px 1fr; gap:var(--space-sm);
  align-items:start;
}
.doc-body li::before{
  content:''; margin-top:.62em;
  width:5px; height:5px; border-radius:50%;
  background:var(--brand-lift);
}

.doc-body a{
  color:var(--ink);
  text-decoration:underline;
  text-decoration-color:var(--line-strong);
  text-underline-offset:3px;
  transition:text-decoration-color 140ms var(--ease-out-quart);
}
.doc-body a:hover{ text-decoration-color:var(--brand-lift) }

/* contact / registered address block */
.doc-address{
  margin-top:var(--space-lg);
  padding:var(--space-md);
  background:var(--surface-1);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  font-size:.94rem; line-height:1.65;
  color:var(--ink-2);
}
.doc-address .label{
  display:block; margin-bottom:7px;
  font-family:'Azeret Mono', monospace;
  font-size:.6875rem; font-weight:500;
  letter-spacing:.11em; text-transform:uppercase;
  color:var(--ink-3);
}
.doc-address strong{ display:block; color:var(--ink) }

/* ---------- back to funnel ---------- */
.doc-back{ padding:var(--space-2xl) var(--space-lg) 0 }
.doc-back a{
  display:inline-flex; align-items:center; gap:9px;
  min-height:44px;
  font-family:'Azeret Mono', monospace;
  font-size:.6875rem; font-weight:500;
  letter-spacing:.11em; text-transform:uppercase;
  color:var(--ink-3); text-decoration:none;
  transition:color 140ms var(--ease-out-quart);
}
.doc-back a:hover{ color:var(--ink) }

/* ---------- shared legal footer ---------- */
.legal{ padding:var(--space-2xl) var(--space-lg) 0; text-align:center }
.legal-rule{ height:1px; background:var(--line); margin-bottom:var(--space-lg) }
.legal-links{
  display:flex; flex-wrap:wrap;
  justify-content:center; align-items:center;
  gap:0 18px;
}
.legal-links a{
  padding:8px 2px;
  font-family:'Azeret Mono', monospace;
  font-size:.6875rem; font-weight:500;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-3); text-decoration:none;
  transition:color 140ms var(--ease-out-quart);
}
.legal-links a:hover{ color:var(--ink) }
.legal-links a[aria-current="page"]{ color:var(--ink) }

.legal-info{
  display:flex; flex-direction:column; align-items:center;
  gap:2px; margin-top:6px;
  font-size:.6875rem; line-height:1.7;
  color:var(--ink-3);
}
.legal-info a{
  display:inline-block; padding:4px 0;
  white-space:nowrap;
  color:var(--ink-3); text-decoration:none;
  transition:color 140ms var(--ease-out-quart);
}
.legal-info a:hover{ color:var(--ink) }

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