/* ==========================================================================
   One-screen fit (site-wide). Rule: every section fits in one screen below the
   floating header with nothing overlapping. --hdr = bottom edge of header.osh
   (CSS fallback per breakpoint; js/fit.js sets the exact value).
   Verify with: node tools/fit-check.mjs  (1024x580, 1024x520, 1280x600, 1366x650, 1920x900)
   ========================================================================== */
:root { --hdr:84px; --fit-h:calc(100svh - var(--hdr)); }
@media (min-width:1200px) { :root { --hdr:80px; } }
@media (min-width:1600px) { :root { --hdr:122px; } }
@media (max-width:991px)  { :root { --hdr:72px; } }
html { scroll-padding-top:var(--hdr); }
main section, section[class], [data-fit-section] { scroll-margin-top:var(--hdr); }

/* --------------------------------------------------------------------------
   How It Installs: "What Deployment Looks Like" (3 phase cards)
   Desktop >=992: three columns, section = one screen below header, card art
   takes only the height that is left (never cut, never under the header).
   -------------------------------------------------------------------------- */
@media (min-width:992px) {
	html .hii-deploy { box-sizing:border-box; height:var(--fit-h); min-height:0; margin-top:0; padding-block:clamp(10px,2.2vh,28px); display:flex; flex-direction:column; }
	html .hii-deploy .hii-head { flex:none; gap:4px; }
	html .hii-deploy .hii-h2 { font-size:clamp(24px,min(2.5vw,4.6vh),44px); line-height:1.15; letter-spacing:-.5px; }
	html .hii-deploy .hii-sub { margin:0 !important; max-width:none; font-size:clamp(13px,min(1.04vw,2.4vh),18px); line-height:1.4; }
	html .hii-deploy__line { flex:none; margin:clamp(6px,1.4vh,18px) 0; height:20px; }
	html .hii-deploy__line i { width:20px; height:20px; } html .hii-deploy__line i::after { margin:3px; }
	html .hii-deploy__grid { flex:1 1 0; min-height:0; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:minmax(0,1fr); max-width:none; margin:0; gap:clamp(12px,1.25vw,24px); }
	html .hii-dcard { min-height:0; gap:clamp(4px,1vh,12px); padding-top:clamp(8px,1.4vh,16px); border-radius:24px; }
	html .hii-dcard > * { margin-inline:clamp(12px,1.1vw,20px) !important; }
	html .hii-dcard__head { flex:none; gap:10px; padding-bottom:clamp(4px,1vh,12px); }
	html .hii-dcard__icon { width:clamp(34px,min(3vw,6vh),64px); height:clamp(34px,min(3vw,6vh),64px); }
	html .hii-dcard__head > div { gap:2px; }
	html .hii-dcard .hii-pill { font-size:12px; padding:1px 10px; }
	html .hii-dcard__title { font-size:clamp(16px,min(1.5vw,3.2vh),28px); line-height:1.25; }
	html .hii-dcard__label { flex:none; font-size:clamp(13px,min(1.1vw,2.4vh),20px); line-height:1.3; margin-block:0 !important; }
	html .hii-dcard .hii-checks { flex:none; gap:clamp(1px,.5vh,8px); margin-block:0 !important; }
	html .hii-dcard .hii-checks + .hii-dcard__label { margin-top:clamp(2px,.8vh,10px) !important; }
	html .hii-checks li { gap:6px; font-size:clamp(12.5px,min(1.04vw,2.25vh),18px); line-height:1.3; }
	html .hii-checks img { width:clamp(16px,min(1.5vw,3vh),28px); height:clamp(16px,min(1.5vw,3vh),28px); margin-top:0; }
	html .hii-dcard__art { flex:1 1 0; min-height:0; padding:0; margin:0 !important; display:flex; justify-content:center; align-items:flex-end; }
	html .hii-deploy .hii-dcard__art img { width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain; margin-inline:auto; }
	html .hii-deploy .hii-note { flex:none; margin-top:clamp(6px,1.2vh,20px); }
	html .hii-note p { font-size:clamp(12.5px,min(1.04vw,2.2vh),18px); }
	html .hii-note img { width:clamp(26px,4.5vh,44px); height:clamp(26px,4.5vh,44px); padding:6px; }
}
/* very short windows: decorative progress line goes, art keeps the rest */
@media (min-width:992px) and (max-height:560px) {
	html .hii-deploy__line { display:none; }
	html .hii-deploy .hii-head { margin-bottom:8px; }
}

/* --------------------------------------------------------------------------
   How It Installs: other sections. 992-1199 used to fall back to the stacked
   tablet layout (sections 1000-2500px tall); keep the desktop layout instead
   and use the compact laptop type scale for every short or narrow desktop.
   -------------------------------------------------------------------------- */
