
/* ============================================================
   KYVOS — legal + 404 pages
   Reuses main.css variables, nav, footer, ambient canvas and reveals.
   ============================================================ */
.legal-hero{ padding-bottom:54px; }
.legal-hero .eyebrow{ margin-bottom:18px; }
.legal-hero h1{ max-width:980px; }
.legal-updated{ margin-top:20px; color:var(--text-faint); font-size:12.5px; }
.legal-shell{ padding:10px 0 120px; }
.legal-grid{
  display:grid;
  grid-template-columns:220px minmax(0,760px);
  justify-content:space-between;
  gap:72px;
  align-items:start;
}
.legal-index{
  position:sticky;
  top:calc(var(--nav-h) + 28px);
  padding-top:8px;
}
.legal-index span{
  display:block;
  margin-bottom:14px;
  color:var(--text-faint);
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.15em;
}
.legal-index a{
  display:block;
  padding:6px 0;
  color:var(--text-dim);
  font-size:13px;
  transition:color .25s var(--ease), transform .25s var(--ease);
}
.legal-index a:hover{ color:var(--text); transform:translateX(3px); }
.legal-content{ min-width:0; }
.legal-section{
  padding:36px 0;
  border-top:1px solid var(--line);
  scroll-margin-top:calc(var(--nav-h) + 24px);
}
.legal-section:first-child{ border-top:0; padding-top:0; }
.legal-section h2{ margin-bottom:16px; font-size:clamp(22px,3vw,31px); }
.legal-section h3{ margin:24px 0 10px; font-size:17px; }
.legal-section p,
.legal-section li{
  color:var(--text-dim);
  font-size:14.5px;
  line-height:1.78;
}
.legal-section p + p{ margin-top:14px; }
.legal-section ul{ margin-top:14px; display:grid; gap:9px; }
.legal-section li{ position:relative; padding-left:18px; }
.legal-section li::before{ content:''; position:absolute; left:0; top:.76em; width:6px; height:1px; background:var(--cyan); }
.legal-section a{ color:var(--text); text-decoration:underline; text-underline-offset:3px; }
.legal-card{
  margin-top:16px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(255,255,255,.025);
}
.legal-card p{ margin:0; }
.legal-card p + p{ margin-top:7px; }
.legal-note{
  margin-top:18px;
  padding:16px 18px;
  border-left:2px solid var(--cyan);
  background:rgba(69,224,214,.035);
  color:var(--text-dim);
  font-size:13px;
  line-height:1.65;
}
.legal-placeholder{
  color:#f0a27e;
  font-weight:700;
  letter-spacing:.02em;
}

/* 404 */
.error-main{
  min-height:100vh;
  display:grid;
  align-items:center;
  padding:calc(var(--nav-h) + 68px) 0 86px;
  overflow:hidden;
}
.error-stage{
  position:relative;
  min-height:620px;
  display:grid;
  place-items:center;
  text-align:center;
}
.error-code{
  position:absolute;
  inset:50% auto auto 50%;
  transform:translate(-50%,-56%);
  margin:0;
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(180px,31vw,470px);
  font-weight:700;
  line-height:.75;
  letter-spacing:-.09em;
  color:rgba(255,255,255,.018);
  -webkit-text-stroke:1px rgba(255,255,255,.065);
  user-select:none;
  pointer-events:none;
}
.error-content{ position:relative; z-index:2; max-width:780px; }
.error-mark{
  width:72px;
  height:72px;
  object-fit:contain;
  margin:0 auto 28px;
  filter:drop-shadow(0 12px 34px rgba(69,224,214,.09));
}
.error-kicker{
  margin-bottom:16px;
  color:var(--cyan);
  font-family:'Space Grotesk',sans-serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.error-content h1{ font-size:clamp(42px,7vw,84px); letter-spacing:-.045em; }
.error-copy{ max-width:550px; margin:22px auto 0; color:var(--text-dim); font-size:16px; line-height:1.7; }
.error-actions{ margin-top:34px; display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
.error-trace{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px 16px;
  margin-top:42px;
  color:var(--text-faint);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10.5px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.error-orbit{
  position:absolute;
  left:50%; top:50%;
  width:min(76vw,720px); aspect-ratio:1;
  transform:translate(-50%,-50%);
  border:1px solid rgba(255,255,255,.045);
  border-radius:50%;
  pointer-events:none;
}
.error-orbit::before,
.error-orbit::after{
  content:'';
  position:absolute;
  inset:14%;
  border:1px solid rgba(69,224,214,.055);
  border-radius:50%;
  transform:rotate(28deg) scaleY(.48);
}
.error-orbit::after{ inset:28%; border-color:rgba(106,107,234,.07); transform:rotate(-22deg) scaleY(.62); }

@media (max-width: 900px){
  .legal-grid{ grid-template-columns:1fr; gap:28px; }
  .legal-index{ position:static; display:flex; flex-wrap:wrap; gap:4px 16px; padding:0 0 12px; border-bottom:1px solid var(--line); }
  .legal-index span{ width:100%; margin-bottom:4px; }
  .legal-index a{ padding:3px 0; }
}
@media (max-width: 600px){
  .legal-shell{ padding-bottom:80px; }
  .legal-section{ padding:28px 0; }
  .error-main{ padding-top:calc(var(--nav-h) + 42px); }
  .error-stage{ min-height:520px; }
  .error-mark{ width:58px; height:58px; }
  .error-copy{ font-size:14px; }
  .error-code{ font-size:clamp(150px,56vw,240px); }
}
