/* 
 * Typography and Color Contrast Optimization
 * Enhanced readability and brand consistency
 */

:root {
  /* Primary color palette */
  --primary-color: #1A365D;     /* Deep blue - main brand color */
  --primary-dark: #142C4C;      /* Darker blue for hover states */
  --primary-light: #2A4A7D;     /* Lighter blue for backgrounds */
  
  /* Secondary color palette */
  --secondary-color: #3182CE;   /* Medium blue for secondary elements */
  --secondary-dark: #2C5282;    /* Darker medium blue */
  --secondary-light: #4299E1;   /* Lighter medium blue */
  
  /* Accent color palette */
  --accent-color: #D69E2E;      /* Gold - for CTAs and highlights */
  --accent-dark: #B7791F;       /* Darker gold for hover states */
  --accent-light: #ECC94B;      /* Lighter gold for backgrounds */
  
  /* Text colors */
  --text-dark: #2D3748;         /* Dark gray for primary text */
  --text-medium: #4A5568;       /* Medium gray for secondary text */
  --text-light: #FFFFFF;        /* White for text on dark backgrounds */
  
  /* Background colors */
  --background-light: #FFFFFF;  /* White background */
  --background-gray: #F7FAFC;   /* Light gray background */
  --background-dark: #1A202C;   /* Dark background */
  
  /* Font families */
  --font-heading: 'Montserrat', sans-serif;
  --font-body: 'Open Sans', sans-serif;
  
  /* Font weights */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  
  /* Font sizes */
  --size-xs: 0.75rem;    /* 12px */
  --size-sm: 0.875rem;   /* 14px */
  --size-base: 1rem;     /* 16px */
  --size-md: 1.125rem;   /* 18px */
  --size-lg: 1.25rem;    /* 20px */
  --size-xl: 1.5rem;     /* 24px */
  --size-2xl: 1.75rem;   /* 28px */
  --size-3xl: 2rem;      /* 32px */
  --size-4xl: 2.5rem;    /* 40px */
  --size-5xl: 3rem;      /* 48px */
  
  /* Line heights */
  --line-height-tight: 1.2;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.7;
  
  /* Letter spacing */
  --letter-spacing-tight: -0.025em;
  --letter-spacing-normal: 0;
  --letter-spacing-wide: 0.025em;
}

/* Base typography */
body {
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: var(--size-base);
  line-height: var(--line-height-normal);
  color: var(--text-dark);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Heading typography */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-heading);
  font-weight: var(--weight-bold);
  line-height: var(--line-height-tight);
  color: var(--primary-color);
  margin-top: 0;
  margin-bottom: 1rem;
}

h1, .h1 {
  font-size: var(--size-5xl);
  letter-spacing: var(--letter-spacing-tight);
}

h2, .h2 {
  font-size: var(--size-4xl);
  letter-spacing: var(--letter-spacing-tight);
}

h3, .h3 {
  font-size: var(--size-3xl);
}

h4, .h4 {
  font-size: var(--size-2xl);
}

h5, .h5 {
  font-size: var(--size-xl);
}

h6, .h6 {
  font-size: var(--size-lg);
}

/* Paragraph typography */
p {
  margin-top: 0;
  margin-bottom: 1.5rem;
  line-height: var(--line-height-relaxed);
}

.lead {
  font-size: var(--size-lg);
  font-weight: var(--weight-regular);
  line-height: var(--line-height-relaxed);
}

.small {
  font-size: var(--size-sm);
}

/* Link typography */
a {
  color: var(--primary-color);
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: var(--accent-color);
}

/* Text emphasis */
strong, b {
  font-weight: var(--weight-bold);
}

em, i {
  font-style: italic;
}

/* Text alignment */
.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

/* Text colors */
.text-primary {
  color: var(--primary-color);
}

.text-secondary {
  color: var(--secondary-color);
}

.text-accent {
  color: var(--accent-color);
}

.text-dark {
  color: var(--text-dark);
}

.text-medium {
  color: var(--text-medium);
}

.text-light {
  color: var(--text-light);
}

/* Background colors */
.bg-primary {
  background-color: var(--primary-color);
  color: var(--text-light);
}