@media (min-width:992px) and (max-width:1199px) {
	html .hii-hero { margin-top:-96px; padding-top:calc(96px + 12px); padding-bottom:24px; }
	html .hii-hero__in { flex-direction:row; align-items:center; }
	html .hii-hero__text { width:min(470px,48%); max-width:none; }
	html .hii-hero__bg { background-size:calc(100% + 12vw) auto; background-position:left top; }
	html .hii-steps__phases { display:grid; }
	html .hii-steps__list { grid-template-columns:repeat(7,1fr); row-gap:0; margin-top:12px !important; }
	html .hii-step:nth-child(5)::before, html .hii-step:nth-child(5)::after { display:block; }
	html .hii-journey { grid-template-columns:230px minmax(0,1fr); }
	html .hii-jnav { position:sticky; }
	html .hii-plan { grid-template-columns:minmax(0,5fr) minmax(0,6fr); }
	html .hii-plan__art { display:none; }
}
@media (min-width:992px) and (max-width:1599px), (min-width:992px) and (max-height:1000px) {
	/* hero */
	html .hii-kicker { font-size:14px; padding:3px 12px; }
	html .hii-hero__h1 { margin-top:8px !important; font-size:clamp(30px,min(2.7vw,6vh),56px); line-height:1.12; }
	html .hii-hero__lead, html .hii-hero__bold { font-size:clamp(13px,min(1.04vw,2.3vh),18px); line-height:1.5; }
	html .hii-hero__lead { margin-top:10px !important; } html .hii-hero__bold { margin-top:6px !important; }
	html .hii-benefits { margin-top:12px !important; padding:4px; }
	html .hii-benefits li { padding:4px 8px; font-size:12px; line-height:1.35; }
	html .hii-benefits img { width:32px; height:32px; padding:4px; }
	html .hii-hero__devices { width:auto; max-width:46%; max-height:calc(100svh - var(--hdr) - 56px); align-self:center; margin:0; }
	/* after deployment: 6 cards in one row */
	html .hii-after { margin-top:clamp(40px,6vh,72px); }
	html .hii-after .hii-head { gap:6px; }
	html .hii-after .hii-h2 { font-size:clamp(26px,min(2.4vw,5vh),40px); line-height:1.2; }
	html .hii-after .hii-sub { font-size:clamp(13px,min(1.04vw,2.3vh),17px); line-height:1.45; }
	html .hii-after__band { zoom:1; margin-top:clamp(8px,2vh,24px); padding:clamp(8px,2vh,24px) 0; }
	html .hii-after__grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
	html .hii-after .hii-acard { gap:6px; padding:10px 8px; border-radius:20px; }
	html .hii-after .hii-acard h3 { min-height:0; font-size:clamp(13px,1.1vw,17px); line-height:1.3; }
	html .hii-after .hii-acard__icon { width:clamp(32px,5vh,48px); height:clamp(32px,5vh,48px); }
	html .hii-after .hii-acard > i { margin-block:2px; width:48px; height:3px; }
	html .hii-after .hii-acard p { font-size:12.5px; line-height:1.4; }
	html .hii-after .hii-setit { margin-top:clamp(8px,2vh,24px); padding-block:8px; flex-wrap:nowrap; }
	html .hii-setit__icon { width:clamp(40px,6vh,64px); height:clamp(40px,6vh,64px); }
	html .hii-setit__text { padding-left:20px; border-left:1px solid var(--line); flex-basis:auto; }
	html .hii-setit__text h3 { font-size:clamp(15px,min(1.3vw,2.8vh),22px); line-height:1.3; }
	html .hii-setit__text p { margin-top:2px !important; font-size:clamp(12.5px,min(1vw,2.2vh),17px); line-height:1.45; }
	html .hii-setit__art { width:auto; max-width:22%; max-height:clamp(60px,14vh,140px); margin:0; }
	/* plan your facility setup */
	html .hii-plan { margin-top:clamp(40px,6vh,72px); margin-bottom:clamp(40px,6vh,72px); align-items:center; }
	html .hii-plan__h2 { margin-top:8px !important; font-size:clamp(30px,min(2.7vw,6vh),52px); line-height:1.12; }
	html .hii-plan__lead { margin-top:clamp(8px,2vh,24px) !important; font-size:clamp(13px,min(1.04vw,2.3vh),18px); }
	html .hii-plan__p { margin-top:6px !important; font-size:clamp(13px,min(1.04vw,2.3vh),18px); line-height:1.5; }
	html .hii-plan .hii-btn--blue { margin-top:clamp(10px,2.4vh,32px); }
	html .hii-plan__ben { margin-top:clamp(10px,2.4vh,28px) !important; }
	html .hii-plan__ben li { font-size:12.5px; line-height:1.35; gap:8px; }
	html .hii-plan__card { zoom:1; padding:clamp(10px,1.8vh,24px); gap:clamp(6px,1.4vh,18px); border-radius:28px; }
	html .hii-flow__icon { width:clamp(36px,6vh,64px); height:clamp(36px,6vh,64px); }
	html .hii-flow li { gap:4px; font-size:12px; line-height:1.3; }
	html .hii-flow li + li::before { top:calc(clamp(36px,6vh,64px) / 2); left:calc(-50% + clamp(36px,6vh,64px) / 2 + 8px); right:calc(50% + clamp(36px,6vh,64px) / 2 + 8px); }
	html .hii-flow b { width:22px; height:22px; font-size:12px; }
	html .hii-pane { padding:clamp(8px,1.4vh,16px); border-radius:18px; }
	html .hii-pane h3 { font-size:clamp(13px,min(1.04vw,2.3vh),18px); }
	html .hii-pane > p { margin-top:2px !important; font-size:12px; line-height:1.4; }
	html .hii-plan .hii-photos { margin-top:6px !important; gap:8px; }
	html .hii-plan .hii-photos li { padding:5px; }
	html .hii-plan .hii-photos li > img { max-height:clamp(40px,9vh,110px); width:100%; }
	html .hii-plan .hii-photos span { margin-top:3px; font-size:12px; }
	html .hii-plan .hii-rec { margin-top:6px; }
	html .hii-plan .hii-rec__kit { max-height:clamp(70px,17vh,180px); width:auto; }
	html .hii-plan .hii-rec ul { gap:6px; }
	html .hii-plan .hii-rec li { font-size:12px; gap:8px; }
	html .hii-plan .hii-rec li span { width:26px; height:26px; }
	html .hii-plan__done { padding:4px 12px; font-size:clamp(12.5px,min(1vw,2.2vh),17px); line-height:1.4; }
	html .hii-plan__done img { width:22px; }
}

