/* Norwest companies-preview: "700+ Innovators" top section (v2, 2026-11-04).
   The homepage's own section, moved to the top of the companies page (Norwest call 11/04). Rules below are COPIED
   from home-2026-v54.css (the Home 2026 plugin) so both read the same; only the wrapper, the page-title handling and
   the full-width bleed are new. Scoped to .nwco-innov so nothing else on the page changes. */

/* the page's own visually-hidden "Portfolio Companies (Preview)" h1 steps aside: this section's heading is the h1 */
body.page-id-99999936064 .page-header { display: none !important; }
/* v6 (11-06): page-agnostic version of the rule above, for the /companies/ page on any install */
main#content:has(.nwco-innov) > .page-header { display: none !important; }

.nwco-innov.nwhm {
	--teal: #07485B; --ecru: #E6E6DB;
	--serif: 'DM Serif Display', DMSerifDisplay, Georgia, serif;
	--sans: Poppins, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	display: block; position: relative; z-index: 2;
	width: 100vw; margin: 0 0 0 calc(50% - 50vw); padding: 0;
	font-family: var(--sans); color: #fff; background: #000;
	overflow-x: clip;
}
.nwco-innov *, .nwco-innov *::before, .nwco-innov *::after { box-sizing: border-box; }
.nwco-innov section.nwhm-sec { padding-left: 0 !important; padding-right: 0 !important; margin: 0; overflow: visible; }
.nwco-innov p { margin: 0; }
.nwco-innov img { border: 0; }

