/* China-based manufacturing support for North American engineering teams. */
.hhx-cnc-page .hhx-na-support { position: relative; overflow: hidden; padding: clamp(88px, 10vw, 148px) 0; background: linear-gradient(150deg, #fff 0%, #f5f8fc 100%); }
.hhx-cnc-page .hhx-na-support__map { position: absolute; inset: 5% -6% auto auto; width: min(72vw, 1030px); height: min(39vw, 560px); opacity: .065; background: url('../images/world-map-watermark.svg') center/contain no-repeat; pointer-events: none; }
.hhx-cnc-page .hhx-na-support__frame { position: relative; z-index: 1; display: grid; width: min(calc(100% - 96px), 1380px); margin: auto; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(42px, 6vw, 94px); align-items: center; }
.hhx-cnc-page .hhx-na-support__eyebrow { margin: 0 0 14px; color: #2563eb; font: 700 12px/1.2 var(--hhx-heading); letter-spacing: .1em; text-transform: uppercase; }
.hhx-cnc-page .hhx-na-support h2 { max-width: 760px; margin: 0; color: #102a50; font: 700 clamp(52px, 4.7vw, 70px)/1.04 var(--hhx-heading); letter-spacing: -.05em; }
.hhx-cnc-page .hhx-na-support__description { max-width: 650px; margin: 28px 0 42px; color: #536477; font: 400 18px/1.55 var(--hhx-font); }
.hhx-cnc-page .hhx-na-support__advantages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 790px; }
.hhx-cnc-page .hhx-na-support__advantages article { min-width: 0; padding: 0 18px 0 0; border-right: 1px solid #d6e0ec; }
.hhx-cnc-page .hhx-na-support__advantages article:last-child { border-right: 0; padding-right: 0; }
.hhx-cnc-page .hhx-na-support__advantages span { display: block; margin-bottom: 20px; color: #2563eb; font: 700 12px/1 var(--hhx-heading); letter-spacing: .1em; }
.hhx-cnc-page .hhx-na-support__advantages h3 { margin: 0 0 10px; color: #102a50; font: 700 19px/1.18 var(--hhx-heading); letter-spacing: -.02em; }
.hhx-cnc-page .hhx-na-support__advantages p { margin: 0; color: #667689; font: 400 14px/1.55 var(--hhx-font); }
.hhx-cnc-page .hhx-na-support__media { min-width: 0; }
.hhx-cnc-page .hhx-na-support__figure { display: block; margin: 0; }
.hhx-cnc-page .hhx-na-support__image, .hhx-cnc-page .hhx-na-support__placeholder { display: block; width: 100%; aspect-ratio: 4 / 3; height: auto; border-radius: 16px; object-fit: cover; object-position: center; box-shadow: 0 20px 44px rgba(16, 42, 80, .15); }
.hhx-cnc-page .hhx-na-support__placeholder { display: grid; place-items: center; color: #718096; background: #e9eef4; font: 700 13px/1.2 var(--hhx-font); letter-spacing: .06em; text-transform: uppercase; box-shadow: none; }
.hhx-cnc-page .hhx-na-support__credit { margin: 9px 0 0; color: #718096; font-size: 11px; line-height: 1.4; }
.hhx-cnc-page .hhx-na-support__global { position: relative; z-index: 1; display: grid; width: min(calc(100% - 96px), 1380px); margin: clamp(54px, 7vw, 96px) auto 0; padding: clamp(34px, 4vw, 58px); grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr); gap: clamp(36px, 5vw, 86px); align-items: center; overflow: hidden; border: 1px solid #dbe6f1; border-radius: 16px; background: #fff; box-shadow: 0 14px 34px rgba(16, 42, 80, .06); }
.hhx-cnc-page .hhx-na-support__global::after { position: absolute; inset: -20% -8% -30% auto; width: 58%; background: url('../images/world-map-watermark.svg') center/contain no-repeat; content: ''; opacity: .08; pointer-events: none; }
.hhx-cnc-page .hhx-na-support__global > * { position: relative; z-index: 1; }
.hhx-cnc-page .hhx-na-support__global-label { margin: 0 0 12px; color: #2563eb; font: 700 11px/1.2 var(--hhx-heading); letter-spacing: .1em; text-transform: uppercase; }
.hhx-cnc-page .hhx-na-support__global h3 { max-width: 550px; margin: 0 0 14px; color: #102a50; font: 700 clamp(28px, 2.6vw, 40px)/1.1 var(--hhx-heading); letter-spacing: -.04em; }
.hhx-cnc-page .hhx-na-support__global p:not(.hhx-na-support__global-label) { max-width: 590px; margin: 0; color: #607184; font: 400 16px/1.6 var(--hhx-font); }
.hhx-cnc-page .hhx-na-support__global-path { display: grid; grid-template-columns: 1fr 38px 1fr 38px 1fr; gap: 10px; align-items: center; }
.hhx-cnc-page .hhx-na-support__global-path span { display: grid; min-height: 92px; align-items: center; padding: 18px; border: 1px solid #dbe5ef; border-radius: 8px; background: rgba(255,255,255,.88); color: #102a50; font: 700 14px/1.3 var(--hhx-font); text-align: center; }
.hhx-cnc-page .hhx-na-support__global-path i { height: 1px; background: #9ebbe1; }
.hhx-cnc-page .hhx-na-support__global-path i::after { display: block; width: 7px; height: 7px; margin: -3px 0 0 auto; border-top: 1px solid #2563eb; border-right: 1px solid #2563eb; content: ''; transform: rotate(45deg); }
@media (max-width: 1024px) { .hhx-cnc-page .hhx-na-support__frame { width: min(calc(100% - 64px), 1380px); grid-template-columns: 1.05fr .95fr; gap: 40px; } .hhx-cnc-page .hhx-na-support h2 { font-size: clamp(46px, 5.2vw, 60px); } .hhx-cnc-page .hhx-na-support__advantages { gap: 14px; } .hhx-cnc-page .hhx-na-support__advantages article { padding-right: 12px; } }
@media (max-width: 1024px) { .hhx-cnc-page .hhx-na-support__global { width: min(calc(100% - 64px), 1380px); grid-template-columns: 1fr; gap: 30px; } }
@media (max-width: 760px) { .hhx-cnc-page .hhx-na-support { padding: 66px 0; } .hhx-cnc-page .hhx-na-support__map { top: 3%; right: -40%; width: 130vw; opacity: .05; } .hhx-cnc-page .hhx-na-support__frame { width: min(calc(100% - 36px), 1380px); grid-template-columns: 1fr; gap: 34px; } .hhx-cnc-page .hhx-na-support h2 { font-size: clamp(39px, 11vw, 52px); line-height: 1.07; } .hhx-cnc-page .hhx-na-support__description { margin: 22px 0 34px; font-size: 16px; } .hhx-cnc-page .hhx-na-support__advantages { grid-template-columns: 1fr; gap: 22px; } .hhx-cnc-page .hhx-na-support__advantages article { padding: 0 0 20px; border-right: 0; border-bottom: 1px solid #d6e0ec; } .hhx-cnc-page .hhx-na-support__advantages article:last-child { padding-bottom: 0; border-bottom: 0; } .hhx-cnc-page .hhx-na-support__advantages span { margin-bottom: 12px; } }
@media (max-width: 760px) { .hhx-cnc-page .hhx-na-support__global { width: min(calc(100% - 36px), 1380px); margin-top: 38px; padding: 28px 22px; border-radius: 10px; } .hhx-cnc-page .hhx-na-support__global-path { grid-template-columns: 1fr; gap: 8px; } .hhx-cnc-page .hhx-na-support__global-path i { width: 1px; height: 20px; margin: 0 auto; } .hhx-cnc-page .hhx-na-support__global-path i::after { margin: auto 0 0 -3px; transform: rotate(135deg); } }
