/* SchoolGPT design system tokens.
   Reconstructed from the Claude Design export (Homepage Redesign): the homepage
   CSS references a `_ds/…/tokens/*.css` bundle that ships with the design tool
   but was not part of the handover, so the same variable names are defined here.
   Values come from the brand gradient (#bd0dff → #1a9efa) and the design's own
   screenshots. Change a value here and every new_schoolgpt page follows. */
:root {
  /* Brand ---------------------------------------------------------------- */
  --sg-electric-purple:#bd0dff;
  --sg-celestial-blue:#1a9efa;
  --sg-vista-blue:#6b7fc0;
  --sg-deep-indigo:#221a49;
  --sg-blue-100:#e4f1fe;
  --sg-vista-100:#e7e9f7;
  --sg-success:#12a150;
  --sg-star:#f5a524;
  --sg-gradient:linear-gradient(135deg,#bd0dff 0%,#1a9efa 100%);
  --sg-gradient-soft:linear-gradient(135deg,rgba(189,13,255,.12) 0%,rgba(26,158,250,.12) 100%);

  /* Surfaces ------------------------------------------------------------- */
  --surface-page:#f4f9fd;
  --surface-card:#ffffff;
  --surface-sunken:#eef2f8;
  --surface-inverse:#181438;

  /* Borders -------------------------------------------------------------- */
  --border-subtle:#e6ebf3;
  --border-default:#d7deea;

  /* Text ----------------------------------------------------------------- */
  --text-strong:#221a49;
  --text-body:#4a5570;
  --text-muted:#7b849c;
  --text-link:#0b7ed4;

  /* Actions -------------------------------------------------------------- */
  --action-primary:#0b7ed4;
  --action-primary-hover:#0a68ae;
  --action-primary-text:#ffffff;

  /* Type ----------------------------------------------------------------- */
  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --font-display:'DM Sans','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --fs-sm:13px;
  --fs-lg:17px;
  --fs-h4:18px;
  --fw-semibold:600;
  --fw-bold:700;
  --lh-relaxed:1.65;

  /* Radii ---------------------------------------------------------------- */
  --radius-md:12px;
  --radius-lg:18px;
  --radius-xl:26px;
  --radius-pill:999px;

  /* Elevation ------------------------------------------------------------ */
  --shadow-sm:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.06);
  --shadow-lg:0 18px 40px rgba(16,24,40,.10);
  --shadow-brand:0 18px 40px rgba(120,40,220,.22);

  /* Motion & layout ------------------------------------------------------ */
  --ease-standard:cubic-bezier(.2,.8,.2,1);
  --dur-base:.25s;
  --container-max:1200px;
}