/* V153 — About hero matches the approved split design and aligns left copy with the header content width */
body .on[data-p="about"] > section.about-hero,
body .on[data-p="about"] > section.about-hero > .w.about-hero-shell {
  margin:0!important;
  padding:0!important;
  width:100%!important;
  max-width:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:#fff!important;
}
body .on[data-p="about"] > section.about-hero {
  overflow:hidden!important;
}
body .on[data-p="about"] > section.about-hero > .w.about-hero-shell {
  display:grid!important;
  grid-template-columns:minmax(0,50%) minmax(0,50%)!important;
  align-items:stretch!important;
  min-height:clamp(620px,45vw,760px)!important;
}
body .on[data-p="about"] .about-hero-copy {
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  background:#fff!important;
  padding-top:clamp(64px,5.2vw,96px)!important;
  padding-bottom:clamp(56px,5vw,88px)!important;
  padding-left:max(24px, calc((100vw - var(--helprite-content-width,1120px))/2 + clamp(1rem,4vw,2rem)))!important;
  padding-right:clamp(34px,4vw,72px)!important;
}
body .on[data-p="about"] .about-hero-kicker {
  display:flex!important;
  align-items:center!important;
  gap:clamp(14px,1.4vw,22px)!important;
  margin:0 0 clamp(26px,2.6vw,38px)!important;
  color:#2568ea!important;
  font-family:var(--helprite-font-body,inherit)!important;
  font-size:clamp(.82rem,.92vw,.98rem)!important;
  font-weight:700!important;
  letter-spacing:.06em!important;
  line-height:1.2!important;
}
body .on[data-p="about"] .about-hero-kicker::after {
  content:"";
  display:block;
  width:clamp(92px,6vw,126px);
  height:3px;
  border-radius:999px;
  background:#2c67de;
}
body .on[data-p="about"] .about-hero h1 {
  max-width:8.8ch!important;
  margin:0 0 clamp(28px,2.7vw,40px)!important;
  color:#102b62!important;
  font-family:var(--helprite-font-heading,inherit)!important;
  font-size:clamp(3rem,5.15vw,5.05rem)!important;
  font-weight:700!important;
  line-height:.98!important;
  letter-spacing:-.055em!important;
}
body .on[data-p="about"] .about-hero-underline {
  position:relative;
  display:inline-block;
}
body .on[data-p="about"] .about-hero-underline::after {
  content:"";
  position:absolute;
  left:4%;
  right:7%;
  bottom:-.13em;
  height:.18em;
  border-bottom:4px solid #2c73ec;
  border-radius:999px;
  transform:rotate(-2.6deg);
}
body .on[data-p="about"] .about-hero-copy p:not(.lab) {
  max-width:34ch!important;
  margin:0 0 1.15rem!important;
  color:#223a69!important;
  font-family:var(--helprite-font-body,inherit)!important;
  font-size:clamp(1.02rem,1.34vw,1.16rem)!important;
  line-height:1.46!important;
}
body .on[data-p="about"] .about-hero-copy p:last-child {margin-bottom:0!important;}
body .on[data-p="about"] .about-hero-media {
  position:relative!important;
  min-width:0!important;
  min-height:100%!important;
  overflow:hidden!important;
  background:#d8e5f7!important;
}
body .on[data-p="about"] .about-hero-media::before,
body .on[data-p="about"] .about-hero-media::after {
  content:none!important;
  display:none!important;
}
body .on[data-p="about"] .about-hero-image {
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  background:url('../img/about-hero-building.jpg') center center / cover no-repeat!important;
  border-radius:0!important;
}
@media (max-width: 1080px){
  body .on[data-p="about"] > section.about-hero > .w.about-hero-shell {
    grid-template-columns:minmax(0,52%) minmax(0,48%)!important;
    min-height:clamp(560px,50vw,700px)!important;
  }
  body .on[data-p="about"] .about-hero h1 {font-size:clamp(2.7rem,4.75vw,4.3rem)!important;max-width:9.6ch!important;}
}
@media (max-width: 900px){
  body .on[data-p="about"] > section.about-hero > .w.about-hero-shell {
    grid-template-columns:1fr!important;
    min-height:0!important;
  }
  body .on[data-p="about"] .about-hero-copy {
    padding:48px clamp(20px,5vw,30px) 42px!important;
  }
  body .on[data-p="about"] .about-hero h1 {
    max-width:12ch!important;
    font-size:clamp(2.6rem,8.5vw,4rem)!important;
  }
  body .on[data-p="about"] .about-hero-copy p:not(.lab) {
    max-width:none!important;
  }
  body .on[data-p="about"] .about-hero-media {
    min-height:clamp(300px,62vw,460px)!important;
  }
}