/* Shared styling for the privacy / terms / pricing pages. Matches index.html's
   palette so these pages don't look bolted on. */
:root{
  --bg:#fff8f0;
  --card:#ffffff;
  --border:rgba(30,15,15,0.09);
  --text:#20172f;
  --body:#3a3050;   /* body copy: intentionally softer than --text */
  --muted:#6c6280;
  --purple:#8b5cf6;
  --blue:#2ea9e0;
  --pop:#ff6b4a;
  --pop2:#ff3d81;
  /* Separate from --blue on purpose: --blue is used decoratively (borders,
     tinted backgrounds) where WCAG's stricter 4.5:1 text contrast doesn't
     apply. Link TEXT needs its own token, or it inherits whatever contrast
     the decorative color happens to have — on this cream background --blue
     alone measures 2.53:1, well under AA. */
  --link:#0d6ea3;   /* 5.28:1 on --bg */
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.65;
}
header{
  max-width:820px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:24px 24px 0;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;text-decoration:none;color:var(--text);}
.brand img{width:32px;height:32px;border-radius:9px;display:block;}
header nav a{color:var(--muted);text-decoration:none;font-size:14px;margin-left:24px;}
header nav a:hover{color:var(--text);}

main{max-width:820px;margin:0 auto;padding:48px 24px 96px;}
h1{font-size:38px;line-height:1.15;letter-spacing:-0.02em;margin:0 0 10px;}
.updated{color:var(--muted);font-size:14px;margin:0 0 36px;}
h2{
  font-size:20px;letter-spacing:-0.01em;margin:40px 0 12px;
  padding-top:26px;border-top:1px solid var(--border);
}
h2:first-of-type{border-top:none;padding-top:0;}
h3{font-size:16px;margin:26px 0 8px;}
p,li{color:var(--body);font-size:15.5px;}
ul{padding-left:22px;margin:12px 0;}
li{margin-bottom:8px;}
a{color:var(--link);}
strong{color:var(--text);}

.callout{
  background:var(--card);border:1px solid var(--border);
  border-left:3px solid var(--purple);
  border-radius:12px;padding:18px 20px;margin:22px 0;
}
.callout p:last-child{margin-bottom:0;}
.callout p:first-child{margin-top:0;}

table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14.5px;}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--border);vertical-align:top;}
th{color:var(--muted);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:0.04em;}
.table-wrap{overflow-x:auto;}

footer{
  max-width:820px;margin:0 auto;padding:32px 24px 56px;
  border-top:1px solid var(--border);color:var(--muted);font-size:13.5px;
}
footer a{color:var(--muted);}