/* Legal-page shared styles — uses the same palette and frosted glass as index.html */
:root{
  --bg:            #070a1c;
  --bg-2:          #0a0e28;
  --ink:           #e6eefb;
  --ink-2:         #cfdaf2;
  --muted:         #98a3c0;
  --muted-2:       #75809e;
  --accent:        #6ec6ff;
  --accent-2:      #7ad0ff;
  --accent-3:      #a7dcff;
  --max:           1200px;
  --r:             18px;
  --r-lg:          28px;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; }
body{
  font-family: 'Geist', -apple-system, 'Segoe UI', Inter, sans-serif;
  background: linear-gradient(180deg, var(--bg), var(--bg-2));
  color: var(--ink);
  line-height: 1.65;
  min-height: 100vh;
  padding-bottom: 80px;
}
img{display:block; max-width:100%}
a{color:var(--accent-3); text-decoration:none; transition:color .2s}
a:hover{color:var(--accent)}

/* Background canvas (subtle, lighter than main page) */
#bg-canvas{
  position: fixed; inset: 0; width: 100vw; height: 100vh;
  z-index: 0; opacity: 0.18; pointer-events: none;
}
.video-vignette{
  position: fixed; inset: 0; pointer-events: none; z-index: 1;
  background: radial-gradient(ellipse 90% 80% at center,
    rgba(7,10,28,0) 35%,
    rgba(7,10,28,0.65) 80%,
    rgba(7,10,28,0.92) 100%);
}

/* Nav */
.nav{
  position: sticky; top: 0; z-index: 50;
  padding: 14px clamp(16px, 4vw, 32px);
  background: rgba(7,10,28,0.72);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid rgba(110,198,255,0.10);
}
.nav-inner{
  max-width: var(--max); margin: 0 auto;
  display: flex; align-items: center; gap: 16px;
}
.logo{
  display:flex; align-items:center; gap:10px;
  font-weight:600; letter-spacing:-0.015em; font-size:14px;
  color: var(--ink);
}
.logo img{ width:28px; height:28px; }
.nav-back{
  margin-left: auto;
  font-size: 13px; color: var(--muted);
  padding: 8px 14px; border-radius: 999px;
  transition: color .2s, background .2s;
}
.nav-back:hover{ color: var(--ink); background: rgba(255,255,255,0.06); }

/* Main wrap */
.legal-wrap{
  position: relative; z-index: 2;
  max-width: var(--max); margin: 0 auto;
  padding: clamp(40px, 6vw, 80px) clamp(16px, 4vw, 32px);
}

/* Glass pane (matches index.html .section-pane) */
.section-pane{
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(40px, 5vw, 72px) clamp(22px, 4vw, 56px);
  background: linear-gradient(180deg, rgba(6,12,28,0.66), rgba(6,12,28,0.46));
  backdrop-filter: blur(26px) saturate(150%);
  -webkit-backdrop-filter: blur(26px) saturate(150%);
  border: 1px solid rgba(110,198,255,0.16);
  border-radius: var(--r-lg);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -1px 0 rgba(255,255,255,0.03),
    0 32px 80px -32px rgba(0,8,28,0.85);
  position: relative;
}
.section-pane::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background: radial-gradient(900px 320px at 50% -10%, rgba(110,198,255,0.08), transparent 60%);
}

/* Legal-specific typography */
.legal-head{ margin-bottom: clamp(28px, 4vw, 40px); }
.pill{
  display:inline-flex; align-items:center;
  padding:5px 12px; border-radius:999px;
  font-size:10.5px; font-weight:500; letter-spacing:.18em; text-transform:uppercase;
  color:var(--accent-3);
  background:rgba(110,198,255,0.08);
  border:1px solid rgba(110,198,255,0.18);
}
h1{
  font-size: clamp(28px, 4.5vw, 42px); font-weight: 600; letter-spacing: -0.025em;
  margin: 14px 0 14px;
  background: linear-gradient(180deg, #fff 30%, var(--accent-3));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.lead{
  color: var(--ink-2); font-size: clamp(14px, 1.6vw, 16px);
  max-width: 720px; line-height: 1.6;
}
.meta{
  margin-top: 14px; color: var(--muted-2);
  font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase;
}
section{ margin-top: clamp(28px, 4vw, 40px); }
section h2{
  font-size: 18px; font-weight: 600; letter-spacing: -0.005em;
  margin-bottom: 12px;
  color: var(--ink);
}
section p{ color: var(--ink-2); font-size: 14.5px; margin-bottom: 12px; max-width: 820px; }
section ul{ list-style: none; padding: 0; margin: 0 0 14px; }
section li{
  position: relative; padding: 0 0 0 22px;
  color: var(--ink-2); font-size: 14px; line-height: 1.65;
  margin-bottom: 8px; max-width: 820px;
}
section li::before{
  content:""; position:absolute; left:0; top:8px;
  width:8px; height:8px; border-radius:2px;
  background: linear-gradient(135deg, var(--accent), var(--accent-3));
  box-shadow: 0 0 8px rgba(110,198,255,0.40);
}
section strong{ color: var(--ink); font-weight: 500; }

.email-mask{ font-family: 'Geist Mono', ui-monospace, monospace; color: var(--accent-3); user-select: text; }

.legal-foot{
  margin-top: clamp(36px, 5vw, 56px); padding-top: 24px;
  border-top: 1px solid rgba(110,198,255,0.12);
  color: var(--muted); font-size: 13.5px;
}

.legal-bottom{
  position: relative; z-index: 2;
  max-width: var(--max); margin: 40px auto 0;
  padding: 24px clamp(16px, 4vw, 32px);
  display: flex; gap: 16px; flex-wrap: wrap; justify-content: space-between;
  color: var(--muted-2); font-size: 12px;
}

@media(max-width:720px){
  .section-pane{ padding: 32px 18px; border-radius: var(--r); }
  h1{ font-size: 28px; }
  section h2{ font-size: 17px; }
}