/* HII fine-tuning for short windows (<=700px tall) */
@media (min-width:992px) and (max-width:1199px) {
	html .hii-hero__text { width:44%; }
	html .hii-hero__devices { max-width:50%; }
}
@media (min-width:992px) and (max-height:1000px) {
	html .hii-setit__art { max-height:clamp(48px,10vh,120px); }
}
@media (min-width:992px) and (max-height:700px) {
	html .hii-jnav { gap:2px; }
	html .hii-jnav__btn { padding-block:2px; }
	html .hii-jnav__phase { margin-top:0; }
	html .hii-jnav__hint { padding:6px 10px; margin-top:2px; }
	html .hii-jnav__hint > span { width:30px; height:30px; }
	html .hii-jnav__hint p { font-size:12px; line-height:1.35; }
	html .hii-jpanel { gap:8px; }
	html .hii-jpanel__text { font-size:14px; line-height:1.5; }
	html .hii-fcard p { font-size:13.5px; line-height:1.45; }
	html .hii-after .hii-acard p { line-height:1.3; }
	html .hii-plan .hii-photos li > img { max-height:clamp(34px,7vh,80px); }
	html .hii-plan .hii-rec__kit { max-height:clamp(60px,14vh,140px); }
	html .hii-plan .hii-rec ul { gap:3px; }
}
@media (min-width:992px) and (max-height:700px) {
	html .hii-after { margin-top:24px; }
	html .hii-after .hii-h2 br { display:none; }
	html .hii-after .hii-h2 .hii-blue3 { margin-left:.25em; }
	html .hii-after .hii-rule { display:none; }
	html .hii-after__band { margin-top:6px; padding-block:6px; }
	html .hii-after .hii-setit { margin-top:6px; padding-block:4px; }
	html .hii-plan__card { gap:6px; padding:10px 12px; }
	html .hii-flow__icon { width:clamp(32px,5vh,48px); height:clamp(32px,5vh,48px); }
	html .hii-flow li + li::before { top:calc(clamp(32px,5vh,48px) / 2); }
	html .hii-plan .hii-photos li > img { max-height:clamp(30px,6vh,70px); }
}
@media (min-width:992px) and (max-height:560px) {
	html .hii-after { margin-top:12px; }
	html .hii-after .hii-h2 { font-size:24px; }
	html .hii-after .hii-acard { gap:3px; padding-block:6px; }
	html .hii-after .hii-acard__icon { width:28px; height:28px; }
	html .hii-after .hii-acard p { font-size:12px; }
	html .hii-setit__art { max-height:40px; }
	html .hii-setit__icon { width:34px; height:34px; }
	html .hii-plan { margin-block:16px; }
	html .hii-plan__card { gap:4px; padding:8px 10px; }
	html .hii-flow li { font-size:12px; line-height:1.2; }
	html .hii-flow b { width:18px; height:18px; font-size:11px; }
	html .hii-pane { padding:6px 8px; }
	html .hii-plan .hii-photos li > img { max-height:26px; }
	html .hii-plan .hii-photos li { padding:3px; }
	html .hii-plan .hii-rec__kit { max-height:56px; }
	html .hii-plan .hii-rec li span { width:20px; height:20px; }
	html .hii-plan__done { padding:2px 10px; }
}
@media (min-width:992px) and (max-width:1199px) {
	html .hii-hero__bg { background-size:auto 100%; background-position:right -60px top; }
}
@media (min-width:992px) and (max-height:560px) {
	html .hii-flow__icon { width:30px; height:30px; }
	html .hii-flow li + li::before { top:15px; }
}

/* --------------------------------------------------------------------------
   Home (/): height-aware type + stage caps so each .hp-sec fits below header
   -------------------------------------------------------------------------- */
