body {
  font-family: var(--ff-poppins);
}

.dropdown-content {
  display: none;
}

.show {
  display: block;
}

/* <============ BACKGROUND DECORATIONS ==========> */
.background_decoration_one {
  background: var(--primary-green);
  border-radius: 36.8452px;
  transform: translate(15%, -35%) rotate(310.44deg);
  width: 89.52px;
  height: 155.67px;
  top: 0;
  right: 0;
}

.background_decoration_two {
  background: var(--primary-green);
  border-radius: 53.606px;
  transform: translate(-50%, -48%) rotate(-130deg);
  width: 114.79px;
  height: 190.18px;
}

.background_decoration_three {
  background: var(--primary-green);
  border-radius: 53.606px;
  transform: translate(35%, 35%) rotate(320deg);
  width: 279.04px;
  height: 155.87px;
}

.background_decoration_three.extra {
  transform: translate(35%, 35%) rotate(-46.53deg);
  width: 602.43px;
  height: 383.58px;
  border-radius: 100px;
}

.dot_background_decoration {
  right: 10px;
  top: 8px;
}

.dot_background_decoration img {
  width: 80px;
  height: auto;
}

.dot_background_decoration.hero {
  top: -10%;
  right: 10%;
}

/* <============ HERO ========== */
.hero_container {
  margin-top: calc(50px + 70px);
  padding: 0 15px;
}

.hero_small_heading {
  font-size: 1rem;
  color: #df6951;
  margin-bottom: 24px;
}

.hero_big_heading {
  font-size: 64px;
  color: var(--primary-blue);
  font-weight: 400;
  margin-bottom: 21px;
  line-height: 1;

  font-family: var(--ff-bebas-neue);
}

.hero_description {
  color: black;
  padding: 0 40px;
  font-size: 14px;

  font-family: var(--ff-garamond);
}

.hero_image_container {
  padding-top: 4rem !important;
}

/* ------ HERO IMAGE DECORATION ------ */

.hero_like_illustration {
  width: 60px;
  height: auto;

  top: -20%;
  right: 50%;
}

.hero_heart_illustration {
  width: 65px;
  height: auto;

  top: -0.8rem;
  right: 38%;
}

.hero_thumbsUp_illustration {
  width: 35px;
  height: auto;

  top: -26%;
  right: 43%;
}

.hero_violetEllipse_illustration {
  width: 58px;
  height: 58px;

  border-radius: 50%;
  background: radial-gradient(
      83.01% 83.01% at 80.21% 13.8%,
      #fff 0%,
      rgba(255, 255, 255, 0) 100%
    ),
    rgba(5, 32, 125, 0.43);

  bottom: 20%;
  left: 3%;
}

.hero_greenEllipse_illustration {
  width: 35px;
  height: 35px;

  border-radius: 50%;
  background: var(
    --green-dark,
    radial-gradient(
      83.01% 83.01% at 80.21% 13.8%,
      #fff 0%,
      rgba(255, 255, 255, 0) 100%
    ),
    #0b8292
  );

  bottom: 42%;
  left: 46%;
}

.hero_violetBar_illustration {
  width: 267px;
  height: 85px;
  transform: rotate(-17.004deg);

  border-radius: 21.52px;
  background: linear-gradient(
    180deg,
    rgba(5, 32, 125, 0.19) 0%,
    rgba(248, 247, 247, 0.19) 43.23%
  );
  /* background-color: red; */

  bottom: -50px;
  left: -100px;
}

/* <====== ABOUT US ======> */
.about_container {
  padding: 35px 0px 80px 0px;
}

.about_heading {
  color: var(--primary-blue);
  font-size: 18px;
  margin-bottom: 10px;

  font-family: var(--ff-garamond);
}

.about_subheading {
  font-size: 20px;
  margin-bottom: 40px;

  font-family: var(--ff-bebas-neue);
  color: var(--primary-brown);
  font-weight: 400;
}

