.hero-bg {
  background: url('/assets/images/manifesto-img.svg');
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 100vh;
}
/* 🔥 REQUIRED FOR SMOOTH ANIMATION */
.vision-container-subtext,
.mission-container-subtext {
  overflow: hidden;
}

.hero-title {
  background: linear-gradient(248.98deg, #01E2FD 49.77%, #004A9C 86.73%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.vision-div {
  background: -webkit-linear-gradient(180deg, #01E2FD -140.76%, #0D0D0D 37.13%);
  background: linear-gradient(180deg, #01E2FD -140.76%, #0D0D0D 37.13%);
  /* background-attachment: fixed; */
}

.vision-container,
.mission-container {
  background: rgba(255, 255, 255, 0.09) !important;
}

.vision-container-subtext,
.mission-container-subtext {
  max-width: 942px !important;
}

#scrollContainer {
  height: 100vh;
  overflow-y: auto;
}

.mission-line span,
.mission-line-2 span {
  color: #3C3C3C;
  transition: color 0.3s ease;
}

.vision-container,
.mission-container {
  position: relative;
}

.mission-container {
  will-change: transform;
}

/* LEFT WORDS */
.reveal-text span {
  display: inline-block;
  opacity: 0;
  filter: blur(8px);
  transform: translateY(20px);
  margin-right: 8px;
}


/* ============================= */
/* 📱 MOBILE (≤575px) */
/* ============================= */
@media (max-width: 575px) {
  .hero-bg {
    background: url('/assets/images/manifesto-herobg-mobile.svg');
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100vh;
  }

  /* ================= HERO ================= */
  .hero-section .wrapper-1290 {
    flex-direction: column !important;
    padding: 0 30px;
  }

  .hero-section .w-p-55,
  .hero-section .w-p-45 {
    width: 100% !important;
  }

  .hero-title.fs-56 {
    font-size: 32px !important;
  }

  .hero-subtitle {
    font-size: 16px !important;
    line-height: 1.6 !important;
  }

  /* ================= VISION / MISSION ================= */
  .vision-container,
  .mission-container {
    padding: 20px 16px !important;
    margin: 20px 12px !important;
  }

  .mission-line,
  .mission-line-2 {
    font-size: 22px !important;
    line-height: 1.4 !important;
  }

  .vision-container-subtext,
  .mission-container-subtext {
    font-size: 14px !important;
    line-height: 1.6 !important;
  }

  /* ================= CORE VALUES ================= */
  .core-values-section>div {
    flex-direction: column !important;
    gap: 16px !important;
  }

  .core-values-section .w-p-100 {
    width: 100% !important;
  }

  .core-values-section .fs-32 {
    font-size: 24px !important;
    text-align: left;
  }

  /* spacing fix */
  .core-values-section>div {
    margin-bottom: 32px !important;
  }

  .vision-container .fs-32 {
    font-size: 24px !important;
  }

  .mission-line.fs-40 {
    font-size: 20px !important;
  }

  .vision-container.px-72 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .mission-line.mx-27 {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }


  .mission-container .fs-32 {
    font-size: 24px !important;
  }

  .mission-line-2.fs-40 {
    font-size: 20px !important;
  }

  .mission-container.px-72 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .mission-line-2.mx-27 {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }

  .hero-subtitle.fs-20 {
    font-size: 16px !important;
  }

  .hero-subtitle,
  .hero-title {
    text-align: center !important;
  }

  .mission-div .wrapper-1290.pt-72 {
    padding-top: 0px !important;
  }

}


/* ============================= */
/* 📱 TABLET (576px - 992px) */
/* ============================= */
@media (min-width: 576px) and (max-width: 992px) {
  .hero-bg {
    background: url('/assets/images/manifesto-herobg-mobile.svg');
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100vh;
  }

  /* HERO */
  .hero-section .wrapper-1290 {
    flex-direction: column !important;
    padding: 0 30px;
  }

  .hero-section .w-p-55,
  .hero-section .w-p-45 {
    width: 100% !important;
  }

  .hero-title.fs-56 {
    font-size: 40px !important;
  }

  .hero-subtitle {
    font-size: 18px !important;
  }

  /* VISION / MISSION */
  .vision-container,
  .mission-container {
    padding: 32px !important;
    margin: 24px !important;
  }

  .mission-line,
  .mission-line-2 {
    font-size: 28px !important;
  }

  /* CORE VALUES */
  .core-values-section>div {
    flex-direction: column !important;
    gap: 20px !important;
  }

  .core-values-section .fs-32 {
    font-size: 26px !important;
  }

  .vision-container .fs-32 {
    font-size: 24px !important;
  }

  .mission-line.fs-40 {
    font-size: 20px !important;
  }

  .vision-container.px-72 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .mission-line.mx-27 {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }


  .mission-container .fs-32 {
    font-size: 24px !important;
  }

  .mission-line-2.fs-40 {
    font-size: 20px !important;
  }

  .mission-container.px-72 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .mission-line-2.mx-27 {
    margin-left: 8px !important;
    margin-right: 8px !important;
  }

  .hero-subtitle.fs-20 {
    font-size: 16px !important;
  }

  .hero-subtitle,
  .hero-title {
    text-align: center !important;
  }

  .mission-div .wrapper-1290.pt-72 {
    padding-top: 0px !important;
  }

  .core-values-section.px-3 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}
.vision-container-subtext,
.mission-container-subtext {
  opacity: 0;
  transform: translateY(12px);  /* 👈 match JS start */
  filter: blur(8px);
}