/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');

/* CSS Custom Properties - Color Palette */
:root {
  /* Primary Color Palette */
  --color-primary-blue: #354a93;
  --color-secondary-blue: #5997C7;
  --color-primary-orange: #EC802F;
  --color-secondary-yellow: #FDC34D;
  --color-neutral-tan: #D5B8A7;
  --color-neutral-peach: #F9D2C0;
  
  /* Grayscale Variations */
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-gray-light: #F5F5F5;
  --color-gray-medium: #CCCCCC;
  --color-gray-dark: #666666;
  
  /* Font Families */
  --font-primary: 'Fraunces', serif;
  --font-secondary: 'Nunito', sans-serif;
  
  /* Font Weights (Nunito) */
  --font-weight-extralight: 200;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  --font-weight-black: 900;
  
  /* Section Color Schemes - Single Source of Truth */
  /* Parents section uses orange/yellow accent colors */
  --parents-accent-primary: var(--color-primary-orange);
  --parents-accent-secondary: var(--color-secondary-yellow);
  
  /* Schools section uses blue accent colors */
  --schools-accent-primary: var(--color-secondary-blue);
  --schools-accent-secondary: var(--color-primary-blue);
  
  /* Section Padding - Single Source of Truth */
  /* Desktop: rem for fixed spacing */
  --section-padding-vertical: 4rem;
  --section-padding-horizontal: 2rem;
  
  /* Mobile padding overrides */
  --section-padding-vertical-mobile: 2.5rem;
  --section-padding-horizontal-mobile: 1.5rem;
  
  /* Section margins - rem for fixed spacing */
  --section-margin-vertical: 6rem;
  --section-margin-vertical-mobile: 4rem;
}

/* Base Typography */
body {
  font-family: var(--font-secondary);
  font-weight: var(--font-weight-regular);
  color: var(--color-black);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-primary);
}

/* Utility Classes for Colors */
.text-primary-blue { color: var(--color-primary-blue); }
.text-secondary-blue { color: var(--color-secondary-blue); }
.text-primary-orange { color: var(--color-primary-orange); }
.text-secondary-yellow { color: var(--color-secondary-yellow); }
.text-neutral-tan { color: var(--color-neutral-tan); }
.text-neutral-peach { color: var(--color-neutral-peach); }

.bg-primary-blue { background-color: var(--color-primary-blue); }
.bg-secondary-blue { background-color: var(--color-secondary-blue); }
.bg-primary-orange { background-color: var(--color-primary-orange); }
.bg-secondary-yellow { background-color: var(--color-secondary-yellow); }
.bg-neutral-tan { background-color: var(--color-neutral-tan); }
.bg-neutral-peach { background-color: var(--color-neutral-peach); }

/* Utility Classes for Fonts */
.font-primary { font-family: var(--font-primary); }
.font-secondary { font-family: var(--font-secondary); }