/* Shared look for every pedagrade.com page except the homepage, which carries these same rules inline.
   The "Peer Review" direction: Newsreader headings, Public Sans body, Plex Mono labels, paper ground,
   ink buttons, indigo links. Loaded AFTER each page's own <style>, so these rules win, and the inner
   pages' own token names (--accent, --dim, --canvas ...) are remapped onto the same palette. */
:root{
  --paper:#fcfcfa; --card:#ffffff; --rule:#d9dce1; --body:#3d434c;
  --indigo:#3a4ca8; --indigo-press:#2f3f8f; --indigo-soft:#eceefa;
  --pass:#1e7f5c; --pass-soft:#e1f2ea; --gap:#8a5d10; --gap-soft:#fbefd9; --miss:#9b2c1d; --miss-soft:#fbe6e2;
  --display:"Newsreader", Georgia, "Times New Roman", serif;
  --sans:"Public Sans", -apple-system, "Segoe UI", system-ui, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ink:#1b1f24; --ink-soft:#3d434c; --dim:#5a616b; --muted:#5a616b; --faint:#b6b9bf;
  --line:#d9dce1; --line-2:#c9cdd3; --canvas:#fcfcfa; --soft:#f3f4f2;
  --accent:#3a4ca8; --accent-press:#2f3f8f; --accent-tint:#eceefa;
  --good:#1e7f5c; --high-bg:#fbe6e2; --high-ink:#9b2c1d;
  --radius:8px;
  color-scheme:light;
}
body{background:var(--paper); color:var(--body); font-family:var(--sans); -webkit-font-smoothing:antialiased;}
a{color:var(--indigo);}
h1{font-family:var(--display); font-weight:500; font-size:clamp(34px,4.6vw,46px); line-height:1.08; letter-spacing:-.02em; color:var(--ink); text-wrap:balance;}
h2{font-family:var(--display); font-weight:500; letter-spacing:-.015em; color:var(--ink);}
.eyebrow{font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.05em; text-transform:uppercase; color:var(--indigo);}

/* Buttons: ink, like the homepage */
.btn{display:inline-block; background:var(--ink); color:var(--paper); border-radius:6px; padding:11px 18px; font-weight:600; font-size:14.5px; white-space:nowrap;}
.btn:hover{background:#000; text-decoration:none;}
.btn.ghost, .btn.secondary{background:transparent; color:var(--indigo); border:1px solid var(--indigo);}

/* Header: the homepage's, on every page */
header.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:10; background:rgba(252,252,250,.94); backdrop-filter:saturate(160%) blur(8px); -webkit-backdrop-filter:saturate(160%) blur(8px); border-bottom:1px solid var(--rule);}
header.top .nav{display:flex; align-items:center; justify-content:space-between; height:64px; gap:18px; max-width:1080px; margin:0 auto; padding:0 24px; box-sizing:border-box;}
header.top .logo{display:flex; align-items:center; gap:10px; font-family:var(--display); font-size:24px; font-weight:600; color:var(--ink); text-decoration:none;}
header.top .navlinks{display:flex; align-items:center; gap:22px; font-size:14.5px; font-family:var(--sans);}
header.top .navlinks a{color:var(--body); text-decoration:none;}
header.top .navlinks a:hover{text-decoration:underline;}
header.top .navlinks .btn{color:var(--paper);}
header.top .navlinks .btn:hover{text-decoration:none;}
header.top .navlinks a.nav-signin{font-weight:600; color:var(--ink);}
@media (max-width:900px){ header.top .navlinks a:not(.btn):not(.nav-signin){display:none;} }

/* Footer: same voice as the homepage footer */
.pg-foot{border-top:1px solid var(--rule); background:var(--paper); color:var(--muted);}
.pg-foot-logo{font-family:var(--display); font-size:20px; font-weight:600; color:var(--ink);}
.pg-foot-cols h2{font-family:var(--mono); font-size:11.5px; font-weight:500; letter-spacing:.05em; text-transform:uppercase; color:var(--muted);}
.pg-foot-cols a{color:var(--body);}
.pg-foot-cta{color:var(--indigo);}
.pg-foot-base{border-top:1px solid var(--rule);}

/* Ink buttons keep paper text inside guide and check bodies (.g-body a would otherwise turn them indigo) */
.g-body a.btn, .g-cta a.btn{color:var(--paper); text-decoration:none;}

/* Phone header: logo, Sign in and Try it free on one line */
header.top .navlinks a{white-space:nowrap;}
@media (max-width:480px){
  header.top .nav{padding:0 16px; gap:10px;}
  header.top .logo{font-size:21px; gap:8px;}
  header.top .navlinks{gap:12px; font-size:14px;}
  header.top .navlinks .btn{padding:9px 13px; font-size:14px;}
}

/* Logo lockup: ink mark, lighter wordmark, mark nudged onto the text's optical center */
header.top .logo{font-weight:500; letter-spacing:-.01em; gap:9px;}
/* Center the mark on the capitals (measured: caps sat ~3px above the mark at 24px) */
header.top .logo, .pg-foot-logo{padding-top:.17em;}
header.top .logo svg, .pg-foot-logo svg{transform:translateY(-.09em);}
.pg-foot-logo{font-weight:500;}
