/* =========================================================
   VALIDQ · LEGAL PAGES SHARED STYLES
   Apple-soft surfaces · brand-v3 tokens · readable typography
   ========================================================= */

:root,
[data-theme="dark"]{
  --bg-base:#09100D;--bg-surface:#0E1812;--bg-card:#131F18;
  --bg-elevated:#182419;--bg-input:#0E1812;--bg-hover:#1C2B21;
  --border:rgba(255,255,255,0.07);--border-mid:rgba(255,255,255,0.10);--border-strong:rgba(255,255,255,0.14);
  --green:#00E87A;--green-hover:#1AFF8C;
  --green-dim:rgba(0,232,122,0.12);--green-glow:rgba(0,232,122,0.08);--green-subtle:rgba(0,232,122,0.06);
  --text-primary:#ECF2EE;--text-secondary:#7D9E8A;--text-tertiary:#3D5E4A;--text-inverse:#09100D;
  --red:#FF4D6A;--amber:#FFB830;--blue:#4DB8FF;
  --shadow-sm:0 1px 3px rgba(0,0,0,.4);--shadow-md:0 4px 16px rgba(0,0,0,.5);
  --shadow-lg:0 12px 48px rgba(0,0,0,.6);
  --shadow-green:0 0 0 3px rgba(0,232,122,0.12);
  --nav-bg:rgba(9,16,13,0.80);
}

[data-theme="light"]{
  --bg-base:#F2F6F3;--bg-surface:#FFFFFF;--bg-card:#FFFFFF;
  --bg-elevated:#F2F6F3;--bg-input:#F2F6F3;--bg-hover:#EAF2ED;
  --border:rgba(0,0,0,0.07);--border-mid:rgba(0,0,0,0.10);--border-strong:rgba(0,0,0,0.14);
  --green:#00B85E;--green-hover:#00A350;
  --green-dim:rgba(0,184,94,0.10);--green-glow:rgba(0,184,94,0.06);--green-subtle:rgba(0,184,94,0.06);
  --text-primary:#0D1F15;--text-secondary:#4A6957;--text-tertiary:#92B09E;--text-inverse:#FFFFFF;
  --red:#D93050;--amber:#C47A00;--blue:#0A7FD4;
  --shadow-sm:0 1px 3px rgba(0,0,0,.06);--shadow-md:0 4px 16px rgba(0,0,0,.07);
  --shadow-lg:0 12px 48px rgba(0,0,0,.09);
  --shadow-green:0 0 0 3px rgba(0,184,94,0.15);
  --nav-bg:rgba(242,246,243,0.82);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--bg-base);color:var(--text-primary);
  font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

/* ===== NAV ===== */
nav{
  position:sticky;top:0;z-index:100;height:64px;
  background:var(--nav-bg);backdrop-filter:saturate(180%) blur(24px);
  border-bottom:1px solid var(--border);
}
.nav-inner{
  max-width:880px;margin:0 auto;height:100%;padding:0 28px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.logo{
  font-family:'Unbounded',sans-serif;font-weight:900;font-size:20px;
  letter-spacing:-1.2px;color:var(--text-primary);text-decoration:none;
  display:inline-flex;align-items:baseline;
}
.logo .q{color:var(--green)}
.nav-back a{
  font-family:'DM Mono',monospace;font-size:12px;color:var(--text-secondary);
  text-decoration:none;padding:8px 14px;border-radius:8px;
  transition:all .15s;
}
.nav-back a:hover{color:var(--text-primary);background:var(--bg-hover)}

/* ===== PAGE ===== */
.legal-page{max-width:880px;margin:0 auto;padding:48px 28px 80px}

.legal-h{margin-bottom:48px;padding-bottom:32px;border-bottom:1px solid var(--border)}
.legal-h .eyebrow{
  display:inline-block;font-family:'DM Mono',monospace;font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--green);
  margin-bottom:14px;
}
.legal-h h1{
  font-family:'Unbounded',sans-serif;font-weight:700;font-size:42px;
  letter-spacing:-1.4px;line-height:1.05;margin-bottom:10px;
  color:var(--text-primary);
}
.legal-sub{
  font-family:'DM Mono',monospace;font-size:12px;color:var(--text-tertiary);
}

/* ===== BODY ===== */
.legal-body{font-size:16px;color:var(--text-primary);line-height:1.65}
.legal-body h2{
  font-family:'Unbounded',sans-serif;font-weight:700;font-size:22px;
  letter-spacing:-.6px;line-height:1.25;margin-top:48px;margin-bottom:16px;
  color:var(--text-primary);
}
.legal-body h2:first-child{margin-top:0}
.legal-body h3{
  font-family:'Unbounded',sans-serif;font-weight:600;font-size:16px;
  letter-spacing:-.3px;margin-top:28px;margin-bottom:10px;
  color:var(--text-primary);
}
.legal-body p{margin-bottom:14px;color:var(--text-secondary)}
.legal-body p strong{color:var(--text-primary);font-weight:500}
.legal-body ul,
.legal-body ol{margin:0 0 16px 22px;color:var(--text-secondary)}
.legal-body li{margin-bottom:8px;line-height:1.6}
.legal-body li strong{color:var(--text-primary);font-weight:500}
.legal-body a{
  color:var(--green);text-decoration:none;
  border-bottom:1px solid transparent;transition:border-color .15s;
}
.legal-body a:hover{border-bottom-color:var(--green)}
.legal-body code{
  font-family:'DM Mono',monospace;font-size:13px;
  background:var(--bg-elevated);border:1px solid var(--border);
  padding:1px 7px;border-radius:5px;color:var(--text-primary);
}
.legal-body em{color:var(--text-tertiary);font-style:italic}

/* ===== CALLOUTS ===== */
.callout{
  border-radius:12px;padding:18px 22px;margin:22px 0;
  border:1px solid var(--border-mid);background:var(--bg-card);
  font-size:14px;line-height:1.6;
}
.callout-info{
  border-color:rgba(77,184,255,.25);background:rgba(77,184,255,.05);
  color:var(--text-primary);
}
.callout-info strong{color:var(--blue)}
.callout-warning{
  border-color:rgba(255,184,48,.25);background:rgba(255,184,48,.05);
  color:var(--text-primary);
}
.callout-warning strong{color:var(--amber)}
.callout a{color:var(--green)}

/* ===== FOOTER ===== */
.legal-foot{
  margin-top:80px;padding-top:32px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  font-family:'DM Mono',monospace;font-size:11px;color:var(--text-tertiary);
  letter-spacing:.04em;flex-wrap:wrap;
}
.legal-foot a{color:var(--text-secondary);text-decoration:none;transition:color .15s}
.legal-foot a:hover{color:var(--green)}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px){
  .legal-page{padding:32px 20px 64px}
  .legal-h h1{font-size:32px;letter-spacing:-1px}
  .legal-body{font-size:15px}
  .legal-body h2{font-size:20px;margin-top:36px}
  .legal-foot{flex-direction:column;align-items:flex-start;gap:12px}
}