.bg-secondary {
  background-color: var(--secondary-color);
  color: var(--text-light);
}

.bg-accent {
  background-color: var(--accent-color);
  color: var(--text-dark);
}

.bg-light {
  background-color: var(--background-light);
  color: var(--text-dark);
}

.bg-gray {
  background-color: var(--background-gray);
  color: var(--text-dark);
}

.bg-dark {
  background-color: var(--background-dark);
  color: var(--text-light);
}

/* Section headings */
.section-heading {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
}

.section-title {
  font-size: var(--size-4xl);
  margin-bottom: 1rem;
  position: relative;
  display: inline-block;
}

.section-title::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  background-color: var(--accent-color);
  border-radius: 2px;
}

.section-subtitle {
  font-size: var(--size-lg);
  max-width: 800px;
  margin: 1.5rem auto 0;
  color: var(--text-medium);
}

/* Lists */
ul, ol {
  margin-top: 0;
  margin-bottom: 1.5rem;
  padding-left: 1.5rem;
}

li {
  margin-bottom: 0.5rem;
}

/* Blockquotes */
blockquote {
  border-left: 4px solid var(--accent-color);
  padding-left: 1.5rem;
  margin-left: 0;
  margin-right: 0;
  font-style: italic;
  color: var(--text-medium);
}

blockquote cite {
  display: block;
  margin-top: 1rem;
  font-style: normal;
  font-weight: var(--weight-semibold);
  font-size: var(--size-sm);
}

/* Code */
code {
  font-family: monospace;
  background-color: var(--background-gray);
  padding: 0.2em 0.4em;
  border-radius: 3px;
  font-size: 0.9em;
}

/* High contrast text combinations */
.high-contrast-dark {
  color: var(--text-light);
  background-color: var(--primary-dark);
}

.high-contrast-light {
  color: var(--primary-dark);
  background-color: var(--text-light);
}

.high-contrast-accent {
  color: var(--text-dark);
  background-color: var(--accent-color);
}

/* Optimized font rendering */
.optimize-legibility {
  text-rendering: optimizeLegibility;
}

/* Truncate text with ellipsis */
.text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Text wrapping */
.text-nowrap {
  white-space: nowrap;
}

.text-break {
  word-wrap: break-word;
  word-break: break-word;
}

/* Font smoothing */
.font-smooth {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Responsive typography */
@media (max-width: 1200px) {
  h1, .h1 {
    font-size: calc(var(--size-4xl) + 0.5rem);
  }
  
  h2, .h2 {
    font-size: var(--size-3xl);
  }
  
  .section-title {
    font-size: var(--size-3xl);
  }
}

@media (max-width: 992px) {
  h1, .h1 {
    font-size: var(--size-4xl);
  }
  
  h2, .h2 {
    font-size: calc(var(--size-2xl) + 0.25rem);
  }
  
  h3, .h3 {
    font-size: var(--size-2xl);
  }
  
  .section-title {
    font-size: calc(var(--size-2xl) + 0.25rem);
  }
  
  .section-subtitle {
    font-size: var(--size-md);
  }
}

@media (max-width: 768px) {
  h1, .h1 {
    font-size: calc(var(--size-3xl) + 0.25rem);
  }
  
  h2, .h2 {
    font-size: var(--size-2xl);
  }
  
  h3, .h3 {
    font-size: calc(var(--size-xl) + 0.25rem);
  }
  
  .section-title {
    font-size: var(--size-2xl);
  }
  
  .lead {
    font-size: var(--size-md);
  }
}

@media (max-width: 576px) {
  h1, .h1 {
    font-size: var(--size-3xl);
  }
  
  h2, .h2 {
    font-size: calc(var(--size-xl) + 0.5rem);
  }
  
  .section-title {
    font-size: calc(var(--size-xl) + 0.5rem);
  }
}

/* High contrast mode */
@media (prefers-contrast: high) {
  body {
    color: #000000;
  }
  
  h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #000000;
  }
  
  a {
    color: #000000;
    text-decoration: underline;
  }
  
  .section-title::after {
    background-color: #000000;
  }
  
  blockquote {
    border-left-color: #000000;
    color: #000000;
  }
  
  .text-medium {
    color: #000000;
  }
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
  }
}