@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Montserrat:wght@300;400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
  --font-sans: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-brand: 'Montserrat', 'Century Gothic', 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --color-brand-primary: #0f766e;
  --color-brand-dark: #115e59;
  --color-brand-accent: #0284c7;
}

.font-brand {
  font-family: var(--font-brand);
}

html {
  font-family: var(--font-sans);
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  color: #1e293b;
  background-color: #f8fafc;
  line-height: 1.6;
}

/* Accessible focus ring for WCAG AA compliance */
*:focus-visible {
  outline: 2px solid #0d9488 !important;
  outline-offset: 2px !important;
}

/* Custom interactive checklist */
.checklist-label:has(input:checked) {
  background-color: #f0fdfa;
  border-color: #0d9488;
  color: #134e4a;
}

.checklist-label:has(input:checked) .check-icon {
  background-color: #0d9488;
  border-color: #0d9488;
  color: #ffffff;
}

/* Smooth transitions */
.transition-card {
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.transition-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px -5px rgba(15, 118, 110, 0.08), 0 8px 10px -6px rgba(15, 118, 110, 0.04);
}

/* Mission Card Header row layout - ensures icons and headers always stay on the same line */
.mission-card-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 0.875rem !important;
}

.mission-card-header .mission-card-icon {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.mission-card-header h3 {
  margin: 0 !important;
}

/* Accordion transition */
.accordion-content {
  transition: max-height 0.3s ease-out, opacity 0.2s ease-out;
}

/* Logo tagline scroll visibility: only appears on scroll when top bar is out of view without moving menu */
@media (min-width: 1280px) {
  .logo-link {
    width: 330px;
    flex-shrink: 0;
  }

  .logo-tagline {
    opacity: 0;
    pointer-events: none;
    white-space: nowrap;
    transform: translateX(-4px);
    transition: opacity 0.25s ease, transform 0.25s ease;
  }

  .logo-tagline.is-scrolled {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
  }
}


/* Print optimizations */
@media print {
  header, footer, #mobileDrawer, .no-print {
    display: none !important;
  }
  body {
    background: #ffffff !important;
    color: #000000 !important;
  }
}