:root {
  --background: #ffffff;
  --foreground: #0a192f;
  
  --navy: #0a192f;
  --navy-light: #112240;
  --burgundy: #8a1c1c;
  --burgundy-light: #a32222;
  
  --glass-dark: rgba(10, 25, 47, 0.7);
  --glass-light: rgba(255, 255, 255, 0.7);
  --glass-border-dark: rgba(255, 255, 255, 0.1);
  --glass-border-light: rgba(10, 25, 47, 0.1);
}

html {
  font-size: 97.5%; /* Scales all rem-based font sizes globally to 97.5% */
}

body {
  margin: 0;
  background-color: var(--background);
  color: var(--foreground);
  -webkit-font-smoothing: antialiased;
  font-family: "Open Sans", sans-serif;
  font-weight: 400;
  line-height: 1.5;
}

.glass-dark {
  background: var(--glass-dark);
  backdrop-filter: blur(12px);
  border: 1px solid var(--glass-border-dark);
}

.glass-light {
  background: var(--glass-light);
  backdrop-filter: blur(12px);
  border: 1px solid var(--glass-border-light);
}

/* ====== Scroll Reveal Animations ====== */
.reveal {
  opacity: 0;
  will-change: transform, opacity;
}
.reveal.is-revealed {
  opacity: 1;
}

/* Slide Up */
.reveal-fade-up {
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-fade-up.is-revealed { transform: translateY(0); }

/* Slide Down */
.reveal-fade-down {
  transform: translateY(-40px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-fade-down.is-revealed { transform: translateY(0); }

/* Slide Left (moving to the right from -x) */
.reveal-slide-left {
  transform: translateX(-40px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-slide-left.is-revealed { transform: translateX(0); }

/* Slide Right (moving to left from +x) */
.reveal-slide-right {
  transform: translateX(40px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-slide-right.is-revealed { transform: translateX(0); }

/* RTL Overrides */
[dir="rtl"] .reveal-slide-left { transform: translateX(40px); }
[dir="rtl"] .reveal-slide-right { transform: translateX(-40px); }

/* Scale In */
.reveal-scale-in {
  transform: scale(0.9);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-scale-in.is-revealed { transform: scale(1); }

/* Delays */
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }

/* Custom scrollbar utility */
.scrollbar-thin::-webkit-scrollbar {
  width: 4px;
}
.scrollbar-thin::-webkit-scrollbar-track {
  background: transparent;
}
.scrollbar-thin::-webkit-scrollbar-thumb {
  background-color: rgba(156, 163, 175, 0.4);
  border-radius: 2px;
}
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
  background-color: rgba(156, 163, 175, 0.6);
}
.scrollbar-thin {
  scrollbar-width: thin;
  scrollbar-color: rgba(156, 163, 175, 0.4) transparent;
}

/* Article Content Layout & Typography Sync */
.article-content {
  font-family: "Open Sans", Arial, sans-serif;
}

.article-content h2 {
  font-size: 24px;
  line-height: 1.35;
  font-weight: 700;
  margin: 0 0 24px;
}

.article-content h3 {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 700;
  margin: 0 0 20px;
}

.article-content p,
.article-content li {
  font-size: 16px;
  line-height: 1.75;
  font-weight: 400;
}

.article-content li {
  margin-bottom: 8px;
}

/* Page Title h1 Size Tuning */
h1 {
  font-size: 30px !important;
  line-height: 1.25 !important;
}

@media (min-width: 768px) {
  h1 {
    font-size: 48px !important;
    line-height: 1.15 !important;
  }
}