.zq-about-page {
  --about-section-space: clamp(4rem, 5.5vw, 5.75rem);
  --about-panel: #eef5fa;
  --about-dark: #06284b;
  overflow-x: clip;
}

.zq-about-page main { background: #fff; }
.zq-about-page .about-hero { background: #eef4f8; overflow: hidden; padding: clamp(3.25rem, 6vw, 6.5rem) 0; }
.zq-about-page .about-hero-grid { align-items: center; display: grid; gap: clamp(2.5rem, 6vw, 7rem); grid-template-columns: minmax(19rem, .78fr) minmax(0, 1.22fr); }
.zq-about-page .about-hero-copy { position: relative; z-index: 1; }
.zq-about-page .about-hero h1 { font-size: clamp(3.2rem, 4.6vw, 4.75rem); margin: .45rem 0 .85rem; max-width: none; }
.zq-about-page .about-hero-lead { color: var(--zq-ink); font-size: clamp(1.05rem, 1.45vw, 1.35rem); font-weight: 800; margin: 0 0 1.15rem; }
.zq-about-page .about-hero-summary { color: var(--zq-muted); max-width: 37rem; }
.zq-about-page .about-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 1.8rem; }
.zq-about-page .about-hero-media { min-height: clamp(22rem, 37vw, 34rem); position: relative; }
.zq-about-page .about-hero-media img { display: block; height: 100%; inset: 0; object-fit: cover; object-position: 46% center; position: absolute; width: 100%; }

.zq-about-page .about-section { padding: var(--about-section-space) 0; }
.zq-about-page .about-section-soft { background: var(--about-panel); }
.zq-about-page .about-section-heading { margin-bottom: clamp(2rem, 4vw, 3.5rem); max-width: 54rem; }
.zq-about-page .about-section-heading h2,
.zq-about-page .about-intro-copy h2 { font-size: clamp(2.1rem, 4vw, 3.8rem); margin: .4rem 0 1rem; }
.zq-about-page .about-section-heading p,
.zq-about-page .about-intro-copy p { color: var(--zq-muted); margin-bottom: 0; }
.zq-about-page .about-intro-grid { align-items: center; display: grid; gap: clamp(2.5rem, 6vw, 6rem); grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); }
.zq-about-page .about-support-grid { background: #f5f8fb; border: 1px solid var(--zq-line); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.zq-about-page .about-support-item { min-height: 9.5rem; padding: clamp(1.4rem, 3vw, 2.25rem); }
.zq-about-page .about-support-item:nth-child(odd) { border-right: 1px solid var(--zq-line); }
.zq-about-page .about-support-item:nth-child(-n+2) { border-bottom: 1px solid var(--zq-line); }
.zq-about-page .about-support-item span,
.zq-about-page .about-capability-card > span { color: var(--zq-cyan-dark); display: block; font-size: .78rem; font-weight: 900; letter-spacing: .12em; margin-bottom: 1rem; }
.zq-about-page .about-support-item strong { display: block; line-height: 1.45; }

.zq-about-page .about-capability-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.zq-about-page .about-capability-card { border-left: 1px solid var(--zq-line); min-height: 12.5rem; padding: clamp(1.6rem, 3vw, 2.6rem); }
.zq-about-page .about-capability-card:last-child { border-right: 1px solid var(--zq-line); }
.zq-about-page .about-capability-card h3 { font-size: 1.12rem; margin: 0 0 .75rem; }
.zq-about-page .about-capability-card p { color: var(--zq-muted); margin: 0; }

.zq-about-page .about-brand-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.zq-about-page .about-brand-card { background: #fff; border: 1px solid var(--zq-line); min-height: 12rem; padding: clamp(2rem, 4vw, 3rem); text-decoration: none; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.zq-about-page .about-brand-card:hover { border-color: #91cde0; box-shadow: var(--zq-shadow); transform: translateY(-4px); }
.zq-about-page .about-brand-name { display: block; font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 900; letter-spacing: -.04em; margin-bottom: 1.35rem; }
.zq-about-page .about-brand-card.schneider .about-brand-name { color: #159447; }
.zq-about-page .about-brand-card.abb .about-brand-name { color: #e31f26; }
.zq-about-page .about-brand-card.siemens .about-brand-name { color: #008c95; }
.zq-about-page .about-brand-card p { color: var(--zq-muted); margin: 0 0 1rem; }
.zq-about-page .about-brand-card small { color: var(--zq-blue); font-weight: 800; }

.zq-about-page .about-process-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
.zq-about-page .about-process-list li { min-width: 0; padding: 0 clamp(1rem, 2vw, 2rem); position: relative; text-align: center; }
.zq-about-page .about-process-list li:not(:last-child)::after { background: #9dd7e6; content: ""; height: 1px; inset-inline-end: -12%; position: absolute; top: 1.8rem; width: 24%; }
.zq-about-page .about-process-number { align-items: center; background: #fff; border: 2px solid #a8dce9; border-radius: 50%; color: var(--zq-blue); display: inline-flex; font-size: .85rem; font-weight: 900; height: 3.6rem; justify-content: center; width: 3.6rem; }
.zq-about-page .about-process-list h3 { font-size: 1rem; margin: 1rem 0 .5rem; }
.zq-about-page .about-process-list p { color: var(--zq-muted); font-size: .85rem; margin: 0; }

.zq-about-page #contact { scroll-margin-top: 5.75rem; }
.zq-about-page .about-contact-section { background: #eef4f8; padding: 0; }
.zq-about-page .about-contact-shell { align-items: stretch; display: grid; grid-template-columns: minmax(22rem, .78fr) minmax(0, 1.22fr); width: 100%; }
.zq-about-page .about-contact-panel { background: var(--about-dark); clip-path: polygon(0 0, 100% 0, calc(100% - 4rem) 100%, 0 100%); color: #fff; padding: clamp(3.25rem, 5vw, 5rem) clamp(3rem, 6vw, 7rem); padding-inline-end: clamp(5rem, 7vw, 7.5rem); }
.zq-about-page .about-contact-panel .zq-kicker { color: #74d5eb; }
.zq-about-page .about-contact-panel h2 { color: #fff; font-size: clamp(2rem, 2.7vw, 2.6rem); margin: .4rem 0 1rem; }
.zq-about-page .about-contact-panel h3 { color: #fff; }
.zq-about-page .about-contact-panel p { color: #c8d9e8; max-width: 28rem; }
.zq-about-page .about-contact-links { margin: 2rem 0; }
.zq-about-page .about-contact-links a { color: #fff; display: block; font-weight: 800; margin: .8rem 0; text-decoration: none; }
.zq-about-page .about-contact-panel .zq-social-row { margin-top: 1rem; }
.zq-about-page .about-contact-form-wrap { align-items: center; display: flex; padding: clamp(2.25rem, 3.4vw, 3.5rem) max(var(--zq-shell-gutter), 3rem) clamp(2.25rem, 3.4vw, 3.5rem) clamp(2rem, 4vw, 4rem); }
.zq-about-page .about-contact-form { border: 0; box-shadow: none; column-gap: 1rem; padding: 0; row-gap: .8rem; width: 100%; }
.zq-about-page .about-contact-form .field { gap: .3rem; }
.zq-about-page .about-contact-form label,
.zq-about-page .about-contact-form .security-field > span { font-size: .76rem; }
.zq-about-page .about-contact-form input,
.zq-about-page .about-contact-form select { min-height: 2.7rem; padding: .65rem .75rem; }
.zq-about-page .about-contact-form textarea { min-height: 6.25rem; padding: .7rem .75rem; }
.zq-about-page .about-contact-form .about-country-field,
.zq-about-page .about-contact-form .about-security-field { grid-column: span 1; }
.zq-about-page .about-contact-form .about-security-field { overflow: visible; }
.zq-about-page .about-contact-form .about-security-field [data-contact-placeholder] { min-height: 4.1rem; }
.zq-about-page .about-contact-form .about-security-field [data-security-status] { color: #6a7e90; font-size: .75rem; line-height: 1.35; margin: .2rem 0 0; min-height: 1rem; }
.zq-about-page .about-contact-form .form-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: space-between; }
.zq-about-page .about-contact-form .form-actions .zq-button { margin: 0; }
.zq-about-page .about-form-link { color: var(--zq-blue); font-weight: 800; text-decoration: none; }
.zq-about-page .about-contact-form .consent-field input { flex: 0 0 1.25rem; height: 1.25rem; min-height: 1.25rem; width: 1.25rem; }
.zq-about-page .about-contact-form .consent-field span { min-width: 0; }
.zq-about-page .about-contact-form [data-form-status] { align-self: stretch; flex: 0 0 auto; margin: 0; max-width: 100%; overflow-wrap: anywhere; width: 100%; }
.zq-about-page .zq-footer { margin-top: 0; }
.zq-about-page .zq-footer p { color: #c8d9e8; }

@media (min-width: 1121px) {
  html[lang="zh-CN"] .zq-about-page .about-contact-panel h2 { white-space: nowrap; }
  .zq-about-page .about-hero { padding: 0; }
  .zq-about-page .about-hero-grid.container {
    gap: 0;
    grid-template-columns: minmax(24rem, .42fr) minmax(0, .58fr);
    max-width: none;
    min-height: clamp(38rem, 47vw, 48rem);
    padding-inline: max(32px, calc((100vw - 1240px) / 2)) 0;
    width: 100%;
  }
  .zq-about-page .about-hero-copy { align-self: center; grid-column: 1; grid-row: 1; padding-block: 5rem; padding-inline-end: 2rem; }
  .zq-about-page .about-hero h1 { white-space: nowrap; }
  .zq-about-page .about-hero-media { grid-column: 1 / -1; grid-row: 1; margin-inline-start: 28%; min-height: 100%; z-index: 0; }
  .zq-about-page .about-hero-media::after { background: linear-gradient(90deg, #eef4f8 0%, rgb(238 244 248 / 93%) 17%, rgb(238 244 248 / 20%) 42%, transparent 58%); content: ""; inset: 0; pointer-events: none; position: absolute; }
  .zq-about-page .about-hero-media img { object-position: 47% center; }
}

@media (max-width: 1120px) {
  .zq-about-page .about-capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zq-about-page .about-capability-card:nth-child(-n+2) { border-bottom: 1px solid var(--zq-line); }
  .zq-about-page .about-process-list { gap: 2rem 0; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .zq-about-page .about-process-list li::after { display: none; }
}

@media (max-width: 1120px) {
  .zq-about-page .about-hero-grid,
  .zq-about-page .about-intro-grid,
  .zq-about-page .about-contact-shell { grid-template-columns: 1fr; }
  .zq-about-page .about-hero h1 { max-width: 12ch; }
  .zq-about-page .about-hero-media { min-height: clamp(20rem, 66vw, 31rem); }
  .zq-about-page .about-brand-grid { grid-template-columns: 1fr; }
  .zq-about-page .about-brand-card { min-height: 0; }
  .zq-about-page .about-contact-panel { clip-path: none; padding-inline: var(--zq-shell-gutter); }
  .zq-about-page .about-contact-form-wrap { padding-inline: var(--zq-shell-gutter); }
}

@media (max-width: 900px) {
  .zq-about-page .about-process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zq-about-page .about-section-heading { max-width: none; }
}

@media (max-width: 620px) {
  .zq-about-page { --about-section-space: 4rem; }
  .zq-about-page .about-hero { padding-top: 2.75rem; }
  .zq-about-page .about-hero h1 { font-size: clamp(2.65rem, 14vw, 3.6rem); }
  .zq-about-page .about-support-grid,
  .zq-about-page .about-capability-grid,
  .zq-about-page .about-process-list { grid-template-columns: 1fr; }
  .zq-about-page .about-support-item,
  .zq-about-page .about-support-item:nth-child(odd),
  .zq-about-page .about-support-item:nth-child(-n+2) { border: 0; border-bottom: 1px solid var(--zq-line); }
  .zq-about-page .about-support-item:last-child { border-bottom: 0; }
  .zq-about-page .about-capability-card,
  .zq-about-page .about-capability-card:last-child { border: 1px solid var(--zq-line); border-bottom: 0; min-height: 0; }
  .zq-about-page .about-capability-card:last-child { border-bottom: 1px solid var(--zq-line); }
  .zq-about-page .about-process-list li { padding: 0; text-align: start; }
  .zq-about-page .about-process-number { height: 3rem; width: 3rem; }
  .zq-about-page .about-contact-panel,
  .zq-about-page .about-contact-form-wrap { padding: 3.25rem 1rem; }
  .zq-about-page .about-contact-form .form-actions { align-items: stretch; flex-direction: column; }
  .zq-about-page .about-contact-form .form-actions .zq-button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .zq-about-page .about-brand-card,
  .zq-social-row a { transition: none; }
}