/* ===========================================================
   Tremad Schools — custom styles
   Tailwind (via CDN, see index.html) handles all utility classes.
   This file only holds things Tailwind can't: brand color tokens,
   the custom font stack, and small fixes.
   =========================================================== */

:root {
  /* Brand green used across nav / hero / CTA button text / programs bg.
     I couldn't find the exact hex in the scraped page, so this is a
     best-guess placeholder — swap it for your real brand color. */
  --color-primary-green: #6b3f2d;
  --color-bg-white: #ffffff;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family:
    "Geist",
    ui-sans-serif,
    system-ui,
    -apple-system,
    sans-serif;
  background: #ffffff !important;
}

/* ── Green header overrides ───────────────────────────────────
   Replace every Tailwind green text shade on heading elements
   with the brand brown #6b3f2d.
   ─────────────────────────────────────────────────────────── */

.text-green-800 {
  color: #9b6c59 !important;
}

h1.text-green-50,
h2.text-green-50,
h3.text-green-50,
h4.text-green-50,
h1.text-green-100,
h2.text-green-100,
h3.text-green-100,
h4.text-green-100,
h1.text-green-200,
h2.text-green-200,
h3.text-green-200,
h4.text-green-200,
h1.text-green-300,
h2.text-green-300,
h3.text-green-300,
h4.text-green-300,
h1.text-green-400,
h2.text-green-400,
h3.text-green-400,
h4.text-green-400,
h1.text-green-500,
h2.text-green-500,
h3.text-green-500,
h4.text-green-500,
h1.text-green-600,
h2.text-green-600,
h3.text-green-600,
h4.text-green-600,
h1.text-green-700,
h2.text-green-700,
h3.text-green-700,
h4.text-green-700,
h1.text-green-800,
h2.text-green-800,
h3.text-green-800,
h4.text-green-800,
h1.text-green-900,
h2.text-green-900,
h3.text-green-900,
h4.text-green-900 {
  color: #9b6c59 !important;
}

/* Also target the hardcoded teal/green hex used on some headings */
h1[class*="text-[#10534A]"],
h2[class*="text-[#10534A]"],
h3[class*="text-[#10534A]"],
h4[class*="text-[#10534A]"] {
  color: #6b3f2d !important;
}

/* Button text that uses green-800 (hero CTA) */
button.text-green-800,
a.text-green-800 {
  color: #6b3f2d !important;
}