/* ==========================================================================
   UX audit "wow" upgrades (Oct 2026). One signature motion per page; everything
   else subtle. Only transform/opacity/clip-path animate. Content is complete
   without JS (final state), and prefers-reduced-motion gets the final state.
   ========================================================================== */
:root { --wow-ease:cubic-bezier(.2,.7,.2,1); }

/* ---------- Wow 2: Home hero before/after reveal ---------- */
.ux-reveal { position:relative; width:100%; justify-self:end; }
.ux-reveal__stage { position:relative; aspect-ratio:1800 / 965; touch-action:pan-y; user-select:none; -webkit-user-select:none; }
.ux-reveal__img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; pointer-events:none; }
.ux-reveal__img--after { clip-path:inset(0 calc(100% - var(--r, 100%)) 0 0); }
.ux-reveal__line { position:absolute; top:4%; bottom:4%; left:var(--r, 100%); width:2px; margin-left:-1px; background:linear-gradient(180deg, transparent, #6285FB 18%, #6285FB 82%, transparent); opacity:0; transition:opacity .3s var(--wow-ease); pointer-events:none; }
.ux-reveal__knob { position:absolute; top:50%; left:var(--r, 100%); width:44px; height:44px; margin:-22px 0 0 -22px; display:flex; align-items:center; justify-content:center; border:0; border-radius:50%; background:#fff; color:#3B4FD8; box-shadow:0 6px 20px rgba(13,23,88,.18), 0 0 0 1px rgba(59,79,216,.15); cursor:ew-resize; opacity:0; transition:opacity .3s var(--wow-ease), transform .2s var(--wow-ease); }
.ux-reveal__knob:hover { transform:scale(1.06); }
.ux-reveal__tag { position:absolute; bottom:2%; padding:4px 10px; border-radius:999px; font:600 13px/1.4 'Plus Jakarta Sans',sans-serif; opacity:0; transition:opacity .3s var(--wow-ease); pointer-events:none; }
.ux-reveal__tag--before { right:4%; background:#0b121a; color:#fff; }
.ux-reveal__tag--after { left:2%; background:#EEF2FF; color:#3B4FD8; }
.ux-reveal.is-live .ux-reveal__line, .ux-reveal.is-live .ux-reveal__knob, .ux-reveal.is-live .ux-reveal__tag { opacity:1; }
.ux-call { position:absolute; z-index:2; display:flex; align-items:flex-start; gap:10px; width:min(46%, 250px); padding:12px 14px; background:rgba(255,255,255,.96); border:1px solid #E7EAF3; border-radius:16px; box-shadow:0 14px 34px -14px rgba(13,23,88,.22); font-family:'Plus Jakarta Sans',sans-serif; transition:opacity .45s var(--wow-ease), transform .45s var(--wow-ease); transition-delay:calc(var(--i) * 80ms); }
.ux-call--hvac { left:0; top:-2%; }
.ux-call--peak { right:0; top:6%; }
.ux-call--light { right:0; bottom:4%; }
.ux-call__ic { flex:none; width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:50%; }
.ux-call__ic--p { background:rgba(19,83,233,.1); } .ux-call__ic--o { background:rgba(255,127,39,.12); } .ux-call__ic--v { background:rgba(138,56,245,.12); }
.ux-call__tx { display:flex; flex-direction:column; gap:2px; min-width:0; }
.ux-call__tx b { font-size:14px; line-height:1.3; color:#0b121a; }
.ux-call__tx small { font-size:13px; line-height:1.35; color:#475467; }
.ux-call__tx em { margin-top:4px; font-style:normal; font-size:13px; color:#475467; }
.ux-call__tx em strong { color:var(--ink-green, #2F7D44); font-size:15px; }
.ux-reveal.is-live .ux-call { opacity:0; transform:translateY(8px) scale(.98); pointer-events:none; }
.ux-reveal.is-live.is-lit .ux-call { opacity:1; transform:none; }
@media (max-width:1023px) {
	.ux-reveal { justify-self:stretch; max-width:640px; margin-inline:auto; }
	.ux-call { display:none; }
}
@media (max-width:767px) { .ux-reveal__tag { font-size:12px; } }

/* ---------- Wow 1: Home "See inside the bill" pinned scroll story ---------- */
.ux-pin.is-pinned > [data-ux-story] { position:sticky !important; top:var(--hdr, 84px); }
[data-ux-story].is-live .hp-bill__stage .st-deco { opacity:0; transition:opacity .5s var(--wow-ease); }
[data-ux-story].is-live[data-step="1"] .hp-bill__stage .st-deco, [data-ux-story].is-live[data-step="2"] .hp-bill__stage .st-deco, [data-ux-story].is-live[data-step="3"] .hp-bill__stage .st-deco,
[data-ux-story].is-live[data-step="4"] .hp-bill__stage .st-deco, [data-ux-story].is-live[data-step="5"] .hp-bill__stage .st-deco { opacity:1; }
[data-ux-story].is-live .hp-bill__doc { transition:transform .6s var(--wow-ease), filter .6s var(--wow-ease); transform-origin:50% 50%; }
[data-ux-story].is-live[data-step="0"] .hp-bill__doc { transform:scale(1.04); filter:drop-shadow(0 24px 40px rgba(255,127,39,.25)); }
[data-ux-story].is-live .hp-qs li { opacity:.28; transform:translateX(-6px); transition:opacity .45s var(--wow-ease), transform .45s var(--wow-ease); }
[data-ux-story].is-live .hp-qs li.is-on { opacity:1; transform:none; }
[data-ux-story].is-live .hp-bd { opacity:0; transform:translateX(28px); transition:opacity .6s var(--wow-ease), transform .6s var(--wow-ease); }
[data-ux-story].is-live.is-bd .hp-bd { opacity:1; transform:none; }
[data-ux-story].is-live .hp-bd__rows li { opacity:0; transform:translateY(6px); transition:opacity .4s var(--wow-ease), transform .4s var(--wow-ease); }
[data-ux-story].is-live.is-bd .hp-bd__rows li { opacity:1; transform:none; }
[data-ux-story].is-live.is-bd .hp-bd__rows li:nth-child(2) { transition-delay:80ms; } [data-ux-story].is-live.is-bd .hp-bd__rows li:nth-child(3) { transition-delay:160ms; }
[data-ux-story].is-live.is-bd .hp-bd__rows li:nth-child(4) { transition-delay:240ms; } [data-ux-story].is-live.is-bd .hp-bd__rows li:nth-child(5) { transition-delay:320ms; }
[data-ux-story].is-live .hp-bd__bars { transform:scaleX(0); transform-origin:left center; transition:transform .7s var(--wow-ease) .2s; }
[data-ux-story].is-live.is-bd .hp-bd__bars { transform:none; }
[data-ux-story].is-live .hp-bd__foot { opacity:0; transform:translateY(10px); transition:opacity .5s var(--wow-ease), transform .5s var(--wow-ease); }
[data-ux-story].is-live.is-save .hp-bd__foot { opacity:1; transform:none; }
.ux-story-meter { position:absolute; left:50%; bottom:clamp(8px, 2vh, 20px); transform:translateX(-50%); display:flex; gap:6px; }
.ux-story-meter i { width:24px; height:3px; border-radius:2px; background:#D9DEEA; transition:background .3s var(--wow-ease); }
.ux-story-meter i.is-on { background:#6285FB; }

/* ---------- Count-ups ---------- */
[data-ux-count] { font-variant-numeric:tabular-nums; }

@media (prefers-reduced-motion:reduce) {
	.ux-reveal.is-live .ux-call { opacity:1; transform:none; }
	.ux-pin.is-pinned > [data-ux-story] { position:static; }
}

/* ---------- Shared type for new sections (matches the site's Plus Jakarta scale) ---------- */
.ux-eyebrow { margin:0 0 10px; color:var(--ink-green, #2F7D44); font:700 14px/1.4 'Plus Jakarta Sans',sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.ux-h2 { margin:0; color:#0b121a; font:700 clamp(30px, 2.6vw, 44px)/1.15 'Averta CY','Plus Jakarta Sans',sans-serif; letter-spacing:-.02em; text-wrap:balance; }
.ux-lead { margin:12px 0 0; color:#475467; font:500 clamp(16px, 1.1vw, 18px)/1.6 'Plus Jakarta Sans',sans-serif; max-width:36em; }
.ux-btn { display:inline-flex; align-items:center; gap:10px; min-height:52px; padding:0 26px; border-radius:999px; background:#0b121a; color:#fff !important; font:600 16px/1 'Plus Jakarta Sans',sans-serif; text-decoration:none !important; transition:background .25s var(--wow-ease), transform .25s var(--wow-ease); }
.ux-btn:hover { background:#203248; transform:translateY(-1px); }
.ux-sec-in { max-width:1360px; margin:0 auto; padding-inline:var(--gutter, clamp(24px,5vw,80px)); box-sizing:border-box; }

/* ---------- Wow 3 v2: Plan your kit (panel / MCC) ---------- */
.ux-xray { padding-block:clamp(40px, 8vh, 112px); background:linear-gradient(180deg, #fff, #F7F8FC); }
.ux-xray__in { max-width:1360px; margin:0 auto; padding-inline:var(--gutter, clamp(24px,5vw,80px)); display:grid; grid-template-columns:minmax(0, 4fr) minmax(0, 7fr); gap:clamp(32px, 5vw, 88px); align-items:center; box-sizing:border-box; }
.ux-xray__tog { display:inline-flex; gap:4px; margin-top:clamp(16px, 3vh, 28px); padding:4px; border-radius:999px; background:#EEF1F6; }
.ux-xray__tog button { min-height:40px; padding:0 18px; border:0; border-radius:999px; background:transparent; font:600 15px/1 'Plus Jakarta Sans',sans-serif; color:#475467; cursor:pointer; transition:background .25s, color .25s, box-shadow .25s; }
.ux-xray__tog button[aria-pressed="true"] { background:#fff; color:#0b121a; box-shadow:0 1px 3px rgba(16,24,40,.12); }
.ux-xray__ctl { margin-top:clamp(16px, 3vh, 28px); }
.ux-xray__lbl { display:block; font:600 16px/1.4 'Plus Jakarta Sans',sans-serif; color:#475467; }
.ux-xray__lbl b { font-size:clamp(34px, 3vw, 48px); color:#0b121a; font-variant-numeric:tabular-nums; margin-right:4px; }
.ux-xray input[type=range] { width:100%; margin:10px 0 6px; accent-color:#2F7D44; height:28px; cursor:pointer; }
.ux-xray__ticks { display:flex; justify-content:space-between; font:500 13px/1 'Plus Jakarta Sans',sans-serif; color:#667085; }
.ux-xray__cta { margin-top:clamp(24px, 4.5vh, 44px); }
.ux-xray__art { display:grid; grid-template-columns:minmax(0, 1fr) minmax(200px, 250px); gap:clamp(20px, 3vw, 48px); align-items:center; }
.ux-xray__equip { height:min(calc(100svh - var(--hdr, 84px) - 140px), 480px); min-height:260px; display:flex; align-items:flex-end; justify-content:center; }
.ux-xray__equip > img { height:100%; width:auto; object-fit:contain; }
.ux-xray__equip svg { display:block; width:100%; height:var(--eh, 100%); max-height:100%; transition:height .45s var(--wow-ease); filter:drop-shadow(0 18px 30px rgba(16,24,40,.12)); }
.ux-xray__parts { display:grid; gap:clamp(14px, 2.4vh, 22px); margin:0; padding:0; list-style:none; }
.ux-xray__part { display:grid; gap:8px; padding:14px 16px; border:1px solid #E7EAF3; border-radius:16px; background:#fff; }
.ux-xray__pt { font:500 15px/1.3 'Plus Jakarta Sans',sans-serif; color:#344054; }
.ux-xray__pt b { font-size:20px; color:#0b121a; font-variant-numeric:tabular-nums; margin-right:2px; }
.ux-xray__ph { display:flex; flex-wrap:wrap; gap:6px; min-height:40px; align-items:center; }
.ux-xray__ph > img { height:40px; width:auto; }
.ux-xray__ph--hubs > img, .ux-xray__ph--gw > img { display:none; height:36px; }
.ux-xray__ph--hubs > img.is-on, .ux-xray__ph--gw > img.is-on { display:block; animation:uxPop .4s var(--wow-ease) both; }
@keyframes uxPop { from { opacity:0; transform:translateY(6px) scale(.8); } to { opacity:1; transform:none; } }
@media (max-width:1023px) { .ux-xray__in { grid-template-columns:1fr; } }
@media (max-width:600px) { .ux-xray__art { grid-template-columns:1fr; } .ux-xray__equip { height:300px; } }
@media (prefers-reduced-motion:reduce) { .ux-xray__ph > img.is-on { animation:none; } .ux-xray__equip svg { transition:none; } }

/* ---------- Wow 4: case-study map ---------- */
.ux-map { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0, 3fr) minmax(0, 7fr); gap:clamp(20px, 3vw, 48px); align-items:center; margin:clamp(16px, 3vh, 32px) 0 clamp(28px, 5vh, 56px); padding:clamp(20px, 3vw, 40px); border-radius:24px; background:#fff; box-shadow:0 1px 2px rgba(16,24,40,.04), 0 12px 40px rgba(16,24,40,.06); }
.ux-map__roll { display:flex; gap:clamp(20px, 2.4vw, 40px); margin:clamp(14px, 3vh, 28px) 0 0; }
.ux-map__roll dd { margin:0; font:800 clamp(40px, 4vw, 64px)/1 'Averta CY','Plus Jakarta Sans',sans-serif; color:#2F7D44; font-variant-numeric:tabular-nums; }
.ux-map__roll div + div dd { color:#C2410C; }
.ux-map__roll dt { margin-top:6px; font:600 14px/1.35 'Plus Jakarta Sans',sans-serif; color:#475467; max-width:12em; }
.ux-map__art { position:relative; }
.ux-map__svg { display:block; width:100%; height:auto; max-height:calc(100svh - var(--hdr, 84px) - 160px); }
.ux-map__svg path { fill:#EEF1F6; stroke:#fff; stroke-width:1.4; stroke-linejoin:round; }
.ux-map__svg path[data-p="AB"], .ux-map__svg path[data-p="BC"], .ux-map__svg path[data-p="ON"] { fill:#E3EDE6; }
.ux-map__pins { position:absolute; inset:0; margin:0; padding:0; list-style:none; }
.ux-pin-m { position:absolute; left:var(--x); top:var(--y); width:0; height:0; }
.ux-pin-m > a { position:absolute; left:-14px; top:-14px; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; }
.ux-pin-m__dot { width:14px; height:14px; border-radius:50%; background:#2F7D44; box-shadow:0 0 0 3px #fff, 0 2px 8px rgba(16,24,40,.25); transition:transform .25s var(--wow-ease); }
.ux-pin-m__dot::after { content:""; position:absolute; inset:0; margin:auto; width:14px; height:14px; border-radius:50%; border:2px solid #58AE6A; opacity:0; }
.ux-map.is-in .ux-pin-m__dot::after { animation:uxPing 2.4s calc(var(--i) * 160ms + .8s) var(--wow-ease) 2; }
@keyframes uxPing { 0% { opacity:.8; transform:scale(1); } 100% { opacity:0; transform:scale(2.6); } }
.ux-pin-m:hover .ux-pin-m__dot, .ux-pin-m > a:focus-visible .ux-pin-m__dot, .ux-pin-m.is-open .ux-pin-m__dot { transform:scale(1.35); background:#C2410C; }
.ux-pin-m__card { position:absolute; top:-30px; left:22px; z-index:3; width:236px; padding:14px 16px; border-radius:16px; background:#fff; box-shadow:0 16px 40px rgba(16,24,40,.16); display:grid; gap:6px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .2s var(--wow-ease), transform .2s var(--wow-ease), visibility 0s .2s; pointer-events:none; }
.ux-pin-m--l .ux-pin-m__card { left:auto; right:22px; top:auto; bottom:-20px; }
.ux-pin-m:hover .ux-pin-m__card, .ux-pin-m:focus-within .ux-pin-m__card, .ux-pin-m.is-open .ux-pin-m__card { opacity:1; visibility:visible; transform:none; transition-delay:0s; }
.ux-pin-m:hover, .ux-pin-m:focus-within, .ux-pin-m.is-open { z-index:5; }
.ux-pin-m__card img { height:36px; width:auto; max-width:140px; object-fit:contain; justify-self:start; }
.ux-pin-m__card b { font:700 15px/1.3 'Plus Jakarta Sans',sans-serif; color:#0b121a; }
.ux-pin-m__stats { display:grid; grid-template-columns:repeat(3, auto); gap:10px; font:500 12px/1.3 'Plus Jakarta Sans',sans-serif; color:#475467; }
.ux-pin-m__stats i { display:block; font:700 17px/1.2 'Plus Jakarta Sans',sans-serif; font-style:normal; }
.ux-pin-m__stats .is-g { color:#2F7D44; } .ux-pin-m__stats .is-b { color:#3B4FD8; } .ux-pin-m__stats .is-o { color:#C2410C; }
.ux-map.js-anim .ux-pin-m > a { opacity:0; transform:translateY(-14px); transition:opacity .4s var(--wow-ease), transform .5s cubic-bezier(.34,1.56,.64,1); transition-delay:calc(var(--i) * 90ms + .1s); }
.ux-map.js-anim.is-in .ux-pin-m > a { opacity:1; transform:none; }
@media (max-width:1023px) {
	.ux-map { grid-template-columns:1fr; }
}
@media (max-width:600px) {
	.ux-pin-m__card { width:200px; }
	.ux-map__roll dd { font-size:40px; }
}
@media (prefers-reduced-motion:reduce) { .ux-map .ux-pin-m > a { opacity:1 !important; transform:none !important; } .ux-pin-m__dot::after { animation:none !important; } }

/* ---------- Wow 5: draggable 24-hour timeline (How it Works) ---------- */
.ux-day { padding-block:clamp(28px, 6vh, 88px); background:#fff; }
.ux-day__head { display:grid; grid-template-columns:1fr auto; align-items:end; gap:4px 24px; }
.ux-day__head .ux-eyebrow, .ux-day__head .ux-h2 { grid-column:1; }
.ux-day__note { grid-column:2; grid-row:2; margin:0; font:500 14px/1.4 'Plus Jakarta Sans',sans-serif; color:#667085; }
.ux-day__body { display:grid; grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr); gap:clamp(20px, 3vw, 48px); align-items:center; margin-top:clamp(14px, 3vh, 32px); }
.ux-day__art { position:relative; border-radius:20px; overflow:hidden; background:#EAF2FB; aspect-ratio:16 / 9; max-height:calc(100svh - var(--hdr, 84px) - 280px); width:100%; }
.ux-day__sky { position:absolute; inset:0; background:linear-gradient(180deg, #DCEBFA, #F4F8FC); transition:background .6s; }
.ux-day.is-night .ux-day__sky { background:linear-gradient(180deg, #1B2A44, #33476A); }
.ux-day__art img { position:absolute; inset:6% 0 0; margin:auto; width:auto; height:94%; max-width:100%; object-fit:contain; transition:filter .6s; }
.ux-day.is-night .ux-day__art img { filter:brightness(.62) saturate(.85); }
.ux-day.is-hvac .ux-day__art img { filter:brightness(.7) drop-shadow(0 0 22px rgba(249,115,22,.75)); }
.ux-day__clock, .ux-day__occ { position:absolute; top:14px; padding:6px 12px; border-radius:999px; background:rgba(255,255,255,.92); font:700 14px/1.2 'Plus Jakarta Sans',sans-serif; color:#0b121a; font-variant-numeric:tabular-nums; }
.ux-day__clock { left:14px; } .ux-day__occ { right:14px; color:#475467; font-weight:600; }
.ux-day__cards { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.ux-day__card { display:grid; gap:4px; padding:14px 18px; border:1px solid #E4E7EC; border-radius:16px; background:#fff; font:500 15px/1.45 'Plus Jakarta Sans',sans-serif; color:#475467; transition:opacity .3s var(--wow-ease), transform .3s var(--wow-ease), box-shadow .3s, border-color .3s; }
.ux-day__card b { font-size:16px; color:#0b121a; }
.ux-day__v small { font-size:13px; color:#667085; } .ux-day__v i { font-style:normal; font-weight:700; }
.ux-day__v .is-g { color:#2F7D44; } .ux-day__v .is-o { color:#C2410C; }
.ux-day.js .ux-day__card { opacity:.42; }
.ux-day.js .ux-day__card.is-on { opacity:1; border-color:#58AE6A; box-shadow:0 12px 32px rgba(16,24,40,.10); transform:translateX(-4px); }
.ux-day__track { position:relative; margin-top:clamp(16px, 3vh, 28px); }
.ux-day__bar { position:relative; height:12px; border-radius:6px; background:#EEF1F6; overflow:hidden; }
.ux-day__band { position:absolute; top:0; bottom:0; }
.ux-day__band--occ { background:#DCEFE1; }
.ux-day__band--peak, .ux-day__band--hvac { background:rgba(194,65,12,.55); }
.ux-day__band--pump { background:rgba(59,79,216,.45); }
.ux-day__track input { position:absolute; left:0; right:0; top:-10px; width:100%; height:32px; margin:0; background:transparent; -webkit-appearance:none; appearance:none; cursor:grab; }
.ux-day__track input:active { cursor:grabbing; }
.ux-day__track input::-webkit-slider-runnable-track { background:transparent; height:32px; }
.ux-day__track input::-moz-range-track { background:transparent; }
.ux-day__track input::-webkit-slider-thumb { -webkit-appearance:none; width:28px; height:28px; margin-top:2px; border-radius:50%; background:#0b121a; border:4px solid #fff; box-shadow:0 2px 10px rgba(16,24,40,.3); }
.ux-day__track input::-moz-range-thumb { width:20px; height:20px; border-radius:50%; background:#0b121a; border:4px solid #fff; box-shadow:0 2px 10px rgba(16,24,40,.3); }
.ux-day__track input:focus-visible { outline:none; }
.ux-day__track input:focus-visible::-webkit-slider-thumb { box-shadow:0 0 0 4px #3B4FD8; }
.ux-day__ticks { display:flex; justify-content:space-between; margin-top:10px; font:500 13px/1 'Plus Jakarta Sans',sans-serif; color:#667085; }
.ux-day:not(.js) .ux-day__track, .ux-day:not(.js) .ux-day__clock, .ux-day:not(.js) .ux-day__occ, .ux-day:not(.js) .ux-day__note { display:none; }
@media (max-width:1023px) { .ux-day__body { grid-template-columns:1fr; } .ux-day__head { grid-template-columns:1fr; } .ux-day__note { grid-column:1; grid-row:auto; } }
@media (max-width:600px) {
	.ux-map__art { margin-bottom:150px; }
	.ux-pin-m { position:static; }
	.ux-pin-m > a { left:calc(var(--x) - 14px); top:calc(var(--y) - 14px); }
	.ux-pin-m__card, .ux-pin-m--l .ux-pin-m__card { left:0; right:0; top:calc(100% + 12px); bottom:auto; width:auto; }
}

/* Bill: strip sits below the building, never over it or the breakdown card (Peter, Oct 15) */
@media (min-width:768px) {
	.hp-bill__visual .hp-steps { margin:clamp(12px, 2.4vh, 24px) auto 0 !important; }
	.hp-bill__visual .hp-steps__s { white-space:normal !important; }
	.hp-bill__bld { height:clamp(80px, min(11vw, calc(100svh - 560px)), 240px) !important; }
}
/* short laptop screens: the building is decorative; drop it so the whole story fits under the header */
@media (min-width:1024px) and (max-height:700px) {
	.hp-bill__visual .hp-bill__bld { display:none !important; }
	.hp-bill__visual .hp-steps { margin-top:clamp(16px, 3vh, 28px) !important; }
}

/* Hero reveal v2: automatic, no handle (Peter, Oct 15) */
.ux-reveal__stage { touch-action:auto; }
.ux-reveal__line, .ux-reveal__knob { display:none !important; }
.ux-reveal__sweep { position:absolute; top:0; bottom:0; left:var(--r, 100%); width:22%; margin-left:-11%; pointer-events:none; opacity:0; background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(214,231,255,.55) 42%, rgba(255,255,255,.9) 50%, rgba(214,231,255,.55) 58%, rgba(255,255,255,0) 100%); mix-blend-mode:screen; filter:blur(6px); transition:opacity .5s var(--wow-ease); }
.ux-reveal.is-sweeping .ux-reveal__sweep { opacity:1; }
.ux-reveal__tag { top:3%; bottom:auto !important; left:3% !important; right:auto !important; padding:6px 12px; box-shadow:0 4px 14px rgba(16,24,40,.12); transition:opacity .6s var(--wow-ease), transform .6s var(--wow-ease); }
.ux-reveal.is-live .ux-reveal__tag--before { opacity:1; }
.ux-reveal.is-live .ux-reveal__tag--after { opacity:0; transform:translateY(4px); }
.ux-reveal.is-done .ux-reveal__tag--before { opacity:0; transform:translateY(-4px); }
.ux-reveal.is-done .ux-reveal__tag--after { opacity:1; transform:none; }
/* settled: callouts breathe very gently */
@media (prefers-reduced-motion:no-preference) {
	.ux-reveal.is-done .ux-call { animation:uxFloat 6s ease-in-out infinite; animation-delay:calc(var(--i) * -2s); }
}
@keyframes uxFloat { 0%, 100% { translate:0 0; } 50% { translate:0 -4px; } }
/* the 6-dash progress meter read as stray underlines under the step strip (Peter, Oct 15): removed */
.ux-story-meter { display:none !important; }
/* hero tags: bottom-left of the art, clear of the callouts */
.ux-reveal__tag { top:auto !important; bottom:4% !important; left:3% !important; }
/* bill step strip: full width on laptops so step titles stay on one line */
@media (min-width:1024px) and (max-width:1365px) {
	.hp-bill__visual .hp-steps { width:100% !important; }
	.hp-bill__visual .hp-steps__t { white-space:nowrap; }
}

/* restored (accidentally dropped with the Wow 3 v2 rewrite) */
/* sticky needs a non-scrolling ancestor chain: clip (not hidden) the horizontal overflow */
html, body { overflow-x:clip !important; }

/* Home hero with the reveal: bigger art, vertically centred in the first screen */
@media (min-width:1024px) {
	.hp-hero .hp-hero__grid { grid-template-columns:minmax(0, 42%) minmax(0, 1fr) !important; min-height:calc(100svh - var(--hdr, 84px) - 48px); align-items:center !important; gap:clamp(24px, 3vw, 56px) !important; }
	.hp-hero .hp-hero__copy { display:flex !important; }
	.hp-hero .hp-hero__copy > * { grid-column:auto !important; }
	.hp-hero .ux-reveal { grid-column:2 !important; grid-row:1 !important; max-width:min(100%, calc((100svh - var(--hdr, 84px) - 140px) * 1.865)) !important; padding-block:clamp(40px, 9vh, 84px) 0; }
	.ux-call { width:clamp(190px, 16vw, 236px); padding:10px 12px; gap:8px; }
	.ux-call__ic { width:34px; height:34px; }
	.ux-call--hvac { left:-4%; top:0; }
	.ux-call--peak { right:-2%; top:2%; }
	.ux-call--light { right:-2%; bottom:-6%; }
}

@media (min-width:1280px) { .hp-hero .hp-hero__actions { flex-direction:row !important; flex-wrap:nowrap !important; align-items:center !important; } .hp-hero .hp-hero__actions .hp-btn { width:auto !important; } }
@media (min-width:1024px) and (max-width:1279px) { .hp-hero .hp-hero__actions { flex-wrap:wrap !important; } }
/* real-world flow steps: at laptop widths the 3 narrow columns crushed the copy; titles only */
@media (min-width:1024px) and (max-width:1279px) { .hp-rw .hp-steps--flow .hp-steps__s { display:none; } .hp-rw .hp-steps--flow .hp-steps__t { font-size:15px; } }