/* ============ Didactic Initiatives — /tagwipe legal pages stylesheet ============ */
/* Shared by /tagwipe/privacy/ and /tagwipe/terms/. Tokens mirror the homepage. */
:root{
  --bg:          oklch(15% 0.012 250);
  --surface:     oklch(19% 0.014 250);
  --fg:          oklch(96% 0.005 100);
  --muted:       oklch(68% 0.012 250);
  --border:      oklch(34% 0.014 250);
  --accent:      oklch(78% 0.21 150);
  --accent-deep: oklch(26% 0.07 155);
  --font-display:'Playfair Display','DM Serif Display',Georgia,serif;
  --font-body:   'Inter','DM Sans',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --font-mono:   ui-monospace,'JetBrains Mono','SF Mono',Menlo,monospace;
  --gutter: clamp(20px,4vw,64px);
  --line: 1px solid var(--border);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--accent);color:oklch(15% 0.02 155)}
a{color:inherit}
.mono{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase}

/* topnav (matches homepage) */
.topnav{position:sticky;top:0;z-index:50;display:flex;align-items:stretch;justify-content:space-between;border-bottom:var(--line);background:color-mix(in oklch,var(--bg) 88%,transparent);backdrop-filter:blur(12px)}
.topnav .brand{padding:18px var(--gutter);font-family:var(--font-mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;text-decoration:none;border-right:var(--line)}
.topnav .brand b{color:var(--accent);font-weight:600}
.topnav nav{display:flex}
.topnav nav a{display:flex;align-items:center;padding:18px clamp(12px,2.2vw,28px);font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--muted);border-left:var(--line);transition:color .15s,background .15s}
.topnav nav a:hover{color:var(--fg);background:var(--surface)}
.topnav nav a.active{color:var(--accent)}

/* article shell */
main.post{max-width:760px;margin:0 auto;padding:clamp(28px,5vh,64px) var(--gutter) 0}
.crumbs{color:var(--muted);margin-bottom:clamp(24px,4vh,40px);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{text-decoration:none;color:var(--muted)}
.crumbs a:hover{color:var(--accent)}
.crumbs span{color:var(--fg)}
article .eyebrow{color:var(--muted);display:flex;align-items:center;gap:14px;margin-bottom:20px}
article .eyebrow::before{content:"";width:34px;height:1px;background:var(--muted)}
article h1{font-family:var(--font-display);font-weight:900;font-size:clamp(32px,5.2vw,58px);line-height:1.05;letter-spacing:-.015em;text-wrap:balance;margin-bottom:18px}
.byline{color:var(--muted);margin-bottom:clamp(28px,4vh,44px);padding-bottom:clamp(28px,4vh,44px);border-bottom:var(--line)}
article h2{font-family:var(--font-display);font-weight:700;font-size:clamp(22px,3vw,32px);line-height:1.15;letter-spacing:-.01em;margin:clamp(36px,5.5vh,56px) 0 16px}
article p{margin:0 0 18px;color:oklch(90% 0.006 100)}
article a{color:var(--accent);text-decoration:none;border-bottom:1px solid color-mix(in oklch,var(--accent) 40%,transparent);transition:border-color .15s;word-break:break-word}
article a:hover{border-bottom-color:var(--accent)}
article strong{color:var(--fg);font-weight:600}
article ul,article ol{margin:0 0 18px;padding-left:1.3em;color:oklch(90% 0.006 100)}
article li{margin-bottom:8px}
article li::marker{color:var(--accent)}

/* footer */
footer{border-top:var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:22px var(--gutter);margin-top:clamp(40px,6vh,64px)}
footer .mono{color:var(--muted)}
footer a{text-decoration:none}
footer a:hover{color:var(--accent)}

@media (max-width:760px){
  .topnav nav a:nth-child(2),.topnav nav a:nth-child(3),.topnav nav a:nth-child(4){display:none}
}