/* ===================================================================
   page-about.css — About page
   =================================================================== */
.about-page { background: #fff; }
.about-hero {
  position: relative; min-height: 84.6743vh; color: #fff;
  background: url('/img/about_banner.jpg') center top/cover no-repeat;
}
.about-hero-inner { min-height: 77.2669vh; display: flex; align-items: flex-start; justify-content: space-between; gap: 4.1667vw; }
.about-hero-copy { max-width: 27.5vw; padding-top: 0; flex: 0 0 32.2917vw; position: relative; z-index: 2; }
.about-hero-desc { max-width: 37.5vw; position: relative; padding-top: 1.8391vh; }
.about-hero-desc::before { content: ""; position: absolute; left: 0; top: 0; width: 3.125vw; height: 0.3065vh; background: #d7af36; }

.about-profile { position: relative; min-height: 88.8889vh; padding: 9.0741vh 0 8.75vw; background: #fff; overflow: hidden; }
.about-profile-bg { position: absolute; left: 0; bottom: 0; width: 100%; height: auto; z-index: 0; pointer-events: none; user-select: none; }
.about-profile-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 31.25vw) minmax(21.875vw, 1fr); gap: 5vw; align-items: start; }
.about-eyebrow,
.section-title-eyebrow { margin: 0; color: var(--red); font-size: var(--fs-20); font-weight: 400; letter-spacing: 0; text-transform: uppercase; }
.about-profile-copy h2,
.section-title-main { margin: 0.9259vh 0 0; color: #000; font-size: var(--fs-55); line-height: 1.2; font-weight: 900; }
.section-title-block.is-centered { text-align: center; }
.about-profile-copy h2 span { color: var(--red); }
.about-profile-copy h3 { margin: 6.8519vh 0 1.6667vw; color: #101924; font-size: var(--fs-36); line-height: 1.35; font-weight: 400; }
.about-profile-panel { display: none; }
.about-profile-panel.is-active { display: block; }
.about-profile-copy p:not(.about-eyebrow) { margin: 0 0 2.4074vh; color: #283546; font-size: var(--fs-20); line-height: 2.4521vh; }
.about-value-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 12.3828125vw)); grid-auto-rows: 24.6743vh; gap: 1.4583vw; justify-content: center; padding-top: 5vh; }
.about-value-card { padding: 2.7778vh 1.7708vw; border-radius: 1.0417vw; background: #fff; box-shadow: 0 1.25vw 3.4375vw rgba(33, 45, 61, .1); cursor: pointer; transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease; }
.about-value-card:nth-child(2),
.about-value-card:nth-child(4) { transform: translateY(7.7778vh); }
.about-value-card:hover,
.about-value-card:focus,
.about-value-card.is-active { background: var(--red); color: #fff; outline: 0; box-shadow: 0 1.4583vw 3.8542vw rgba(221, 38, 47, .24); }
.about-value-icon { display: block; margin-bottom: 2.2222vh; color: #d8b138; font-size: 2.0833vw; line-height: 1; }
.about-value-icon .iconfont { font-size: inherit; }
.about-value-card:hover .about-value-icon,
.about-value-card:focus .about-value-icon,
.about-value-card.is-active .about-value-icon { color: #fff; }
.about-value-card h3 { margin: 0 0 1.6667vh; font-size: 1.0417vw; line-height: 1.3; }
.about-value-card p { margin: 0; color: #667384; font-size: 0.7292vw; line-height: 1.8; }
.about-value-card:hover p,
.about-value-card:focus p,
.about-value-card.is-active p { color: rgba(255, 255, 255, .86); }
.about-honors { min-height: 88.4291vh; padding: 8.7037vh 0 5.7292vw; background: #f7fbff url('/img/zzry_bg.png') center bottom/cover no-repeat; }
.about-section-title.centered { text-align: center; }
.about-cert-row { display: flex; flex-wrap: nowrap; gap: 1.875vw; width: calc(14.2578125vw * 4 + 1.875vw * 3); max-width: 100%; margin: 7.2222vh auto 2.8125vw; overflow: hidden; padding-bottom: 0.7407vh; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.about-cert-row figure { margin: 0; padding: 0; background: #fff; border-radius: 0.2083vw; overflow: hidden; width: 14.2578125vw; height: 41.3027vh; flex: 0 0 14.2578125vw; box-shadow: 0 0 0 0.0521vw rgba(255, 255, 255, .92), 0 0 0.9375vw rgba(255, 255, 255, .75), 0 0.9375vw 2.1875vw rgba(29, 45, 66, .12); }
.about-cert-row img { width: 100%; height: 100%; object-fit: cover; }
.about-honor-controls { display: flex; justify-content: center; gap: 0.8333vw; }
.about-honor-controls button { width: 2.421875vw; height: 4.7510vh; display: grid; place-items: center; padding: 0; border-radius: 50%; border: 0.0521vw solid #a1a1a3; background: transparent; line-height: 1; overflow: hidden; cursor: pointer; }
.about-honor-controls button img { width: 34%; height: 34%; max-width: none; max-height: none; display: block; object-fit: contain; }
.about-honor-controls button:first-child img { transform: scaleX(-1); }
.about-honor-controls .is-active { border-color: #0d2d54; background: #0d2d54; }
.about-honor-controls button:disabled { cursor: default; }
.about-supporters { position: relative; min-height: 83.6782vh; padding: 8.8889vh 0 7.2917vw; overflow: hidden; background: #fff url('/img/hzdw_bg.png') 7.8125vw top no-repeat; }
.about-logo-grid { display: flex; flex-wrap: nowrap; gap: 1.37695vw; width: max-content; }
.about-logo-row-1,
.about-logo-row-2,
.about-logo-row-3 { align-self: center; }
.about-logo-stage { position: relative; margin-top: 21.0185vh; left: 50%; width: 82.03125vw; padding: 0.7663vh 1.171875vw 2.2989vh; overflow: hidden; transform: translateX(-50%); box-sizing: content-box; display: flex; flex-direction: column; align-items: center; gap: 1.37695vw; }
.about-logo-stage::before,
.about-logo-stage::after { content: ""; position: absolute; top: calc(0.7663vh + 8.6590vh + 1.37695vw); bottom: auto; width: 5.7292vw; height: 8.6590vh; pointer-events: none; z-index: 2; }
.about-logo-stage::before { left: 0; background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .84) 40%, rgba(255, 255, 255, 0) 100%); }
.about-logo-stage::after { right: 0; background: linear-gradient(270deg, #fff 0%, rgba(255, 255, 255, .84) 40%, rgba(255, 255, 255, 0) 100%); }
.about-logo-grid a { width: 7.890625vw; height: 8.6590vh; flex: 0 0 7.890625vw; box-sizing: border-box; display: flex; place-items: center; align-items: center; justify-content: center; padding: 0.9259vh 0.7292vw; border-radius: 0.4167vw; background: #fff; color: #175081; font-size: 0.7813vw; font-weight: 900; text-align: center; box-shadow: 0 0.625vw 1.7708vw rgba(31, 48, 70, .08); }
.about-logo-grid img { display: block; width: 100%; height: 100%; object-fit: contain; }
