/* ====== HERO ====== */
.about-hero{
  position:relative;
  min-height: 280px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-bottom: 1px solid rgba(12,37,67,.12);
}

.about-hero__bg{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(234,244,255,.15), rgba(234,244,255,.85));
  filter: saturate(1.05) contrast(1.02);
}

.about-hero__inner{
  position:relative;
  max-width: 1100px;
  width: 100%;
  padding: 64px 18px;
  text-align:center;
}

.about-hero__title{
  margin: 0;
  font-size: clamp(34px, 4.5vw, 64px);
  letter-spacing: .06em;
  font-weight: 900;
  color: #0b3b6a;
  text-shadow: 0 18px 48px rgba(12,37,67,.22);
}

.about-hero__subtitle{
  margin: 14px auto 0;
  max-width: 820px;
  color: rgba(11,59,106,.82);
  font-weight: 600;
  line-height: 1.6;
}

/* ====== CONTENT ====== */
.about{
  padding: 44px 0 60px;
    display: flex;
  justify-content: center;
  align-items: center;
}

.about__wrap{
  margin: 0 auto;
  padding: 0 18px;
  max-width: 1500px;
}

.about__text{
  background: var(--panel);
  border: 1px solid rgba(12,37,67,.10);
  padding: 22px;
  box-shadow: var(--shadow);
  border-radius: 20px;
}

.about__heading{
  margin: 0 0 10px;
  font-size: 22px;
  letter-spacing: .01em;
}

.about__text p{
  margin: 0 0 12px;
  line-height: 1.8;
  font-size: 15.5px;
  text-align: justify;
}