/* About Us redesign -- builds on home-redesign.css (header, footer, buttons,
   eyebrow, container, typography). All scoped under .iihm-about. The previous
   About page lives untouched at /about-iihm-backup/. */

.iihm-about p, .iihm-about li { text-wrap: pretty; }

/* ---- 1. Hero ------------------------------------------------------------- */
.iihm-about .ab-hero {
  position: relative; overflow: hidden; color: #fff; display: flex; align-items: center;
  background: linear-gradient(100deg, #0a3c82 0%, #0a3470 50%, #082a5d 100%);
  min-height: clamp(260px, 22vw, 340px);
}
.iihm-about .ab-hero__photo {
  position: absolute; top: 0; right: 0; bottom: 0; width: 56%;
  background-size: cover; background-position: 50% 45%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 45%);
}
.iihm-about .ab-hero__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,42,93,.15), rgba(8,42,93,.1)); }
.iihm-about .ab-hero__grid { position: relative; z-index: 2; padding-top: 44px; padding-bottom: 44px; }
.iihm-about .ab-hero__copy { max-width: 640px; }
.iihm-about .ab-hero h1 {
  font-family: var(--serif); font-weight: 700; color: #fff; line-height: 1.18;
  font-size: clamp(30px, 3.5vw, 50px); text-transform: none;
}
.iihm-about .ab-hero p:not(.hm-eyebrow) { margin-top: 18px; max-width: 520px; color: rgba(255,255,255,.92); font-size: clamp(14px, 1.05vw, 16px); line-height: 1.7; }
.iihm-about .ab-hero p.hm-eyebrow { margin: 0 0 14px; font-size: 11px; color: #fff; }

/* ---- 2. Story --------------------------------------------------------------- */
.iihm-about .ab-story { padding: clamp(40px, 4.5vw, 64px) 0; background: #fff; }
.iihm-about .ab-story__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(28px, 5vw, 80px); align-items: center; }
.iihm-about .ab-story__copy p:not(.hm-eyebrow) { margin-top: 20px; color: var(--navy-ink); font-size: 14.5px; line-height: 1.75; max-width: 480px; }
.iihm-about .ab-story__stats { display: flex; margin-top: 34px; }
.iihm-about .ab-story__stats li { padding: 0 clamp(14px, 1.8vw, 26px); border-left: 1px solid #cfd9e8; display: flex; flex-direction: column; gap: 6px; }
.iihm-about .ab-story__stats li:first-child { padding-left: 0; border-left: 0; }
.iihm-about .ab-story__stats strong { font-family: var(--serif); font-size: clamp(22px, 2.2vw, 30px); font-weight: 700; color: var(--navy); line-height: 1.1; }
.iihm-about .ab-story__stats span { font-size: 12.5px; color: var(--muted); line-height: 1.4; max-width: 110px; }
.iihm-about .ab-story__media { position: relative; padding: 0 0 4px 4px; }
.iihm-about .ab-story__media::before { /* red/blue accent frame (left + bottom) */
  content: ''; position: absolute; left: -14px; top: 18px; bottom: -4px; width: 4px; border-radius: 1px;
  background: linear-gradient(180deg, var(--red) 0 30%, var(--navy) 30% 100%);
}
.iihm-about .ab-story__media::after { content: ''; position: absolute; left: -14px; bottom: -4px; width: 62%; height: 4px; background: var(--navy); }
.iihm-about .ab-story__media img { width: 100%; height: auto; border-radius: 3px; box-shadow: 0 14px 36px rgba(10, 52, 112, .18); }

/* ---- 3. Why IIHM ------------------------------------------------------------ */
.iihm-about .ab-why { background: linear-gradient(180deg, #eef4fc, #e8f0fb); padding: clamp(40px, 4.5vw, 62px) 0; }
.iihm-about .ab-why__grid { display: grid; grid-template-columns: minmax(320px, 38%) 1fr; gap: clamp(20px, 2.4vw, 36px); align-items: center; }
.iihm-about .ab-why .hm-h2 { font-size: clamp(24px, 2.6vw, 36px); }
.iihm-about .ab-why__copy p:not(.hm-eyebrow) { margin: 18px 0 26px; max-width: 360px; color: var(--navy-ink); font-size: 14px; line-height: 1.7; }
.iihm-about .ab-why__items { display: grid; grid-template-columns: repeat(3, 1fr); }
.iihm-about .ab-why__items li { padding: 22px clamp(14px, 1.8vw, 26px); border-left: 1px solid #c9d6ea; color: var(--red); }
.iihm-about .ab-why__items li:nth-child(n+4) { border-top: 1px solid #d3deee; }
.iihm-about .ab-why__items h3 { margin: 14px 0 8px; font-size: 13.5px; font-weight: 700; color: var(--navy); line-height: 1.3; }
.iihm-about .ab-why__items p { font-size: 12.5px; line-height: 1.6; color: var(--muted); }

/* ---- 4. Values ---------------------------------------------------------------- */
.iihm-about .ab-values { background: #fff; padding: clamp(40px, 4.5vw, 62px) 0; }
.iihm-about .ab-values__grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.iihm-about .ab-values__copy p:not(.hm-eyebrow) { margin-top: 18px; max-width: 460px; color: var(--navy-ink); font-size: 14px; line-height: 1.7; }
.iihm-about .ab-values__list { display: grid; grid-template-columns: repeat(4, auto); justify-content: start; margin-top: 32px; }
.iihm-about .ab-values__list li { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 4px clamp(14px, 2.1vw, 30px); border-left: 1px solid #cfd9e8; color: var(--red); }
.iihm-about .ab-values__list li:first-child { border-left: 0; padding-left: 0; }
.iihm-about .ab-values__list strong { margin-top: 10px; font-size: 13px; font-weight: 700; color: var(--navy); }
.iihm-about .ab-values__list span { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.iihm-about .ab-values__media { display: grid; grid-template-columns: 1.55fr 1fr; min-height: 300px; border-radius: 3px; overflow: hidden; box-shadow: 0 14px 36px rgba(10, 52, 112, .15); }
.iihm-about .ab-values__photo { background-size: cover; background-position: 50% 30%; min-height: 260px; }
.iihm-about blockquote.ab-values__quote { background: linear-gradient(160deg, #0a3c82, #082a5d) !important; margin: 0; color: #fff; padding: clamp(22px, 2.6vw, 36px); display: flex; flex-direction: column; justify-content: center; }
.iihm-about .ab-values__quote p { font-style: italic; font-size: clamp(15px, 1.35vw, 19px); line-height: 1.55; margin-top: 12px; color: #fff; }
.iihm-about .ab-values__quote footer { margin-top: 22px; font-size: 13px; color: rgba(255,255,255,.88); background: none; padding: 0; }
.iihm-about .ab-values__q { color: #fff; width: 22px; height: 18px; }

/* ---- 5. Leadership ------------------------------------------------------------ */
.iihm-about .ab-lead { position: relative; overflow: hidden; background: linear-gradient(180deg, #eef4fc, #e8f0fb); padding: clamp(30px, 3.4vw, 46px) 0; }
.iihm-about .ab-lead__mark { position: absolute; right: clamp(20px, 5vw, 90px); top: 50%; transform: translateY(-50%); width: clamp(110px, 12vw, 170px); height: auto; opacity: .16; pointer-events: none; }
.iihm-about .ab-lead__grid { display: grid; grid-template-columns: minmax(220px, 27%) 1fr; gap: clamp(22px, 3vw, 40px); align-items: center; position: relative; z-index: 1; }
.iihm-about .ab-lead__photo img { width: 100%; height: auto; border-radius: 3px; box-shadow: 0 12px 30px rgba(10, 52, 112, .22); aspect-ratio: 800 / 563; object-fit: cover; }
.iihm-about .ab-lead__copy p:not(.hm-eyebrow):not(.ab-lead__name) { margin-top: 12px; max-width: 520px; color: var(--navy-ink); font-size: 14px; line-height: 1.7; }
.iihm-about .ab-lead__name { margin: 18px 0 18px; display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: var(--navy-ink); }
.iihm-about .ab-lead__name strong { font-size: 13.5px; font-weight: 700; color: var(--navy); }
.iihm-about .ab-lead .hm-btn { height: 40px; min-width: 130px; font-size: 12.5px; }
.iihm-about .ab-lead .hm-h2 { font-size: clamp(24px, 2.6vw, 34px); }

/* ---- Responsive ----------------------------------------------------------------- */
@media (max-width: 920px) {
  .iihm-about .ab-story__grid, .iihm-about .ab-values__grid { grid-template-columns: 1fr; }
  .iihm-about .ab-why__grid { grid-template-columns: 1fr; }
  .iihm-about .ab-story__media { margin-left: 14px; }
  .iihm-about .ab-hero__photo { width: 70%; }
  .iihm-about .ab-why__items li:first-child, .iihm-about .ab-why__items li:nth-child(4) { border-left: 0; padding-left: 0; }
}
@media (max-width: 767px) {
  .iihm-about .ab-hero { min-height: 0; flex-direction: column; align-items: stretch; }
  .iihm-about .ab-hero__photo { position: relative; width: 100%; height: 200px; order: 2; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 30%); mask-image: linear-gradient(180deg, transparent 0, #000 30%); }
  .iihm-about .ab-hero__grid { padding-bottom: 12px; }
  .iihm-about .ab-story__stats { flex-wrap: wrap; row-gap: 20px; }
  .iihm-about .ab-story__stats li { flex: 1 1 45%; }
  .iihm-about .ab-story__stats li:nth-child(odd) { border-left: 0; padding-left: 0; }
  .iihm-about .ab-why__items { grid-template-columns: 1fr 1fr; }
  .iihm-about .ab-why__items li:nth-child(odd) { border-left: 0; padding-left: 0; }
  .iihm-about .ab-why__items li:nth-child(n+3) { border-top: 1px solid #d3deee; }
  .iihm-about .ab-values__list { grid-template-columns: 1fr 1fr; row-gap: 20px; justify-content: stretch; }
  .iihm-about .ab-values__list li:nth-child(odd) { border-left: 0; padding-left: 0; }
  .iihm-about .ab-values__media { grid-template-columns: 1fr; }
  .iihm-about .ab-lead__grid { grid-template-columns: 1fr; }
  .iihm-about .ab-lead__photo { max-width: 360px; }
}
@media (max-width: 480px) { .iihm-about .ab-why__items { grid-template-columns: 1fr; } .iihm-about .ab-why__items li { border-left: 0 !important; padding-left: 0; } .iihm-about .ab-why__items li + li { border-top: 1px solid #d3deee; } }
@media (max-width: 1100px) { .iihm-about .ab-lead__mark { display: none; } }