/* Norwest Home 2026 — values from FINE Figma "Norwest Homepage Sprint (SHARED)" / Production
   Desktop >=1025 (frame 1440, 2085:125) · Tablet 768-1024 (frame 768, 2085:276) · Phone <=767 (frame 390, 2085:391) */

html:has(.nwhm), body:has(.nwhm) { overflow-x: clip; }
body:has(.nwhm) .nh-root .nh-panel:not(.is-open) { box-shadow: none !important; }

.nwhm {
	--teal: #07485B; --emerald: #055C5F; --eggplant: #313E5C; --ecru50: #F3F3EC; --ecru: #E6E6DB;
	--coral: #FE4F44; --ink: #111111; --char: #231F20;
	--serif: 'DM Serif Display', DMSerifDisplay, Georgia, serif;
	--sans: Poppins, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--gut: max(45px, calc((100% - 1180px) / 2)); /* = the nav's logo inset (45px below 1270 wide) */
	display: block; width: 100%; margin: 0; padding: 0;
	font-family: var(--sans); color: #fff; background: #000;
}
.nwhm *, .nwhm *::before, .nwhm *::after { box-sizing: border-box; }
main.nwhm section.nwhm-sec { padding-left: 0 !important; padding-right: 0 !important; margin: 0; overflow: visible; }
/* the hero clips its media (the phone photo is drawn up to 200px taller than the hero; without this it showed behind the see-through header) */
main.nwhm section.nwhm-sec.nwhm-hero { overflow: hidden; }
.nwhm .nwhm-serif, .nwhm .nwhm-serif * { font-family: var(--serif) !important; font-weight: 400 !important; }
.nwhm p { margin: 0; }
.nwhm img { border: 0; border-radius: 0; box-shadow: none; }

