/*--------------------------------------------------------------
  About Page (Skill Manthra) - custom addition
  Reuses theme variables (--sm-navy / --sm-gold); does not touch style.css
  Covers: Mission/Vision/Values cards + About page CTA strip
--------------------------------------------------------------*/

/* Page Header override - shorter banner than the template default
--------------------------------------------------------------*/
/* section.page-header .page-header__inner {
  padding: 210px 0 55px;
} */

section.page-header .page-header__inner h3 {
  font-size: 36px;
  margin-bottom: 24px;
}

@media (max-width: 767px) {
  section.page-header .page-header__inner {
    padding: 50px 0 44px;
  }

  section.page-header .page-header__inner h3 {
    font-size: 28px;
  }
}

/* Mission / Vision / Values
--------------------------------------------------------------*/
.sm-mv {
  position: relative;
  display: block;
  padding: 0 0 110px;
  overflow: hidden;
  z-index: 1;
}

.sm-mv-card {
  position: relative;
  display: block;
  height: 100%;
  background-color: var(--glorify-white);
  border-radius: 18px;
  padding: 42px 32px 36px;
  box-shadow: 0 15px 40px rgba(13, 46, 98, 0.08);
  border-top: 4px solid var(--sm-gold);
  transition: transform 400ms ease, box-shadow 400ms ease;
}

.sm-mv-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 25px 55px rgba(13, 46, 98, 0.14);
}

.sm-mv-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  margin-bottom: 24px;
  border-radius: 50%;
  background: rgba(var(--sm-gold-rgb), .12);
}

.sm-mv-card__icon span {
  font-size: 30px;
  color: var(--sm-navy);
}

.sm-mv-card__title {
  font-size: 21px;
  font-weight: 700;
  color: var(--sm-navy);
  margin: 0 0 12px;
}

.sm-mv-card__text {
  font-size: 15px;
  line-height: 25px;
  color: var(--glorify-gray);
  margin: 0;
}

/* About page CTA strip
--------------------------------------------------------------*/
.sm-about-cta {
  position: relative;
  display: block;
  padding: 60px 0;
  background: linear-gradient(135deg, var(--sm-navy), #163f86);
  overflow: hidden;
  z-index: 1;
}

.sm-about-cta__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  z-index: 1;
}

.sm-about-cta__text h3 {
  font-size: 26px;
  font-weight: 700;
  color: var(--glorify-white);
  margin: 0 0 6px;
}

.sm-about-cta__text p {
  font-size: 15px;
  color: rgba(var(--glorify-white-rgb), .75);
  margin: 0;
}

@media (max-width: 767px) {
  .sm-mv {
    padding: 0 0 60px;
  }

  .sm-about-cta__inner {
    justify-content: center;
    text-align: center;
  }
}