@media (min-width:992px) and (max-height:1000px) {
	html .hp { --hp-h1:clamp(28px,min(3.2vw,6.4vh),56px); --hp-h2:clamp(24px,min(2.6vw,5.2vh),44px); --hp-h4:clamp(16px,min(1.5vw,3vh),24px); --hp-text:clamp(13px,2.5vh,16px); --hp-lead:clamp(14px,2.7vh,18px); --hp-gap:clamp(20px,5vh,85px); }
	html .hp-sec { min-height:0; }
	html .hp-hero__copy { gap:clamp(8px,2vh,24px); }
	html .hp-hero__stage { max-width:min(100%, calc((100svh - var(--hdr) - 40px) * 1.25)); }
	html .hp-chips { grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; margin-top:0; }
	html .hp-chip { padding:4px 5px; gap:2px; font-size:12px; line-height:1.3; }
	html .hp-chip .hp-badge { width:24px; height:24px; } html .hp-chip .hp-badge img { width:14px; }
	html .hp-bill__copy { gap:clamp(8px,2vh,24px); }
	html .hp-bill__bld { height:clamp(90px,16vh,300px); }
	html .hp-panel__stage { max-width:min(100%, calc((100svh - var(--hdr) - 60px) * 1055 / 822)); }
	html .hp-rw__stage { max-width:min(100%, calc((100svh - var(--hdr) - 60px) * 1163 / 916)); }
	html .hp-proven__stage { max-width:min(100%, calc((100svh - var(--hdr) - 160px) * 975 / 571)); }
	html .hp-split__copy, html .hp-proven__copy, html .hp-barriers__copy { gap:clamp(8px,1.8vh,20px); }
	html .hp-callout { padding:clamp(8px,1.6vh,24px) clamp(12px,1.6vw,32px); gap:14px; border-radius:20px; }
	html .hp-callout__ic { width:clamp(36px,6vh,64px); height:clamp(36px,6vh,64px); }
	html .hp-banner { margin-top:clamp(10px,2.4vh,32px); padding:clamp(8px,1.6vh,20px) 24px; gap:16px; }
	html .hp-banner__ic { width:clamp(40px,7vh,80px); height:clamp(40px,7vh,80px); }
	html .hp-banner__tx { gap:4px; }
	html .hp-feats li { padding:clamp(6px,1.4vh,16px) 8px; gap:6px; }
	html .hp-set { margin-top:clamp(8px,2vh,24px); padding:clamp(6px,1.2vh,16px) 24px; }
}
@media (min-width:992px) and (max-width:1199px) {
	html .hp-barriers__row { grid-template-columns:minmax(0,30%) minmax(0,1fr); gap:24px; }
}
@media (min-width:992px) and (max-height:1000px) {
	html .hp-rw .hp-steps--flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; padding:4px; }
	html .hp-rw .hp-steps--flow .hp-steps__i { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:2px 6px; padding:4px 6px; }
	html .hp-rw .hp-steps--flow .hp-steps__i > :nth-child(n+3) { grid-column:1 / -1; }
	html .hp-rw .hp-steps--flow .hp-steps__t { font-size:13.5px; line-height:1.25; }
	html .hp-rw .hp-steps--flow .hp-steps__s { font-size:12px; line-height:1.35; }
	html .hp-rw .hp-steps--flow .hp-steps__ic { width:24px; height:24px; }
	html .hp-set__top { flex-wrap:nowrap; }
	html .hp-set__vr { display:block; }
	html .hp-set__art { transform:scale(.6); transform-origin:right center; margin-block:-24px; }
	html .hp-set__pills li { height:48px; } html .hp-set__pills li > img, html .hp-xbadge, html .hp-xbadge__x { width:40px; height:40px; }
}
@media (min-width:992px) and (max-width:1199px) {
	html .hp-hero__grid { grid-template-columns:minmax(0,56%) minmax(0,1fr); gap:20px; }
	html .hp-hero__actions { flex-wrap:nowrap; }
}
@media (min-width:992px) and (max-height:600px) {
	html .hp-hero .hp-body { margin-top:-4px; }
	html .hp-btn { min-height:44px; } html .hp-btn__ic { width:34px; height:34px; } html .hp-btn--ghost { min-height:44px; }
}

/* --------------------------------------------------------------------------
   Shared CTA "See How Much Energy You're Losing" (.cs-cta: home, case studies)
   >=992: copy left, report right (it used to stack below 1200 => 1500px tall)
   (not on /platform-preview/ = body.pf-body: owned by another worker)
   -------------------------------------------------------------------------- */