/* Line heights = the rest of norwestdev1 (Adam 2026-10-21: "use the standard line height from around the site on all text"): serif headings 1.15, body 1.64, small 1.5, card titles 1.1/1.2 like the site's amp cards. */
/* ── Hero ── */
/* Hero = the first screen under the site header on every screen size. It only grows past the fold when fitting would push the headline into the logo block or the top edge: --nwhm-need is that minimum, measured by JS per slide. --nwhm-top = header height. */
.nwhm-hero { --hneed: 520px; position: relative; height: max(var(--nwhm-need, var(--hneed)), calc(100vh - var(--nwhm-top, 95px))); height: max(var(--nwhm-need, var(--hneed)), calc(100svh - var(--nwhm-top, 95px))); overflow: hidden; background: #000; color: #fff; }
.nwhm-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .9s ease, visibility 0s linear .9s; }
.nwhm-slide.is-active { opacity: 1; visibility: visible; transition: opacity .9s ease; }
/* text hand-off: the outgoing headline/link fade out in .3s, the incoming ones arrive after .45s, so they never overlap */
.nwhm-slide .nwhm-hero__copy, .nwhm-slide .nwhm-hero__co { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity .3s ease, transform .3s ease; }
.nwhm-slide.is-active .nwhm-hero__copy, .nwhm-slide.is-active .nwhm-hero__co { opacity: 1; transform: none; transition: opacity .55s ease .45s, transform .9s cubic-bezier(0.16, 1, 0.3, 1) .45s; }
.nwhm .nwhm-media { position: absolute; inset: 0; display: block; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; object-position: var(--fd, 50% 50%); }
.nwhm-slide::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, .2); pointer-events: none; }
.nwhm-hero__shade { position: absolute; z-index: 1; left: 0; right: 0; bottom: -15px; height: 257px; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000 95%); pointer-events: none; }
.nwhm-hero__co { position: absolute; z-index: 2; top: 39px; right: calc(var(--gut) - 14px); width: 313px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
/* uniform hero logos: balanced height in a fixed box, bottom-aligned, so the line is in the same spot on every slide */
.nwhm-hero__co { --hl-u: 56px; --hl-min: 30px; --hl-max: 46px; --hl-wmax: 230px; }
.nwhm .nwhm-hero__logo { --lh: clamp(var(--hl-min), min(calc(var(--k, 1) * var(--hl-u)), calc(var(--hl-wmax) / var(--ar, 4))), var(--hl-max)); display: block; width: auto !important; height: var(--lh) !important; max-width: none !important; margin-top: calc(var(--hl-max) - var(--lh)); }
.nwhm-hero__rule { display: block; width: 299px; height: 1px; background: #fff; }
.nwhm .nwhm-hero__link { font: 400 21px/1.5 var(--sans); letter-spacing: .25px; color: #fff; text-decoration: none; }
.nwhm a.nwhm-hero__link:hover, .nwhm a.nwhm-hero__link:focus-visible { text-decoration: underline; color: #fff; }
.nwhm-hero__copy { position: absolute; z-index: 2; left: var(--gut); bottom: 85px; /* FINE QA 10/23: 20px lower on desktop */ width: 967px; max-width: calc(100% - var(--gut) - 200px); }
.nwhm .nwhm-hero__title { margin: 0; color: #fff; font-size: 58px !important; line-height: 1.15 !important; letter-spacing: 0; text-transform: none; }
.nwhm .nwhm-hero__link--m { display: none; }
.nwhm-hero__dots { position: absolute; z-index: 3; right: max(20px, calc(var(--gut) - 35px)); bottom: 88px; display: flex; gap: 10px; }
/* bigger tap area (20x24, no overlap at the Figma's 20px dot pitch), same 10px dot: the pip is the visible dot */
.nwhm .nwhm-hero__dot { position: relative; width: 20px; height: 24px; min-height: 0; margin: -7px -5px; padding: 0; border: 0; border-radius: 0; background: transparent; cursor: pointer; }
.nwhm .nwhm-hero__pip { position: absolute; left: 5px; top: 7px; width: 10px; height: 10px; border-radius: 5px; background: rgba(255,255,255,.3); }
.nwhm .nwhm-hero__dot[aria-selected="true"] .nwhm-hero__pip, .nwhm .nwhm-hero__dot[aria-selected="true"]:hover .nwhm-hero__pip { background: rgba(255,255,255,.8); }
.nwhm .nwhm-hero__dot:hover, .nwhm .nwhm-hero__dot:focus { background: transparent; border: 0; color: transparent; }
.nwhm .nwhm-hero__dot:hover .nwhm-hero__pip, .nwhm .nwhm-hero__dot:focus .nwhm-hero__pip { background: rgba(255,255,255,.55); }
.nwhm .nwhm-hero__dot:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ── Innovators (black) ── */
.nwhm-intro { background: #000; color: #fff; padding: 100px 0; }
/* Logo 'scroll pause': the block holds under the header while the logo rows slide sideways (JS sets .is-pin, the track
   height and --pin-top). The site makes <body> a scroll box (overflow hidden auto !important), which stops sticky from
   working, so while the pin is on this page's body clips sideways only and lets the page itself scroll. */
.nwhm-intro__pin { position: relative; }
.nwhm-intro.is-pin .nwhm-intro__pin { position: sticky; top: var(--pin-top, 0px); }
html body:has(.nwhm-intro.is-pin) { overflow: clip visible !important; }
.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; }
.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; }

/* Logo rows. Top row ends at --a-end and runs to the left page edge; bottom row starts at --b-start and runs past the right edge. */
.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; }
/* Logo rows (FINE 10/21): start at the Figma's mid-screen points, then move with scroll to full width (top row right, bottom row left). JS sets the transform. */
.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); }
/* ?logos=loop preview: both rows run the full width and drift on their own (JS) */
.nwhm .nwhm-logos.is-loop { --a-end: 100%; --b-start: 0px; }
.nwhm .nwhm-logos__item { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; text-decoration: none; }
/* one max height for every logo (wide wordmarks capped by --logo-max-w), equal visible gaps: image boxes are cropped tight to each logo */
.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); }
/* --s = per-logo optical size (page Logos > Size), so bold and light marks read the same weight */
.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; /* uniform: balanced height, Size = optical nudge */ 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); }

