.about-hero {
  position:relative;
  display:flex;
  align-items:center;
  min-height:390px;
  overflow:hidden;
  background:#f8fcff
}

.about-hero-photo {
  position:absolute;
  inset:0 0 0 37%;
  background:url('../assets/images/about-hero.webp?v=20261019.6') center 48%/cover no-repeat
}

.about-hero-photo:before {
  content:"";
  position:absolute;
  inset:0;
  background: var(--hero-fade-partial)
}

.about-hero-inner {
  position:relative;
  z-index:1
}

.about-hero .section-label {
  color:#234587
}

.about-hero h1 {
  font-size:clamp(40px,4.8vw,66px);
  line-height:.98;
  letter-spacing:-.02em;
  margin:20px 0 15px;
  max-width:570px
}

.about-hero em,.about-overview em,.approach em {
  font-style:normal;
  color:#0aa0e8
}

.about-hero p {
  font-size:17px;
  line-height:1.45;
  margin-bottom:20px
}

.about-hero .button {
  min-width:166px
}

.about-overview {
  background:#fff
}

.who-grid {
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:58px
}

.who-copy {
  padding-right:30px
}

.who-copy h2,.journey h2 {
  font-size:clamp(34px,3.8vw,49px);
  line-height:1.08;
  letter-spacing:-.02em;
  margin-bottom:17px
}

.who-copy p,.who-stat p {
  font-size:17px;
  line-height:1.52;
  color:#375db0;
  margin-bottom:0
}

.who-stat {
  border-left:1px solid #cbdff0;
  padding:16px 0 0 60px
}

.stat-top {
  display:flex;
  align-items:center;
  gap:31px;
  margin-bottom:21px
}

.stat-icon,.journey-icon {
  display:grid;
  place-items:center;
  flex:none;
  border-radius:50%;
  background:#e8f7fd;
  color:#051a85
}

.stat-icon {
  width:84px;
  height:84px
}

.stat-icon svg,.stat-icon img {
  width:48px;
  height:48px
}

.stat-top div {
  display:flex;
  flex-direction:column;
  color:#3868b7;
  font-size:15px;
  line-height:1.15
}

.stat-top strong {
  font-size:48px;
  color:#0a9de8;
  font-weight:700;
  letter-spacing:-.05em
}

.journey {
  margin-top:100px
}

.journey h2 {
  margin-bottom:6px
}

.journey-intro {
  font-size:15px;
  color:#5e7fb9;
  margin-bottom:30px
}

.journey-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr)
}

.journey-item {
  display:grid;
  grid-template-columns:78px 1fr;
  gap:17px;
  padding:0 24px 0 0;
  min-height:190px
}

.journey-item+.journey-item {
  border-left:1px solid #c8dcf0;
  padding-left:30px
}

.journey-icon {
  width:76px;
  height:76px
}

.journey-icon svg,.journey-icon img {
  width:49px;
  height:49px
}

.journey-item h3 {
  font-size:23px;
  line-height:1.2;
  letter-spacing:-.02em;
  margin:18px 0 16px;
  color:#071874
}

.journey-item p {
  font-size:13px;
  line-height:1.45;
  color:#4d70ba;
  min-height:80px;
  margin-bottom:8px
}

.journey-arrow {
  width:29px;
  height:29px;
  color:#001884;
  transition:transform .2s
}

.journey-item:hover .journey-arrow {
  transform:translateX(5px)
}

.approach {
  position:relative;
  overflow:hidden;
  color:#09285f;
  background:#eef9ff
}

.approach-photo {
  position:absolute;
  inset:0 0 0 25%;
  background:url('../assets/images/about-approach.webp?v=20261019.6') center/cover no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#0003 20%,#0009 42%,#000 65%);
  mask-image:linear-gradient(90deg,transparent 0%,#0003 20%,#0009 42%,#000 65%)
}

.approach:before {
  display:none
}

.approach-inner {
  position:relative;
  z-index:2
}

.approach-copy {
  max-width:565px
}

.approach .section-label.light {
  color:#09285f
}

.approach h2 {
  font-size:clamp(37px,4.5vw,60px);
  line-height:1.02;
  letter-spacing:-.02em;
  margin-bottom:17px
}

.approach p {
  font-size:15px;
  line-height:1.5;
  max-width:485px;
  margin-bottom:21px
}

.approach .button {
  min-width:181px
}

.approach .button-outline {
  border-color:#09285f;
  color:#09285f
}

.approach .button-outline:hover {
  background:#09285f0e
}

#contact {
  scroll-margin-top:72px
}