@media (min-width:992px) {
	html body:is(.pf-body,:not(.pf-body)) .cs-cta-wrap { padding-top:clamp(12px,3vh,48px) !important; padding-bottom:clamp(12px,3vh,48px) !important; margin-top:0 !important; margin-bottom:0 !important; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta { flex-direction:row; align-items:center; min-height:0 !important; gap:clamp(16px,2vw,40px); padding:clamp(16px,3.4vh,56px) clamp(24px,3.4vw,64px) !important; max-height:calc(100svh - var(--hdr) - 24px); }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__content { flex:1 1 56%; width:auto; gap:clamp(8px,2.2vh,32px) !important; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__title { font-size:clamp(24px,min(2.7vw,5.2vh),48px) !important; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__lead, html body:is(.pf-body,:not(.pf-body)) .cs-cta__note { font-size:clamp(13px,min(1.1vw,2.5vh),18px) !important; line-height:1.5 !important; margin:0 !important; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__features { gap:8px; flex-wrap:nowrap; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__features li { font-size:clamp(12.5px,min(1vw,2.3vh),16px); gap:6px; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__icon { padding:clamp(6px,1.4vh,16px); }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__btn { height:clamp(44px,8vh,64px); font-size:clamp(14px,1.2vw,18px); }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__btn-icon { width:clamp(34px,6vh,52px); height:clamp(34px,6vh,52px); }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__media { position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; transform:none !important; flex:0 1 40%; width:auto !important; max-width:40%; margin:clamp(40px,10vh,110px) 0 0 !important; align-self:center; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__report { display:block; width:100% !important; height:auto; max-height:calc(100svh - var(--hdr) - clamp(80px,22vh,220px)); object-fit:contain; object-position:center top; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__alert { left:-24px !important; right:auto !important; top:clamp(-110px,-10vh,-40px) !important; transform:none !important; max-width:min(340px,100%); padding:clamp(6px,1.2vh,14px) !important; gap:6px !important; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__alert-head { font-size:clamp(13px,1.2vw,18px); gap:8px; }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__alert-icon { padding:clamp(5px,1vh,12px); }
	html body:is(.pf-body,:not(.pf-body)) .cs-cta__alert p { font-size:clamp(12.5px,min(1vw,2.2vh),16px) !important; line-height:1.4 !important; padding:0 6px; }
}

/* Home hero on short/narrow desktops: the 5 benefit chips run full width under copy + stage */
@media (min-width:992px) and (max-width:1199px), (min-width:992px) and (max-height:700px) {
	html .hp-hero__grid { grid-template-columns:minmax(0,52%) minmax(0,1fr); grid-auto-flow:row; row-gap:clamp(6px,1.6vh,16px); align-items:start; }
	html .hp-hero__copy { display:contents; }
	html .hp-hero__copy > * { grid-column:1; margin-top:0 !important; }
	html .hp-hero__stage { grid-column:2; grid-row:1 / span 4; align-self:center; }
	html .hp-hero__copy > .hp-chips { grid-column:1 / -1; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }
	html .hp-chip { flex-direction:row; align-items:center; gap:8px; padding:6px 8px; font-size:12.5px; }
	html .hp-chip .hp-badge { flex:none; width:30px; height:30px; } html .hp-chip .hp-badge img { width:18px; }
}
@media (min-width:992px) and (max-width:1199px), (min-width:992px) and (max-height:700px) {
	html .hp-hero__grid { align-content:center; }
	html .hp-chip { display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:8px; row-gap:0; align-items:center; line-height:1.3; }
	html .hp-chip .hp-badge { grid-row:1 / span 2; }
	html .hp-chip > :not(.hp-badge) { grid-column:2; }
}
@media (min-width:992px) and (max-height:700px) {
	html .hp-rw .hp-callout__t, html .hp-rw .hp-callout__s { font-size:14px; line-height:1.45; }
	html .hp-rw .hp-split__copy { gap:8px; }
	html .hp-rw .hp-steps--flow .hp-steps__s { line-height:1.3; }
}
@media (min-width:992px) and (max-height:560px) {
	html .hp-rw .hp-callout { padding:6px 12px; }
	html .hp-rw .hp-callout__ic { width:30px; height:30px; }
	html .hp-rw .hp-callout__t, html .hp-rw .hp-callout__s { font-size:13px; line-height:1.35; }
	html .hp-rw .hp-steps--flow .hp-num { width:20px; height:20px; font-size:12px; }
	html .hp-rw .hp-steps--flow .hp-steps__ic { width:20px; height:20px; }
	html .hp-hero .hp-h1 { font-size:28px; }
}
@media (min-width:992px) and (max-width:1199px), (min-width:992px) and (max-height:700px) {
	html .hp-hero__stage { max-width:min(100%, calc((100svh - var(--hdr) - 150px) * 1.3)); }
}

/* --------------------------------------------------------------------------
   How It Works preview: .hiw uses its own --hd; tie it to --hdr. 992-1199 keeps
   the 4-step and 6-node rows (they used to wrap into 2-3 rows).
   -------------------------------------------------------------------------- */
html .hiw { --hd:var(--hdr); }
@media (min-width:992px) {
	html .hiw-fold { min-height:calc(100svh - var(--hdr)); }
}
@media (min-width:992px) and (max-width:1199px) {
	html .hiw-steps__grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:16px !important; }
	html .hiw-step { padding:14px 14px 16px; border-radius:20px; }
	html .hiw-step img { width:40px; height:40px; margin-bottom:8px; }
	html .hiw-step h3 { font-size:17px; min-height:0; }
	html .hiw-step p { font-size:13.5px; line-height:1.5; }
	html .hiw-flow { grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin-top:16px !important; }
	html .hiw-node { padding:12px 8px 14px; border-radius:18px; }
	html .hiw-node img { width:clamp(56px,12vh,96px); height:clamp(56px,12vh,96px); margin-bottom:6px; }
	html .hiw-node h3 { font-size:15px; margin:4px 0 2px; }
	html .hiw-node p { font-size:12.5px; line-height:1.4; }
}
@media (min-width:992px) and (max-height:700px) {
	html .hiw-sec { padding-block:16px; }
	html .hiw-cta__box { padding:20px 32px; gap:24px; }
	html .hiw-cta .hiw-h2 { font-size:clamp(24px,5vh,34px); margin-bottom:8px; }
	html .hiw-small { margin-top:6px !important; }
	html .hiw .hiw-cta__tab { height:min(440px, calc(100svh - var(--hdr) - 90px)); }
}

/* --------------------------------------------------------------------------
   Energy Intelligence preview
   -------------------------------------------------------------------------- */
@media (min-width:992px) {
	html .eip-sec { padding-top:6px; }
	html .eip-hero__art img { max-height:calc(100svh - var(--hdr) - 32px); }
	html .eip .eip-cta__tab { height:min(440px, calc(100svh - var(--hdr) - 100px)); }
}
@media (min-width:992px) and (max-height:1000px), (min-width:992px) and (max-width:1199px) {
	html .eip { --h1:clamp(30px,min(3.2vw,6.4vh),56px); --h2:clamp(24px,min(2.6vw,5vh),44px); --gap:clamp(32px,7vh,96px); }
	html .eip-h1 { margin:6px 0; }
	html .eip-hero { padding-top:8px; }
	html .eip-hero__text > p { font-size:clamp(13.5px,2.5vh,16px); line-height:1.5; }
	html .eip-callout { margin-top:8px; padding:8px 14px; }
	html .eip-callout h3 { font-size:15px; margin-bottom:2px; } html .eip-callout p { font-size:13px; line-height:1.45; }
	html .eip-callout img { width:30px; }
	html .eip-feats { margin-top:8px !important; gap:8px; }
	html .eip-feats li { grid-template-columns:30px 1fr; column-gap:6px; } html .eip-feats img { width:30px; }
	html .eip-feats b { font-size:12.5px; } html .eip-feats small { font-size:12px; line-height:1.3; }
	/* steps: keep 4 cards in a row */
	html .eip-steps { padding-block:12px; }
	html .eip-steps .eip-sub, html .eip-loss .eip-sub, html .eip-view .eip-sub { margin-top:4px; font-size:14px; line-height:1.45; }
	html .eip-head .eip-eyebrow { margin-bottom:6px; padding-block:3px; font-size:13px; }
	html .eip-steps .eip-steps__grid { grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:10px !important; gap:10px; zoom:1; }
	html .eip-steps .eip-power { zoom:1; margin-top:10px; gap:20px; }
	html .eip-steps .eip-power p { font-size:13px; line-height:1.4; } html .eip-steps .eip-power b { font-size:14px; } html .eip-steps .eip-power img { width:32px; }
	html .eip-steps .eip-step { padding:8px 10px 10px; border-radius:20px; }
	html .eip-steps .eip-step__head { max-height:clamp(36px,7vh,64px); width:auto; margin-bottom:2px; }
	html .eip-steps .eip-step h3 { min-height:0; font-size:14.5px; }
	html .eip-steps .eip-step__rule { margin:4px auto; }
	html .eip-steps .eip-step > p { font-size:12.5px; line-height:1.4; }
	html .eip-steps .eip-list { margin-top:6px !important; gap:3px; }
	html .eip-steps .eip-list b { font-size:12.5px; } html .eip-steps .eip-list small { font-size:12px; line-height:1.3; }
	html .eip-steps .eip-list img { width:18px; height:18px; }
	html .eip-steps .eip-step__card { max-height:clamp(50px,12vh,118px); width:auto; margin:6px auto 0; }
	/* complete view */
	html .eip-view .eip-cv { margin-top:8px !important; gap:8px; }
	html .eip-view .eip-cv__card { grid-template-columns:auto 34px 1fr; grid-template-rows:auto; column-gap:8px; padding:6px 12px; border-radius:16px; }
	html .eip-view .eip-cv__n { grid-column:1; grid-row:1; width:26px; height:26px; font-size:12px; }
	html .eip-view .eip-cv__ic { grid-column:2; grid-row:1; width:34px; }
	html .eip-view .eip-cv__t { grid-column:3; grid-row:1; font-size:13.5px; padding-right:30px; }
	html .eip-view .eip-cv__dots { top:10px; right:10px; width:24px !important; }
	html .eip-view .eip-cv__deco { width:30px; }
	html .eip-view .eip-cv__body { margin-top:8px; gap:8px; }
	html .eip-view .eip-cv__media { padding:6px 10px; }
	html .eip-view .eip-cv__media img { max-height:calc(100svh - var(--hdr) - 220px); }
	html .eip-view .eip-cv__side { padding:10px 14px; }
	html .eip-view .eip-cv__side h3 { font-size:16px; margin-bottom:4px; }
	html .eip-view .eip-cv__side > p { font-size:12.5px; line-height:1.4; }
	html .eip-view .eip-cv__side .eip-list { margin-top:6px !important; gap:4px; }
	html .eip-view .eip-cv__side .eip-list b { font-size:12.5px; } html .eip-view .eip-cv__side .eip-list small { font-size:12px; line-height:1.3; }
	html .eip-view .eip-cv__side .eip-list img { width:20px; height:20px; padding:3px; }
	/* equipment */
	html .eip-eq .eip-h2 { margin:8px 0 6px; }
	html .eip-note { padding:10px 14px; margin-top:8px; font-size:13.5px; line-height:1.45; } html .eip-note p + p { margin-top:6px; }
	html .eip-eq__title { font-size:17px; margin-bottom:8px; }
	html .eip-eq__cards { gap:8px; } html .eip-eq__cards li { padding:10px 12px; border-radius:18px; }
	html .eip-eq__cards h4 { font-size:15px; margin-bottom:4px; } html .eip-eq__cards h4 img { width:26px; }
	html .eip-eq__cards p { font-size:12.5px; line-height:1.45; }
	html .eip-eq__grid { gap:24px; }
	/* stories */
	html .eip-story__grid { gap:28px; }
	html .eip-story__media { min-height:0; max-height:calc(100svh - var(--hdr) - 24px); padding:16px; }
	html .eip-story__text .eip-pill { margin:8px 0; }
	html .eip-quote { padding:8px 16px; font-size:14px; margin-bottom:8px; }
	html .eip-story__text p { font-size:14px; line-height:1.5; } html .eip-story__text p + p { margin-top:8px; }
	/* cta */
	html .eip-cta__box { padding:20px 32px; gap:24px; }
	html .eip-cta .eip-h2 { font-size:clamp(24px,5vh,36px); margin-bottom:8px; }
	html .eip-feat { gap:14px; margin:10px 0 12px !important; } html .eip-feat img { width:34px; height:34px; } html .eip-feat li { font-size:13.5px; }
	html .eip-small { margin-top:6px !important; }
	html .eip-btn { padding:10px 20px; }
}
@media (min-width:992px) and (max-width:1199px) {
	html .eip-loss__grid { grid-template-columns:200px minmax(0,1fr); column-gap:20px; }
	html .eip-tabs { grid-auto-flow:row; grid-auto-columns:auto; overflow:visible; }
	html .eip-tabs button { white-space:normal; padding:5px 8px; font-size:13px; gap:8px; }
	html .eip-tabs i { width:24px; height:24px; font-size:11px; } html .eip-tabs img { width:20px; height:20px; }
}
/* "See Where Energy Is Being Lost" slider: its illustration stage is JS-scaled from width, so the
   whole block is scaled as a unit by height (same technique as the 1366 rule) and the freed height reclaimed. */
html .eip-loss { --lossH:612px; --k:1; }
@media (min-width:992px) and (max-width:1199px) { html .eip-loss { --lossH:59.3vw; } }
@media (min-width:1600px) { html .eip-loss { --lossH:753px; } }
@media (min-width:992px) and (max-height:1000px) {
	html .eip-loss { --k:.86; }
	html .eip-loss .eip-wrap { display:flow-root; }
	html .eip-loss .eip-loss__grid { zoom:1; margin-top:10px !important; transform:scale(var(--k)); transform-origin:50% 0; margin-bottom:calc((var(--k) - 1) * var(--lossH)); }
}
@media (min-width:992px) and (max-height:700px) { html .eip-loss { --k:.74; } }
@media (min-width:992px) and (max-height:620px) { html .eip-loss { --k:.65; } }
@media (min-width:992px) and (max-height:590px) { html .eip-loss { --k:.61; } }
@media (min-width:992px) and (max-height:540px) { html .eip-loss { --k:.53; } }
@media (min-width:1600px) and (max-height:1000px) {
	html .eip-view .eip-cv__media img { max-height:calc(100svh - var(--hdr) - 330px); }
}
@media (min-width:992px) and (max-height:700px) {
	html .eip-steps .eip-power { margin-top:6px; }
	html .eip-steps .eip-power p { font-size:12.5px; line-height:1.35; }
	html .eip-steps .eip-step__card { max-height:clamp(40px,9vh,90px); }
	html .eip-steps .eip-h2 { font-size:clamp(24px,4.6vh,32px); }
}
@media (min-width:992px) and (max-height:560px) {
	html .eip-hero__text > p { font-size:13px; line-height:1.4; }
	html .eip-h1 { font-size:28px; }
	html .eip-hero .eip-eyebrow { padding-block:2px; }
	html .eip-steps .eip-step__card { display:block; max-height:40px; }
	html .eip-steps .eip-step__head { max-height:30px; }
	html .eip-view .eip-cv__media img { max-height:calc(100svh - var(--hdr) - 200px); }
	html .eip-view .eip-cv__side .eip-list small { line-height:1.25; }
	html .eip-view .eip-h2 { font-size:24px; }
	html .hiw-sec { padding-block:8px; }
	html .hiw .hiw-h2 { font-size:26px; }
	html .hiw-step p { line-height:1.4; }
}
@media (min-width:992px) and (max-height:700px) {
	html .eip-steps { padding-block:6px; }
	html .eip-steps .eip-steps__grid { margin-top:6px !important; }
	html .eip-steps .eip-step h3 { font-size:13.5px; line-height:1.25; }
	html .eip-steps .eip-step > p { font-size:12px; line-height:1.35; }
	html .eip-steps .eip-list { gap:2px; margin-top:4px !important; }
	html .eip-steps .eip-list small { line-height:1.25; margin-top:0; }
	html .eip-steps .eip-power img { width:26px; }
	html .eip-steps .eip-power b { font-size:13px; margin-bottom:0; }
}
@media (min-width:992px) and (max-height:560px) {
	html .eip-steps .eip-h2 { font-size:22px; }
	html .eip-steps .eip-sub { font-size:12.5px; }
	html .eip-steps .eip-step__head { max-height:24px; }
	html .eip-steps .eip-step__rule { margin:2px auto; }
	html .eip-steps .eip-step__card { max-height:32px; margin-top:2px; }
	html .eip-steps .eip-power p { font-size:12px; line-height:1.3; }
	html .eip-hero__text .eip-callout { margin-top:4px; }
	html .eip-feats { margin-top:4px !important; }
	html .eip-view .eip-cv__media img { max-height:calc(100svh - var(--hdr) - 215px); }
	html .eip-view .eip-cv__side { padding:6px 10px; }
	html .eip-view .eip-cv__side > p { line-height:1.3; }
	html .eip-view .eip-sub { font-size:12.5px; }
	html .hiw-fold .hiw-lead, html .hiw-fold p { line-height:1.45; }
	html .hiw-steps__grid { margin-top:8px !important; }
	html .hiw-btn { padding-block:10px; }
}
@media (min-width:992px) and (max-height:560px) {
	html .eip-steps .eip-power p { line-height:1.25; }
	html .eip-steps .eip-list b, html .eip-steps .eip-list small { line-height:1.2; }
	html .eip-steps .eip-step > p { line-height:1.3; }
	html .eip-steps .eip-head .eip-eyebrow { margin-bottom:2px; }
}
@media (min-width:992px) and (max-height:560px) {
	html .eip-steps { padding-top:2px; }
	html .eip-steps .eip-power { margin-top:2px; }
	html .eip-steps .eip-sub { margin-top:2px; }
}

/* Legacy templates (monitoring-hardware, about pages): report CTA image capped to the screen below the header */
@media (min-width:992px) {
	html .section-4 img.img-fluid, html .box_color img.w-100 { max-height:calc(100svh - var(--hdr) - 80px); width:auto !important; max-width:100%; object-fit:contain; margin-inline:auto; display:block; }
}
@media (min-width:992px) and (max-height:560px) {
	html .eip-steps .eip-step h3 { line-height:1.15; }
	html .eip-steps .eip-steps__grid { gap:8px; margin-top:4px !important; }
}

/* --------------------------------------------------------------------------
   Breathing room (How It Installs "What Deployment Looks Like"): soft
   borderless surfaces, more inner padding and gaps, no header divider,
   looser lists, smaller centred art, quieter footer note. Still one screen.
   -------------------------------------------------------------------------- */
@media (min-width:992px) {
	html body .hii-deploy { padding-block:clamp(14px,3.2vh,40px) clamp(10px,2.4vh,32px); }
	html body .hii-deploy .hii-head { gap:clamp(4px,.9vh,10px); margin-bottom:clamp(10px,2.4vh,36px); }
	html body .hii-deploy .hii-sub { color:#5b6573; }
	html body .hii-deploy__grid { gap:clamp(18px,2vw,40px); }
	html body .hii-dcard { border:1px solid rgba(15,23,42,.06); background:linear-gradient(180deg,#fafbfd 0%,#fff 100%); box-shadow:0 1px 2px rgba(15,23,42,.03),0 12px 32px -18px rgba(15,23,42,.12); border-radius:clamp(20px,1.6vw,28px); gap:clamp(6px,1.5vh,16px); padding-top:clamp(12px,2.3vh,32px); padding-bottom:clamp(10px,2vh,24px); }
	html body .hii-dcard > * { margin-inline:clamp(16px,1.6vw,36px) !important; }
	html body .hii-dcard__head { border-bottom:0; padding-bottom:0; gap:clamp(10px,1vw,16px); margin-bottom:clamp(0px,.5vh,10px); }
	html body .hii-dcard__head > div { gap:clamp(4px,.8vh,8px); }
	html body .hii-dcard .hii-pill { font-size:11px; letter-spacing:.4px; padding:2px 10px; align-self:flex-start; }
	html body .hii-dcard__label { color:#5b6573; font-weight:500; }
	html body .hii-dcard .hii-checks { gap:clamp(2px,.6vh,12px); }
	html body .hii-dcard .hii-checks + .hii-dcard__label { margin-top:clamp(4px,1.4vh,16px) !important; }
	html body .hii-checks li { gap:8px; line-height:1.34; }
	html body .hii-checks img { margin-top:.1em; }
	html body .hii-dcard__art { padding-top:clamp(4px,1.2vh,16px) !important; align-items:center; }
	html body .hii-deploy .hii-dcard__art img { max-width:86%; max-height:100%; }
	html body .hii-deploy .hii-note { margin-top:clamp(10px,2.2vh,28px); gap:clamp(16px,3vw,56px); opacity:.8; }
	html body .hii-note p { font-size:clamp(12px,min(.9vw,2vh),16px); color:#5b6573; }
	html body .hii-note img { width:clamp(22px,3.6vh,36px); height:clamp(22px,3.6vh,36px); padding:5px; }
}
@media (min-width:992px) and (max-height:700px) {
	html body .hii-deploy__line { display:none; }
}

/* Breathing room (Energy Intelligence "Understands Your Facility" steps): soft hairline cards, wider gaps, quieter footer */
@media (min-width:992px) {
	html body .eip-steps .eip-steps__grid { gap:clamp(14px,1.6vw,32px); margin-top:clamp(12px,2.4vh,32px) !important; }
	html body .eip-steps .eip-step { border:1px solid rgba(15,23,42,.06); background:linear-gradient(180deg,#fafbfd 0%,#fff 100%); box-shadow:0 1px 2px rgba(15,23,42,.03),0 12px 32px -18px rgba(15,23,42,.12); padding:clamp(8px,1.6vh,24px) clamp(12px,1.2vw,24px) clamp(10px,1.8vh,24px); }
	html body .eip-steps .eip-power { margin-top:clamp(10px,2vh,28px); }
	html body .eip-steps .eip-power p { color:#5b6573; font-size:clamp(12px,min(.95vw,2.1vh),16px); }
}

/* Breathing room (Home "Designed to Remove Every Barrier"): more space between copy, cards and the Set It panel */
@media (min-width:992px) {
	html body .hp-barriers__row { gap:clamp(24px,3vw,56px); margin-bottom:clamp(12px,3.2vh,40px); }
}
