/**
 * Inner legacy pages — same rhythm & polish as homepage (v1.5.16+).
 * Scoped to body.jcproto-has-legacy-body (Capabilities, Materials, Industrials, Resource, Company, Contact, etc.)
 */

/* ── Section vertical rhythm (moderate whitespace) ─────────────── */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer:not(:first-child):not(.jcproto-inner-hero) {
	padding-top: clamp(2rem, 3vw, 3rem);
	padding-bottom: clamp(2rem, 3vw, 3rem);
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer.jcproto-inner-hero + .outerContainer {
	padding-top: clamp(2rem, 3vw, 3rem);
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer:not(.jcproto-inner-hero) + .outerContainer:not(.jcproto-inner-hero) {
	padding-top: clamp(1.25rem, 2vw, 2rem);
	margin-top: 0 !important;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer.jcproto-empty-spacer {
	display: none !important;
}

/* Materials pages: remove repeated white horizontal strip containers. */
body.jcproto-layout-material.jcproto-has-legacy-body #outerContainer_1700476633484#outerContainer_1700476633484,
body.jcproto-layout-material.jcproto-has-legacy-body #outerContainer_1685000001720#outerContainer_1685000001720,
body.jcproto-layout-material.jcproto-has-legacy-body #outerContainer_1685000303770#outerContainer_1685000303770 {
	background: transparent !important;
	background-color: transparent !important;
}

/* Siteblocks in bodyArea */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .siteblocks-setting-wrap {
	padding-top: clamp(1.75rem, 2.5vw, 2.75rem);
	padding-bottom: clamp(1.75rem, 2.5vw, 2.75rem);
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer + .siteblocks-setting-wrap {
	padding-top: clamp(1rem, 1.75vw, 1.75rem);
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .siteblocks-setting-wrap + .outerContainer {
	padding-top: clamp(1.5rem, 2.25vw, 2.25rem) !important;
}

/* ── Typography & section titles ─────────────────────────────── */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .graphicNewTitle,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-hd > h2,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-hd > h3 {
	font-family: var(--jcproto-font-display, inherit);
	font-weight: 700 !important;
	color: var(--jcproto-text, #0a0a0a) !important;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-bd {
	color: var(--jcproto-text-body, #555555);
	line-height: 1.7;
}

/* ── graphicNew fontStyle service cards — black industrial ─────── */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0) {
	color: var(--jcproto-text-body, #555555) !important;
	text-decoration: none !important;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0) strong {
	color: var(--jcproto-text, #0a0a0a) !important;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle .sitewidget-bd a span[style*="#999"],
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle .sitewidget-bd a span[style*="color:#999"] {
	display: block !important;
	width: 36px !important;
	height: 3px !important;
	margin: 10px auto 14px !important;
	padding: 0 !important;
	font-size: 0 !important;
	line-height: 0 !important;
	color: transparent !important;
	background: var(--jcproto-primary, #0a0a0a) !important;
	border: 0 !important;
	overflow: hidden !important;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle:hover .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0),
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle:hover .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0) strong,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle:hover .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0) span,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle:hover .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0) strong * {
	color: #fff !important;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle:hover .sitewidget-bd a span[style*="#999"],
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap [class*="sitewidget-graphicNew"].fontStyle:hover .sitewidget-bd a span[style*="color:#999"] {
	background: #fff !important;
}

/* ── pictureNew capability tiles ─────────────────────────────── */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-pictureNew-description .picture-description {
	border-radius: var(--jcproto-radius-lg, 12px);
	box-shadow: var(--jcproto-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.06));
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-pictureNew-description:hover .picture-description {
	transform: translateY(-4px);
	box-shadow: var(--jcproto-shadow-md, 0 4px 16px rgba(0, 0, 0, 0.1));
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-pictureNew .picture-wrap img {
	border-radius: var(--jcproto-radius-lg, 12px);
	transition: transform 0.35s ease;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-pictureNew:hover .picture-wrap img {
	transform: scale(1.02);
}

/* ── FAQ accordion hover ───────────────────────────────────────── */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-faqlist .faqlist-style-fold .faq-question-title:hover,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-faqlist .faqlist-style-fold .faq-question-title.is-open {
	color: var(--jcproto-primary, #0a0a0a) !important;
}

/* ── Resource hub cards (blockCon15564) ────────────────────────── */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .qiaoxin15564 .main_text,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .blockCon15564 .main_text {
	border-radius: var(--jcproto-radius-lg, 12px);
	box-shadow: var(--jcproto-shadow-md, 0 4px 16px rgba(0, 0, 0, 0.08));
	border: 1px solid var(--jcproto-border, #e0e0e0);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .qiaoxin15564 .main_one:hover .main_text,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .blockCon15564 .main_one:hover .main_text {
	transform: translateY(-4px);
	box-shadow: var(--jcproto-shadow-lg, 0 12px 40px rgba(0, 0, 0, 0.12));
}

/* ── Strip residual legacy blues in content ────────────────────── */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0)[style*="#096af6"],
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .sitewidget-bd a:not(.backstage-component-btn):not(.btn):not(.gbBgColor0)[style*="color:#096af6"] {
	color: var(--jcproto-text-body, #555555) !important;
}

/* Title-only sections — avoid double gutter before card/grid content */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer:not(.jcproto-inner-hero):has(.graphicNewTitle, .sitewidget-hd > h2, .sitewidget-hd > h3):not(:has(.sitewidget-graphicNew)):not(:has(.sitewidget-pictureNew)):not(:has(.sitewidget-prodTabList)):not(:has(.sitewidget-advancedSlider)) {
	padding-bottom: clamp(0.75rem, 1.25vw, 1.25rem) !important;
}

body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer:not(.jcproto-inner-hero):has(.graphicNewTitle, .sitewidget-hd > h2, .sitewidget-hd > h3):not(:has(.sitewidget-graphicNew)):not(:has(.sitewidget-pictureNew)):not(:has(.sitewidget-prodTabList)):not(:has(.sitewidget-advancedSlider)) + .outerContainer:not(.jcproto-inner-hero),
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap #backstage-bodyArea > .outerContainer:not(.jcproto-inner-hero):has(.graphicNewTitle, .sitewidget-hd > h2, .sitewidget-hd > h3):not(:has(.sitewidget-graphicNew)):not(:has(.sitewidget-pictureNew)):not(:has(.sitewidget-prodTabList)):not(:has(.sitewidget-advancedSlider)) + .siteblocks-setting-wrap {
	padding-top: clamp(0.75rem, 1.25vw, 1.25rem) !important;
}

/* Resource hub cards — match homepage resource styling */
body.jcproto-has-legacy-body .jcproto-resource-card--hub {
	border-radius: var(--jcproto-radius-lg, 12px);
	border-color: var(--jcproto-border, #e0e0e0);
	box-shadow: var(--jcproto-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.06));
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

body.jcproto-has-legacy-body .jcproto-resource-card--hub:hover {
	transform: translateY(-4px);
	box-shadow: var(--jcproto-shadow-md, 0 4px 16px rgba(0, 0, 0, 0.1));
	border-color: var(--jcproto-primary, #0a0a0a);
}

body.jcproto-has-legacy-body .jcproto-resource-card--hub img {
	border-radius: var(--jcproto-radius-lg, 12px) var(--jcproto-radius-lg, 12px) 0 0;
}

/* List pages — pagination & article cards */
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .articlelist-liststyle20 .pagination > .active > a,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .articlelist-liststyle20 .pagination > .active > span,
body.jcproto-has-legacy-body .jcproto-legacy-body-wrap .faqlist-pagination .pagination > .active > a {
	background-color: var(--jcproto-primary, #0a0a0a) !important;
	border-color: var(--jcproto-primary, #0a0a0a) !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

/* Section horizontal tabs (Capabilities / Materials / Industrials / Resource) — removed */
.jcproto-page-subnav.jcproto-cap-subnav {
	display: none !important;
}

/* Horizontal sub-nav — company/contact: tabs above breadcrumb */
body.jcproto-layout-company #backstage-bodyArea > .jcproto-page-subnav--below-hero,
body.jcproto-layout-contact #backstage-bodyArea > .jcproto-page-subnav--below-hero {
	border-bottom: 0;
}

body.jcproto-layout-company #backstage-bodyArea > .jcproto-page-subnav--below-hero + .jcproto-position-breadcrumb--below-hero,
body.jcproto-layout-company #backstage-bodyArea > .jcproto-page-subnav--below-hero + .jcproto-breadcrumb,
body.jcproto-layout-contact #backstage-bodyArea > .jcproto-page-subnav--below-hero + .jcproto-position-breadcrumb--below-hero,
body.jcproto-layout-contact #backstage-bodyArea > .jcproto-page-subnav--below-hero + .jcproto-breadcrumb {
	padding-top: 8px;
	border-top: 1px solid var(--jcproto-border, #e8e8e8);
}

body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header,
body.jcproto-has-legacy-body #jcproto-header + .jcproto-position-breadcrumb--below-header + .jcproto-page-subnav--below-header,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	background: #fff;
	border-bottom: 1px solid var(--jcproto-border, #e8e8e8);
}

body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list,
body.jcproto-has-legacy-body #jcproto-header + .jcproto-position-breadcrumb--below-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero .jcproto-cap-subnav__list,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header .jcproto-cap-subnav__list {
	width: 100%;
	max-width: var(--jcproto-container, 1380px);
	margin: 0 auto;
	padding: 0 15px;
	box-sizing: border-box;
	border-bottom: 0;
}

body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list a,
body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list .jcproto-cap-subnav__label,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero .jcproto-cap-subnav__list a,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero .jcproto-cap-subnav__list .jcproto-cap-subnav__label,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header .jcproto-cap-subnav__list a,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header .jcproto-cap-subnav__list .jcproto-cap-subnav__label {
	color: var(--jcproto-text, #0a0a0a);
}

body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list .is-active a,
body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list a:hover,
body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list .is-active .jcproto-cap-subnav__label,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero .jcproto-cap-subnav__list .is-active a,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero .jcproto-cap-subnav__list a:hover,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero .jcproto-cap-subnav__list .is-active .jcproto-cap-subnav__label,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header .jcproto-cap-subnav__list .is-active a,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header .jcproto-cap-subnav__list a:hover,
body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header .jcproto-cap-subnav__list .is-active .jcproto-cap-subnav__label {
	color: var(--jcproto-primary, #0a0a0a);
	border-bottom-color: var(--jcproto-primary, #0a0a0a);
}

@media (min-width: 1220px) {
	body.jcproto-has-legacy-body #jcproto-header + .jcproto-page-subnav--below-header .jcproto-cap-subnav__list,
	body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-hero .jcproto-cap-subnav__list,
	body.jcproto-has-legacy-body #backstage-bodyArea > .jcproto-page-subnav--below-header .jcproto-cap-subnav__list {
		padding-left: 40px;
		padding-right: 40px;
	}
}

/* Non-legacy shell pages (Resource hub, FAQ list, etc.) */
.jcproto-page-shell > .container > .jcproto-page-subnav {
	margin-bottom: clamp(1rem, 2vw, 1.5rem);
	border-bottom: 1px solid var(--jcproto-border, #e8e8e8);
}

.jcproto-page-shell > .container > .jcproto-page-subnav .jcproto-cap-subnav__list a,
.jcproto-page-shell > .container > .jcproto-page-subnav .jcproto-cap-subnav__list .jcproto-cap-subnav__label {
	color: var(--jcproto-text, #0a0a0a);
}

.jcproto-page-shell > .container > .jcproto-page-subnav .jcproto-cap-subnav__list .is-active a,
.jcproto-page-shell > .container > .jcproto-page-subnav .jcproto-cap-subnav__list a:hover,
.jcproto-page-shell > .container > .jcproto-page-subnav .jcproto-cap-subnav__list .is-active .jcproto-cap-subnav__label {
	color: var(--jcproto-primary, #0a0a0a);
	border-bottom-color: var(--jcproto-primary, #0a0a0a);
}

/* Horizontal sub-nav — touch scroll on tablet/phone */
@media (max-width: 991px) {
	body.jcproto-has-legacy-body .jcproto-page-subnav__list,
	body.jcproto-has-legacy-body .jcproto-cap-subnav__list {
		display: flex;
		flex-wrap: nowrap !important;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		gap: 0;
	}

	body.jcproto-has-legacy-body .jcproto-page-subnav__list::-webkit-scrollbar,
	body.jcproto-has-legacy-body .jcproto-cap-subnav__list::-webkit-scrollbar {
		display: none;
	}

	body.jcproto-has-legacy-body .jcproto-page-subnav__list > li,
	body.jcproto-has-legacy-body .jcproto-cap-subnav__list > li {
		flex: 0 0 auto;
	}
}
