:root {
  --wa-font-family: var(--inter-regular);

  --wa-color-white: #ffffff;
  --wa-color-black: #111827;
  --wa-color-primary-900: #0f2f4e;
  --wa-color-primary-800: #144068;
  --wa-color-primary-700: #184e81;
  --wa-color-primary-600: #226db4;
  --wa-color-primary-500: #2f82d3;
  --wa-color-primary-300: #b8d3ea;
  --wa-color-primary-100: #e6eff7;

  --wa-color-text-700: #334155;
  --wa-color-text-600: #475569;
  --wa-color-text-500: #64748b;
  --wa-color-text-400: #959393;
  --wa-color-text-300: #9d9b9b;

  --wa-color-success-500: #01a407;
  --wa-color-success-100: #c8eec7;

  --wa-color-surface-hero: #dce7f2;
  --wa-color-surface-soft: #f4f8fc;
  --wa-color-card-border: #f3f4f6;

  --wa-space-1: 0.25rem;
  --wa-space-2: 0.5rem;
  --wa-space-3: 0.75rem;
  --wa-space-4: 1rem;
  --wa-space-5: 1.25rem;
  --wa-space-6: 1.5rem;
  --wa-space-8: 2rem;
  --wa-space-10: 2.5rem;
  --wa-space-12: 3rem;
  --wa-space-16: 4rem;
  --wa-space-20: 5rem;

  --wa-radius-sm: 0.5rem;
  --wa-radius-md: 0.75rem;
  --wa-radius-lg: 1.25rem;
  --wa-radius-xl: 2.5rem;
  --wa-radius-2xl: 5rem;

  --wa-font-12: 0.75rem;
  --wa-font-14: 0.875rem;
  --wa-font-15: 0.9375rem;
  --wa-font-16: 1rem;
  --wa-font-18: 1.125rem;
  --wa-font-20: 1.25rem;
  --wa-font-24: 1.5rem;
  --wa-font-30: 1.875rem;
  --wa-font-36: 2.25rem;
  --wa-font-48: 3rem;

  --wa-container-width: min(100%, 87.5rem);
  --wa-container-padding: clamp(1rem, 2.6vw, 4.375rem);
  --wa-hero-background: url(../../images/site/herosectionbg.71b44ab3ed0a06854865ce3761a340d7.png);
  --white-op: #ffffff1a;
}

* {
  box-sizing: border-box;
  font-weight: normal;
  font-family: var(--inter-regular);
}

body {
  margin: 0;
  font-family: var(--wa-font-family);
  font-weight: normal;
  color: var(--wa-color-black);
  background: var(--wa-color-white);
}

a {
  color: inherit;
  text-decoration: none;
}

img,
svg {
  display: block;
  max-width: 100%;
}

.wa-container {
  width: var(--wa-container-width);
  margin-inline: auto;
  padding-inline: var(--wa-container-padding);
}

.wa-gradient-text {
  background: linear-gradient(90deg, var(--wa-color-primary-900) 0%, var(--wa-color-primary-800) 25%, var(--wa-color-primary-700) 50%, var(--wa-color-primary-600) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

.hero__heading .wa-gradient-text,
.vision__title .wa-gradient-text {
  font-family: var(--inter-sbold);
}

.wa-section-heading {
  margin: 0;
  font-size: clamp(1.8rem, 4vw, var(--wa-font-36));
  line-height: 1.25;
  letter-spacing: -0.02em;
  font-family: var(--inter-medium);
}

.wa-button {
  border: 0;
  border-radius: var(--wa-radius-lg);
  min-height: 2.625rem;
  padding: 0.75rem 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--wa-space-2);
  font-family: var(--wa-font-family);
  font-size: var(--wa-font-16);
  cursor: pointer;
  line-height: 1;
}

.wa-button-secondary {
  border: 1px solid var(--wa-color-primary-600);
  color: var(--wa-color-primary-600);
  background: #fff;
}

.wa-button-secondary:hover {
  color: var(--wa-color-primary-700);
  border: 1px solid var(--wa-color-primary-700);
}

.wa-button--primary {
  background: var(--wa-color-primary-600);
  color: var(--wa-color-white);
}

.wa-button--primary:hover {
  background: var(--wa-color-primary-700);
}

.wa-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2);
  border: 1px solid var(--wa-color-success-100);
  border-radius: var(--wa-radius-lg);
  background: rgba(200, 238, 199, 0.24);
  padding: 0.625rem 1.375rem;
  color: var(--wa-color-success-500);
  font-size: var(--wa-font-12);
  letter-spacing: 0.03em;
}

.wa-pill__dot {
  inline-size: 0.3125rem;
  block-size: 0.3125rem;
  border-radius: 50%;
  background: var(--wa-color-success-500);
}

.wa-card {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-4);
  background: var(--wa-color-white);
  border-radius: var(--wa-radius-lg);
}

.wa-footer-link {
  color: var(--wa-color-text-700);
  font-size: var(--wa-font-15);
  line-height: 1.4;
  font-family: var(--inter-light);
}

.wa-footer-link:hover {
  color: var(--wa-color-primary-600);
}

.mission {
  background: url(../../images/site/mission.02c1c3807bd1e16d643614fbec33aed1.png);
  padding-block: 5.625rem;
  background-size: cover;
  background-repeat: no-repeat;
}

/* @media (max-width: 48rem) {
  .wa-button {
    width: 100%;
  }
} */