.about_description {
  font-size: 1rem;
  color: #474747;
  padding: 0 15px;
  line-height: 1.5;

  font-family: var(--ff-garamond);
}

.about_icon_wrapper {
  gap: 5rem;
  padding-bottom: 200px;
}

.about_icon_image {
  padding: 0 1rem;
  margin-bottom: 22px;
}

.about_icon_text {
  font-size: 30px;
}

.about_popup_wrapper {
  scale: 0;
  opacity: 0;
  transition: scale 0ms ease-in-out, opacity 400ms ease-in-out;
}

.about_popup {
  padding: 30px 15px 30px 15px;
  max-width: 280px;
  transform: translate(0, -20%);
  background-color: white;
}

.about_popup_heading {
  color: #1e1d4c;
  font-size: 28px;
  margin-bottom: 30px;
  font-family: var(--ff-garamond);
}

.about_popup_description {
  color: #474747;
  font-size: 16px;
  font-family: var(--ff-garamond);
}

.about_icon_decoration {
  background-color: var(--primary-blue);
  border-radius: 30px 0px 10px;
  width: 105.46px;
  height: 118.48px;
  bottom: 7%;
  left: -12%;
}

.about_full_image {
  max-width: 1024px;
  height: auto;
}

/* <======== WHAT WE DO ========> */
#what-we-do {
  padding-top: 3rem;
}

.wwd_container {
  margin-top: 1rem;
  margin-bottom: 46px;
  gap: 70px;
  width: 100%;
}

.wwd_heading {
  letter-spacing: 1.14602px;
  font-size: 40px;
  font-family: var(--ff-bebas-neue);
  color: var(--primary-brown);
  margin-bottom: 1.1rem;
}

.wwd_description {
  font-size: 18px;
  font-family: var(--ff-garamond);
}

.wwd_description span {
  color: var(--primary-blue);
}

.wwd_blue_container {
  background-color: var(--primary-blue);
  max-width: 330px;
  padding: 0 20px 0px 20px;
  min-height: 345px;
}

.wwd_icon {
  background: var(--primary-green);
  padding: 25px;
  border-radius: 50%;
  font-size: 2rem;
  transform: translate(0, -50%);
}

.wwd_blue_heading {
  color: #fafaf9;
  font-size: 18px;
  font-family: var(--ff-sora);
  letter-spacing: 1.14602px;
  margin-bottom: 10px;
}

.wwd_blue_description {
  color: white;
  letter-spacing: 1.14602px;
  font-size: .875rem;
  line-height: 1.5;
  font-family: var(--ff-garamond);
  transform: translate(0, -00%);
}

.wwd_blue_description.one {
  transform: translate(0, -12%);
}

.wwd_blue_description.two {
  transform: translate(0, -12%); 
}

.wwd_blue_description.teacher_one {
  transform: translate(0, -0%);
}

.wwd_blue_description.teacher_two {
  transform: translate(0, -35%);
}

.wwd_blue_description.three {
  transform: translate(0, -20%);
}

.wwd_blue_description.teacher_three {
  transform: translate(0, 40%);
}

.wwd_blue_description.four {
  transform: translate(0, -60%);
}

.wwd_blue_description.teacher_four {
  transform: translate(0, 50%);
}

.wwd_blue_description.five {
  transform: translate(0, -15%);
}

.wwd_blue_description.teacher_five {
  transform: translate(0, -15%);
}

.wwd_blue_description.six {
  transform: translate(0, -20%);
}

.wwd_blue_description.teacher_six {
  transform: translate(0, 30%);
}

.swiper-wrapper {
  padding-bottom: 2.5rem;
}

/* <====== CLAD TEAM ======> */
.team_container {
  padding-bottom: 90px;
}
.team_heading {
  font-size: 18px;
  color: var(--primary-brown);
  font-family: var(--ff-garamond);
  margin-bottom: 14px;
}

.team_subheading {
  font-size: 20px;
  color: var(--primary-blue);
  font-family: var(--ff-bebas-neue);
  margin-bottom: 24px;
}