@media(max-width:900px) {
  .about-hero {
    min-height:460px
  }

  .about-hero-photo {
    left:29%;
    background-position:50% center
  }

  .about-hero-photo:before {
    background: var(--hero-fade-tablet)
  }

  .about-hero h1 {
    font-size:clamp(39px,5vw,54px)
  }

  .who-grid {
    gap:28px
  }

  .who-copy {
    padding-right:0
  }

  .who-copy h2,.journey h2 {
    font-size:35px
  }

  .who-copy p,.who-stat p {
    font-size:14px
  }

  .who-stat {
    padding-left:29px
  }

  .stat-top {
    gap:17px
  }

  .stat-icon {
    width:67px;
    height:67px
  }

  .stat-icon svg,.stat-icon img {
    width:40px;
    height:40px
  }

  .stat-top strong {
    font-size:39px
  }

  .journey {
    margin-top:65px
  }

  .journey-item {
    grid-template-columns:61px 1fr;
    gap:10px;
    padding-right:14px
  }

  .journey-item+.journey-item {
    padding-left:16px
  }

  .journey-icon {
    width:57px;
    height:57px
  }

  .journey-icon svg,.journey-icon img {
    width:36px;
    height:36px
  }

  .journey-item h3 {
    font-size:19px;
    margin-top:13px
  }

  .journey-item p {
    font-size:11px;
    min-height:90px
  }

  .approach-photo {
    left:18%
  }

}

@media(max-width:650px) {
  .about-hero {
    padding-top:310px;
    min-height:0;
    align-items:end
  }

  .about-hero-photo {
    height:340px;
    inset:0 0 auto 0;
    background-position:56% center
  }

  .about-hero-photo:before {
    background: var(--hero-fade-bottom)
  }

  .about-hero h1 {
    font-size:clamp(35px,9vw,49px)
  }

  .about-hero p {
    font-size:14px
  }

  .who-grid {
    display:block
  }

  .who-copy h2,.journey h2 {
    font-size:clamp(29px,8vw,39px)
  }

  .who-copy p,.who-stat p {
    font-size:13px
  }

  .who-stat {
    border-left:0;
    border-top:1px solid #cbdff0;
    padding:28px 0 0;
    margin-top:30px
  }

  .stat-top {
    margin-bottom:15px
  }

  .journey {
    margin-top:55px
  }

  .journey-intro {
    font-size:13px;
    line-height:1.5
  }

  .journey-grid {
    grid-template-columns:1fr
  }

  .journey-item,.journey-item+.journey-item {
    grid-template-columns:64px 1fr;
    gap:15px;
    border-left:0;
    border-top:1px solid #c8dcf0;
    padding:18px 0;
    min-height:0
  }

  .journey-icon {
    width:61px;
    height:61px
  }

  .journey-icon svg,.journey-icon img {
    width:38px;
    height:38px
  }

  .journey-item h3 {
    font-size:19px;
    margin:3px 0 8px
  }

  .journey-item p {
    font-size:12px;
    min-height:0;
    margin-bottom:11px
  }

  .journey-arrow {
    width:25px;
    height:25px
  }

}

@media(max-width:650px) {
  .about-hero {
    min-height:clamp(700px,165vw,850px);
    padding-block:50px;
    align-items:flex-start;
    background:#eaf7ff
  }

  .about-hero-photo {
    inset:0;
    height:auto;
    background-image:url('../assets/images/about-hero-mobile.webp?v=20261019.6');
    background-position:center center;
    background-size:cover
  }

  .about-hero-photo:before {
    background: var(--hero-fade-mobile)
  }

}

@media(max-width:650px) {
  .approach {
    display:flex;
    flex-direction:column;
    min-height:0;
    padding:50px 0 0;
    color:#09285f;
    background:#eef9ff
  }

  .approach-inner {
    order:1
  }

  .approach-copy {
    padding-bottom:20px
  }

  .approach .section-label.light {
    color:#09285f
  }

  .approach .button-outline {
    border-color:#09285f;
    color:#09285f
  }

  .approach .button-outline:hover {
    background:#09285f0e
  }

  .approach-photo {
    position:relative;
    order:2;
    flex:none;
    inset:auto;
    width:100%;
    height:clamp(310px,90vw,420px);
    background-image:url('../assets/images/about-approach-mobile.webp?v=20261019.6');
    background-position:center bottom;
    background-size:cover;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,#0005 18%,#000b 34%,#000 50%);
    mask-image:linear-gradient(180deg,transparent 0%,#0005 18%,#000b 34%,#000 50%)
  }

  .approach:before {
    display:none
  }

  .approach-photo:after {
    display:none
  }

}
