/* Shared styles for SchoolDesk legal pages (privacy, terms) */
:root{
  --bg:#FAFBFD; --surface:#FFFFFF;
  --ink:#0E1626; --ink-2:#1A2230; --muted:#4A5365; --dim:#8993A3;
  --line:#E6EBF1; --line-soft:#F0F3F8;
  --c1:#1E7BFF; --c2:#0F4FBF; --c1-soft:#EAF2FF;
  --container:820px;
  --font-d:"DM Sans",Helvetica,Arial,sans-serif;
  --font-b:"DM Sans",Helvetica,Arial,sans-serif;
  --font-m:"JetBrains Mono",ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:var(--font-b); color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; line-height:1.6;
}
a{color:var(--c1); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}
.container{width:100%; max-width:var(--container); margin:0 auto; padding:0 24px}

/* nav */
.lg-nav{
  position:sticky; top:0; z-index:10;
  background:color-mix(in oklab, var(--bg) 88%, transparent);
  backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--line);
}
.lg-nav .inner{
  display:flex; align-items:center; justify-content:space-between;
  height:64px; max-width:var(--container); margin:0 auto; padding:0 24px;
}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:17px; letter-spacing:-0.01em; color:var(--ink)}
.brand:hover{text-decoration:none}
.brand .mark{width:30px; height:30px; border-radius:8px; background:url("/assets/schooldesk-icon.png") center/cover no-repeat}
.lg-nav a.back{font-size:14px; font-weight:500; color:var(--muted)}
.lg-nav a.back:hover{color:var(--ink); text-decoration:none}

/* article */
.legal{padding:56px 0 88px}
.legal .eyebrow{font-family:var(--font-m); font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--c1)}
.legal h1{font-family:var(--font-d); font-weight:700; font-size:clamp(32px,5vw,46px); letter-spacing:-0.025em; line-height:1.1; margin:14px 0 10px}
.legal .updated{font-family:var(--font-m); font-size:12.5px; color:var(--dim); margin:0 0 40px}
.legal .lead{font-size:18px; color:var(--muted); margin:0 0 36px; line-height:1.6}
.legal h2{font-family:var(--font-d); font-weight:700; font-size:22px; letter-spacing:-0.015em; margin:42px 0 12px; color:var(--ink)}
.legal h3{font-weight:600; font-size:16.5px; margin:24px 0 8px; color:var(--ink-2)}
.legal p{color:var(--muted); font-size:15.5px; margin:0 0 14px}
.legal ul{color:var(--muted); font-size:15.5px; margin:0 0 16px; padding-left:22px}
.legal li{margin:6px 0}
.legal li::marker{color:var(--dim)}
.legal strong{color:var(--ink-2); font-weight:600}
.legal a{font-weight:500}
.legal .note{
  background:var(--c1-soft); border:1px solid color-mix(in oklab, var(--c1) 20%, var(--line));
  border-radius:12px; padding:16px 18px; font-size:14.5px; color:var(--ink-2); margin:24px 0;
}
.legal hr{border:0; border-top:1px solid var(--line); margin:44px 0}
.legal .toc{
  background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:18px 22px; margin:0 0 40px;
}
.legal .toc b{font-family:var(--font-m); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--dim); display:block; margin-bottom:10px}
.legal .toc ol{margin:0; padding-left:20px; columns:2; column-gap:28px; font-size:14px}
.legal .toc li{margin:4px 0}
@media (max-width:600px){ .legal .toc ol{columns:1} }

/* footer */
.lg-foot{border-top:1px solid var(--line); background:var(--surface); padding:32px 0; margin-top:0}
.lg-foot .inner{
  display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
  font-family:var(--font-m); font-size:11.5px; letter-spacing:0.05em; color:var(--dim);
}
.lg-foot a{color:var(--dim); font-weight:500}
.lg-foot a:hover{color:var(--ink)}
.lg-foot .links{display:flex; gap:18px}