/* ---- copied from home-2026-v54.css ---- */
.nwhm .nwhm-serif, .nwhm .nwhm-serif * { font-family: var(--serif) !important; font-weight: 400 !important; }
.nwhm-intro { background: #000; color: #fff; padding: 100px 0; }
.nwhm-intro__pin { position: relative; }
.nwhm-intro__text { margin: 0 0 100px; padding: 0; }
.nwhm .nwhm-intro__h { width: 876px; max-width: 100%; margin: 0 auto 30px; color: #fff; font-size: 46px !important; line-height: 1.15 !important; letter-spacing: 0; text-transform: none; }
.nwhm .nwhm-intro__p { width: 886px; max-width: 100%; margin: 0 auto; }
.nwhm .nwhm-intro__p, .nwhm .nwhm-intro__p p { color: #fff; font: 400 22px/1.64 var(--sans); letter-spacing: 0; }
.nwhm .nwhm-intro__p p { margin: 0; }
.nwhm .nwhm-intro__p a { color: #fff; text-decoration: underline; }
.nwhm .nwhm-intro__p a:hover { color: #fff; text-decoration-thickness: 2px; }
.nwhm-logos { --a-end: calc(50% + 25px); --b-start: calc(50% - 55px); --b-center: 142px; position: relative; height: 178px; }
.nwhm-logos__row { position: absolute; height: 64px; overflow: hidden; }
.nwhm-logos__row--a { top: -12px; left: 0; right: 0; height: 88px; overflow: hidden; }
.nwhm-logos__row--a .nwhm-logos__track { top: 12px; }
.nwhm-logos__row--b { top: calc(var(--b-center) - 32px); left: 0; right: 0; }
.nwhm-logos__track { position: absolute; top: 0; height: 64px; display: flex; align-items: center; width: max-content; will-change: transform; }
.nwhm-logos__row--a .nwhm-logos__track { right: calc(100% - var(--a-end)); }
.nwhm-logos__row--b .nwhm-logos__track { left: var(--b-start); }
.nwhm .nwhm-logos__item { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; text-decoration: none; }
.nwhm-logos { --logo-h: 36px; --logo-max-w: 220px; --logo-gap: 60px; --logo-unit: 45.7px; --logo-min: 22px; --logo-max: 46px; --logo-wmax: 190px; }
.nwhm-logos__row--a .nwhm-logos__item { margin-left: var(--logo-gap); }
.nwhm-logos__row--b .nwhm-logos__item { margin-right: var(--logo-gap); }
.nwhm .nwhm-logos__item img { display: block; height: clamp(var(--logo-min), min(calc(var(--k, 1) * var(--logo-unit) * var(--s, 1)), calc(var(--logo-wmax) / var(--ar, 4))), var(--logo-max)) !important; width: auto !important; max-width: none !important; max-height: none !important; object-fit: contain; transition: opacity .3s ease; }
.nwhm .nwhm-logos__item:hover img, .nwhm .nwhm-logos__item:focus-visible img { opacity: .75; }
.nwhm .nwhm-logos__item.is-mono img { height: var(--logo-h) !important; width: auto !important; max-width: var(--logo-max-w) !important; opacity: .5; filter: brightness(0) invert(1); }
@media (max-width: 1024px) {
	.nwhm-intro__text { padding: 0 55px; }
	.nwhm .nwhm-intro__h, .nwhm .nwhm-intro__p { width: auto; }
	.nwhm-logos { --a-end: calc(50% + 41px); --b-start: calc(50% - 92px); --b-center: 141px; height: 177px; }
	.nwhm .nwhm-intro__p { max-width: none; margin-left: 0; }
	.nwhm .nwhm-intro__h { margin-left: 0; }
}
@media (max-width: 767px) {
	.nwhm-intro { padding: 60px 0; }
	.nwhm-intro__text { padding: 0 45px; }
	.nwhm .nwhm-intro__h { font-size: 38px !important; line-height: 1.15 !important; margin-bottom: 15px; }
	.nwhm-logos { --a-end: calc(50% + 144px); --b-start: calc(50% - 88px); --logo-h: 28px; --logo-max-w: 160px; --logo-gap: 44px; --logo-unit: 36.6px; --logo-min: 18px; --logo-max: 37px; --logo-wmax: 152px; }
	.nwhm .nwhm-intro__h, .nwhm .nwhm-intro__p { max-width: none; }
}

/* v2: background previews (?nwco_bg=charcoal|teal). Default stays black like the homepage section. The FINE logo
   files are mid-grey (#808080) drawn for black (5.3:1); on the lighter grounds they are lifted to keep about the same
   contrast: charcoal x1.12 (5.3:1), deep teal x1.55 (5.9:1). White type: 16.3:1 charcoal, 10.1:1 deep teal. */
.nwco-innov.nwco-innov--charcoal, .nwco-innov--charcoal .nwhm-intro { background: #231F20; }
.nwco-innov--charcoal .nwhm-logos__item img { filter: brightness(1.12); }
.nwco-innov.nwco-innov--teal, .nwco-innov--teal .nwhm-intro { background: #07485B; }
.nwco-innov--teal .nwhm-logos__item img { filter: brightness(1.55); }

/* v3 (Slack 11-04, Lia: "I prefer black version and I'm wondering if it can be shorter? so it's not tall?"): black is
   now the default (php), and the section is shorter: less space above, below and between the text and the logos.
   Same heading, paragraph and logo rows. Laptop 686px -> ~500px. */
.nwco-innov .nwhm-intro { padding: 56px 0 44px; }
.nwco-innov .nwhm-intro__text { margin-bottom: 48px; }
.nwco-innov.nwhm .nwhm-intro__h { margin-bottom: 18px; }
@media (max-width: 767px) {
	.nwco-innov .nwhm-intro { padding: 40px 0 28px; }
	.nwco-innov .nwhm-intro__text { margin-bottom: 36px; }
	.nwco-innov.nwhm .nwhm-intro__h { margin-bottom: 12px; }
}

/* v4 (11-04, ?logos=loop): rows start at the screen edges for the slow loop (same as the homepage loop preview). */
.nwco-innov .nwhm-logos.is-loop { --a-end: 100%; --b-start: 0px; }
.nwco-innov .nwhm-logos.is-loop .nwhm-logos__track { will-change: transform; }

/* v5 (11-04, Lia: "the movement seems jerky"): the same scroll-linked row motion, run by the browser as a scroll-driven
   animation (off the main thread) instead of JS every frame. JS adds .is-sda only where supported and keeps --nwsd-w. */
@supports (animation-timeline: view()) {
	@keyframes nwsdA { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(var(--nwsd-w, 100vw), 0, 0); } }
	@keyframes nwsdB { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(calc(-1 * var(--nwsd-w, 100vw)), 0, 0); } }
	.nwco-innov .nwhm-logos.is-sda { view-timeline-name: --nwlogos; view-timeline-axis: block; }
	.nwco-innov .nwhm-logos.is-sda .nwhm-logos__row--a .nwhm-logos__track { animation: nwsdA linear both; animation-timeline: --nwlogos; animation-range: cover 0% cover 100%; }
	.nwco-innov .nwhm-logos.is-sda .nwhm-logos__row--b .nwhm-logos__track { animation: nwsdB linear both; animation-timeline: --nwlogos; animation-range: cover 0% cover 100%; }
}
@media (prefers-reduced-motion: reduce) { .nwco-innov .nwhm-logos .nwhm-logos__track { animation: none !important; } }