/* ── Start / Face / From (teal) ── */
.nwhm-teal { background: var(--teal); color: #fff; padding: 150px 0; display: flex; flex-direction: column; gap: 120px; }
.nwhm-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 60px; padding: 0 max(40px, calc((100% - 1160px) / 2)); }
.nwhm .nwhm-h2 { margin: 0 0 15px; color: #fff; font-size: 58px !important; line-height: 1.15 !important; letter-spacing: 0; }
.nwhm .nwhm-p, .nwhm .nwhm-p p { margin: 0; color: #fff; font: 300 19px/1.64 var(--sans); letter-spacing: .25px; }
.nwhm .nwhm-p a { color: #fff; text-decoration: underline; }
.nwhm .nwhm-p a:hover { color: #fff; text-decoration-thickness: 2px; }
.nwhm-row--start .nwhm-col-text { flex: 0 1 503px; }
.nwhm-items { position: relative; flex: 0 0 460px; display: flex; flex-direction: column; gap: 34px; margin: 0; padding: 0; list-style: none; }
.nwhm-items li { margin: 0; padding: 0; list-style: none; }
.nwhm .nwhm-item { position: relative; display: flex; flex-direction: column; gap: 30px; width: 397px; max-width: calc(100% - 15px); padding: 0 0 30px; border: 0; color: #fff; text-decoration: none; }
.nwhm .nwhm-item::after { content: ''; position: absolute; left: 0; right: 0; bottom: -.5px; height: 1px; background: #fff; }
.nwhm .nwhm-item__t { display: block; font-size: 30px !important; line-height: 1.15 !important; color: #fff; }
.nwhm .nwhm-item__d { display: block; font: 400 16px/1.64 var(--sans); letter-spacing: .25px; color: #fff; }
.nwhm-items li:last-child .nwhm-item__d { height: 46px; overflow: visible; }
.nwhm .nwhm-item__arrow { position: absolute; left: 100%; top: 69px; transition: transform .2s ease-in-out; }
.nwhm a.nwhm-item:hover .nwhm-item__arrow, .nwhm a.nwhm-item:focus-visible .nwhm-item__arrow { transform: translateX(10px); } /* site's 10px nudge */
.nwhm a.nwhm-item:hover, .nwhm a.nwhm-item:focus { color: #fff; }

.nwhm-wide { position: relative; margin: 0 31px; padding: 0; }
.nwhm-wide__img { position: relative; aspect-ratio: 1378 / 611.21; overflow: hidden; }
.nwhm .nwhm-wide__img img { position: absolute; inset: 0; display: block; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; object-position: var(--wf, 50% 50%); }
.nwhm-wide__img::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: max(42.62%, 230px); /* 4-line caption stays on the dark part */ background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 95%); pointer-events: none; }
.nwhm .nwhm-wide figcaption { position: absolute; z-index: 1; right: 40px; bottom: 41px; max-width: calc(100% - 80px); margin: 0; text-align: right; color: #fff; font: 300 19px/1.64 var(--sans); letter-spacing: .25px; }

.nwhm-row--face .nwhm-col-text { flex: 0 1 480px; }
.nwhm-row--face .nwhm-p { max-width: 467px; }
.nwhm a.nwhm-btn { display: flex; align-items: center; width: 284px; height: 53px; margin-top: 30px; padding: 15px 35px; border: 1px solid #fff; border-radius: 0; background: transparent; color: #fff; font: 600 14px/21px var(--sans); letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: background .2s ease, color .2s ease; }
.nwhm a.nwhm-btn:hover, .nwhm a.nwhm-btn:focus-visible { background: #fff; color: var(--teal); }
.nwhm-img { flex: 0 0 561px; aspect-ratio: 561 / 329; overflow: hidden; }
.nwhm .nwhm-img img { display: block; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; }
.nwhm-row--from { flex-direction: row-reverse; }
.nwhm-row--from .nwhm-col-text { flex: 0 1 525px; }

/* ── Norwest Now (case study / resources module) ── */
.nwhm-now { background: var(--ecru50); color: var(--ink); padding: 75px 0 53.5px; }
.nwhm-now__in { width: calc(100% - 60px); max-width: 1200px; margin: 0 auto; padding: 10px; }
.nwhm .nwhm-now__h { margin: 0; padding: 0 0 45px; text-align: center; color: var(--char); font-size: 58px !important; line-height: 1.15 !important; letter-spacing: 0; }
.nwhm-now .amp-blog { width: 100%; font-family: var(--sans); color: var(--ink); }
.nwhm-now .amp-blog a { color: var(--ink); text-decoration: none; }
/* arrows shown in the title ink (Figma's #EEEEEE disappears on cream); site's 10px nudge on hover */
.nwhm-now .amp-arrow { display: inline-block; margin-left: var(--ag, 8px); vertical-align: middle; transition: transform .2s ease-in-out; }
.nwhm-now .amp-arrow path { stroke: currentColor; }
.nwhm-now .amp-title, .nwhm-now .amp-title .amp-t { font-family: var(--serif) !important; font-weight: 400 !important; color: var(--ink); transition: color .2s ease; }
.nwhm-now .amp-thumb { display: block; overflow: hidden; }
.nwhm-now .amp-thumb img { display: block; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; transition: transform .4s ease; }
.nwhm-now .amp-card:hover .amp-title { color: var(--eggplant); }
.nwhm-now .amp-card:hover .amp-arrow, .nwhm-now .amp-card:focus-visible .amp-arrow { transform: translateX(10px); }
.nwhm-now .amp-card:hover .amp-thumb img { transform: scale(1.05); }
.nwhm-now .amp-feat { display: flex; gap: 32px; align-items: center; padding-bottom: 32px; margin-bottom: 32px; border-bottom: 1px solid rgba(0,0,0,.12); }
.nwhm-now .amp-feat-img { flex: 0 0 46%; max-width: 46%; aspect-ratio: 542.8 / 345.19; border-left: 25px solid var(--eggplant); }
.nwhm-now .amp-feat-body { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 15px; }
.nwhm-now .amp-label { display: block; color: var(--coral); font: 600 11px/1.5 var(--sans); letter-spacing: 3px; text-transform: uppercase; }
.nwhm-now .amp-feat-title { display: block; font-size: 41.6px; line-height: 1.1; --ag: 12px; }
.nwhm-now .amp-summary { display: block; color: #000; font: 400 19px/1.64 var(--sans); }
.nwhm-now .amp-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(var(--rows, 2), auto); grid-auto-flow: column; gap: 24px 32px; }
.nwhm-now .amp-row { display: flex; gap: 16px; align-items: center; padding-bottom: 20px; border-bottom: 1px solid rgba(0,0,0,.08); }
.nwhm-now .amp-list-thumb { flex: 0 0 110px; width: 110px; height: 61.88px; }
.nwhm-now .amp-row-body { flex: 1; min-width: 0; }
/* even line lengths, no lone last word; the arrow travels with the last word */
.nwhm-now .amp-row-title, .nwhm-now .amp-feat-title { text-wrap: balance; }
.nwhm-now .amp-nb { white-space: nowrap; }
/* the site's Additional CSS sets * { font-family: Poppins }, so every span in a title must re-state the serif */
.nwhm-now .amp-title .amp-nb { font-family: var(--serif) !important; font-weight: 400 !important; }
.nwhm-now .amp-row-title { display: block; font-size: 20px; line-height: 1.2; --ag: 8px; }
.nwhm-now__all { padding: 40px 0; text-align: right; }
.nwhm a.nwhm-now__link { display: inline-block; color: var(--emerald); font: 700 11px/1.5 var(--sans); letter-spacing: 1.76px; text-transform: uppercase; text-decoration: none; }
.nwhm a.nwhm-now__link:hover, .nwhm a.nwhm-now__link:focus-visible { text-decoration: underline; color: var(--emerald); }

/* ── Tablet ── */
@media (max-width: 1024px) {
	.nwhm-hero { --hneed: 540px; }
	main.nwhm { --nwhm-top: 85px; } /* header height default, so the hero does not resize when JS measures it */
	.nwhm .nwhm-media { object-position: var(--fm, 50% 50%); }
	.nwhm-hero__shade { bottom: -8px; }
	.nwhm-hero__co { top: 40px; right: 25px; width: 299px; }
	.nwhm-hero__co { --hl-u: 44.8px; --hl-min: 24px; --hl-max: 37px; --hl-wmax: 184px; }
	.nwhm-hero__copy { left: 70px; bottom: 105px; width: 573px; max-width: calc(100% - 95px); }
	.nwhm .nwhm-hero__title { font-size: 48px !important; line-height: 1.15 !important; }
	.nwhm .nwhm-br-d { display: none; }
	.nwhm-hero__dots { left: 70px; right: auto; bottom: 72px; }

	.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-teal { padding: 100px 0; gap: 80px; }
	.nwhm-row, .nwhm-row--from { flex-direction: column; align-items: stretch; gap: 60px; padding: 0 80px; }
	.nwhm-row .nwhm-col-text { flex: none; }
	.nwhm-row--face .nwhm-p { max-width: none; }
	.nwhm-items { flex: none; width: 460px; max-width: 100%; }
	.nwhm-img { flex: none; width: 100%; aspect-ratio: 608 / 357; }
	.nwhm-wide { margin: 0 32px 0 31px; }
	.nwhm-wide__img { aspect-ratio: 705 / 313; }
	.nwhm-wide__img::after { height: max(42.81%, 230px); }
	.nwhm .nwhm-wide figcaption { bottom: 24px; }

	.nwhm-now { padding: 60px 0 50px; }
	.nwhm-now__in { width: calc(100% - 30px); }
	.nwhm .nwhm-now__h { font-size: 52px !important; }
	.nwhm-now .amp-feat-img { aspect-ratio: 330.27 / 334.25; }
	.nwhm-now__all { text-align: left; margin-left: -10px; }
	/* text fills the column between the Figma side margins on every tablet width */
	.nwhm .nwhm-intro__p { max-width: none; margin-left: 0; }
	.nwhm .nwhm-intro__h { margin-left: 0; }
	.nwhm-row .nwhm-col-text, .nwhm-row--face .nwhm-p { max-width: none; }
	/* Norwest Now: 25px side margins like the 768 frame, at every tablet width */
	.nwhm-now__in { max-width: none; }
}

/* ── Phone ── */
@media (max-width: 767px) {
	.nwhm-hero { --hfig: 200.26vw; --hneed: 420px; }
	main.nwhm { --nwhm-top: 65px; }
	/* phone: draw the photo at the Figma frame height and anchor it to the bottom, so the face sits the same distance above the headline as drawn; clip at most 200px off the top on short screens */
	.nwhm .nwhm-media { top: auto; bottom: 0; height: max(100%, min(var(--hfig), calc(100% + 200px))) !important; }
	.nwhm-slide::after { display: none; }
	.nwhm-hero__shade { top: auto; bottom: 0; height: min(452px, 100%); }
	.nwhm-hero__co { display: none; }
	.nwhm-hero__copy { left: 45px; right: auto; bottom: 59px; /* Figma: 30px between the link and the dots */ width: calc(100% - 70px); max-width: none; display: flex; flex-direction: column; gap: 10px; }
	.nwhm .nwhm-hero__title { font-size: 38px !important; line-height: 1.15 !important; }
	.nwhm .nwhm-hero__link--m { display: block; width: 299px; max-width: 100%; height: auto; font-size: 18px; line-height: 1.5; }
	.nwhm-hero__dots { left: 45px; bottom: 19px; }

	.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-teal { padding: 60px 0; gap: 40px; }
	.nwhm-row, .nwhm-row--from { padding: 0 45px; gap: 60px; }
	.nwhm .nwhm-h2 { font-size: 48px !important; line-height: 1.15 !important; }
	.nwhm-items { width: 100%; gap: 17px; }
	.nwhm .nwhm-item { width: calc(100% - 15px); max-width: none; }
	.nwhm-items li:first-child .nwhm-item { width: calc(100% - 21px); }
	.nwhm-items li:last-child .nwhm-item::after { right: auto; width: calc(100% + 15px); max-width: none; }
	.nwhm .nwhm-item__arrow { left: calc(100% + 5px); transform: scaleX(.718); transform-origin: left center; }
	.nwhm a.nwhm-item:hover .nwhm-item__arrow { transform: translateX(10px) scaleX(.718); }
	.nwhm-wide { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 15px; }
	.nwhm-wide__img { width: 100%; aspect-ratio: 390 / 172.94; }
	.nwhm-wide__img::after { display: none; }
	.nwhm .nwhm-wide figcaption { position: static; width: calc(100% - 90px); max-width: none; text-align: left; }
	.nwhm-img { aspect-ratio: 300 / 176; }

	.nwhm-now { padding: 100px 0 5.25px; background: linear-gradient(90deg, var(--ecru) 15px, var(--ecru50) 15px); }
	.nwhm .nwhm-now__h { font-size: 40px !important; }
	.nwhm-now .amp-feat { flex-direction: column; align-items: stretch; gap: 18px; padding-bottom: 24px; margin-bottom: 24px; }
	.nwhm-now .amp-feat-img { flex: 0 0 auto; width: 100%; max-width: 100%; aspect-ratio: 340 / 191.25; }
	.nwhm-now .amp-feat-title { font-size: 28px; }
	.nwhm-now .amp-grid { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; gap: 0; }
	.nwhm-now .amp-row { gap: 14px; padding: 16px 0; }
	.nwhm-now .amp-list-thumb { flex: 0 0 90px; width: 90px; height: 50.63px; }
	.nwhm-now__all { margin-left: 0; }
	.nwhm .nwhm-br-dt { display: none; }
	/* text fills the column between the 45px Figma side margins on every phone width */
	.nwhm .nwhm-intro__h, .nwhm .nwhm-intro__p, .nwhm-row .nwhm-col-text, .nwhm-row--face .nwhm-p { max-width: none; }
	.nwhm .nwhm-wide figcaption { align-self: flex-start; margin-left: 45px; width: calc(100% - 90px); max-width: none; }
	.nwhm-now__in { max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
	.nwhm-logos__track { animation: none !important; }
	.nwhm-slide, .nwhm-slide.is-active, .nwhm-slide .nwhm-hero__copy, .nwhm-slide .nwhm-hero__co { transition: none !important; transform: none !important; }
	.nwhm-now .amp-thumb img, .nwhm-now .amp-arrow, .nwhm .nwhm-item__arrow { transition: none; }
}

/* poster picture under the clip; the clip fades in once it is really playing */
.nwhm .nwhm-poster { position: absolute; inset: 0; display: block; }
.nwhm video.nwhm-video { opacity: 0; transition: opacity .4s ease; }
.nwhm video.nwhm-video.is-playing { opacity: 1; }
/* hero video: no controls/overlays from the browser */
.nwhm video.nwhm-media::-webkit-media-controls { display: none !important; }
.nwhm video.nwhm-media { pointer-events: none; background: #000; }

/* phones: Norwest Now titles wrap naturally (forced desktop line breaks left one-word lines on wider phones) */
@media (max-width: 767px) { .nwhm-now .amp-row-title br, .nwhm-now .amp-feat-title br { display: none; } }

/* Vimeo hero slides: background player covers the hero (16:9 cover via container units), fades in once it is playing over the poster */
.nwhm-hero { container-type: size; }
.nwhm .nwhm-vimeo { position: absolute; top: 50%; left: 50%; width: max(100cqw, 177.78cqh); height: max(100cqh, 56.25cqw); transform: translate(-50%, -50%); border: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease; }
.nwhm .nwhm-vimeo.is-playing { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .nwhm .nwhm-vimeo { display: none; } }

/* ?hold=over preview: the hero stays put and the 700+ section slides up over it with a see-through dark background,
   so the photo/video stays faintly visible behind the logos during the hold. Hero text fades as it is covered. */
.nwhm.is-over .nwhm-hero { position: sticky; top: var(--nwhm-top, 95px); z-index: 0; }
html body:has(.nwhm.is-over) { overflow: clip visible !important; }
.nwhm.is-over > .nwhm-sec:not(.nwhm-hero) { position: relative; z-index: 1; }
.nwhm.is-over .nwhm-intro { background: rgba(0, 0, 0, .74); }
.nwhm.is-over .nwhm-hero__copy, .nwhm.is-over .nwhm-hero__co, .nwhm.is-over .nwhm-hero__dots { filter: opacity(var(--hero-o, 1)); }


/* v48 (Norwest 11-02): one arrow for every CTA, the same thin icon as the Norwest Now cards; 10px nudge on hover */
.nwhm .nwhm-nb { white-space: nowrap; }
.nwhm .nwhm-cta-arrow { display: inline-block; width: max(12px, .72em); height: auto; aspect-ratio: 15 / 10; margin-left: .45em; vertical-align: middle; position: relative; top: -.08em; overflow: visible; transition: transform .2s ease-in-out; }
.nwhm a:hover .nwhm-cta-arrow, .nwhm a:focus-visible .nwhm-cta-arrow { transform: translateX(10px); }
.nwhm .nwhm-intro__p a .nwhm-cta-arrow { margin-left: .4em; }
@media (prefers-reduced-motion: reduce) { .nwhm .nwhm-cta-arrow { transition: none; } }
/* v48: wide-photo caption smaller (Norwest 11-02), site small-text line height */
.nwhm .nwhm-wide figcaption { font-size: 15px; line-height: 1.5; }


/* v49 (Adam 11-02 "uneven"): the hero's right-side items mirror the left edge at every width */
@media (min-width: 1025px) { .nwhm-hero__dots { right: var(--gut); } }
@media (min-width: 768px) and (max-width: 1024px) { .nwhm-hero__co { right: 70px; } }
@media (max-width: 767px) { .nwhm-hero__copy { width: calc(100% - 90px); } }

/* v53 (Adam 11-02): Start Anywhere item text always stops 32px before the arrow (no line balancing) */
.nwhm .nwhm-item__d { padding-right: 32px; }


/* v54 (Steve Fine 11-03): Start Anywhere heading + paragraph hold 100px under the black header while the list scrolls
   (laptops only; JS adds .is-stick when the column fits). Native sticky inside the row, so the row's end pushes it up.
   The site's body overflow rule turns <body> into a scroll box, which stops sticky; same page-only fix as the logo pin. */
@media (min-width: 1025px) {
	.nwhm-row--start.is-stick .nwhm-col-text { position: sticky; top: calc(var(--nwhm-top, 95px) + 100px); align-self: flex-start; }
	html body:has(.nwhm-row--start.is-stick) { overflow: clip visible !important; }
}
/* an item with no line yet keeps the same height as the others */
.nwhm .nwhm-item__d:empty { min-height: 26px; }

/* v55 (Adam 11-05): wide-photo caption on ONE line on desktop/tablet (the two field lines joined by " | "); phones keep
   each field line on its own line(s), wrapped in balanced lines, and a name is never split (nbsp in the markup). */
.nwhm .nwhm-wide figcaption .nwhm-cap__sep { display: none; }
@media (min-width: 768px) {
	.nwhm .nwhm-wide figcaption { white-space: nowrap; max-width: none; }
	.nwhm .nwhm-wide figcaption .nwhm-cap__br { display: none; }
	.nwhm .nwhm-wide figcaption .nwhm-cap__sep { display: inline; white-space: pre; opacity: .7; }
}
@media (max-width: 767px) {
	.nwhm .nwhm-wide figcaption .nwhm-cap__l { text-wrap: balance; }
}

/* v56: phones: each caption line is its own block with balanced wrapping, so every phone width breaks the same, even way
   ("Building to Exit" Panel featuring / Vin Vacanti, CEO of YipitData / CEO Summit 2026). */
@media (max-width: 767px) {
	.nwhm .nwhm-wide figcaption .nwhm-cap__l { display: block; text-wrap: balance; }
	.nwhm .nwhm-wide figcaption .nwhm-cap__br { display: none; }
}

/* v59 (FINE 11-06, Figma 2262-10): "see all" link centred under the Norwest Insights heading (was under the cards).
   Heading -> link: 20px laptop, 15px tablet, 10px phone (FINE's values); link -> cards: the 45px the heading had. */
.nwhm .nwhm-now__h { padding-bottom: 0; }
.nwhm-now__see { padding: 20px 0 45px; text-align: center; line-height: 1; }
@media (max-width: 1024px) { .nwhm-now__see { padding-top: 15px; } }
@media (max-width: 767px) { .nwhm-now__see { padding-top: 10px; } }