.team_card {
  max-width: 380px;
}

.team_card:hover {
  box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -27px;
}

.team_card_image {
  object-position: top;
}

.team_card_title {
  font-family: var(--ff-garamond);
  font-size: 1rem;
  letter-spacing: 0.03em;
  margin-bottom: 5px;
}

.team_card_occupation {
  letter-spacing: 0.05em;
  font-size: 15px;
  color: rgba(18, 18, 18, 0.60);
  margin-bottom: 5px;

  font-family: var(--ff-bebas-neue);
}

.team_card_button {
  position: relative;
  outline: none;
  border: none;
  background: var(--primary-blue);
  box-shadow: 0px 18.3987px 32.1978px rgba(241, 165, 1, 0.15);
  border-radius: 9.19937px;
  padding: 15px 0;
  overflow: hidden;
}

.team_card_button::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
}

.team_card_button:hover::before {
  animation: ripple 1s linear;
}

@keyframes ripple {
  to {
    transform: translate(-50%, -50%) scale(30);
    opacity: 0;
  }
}

.team_card_button.two {
  background-color: var(--primary-green);
}

.team_card_button.three {
  background-color: var(--primary-brown);
}

/* <====== STUDENTS THOUGHT ======> */
.students_container {
  padding-top: 40px;
  padding-bottom: 40px;
  padding-left: 20px;
  padding-right: 20px;
}

.students_heading {
  font-size: 32px;
  font-family: var(--ff-sora);
  margin-bottom: 45px;
}

.student_card_container {
  display: none;
}

.student_card_container.active {
  display: flex;
}

.students_single {
  background: linear-gradient(180deg, #041597 0%, rgba(182, 33, 158, 0.86) 100%),
    #eff6ff;
  border-radius: 12.153px;
  width: 100%;
  max-width: 350px;
  min-height: 170px;
  padding: 20px 24px;
}


.student_card_title {
  font-size: 16px;
  font-family: var(--ff-sora);
  letter-spacing: 0.607648px;
}

.student_card_description {
  font-size: 10px;
  font-family: var(--ff-Inter);
}

.student_card_bottom {
  bottom: 27px;
  left: 12px;
}

.student_card_icon {
  width: 25px;
  height: 25px;
  padding: 2px;
}

.student_link {
  background-color: #323443;
  color: #c9c9c9;
  font-family: var(--ff-Inter);

  width: fit-content;
}

@media (min-width: 992px) {
  .student_link {
    margin-left: 45px;
  }
}

@media (min-width: 1050px) {
  .student_link {
    margin-left: 45px;
  }
}

@media (min-width: 1200px) {
  .student_link {
    margin-left: 45px;
  }
}

/* <====== JOURNALS ======> */
.journals_wrapper {
  padding: 0;
}

.journals_container {
  padding-top: 35px;
  padding-bottom: 30px;
}

.journals_heading {
  font-size: 36px;
  margin-bottom: 56px;
}
.journals_header {
  background-color: #fb2780;
  padding: 10px;
  font-family: var(--ff-poppins);
}

.journals_header_text {
  font-size: 14px;
}

.nav-link.active {
  background-color: #fb2780 !important;
  
}

.journals_header_link {
  font-size: 8px;
  border-radius: 6px;
}

.journals_card_container {
  margin-top: 53px;
}

.journals_card {
  border: none;
  max-width: 300px;
  box-shadow: 0 0 24px 0 rgba(192, 192, 192, 0.6) !important;
  border-radius: 20px 0px 20px 20px;
}

.journals_card_image {
  border-radius: 20.8087px 0px;
}

.journals_card_title {
  font-size: 13px;
}

.journals_card_text {
  font-size: 11px;
  color: #718096;
}

.journals_card_button {
  border: 1px solid #fb2780;
  padding: 8px 12px;
  font-size: 10px;
  margin-top: 2rem;
}

.journals_card_button:hover {
  background-color: #fb2780;
  color: white;
}