:root { --ink:#09202d; --muted:#607783; --paper:#f8fbfc; --line:rgba(70,118,139,.18); --aqua:#7fdce9; --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --display:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --mono:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; color:var(--ink); font-family:var(--sans); background:radial-gradient(circle at 5% 12%,rgba(126,224,244,.13),transparent 25rem),radial-gradient(circle at 95% 11%,rgba(158,193,255,.1),transparent 28rem),var(--paper); transition:background .75s ease,color .45s ease; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button { cursor:pointer; }
.section-wrap { width:min(1060px,calc(100% - 48px)); margin-inline:auto; }
.reveal { opacity:0; transform:translateY(12px); transition:opacity .5s ease,transform .5s ease; }
.reveal.visible { opacity:1; transform:none; }

.site-header { width:min(1210px,calc(100% - 48px)); min-height:65px; margin:16px auto 0; padding:9px 11px 9px 16px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:9px 20px; position:sticky; top:12px; z-index:10; border:1px solid rgba(255,252,247,.88); border-radius:21px; background:rgba(255,250,244,.64); box-shadow:0 14px 34px rgba(108,70,45,.11),inset 0 1px 0 white; backdrop-filter:blur(22px) saturate(145%); -webkit-backdrop-filter:blur(22px) saturate(145%); }
.brand { display:inline-flex; align-items:center; gap:10px; justify-self:start; }
.header-logo { display:block; width:93px; height:auto; }
.brand-divider { width:1px; height:26px; background:rgba(122,86,62,.24); }
.brand-copy { display:flex; flex-direction:column; gap:2px; line-height:1; }
.brand-copy b { font:700 9px var(--display); letter-spacing:.1em; }
.brand-copy small { color:var(--muted); font:500 7px var(--mono); letter-spacing:.11em; }
.solution-switch { grid-column:1 / -1; grid-row:2; width:100%; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:3px; padding:3px; border:1px solid rgba(255,252,247,.88); border-radius:15px; background:rgba(255,250,244,.45); box-shadow:inset 0 1px 0 white; }
.solution-tab { min-height:35px; padding:0 10px; border:1px solid transparent; border-radius:11px; background:transparent; color:#7c6a5d; font-size:10px; font-weight:600; white-space:nowrap; }
.solution-tab.active { border-color:rgba(255,252,247,.92); background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,215,169,.78)); color:var(--ink); box-shadow:0 5px 12px rgba(147,92,47,.12),inset 0 1px 0 white; }
.header-cta { justify-self:end; display:inline-flex; align-items:center; gap:10px; padding:11px 14px; border:1px solid rgba(255,252,247,.85); border-radius:14px; background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,211,162,.78)); box-shadow:0 6px 16px rgba(143,90,46,.11),inset 0 1px 0 white; font-size:11px; font-weight:700; }
.header-cta span { color:#a85b31; font-size:16px; }

.hero { min-height:640px; display:grid; grid-template-columns:1.18fr .82fr; align-items:center; gap:80px; padding:60px 0 82px; }
.eyebrow { margin:0; color:#8c5d43; font:500 10px var(--mono); letter-spacing:.13em; }
h1,h2,p { margin-top:0; }
.hero h1 { max-width:650px; margin:18px 0 20px; font:600 clamp(52px,6vw,79px)/1.02 var(--display); letter-spacing:-.065em; }
.hero-intro { max-width:570px; color:var(--muted); font-size:16px; line-height:1.7; }
.bio-details { max-width:570px; margin-top:11px; }
.bio-details summary { width:max-content; min-height:34px; display:flex; align-items:center; gap:9px; padding:7px 11px 7px 13px; list-style:none; border:1px solid rgba(246,254,255,.9); border-radius:999px; background:rgba(248,253,255,.58); box-shadow:0 7px 18px rgba(36,112,151,.08),inset 0 1px 0 rgba(255,255,255,.9); color:#3b7896; font:650 9px var(--mono); letter-spacing:.1em; text-transform:uppercase; cursor:pointer; transition:background .2s ease,box-shadow .2s ease,color .2s ease; }
.bio-details summary::-webkit-details-marker { display:none; }
.bio-details summary:focus-visible { outline:2px solid rgba(33,126,159,.45); outline-offset:3px; }
.bio-details summary i { width:19px; height:19px; display:grid; place-items:center; border-radius:50%; background:rgba(194,238,248,.74); color:#217e9f; font:500 15px/1 var(--sans); transition:transform .28s ease,background .2s ease; }
.bio-details summary:hover { background:rgba(248,253,255,.82); box-shadow:0 9px 21px rgba(36,112,151,.11),inset 0 1px 0 white; }
.bio-details[open] summary i { transform:rotate(45deg); }
.bio-read-less { display:none; }
.bio-details[open] .bio-read-more { display:none; }
.bio-details[open] .bio-read-less { display:inline; }
.bio-expanded { margin-top:12px; padding:18px 20px; border:1px solid rgba(246,254,255,.92); border-radius:19px; background:linear-gradient(135deg,rgba(255,255,255,.76),rgba(229,247,251,.58)); box-shadow:0 16px 34px rgba(31,83,112,.1),inset 0 1px 0 rgba(255,255,255,.94); backdrop-filter:blur(16px) saturate(135%); -webkit-backdrop-filter:blur(16px) saturate(135%); animation:bio-reveal .32s cubic-bezier(.2,.8,.2,1) both; }
.bio-expanded p { margin:0; color:#536c78; font-size:13px; line-height:1.68; }
.bio-expanded p + p { margin-top:12px; }
@keyframes bio-reveal { from { opacity:0; transform:translateY(-6px) scale(.99); } to { opacity:1; transform:none; } }
.button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; gap:27px; padding:13px 18px; border:1px solid rgba(255,255,255,.86); border-radius:15px; font-size:12px; font-weight:700; transition:transform .18s ease; }
.button:hover { transform:translateY(-2px); }
.button span { color:#a85b31; font-size:19px; }
.button-primary { margin-top:22px; background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,213,165,.82)); box-shadow:0 11px 24px rgba(139,88,44,.14),inset 0 1px 0 white; }
.experience-line { display:flex; align-items:center; gap:12px; margin-top:42px; color:#836e5f; font:500 9px var(--mono); letter-spacing:.1em; }
.experience-line strong { color:var(--ink); font:600 21px var(--display); letter-spacing:-.06em; }
.experience-line i { width:1px; height:21px; background:var(--line); }
.hero-photo { position:relative; max-width:385px; justify-self:end; padding:9px; border:1px solid rgba(255,252,247,.88); border-radius:28px; background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(252,205,161,.64)); box-shadow:0 24px 50px rgba(92,55,32,.18),inset 0 1px 0 white; }
.hero-photo img { display:block; width:100%; aspect-ratio:.82; object-fit:cover; object-position:50% 18%; border-radius:20px; background:#e7e7e5; filter:grayscale(.3) contrast(1.03); mix-blend-mode:normal; }

.focus-section { padding-bottom:92px; }
.solution-stage { min-height:380px; position:relative; display:grid; grid-template-columns:1fr 290px; overflow:hidden; border:1px solid rgba(255,252,247,.88); border-radius:28px; background:rgba(255,250,244,.56); box-shadow:0 20px 45px rgba(105,66,41,.11),inset 0 1px 0 white; backdrop-filter:blur(19px) saturate(140%); }
.stage-content { max-width:630px; padding:52px 55px; position:relative; z-index:1; }
.stage-content h2,.booking-intro h2 { margin:17px 0; font:600 clamp(36px,4vw,55px)/1.06 var(--display); letter-spacing:-.06em; }
.stage-content > p:not(.eyebrow) { max-width:520px; color:var(--muted); font-size:14px; line-height:1.7; }
.simple-points { display:flex; flex-wrap:wrap; gap:7px; margin:25px 0 21px; }
.simple-points span { padding:7px 10px; border:1px solid rgba(255,252,247,.75); border-radius:18px; background:rgba(255,250,244,.42); color:#786552; font-size:10px; }
.product-offerings { max-width:540px; margin:18px 0 0; padding:12px 14px; border:1px solid rgba(74,149,181,.22); border-radius:15px; background:rgba(235,249,252,.48); color:#486570; font-size:12px; line-height:1.6; }
.product-offerings strong { color:var(--ink); font-weight:650; }
.text-link { display:inline-flex; align-items:center; gap:10px; padding-bottom:5px; border-bottom:1px solid #806753; font-size:12px; font-weight:700; }
.text-link span { color:#a85b31; font-size:17px; }
.water-actions,.air-actions,.water-heater-actions { display:flex; align-items:center; flex-wrap:wrap; gap:11px 16px; }
.product-lineup-toggle { min-height:35px; display:inline-flex; align-items:center; gap:9px; padding:7px 9px 7px 12px; border:1px solid rgba(246,254,255,.88); border-radius:999px; background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(207,240,248,.58)); box-shadow:0 7px 17px rgba(35,114,150,.08),inset 0 1px 0 rgba(255,255,255,.9); color:#3d6f84; font-size:10px; font-weight:700; transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }
.product-lineup-toggle i { width:19px; height:19px; display:grid; place-items:center; border-radius:50%; background:rgba(180,230,242,.66); color:#217e9f; font:500 15px/1 var(--sans); transition:transform .28s ease; }
.product-lineup-toggle[aria-expanded="true"] i { transform:rotate(45deg); }
.product-lineup-toggle:focus-visible { outline:2px solid rgba(33,126,159,.45); outline-offset:3px; }
@media (hover:hover) { .product-lineup-toggle:hover { transform:translateY(-1px); background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(192,235,247,.68)); box-shadow:0 9px 20px rgba(35,114,150,.11),inset 0 1px 0 white; } }
.product-lineup-panel { max-width:540px; margin:17px 0 2px; padding:10px; border:1px solid rgba(246,254,255,.92); border-radius:20px; background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(222,245,251,.54)); box-shadow:0 17px 35px rgba(31,83,112,.09),inset 0 1px 0 rgba(255,255,255,.94); backdrop-filter:blur(17px) saturate(135%); -webkit-backdrop-filter:blur(17px) saturate(135%); }
.product-lineup-panel[hidden] { display:none; }
.product-lineup-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.product-card { min-width:0; min-height:98px; display:grid; grid-template-columns:82px minmax(0,1fr); align-items:center; gap:10px; padding:9px; border:1px solid rgba(255,255,255,.74); border-radius:16px; background:rgba(248,253,255,.43); box-shadow:inset 0 1px 0 rgba(255,255,255,.72); }
.product-card h3 { margin:0 0 5px; color:#163747; font-size:11px; letter-spacing:-.01em; }
.product-card p { margin:0; color:#607b86; font-size:9.5px; line-height:1.48; }
.product-lineup-note { margin:10px 4px 2px; color:#6a818b; font-size:9px; line-height:1.55; text-align:center; }
.product-mini { position:relative; width:82px; height:68px; overflow:hidden; border:1px solid rgba(246,254,255,.86); border-radius:14px; background:radial-gradient(circle at 50% 24%,rgba(219,250,255,.76),transparent 48%),linear-gradient(145deg,rgba(255,255,255,.7),rgba(155,218,237,.34)); box-shadow:inset 7px 6px 12px rgba(255,255,255,.52),inset -6px -8px 13px rgba(53,142,177,.08); }
.product-mini i,.product-mini b,.product-mini em { display:block; position:absolute; }
.product-ro::before,.product-ro::after { content:""; position:absolute; left:13px; width:56px; height:1px; background:linear-gradient(90deg,transparent,rgba(76,169,201,.68),transparent); }.product-ro::before { top:17px; }.product-ro::after { bottom:13px; }
.product-ro i { top:22px; width:10px; height:31px; border:1px solid rgba(245,254,255,.94); border-radius:4px; background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(80,175,207,.5)); box-shadow:inset 2px 0 3px rgba(255,255,255,.5); }.product-ro i:nth-child(1) { left:18px; }.product-ro i:nth-child(2) { left:36px; }.product-ro i:nth-child(3) { left:54px; }
.product-ro b,.product-alkaline b { width:8px; height:10px; border:1px solid rgba(239,253,255,.92); border-radius:55% 45% 58% 42%; background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(75,183,222,.78)); box-shadow:0 0 8px rgba(118,219,244,.5); transform:rotate(45deg); }
.product-ro b { right:8px; top:13px; }
.product-alkaline::before { content:""; position:absolute; left:18px; right:18px; bottom:11px; height:1px; background:rgba(79,169,201,.34); }
.product-alkaline::after { content:"+"; position:absolute; right:9px; bottom:9px; color:#4ca0bc; font:600 13px/1 var(--sans); }
.product-alkaline i { left:27px; top:12px; width:24px; height:43px; border:1px solid rgba(246,254,255,.94); border-radius:6px 6px 10px 10px; background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(111,196,216,.4) 42%,rgba(93,166,188,.55)); box-shadow:inset 4px 0 5px rgba(255,255,255,.42); }
.product-alkaline b { left:59px; top:18px; }
.product-softener i,.product-softener b { top:15px; width:20px; height:42px; border:1px solid rgba(246,254,255,.94); border-radius:9px 9px 6px 6px; background:linear-gradient(90deg,rgba(255,255,255,.9),rgba(103,185,211,.44)); box-shadow:inset 3px 0 4px rgba(255,255,255,.48); }.product-softener i { left:19px; }.product-softener b { left:43px; }
.product-softener em { left:25px; top:22px; width:4px; height:4px; border-radius:50%; background:#7aa4b1; box-shadow:7px 4px 0 #a0bdc6,2px 12px 0 #6f99a7,9px 17px 0 #a8c2c8; }
.product-chlorine::before { content:""; position:absolute; left:9px; right:9px; top:33px; height:1px; background:rgba(78,160,189,.5); }
.product-chlorine i,.product-iron i { left:31px; top:13px; width:21px; height:43px; border:1px solid rgba(246,254,255,.94); border-radius:9px 9px 6px 6px; background:linear-gradient(90deg,rgba(255,255,255,.9),rgba(94,174,199,.48)); box-shadow:inset 3px 0 4px rgba(255,255,255,.46); }
.product-chlorine i::after { content:""; position:absolute; inset:17px 3px 3px; border-radius:3px; background:linear-gradient(180deg,rgba(104,101,91,.5),rgba(52,74,79,.68)); }
.product-chlorine b { left:11px; top:29px; z-index:2; width:7px; height:7px; border-radius:50%; background:#d3af5e; box-shadow:0 0 6px rgba(191,144,45,.36); }
.product-iron::after { content:""; position:absolute; right:12px; top:28px; width:7px; height:9px; border-radius:55% 45% 58% 42%; background:rgba(92,191,222,.78); transform:rotate(45deg); }
.product-iron b { left:19px; top:20px; width:4px; height:4px; border-radius:50%; background:#a96849; box-shadow:8px 2px 0 #c18a62,3px 10px 0 #875848,11px 14px 0 #b77655; }
.product-uv-water::before { content:""; position:absolute; left:16px; top:21px; width:50px; height:35px; clip-path:polygon(8% 0,92% 0,100% 100%,0 100%); background:linear-gradient(180deg,rgba(73,190,255,.42),transparent); }
.product-uv-water::after { content:""; position:absolute; left:21px; top:43px; width:40px; height:2px; border-radius:999px; background:linear-gradient(90deg,transparent,rgba(224,251,255,.95),transparent); box-shadow:0 0 7px rgba(80,199,255,.7); }
.product-uv-water i { left:17px; top:16px; z-index:2; width:48px; height:7px; border:1px solid rgba(240,253,255,.96); border-radius:999px; background:linear-gradient(90deg,#4ab8ff,#fff 50%,#49adf4); box-shadow:0 0 9px rgba(65,181,248,.72); }
.product-uv-water b { left:37px; top:43px; width:8px; height:8px; border:1px dotted rgba(138,74,77,.62); border-radius:50%; background:#cf8b85; }
@media (prefers-reduced-motion:no-preference) {
  .product-lineup-panel:not([hidden]) { animation:product-lineup-reveal .32s cubic-bezier(.2,.8,.2,1) both; }
  .product-ro i { animation:mini-filter-pulse 4s ease-in-out infinite; }.product-ro i:nth-child(2) { animation-delay:.28s; }.product-ro i:nth-child(3) { animation-delay:.56s; }.product-ro b { animation:mini-drop-fall 4s ease-in-out infinite; }
  .product-alkaline i { animation:mini-cartridge-glow 4.4s ease-in-out infinite; }.product-alkaline b { animation:mini-alkaline-drop 4.4s ease-in-out infinite; }
  .product-softener em { animation:mini-softener-beads 4.2s ease-in-out infinite; }
  .product-chlorine b { animation:mini-chlorine-pass 4.6s ease-in-out infinite; }
  .product-iron b { animation:mini-iron-capture 4.4s ease-in-out infinite; }
  .product-uv-water i { animation:mini-uv-lamp 4.2s ease-in-out infinite; }.product-uv-water::after { animation:mini-uv-sweep 4.2s ease-in-out infinite; }.product-uv-water b { animation:mini-uv-neutralize 4.2s ease-in-out infinite; }
}
@keyframes product-lineup-reveal { from { opacity:0; transform:translateY(-7px) scale(.99); } to { opacity:1; transform:none; } }
@keyframes mini-filter-pulse { 0%,18%,100% { filter:saturate(.75); opacity:.68; } 36%,74% { filter:saturate(1.15); opacity:1; } }
@keyframes mini-drop-fall { 0%,20% { opacity:0; transform:translateY(-5px) rotate(45deg) scale(.7); } 38%,72% { opacity:1; transform:translateY(8px) rotate(45deg) scale(1); } 86%,100% { opacity:0; transform:translateY(15px) rotate(45deg) scale(.75); } }
@keyframes mini-cartridge-glow { 0%,100% { box-shadow:inset 4px 0 5px rgba(255,255,255,.42); } 50% { box-shadow:inset 4px 0 5px rgba(255,255,255,.62),0 0 11px rgba(84,190,218,.38); } }
@keyframes mini-alkaline-drop { 0%,18% { opacity:0; transform:translateY(-5px) rotate(45deg) scale(.72); } 38%,75% { opacity:1; transform:translateY(9px) rotate(45deg) scale(1); } 90%,100% { opacity:0; transform:translateY(14px) rotate(45deg) scale(.78); } }
@keyframes mini-softener-beads { 0%,18% { opacity:0; transform:translateY(-7px); } 34%,74% { opacity:1; transform:translateY(8px); } 90%,100% { opacity:0; transform:translateY(15px); } }
@keyframes mini-chlorine-pass { 0%,15% { opacity:0; transform:translateX(0) scale(.7); background:#d3af5e; } 28% { opacity:1; } 72% { opacity:1; transform:translateX(50px) scale(1); background:#77c8df; } 88%,100% { opacity:0; transform:translateX(55px) scale(.72); background:#77c8df; } }
@keyframes mini-iron-capture { 0%,14% { opacity:0; transform:translateY(-6px); } 30%,62% { opacity:1; transform:translateY(10px); } 80%,100% { opacity:0; transform:translateY(28px) scale(.65); } }
@keyframes mini-uv-lamp { 0%,14%,100% { opacity:.6; box-shadow:0 0 5px rgba(65,181,248,.38); } 28%,78% { opacity:1; box-shadow:0 0 12px rgba(65,181,248,.85); } }
@keyframes mini-uv-sweep { 0%,22% { opacity:0; transform:translateY(-15px) scaleX(.7); } 38%,72% { opacity:1; transform:translateY(8px) scaleX(1); } 86%,100% { opacity:0; transform:translateY(12px) scaleX(.75); } }
@keyframes mini-uv-neutralize { 0%,20% { opacity:0; transform:translateY(4px) scale(.7); } 34%,56% { opacity:.9; transform:none; } 72%,100% { opacity:0; transform:translateY(-4px) scale(.12); filter:blur(2px); } }
.air-hepa::before { content:""; position:absolute; left:8px; right:8px; top:34px; height:1px; background:linear-gradient(90deg,rgba(151,121,78,.18),rgba(111,149,158,.58),rgba(92,180,203,.24)); }
.air-hepa::after { content:""; position:absolute; right:8px; top:27px; width:15px; height:14px; border-block:1px solid rgba(74,159,184,.42); }
.air-hepa i { left:31px; top:11px; z-index:2; width:21px; height:46px; border:1px solid rgba(255,253,248,.92); border-radius:5px; background:repeating-linear-gradient(90deg,rgba(255,255,255,.88) 0 3px,rgba(121,165,175,.48) 3px 5px); box-shadow:0 0 10px rgba(89,163,181,.18); }
.air-hepa b,.air-hepa em,.air-electrostatic b,.air-electrostatic em { width:5px; height:5px; border-radius:50%; background:#a57a67; box-shadow:0 0 5px rgba(115,78,63,.2); }.air-hepa b { left:9px; top:24px; }.air-hepa em { left:17px; top:41px; width:4px; height:4px; background:#be9a70; }
.air-uv-system::before { content:""; position:absolute; left:16px; top:22px; width:50px; height:34px; clip-path:polygon(8% 0,92% 0,100% 100%,0 100%); background:linear-gradient(180deg,rgba(74,190,255,.42),transparent); }
.air-uv-system::after { content:""; position:absolute; left:21px; top:43px; width:40px; height:2px; border-radius:999px; background:linear-gradient(90deg,transparent,rgba(226,252,255,.96),transparent); box-shadow:0 0 7px rgba(78,195,255,.68); }
.air-uv-system i { left:17px; top:16px; z-index:2; width:48px; height:7px; border:1px solid rgba(240,253,255,.96); border-radius:999px; background:linear-gradient(90deg,#4ab8ff,#fff 50%,#49adf4); box-shadow:0 0 9px rgba(65,181,248,.72); }
.air-uv-system b { left:37px; top:44px; width:8px; height:8px; border:1px dotted rgba(138,74,77,.58); border-radius:50%; background:#ca8a83; }
.air-hrv i,.air-erv i { left:22px; top:14px; z-index:2; width:38px; height:40px; border:1px solid rgba(255,253,248,.9); border-radius:9px; background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(171,157,128,.38)); box-shadow:inset 4px 3px 7px rgba(255,255,255,.46); }
.air-hrv i::before,.air-erv i::before { content:""; position:absolute; inset:8px; border:1px solid rgba(126,108,78,.28); border-radius:4px; background:linear-gradient(45deg,transparent 46%,rgba(125,159,166,.55) 47% 53%,transparent 54%),linear-gradient(-45deg,transparent 46%,rgba(181,145,91,.48) 47% 53%,transparent 54%); }
.air-hrv b,.air-hrv em,.air-erv b,.air-erv em { width:21px; height:3px; border-radius:999px; }.air-hrv b,.air-erv b { left:5px; top:24px; background:#75bdd0; }.air-hrv em,.air-erv em { right:5px; top:42px; background:#c9a66c; }
.air-hrv b::after,.air-erv b::after { content:""; position:absolute; right:-2px; top:-2px; border-left:5px solid #75bdd0; border-block:3px solid transparent; }.air-hrv em::before,.air-erv em::before { content:""; position:absolute; left:-2px; top:-2px; border-right:5px solid #c9a66c; border-block:3px solid transparent; }
.air-erv::after { content:""; position:absolute; left:38px; bottom:7px; width:7px; height:9px; border-radius:55% 45% 58% 42%; background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(89,180,205,.7)); transform:rotate(45deg); box-shadow:0 0 7px rgba(89,180,205,.28); }
.air-electrostatic::before { content:""; position:absolute; left:8px; right:8px; top:34px; height:1px; background:rgba(133,113,80,.28); }
.air-electrostatic i { left:35px; top:11px; z-index:2; width:12px; height:46px; border:1px solid rgba(255,253,248,.92); border-radius:4px; background:repeating-linear-gradient(180deg,rgba(255,255,255,.82) 0 3px,rgba(176,143,91,.52) 3px 5px); box-shadow:0 0 11px rgba(191,153,89,.2); }
.air-electrostatic i::before,.air-electrostatic i::after { position:absolute; left:15px; color:#9b7b49; font:600 10px/1 var(--sans); }.air-electrostatic i::before { content:"+"; top:5px; }.air-electrostatic i::after { content:"−"; bottom:5px; }
.air-electrostatic b { left:10px; top:23px; }.air-electrostatic em { left:17px; top:42px; width:4px; height:4px; background:#b58a63; }
.air-humidifier::before { content:""; position:absolute; left:13px; right:13px; bottom:11px; height:1px; background:rgba(143,116,75,.24); }
.air-humidifier i { left:25px; top:18px; width:33px; height:37px; border:1px solid rgba(255,253,248,.92); border-radius:7px 7px 10px 10px; background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(173,155,120,.4)); box-shadow:inset 4px 3px 6px rgba(255,255,255,.48); }
.air-humidifier i::after { content:""; position:absolute; inset:8px 6px 5px; border-radius:4px; background:repeating-linear-gradient(90deg,rgba(93,171,194,.34) 0 2px,transparent 2px 5px); }
.air-humidifier b { left:37px; top:21px; z-index:2; width:8px; height:10px; border-radius:55% 45% 58% 42%; background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(81,177,205,.72)); transform:rotate(45deg); }
.air-humidifier em { left:34px; top:12px; width:4px; height:4px; border-radius:50%; background:rgba(190,235,242,.78); box-shadow:8px -2px 0 rgba(190,235,242,.6),4px -8px 0 rgba(221,247,249,.68); }
@media (prefers-reduced-motion:no-preference) {
  .air-hepa b,.air-hepa em { animation:air-hepa-capture 4.2s ease-in-out infinite; }.air-hepa em { animation-delay:.7s; }
  .air-uv-system i { animation:air-mini-uv-lamp 4.3s ease-in-out infinite; }.air-uv-system::after { animation:air-mini-uv-sweep 4.3s ease-in-out infinite; }.air-uv-system b { animation:air-mini-uv-neutralize 4.3s ease-in-out infinite; }
  .air-hrv b,.air-hrv em,.air-erv b,.air-erv em { animation:air-vent-exchange 4.4s ease-in-out infinite; }.air-hrv em,.air-erv em { animation-direction:reverse; }
  .air-erv::after { animation:air-moisture-pulse 4.4s ease-in-out infinite; }
  .air-electrostatic b,.air-electrostatic em { animation:air-static-capture 4.1s ease-in-out infinite; }.air-electrostatic em { animation-delay:.65s; }
  .air-humidifier b { animation:air-humidifier-drop 4.2s ease-in-out infinite; }.air-humidifier em { animation:air-humidifier-mist 4.2s ease-in-out infinite; }
}
@keyframes air-hepa-capture { 0%,15% { opacity:0; transform:translateX(-5px) scale(.7); } 28% { opacity:.9; } 68% { opacity:.7; transform:translateX(22px) scale(.8); } 82%,100% { opacity:0; transform:translateX(27px) scale(.4); } }
@keyframes air-mini-uv-lamp { 0%,14%,100% { opacity:.58; box-shadow:0 0 5px rgba(65,181,248,.36); } 28%,78% { opacity:1; box-shadow:0 0 12px rgba(65,181,248,.82); } }
@keyframes air-mini-uv-sweep { 0%,22% { opacity:0; transform:translateY(-15px) scaleX(.7); } 38%,72% { opacity:1; transform:translateY(8px) scaleX(1); } 86%,100% { opacity:0; transform:translateY(12px) scaleX(.75); } }
@keyframes air-mini-uv-neutralize { 0%,20% { opacity:0; transform:translateY(4px) scale(.7); } 34%,56% { opacity:.9; transform:none; } 72%,100% { opacity:0; transform:translateY(-4px) scale(.12); filter:blur(2px); } }
@keyframes air-vent-exchange { 0%,15% { opacity:0; transform:translateX(-8px); } 30%,70% { opacity:1; transform:translateX(8px); } 86%,100% { opacity:0; transform:translateX(13px); } }
@keyframes air-moisture-pulse { 0%,18%,100% { opacity:.3; transform:rotate(45deg) scale(.7); } 40%,72% { opacity:1; transform:rotate(45deg) scale(1.08); } }
@keyframes air-static-capture { 0%,14% { opacity:0; transform:translateX(-7px) scale(.7); } 28% { opacity:.9; } 66% { opacity:.78; transform:translateX(20px) scale(.82); } 82%,100% { opacity:0; transform:translateX(25px) scale(.4); } }
@keyframes air-humidifier-drop { 0%,17% { opacity:0; transform:translateY(-6px) rotate(45deg) scale(.7); } 34%,70% { opacity:1; transform:translateY(11px) rotate(45deg) scale(1); } 86%,100% { opacity:0; transform:translateY(16px) rotate(45deg) scale(.75); } }
@keyframes air-humidifier-mist { 0%,26% { opacity:0; transform:translateY(5px) scale(.7); } 42%,72% { opacity:.86; transform:translateY(-4px) scale(1); } 88%,100% { opacity:0; transform:translateY(-11px) scale(1.08); } }

/* Water-heater lineup: warm glass illustrations with equipment-specific motion. */
.heater-tankless i { left:25px; top:10px; width:33px; height:49px; border:1px solid rgba(255,253,249,.94); border-radius:7px; background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(194,100,57,.5)); box-shadow:inset 5px 4px 7px rgba(255,255,255,.5),0 6px 11px rgba(128,67,41,.12); }
.heater-tankless i::before { content:""; position:absolute; left:8px; right:8px; top:9px; height:10px; border-radius:3px; background:#5c4540; box-shadow:inset 0 0 0 1px rgba(255,240,225,.32); }
.heater-tankless i::after { content:""; position:absolute; left:7px; right:7px; bottom:9px; height:14px; border-radius:4px; background:repeating-linear-gradient(180deg,rgba(108,65,49,.46) 0 2px,transparent 2px 5px); }
.heater-tankless b { left:15px; top:23px; width:10px; height:2px; border-radius:999px; background:#76b8c5; box-shadow:44px 18px 0 #e37c48; }
.heater-tankless em { left:36px; top:22px; width:11px; height:4px; border-radius:2px; background:#ef9d5e; box-shadow:0 0 8px rgba(238,120,55,.66); }
.heater-gas-tank i,.heater-electric-tank i { left:28px; top:8px; width:27px; height:52px; overflow:hidden; border:1px solid rgba(255,253,249,.94); border-radius:14px 14px 8px 8px; background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(184,98,61,.45)); box-shadow:inset 4px 3px 7px rgba(255,255,255,.48),0 6px 11px rgba(128,67,41,.11); }
.heater-gas-tank i::after,.heater-electric-tank i::after { content:""; position:absolute; left:4px; right:4px; bottom:5px; height:22px; border-radius:7px 7px 4px 4px; background:linear-gradient(180deg,rgba(255,194,139,.42),rgba(224,102,53,.58)); }
.heater-gas-tank b { left:35px; top:35px; z-index:2; width:13px; height:18px; border-radius:50% 50% 44% 44%; background:radial-gradient(circle at 50% 70%,#fff0a7 0 18%,#f79b4f 40%,#d94d2f 72%,transparent 74%); filter:drop-shadow(0 0 5px rgba(239,104,48,.5)); }
.heater-gas-tank em,.heater-electric-tank em { left:34px; top:12px; z-index:2; width:14px; height:3px; border-radius:999px; background:#8c6a5d; }
.heater-electric-tank i { background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(199,125,88,.42)); }
.heater-electric-tank b { left:37px; top:34px; z-index:2; width:9px; height:17px; background:#f6c45e; clip-path:polygon(58% 0,28% 43%,55% 43%,36% 100%,75% 39%,49% 39%); filter:drop-shadow(0 0 5px rgba(236,160,52,.58)); }
.heater-electric-tank em { background:#b8894d; box-shadow:0 0 7px rgba(239,173,73,.46); }
.heater-boiler i { left:20px; top:10px; width:34px; height:48px; border:1px solid rgba(255,253,249,.94); border-radius:7px; background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(171,88,54,.5)); box-shadow:inset 5px 4px 7px rgba(255,255,255,.48),0 6px 11px rgba(128,67,41,.12); }
.heater-boiler i::before { content:""; position:absolute; left:8px; right:8px; top:8px; height:8px; border-radius:3px; background:#60443d; }
.heater-boiler i::after { content:""; position:absolute; left:8px; right:8px; bottom:8px; height:17px; border-radius:4px; background:radial-gradient(circle at 50% 78%,#ffd18d,rgba(222,91,48,.76) 48%,rgba(87,58,52,.72) 75%); }
.heater-boiler b { left:54px; top:24px; width:20px; height:26px; border:2px solid rgba(188,99,61,.6); border-left:0; border-radius:0 8px 8px 0; }
.heater-boiler b::before,.heater-boiler b::after { content:""; position:absolute; right:2px; width:15px; height:2px; border-radius:999px; background:#e88957; }.heater-boiler b::before { top:6px; }.heater-boiler b::after { bottom:6px; }
.heater-boiler em { left:61px; top:30px; width:5px; height:5px; border-radius:50%; background:#ffd19a; box-shadow:0 0 7px rgba(238,119,58,.72); }
@media (prefers-reduced-motion:no-preference) {
  .heater-tankless em { animation:heater-mini-screen 4.2s ease-in-out infinite; }
  .heater-tankless b { animation:heater-mini-flow 4.2s ease-in-out infinite; }
  .heater-gas-tank b { animation:heater-mini-flame 3.4s ease-in-out infinite; }
  .heater-electric-tank b { animation:heater-mini-electric 3.8s ease-in-out infinite; }
  .heater-boiler em { animation:heater-mini-boiler-flow 4.4s ease-in-out infinite; }
  .heater-boiler b { animation:heater-mini-loop 4.4s ease-in-out infinite; }
}
@keyframes heater-mini-screen { 0%,14%,100% { opacity:.45; transform:scaleX(.4); } 35%,80% { opacity:1; transform:scaleX(1); } }
@keyframes heater-mini-flow { 0%,16%,100% { opacity:.3; transform:translateX(-4px); } 38%,76% { opacity:1; transform:translateX(4px); } }
@keyframes heater-mini-flame { 0%,100% { opacity:.62; transform:scale(.78); } 48% { opacity:1; transform:scale(1.08) translateY(-1px); } }
@keyframes heater-mini-electric { 0%,100% { opacity:.45; filter:drop-shadow(0 0 2px rgba(236,160,52,.3)); } 48% { opacity:1; filter:drop-shadow(0 0 7px rgba(236,160,52,.84)); } }
@keyframes heater-mini-boiler-flow { 0%,18%,100% { opacity:.25; transform:translateY(7px); } 42%,75% { opacity:1; transform:translateY(-7px); } }
@keyframes heater-mini-loop { 0%,100% { border-color:rgba(188,99,61,.3); filter:saturate(.7); } 45%,78% { border-color:rgba(232,118,67,.85); filter:saturate(1.2); } }
.focus-orb { position:absolute; inset:0 0 0 auto; width:290px; overflow:hidden; border-left:1px solid rgba(255,252,247,.7); background:linear-gradient(145deg,rgba(255,238,214,.88),rgba(244,191,139,.75)); }
.focus-orb::before,.focus-orb::after { content:""; position:absolute; border:1px solid rgba(143,86,51,.15); border-radius:50%; }
.focus-orb::before { width:390px; height:390px; right:-120px; top:-76px; }
.focus-orb::after { width:255px; height:255px; right:2px; top:6px; }
.water-test-animation,.air-test-animation,.category-animation { position:absolute; inset:0; display:grid; place-items:center; opacity:0; pointer-events:none; transition:opacity .28s ease; }
.ro-scene { position:relative; width:206px; height:250px; isolation:isolate; }
.ro-scene::before { content:""; position:absolute; z-index:-2; left:28px; top:14px; width:158px; height:158px; border-radius:50%; background:radial-gradient(circle,rgba(228,252,255,.72),rgba(111,204,232,.18) 48%,transparent 72%); filter:blur(15px); opacity:.76; }
.ro-scene::after { content:""; position:absolute; z-index:-1; left:32px; bottom:0; width:166px; height:18px; border-radius:50%; background:rgba(44,139,175,.18); filter:blur(9px); }
.ro-tap { position:absolute; left:3px; top:3px; width:200px; height:124px; filter:drop-shadow(0 13px 16px rgba(20,97,126,.14)); }
.ro-deck { position:absolute; z-index:3; left:25px; top:107px; width:78px; height:13px; border:1px solid rgba(247,254,255,.94); border-radius:4px; background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(140,211,235,.58)); box-shadow:inset 0 2px 3px rgba(255,255,255,.82),0 5px 10px rgba(38,112,146,.1); }
.ro-neck { position:absolute; z-index:2; left:47px; top:27px; width:15px; height:89px; border:1px solid rgba(246,254,255,.94); border-radius:4px; background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(134,208,234,.58)); box-shadow:inset 3px 0 4px rgba(255,255,255,.56); }
.ro-neck::before { content:""; position:absolute; left:5px; top:-1px; width:109px; height:15px; border:1px solid rgba(246,254,255,.95); border-radius:4px; background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(134,208,234,.6)); box-shadow:inset 0 3px 4px rgba(255,255,255,.72); }
.ro-neck::after { content:""; position:absolute; left:-3px; bottom:0; width:21px; height:10px; border:1px solid rgba(246,254,255,.9); border-radius:3px; background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(134,205,230,.58)); }
.ro-handle { position:absolute; z-index:5; left:18px; top:64px; width:33px; height:8px; border:1px solid rgba(246,254,255,.94); border-radius:3px; background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(138,210,234,.6)); box-shadow:inset 0 2px 3px rgba(255,255,255,.8),0 4px 7px rgba(39,116,149,.08); transform:rotate(-10deg); transform-origin:right center; }
.ro-handle::after { content:""; position:absolute; left:-7px; top:-4px; width:14px; height:14px; border:1px solid rgba(246,254,255,.95); border-radius:4px; background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(143,213,237,.76)); }
.ro-spout { position:absolute; z-index:4; left:155px; top:28px; width:17px; height:42px; border:1px solid rgba(246,254,255,.96); border-radius:4px; background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(128,204,231,.62)); box-shadow:inset 3px 0 4px rgba(255,255,255,.58); }
.ro-spout::after { content:""; position:absolute; right:-3px; bottom:-4px; width:21px; height:8px; border:1px solid rgba(246,254,255,.96); border-radius:3px; background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(98,188,220,.68)); }
.ro-stream { position:absolute; z-index:3; left:161px; top:72px; width:7px; height:82px; border-radius:999px; background:linear-gradient(90deg,rgba(255,255,255,.76),rgba(185,245,255,.98) 48%,rgba(54,162,201,.68)); box-shadow:0 0 11px rgba(208,251,255,.76); transform-origin:top center; }
.ro-stream::after { content:""; position:absolute; inset:2px 1px; border-radius:inherit; background:linear-gradient(180deg,rgba(255,255,255,.82),transparent 34%,rgba(255,255,255,.46) 70%,transparent); animation:ro-water-shimmer 1.2s linear infinite; }
.ro-glass { position:absolute; left:124px; top:143px; width:75px; height:107px; overflow:hidden; border:1.5px solid rgba(246,254,255,.94); border-radius:5px 5px 17px 17px; background:linear-gradient(110deg,rgba(255,255,255,.34),rgba(218,248,255,.08) 54%,rgba(255,255,255,.2)); box-shadow:inset 8px 0 13px rgba(255,255,255,.3),inset -7px -10px 16px rgba(76,169,201,.13),0 15px 25px rgba(25,102,135,.14); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); }
.ro-glass::before { content:""; position:absolute; z-index:4; left:4px; right:4px; top:5px; height:1px; border-radius:999px; background:rgba(255,255,255,.9); box-shadow:0 3px 8px rgba(167,234,249,.42); }
.ro-glass::after { content:""; position:absolute; z-index:5; top:14px; right:9px; width:4px; height:58px; border-radius:999px; background:linear-gradient(180deg,rgba(255,255,255,.68),transparent); opacity:.7; }
.ro-fill { position:absolute; left:-3%; bottom:-2%; width:106%; height:8%; border-radius:48% 48% 15px 15px; background:linear-gradient(180deg,rgba(213,253,255,.94),rgba(52,165,205,.88)); box-shadow:inset 0 8px 14px rgba(255,255,255,.38),0 -1px 8px rgba(185,245,255,.42); }
.ro-fill::after { content:""; position:absolute; left:-4%; top:-4px; width:108%; height:8px; border-radius:50%; background:linear-gradient(90deg,rgba(255,255,255,.62),rgba(188,246,255,.96),rgba(255,255,255,.62)); animation:ro-water-surface 1.4s ease-in-out infinite; }
.ro-bubble { position:absolute; z-index:2; width:6px; height:6px; border:1px solid rgba(255,255,255,.72); border-radius:50%; background:rgba(221,251,255,.38); opacity:0; }
.ro-bubble-one { left:18px; bottom:8px; }.ro-bubble-two { left:47px; bottom:7px; width:4px; height:4px; }
.solution-stage[data-focus="water"] .water-test-animation { opacity:1; }
.solution-stage[data-focus="water"] .ro-handle { animation:ro-handle-turn 6.4s cubic-bezier(.2,.72,.25,1) infinite; }
.solution-stage[data-focus="water"] .ro-stream { animation:ro-stream-flow 6.4s cubic-bezier(.2,.72,.25,1) infinite; }
.solution-stage[data-focus="water"] .ro-fill { animation:ro-glass-refill 6.4s cubic-bezier(.38,0,.2,1) infinite; }
.solution-stage[data-focus="water"] .ro-bubble { animation:ro-bubble-rise 6.4s ease-in infinite; }.solution-stage[data-focus="water"] .ro-bubble-two { animation-delay:.75s; }
@keyframes ro-handle-turn { 0%,10% { transform:rotate(-10deg); } 16%,82% { transform:rotate(0deg); } 90%,100% { transform:rotate(-10deg); } }
@keyframes ro-stream-flow { 0%,11% { opacity:0; transform:translateY(-3px) scaleY(.04); } 17%,80% { opacity:1; transform:translateY(0) scaleY(1); } 88%,100% { opacity:0; transform:translateY(0) scaleY(.08); } }
@keyframes ro-glass-refill { 0%,12% { height:8%; opacity:0; } 16% { height:10%; opacity:1; } 76% { height:72%; opacity:1; } 84%,91% { height:74%; opacity:1; } 95% { height:74%; opacity:0; } 96%,100% { height:8%; opacity:0; } }
@keyframes ro-bubble-rise { 0%,44% { transform:translateY(0) scale(.5); opacity:0; } 51% { opacity:.62; } 76%,100% { transform:translateY(-38px) scale(.9); opacity:0; } }
@keyframes ro-water-surface { 0%,100% { transform:translateX(-2px) scaleX(.97); } 50% { transform:translateX(2px) scaleX(1.03); } }
@keyframes ro-water-shimmer { 0% { opacity:.18; transform:translateY(-8px); } 50% { opacity:.74; } 100% { opacity:.18; transform:translateY(18px); } }
.solution-stage[data-focus="air"] .focus-orb { background:linear-gradient(145deg,rgba(251,247,240,.94),rgba(220,204,176,.72)); }
.uv-scene { position:relative; width:216px; height:208px; display:grid; place-items:center; isolation:isolate; }
.uv-scene::before { content:""; position:absolute; z-index:-2; left:-8px; top:7px; width:232px; height:174px; border-radius:50%; background:radial-gradient(circle,rgba(118,211,255,.32),rgba(87,186,242,.12) 45%,transparent 72%); filter:blur(15px); opacity:.84; }
.uv-scene::after { content:""; position:absolute; z-index:-1; left:20px; bottom:1px; width:176px; height:18px; border-radius:50%; background:rgba(91,72,43,.15); filter:blur(9px); }
.uv-chamber { position:relative; isolation:isolate; width:204px; height:190px; overflow:hidden; border:1px solid rgba(255,254,249,.92); border-radius:25px; background:linear-gradient(150deg,rgba(255,255,255,.68),rgba(241,235,222,.42)),radial-gradient(circle at 50% 28%,rgba(127,215,255,.38),transparent 58%); box-shadow:inset 10px 9px 18px rgba(255,255,255,.62),inset -10px -14px 21px rgba(103,79,43,.11),0 18px 30px rgba(88,68,37,.12); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); }
.uv-chamber::before { content:""; position:absolute; z-index:7; left:22px; top:16px; width:160px; height:52px; border:1px solid rgba(225,246,255,.25); border-radius:11px; background:linear-gradient(145deg,#193446,#0a1d2a 68%,#06141e); box-shadow:inset 0 3px 7px rgba(255,255,255,.08),0 9px 17px rgba(12,42,59,.2); }
.uv-chamber::after { content:""; position:absolute; z-index:10; inset:9px; border:1px solid rgba(255,255,255,.54); border-radius:18px; background:linear-gradient(112deg,rgba(255,255,255,.17),transparent 25%,transparent 77%,rgba(255,255,255,.09)); pointer-events:none; }
.uv-lamp { position:absolute; z-index:9; left:42px; top:34px; width:120px; height:10px; border:1px solid rgba(240,253,255,.98); border-radius:999px; background:linear-gradient(90deg,#4ab8ff,#c5f5ff 20%,#fff 50%,#b1edff 80%,#49adf4); box-shadow:0 0 10px rgba(74,196,255,.9),0 0 27px rgba(47,164,255,.58),inset 0 2px 4px white; }
.uv-lamp::before,.uv-lamp::after { content:""; position:absolute; top:-3px; width:12px; height:14px; border:1px solid rgba(228,249,255,.68); border-radius:3px; background:linear-gradient(180deg,#37677f,#173549); box-shadow:inset 0 1px 2px rgba(255,255,255,.18); }.uv-lamp::before { left:-7px; }.uv-lamp::after { right:-7px; }
.uv-beam { position:absolute; z-index:2; left:42px; top:54px; width:120px; height:122px; clip-path:polygon(10% 0,90% 0,100% 100%,0 100%); background:linear-gradient(180deg,rgba(72,190,255,.52),rgba(91,201,255,.2) 56%,transparent); transform:scaleY(.15); transform-origin:top center; opacity:.04; }
.uv-beam::before,.uv-beam::after { content:""; position:absolute; top:0; bottom:4px; width:1px; background:linear-gradient(180deg,rgba(224,250,255,.92),rgba(108,210,255,.34),transparent); box-shadow:0 0 8px rgba(85,198,255,.64); }.uv-beam::before { left:33%; }.uv-beam::after { right:33%; }
.uv-clean-wave { position:absolute; z-index:4; left:50px; top:59px; width:104px; height:3px; border-radius:999px; background:linear-gradient(90deg,transparent,rgba(232,253,255,.98),transparent); box-shadow:0 0 7px rgba(97,211,255,.92),0 0 15px rgba(41,168,255,.72); opacity:0; }
.uv-particle { position:absolute; z-index:3; display:block; opacity:0; background:rgba(163,96,86,.7); box-shadow:0 0 8px rgba(137,79,69,.22); }
.uv-virus { width:15px; height:15px; border:1px dotted rgba(120,61,67,.64); border-radius:50%; background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.82),rgba(211,125,120,.86) 46%,rgba(128,64,72,.82)); outline:2px dotted rgba(139,74,77,.44); outline-offset:1px; }
.uv-bacteria { width:22px; height:9px; border-radius:999px; background:linear-gradient(90deg,rgba(177,116,68,.82),rgba(250,222,166,.88),rgba(160,92,61,.84)); }
.uv-bacteria::before,.uv-bacteria::after { content:""; position:absolute; top:3px; width:7px; height:3px; border-top:1px solid rgba(137,75,55,.62); border-radius:50%; }.uv-bacteria::before { left:-6px; transform:rotate(22deg); }.uv-bacteria::after { right:-6px; transform:rotate(-22deg); }
.uv-virus-one { left:61px; top:96px; }.uv-virus-two { left:139px; top:115px; width:12px; height:12px; }.uv-bacteria-one { left:91px; top:146px; }
.solution-stage[data-focus="air"] .air-test-animation { opacity:1; }
.uv-chamber.pulse { animation:uv-chamber-arrive .65s cubic-bezier(.16,.82,.25,1) both; }
.uv-chamber.pulse .uv-lamp { animation:uv-lamp-ignite 6.4s ease-in-out infinite; }
.uv-chamber.pulse .uv-beam { animation:uv-beam-sweep 6.4s cubic-bezier(.2,.72,.25,1) infinite; }
.uv-chamber.pulse .uv-clean-wave { animation:uv-clean-sweep 6.4s cubic-bezier(.2,.72,.25,1) infinite; }
.uv-chamber.pulse .uv-particle { animation:uv-neutralize 6.4s cubic-bezier(.22,.7,.25,1) infinite both; }.uv-chamber.pulse .uv-virus-two { animation-delay:.22s; }.uv-chamber.pulse .uv-bacteria-one { animation-delay:.44s; }
@keyframes uv-chamber-arrive { from { opacity:0; transform:scale(.92) translateY(8px); } to { opacity:1; transform:scale(1) translateY(0); } }
@keyframes uv-lamp-ignite { 0%,10% { opacity:.56; box-shadow:0 0 7px rgba(74,196,255,.5),0 0 16px rgba(47,164,255,.2),inset 0 2px 4px white; } 18%,80% { opacity:1; box-shadow:0 0 14px rgba(125,227,255,.96),0 0 35px rgba(40,162,255,.7),inset 0 2px 4px white; } 90%,100% { opacity:.64; box-shadow:0 0 9px rgba(74,196,255,.64),0 0 21px rgba(47,164,255,.34),inset 0 2px 4px white; } }
@keyframes uv-beam-sweep { 0%,12% { opacity:.03; transform:scaleY(.12); } 20%,80% { opacity:.74; transform:scaleY(1); } 90%,100% { opacity:.05; transform:scaleY(.18); } }
@keyframes uv-clean-sweep { 0%,20% { opacity:0; transform:translateY(0) scaleX(.7); } 30% { opacity:.94; } 72% { opacity:.84; transform:translateY(98px) scaleX(1); } 82%,100% { opacity:0; transform:translateY(108px) scaleX(.75); } }
@keyframes uv-neutralize { 0%,16% { opacity:0; transform:translateY(7px) scale(.72); filter:blur(0); } 25%,48% { opacity:.86; transform:translateY(0) scale(1); filter:blur(0); } 58% { opacity:.72; transform:translateY(-2px) scale(.92); box-shadow:0 0 12px rgba(88,202,255,.68); } 72%,100% { opacity:0; transform:translateY(-7px) scale(.18); filter:blur(2px); box-shadow:0 0 15px rgba(78,197,255,.34); } }

/* Category scenes: equipment-specific illustrations built with lightweight CSS shapes. */
.generator-scene,.ev-scene,.water-heater-scene,.hvac-scene { position:relative; width:230px; height:220px; isolation:isolate; }
.generator-scene::after,.ev-scene::after,.water-heater-scene::after,.hvac-scene::after { content:""; position:absolute; z-index:-1; left:18px; right:10px; bottom:7px; height:18px; border-radius:50%; background:rgba(39,57,63,.14); filter:blur(10px); }
.solution-stage[data-focus="generator"] .generator-animation,.solution-stage[data-focus="ev"] .ev-animation,.solution-stage[data-focus="water-heater"] .water-heater-animation,.solution-stage[data-focus="hvac"] .hvac-animation { opacity:1; }
.solution-stage[data-focus="generator"] .focus-orb { background:linear-gradient(145deg,rgba(229,232,231,.97),rgba(48,57,61,.92)); }
.solution-stage[data-focus="ev"] .focus-orb { background:linear-gradient(145deg,rgba(235,255,249,.96),rgba(103,205,176,.7)); }
.solution-stage[data-focus="water-heater"] .focus-orb { background:linear-gradient(145deg,rgba(255,247,240,.96),rgba(239,165,115,.72)); }
.solution-stage[data-focus="hvac"] .focus-orb { background:linear-gradient(145deg,rgba(241,247,255,.96),rgba(144,176,224,.74)); }

.generator-home { position:absolute; left:10px; bottom:30px; width:128px; height:104px; border:1px solid rgba(255,255,255,.88); border-radius:8px 8px 13px 13px; background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(153,162,165,.64)); box-shadow:inset 8px 7px 13px rgba(255,255,255,.48),0 14px 26px rgba(21,27,30,.23); }
.generator-roof { position:absolute; left:-12px; top:-57px; width:152px; height:70px; clip-path:polygon(50% 0,100% 86%,92% 100%,50% 28%,8% 100%,0 86%); background:linear-gradient(145deg,rgba(132,143,147,.94),rgba(28,34,37,.96)); filter:drop-shadow(0 5px 6px rgba(11,15,17,.28)); }
.generator-window { position:absolute; top:32px; width:29px; height:32px; border:1px solid rgba(255,255,255,.92); border-radius:5px; background:linear-gradient(145deg,rgba(255,252,211,.99),rgba(248,205,43,.9)); box-shadow:0 0 17px rgba(255,207,35,.64),inset 0 0 0 4px rgba(255,255,255,.22); }
.generator-window::after { content:""; position:absolute; inset:50% -1px auto; height:1px; background:rgba(89,68,0,.32); }.generator-window.window-one { left:16px; }.generator-window.window-two { right:16px; }
.generator-door { position:absolute; left:51px; bottom:0; width:27px; height:46px; border:1px solid rgba(255,255,255,.82); border-radius:5px 5px 0 0; background:linear-gradient(90deg,rgba(226,231,232,.76),rgba(48,57,61,.78)); }
.generator-unit { position:absolute; z-index:3; right:3px; bottom:25px; width:76px; height:92px; border:1px solid rgba(230,234,235,.82); border-radius:13px; background:linear-gradient(145deg,rgba(116,127,131,.92),rgba(22,28,31,.98)); box-shadow:inset 7px 6px 12px rgba(255,255,255,.18),0 15px 25px rgba(10,14,16,.34); }
.generator-vents { position:absolute; left:12px; right:12px; top:22px; height:35px; border-radius:5px; background:repeating-linear-gradient(180deg,rgba(36,49,46,.62) 0 2px,transparent 2px 6px); }
.generator-status { position:absolute; right:9px; top:9px; width:7px; height:7px; border-radius:50%; background:#ffd733; box-shadow:0 0 8px rgba(255,211,35,.9); }
.generator-unit em { position:absolute; left:10px; bottom:10px; color:rgba(250,249,236,.86); font:700 6px var(--mono); letter-spacing:.12em; }
.generator-cable { position:absolute; z-index:2; left:119px; bottom:48px; width:39px; height:45px; border-right:3px solid rgba(76,88,80,.58); border-bottom:3px solid rgba(76,88,80,.58); border-radius:0 0 16px; }
.generator-power-pulse { position:absolute; z-index:4; left:126px; bottom:50px; width:8px; height:8px; border-radius:50%; background:#ffed72; box-shadow:0 0 6px #fff,0 0 15px rgba(255,205,28,.98); opacity:0; }
.solution-stage[data-focus="generator"] .generator-scene { animation:category-scene-arrive .58s cubic-bezier(.16,.82,.25,1) both; }
.solution-stage[data-focus="generator"] .generator-window { animation:generator-home-light 5.8s ease-in-out infinite; }.solution-stage[data-focus="generator"] .window-two { animation-delay:.16s; }
.solution-stage[data-focus="generator"] .generator-status { animation:generator-status 2s ease-in-out infinite; }
.solution-stage[data-focus="generator"] .generator-unit { animation:generator-hum 5.8s ease-in-out infinite; }
.solution-stage[data-focus="generator"] .generator-power-pulse { animation:generator-power-run 5.8s cubic-bezier(.3,.7,.25,1) infinite; }

.ev-wall { position:absolute; left:13px; top:18px; width:67px; height:132px; border:1px solid rgba(255,255,255,.9); border-radius:16px; background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(133,201,181,.46)); box-shadow:inset 7px 7px 13px rgba(255,255,255,.54),0 13px 23px rgba(27,93,77,.13); }
.ev-wall::after { content:""; position:absolute; left:10px; right:10px; bottom:9px; height:4px; border-radius:999px; background:rgba(44,115,96,.2); }
.ev-charger { position:absolute; left:11px; top:14px; width:45px; height:73px; border:1px solid rgba(255,255,255,.96); border-radius:14px; background:linear-gradient(155deg,rgba(255,255,255,.96),rgba(45,128,107,.78)); box-shadow:0 10px 18px rgba(35,100,86,.2),inset 4px 4px 7px rgba(255,255,255,.46); }
.ev-charger i { position:absolute; left:10px; top:11px; width:25px; height:16px; overflow:hidden; border:1px solid rgba(221,255,245,.28); border-radius:5px; background:#113b3c; box-shadow:inset 0 0 8px rgba(109,255,208,.24); }
.ev-charger i::after { content:""; position:absolute; left:4px; top:6px; width:17px; height:4px; border-radius:99px; background:linear-gradient(90deg,#63eaa1,#c7ffe0); box-shadow:0 0 9px rgba(80,255,180,.78); transform-origin:left; }
.ev-charger b { position:absolute; left:16px; bottom:17px; width:13px; height:13px; border:2px solid rgba(237,255,249,.94); border-radius:50%; box-shadow:inset 0 0 0 3px rgba(42,116,98,.56); }
.ev-charger em { position:absolute; left:0; right:0; bottom:5px; color:rgba(235,255,250,.88); font:700 5.5px var(--mono); letter-spacing:.06em; text-align:center; }
.ev-cable { position:absolute; z-index:2; left:51px; top:86px; width:32px; height:58px; border-left:4px solid rgba(25,66,61,.78); border-bottom:4px solid rgba(25,66,61,.78); border-radius:0 0 0 30px; filter:drop-shadow(0 2px 2px rgba(16,57,48,.14)); transform:rotate(-4deg); transform-origin:left top; }
.ev-car { position:absolute; z-index:3; right:-1px; bottom:38px; width:168px; height:60px; border:1px solid rgba(255,255,255,.96); border-radius:46px 52px 18px 18px; background:linear-gradient(155deg,rgba(255,255,255,.98) 0 22%,rgba(111,197,179,.9) 56%,rgba(37,125,110,.88) 100%); box-shadow:inset 9px 7px 13px rgba(255,255,255,.48),inset -7px -9px 12px rgba(30,102,88,.12),0 16px 27px rgba(25,83,71,.2); }
.ev-car::before { content:""; position:absolute; left:8px; right:8px; bottom:8px; height:10px; border-radius:8px; background:linear-gradient(90deg,rgba(31,101,89,.24),rgba(245,255,252,.18),rgba(20,79,69,.35)); }
.ev-car::after { content:""; position:absolute; right:-3px; bottom:10px; width:23px; height:8px; border-radius:2px 9px 9px 2px; background:rgba(28,91,80,.46); }
.ev-cabin { position:absolute; z-index:1; left:31px; top:-38px; width:107px; height:47px; clip-path:polygon(0 100%,19% 20%,30% 3%,76% 3%,100% 100%); border-radius:25px 34px 0 0; background:linear-gradient(145deg,rgba(239,255,252,.98),rgba(67,135,134,.92)); filter:drop-shadow(0 -1px 0 rgba(255,255,255,.84)); }
.ev-window { position:absolute; top:8px; height:31px; background:linear-gradient(150deg,rgba(210,249,246,.96),rgba(35,80,91,.82)); box-shadow:inset 2px 2px 4px rgba(255,255,255,.22); }
.ev-window-rear { left:18px; width:35px; clip-path:polygon(25% 0,100% 0,100% 100%,0 100%); }
.ev-window-front { right:9px; width:43px; clip-path:polygon(0 0,64% 0,100% 100%,0 100%); }
.ev-body-line { position:absolute; left:64px; top:13px; width:51px; height:1px; background:linear-gradient(90deg,rgba(255,255,255,.68),rgba(25,105,91,.22)); box-shadow:0 19px 0 rgba(26,104,90,.22); }
.ev-body-line::after { content:""; position:absolute; right:3px; top:6px; width:13px; height:3px; border-radius:999px; background:rgba(241,255,251,.65); }
.ev-headlight,.ev-taillight { position:absolute; z-index:6; top:21px; width:12px; height:8px; border:1px solid rgba(255,255,255,.72); }
.ev-headlight { right:1px; border-radius:7px 10px 3px 7px; background:#eaffca; box-shadow:5px 0 13px rgba(219,255,154,.68); }
.ev-taillight { left:0; width:8px; border-radius:3px 6px 6px 3px; background:#ff8279; box-shadow:-3px 0 8px rgba(255,91,82,.4); }
.ev-wheel { position:absolute; z-index:7; bottom:-15px; width:34px; height:34px; border:7px solid #263e3b; border-radius:50%; background:radial-gradient(circle,#eefaf7 0 16%,#79aa9f 18% 35%,#dcefeb 37% 51%,#365a53 53%); box-shadow:0 3px 6px rgba(18,57,49,.22),inset 0 0 0 1px rgba(255,255,255,.58); }.ev-wheel.wheel-one { left:25px; }.ev-wheel.wheel-two { right:24px; }
.ev-battery { position:absolute; right:42px; top:14px; width:40px; height:17px; padding:2px; border:1px solid rgba(234,255,248,.92); border-radius:5px; background:rgba(15,67,61,.64); box-shadow:inset 0 0 7px rgba(91,234,176,.16); }
.ev-battery::after { content:""; position:absolute; right:-5px; top:4px; width:4px; height:8px; border-radius:0 2px 2px 0; background:rgba(234,255,248,.88); }
.ev-battery i { display:block; width:12%; height:100%; border-radius:3px; background:linear-gradient(90deg,#58df91,#c9ffdc); box-shadow:0 0 9px rgba(96,244,159,.72); }
.ev-battery b { position:absolute; top:3px; bottom:3px; width:1px; background:rgba(233,255,246,.34); }.ev-battery b:nth-of-type(1) { left:25%; }.ev-battery b:nth-of-type(2) { left:50%; }.ev-battery b:nth-of-type(3) { left:75%; }
.ev-charge-port { position:absolute; z-index:7; left:10px; top:12px; width:18px; height:18px; display:grid; place-items:center; border:2px solid rgba(235,255,249,.9); border-radius:50%; background:rgba(24,86,75,.72); box-shadow:0 0 0 3px rgba(111,229,188,.16); }
.ev-charge-port i { width:6px; height:6px; border-radius:50%; background:#8dffc3; box-shadow:0 0 8px rgba(91,255,174,.86); }
.ev-door-handle { position:absolute; left:70px; top:20px; width:15px; height:3px; border-radius:999px; background:rgba(244,255,251,.74); box-shadow:0 1px 2px rgba(25,89,76,.2); }
.ev-power-pulse { position:absolute; z-index:8; left:52px; top:88px; width:7px; height:7px; border-radius:50%; background:#b7ffda; box-shadow:0 0 7px white,0 0 15px rgba(76,243,159,.92); opacity:0; }
.solution-stage[data-focus="ev"] .ev-scene { animation:category-scene-arrive .58s cubic-bezier(.16,.82,.25,1) both; }
.solution-stage[data-focus="ev"] .ev-car { animation:ev-car-park .78s cubic-bezier(.16,.86,.24,1) both; }
.solution-stage[data-focus="ev"] .ev-wheel { animation:ev-wheel-park .78s cubic-bezier(.16,.86,.24,1) both; }
.solution-stage[data-focus="ev"] .ev-charger i::after { animation:ev-screen-charge 6.2s ease-in-out infinite; }
.solution-stage[data-focus="ev"] .ev-charger b { animation:ev-charger-ready 2.2s ease-in-out infinite; }
.solution-stage[data-focus="ev"] .ev-cable { animation:ev-cable-live 6.2s ease-in-out infinite; }
.solution-stage[data-focus="ev"] .ev-battery i { animation:ev-battery-fill 6.2s cubic-bezier(.3,.7,.25,1) infinite; }
.solution-stage[data-focus="ev"] .ev-battery { animation:ev-battery-glow 6.2s ease-in-out infinite; }
.solution-stage[data-focus="ev"] .ev-charge-port i { animation:ev-port-ready 2s ease-in-out infinite; }
.solution-stage[data-focus="ev"] .ev-headlight { animation:ev-headlight-on 6.2s ease-in-out infinite; }
.solution-stage[data-focus="ev"] .ev-power-pulse { animation:ev-power-run 6.2s cubic-bezier(.36,.64,.28,1) infinite; }.solution-stage[data-focus="ev"] .pulse-two { animation-delay:.46s; }.solution-stage[data-focus="ev"] .pulse-three { animation-delay:.92s; }

.heater-pipe { position:absolute; z-index:1; top:10px; width:12px; height:68px; border:1px solid rgba(255,255,255,.94); border-radius:6px 6px 0 0; background:linear-gradient(90deg,rgba(255,255,255,.92),rgba(128,139,141,.58)); box-shadow:inset 3px 0 4px rgba(255,255,255,.48); }.heater-pipe::after { content:""; position:absolute; left:-4px; bottom:0; width:18px; height:8px; border:1px solid rgba(255,255,255,.9); border-radius:4px; background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(135,131,126,.56)); }.heater-pipe.pipe-in { left:78px; }.heater-pipe.pipe-out { right:78px; }
.heater-pipe b { position:absolute; z-index:3; left:2px; top:-7px; width:6px; height:9px; border-radius:55% 45% 58% 42%; opacity:0; transform:rotate(45deg); }.heater-pipe.pipe-in b { background:linear-gradient(135deg,#eefcff,#72c9df); box-shadow:0 0 9px rgba(97,203,233,.72); }.heater-pipe.pipe-out b { top:auto; bottom:0; background:linear-gradient(135deg,#fff3d8,#f58b4f); box-shadow:0 0 9px rgba(242,116,61,.76); }
.heater-pipe-label { position:absolute; z-index:4; top:0; color:rgba(91,74,67,.72); font:700 5.5px var(--mono); letter-spacing:.06em; }.heater-pipe-label.label-cold { left:58px; }.heater-pipe-label.label-hot { right:57px; }
.heater-tank { position:absolute; z-index:2; left:60px; bottom:18px; width:110px; height:170px; overflow:hidden; border:1px solid rgba(255,255,255,.96); border-radius:55px 55px 25px 25px; background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(181,101,66,.56)); box-shadow:inset 13px 9px 19px rgba(255,255,255,.5),inset -11px -14px 20px rgba(117,53,31,.11),0 18px 30px rgba(114,63,39,.18); }
.heater-tank::before { content:""; position:absolute; z-index:4; left:9px; right:9px; top:8px; height:22px; border-radius:50%; border-top:1px solid rgba(255,255,255,.9); box-shadow:0 -1px 0 rgba(128,70,48,.08); }
.heater-tank::after { content:""; position:absolute; z-index:4; left:8px; right:8px; bottom:8px; height:14px; border-radius:50%; border-bottom:1px solid rgba(95,48,34,.18); }
.heater-top-seam { position:absolute; z-index:5; left:20px; right:20px; top:25px; height:1px; background:linear-gradient(90deg,transparent,rgba(134,73,49,.24),transparent); }
.heater-water { position:absolute; z-index:1; left:0; right:0; bottom:0; height:72%; background:linear-gradient(180deg,rgba(255,216,177,.76),rgba(232,112,61,.67) 48%,rgba(102,184,205,.52) 100%); background-size:100% 180%; background-position:0 92%; box-shadow:inset 0 14px 20px rgba(255,243,226,.28); }
.heater-water::before { content:""; position:absolute; left:-5px; right:-5px; top:-7px; height:15px; border-radius:50%; background:rgba(218,240,233,.7); box-shadow:0 0 12px rgba(255,165,91,.26); }
.heater-gauge { position:absolute; z-index:6; right:15px; top:42px; width:32px; height:32px; border:2px solid rgba(255,255,255,.88); border-radius:50%; background:radial-gradient(circle,rgba(255,252,245,.86) 0 47%,rgba(103,66,55,.3) 50% 55%,rgba(255,255,255,.42) 57%); box-shadow:0 5px 10px rgba(104,55,38,.13); }
.heater-gauge::before { content:""; position:absolute; inset:5px; border-radius:50%; border-top:2px solid #de7650; border-left:2px solid #7cbcca; transform:rotate(45deg); }
.heater-gauge i { position:absolute; z-index:2; left:50%; top:50%; width:12px; height:2px; border-radius:999px; background:#984c35; transform:rotate(-48deg); transform-origin:left center; }
.heater-gauge em { position:absolute; z-index:3; left:50%; top:50%; width:5px; height:5px; border-radius:50%; background:#72493d; transform:translate(-50%,-50%); box-shadow:0 0 0 2px rgba(255,255,255,.66); }
.heater-burner { position:absolute; z-index:6; left:17px; bottom:27px; width:48px; height:37px; overflow:hidden; border:1px solid rgba(255,244,235,.72); border-radius:10px; background:radial-gradient(circle at 50% 90%,rgba(255,169,83,.4),rgba(91,55,50,.74) 72%); box-shadow:inset 0 0 0 3px rgba(255,255,255,.08); }
.heater-burner i { position:absolute; left:15px; bottom:5px; width:18px; height:25px; border-radius:60% 40% 58% 42%; background:radial-gradient(circle at 50% 76%,#fff2a8 0 16%,#f7a14d 35%,#e65d35 62%,transparent 65%); filter:drop-shadow(0 0 7px rgba(240,105,48,.62)); }
.heater-status { position:absolute; z-index:6; left:18px; top:47px; display:flex; align-items:center; gap:4px; color:rgba(92,59,49,.78); font:700 5.5px var(--mono); letter-spacing:.06em; }.heater-status i { width:6px; height:6px; display:block; border-radius:50%; background:#e89555; box-shadow:0 0 7px rgba(235,117,61,.48); }
.heater-tank > strong { position:absolute; z-index:6; left:18px; bottom:13px; color:rgba(255,248,239,.9); font:700 7px var(--mono); letter-spacing:.11em; }
.heat-wave { position:absolute; z-index:7; top:2px; width:18px; height:50px; border-left:2px solid rgba(255,244,229,.84); border-radius:50%; opacity:0; }.heat-wave.wave-one { left:91px; }.heat-wave.wave-two { left:112px; top:5px; }.heat-wave.wave-three { left:133px; }
.solution-stage[data-focus="water-heater"] .water-heater-scene { animation:category-scene-arrive .58s cubic-bezier(.16,.82,.25,1) both; }
.solution-stage[data-focus="water-heater"] .heater-tank { animation:heater-tank-warm 6.8s ease-in-out infinite; }
.solution-stage[data-focus="water-heater"] .heater-water { animation:heater-water-warm 6.8s ease-in-out infinite; }
.solution-stage[data-focus="water-heater"] .pipe-in b { animation:heater-cold-flow 6.8s cubic-bezier(.3,.7,.25,1) infinite; }
.solution-stage[data-focus="water-heater"] .pipe-out b { animation:heater-hot-flow 6.8s cubic-bezier(.3,.7,.25,1) infinite; }
.solution-stage[data-focus="water-heater"] .heater-burner i { animation:heater-burner-fire 6.8s ease-in-out infinite; }
.solution-stage[data-focus="water-heater"] .heater-gauge i { animation:heater-gauge-rise 6.8s cubic-bezier(.3,.7,.25,1) infinite; }
.solution-stage[data-focus="water-heater"] .heater-status i { animation:heater-status-pulse 1.5s ease-in-out infinite; }
.solution-stage[data-focus="water-heater"] .heat-wave { animation:heater-heat-wave 3.4s ease-in-out infinite; }.solution-stage[data-focus="water-heater"] .wave-two { animation-delay:.48s; }.solution-stage[data-focus="water-heater"] .wave-three { animation-delay:.96s; }

.hvac-outdoor { position:absolute; z-index:3; left:3px; bottom:43px; width:105px; height:103px; border:1px solid rgba(255,255,255,.94); border-radius:15px; background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(89,124,164,.62)); box-shadow:inset 8px 7px 14px rgba(255,255,255,.45),0 16px 26px rgba(43,69,104,.16); }
.hvac-fan { position:absolute; left:20px; top:16px; width:64px; height:64px; border:6px solid rgba(230,245,255,.78); border-radius:50%; background:conic-gradient(from 15deg,rgba(30,61,86,.76) 0 13%,transparent 13% 25%,rgba(30,61,86,.76) 25% 38%,transparent 38% 50%,rgba(30,61,86,.76) 50% 63%,transparent 63% 75%,rgba(30,61,86,.76) 75% 88%,transparent 88%); box-shadow:inset 0 0 0 6px rgba(220,240,252,.2); }
.hvac-fan::after { content:""; position:absolute; left:50%; top:50%; width:14px; height:14px; border:3px solid rgba(240,250,255,.88); border-radius:50%; background:#4b6f8e; transform:translate(-50%,-50%); }
.hvac-grille { position:absolute; inset:9px; border:1px solid rgba(231,247,255,.36); border-radius:11px; }
.hvac-outdoor em,.hvac-furnace em { position:absolute; left:10px; bottom:7px; color:rgba(239,248,255,.86); font:700 6px var(--mono); letter-spacing:.09em; }
.hvac-furnace { position:absolute; z-index:3; right:5px; bottom:39px; width:77px; height:129px; border:1px solid rgba(255,255,255,.94); border-radius:13px; background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(129,115,121,.6)); box-shadow:inset 7px 7px 13px rgba(255,255,255,.42),0 16px 26px rgba(56,55,75,.15); }
.furnace-glow { position:absolute; left:13px; right:13px; top:18px; height:47px; border:1px solid rgba(255,246,235,.65); border-radius:8px; background:radial-gradient(circle at 50% 80%,rgba(255,177,95,.94),rgba(208,83,53,.48) 48%,rgba(45,58,78,.72) 74%); box-shadow:0 0 15px rgba(239,111,61,.36); }
.furnace-vent { position:absolute; left:14px; right:14px; top:79px; height:23px; border-radius:4px; background:repeating-linear-gradient(180deg,rgba(44,54,68,.54) 0 2px,transparent 2px 6px); }
.hvac-line { position:absolute; z-index:1; left:102px; bottom:76px; width:57px; height:35px; border-top:3px solid rgba(74,93,121,.5); border-right:3px solid rgba(74,93,121,.5); border-radius:0 13px 0 0; }
.hvac-flow { position:absolute; z-index:4; left:105px; bottom:105px; width:8px; height:8px; border-radius:50%; opacity:0; }.cool-flow { background:#b5efff; box-shadow:0 0 8px white,0 0 14px rgba(80,200,255,.82); }.warm-flow { background:#ffd097; box-shadow:0 0 8px white,0 0 14px rgba(255,133,74,.8); }
.hvac-labels { position:absolute; left:5px; right:3px; bottom:3px; display:flex; justify-content:space-between; gap:5px; }
.hvac-labels span { padding:5px 6px; border:1px solid rgba(255,255,255,.62); border-radius:99px; background:rgba(248,252,255,.38); color:#43546d; font:700 5.5px var(--mono); letter-spacing:.06em; }
.solution-stage[data-focus="hvac"] .hvac-scene { animation:category-scene-arrive .58s cubic-bezier(.16,.82,.25,1) both; }
.solution-stage[data-focus="hvac"] .hvac-fan { animation:hvac-fan-spin 3.2s linear infinite; }
.solution-stage[data-focus="hvac"] .furnace-glow { animation:hvac-furnace-glow 5.8s ease-in-out infinite; }
.solution-stage[data-focus="hvac"] .cool-flow { animation:hvac-cool-flow 5.8s ease-in-out infinite; }
.solution-stage[data-focus="hvac"] .warm-flow { animation:hvac-warm-flow 5.8s ease-in-out infinite; }

@keyframes category-scene-arrive { from { opacity:0; transform:translateY(9px) scale(.93); } to { opacity:1; transform:none; } }
@keyframes generator-home-light { 0%,12%,100% { opacity:.35; box-shadow:none; } 22%,82% { opacity:1; box-shadow:0 0 18px rgba(255,207,35,.7),inset 0 0 0 4px rgba(255,255,255,.22); } }
@keyframes generator-status { 0%,100% { opacity:.5; } 50% { opacity:1; transform:scale(1.18); } }
@keyframes generator-hum { 0%,12%,100% { transform:translateX(0); } 24%,80% { transform:translateX(.7px); } 26%,82% { transform:translateX(-.7px); } }
@keyframes generator-power-run { 0%,14% { opacity:0; transform:translate(35px,-35px) scale(.6); } 22% { opacity:1; } 70% { opacity:1; transform:translate(0,0) scale(1); } 84%,100% { opacity:0; transform:translate(-6px,0) scale(.65); } }
@keyframes ev-car-park { from { opacity:0; transform:translateX(58px) scale(.94); } to { opacity:1; transform:none; } }
@keyframes ev-wheel-park { from { transform:rotate(230deg); } to { transform:rotate(0); } }
@keyframes ev-screen-charge { 0%,10%,100% { transform:scaleX(.08); opacity:.42; } 68%,88% { transform:scaleX(1); opacity:1; } }
@keyframes ev-charger-ready { 0%,100% { box-shadow:inset 0 0 0 3px rgba(42,116,98,.48); } 50% { box-shadow:inset 0 0 0 3px rgba(42,116,98,.38),0 0 11px rgba(95,255,177,.72); } }
@keyframes ev-cable-live { 0%,12%,100% { border-color:rgba(25,66,61,.72); filter:drop-shadow(0 2px 2px rgba(16,57,48,.14)); } 34%,82% { border-color:rgba(48,147,120,.9); filter:drop-shadow(0 0 5px rgba(89,242,178,.46)); } }
@keyframes ev-battery-fill { 0%,14%,100% { width:12%; } 74%,90% { width:100%; } }
@keyframes ev-battery-glow { 0%,18%,100% { box-shadow:inset 0 0 7px rgba(91,234,176,.12); } 72%,90% { box-shadow:inset 0 0 8px rgba(91,234,176,.28),0 0 12px rgba(96,244,159,.52); } }
@keyframes ev-port-ready { 0%,100% { opacity:.58; transform:scale(.78); } 50% { opacity:1; transform:scale(1.12); } }
@keyframes ev-headlight-on { 0%,66%,100% { opacity:.45; box-shadow:3px 0 8px rgba(219,255,154,.28); } 76%,92% { opacity:1; box-shadow:7px 0 17px rgba(219,255,154,.86); } }
@keyframes ev-power-run { 0%,16% { opacity:0; transform:translate(0,0) scale(.55); } 24% { opacity:1; } 66% { opacity:1; transform:translate(25px,47px) scale(1); } 76%,100% { opacity:0; transform:translate(29px,50px) scale(.5); } }
@keyframes heater-tank-warm { 0%,14%,100% { box-shadow:inset 13px 9px 19px rgba(255,255,255,.5),inset -11px -14px 20px rgba(117,53,31,.1),0 18px 30px rgba(114,63,39,.18); } 40%,82% { box-shadow:inset 13px 9px 19px rgba(255,255,255,.52),inset -11px -14px 20px rgba(173,73,38,.13),0 18px 30px rgba(114,63,39,.18),0 0 22px rgba(242,125,67,.2); } }
@keyframes heater-water-warm { 0%,16%,100% { background-position:0 92%; filter:saturate(.72); box-shadow:inset 0 14px 20px rgba(255,243,226,.18); } 50%,84% { background-position:0 4%; filter:saturate(1.16); box-shadow:inset 0 14px 20px rgba(255,246,226,.48),0 -5px 18px rgba(244,126,64,.28); } }
@keyframes heater-cold-flow { 0%,8% { opacity:0; transform:translateY(-7px) rotate(45deg) scale(.65); } 14% { opacity:1; } 34% { opacity:1; transform:translateY(52px) rotate(45deg) scale(1); } 40%,100% { opacity:0; transform:translateY(58px) rotate(45deg) scale(.6); } }
@keyframes heater-hot-flow { 0%,52% { opacity:0; transform:translateY(4px) rotate(45deg) scale(.6); } 60% { opacity:1; } 82% { opacity:1; transform:translateY(-52px) rotate(45deg) scale(1); } 90%,100% { opacity:0; transform:translateY(-58px) rotate(45deg) scale(.6); } }
@keyframes heater-burner-fire { 0%,18%,100% { opacity:.24; transform:scale(.68) translateY(4px); filter:drop-shadow(0 0 2px rgba(240,105,48,.22)); } 32%,76% { opacity:1; transform:scale(1.08) translateY(-1px); filter:drop-shadow(0 0 9px rgba(240,105,48,.76)); } }
@keyframes heater-gauge-rise { 0%,18%,100% { transform:rotate(-48deg); } 58%,86% { transform:rotate(42deg); } }
@keyframes heater-status-pulse { 0%,100% { opacity:.5; transform:scale(.82); } 50% { opacity:1; transform:scale(1.12); } }
@keyframes heater-heat-wave { 0%,22% { opacity:0; transform:translateY(13px) scaleY(.72); } 40%,68% { opacity:.88; } 100% { opacity:0; transform:translateY(-25px) scaleY(1.08); } }
@keyframes hvac-fan-spin { to { transform:rotate(360deg); } }
@keyframes hvac-furnace-glow { 0%,12%,100% { opacity:.42; filter:saturate(.75); } 35%,82% { opacity:1; filter:saturate(1.2); } }
@keyframes hvac-cool-flow { 0%,12% { opacity:0; transform:translate(0,0); } 22%,44% { opacity:1; } 52%,100% { opacity:0; transform:translate(48px,26px); } }
@keyframes hvac-warm-flow { 0%,48% { opacity:0; transform:translate(48px,26px); } 58%,82% { opacity:1; } 94%,100% { opacity:0; transform:translate(0,0); } }

.source-note { margin:15px 0 0; color:#6a8184; font:9px/1.6 var(--mono); }
.source-note a { text-decoration:underline; }

.review-section { display:grid; grid-template-columns:175px 1fr; column-gap:50px; align-items:start; padding:43px 0; border-block:1px solid rgba(255,255,255,.68); }
#reviews { scroll-margin-top:148px; }
.review-label { margin:0; color:#557a7d; font:500 9px var(--mono); letter-spacing:.12em; }
.review-note { max-width:145px; margin:12px 0 0; color:var(--muted); font-size:10px; line-height:1.5; }
.review-carousel { min-width:0; padding:27px 30px 24px; border:1px solid rgba(255,255,255,.78); border-radius:25px; background:rgba(255,255,255,.42); box-shadow:0 18px 44px rgba(42,83,97,.1),inset 0 1px 0 rgba(255,255,255,.86); backdrop-filter:blur(18px) saturate(135%); }
.review-slide { display:none; }
.review-slide.active { display:block; animation:review-in .35s ease; }
.review-slide blockquote { max-width:630px; margin:0; color:#2b4149; font:400 clamp(15px,1.35vw,17px)/1.68 var(--sans); letter-spacing:-.015em; }
.review-slide blockquote p { margin:0; }
.review-slide blockquote p + p { margin-top:1em; }
.review-slide footer { display:flex; align-items:end; justify-content:space-between; gap:22px; margin-top:21px; }
.review-slide footer .review-byline { display:flex; flex-direction:column; gap:5px; }
.review-slide footer b { font-size:11px; }
.review-slide footer small { color:#73858b; font:500 8px var(--mono); letter-spacing:.08em; }
.review-slide footer time { color:#8a999e; font:500 8px var(--mono); letter-spacing:.06em; }
.review-stars { display:inline-flex; align-items:center; gap:6px; color:#e5a327; font-size:12px; letter-spacing:.08em; line-height:1; white-space:nowrap; }
.review-stars small { color:#9d7b42; font-size:8px; letter-spacing:.04em; }
.review-slide footer a { width:max-content; padding-bottom:4px; border-bottom:1px solid #668184; color:#3d6568; font-size:10px; font-weight:700; white-space:nowrap; }
.review-controls { display:flex; align-items:center; gap:11px; margin-top:23px; }
.review-control { width:29px; height:29px; display:grid; place-items:center; border:1px solid rgba(123,153,163,.36); border-radius:50%; background:rgba(255,255,255,.4); color:var(--ink); }
.review-control:not(:disabled):hover { background:rgba(189,239,249,.62); }
.review-control:disabled { cursor:default; opacity:.35; }
.review-controls span { color:var(--muted); font:500 9px var(--mono); letter-spacing:.08em; }
@keyframes review-in { from { opacity:0; transform:translateX(9px); } to { opacity:1; transform:none; } }

.booking-section { display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(60px,11vw,140px); padding:100px 0; align-items:start; }
.booking-intro { position:sticky; top:95px; }
.booking-intro > p:last-child { max-width:320px; color:var(--muted); font-size:13px; line-height:1.7; }
.booking-widget { padding:31px 35px; border:1px solid rgba(255,255,255,.85); border-radius:27px; background:rgba(255,255,255,.57); box-shadow:0 20px 50px rgba(32,79,88,.13),inset 0 1px 0 white; backdrop-filter:blur(20px) saturate(145%); }
.booking-step { display:flex; gap:14px; margin-bottom:12px; }
.booking-step > span { color:#519092; font:500 10px var(--mono); padding-top:2px; }
.booking-step p { display:flex; flex-direction:column; gap:4px; margin:0; }
.booking-step b { font-size:12px; }
.booking-step small { color:#7c9093; font-size:10px; }
.calendar { margin:0 0 31px 28px; }
.calendar-head { height:30px; display:flex; align-items:center; justify-content:space-between; }
.calendar-head button { width:29px; height:29px; border:1px solid transparent; border-radius:50%; background:transparent; color:var(--ink); }
.calendar-head button:hover { border-color:var(--line); }
.calendar-head b { font-size:11px; }
.calendar-weekdays,.calendar-days { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; }
.calendar-weekdays { margin-top:10px; color:#7a9093; font:9px var(--mono); }
.calendar-days { gap:1px; margin-top:7px; }
.calendar-days button { height:31px; border:0; border-radius:50%; background:transparent; color:var(--ink); font-size:10px; }
.calendar-days button:not([disabled]):hover { background:rgba(171,246,239,.42); }
.calendar-days button.selected { background:var(--ink); color:white; box-shadow:2px 2px 0 var(--aqua); }
.calendar-days button[disabled] { color:#c7d2d3; cursor:default; }
.calendar-days .empty { display:block; height:31px; }
.time-slots { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:0 0 31px 28px; }
.time-slot { min-height:40px; border:1px solid rgba(255,255,255,.82); border-radius:12px; background:rgba(255,255,255,.4); color:#557176; font-size:10px; font-weight:700; }
.time-slot.active { border-color:var(--ink); background:rgba(207,250,246,.72); color:var(--ink); }
.contact-fields { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0 0 25px 28px; }
.contact-fields label { display:flex; flex-direction:column; gap:7px; }
.contact-fields label span { color:#70878a; font-size:9px; }
.contact-fields input { min-width:0; width:100%; padding:4px 0 9px; border:0; border-bottom:1px solid #b8c7c9; outline:0; background:transparent; color:var(--ink); font-size:11px; }
.contact-fields input:focus { border-color:var(--ink); }
.field-wide { grid-column:span 2; }
.submit-booking { width:calc(100% - 28px); margin:0 0 0 28px; }
.form-disclaimer { margin:14px 0 0 28px; color:#829396; font-size:8px; }
.booking-success { display:flex; align-items:center; gap:10px; width:calc(100% - 28px); margin:20px 0 0 28px; padding:14px; background:rgba(211,250,246,.72); color:#295254; }
.booking-success > span { width:23px; height:23px; display:grid; place-items:center; border-radius:50%; background:var(--aqua); font-size:11px; }
.booking-success p { margin:2px 0 0; font-size:10px; }
.booking-success b { font-size:11px; }
.booking-fallback { width:calc(100% - 28px); margin:16px 0 0 28px; color:#607b80; font-size:9px; line-height:1.55; }
.booking-fallback b { display:block; color:var(--ink); font-size:10px; }
.booking-fallback a { display:inline-block; margin-top:4px; border-bottom:1px solid currentColor; color:#24728b; font-weight:700; }
.submit-booking:disabled { cursor:default; opacity:.72; }
.honeypot { display:none !important; }

/* Anti-gravity glass: slow staggered drift with a tactile hover lift. */
.hero-photo,.solution-stage,.review-carousel,.booking-widget { transform-style:preserve-3d; will-change:transform; transition:transform .38s cubic-bezier(.2,.8,.2,1),box-shadow .38s ease; }
@media (prefers-reduced-motion:no-preference) {
  .hero-photo.visible,.solution-stage,.review-section.visible .review-carousel,.booking-widget.visible { animation:anti-gravity-drift 8s ease-in-out infinite; }
  .solution-stage { animation-delay:-2.2s; }
  .review-section.visible .review-carousel { animation-delay:-4.8s; }
  .booking-widget.visible { animation-delay:-1.1s; }
}
@media (hover:hover) {
  .hero-photo.visible:hover,.solution-stage:hover,.review-section.visible .review-carousel:hover,.booking-widget.visible:hover { animation-play-state:paused; transform:translate3d(0,-8px,0) scale(1.004); box-shadow:0 29px 60px rgba(35,73,88,.16),inset 0 1px 0 rgba(255,255,255,.92); }
}
@keyframes anti-gravity-drift { 0%,100% { transform:translate3d(0,0,0); } 50% { transform:translate3d(0,-6px,0); } }
@media (prefers-reduced-motion:reduce) { .hero-photo,.solution-stage,.review-carousel,.booking-widget,.ro-tap,.ro-stream,.ro-fill,.ro-bubble,.ro-fill::after,.ro-stream::after,.uv-chamber,.uv-lamp,.uv-beam,.uv-clean-wave,.uv-particle,.generator-scene *,.ev-scene *,.water-heater-scene *,.hvac-scene * { animation:none !important; } .ro-handle { transform:rotate(0); } .ro-stream { opacity:.38; transform:none; } .ro-fill { height:72%; opacity:1; } .ro-bubble { display:none; } .uv-lamp { opacity:1; } .uv-beam { opacity:.42; transform:none; } .uv-clean-wave,.uv-particle,.generator-power-pulse,.ev-power-pulse,.hvac-flow { display:none; } }

.site-footer { width:min(1060px,calc(100% - 48px)); min-height:112px; margin-inline:auto; display:flex; align-items:center; gap:34px; border-top:1px solid rgba(255,255,255,.7); }
.footer-home { display:block; flex:0 0 auto; }
.site-footer img { width:126px; height:auto; }
.footer-home img { display:block; }
.footer-links { margin-left:auto; display:flex; align-items:center; gap:34px; }
.footer-journal { color:#667e82; font:500 8px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.footer-journal .footer-link-arrow { color:#217e9f; font-size:11px; }
.footer-journal:hover { color:var(--ink); }
.footer-review { color:#667e82; font:500 8px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.footer-review .footer-link-arrow { color:#217e9f; font-size:11px; }
.footer-review:hover { color:var(--ink); }

/* Water purification: cool blue glass */
.site-header { border-color:rgba(246,254,255,.88); background:rgba(248,253,255,.63); box-shadow:0 14px 34px rgba(31,83,112,.12),inset 0 1px 0 white; }
.brand-divider { background:rgba(59,116,141,.23); }
.solution-switch { border-color:rgba(246,254,255,.88); background:rgba(248,253,255,.46); }
.solution-tab { color:#617987; }
.solution-tab.active { border-color:rgba(246,254,255,.95); background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(181,239,249,.77)); box-shadow:0 5px 12px rgba(35,114,150,.12),inset 0 1px 0 white; }
.header-cta,.button-primary { border-color:rgba(246,254,255,.9); background:linear-gradient(135deg,rgba(255,255,255,.91),rgba(182,239,249,.81)); box-shadow:0 10px 24px rgba(36,112,151,.14),inset 0 1px 0 white; }
.header-cta span,.button span,.text-link span { color:#217e9f; }
.eyebrow { color:#3b7896; }
.experience-line { color:#607c8b; }
.hero-photo { border-color:rgba(246,254,255,.9); background:linear-gradient(135deg,rgba(255,255,255,.83),rgba(162,222,240,.66)); box-shadow:0 24px 50px rgba(24,85,110,.19),inset 0 1px 0 white; }
.solution-stage { border-color:rgba(246,254,255,.9); background:rgba(248,253,255,.57); box-shadow:0 20px 45px rgba(28,91,119,.11),inset 0 1px 0 white; }
.simple-points span { border-color:rgba(246,254,255,.82); background:rgba(246,253,255,.46); color:#547080; }
.text-link { border-color:#5b7888; }
.focus-orb { border-left-color:rgba(246,254,255,.72); background:linear-gradient(145deg,rgba(224,251,255,.9),rgba(139,207,235,.77)); }
.focus-orb::before,.focus-orb::after { border-color:rgba(32,107,140,.16); }
.ro-tap { filter:drop-shadow(0 14px 18px rgba(20,97,126,.14)); }

/* Air quality: minimal soft sand glass */
body.air-theme { --ink:#252019; --muted:#746a5b; --paper:#fbfaf8; --line:rgba(113,96,70,.17); --aqua:#d2b77f; background:radial-gradient(circle at 5% 12%,rgba(231,213,183,.075),transparent 25rem),radial-gradient(circle at 95% 11%,rgba(219,201,169,.05),transparent 28rem),var(--paper); }
body.air-theme .site-header { border-color:rgba(255,253,248,.9); background:rgba(253,250,244,.66); box-shadow:0 14px 34px rgba(93,77,52,.1),inset 0 1px 0 white; }
body.air-theme .brand-divider { background:rgba(108,91,65,.22); }
body.air-theme .solution-switch { border-color:rgba(255,253,248,.9); background:rgba(253,250,244,.48); }
body.air-theme .solution-tab { color:#716657; }
body.air-theme .solution-tab.active { border-color:rgba(255,253,248,.94); background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(235,221,194,.82)); box-shadow:0 5px 12px rgba(112,91,57,.1),inset 0 1px 0 white; }
body.air-theme .header-cta,body.air-theme .button-primary { border-color:rgba(255,253,248,.88); background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(233,218,187,.82)); box-shadow:0 10px 24px rgba(103,83,49,.12),inset 0 1px 0 white; }
body.air-theme .header-cta span,body.air-theme .button span,body.air-theme .text-link span { color:#8d6b3f; }
body.air-theme .eyebrow { color:#7d6643; }
body.air-theme .experience-line { color:#786d5c; }
body.air-theme .bio-details summary { border-color:rgba(255,253,248,.9); background:rgba(253,250,244,.62); color:#7d6643; box-shadow:0 7px 18px rgba(103,83,49,.07),inset 0 1px 0 rgba(255,255,255,.9); }
body.air-theme .bio-details summary i { background:rgba(235,221,194,.84); color:#8d6b3f; }
body.air-theme .bio-details summary:hover { background:rgba(253,250,244,.86); box-shadow:0 9px 21px rgba(103,83,49,.1),inset 0 1px 0 white; }
body.air-theme .bio-expanded { border-color:rgba(255,253,248,.92); background:linear-gradient(135deg,rgba(255,255,255,.8),rgba(247,240,226,.65)); box-shadow:0 16px 34px rgba(88,72,45,.09),inset 0 1px 0 rgba(255,255,255,.94); }
body.air-theme .bio-expanded p { color:#6d6355; }
body.air-theme .hero-photo { border-color:rgba(255,253,248,.9); background:linear-gradient(135deg,rgba(255,255,255,.84),rgba(229,212,180,.68)); box-shadow:0 24px 50px rgba(83,67,43,.14),inset 0 1px 0 white; }
body.air-theme .solution-stage { border-color:rgba(255,253,248,.9); background:rgba(252,249,242,.64); box-shadow:0 20px 45px rgba(88,72,45,.1),inset 0 1px 0 white; }
body.air-theme .simple-points span { border-color:rgba(255,253,248,.8); background:rgba(252,249,242,.5); color:#6e6658; }
body.air-theme .product-offerings { border-color:rgba(161,131,82,.25); background:rgba(248,242,229,.62); color:#6e6352; }
body.air-theme .text-link { border-color:#79694e; }
body.air-theme .air-product-lineup-toggle { border-color:rgba(255,253,248,.9); background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(235,222,196,.7)); box-shadow:0 7px 17px rgba(103,83,49,.08),inset 0 1px 0 rgba(255,255,255,.92); color:#765f3e; }
body.air-theme .air-product-lineup-toggle i { background:rgba(225,207,172,.72); color:#8d6b3f; }
body.air-theme .air-product-lineup-panel { border-color:rgba(255,253,248,.92); background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(244,237,222,.64)); box-shadow:0 17px 35px rgba(88,72,45,.09),inset 0 1px 0 rgba(255,255,255,.94); }
body.air-theme .air-product-lineup-panel .product-card { border-color:rgba(255,255,255,.78); background:rgba(252,249,242,.52); }
body.air-theme .air-product-lineup-panel .product-card h3 { color:#3d3427; }
body.air-theme .air-product-lineup-panel .product-card p { color:#736858; }
body.air-theme .air-product-lineup-panel .product-lineup-note { color:#786c5d; }
body.air-theme .air-product-lineup-panel .product-mini { border-color:rgba(255,253,248,.9); background:radial-gradient(circle at 50% 24%,rgba(204,241,250,.48),transparent 46%),linear-gradient(145deg,rgba(255,255,255,.74),rgba(220,204,174,.45)); box-shadow:inset 7px 6px 12px rgba(255,255,255,.56),inset -6px -8px 13px rgba(103,79,43,.07); }
body.air-theme .booking-success { background:rgba(238,226,199,.76); color:#5b4c37; }
body.air-theme .booking-success > span { background:#d6b77c; color:#403421; }
body.air-theme .booking-fallback a { color:#7d6643; }
body.air-theme .footer-journal .footer-link-arrow { color:#8d6b3f; }
body.air-theme .footer-review .footer-link-arrow { color:#8d6b3f; }
@media (hover:hover) { body.air-theme .hero-photo.visible:hover,body.air-theme .solution-stage:hover,body.air-theme .review-section.visible .review-carousel:hover,body.air-theme .booking-widget.visible:hover { box-shadow:0 29px 60px rgba(88,72,45,.14),inset 0 1px 0 rgba(255,255,255,.92); } body.air-theme .air-product-lineup-toggle:hover { background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(231,216,186,.8)); box-shadow:0 9px 20px rgba(103,83,49,.11),inset 0 1px 0 white; } }

/* Additional service categories share the glass system while carrying their own mood. */
body.focus-generator { --ink:#181d20; --muted:#60696d; --paper:#f4f5f5; --line:rgba(38,47,51,.2); --aqua:#f0c62e; --theme-accent:#946700; --theme-active:rgba(250,213,81,.9); --theme-soft:rgba(236,239,238,.84); --theme-shadow:rgba(20,26,29,.18); --theme-photo:rgba(58,66,69,.8); --theme-chip:rgba(222,226,224,.78); background:radial-gradient(circle at 6% 13%,rgba(250,207,46,.12),transparent 24rem),radial-gradient(circle at 94% 10%,rgba(45,53,57,.09),transparent 28rem),var(--paper); }
body.focus-ev { --ink:#16342f; --muted:#5c756e; --paper:#f7fbfa; --line:rgba(52,124,104,.16); --aqua:#71d5b5; --theme-accent:#237d66; --theme-active:rgba(178,231,213,.84); --theme-soft:rgba(244,252,249,.68); --theme-shadow:rgba(29,91,74,.12); --theme-photo:rgba(135,211,187,.62); --theme-chip:rgba(228,248,241,.64); background:radial-gradient(circle at 5% 12%,rgba(100,210,176,.09),transparent 25rem),radial-gradient(circle at 95% 11%,rgba(86,174,158,.06),transparent 28rem),var(--paper); }
body.focus-water-heater { --ink:#3b261d; --muted:#7a675e; --paper:#fcfaf8; --line:rgba(142,83,56,.16); --aqua:#ed9b69; --theme-accent:#a9542e; --theme-active:rgba(244,204,178,.84); --theme-soft:rgba(255,249,245,.68); --theme-shadow:rgba(117,66,42,.12); --theme-photo:rgba(238,171,127,.62); --theme-chip:rgba(251,235,225,.64); background:radial-gradient(circle at 5% 12%,rgba(238,155,103,.085),transparent 25rem),radial-gradient(circle at 95% 11%,rgba(218,133,91,.055),transparent 28rem),var(--paper); }
body.focus-water-heater .water-heater-product-lineup-toggle { border-color:rgba(255,253,249,.92); background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(246,211,190,.76)); box-shadow:0 7px 17px rgba(117,66,42,.09),inset 0 1px 0 rgba(255,255,255,.94); color:#8d4d30; }
body.focus-water-heater .water-heater-product-lineup-toggle i { background:rgba(239,186,153,.72); color:#9d4e2a; }
body.focus-water-heater .water-heater-product-lineup-toggle:focus-visible { outline-color:rgba(169,84,46,.46); }
body.focus-water-heater .water-heater-product-lineup-panel { border-color:rgba(255,253,249,.94); background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(250,226,211,.65)); box-shadow:0 17px 35px rgba(117,66,42,.1),inset 0 1px 0 rgba(255,255,255,.95); }
body.focus-water-heater .water-heater-product-lineup-panel .product-card { border-color:rgba(255,255,255,.82); background:rgba(255,249,245,.58); }
body.focus-water-heater .water-heater-product-lineup-panel .product-card h3 { color:#4a2e22; }
body.focus-water-heater .water-heater-product-lineup-panel .product-card p,body.focus-water-heater .water-heater-product-lineup-panel .product-lineup-note { color:#7a675e; }
body.focus-water-heater .water-heater-product-lineup-panel .product-mini { border-color:rgba(255,253,249,.94); background:radial-gradient(circle at 50% 24%,rgba(255,238,222,.82),transparent 48%),linear-gradient(145deg,rgba(255,255,255,.78),rgba(232,166,126,.42)); box-shadow:inset 7px 6px 12px rgba(255,255,255,.58),inset -6px -8px 13px rgba(137,70,42,.08); }
body.focus-hvac { --ink:#1e2d45; --muted:#607087; --paper:#f8fafc; --line:rgba(70,98,145,.17); --aqua:#8eadde; --theme-accent:#496fa8; --theme-active:rgba(199,215,241,.84); --theme-soft:rgba(247,250,255,.69); --theme-shadow:rgba(48,70,109,.12); --theme-photo:rgba(161,188,228,.65); --theme-chip:rgba(231,238,249,.64); background:radial-gradient(circle at 5% 12%,rgba(121,164,224,.085),transparent 25rem),radial-gradient(circle at 95% 11%,rgba(222,143,106,.045),transparent 28rem),var(--paper); }
body.category-theme .site-header { border-color:rgba(255,255,255,.9); background:var(--theme-soft); box-shadow:0 14px 34px var(--theme-shadow),inset 0 1px 0 white; }
body.category-theme .brand-divider { background:var(--line); }
body.category-theme .solution-switch { border-color:rgba(255,255,255,.9); background:rgba(255,255,255,.38); }
body.category-theme .solution-tab { color:var(--muted); }
body.category-theme .solution-tab.active { border-color:rgba(255,255,255,.94); background:linear-gradient(135deg,rgba(255,255,255,.92),var(--theme-active)); color:var(--ink); box-shadow:0 5px 12px var(--theme-shadow),inset 0 1px 0 white; }
body.category-theme .header-cta,body.category-theme .button-primary { border-color:rgba(255,255,255,.9); background:linear-gradient(135deg,rgba(255,255,255,.93),var(--theme-active)); box-shadow:0 10px 24px var(--theme-shadow),inset 0 1px 0 white; }
body.category-theme .header-cta span,body.category-theme .button span,body.category-theme .text-link span { color:var(--theme-accent); }
body.category-theme .eyebrow { color:var(--theme-accent); }
body.category-theme .experience-line { color:var(--muted); }
body.category-theme .bio-details summary { border-color:rgba(255,255,255,.9); background:var(--theme-soft); color:var(--theme-accent); box-shadow:0 7px 18px var(--theme-shadow),inset 0 1px 0 rgba(255,255,255,.9); }
body.category-theme .bio-details summary i { background:var(--theme-active); color:var(--theme-accent); }
body.category-theme .bio-expanded { border-color:rgba(255,255,255,.92); background:linear-gradient(135deg,rgba(255,255,255,.8),var(--theme-chip)); box-shadow:0 16px 34px var(--theme-shadow),inset 0 1px 0 rgba(255,255,255,.94); }
body.category-theme .hero-photo { border-color:rgba(255,255,255,.9); background:linear-gradient(135deg,rgba(255,255,255,.86),var(--theme-photo)); box-shadow:0 24px 50px var(--theme-shadow),inset 0 1px 0 white; }
body.category-theme .solution-stage { border-color:rgba(255,255,255,.9); background:var(--theme-soft); box-shadow:0 20px 45px var(--theme-shadow),inset 0 1px 0 white; }
body.category-theme .simple-points span { border-color:rgba(255,255,255,.82); background:var(--theme-chip); color:var(--muted); }
body.category-theme .product-offerings { border-color:var(--line); background:var(--theme-chip); color:var(--muted); }
body.category-theme .text-link { border-color:var(--theme-accent); }
body.category-theme .focus-orb { border-left-color:rgba(255,255,255,.72); }
body.category-theme .focus-orb::before,body.category-theme .focus-orb::after { border-color:var(--line); }
body.category-theme .booking-success { background:var(--theme-chip); color:var(--ink); }
body.category-theme .booking-success > span { background:var(--theme-active); color:var(--theme-accent); }
body.category-theme .booking-fallback a,body.category-theme .footer-link-arrow { color:var(--theme-accent); }
@media (hover:hover) { body.category-theme .hero-photo.visible:hover,body.category-theme .solution-stage:hover,body.category-theme .review-section.visible .review-carousel:hover,body.category-theme .booking-widget.visible:hover { box-shadow:0 29px 60px var(--theme-shadow),inset 0 1px 0 rgba(255,255,255,.92); } body.focus-water-heater .water-heater-product-lineup-toggle:hover { background:linear-gradient(135deg,rgba(255,255,255,.97),rgba(244,202,176,.86)); box-shadow:0 9px 20px rgba(117,66,42,.13),inset 0 1px 0 white; } }

@media (max-width:800px) { .section-wrap,.site-header,.site-footer { width:min(100% - 32px,590px); } .site-header { grid-template-columns:1fr auto; min-height:65px; gap:10px; } .header-logo { width:87px; } .brand-divider { height:23px; } .solution-switch { grid-column:1 / -1; grid-row:2; width:100%; display:flex; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:none; scroll-snap-type:x proximity; } .solution-switch::-webkit-scrollbar { display:none; } .solution-tab { flex:0 0 auto; min-width:126px; min-height:42px; scroll-snap-align:center; } .header-cta { display:none; } .hero { min-height:0; grid-template-columns:1fr; gap:37px; padding:55px 0 65px; } .hero h1 { font-size:clamp(46px,13vw,64px); } .hero-photo { max-width:360px; justify-self:start; } .focus-section { padding-bottom:70px; } .solution-stage { min-height:615px; grid-template-columns:1fr; } .stage-content { padding:37px 27px; } .focus-orb { top:auto; bottom:0; width:100%; height:255px; border-left:0; border-top:1px solid rgba(255,255,255,.68); } .water-test-animation,.air-test-animation,.category-animation { transform:scale(.84); transform-origin:50% 50%; } .review-section { grid-template-columns:1fr; gap:18px; } .review-slide footer { align-items:start; flex-direction:column; } .review-control { width:38px; height:38px; } .booking-section { grid-template-columns:1fr; gap:37px; padding:72px 0; } .booking-intro { position:static; } .booking-widget { padding:27px 18px; } .calendar-head button,.calendar-days button,.calendar-days .empty { height:36px; } .time-slot { min-height:44px; } .site-footer { flex-wrap:wrap; gap:17px; padding:26px 0; } .footer-journal { margin-left:0; } }
@media (max-width:430px) { .experience-line { align-items:flex-start; flex-wrap:wrap; } .experience-line i { display:none; } .experience-line span:last-child { width:100%; } .calendar,.time-slots,.contact-fields { margin-left:0; } .time-slots,.contact-fields { grid-template-columns:1fr; } .field-wide { grid-column:span 1; } .submit-booking { width:100%; margin-left:0; } .form-disclaimer { margin-left:0; } }

/* Mobile refinement: center key moments and keep every touch target comfortably spaced. */
@media (max-width:800px) {
  .section-wrap,.site-header,.site-footer { width:min(100% - 28px,590px); }
  .site-header { margin-top:12px; padding:10px 12px 12px; border-radius:19px; }
  .solution-switch { margin-top:3px; }
  .hero { gap:31px; padding:48px 0 66px; text-align:center; }
  .hero h1,.hero-intro { margin-inline:auto; }
  .bio-details { margin:12px auto 0; text-align:left; }
  .bio-details summary { margin-inline:auto; }
  .bio-expanded { padding:17px 18px; }
  .hero .button { width:min(100%,330px); }
  .experience-line { justify-content:center; margin-top:29px; }
  .hero-photo { max-width:326px; justify-self:center; margin-top:3px; }
  .focus-section { padding-bottom:64px; }
  .solution-stage { min-height:600px; border-radius:24px; }
  .stage-content { padding:36px 24px 31px; text-align:center; }
  .stage-content > p:not(.eyebrow) { margin-inline:auto; }
  .product-offerings { text-align:left; }
  .simple-points { justify-content:center; margin:21px 0; }
  .focus-orb { height:240px; }
  .water-test-animation,.air-test-animation,.category-animation { transform:scale(.78); }
  .source-note { max-width:420px; margin:17px auto 0; text-align:center; }
  .review-section { gap:20px; padding:40px 0; }
  .review-heading { text-align:center; }
  .review-note { margin-inline:auto; }
  .review-carousel { padding:25px 21px 23px; border-radius:22px; }
  .review-slide footer { align-items:center; text-align:center; }
  .review-controls { justify-content:center; margin-top:20px; }
  .booking-section { gap:34px; padding:76px 0; }
  .booking-intro { text-align:center; }
  .booking-intro > p:last-child { margin-inline:auto; }
  .booking-widget { padding:27px 22px; border-radius:24px; }
  .calendar,.time-slots,.contact-fields { margin-left:0; }
  .time-slots { margin-bottom:28px; }
  .submit-booking { width:100%; margin-left:0; }
  .form-disclaimer { margin-left:0; text-align:center; }
  .booking-success { width:100%; margin-left:0; }
  .booking-fallback { width:100%; margin-left:0; text-align:center; }
  .site-footer { display:grid; grid-template-columns:116px minmax(0,1fr); align-items:center; justify-items:stretch; gap:18px; padding:30px 0 32px; text-align:left; }
  .footer-home { grid-column:1; justify-self:start; }
  .footer-links { grid-column:2; width:100%; margin:0; }
}

@media (max-width:430px) {
  .section-wrap,.site-header,.site-footer { width:calc(100% - 24px); }
  .site-header { gap:8px; }
  .header-logo { width:80px; }
  .brand { gap:8px; }
  .brand-copy b { font-size:8px; }
  .brand-copy small { font-size:6.5px; }
  .hero { padding:43px 0 59px; }
  .hero h1 { font-size:clamp(42px,12.5vw,53px); }
  .hero-intro { font-size:15px; }
  .bio-expanded { padding:16px; border-radius:17px; }
  .bio-expanded p { font-size:12.5px; line-height:1.65; }
  .experience-line { flex-wrap:nowrap; }
  .experience-line span:last-child { width:auto; }
  .solution-stage { min-height:584px; }
  .stage-content { padding:32px 20px 27px; }
  .focus-orb { height:231px; }
  .water-test-animation,.air-test-animation,.category-animation { transform:scale(.73); }
  .simple-points { gap:6px; }
  .simple-points span { padding:7px 9px; }
  .review-carousel { padding:23px 18px 21px; }
  .booking-section { padding:66px 0; }
  .booking-widget { padding:25px 17px; }
  .calendar-head button,.calendar-days button,.calendar-days .empty { height:40px; }
  .time-slot { min-height:48px; }
}

/* Mobile solution and footer polish: each animation has a dedicated row. */
@media (max-width:800px) {
  .solution-stage { display:grid; grid-template-columns:1fr; grid-template-rows:auto 272px; min-height:0; }
  .stage-content { grid-column:1; grid-row:1; padding:36px 24px 35px; }
  .solution-stage[data-focus="air"] .stage-content { padding-bottom:40px; }
  .focus-orb { position:relative; inset:auto; grid-column:1; grid-row:2; width:100%; height:auto; min-height:272px; border-left:0; border-top:1px solid rgba(255,255,255,.68); }
  .solution-stage[data-focus="air"] .focus-orb { min-height:286px; }
  .water-test-animation { transform:scale(.8); }
  .solution-stage[data-focus="air"] .air-test-animation { transform:scale(.86); }
  .category-animation { transform:scale(.86); }
  .source-note { margin-top:20px; }
  .site-footer { display:grid; grid-template-columns:116px minmax(0,1fr); align-items:center; justify-items:stretch; column-gap:18px; padding:29px 0 31px; text-align:left; }
  .footer-home { grid-column:1; grid-row:1; width:116px; justify-self:start; align-self:center; }
  .footer-home img { width:100%; }
  .footer-links { grid-column:2; grid-row:1; width:100%; margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; gap:0; }
  .footer-journal,.footer-review { min-width:0; min-height:48px; display:flex; align-items:center; justify-content:center; margin:0; padding:11px 10px; color:#667e82; font:500 8px var(--mono); letter-spacing:.06em; text-align:center; text-transform:uppercase; }
  .footer-links a + a { border-left:1px solid rgba(255,255,255,.56); }
  .footer-links .footer-link-arrow { display:none; }
}

@media (max-width:430px) {
  .solution-stage { grid-template-rows:auto 250px; }
  .stage-content { padding:32px 20px 34px; }
  .solution-stage[data-focus="air"] .stage-content { padding-bottom:38px; }
  .focus-orb { min-height:250px; }
  .solution-stage[data-focus="air"] .focus-orb { min-height:262px; }
  .water-test-animation { transform:scale(.73); }
  .solution-stage[data-focus="air"] .air-test-animation { transform:scale(.8); }
  .category-animation { transform:scale(.78); }
  .site-footer { grid-template-columns:106px minmax(0,1fr); column-gap:14px; row-gap:16px; padding:27px 0 29px; }
  .footer-home { width:106px; }
  .footer-journal,.footer-review { min-height:45px; padding:10px 5px; font-size:7.5px; }
}

/* Collapsible product lineups: compact controls and readable mobile cards. */
@media (max-width:800px) {
  .water-actions,.air-actions,.water-heater-actions { justify-content:center; }
  .product-lineup-panel { width:100%; max-width:430px; margin:18px auto 2px; text-align:left; }
  .product-lineup-grid { grid-template-columns:1fr; }
  .product-card { min-height:92px; grid-template-columns:82px minmax(0,1fr); }
  .product-lineup-note { padding-inline:5px; }
}

@media (max-width:430px) {
  .water-actions,.air-actions,.water-heater-actions { gap:12px; }
  .product-lineup-toggle { min-height:38px; padding-inline:12px 9px; }
  .product-lineup-panel { padding:8px; border-radius:18px; }
  .product-card { min-height:90px; gap:9px; padding:8px; }
  .product-card p { font-size:9.25px; }
}

/* VIP Portal: inverted liquid-glass entry beside the primary booking action. */
.header-actions { justify-self:end; display:flex; align-items:center; gap:8px; }
.vip-header-cta { min-height:40px; display:inline-flex; align-items:center; gap:10px; padding:10px 14px; border:1px solid rgba(255,255,255,.31); border-radius:14px; background:linear-gradient(145deg,rgba(35,39,41,.96),rgba(8,10,11,.92)); box-shadow:0 8px 20px rgba(21,26,28,.24),inset 0 1px 0 rgba(255,255,255,.19),inset 0 -1px 0 rgba(255,255,255,.05); color:#fff; font-size:11px; font-weight:750; letter-spacing:.02em; backdrop-filter:blur(17px) saturate(135%); -webkit-backdrop-filter:blur(17px) saturate(135%); transition:transform .18s ease,box-shadow .18s ease; }
.vip-header-cta:hover { transform:translateY(-1px); box-shadow:0 11px 24px rgba(21,26,28,.29),inset 0 1px 0 rgba(255,255,255,.22); }
.vip-header-cta:focus-visible { outline:2px solid #20272a; outline-offset:3px; }

@media (max-width:800px) {
  .header-actions { gap:6px; }
  .vip-header-cta { min-height:39px; padding:9px 12px; }
  .header-actions .header-cta { min-height:39px; display:inline-flex; padding:9px 12px; font-size:10px; }
  .header-actions .header-cta span { font-size:13px; }
}

@media (max-width:520px) {
  .site-header > .brand .brand-divider,.site-header > .brand .brand-copy { display:none; }
  .header-actions { gap:5px; }
  .vip-header-cta,.header-actions .header-cta { min-height:37px; gap:5px; padding:8px 9px; font-size:8.5px; }
  .header-actions a > span { display:none; }
}

/* Residential and commercial audience architecture. */
.audience-panel[hidden] { display:none !important; }
.site-header { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); }
.audience-switch { grid-column:2; grid-row:1; min-width:250px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; padding:4px; border:1px solid rgba(255,252,247,.88); border-radius:15px; background:rgba(255,250,244,.46); box-shadow:inset 0 1px 0 rgba(255,255,255,.92); }
.audience-tab { min-height:39px; padding:0 18px; border:1px solid transparent; border-radius:11px; background:transparent; color:#76685e; font-size:10.5px; font-weight:700; letter-spacing:.01em; white-space:nowrap; transition:background .2s ease,color .2s ease,box-shadow .2s ease; }
.audience-tab.active { border-color:rgba(255,252,247,.94); background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,214,168,.8)); color:#17252b; box-shadow:0 5px 12px rgba(130,82,43,.13),inset 0 1px 0 white; }
.audience-tab:focus-visible { outline:2px solid rgba(39,111,138,.45); outline-offset:2px; }
.header-actions { grid-column:3; grid-row:1; }
.residential-solutions-nav { display:grid; grid-template-columns:minmax(240px,.72fr) minmax(0,1.6fr); align-items:center; gap:35px; padding:38px 0 4px; }
.residential-solutions-heading h2 { max-width:330px; margin:10px 0 0; font:600 clamp(24px,3vw,36px)/1.07 var(--display); letter-spacing:-.05em; }
.residential-solutions-nav .solution-switch { grid-column:auto; grid-row:auto; align-self:end; }

/* Commercial experience: steel, graphite and restrained brass. */
body.commercial-mode { --ink:#f4f6f5; --muted:#9ba5a7; --paper:#0b0e10; --line:rgba(216,224,222,.14); background:#0b0e10; color:#f4f6f5; }
body.commercial-mode .site-header { border-color:rgba(255,255,255,.13); background:rgba(17,21,23,.78); box-shadow:0 18px 42px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08); }
body.commercial-mode .brand-divider { background:rgba(255,255,255,.18); }
body.commercial-mode .brand-copy small { color:#a7b0b1; }
body.commercial-mode .audience-switch { border-color:rgba(255,255,255,.12); background:rgba(3,5,6,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
body.commercial-mode .audience-tab { color:#8e999b; }
body.commercial-mode .audience-tab.active { border-color:rgba(205,173,105,.34); background:linear-gradient(145deg,#303537,#1b1f21); color:#fff; box-shadow:0 6px 17px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.09); }
body.commercial-mode .vip-header-cta { border-color:rgba(255,255,255,.13); background:linear-gradient(145deg,#262b2d,#111416); }
body.commercial-mode .header-cta { border-color:rgba(216,184,113,.34); background:linear-gradient(135deg,#d8bd7f,#9e7a39); color:#111416; box-shadow:0 8px 20px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.28); }
body.commercial-mode .header-cta span { color:#111416; }
body.commercial-mode .site-footer { color:#b8c0c1; }
body.commercial-mode .footer-journal,body.commercial-mode .footer-review { color:#aeb6b8; }
body.commercial-mode .footer-links a + a { border-color:rgba(255,255,255,.1); }

.commercial-experience { overflow:hidden; margin-top:20px; background:radial-gradient(circle at 82% 4%,rgba(159,126,63,.16),transparent 31rem),radial-gradient(circle at 8% 17%,rgba(77,102,108,.17),transparent 27rem),linear-gradient(180deg,#111517 0,#0b0e10 48%,#111517 100%); color:#f5f7f6; }
.commercial-experience .eyebrow { color:#c9a962; }
.commercial-hero { min-height:675px; display:grid; grid-template-columns:minmax(0,1.14fr) minmax(340px,.86fr); align-items:center; gap:85px; padding:96px 0 104px; }
.commercial-hero-copy h1 { max-width:700px; margin:19px 0 25px; font:600 clamp(54px,6.4vw,84px)/.98 var(--display); letter-spacing:-.067em; }
.commercial-lead { max-width:650px; margin-bottom:0; color:#b3bcbf; font-size:16px; line-height:1.75; }
.commercial-bio-details { max-width:650px; margin-top:16px; }
.commercial-bio-details summary { width:max-content; min-height:36px; display:flex; align-items:center; gap:9px; padding:7px 10px 7px 14px; list-style:none; border:1px solid rgba(202,173,108,.24); border-radius:999px; background:rgba(255,255,255,.045); color:#d4bc83; font-size:9px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; cursor:pointer; }
.commercial-bio-details summary::-webkit-details-marker { display:none; }
.commercial-bio-details summary i { width:20px; height:20px; display:grid; place-items:center; border-radius:50%; background:rgba(207,174,98,.14); color:#d6b66c; font:500 15px/1 var(--sans); transition:transform .25s ease; }
.commercial-bio-details[open] summary i { transform:rotate(45deg); }
.commercial-bio-details[open] .bio-read-more { display:none; }
.commercial-bio-details[open] .bio-read-less { display:inline; }
.commercial-bio-expanded { margin-top:12px; padding:18px 20px; border:1px solid rgba(255,255,255,.1); border-radius:18px; background:linear-gradient(145deg,rgba(44,50,52,.82),rgba(22,26,28,.84)); box-shadow:0 18px 36px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.07); }
.commercial-bio-expanded p { margin:0; color:#abb4b6; font-size:13px; line-height:1.7; }
.commercial-bio-expanded p + p { margin-top:11px; }
.commercial-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px 25px; margin-top:27px; }
.commercial-primary { border-color:rgba(233,208,150,.35); background:linear-gradient(135deg,#d8bd7f,#997437); color:#111416; box-shadow:0 12px 28px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.35); }
.commercial-primary span { color:#191d1e; }
.commercial-text-link { display:inline-flex; align-items:center; gap:10px; padding:12px 0 6px; border-bottom:1px solid rgba(207,174,98,.5); color:#d7dcdb; font-size:11px; font-weight:700; }
.commercial-text-link span { color:#c9a962; }
.commercial-brief { padding:32px; border:1px solid rgba(255,255,255,.13); border-radius:27px; background:linear-gradient(145deg,rgba(51,57,59,.78),rgba(20,24,26,.82)); box-shadow:0 28px 65px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.09); backdrop-filter:blur(20px) saturate(120%); -webkit-backdrop-filter:blur(20px) saturate(120%); }
.commercial-card-label { margin:0 0 18px; color:#c9a962; font-size:9px; font-weight:700; letter-spacing:.13em; }
.commercial-brief h2 { margin:0 0 25px; font:600 clamp(30px,3.3vw,43px)/1.04 var(--display); letter-spacing:-.055em; }
.commercial-audience-list { display:flex; flex-wrap:wrap; gap:7px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.1); }
.commercial-audience-list span { padding:8px 10px; border:1px solid rgba(255,255,255,.1); border-radius:999px; background:rgba(255,255,255,.045); color:#bdc5c6; font-size:9px; }
.commercial-priorities { margin:13px 0 0; }
.commercial-priorities div { display:grid; grid-template-columns:31px 1fr; align-items:center; gap:11px; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.08); }
.commercial-priorities div:last-child { border-bottom:0; padding-bottom:0; }
.commercial-priorities dt { color:#c9a962; font-size:9px; font-weight:700; }
.commercial-priorities dd { margin:0; color:#eef1f0; font-size:12px; font-weight:600; }

.commercial-equipment,.commercial-markets,.commercial-process { padding:105px 0; }
.commercial-section-heading { max-width:730px; margin-bottom:44px; }
.commercial-section-heading h2 { margin:15px 0 17px; font:600 clamp(39px,5vw,62px)/1.02 var(--display); letter-spacing:-.061em; }
.commercial-section-heading > p:last-child { max-width:650px; color:#9fa9ab; font-size:14px; line-height:1.72; }
.commercial-equipment-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.commercial-solution-card { min-height:255px; display:flex; flex-direction:column; padding:27px 25px; border:1px solid rgba(255,255,255,.11); border-radius:22px; background:linear-gradient(145deg,rgba(47,53,55,.67),rgba(20,24,26,.72)); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
.commercial-solution-card > span { color:#c9a962; font-size:9px; font-weight:700; letter-spacing:.1em; }
.commercial-solution-card h3 { margin:auto 0 11px; font-size:19px; letter-spacing:-.03em; }
.commercial-solution-card p { margin:0; color:#9ea8aa; font-size:12px; line-height:1.65; }
.commercial-availability-note { max-width:760px; margin:20px 0 0; color:#7f8a8d; font-size:9.5px; line-height:1.65; }

.commercial-markets { border-block:1px solid rgba(255,255,255,.08); }
.commercial-market-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid rgba(255,255,255,.1); border-radius:24px; overflow:hidden; background:rgba(255,255,255,.025); }
.commercial-market-grid article { min-height:205px; padding:26px; border-right:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08); }
.commercial-market-grid article:nth-child(3n) { border-right:0; }
.commercial-market-grid article:nth-last-child(-n+3) { border-bottom:0; }
.commercial-market-grid span { color:#c9a962; font-size:8px; font-weight:700; letter-spacing:.12em; }
.commercial-market-grid h3 { margin:48px 0 10px; font-size:17px; letter-spacing:-.025em; }
.commercial-market-grid p { margin:0; color:#929c9e; font-size:11px; line-height:1.6; }
.commercial-brand-strip { display:grid; grid-template-columns:minmax(270px,.85fr) minmax(0,1.15fr); align-items:center; gap:65px; margin-top:95px; margin-bottom:20px; padding:34px 37px; border:1px solid rgba(202,169,95,.2); border-radius:23px; background:linear-gradient(135deg,rgba(176,139,67,.1),rgba(255,255,255,.035)); }
.commercial-brand-strip h2 { margin:12px 0 0; font:600 29px/1.08 var(--display); letter-spacing:-.047em; }
.commercial-brand-strip > p { margin:0; color:#b4bcbd; font-size:13px; line-height:1.85; }
.commercial-process-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; margin:0; padding:0; list-style:none; }
.commercial-process-grid li { min-height:225px; padding:25px; border-top:1px solid rgba(201,169,98,.5); background:linear-gradient(180deg,rgba(255,255,255,.045),transparent); }
.commercial-process-grid span { color:#c9a962; font-size:9px; font-weight:700; }
.commercial-process-grid h3 { margin:53px 0 11px; font-size:18px; }
.commercial-process-grid p { margin:0; color:#96a0a2; font-size:12px; line-height:1.65; }

.commercial-booking-section { display:grid; grid-template-columns:minmax(290px,.72fr) minmax(0,1.28fr); align-items:start; gap:78px; padding:105px 0; }
.commercial-booking-intro { position:sticky; top:120px; }
.commercial-booking-intro h2 { margin:17px 0; font:600 clamp(41px,5vw,61px)/1.02 var(--display); letter-spacing:-.061em; }
.commercial-booking-intro > p:not(.eyebrow) { color:#9ea8aa; font-size:14px; line-height:1.72; }
.commercial-booking-points { display:flex; flex-wrap:wrap; gap:7px; margin-top:22px; }
.commercial-booking-points span { padding:8px 10px; border:1px solid rgba(202,169,95,.19); border-radius:999px; background:rgba(197,161,83,.07); color:#c9b688; font-size:9px; }
.commercial-booking-widget label > span { color:#afb7b8; }
.commercial-booking-widget input,.commercial-booking-widget select,.commercial-booking-widget textarea { width:100%; border:1px solid rgba(255,255,255,.11); border-radius:12px; background:rgba(3,5,6,.46); color:#f2f4f3; font:inherit; }
.commercial-booking-widget input,.commercial-booking-widget select { min-height:44px; padding:10px 12px; }
.commercial-booking-widget textarea { resize:vertical; padding:12px; line-height:1.55; }
.commercial-booking-widget input::placeholder,.commercial-booking-widget textarea::placeholder { color:#697477; }
.commercial-booking-widget input:focus,.commercial-booking-widget select:focus,.commercial-booking-widget textarea:focus { outline:2px solid rgba(205,173,105,.38); border-color:rgba(205,173,105,.42); }
.commercial-booking-widget .form-disclaimer { color:#798487; }
.commercial-booking-widget .booking-success { background:rgba(199,168,99,.12); color:#ecf0ef; }
.commercial-booking-widget .booking-success > span { background:#c6a45b; color:#111416; }
.commercial-booking-widget .booking-fallback { color:#aeb7b8; }
.commercial-booking-widget .booking-fallback a { color:#d0b570; }
.commercial-official-note { padding:0 0 75px; color:#7e898b; font-size:10px; line-height:1.6; }
.commercial-official-note p { margin:0; }
.commercial-official-note a { color:#cdb371; font-weight:700; }

@media (hover:hover) {
  .commercial-solution-card:hover { border-color:rgba(205,173,105,.24); transform:translateY(-2px); transition:transform .2s ease,border-color .2s ease; }
}

@media (max-width:900px) {
  .site-header { grid-template-columns:minmax(0,1fr) auto; }
  .audience-switch { grid-column:1 / -1; grid-row:2; width:100%; min-width:0; }
  .header-actions { grid-column:2; grid-row:1; }
  .residential-solutions-nav { grid-template-columns:1fr; gap:20px; }
  .residential-solutions-heading { text-align:center; }
  .residential-solutions-heading h2 { margin-inline:auto; }
  .commercial-hero { grid-template-columns:1fr; gap:50px; padding:78px 0 90px; }
  .commercial-brief { max-width:620px; }
  .commercial-equipment-grid,.commercial-market-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .commercial-market-grid article:nth-child(3n) { border-right:1px solid rgba(255,255,255,.08); }
  .commercial-market-grid article:nth-child(2n) { border-right:0; }
  .commercial-market-grid article:nth-last-child(-n+3) { border-bottom:1px solid rgba(255,255,255,.08); }
  .commercial-market-grid article:nth-last-child(-n+2) { border-bottom:0; }
  .commercial-booking-section { grid-template-columns:1fr; gap:42px; }
  .commercial-booking-intro { position:static; max-width:680px; }
}

@media (max-width:800px) {
  .site-header { padding-bottom:10px; }
  .audience-switch { margin-top:2px; }
  .audience-tab { min-height:42px; }
  .residential-solutions-nav { padding:27px 0 0; }
  .residential-solutions-heading h2 { font-size:31px; }
  .residential-solutions-nav .solution-switch { margin-top:0; }
  .commercial-experience { margin-top:14px; }
  .commercial-hero { min-height:0; gap:38px; padding:65px 0 75px; text-align:left; }
  .commercial-hero-copy h1 { font-size:clamp(48px,12vw,65px); }
  .commercial-lead { font-size:15px; }
  .commercial-brief { padding:26px 23px; }
  .commercial-equipment,.commercial-markets,.commercial-process { padding:76px 0; }
  .commercial-section-heading { margin-bottom:32px; }
  .commercial-section-heading h2 { font-size:clamp(38px,10vw,52px); }
  .commercial-equipment-grid,.commercial-market-grid { grid-template-columns:1fr; }
  .commercial-solution-card { min-height:220px; }
  .commercial-market-grid article,.commercial-market-grid article:nth-child(2n),.commercial-market-grid article:nth-child(3n),.commercial-market-grid article:nth-last-child(-n+3) { min-height:180px; border-right:0; border-bottom:1px solid rgba(255,255,255,.08); }
  .commercial-market-grid article:last-child { border-bottom:0; }
  .commercial-market-grid h3 { margin-top:39px; }
  .commercial-brand-strip { grid-template-columns:1fr; gap:21px; margin-top:73px; padding:29px 25px; }
  .commercial-process-grid { grid-template-columns:1fr; }
  .commercial-process-grid li { min-height:185px; }
  .commercial-process-grid h3 { margin-top:38px; }
  .commercial-booking-section { gap:34px; padding:78px 0; }
  .commercial-booking-intro { text-align:left; }
  .commercial-booking-intro h2 { font-size:clamp(40px,10.7vw,54px); }
  .commercial-booking-widget .contact-fields { grid-template-columns:1fr; }
  .commercial-booking-widget .field-wide { grid-column:span 1; }
  .commercial-official-note { padding-bottom:60px; }
}

@media (max-width:520px) {
  .site-header > .brand { min-width:74px; }
  .audience-switch { gap:3px; padding:3px; }
  .audience-tab { min-height:40px; padding:0 12px; font-size:9.5px; }
  .residential-solutions-nav { padding-top:23px; }
  .residential-solutions-heading h2 { max-width:290px; font-size:29px; }
  .residential-solutions-nav .solution-tab { min-width:132px; }
  .commercial-experience { border-top:1px solid rgba(255,255,255,.07); }
  .commercial-hero { padding-top:56px; }
  .commercial-hero-copy h1 { font-size:clamp(43px,12.4vw,55px); }
  .commercial-hero-actions { align-items:stretch; flex-direction:column; }
  .commercial-hero-actions .button { width:100%; }
  .commercial-text-link { align-self:flex-start; }
  .commercial-brief { border-radius:22px; }
  .commercial-equipment,.commercial-markets,.commercial-process { padding:66px 0; }
  .commercial-solution-card { min-height:205px; padding:23px 21px; }
  .commercial-market-grid article { padding:23px 21px; }
  .commercial-brand-strip { margin-top:62px; padding:25px 21px; }
  .commercial-brand-strip h2 { font-size:26px; }
  .commercial-booking-section { padding:66px 0; }
  .commercial-booking-widget .submit-booking { font-size:10px; }
}

/* Commercial light direction: clear white canvas with graphite and layered grey. */
body.commercial-mode { --ink:#171c1f; --muted:#626d71; --paper:#f7f8f8; --line:rgba(35,46,50,.14); background:#f7f8f8; color:#171c1f; }
body.commercial-mode .site-header { border-color:rgba(40,50,54,.14); background:rgba(249,250,250,.86); box-shadow:0 16px 38px rgba(35,43,46,.12),inset 0 1px 0 #fff; }
body.commercial-mode .brand-divider { background:rgba(33,43,47,.17); }
body.commercial-mode .brand-copy small { color:#687377; }
body.commercial-mode .audience-switch { border-color:rgba(35,46,50,.13); background:#eceeef; box-shadow:inset 0 1px 1px rgba(32,40,43,.05); }
body.commercial-mode .audience-tab { color:#606a6e; }
body.commercial-mode .audience-tab.active { border-color:#1c2225; background:linear-gradient(145deg,#303639,#171b1d); color:#fff; box-shadow:0 6px 16px rgba(20,26,28,.2),inset 0 1px 0 rgba(255,255,255,.12); }
body.commercial-mode .vip-header-cta { border-color:rgba(31,38,41,.22); background:linear-gradient(145deg,#303537,#111416); }
body.commercial-mode .header-cta { border-color:#1b2023; background:linear-gradient(145deg,#343a3d,#171b1d); color:#fff; box-shadow:0 8px 20px rgba(30,38,41,.18),inset 0 1px 0 rgba(255,255,255,.12); }
body.commercial-mode .header-cta span { color:#d8dddf; }
body.commercial-mode .site-footer { color:#505b5f; }
body.commercial-mode .footer-journal,body.commercial-mode .footer-review { color:#596569; }
body.commercial-mode .footer-links a + a { border-color:rgba(31,42,46,.13); }

.commercial-experience { background:radial-gradient(circle at 83% 2%,rgba(104,118,124,.12),transparent 31rem),radial-gradient(circle at 8% 18%,rgba(176,185,188,.16),transparent 28rem),linear-gradient(180deg,#fff 0,#f7f8f8 48%,#fff 100%); color:#171c1f; }
body.commercial-mode .commercial-experience .eyebrow { color:#5b666a; }
.commercial-hero-copy h1,.commercial-brief h2,.commercial-section-heading h2,.commercial-brand-strip h2,.commercial-booking-intro h2 { color:#151a1c; }
.commercial-lead { color:#596569; }
.commercial-bio-details summary { border-color:rgba(35,46,50,.18); background:#f1f3f3; color:#414b4f; }
.commercial-bio-details summary i { background:#dfe3e4; color:#252d30; }
.commercial-bio-expanded { border-color:rgba(35,46,50,.14); background:linear-gradient(145deg,#fff,#eceff0); box-shadow:0 18px 36px rgba(36,45,48,.1),inset 0 1px 0 #fff; }
.commercial-bio-expanded p { color:#5b666a; }
.commercial-primary { border-color:#171c1f; background:linear-gradient(145deg,#353b3e,#131719); color:#fff; box-shadow:0 12px 27px rgba(24,31,34,.2),inset 0 1px 0 rgba(255,255,255,.13); }
body.commercial-mode .commercial-primary span { color:#e0e4e5; }
.commercial-text-link { border-color:rgba(31,42,46,.45); color:#263034; }
.commercial-text-link span { color:#566267; }
.commercial-brief { border-color:rgba(35,46,50,.15); background:linear-gradient(145deg,#f7f8f8,#e3e7e8); box-shadow:0 27px 55px rgba(37,46,49,.14),inset 0 1px 0 #fff; }
.commercial-card-label { color:#566166; }
.commercial-audience-list { border-color:rgba(31,42,46,.12); }
.commercial-audience-list span { border-color:rgba(31,42,46,.12); background:rgba(255,255,255,.7); color:#515d61; }
.commercial-priorities div { border-color:rgba(31,42,46,.11); }
.commercial-priorities dt { color:#717c80; }
.commercial-priorities dd { color:#22292c; }

.commercial-section-heading > p:last-child { color:#606c70; }
.commercial-solution-card { border-color:rgba(35,46,50,.13); background:linear-gradient(145deg,#fff,#eceff0); box-shadow:0 10px 25px rgba(35,44,47,.06),inset 0 1px 0 #fff; }
.commercial-solution-card > span { color:#737d81; }
.commercial-solution-card h3 { color:#1d2427; }
.commercial-solution-card p { color:#5e696d; }
.commercial-availability-note { color:#788286; }
.commercial-markets { border-color:rgba(31,42,46,.1); }
.commercial-market-grid { border-color:rgba(31,42,46,.13); background:#f2f4f4; }
.commercial-market-grid article,.commercial-market-grid article:nth-child(2n),.commercial-market-grid article:nth-child(3n),.commercial-market-grid article:nth-last-child(-n+3) { border-color:rgba(31,42,46,.1); }
.commercial-market-grid span { color:#707b7f; }
.commercial-market-grid h3 { color:#1d2427; }
.commercial-market-grid p { color:#616c70; }
.commercial-brand-strip { border-color:rgba(35,46,50,.14); background:linear-gradient(135deg,#e5e8e9,#f8f9f9); box-shadow:inset 0 1px 0 #fff; }
.commercial-brand-strip > p { color:#4f5b5f; }
.commercial-process-grid li { border-color:#4d585c; background:linear-gradient(180deg,rgba(68,80,84,.08),transparent); }
.commercial-process-grid span { color:#707b7f; }
.commercial-process-grid h3 { color:#1d2427; }
.commercial-process-grid p { color:#606b6f; }

.commercial-booking-intro > p:not(.eyebrow) { color:#5d686c; }
.commercial-booking-points span { border-color:rgba(35,46,50,.15); background:#e9eced; color:#4f5a5e; }
.commercial-booking-widget label > span { color:#586367; }
.commercial-booking-widget input,.commercial-booking-widget select,.commercial-booking-widget textarea { border-color:rgba(31,42,46,.16); background:#fff; color:#1c2326; }
.commercial-booking-widget input::placeholder,.commercial-booking-widget textarea::placeholder { color:#899296; }
.commercial-booking-widget input:focus,.commercial-booking-widget select:focus,.commercial-booking-widget textarea:focus { outline-color:rgba(45,56,60,.27); border-color:#495559; }
.commercial-booking-widget .form-disclaimer { color:#707b7f; }
.commercial-booking-widget .booking-success { background:#dde3e4; color:#20272a; }
body.commercial-mode .commercial-booking-widget .booking-success > span { background:#2b3336; color:#fff; }
.commercial-booking-widget .booking-fallback { color:#606b6f; }
.commercial-booking-widget .booking-fallback a { color:#252d30; }
.commercial-official-note { color:#6e797d; }
.commercial-official-note a { color:#252d30; }
body.commercial-mode .commercial-booking-widget .booking-success { background:#dde3e4; color:#20272a; }
body.commercial-mode .commercial-booking-widget .booking-fallback a,body.commercial-mode .footer-link-arrow { color:#252d30; }

@media (hover:hover) {
  .commercial-solution-card:hover { border-color:rgba(31,42,46,.28); box-shadow:0 14px 30px rgba(35,44,47,.09),inset 0 1px 0 #fff; }
}

/* Residential audience accent: Reliance-inspired navy liquid glass. */
.audience-tab#audience-residential.active {
  border-color:rgba(217,240,251,.5);
  background:linear-gradient(145deg,rgba(8,100,145,.93),rgba(0,48,83,.96));
  box-shadow:0 7px 18px rgba(0,63,98,.24),inset 0 1px 0 rgba(255,255,255,.34),inset 0 -1px 0 rgba(0,19,36,.24);
  color:#fff;
  text-shadow:0 1px 2px rgba(0,25,44,.28);
  backdrop-filter:blur(17px) saturate(145%);
  -webkit-backdrop-filter:blur(17px) saturate(145%);
}
.audience-tab#audience-residential.active:focus-visible { outline-color:rgba(0,83,126,.55); }
@media (hover:hover) {
  .audience-tab#audience-residential.active:hover { background:linear-gradient(145deg,rgba(12,111,159,.95),rgba(0,54,91,.98)); box-shadow:0 9px 21px rgba(0,63,98,.29),inset 0 1px 0 rgba(255,255,255,.38); }
}

/* Commercial audience accent: Reliance-inspired red liquid glass. */
.audience-tab#audience-commercial.active {
  border-color:rgba(255,226,228,.54);
  background:linear-gradient(145deg,rgba(229,42,51,.94),rgba(165,8,21,.97));
  box-shadow:0 7px 18px rgba(164,15,27,.24),inset 0 1px 0 rgba(255,255,255,.34),inset 0 -1px 0 rgba(85,0,8,.24);
  color:#fff;
  text-shadow:0 1px 2px rgba(84,0,7,.3);
  backdrop-filter:blur(17px) saturate(145%);
  -webkit-backdrop-filter:blur(17px) saturate(145%);
}
.audience-tab#audience-commercial.active:focus-visible { outline-color:rgba(201,20,32,.52); }
@media (hover:hover) {
  .audience-tab#audience-commercial.active:hover { background:linear-gradient(145deg,rgba(238,50,59,.96),rgba(177,10,23,.99)); box-shadow:0 9px 21px rgba(164,15,27,.29),inset 0 1px 0 rgba(255,255,255,.38); }
}

/* Commercial booking calendar intentionally inherits the residential widget exactly. */
.commercial-booking-widget {
  --ink:#09202d;
  --muted:#607783;
  --line:rgba(70,118,139,.18);
  --aqua:#7fdce9;
  color:var(--ink);
}

/* Commercial refresh: modern navy and soft blue-grey, without outlined-grey chrome. */
body.commercial-mode { --ink:#142c3a; --muted:#60727c; --paper:#f5f8fa; --line:rgba(32,75,96,.13); background:#f5f8fa; color:#142c3a; }
body.commercial-mode .site-header { border-color:rgba(42,83,101,.12); background:rgba(251,253,254,.9); box-shadow:0 16px 38px rgba(24,57,72,.11),inset 0 1px 0 #fff; }
body.commercial-mode .audience-switch { border-color:transparent; background:#e8eff2; box-shadow:inset 0 1px 2px rgba(20,51,65,.08); }
body.commercial-mode .brand-divider { background:rgba(30,70,88,.16); }
body.commercial-mode .brand-copy small { color:#617681; }
body.commercial-mode .header-cta { border-color:#12364b; background:linear-gradient(145deg,#245c77,#10364c); box-shadow:0 8px 20px rgba(16,54,76,.2),inset 0 1px 0 rgba(255,255,255,.18); }

.commercial-experience { background:radial-gradient(circle at 86% 3%,rgba(73,135,161,.12),transparent 31rem),radial-gradient(circle at 6% 23%,rgba(177,207,218,.2),transparent 28rem),linear-gradient(180deg,#fff 0,#f3f7f9 48%,#fff 100%); }
body.commercial-mode .commercial-experience .eyebrow { color:#2e6f8b; }
.commercial-hero-copy h1,.commercial-section-heading h2,.commercial-brand-strip h2,.commercial-booking-section .booking-intro h2 { color:#122d3c; }
.commercial-lead,.commercial-section-heading > p:last-child,.commercial-booking-section .booking-intro > p:not(.eyebrow) { color:#5d717c; }
.commercial-bio-details summary { border:0; background:#e7f0f4; color:#275f78; box-shadow:inset 0 1px 0 rgba(255,255,255,.8); }
.commercial-bio-details summary i { background:#d1e3ea; color:#1c5872; }
.commercial-bio-expanded { border:0; background:linear-gradient(145deg,#fff,#eaf1f4); box-shadow:0 16px 34px rgba(24,61,78,.1); }
.commercial-bio-expanded p { color:#5b707a; }
.commercial-primary { border-color:#12364b; background:linear-gradient(145deg,#245f7c,#10364c); color:#fff; box-shadow:0 12px 27px rgba(16,54,76,.22),inset 0 1px 0 rgba(255,255,255,.18); }
body.commercial-mode .commercial-primary span { color:#d9edf5; }
.commercial-text-link { border-color:rgba(36,101,130,.42); color:#1f526a; }
.commercial-text-link span { color:#2e7695; }

.commercial-brief { border:0; background:linear-gradient(145deg,#e8f1f5,#d8e6ec); box-shadow:0 24px 52px rgba(25,63,80,.14),inset 0 1px 0 #fff; }
.commercial-card-label { color:#2d708c; }
.commercial-brief h2 { color:#143345; }
.commercial-audience-list { border-color:rgba(31,83,106,.11); }
.commercial-audience-list span { border:0; background:rgba(255,255,255,.74); color:#496773; box-shadow:0 4px 10px rgba(25,62,78,.05); }
.commercial-priorities div { border-color:rgba(31,83,106,.1); }
.commercial-priorities dt { color:#2f7591; }
.commercial-priorities dd { color:#173647; }

.commercial-equipment-grid { gap:14px; }
.commercial-solution-card { border:0; background:linear-gradient(145deg,#fff,#edf3f5); box-shadow:inset 0 3px 0 #3a7893,0 12px 27px rgba(25,61,77,.08); }
.commercial-solution-card > span { color:#2f7591; }
.commercial-solution-card h3 { color:#173647; }
.commercial-solution-card p { color:#60737d; }
.commercial-availability-note { color:#71848d; }
.commercial-markets { border:0; }
.commercial-market-grid { gap:12px; overflow:visible; border:0; background:transparent; }
.commercial-market-grid article,.commercial-market-grid article:nth-child(2n),.commercial-market-grid article:nth-child(3n),.commercial-market-grid article:nth-last-child(-n+3) { border:0; border-radius:19px; background:#fff; box-shadow:0 12px 28px rgba(24,59,75,.08); }
.commercial-market-grid span { color:#2f7591; }
.commercial-market-grid h3 { color:#173647; }
.commercial-market-grid p { color:#61747e; }
.commercial-brand-strip { border:0; background:linear-gradient(135deg,#dceaf0,#edf4f6); box-shadow:0 15px 34px rgba(24,60,77,.09),inset 0 1px 0 #fff; }
.commercial-brand-strip > p { color:#4e6975; }
.commercial-process-grid { gap:14px; }
.commercial-process-grid li { border:0; border-left:3px solid #3a7893; border-radius:0 18px 18px 0; background:#edf3f5; box-shadow:0 10px 24px rgba(24,59,75,.06); }
.commercial-process-grid span { color:#2f7591; }
.commercial-process-grid h3 { color:#173647; }
.commercial-process-grid p { color:#61747e; }
.commercial-booking-points span { border:0; background:#dfeaf0; color:#2a6078; }

/* The Commercial booking form now uses the Residential booking surface and calendar verbatim. */
.commercial-extended-booking { --ink:#09202d; --muted:#607783; --line:rgba(70,118,139,.18); --aqua:#7fdce9; color:var(--ink); }
.commercial-contact-fields select,.commercial-contact-fields textarea { min-width:0; width:100%; border:0; border-bottom:1px solid #b8c7c9; border-radius:0; outline:0; background:transparent; color:var(--ink); font:inherit; font-size:11px; }
.commercial-contact-fields select { min-height:33px; padding:4px 0 9px; }
.commercial-contact-fields textarea { padding:7px 0 10px; resize:vertical; line-height:1.6; }
.commercial-contact-fields select:focus,.commercial-contact-fields textarea:focus { border-color:var(--ink); }
.commercial-contact-fields textarea::placeholder { color:#879a9e; }
.commercial-booking-section .booking-success { background:rgba(211,250,246,.72); color:#295254; }
.commercial-booking-section .booking-success > span { background:var(--aqua); color:#09202d; }
.commercial-booking-section .booking-fallback { color:#607b80; }
.commercial-booking-section .booking-fallback a { color:#2d6d87; }
.commercial-official-note { color:#647983; }
.commercial-official-note a { color:#205f7a; }

@media (hover:hover) {
  .commercial-solution-card:hover { border:0; box-shadow:inset 0 3px 0 #2f6f8b,0 17px 34px rgba(24,60,77,.12); }
}

@media (max-width:900px) {
  .commercial-booking-section .booking-intro { position:static; max-width:680px; }
}

/* Shared clear liquid-glass header actions across Residential and Commercial. */
body .header-actions .vip-header-cta,
body .header-actions .header-cta {
  width:122px;
  min-width:122px;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:14px;
  background:linear-gradient(145deg,rgba(255,255,255,.62),rgba(228,239,243,.28));
  box-shadow:0 8px 20px rgba(31,57,67,.1),0 0 0 1px rgba(56,84,95,.08),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(76,104,114,.08);
  color:#29383e;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.01em;
  line-height:1;
  white-space:nowrap;
  text-shadow:none;
  backdrop-filter:blur(19px) saturate(140%);
  -webkit-backdrop-filter:blur(19px) saturate(140%);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}

body .header-actions .vip-header-cta > span,
body .header-actions .header-cta > span {
  color:#52666e;
  font-size:14px;
}

body .header-actions .vip-header-cta:hover,
body .header-actions .header-cta:hover {
  transform:translateY(-1px);
  background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(231,241,244,.38));
  box-shadow:0 10px 23px rgba(31,57,67,.13),0 0 0 1px rgba(56,84,95,.1),inset 0 1px 0 #fff;
}

body .header-actions .vip-header-cta:focus-visible,
body .header-actions .header-cta:focus-visible {
  outline:2px solid rgba(59,87,98,.34);
  outline-offset:3px;
}

@media (max-width:800px) {
  body .header-actions .vip-header-cta,
  body .header-actions .header-cta {
    width:112px;
    min-width:112px;
    min-height:39px;
    padding:9px 10px;
    font-size:9.5px;
  }
}

@media (max-width:520px) {
  body .header-actions .vip-header-cta,
  body .header-actions .header-cta {
    width:88px;
    min-width:88px;
    min-height:37px;
    padding:8px 6px;
    font-size:8px;
  }
}

/* Commercial 2026 refinement: clean operations-led layout and animated equipment. */
body.commercial-mode .commercial-experience {
  position:relative;
  margin-top:18px;
  background:
    linear-gradient(rgba(34,82,103,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(34,82,103,.026) 1px,transparent 1px),
    radial-gradient(circle at 86% 4%,rgba(71,142,170,.14),transparent 30rem),
    radial-gradient(circle at 3% 24%,rgba(192,218,227,.28),transparent 28rem),
    linear-gradient(180deg,#fff 0,#f3f7f9 48%,#fff 100%);
  background-size:42px 42px,42px 42px,auto,auto,auto;
}

body.commercial-mode .commercial-hero {
  min-height:620px;
  grid-template-columns:minmax(0,1.16fr) minmax(340px,.84fr);
  gap:72px;
  padding:82px 0 98px;
}

body.commercial-mode .commercial-hero-copy h1 {
  max-width:760px;
  color:#102c3b;
  font-size:clamp(52px,6.15vw,80px);
}

body.commercial-mode .commercial-lead { max-width:690px; }

body.commercial-mode .commercial-bio-details summary {
  border:1px solid rgba(37,92,116,.09);
  background:rgba(238,246,249,.82);
  box-shadow:0 8px 22px rgba(24,66,84,.06),inset 0 1px 0 #fff;
}

body.commercial-mode .commercial-brief {
  position:relative;
  overflow:hidden;
  padding:35px;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at 96% -8%,rgba(99,192,221,.3),transparent 15rem),
    linear-gradient(145deg,#1a485e,#0d2938 72%);
  box-shadow:0 28px 65px rgba(17,54,72,.22),inset 0 1px 0 rgba(255,255,255,.17);
  color:#fff;
}

body.commercial-mode .commercial-brief::after {
  content:"";
  position:absolute;
  right:-54px;
  bottom:-68px;
  width:190px;
  height:190px;
  border:1px solid rgba(151,221,239,.16);
  border-radius:50%;
  box-shadow:0 0 0 34px rgba(145,216,235,.045),0 0 0 69px rgba(145,216,235,.025);
}

body.commercial-mode .commercial-card-label { color:#91d5e8; }
body.commercial-mode .commercial-brief h2 { position:relative; z-index:1; color:#fff; }
body.commercial-mode .commercial-audience-list { position:relative; z-index:1; border-color:rgba(255,255,255,.12); }
body.commercial-mode .commercial-audience-list span {
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  color:#d8e8ee;
}
body.commercial-mode .commercial-priorities { position:relative; z-index:1; }
body.commercial-mode .commercial-priorities div { border-color:rgba(255,255,255,.12); }
body.commercial-mode .commercial-priorities dt { color:#7fd4eb; }
body.commercial-mode .commercial-priorities dd { color:#f3f8fa; }

.commercial-section-nav {
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin-top:-38px;
  padding:8px;
  border:1px solid rgba(255,255,255,.8);
  border-radius:22px;
  background:rgba(239,246,249,.76);
  box-shadow:0 18px 44px rgba(22,64,82,.12),inset 0 1px 0 #fff;
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
}

.commercial-section-nav a {
  min-height:74px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:12px;
  padding:0 17px;
  border:1px solid transparent;
  border-radius:16px;
  color:#17384a;
  transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;
}

.commercial-section-nav a + a { border-left-color:rgba(39,91,114,.09); }
.commercial-section-nav span { color:#4f8196; font-size:9px; font-weight:750; letter-spacing:.08em; }
.commercial-section-nav b { font-size:11px; letter-spacing:-.01em; }
.commercial-section-nav i { color:#4b7d91; font-size:14px; font-style:normal; }
.commercial-section-nav a:focus-visible { outline:2px solid rgba(35,102,131,.42); outline-offset:2px; }

.commercial-equipment { padding-top:112px; }
#commercial-equipment,#commercial-markets,#commercial-process,#commercial-book { scroll-margin-top:118px; }
.commercial-section-heading { margin-bottom:42px; }
.commercial-section-heading h2 { max-width:760px; }
.commercial-section-heading > p:last-child { max-width:690px; }

body.commercial-mode .commercial-equipment-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

body.commercial-mode .commercial-solution-card {
  position:relative;
  min-height:420px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:22px;
  border:1px solid rgba(34,81,101,.1);
  border-radius:25px;
  background:linear-gradient(150deg,rgba(255,255,255,.98),rgba(238,245,247,.92));
  box-shadow:0 16px 36px rgba(24,62,79,.09),inset 0 1px 0 #fff;
  isolation:isolate;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}

body.commercial-mode .commercial-solution-card::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:radial-gradient(circle at 85% 15%,rgba(111,198,222,.14),transparent 11rem);
  opacity:.65;
  transition:opacity .25s ease;
}

.commercial-card-topline {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:28px;
  padding:0 2px;
}

.commercial-card-topline span {
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  border-radius:50%;
  background:#dcebf0;
  color:#2f6e88;
  font-size:8px;
  font-weight:800;
}

.commercial-card-topline b {
  color:#5f8291;
  font-size:7.5px;
  font-weight:750;
  letter-spacing:.13em;
}

.commercial-card-copy { margin-top:auto; padding:18px 3px 2px; }
body.commercial-mode .commercial-card-copy h3 { margin:0 0 10px; color:#153647; font-size:19px; }
body.commercial-mode .commercial-card-copy p { margin:0; color:#5e737d; font-size:11.5px; line-height:1.65; }

.commercial-equipment-visual {
  position:relative;
  height:154px;
  overflow:hidden;
  margin:20px 0 0;
  border:1px solid rgba(42,102,127,.08);
  border-radius:18px;
  background:
    linear-gradient(rgba(48,108,132,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(48,108,132,.05) 1px,transparent 1px),
    linear-gradient(145deg,#edf5f7,#dfecef);
  background-size:18px 18px,18px 18px,auto;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92);
}

.commercial-equipment-visual::after {
  content:"";
  position:absolute;
  inset:auto 12px 10px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(48,98,118,.2),transparent);
}

/* Heating and cooling scene. */
.commercial-hvac-unit {
  position:absolute;
  left:50%;
  top:33px;
  width:104px;
  height:81px;
  transform:translateX(-50%);
  border:1px solid rgba(31,80,101,.26);
  border-radius:13px;
  background:linear-gradient(145deg,#f8fbfc,#cbdde3);
  box-shadow:0 15px 25px rgba(26,70,89,.16),inset 0 1px 0 #fff;
}

.commercial-hvac-unit i {
  position:absolute;
  left:13px;
  top:18px;
  width:43px;
  height:43px;
  border:5px double rgba(39,91,112,.46);
  border-radius:50%;
  background:conic-gradient(from 25deg,#3e7991 0 12%,transparent 12% 25%,#3e7991 25% 37%,transparent 37% 50%,#3e7991 50% 62%,transparent 62% 75%,#3e7991 75% 87%,transparent 87%);
}

.commercial-hvac-unit b {
  position:absolute;
  right:12px;
  top:20px;
  width:25px;
  height:32px;
  border-radius:4px;
  background:repeating-linear-gradient(180deg,#638c9c 0 2px,transparent 2px 7px);
}

.commercial-hvac-unit em {
  position:absolute;
  right:14px;
  bottom:12px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#52b5d0;
  box-shadow:0 0 0 4px rgba(82,181,208,.13),0 0 11px rgba(82,181,208,.55);
}

.commercial-visual-hvac small {
  position:absolute;
  right:13px;
  top:12px;
  padding:5px 7px;
  border-radius:7px;
  background:#173f53;
  color:#d8f4fb;
  font-size:7px;
  font-weight:750;
}

.commercial-airflow {
  position:absolute;
  left:24px;
  width:30px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#57b7d2);
  opacity:0;
}
.commercial-airflow::after { content:""; position:absolute; right:0; top:-2px; width:5px; height:5px; border-top:1px solid #57b7d2; border-right:1px solid #57b7d2; transform:rotate(45deg); }
.commercial-airflow.airflow-one { top:57px; }
.commercial-airflow.airflow-two { top:72px; animation-delay:.35s; }
.commercial-airflow.airflow-three { top:87px; animation-delay:.7s; }

/* Rooftop and make-up air scene. */
.commercial-roof-plane {
  position:absolute;
  left:16px;
  right:16px;
  bottom:22px;
  height:38px;
  transform:skewX(-18deg);
  border:1px solid rgba(44,91,109,.18);
  border-radius:7px;
  background:linear-gradient(150deg,#d4e3e8,#b9cdd5);
  box-shadow:0 13px 20px rgba(34,79,96,.12);
}

.commercial-rooftop-unit {
  position:absolute;
  left:50%;
  top:31px;
  z-index:1;
  width:114px;
  height:67px;
  transform:translateX(-50%);
  border:1px solid rgba(33,80,100,.27);
  border-radius:10px;
  background:linear-gradient(145deg,#f4f8f9,#bfd2d9);
  box-shadow:0 12px 24px rgba(31,75,93,.18),inset 0 1px 0 #fff;
}
.commercial-rooftop-unit i { position:absolute; left:16px; top:14px; width:38px; height:38px; border:4px solid rgba(44,90,108,.4); border-radius:50%; background:conic-gradient(#3f7e96 0 12%,transparent 12% 25%,#3f7e96 25% 37%,transparent 37% 50%,#3f7e96 50% 62%,transparent 62% 75%,#3f7e96 75% 87%,transparent 87%); }
.commercial-rooftop-unit b { position:absolute; right:13px; top:16px; width:32px; height:22px; background:repeating-linear-gradient(180deg,#5e8999 0 2px,transparent 2px 6px); }
.commercial-rooftop-unit em { position:absolute; right:16px; bottom:10px; width:18px; height:4px; border-radius:999px; background:#56b9d1; box-shadow:0 0 9px rgba(86,185,209,.62); }
.commercial-rooftop-flow { position:absolute; left:calc(50% + 58px); top:47px; width:29px; height:2px; border-radius:999px; background:linear-gradient(90deg,#55b6cf,transparent); opacity:0; }
.commercial-rooftop-flow.flow-two { top:61px; animation-delay:.4s; }
.commercial-rooftop-flow.flow-three { top:75px; animation-delay:.8s; }

/* Hot water and boiler scene. */
.commercial-boiler-unit {
  position:absolute;
  left:34px;
  top:29px;
  width:78px;
  height:91px;
  border:1px solid rgba(45,86,101,.25);
  border-radius:11px;
  background:linear-gradient(145deg,#f8fafb,#cddde2);
  box-shadow:0 14px 24px rgba(37,73,87,.15),inset 0 1px 0 #fff;
}
.commercial-boiler-unit i { position:absolute; left:14px; right:14px; top:14px; height:22px; border-radius:6px; background:#183d4f; box-shadow:inset 0 0 0 1px rgba(151,225,241,.14); }
.commercial-boiler-unit i::after { content:"88°"; position:absolute; right:7px; top:7px; color:#8bdeef; font:700 6px/1 Inter,sans-serif; }
.commercial-boiler-unit b { position:absolute; left:25px; bottom:17px; width:27px; height:30px; clip-path:polygon(50% 0,76% 35%,93% 68%,72% 100%,28% 100%,7% 68%,24% 35%); background:linear-gradient(#ffd16f,#ef703e); filter:drop-shadow(0 0 7px rgba(236,119,58,.38)); }
.commercial-boiler-unit em { position:absolute; left:15px; right:15px; bottom:9px; height:2px; border-radius:999px; background:#7899a5; }
.commercial-boiler-tank { position:absolute; right:39px; top:37px; width:58px; height:82px; border:1px solid rgba(39,84,101,.24); border-radius:28px 28px 12px 12px; background:linear-gradient(90deg,#c5d8df,#f8fbfc 52%,#b6ccd4); box-shadow:0 13px 22px rgba(34,74,90,.14); overflow:hidden; }
.commercial-boiler-tank i { position:absolute; left:0; right:0; bottom:0; height:58%; background:linear-gradient(180deg,rgba(102,196,220,.54),rgba(44,139,177,.68)); }
.commercial-boiler-tank b { position:absolute; left:50%; top:11px; width:14px; height:14px; transform:translateX(-50%); border:3px solid #6c92a1; border-radius:50%; }
.commercial-heat-line { position:absolute; left:13px; top:72px; width:18px; height:30px; border-left:2px solid rgba(238,120,60,.55); border-radius:50%; opacity:0; }
.commercial-heat-line.line-two { left:19px; animation-delay:.55s; }
.commercial-heat-line.line-three { left:25px; animation-delay:1.1s; }

/* Indoor air-quality scene. */
.commercial-air-duct { position:absolute; left:26px; right:26px; top:46px; height:62px; border:1px solid rgba(40,87,105,.21); border-radius:12px; background:linear-gradient(180deg,#f8fbfc,#cadde3); box-shadow:0 12px 22px rgba(31,73,90,.13),inset 0 1px 0 #fff; }
.commercial-air-duct i { position:absolute; left:50%; top:-8px; width:19px; height:78px; transform:translateX(-50%) skewX(-8deg); border:1px solid rgba(43,98,119,.26); background:repeating-linear-gradient(90deg,#65a4b8 0 2px,#cce2e8 2px 5px); box-shadow:0 0 15px rgba(77,159,185,.18); }
.commercial-air-duct b,.commercial-air-duct em { position:absolute; top:23px; width:29px; height:2px; background:linear-gradient(90deg,transparent,#5dabc2); }
.commercial-air-duct b { left:14px; }
.commercial-air-duct em { right:14px; transform:rotate(180deg); }
.commercial-particle { position:absolute; left:43px; top:65px; z-index:2; width:6px; height:6px; border-radius:50%; background:#8d9c9e; box-shadow:0 0 0 3px rgba(119,137,140,.1); opacity:0; }
.commercial-particle.particle-two { top:80px; left:36px; animation-delay:.55s; }
.commercial-particle.particle-three { top:91px; left:51px; animation-delay:1.1s; }
.commercial-particle.particle-four { top:72px; left:59px; animation-delay:1.65s; }
.commercial-clean-air { position:absolute; right:40px; top:63px; z-index:2; display:flex; gap:7px; }
.commercial-clean-air i,.commercial-clean-air b,.commercial-clean-air em { width:7px; height:7px; border-radius:50%; background:#62bed4; box-shadow:0 0 8px rgba(68,175,203,.48); opacity:.35; }

/* Water purification scene. */
.commercial-water-feed { position:absolute; left:24px; top:26px; width:58px; height:35px; border-top:7px solid #789ba8; border-right:7px solid #789ba8; border-radius:0 14px 0 0; }
.commercial-water-feed i,.commercial-water-feed b { position:absolute; right:-9px; top:22px; width:11px; height:11px; transform:rotate(45deg); border-radius:9px 9px 10px 9px; background:#5baecc; opacity:0; }
.commercial-water-feed b { top:41px; animation-delay:.75s; }
.commercial-water-cartridges { position:absolute; left:50%; top:30px; display:flex; gap:8px; transform:translateX(-50%); }
.commercial-water-cartridges i { width:31px; height:80px; border:1px solid rgba(39,91,111,.23); border-radius:9px 9px 14px 14px; background:linear-gradient(90deg,#bdd4dc,#f7fafb 50%,#aac7d1); box-shadow:0 10px 18px rgba(32,75,92,.14),inset 0 1px 0 #fff; }
.commercial-water-cartridges i:nth-child(2) { background:linear-gradient(90deg,#99c6d4,#e9f5f7 50%,#78b0c2); }
.commercial-water-cartridges i:nth-child(3) { background:linear-gradient(90deg,#c6dce2,#fff 50%,#b0ced7); }
.commercial-water-drop { position:absolute; left:calc(50% - 38px); top:50px; width:8px; height:8px; transform:rotate(45deg); border-radius:8px 8px 9px 8px; background:#4eabc9; opacity:0; }
.commercial-water-drop.drop-two { left:calc(50% - 2px); animation-delay:.55s; }
.commercial-water-drop.drop-three { left:calc(50% + 34px); animation-delay:1.1s; }
.commercial-water-output { position:absolute; right:22px; bottom:26px; width:58px; height:8px; border-radius:999px; background:linear-gradient(90deg,#58b4d1,rgba(88,180,209,.08)); }

/* Service and lifecycle scene. */
.commercial-service-gauge { position:absolute; left:38px; top:31px; width:91px; height:91px; border:10px solid #c9dce2; border-top-color:#4fa9c4; border-right-color:#4fa9c4; border-radius:50%; background:#edf5f7; box-shadow:0 13px 23px rgba(31,72,89,.14),inset 0 0 0 1px rgba(48,99,119,.08); }
.commercial-service-gauge i { position:absolute; left:50%; bottom:50%; width:2px; height:29px; transform-origin:bottom center; transform:rotate(-54deg); border-radius:999px; background:#173e51; }
.commercial-service-gauge b { position:absolute; left:50%; top:50%; width:8px; height:8px; transform:translate(-50%,-50%); border-radius:50%; background:#1e4b5f; box-shadow:0 0 0 4px rgba(30,75,95,.12); }
.commercial-service-gauge em { position:absolute; inset:23px; border-radius:50%; background:radial-gradient(circle,#69bed3 0 17%,transparent 19%); opacity:.28; }
.commercial-service-bars { position:absolute; right:35px; top:45px; width:77px; height:63px; display:flex; align-items:flex-end; gap:6px; padding:8px; border-bottom:1px solid rgba(42,89,106,.24); }
.commercial-service-bars i { flex:1; height:34%; border-radius:3px 3px 0 0; background:linear-gradient(#62bdd3,#327b98); transform-origin:bottom; }
.commercial-service-bars i:nth-child(2) { height:58%; animation-delay:.22s; }
.commercial-service-bars i:nth-child(3) { height:78%; animation-delay:.44s; }
.commercial-service-bars i:nth-child(4) { height:94%; animation-delay:.66s; }
.commercial-service-status { position:absolute; right:32px; bottom:25px; padding:6px 8px; border-radius:6px; background:#183e50; color:#9ee4f3; font-size:6px; font-weight:800; letter-spacing:.09em; box-shadow:0 5px 12px rgba(25,63,79,.17); }

body.commercial-mode .commercial-availability-note {
  max-width:max-content;
  margin:26px 0 0;
  padding:10px 13px;
  border:1px solid rgba(42,91,111,.1);
  border-radius:11px;
  background:rgba(255,255,255,.67);
  box-shadow:0 7px 18px rgba(29,68,84,.05);
  color:#6c818a;
}

body.commercial-mode .commercial-markets {
  border:0;
  background:linear-gradient(180deg,transparent,rgba(221,236,241,.34),transparent);
}

body.commercial-mode .commercial-market-grid { gap:14px; }
body.commercial-mode .commercial-market-grid article,
body.commercial-mode .commercial-market-grid article:nth-child(2n),
body.commercial-mode .commercial-market-grid article:nth-child(3n),
body.commercial-mode .commercial-market-grid article:nth-last-child(-n+3) {
  position:relative;
  min-height:220px;
  overflow:hidden;
  padding:25px;
  border:1px solid rgba(37,83,101,.08);
  border-radius:22px;
  background:rgba(255,255,255,.86);
  box-shadow:0 15px 34px rgba(28,65,81,.07),inset 0 1px 0 #fff;
}

body.commercial-mode .commercial-market-grid article::after {
  content:"";
  position:absolute;
  right:-35px;
  top:-35px;
  width:105px;
  height:105px;
  border:1px solid rgba(68,133,158,.1);
  border-radius:50%;
  box-shadow:0 0 0 18px rgba(77,146,171,.035);
}

body.commercial-mode .commercial-market-grid span {
  display:inline-flex;
  padding:7px 9px;
  border-radius:999px;
  background:#e3eff3;
  color:#376f86;
}
body.commercial-mode .commercial-market-grid h3 { margin:48px 0 10px; color:#153747; }
body.commercial-mode .commercial-market-grid p { color:#617681; }

body.commercial-mode .commercial-brand-strip {
  position:relative;
  overflow:hidden;
  border:1px solid rgba(35,79,98,.08);
  border-radius:28px;
  background:linear-gradient(135deg,#d9eaef,#f7fafb 72%);
  box-shadow:0 18px 40px rgba(25,65,81,.09),inset 0 1px 0 #fff;
}
body.commercial-mode .commercial-brand-strip::after { content:"TRUSTED EQUIPMENT"; position:absolute; right:-7px; bottom:-7px; color:rgba(36,93,117,.055); font-size:clamp(32px,5.8vw,72px); font-weight:800; letter-spacing:-.06em; white-space:nowrap; }
body.commercial-mode .commercial-brand-strip > * { position:relative; z-index:1; }

body.commercial-mode .commercial-process-grid { position:relative; gap:18px; }
body.commercial-mode .commercial-process-grid::before { content:""; position:absolute; left:11%; right:11%; top:48px; height:1px; background:linear-gradient(90deg,transparent,#7fabbc 15%,#7fabbc 85%,transparent); }
body.commercial-mode .commercial-process-grid li {
  position:relative;
  min-height:235px;
  padding:26px;
  border:1px solid rgba(37,83,101,.08);
  border-radius:22px;
  background:linear-gradient(150deg,#f8fbfc,#e8f1f4);
  box-shadow:0 14px 32px rgba(27,64,80,.07),inset 0 1px 0 #fff;
}
body.commercial-mode .commercial-process-grid li span { position:relative; z-index:1; display:grid; place-items:center; width:45px; height:45px; border:7px solid #e9f2f5; border-radius:50%; background:#245d75; color:#fff; box-shadow:0 0 0 1px rgba(37,91,114,.16),0 7px 16px rgba(29,78,98,.16); }
body.commercial-mode .commercial-process-grid h3 { margin:52px 0 11px; color:#173748; }
body.commercial-mode .commercial-process-grid p { color:#607681; }

body.commercial-mode .commercial-booking-section {
  gap:66px;
  margin-top:30px;
  margin-bottom:55px;
  padding:54px;
  border:1px solid rgba(35,80,99,.08);
  border-radius:31px;
  background:linear-gradient(145deg,#e7f1f4,#f9fbfc 58%);
  box-shadow:0 24px 54px rgba(24,65,82,.1),inset 0 1px 0 #fff;
}
body.commercial-mode .commercial-booking-points span { border:1px solid rgba(38,93,116,.08); background:rgba(255,255,255,.66); color:#2e6880; box-shadow:inset 0 1px 0 #fff; }
body.commercial-mode .commercial-extended-booking { box-shadow:0 22px 45px rgba(29,66,81,.12),inset 0 1px 0 #fff; }

@media (hover:hover) {
  .commercial-section-nav a:hover { transform:translateY(-2px); border-color:rgba(41,99,123,.1); background:rgba(255,255,255,.7); box-shadow:0 8px 18px rgba(31,78,97,.08); }
  body.commercial-mode .commercial-solution-card:hover { transform:translateY(-4px); border-color:rgba(45,114,140,.14); box-shadow:0 23px 46px rgba(24,64,81,.13),inset 0 1px 0 #fff; }
  body.commercial-mode .commercial-solution-card:hover::before { opacity:1; }
  body.commercial-mode .commercial-market-grid article:hover { transform:translateY(-3px); box-shadow:0 20px 42px rgba(27,66,83,.11),inset 0 1px 0 #fff; transition:transform .22s ease,box-shadow .22s ease; }
}

.commercial-hvac-unit i,.commercial-rooftop-unit i { animation:commercial-fan-spin 7s linear infinite; }
.commercial-hvac-unit em,.commercial-rooftop-unit em { animation:commercial-status-pulse 2.2s ease-in-out infinite; }
.commercial-airflow { animation:commercial-airflow-left 4.6s ease-in-out infinite; }
.commercial-rooftop-flow { animation:commercial-airflow-right 4.8s ease-in-out infinite; }
.commercial-boiler-unit b { animation:commercial-flame 2.6s ease-in-out infinite; }
.commercial-boiler-tank i { animation:commercial-water-recovery 5.8s ease-in-out infinite; }
.commercial-heat-line { animation:commercial-heat-rise 3.4s ease-out infinite; }
.commercial-particle { animation:commercial-particle-capture 5.4s ease-in-out infinite; }
.commercial-clean-air i,.commercial-clean-air b,.commercial-clean-air em { animation:commercial-clean-pulse 3.5s ease-in-out infinite; }
.commercial-clean-air b { animation-delay:.4s; }.commercial-clean-air em { animation-delay:.8s; }
.commercial-water-feed i,.commercial-water-feed b { animation:commercial-drop-fall 4.4s ease-in-out infinite; }
.commercial-water-drop { animation:commercial-cartridge-flow 4.8s ease-in-out infinite; }
.commercial-water-output { animation:commercial-water-output 4.8s ease-in-out infinite; }
.commercial-service-gauge i { animation:commercial-gauge-sweep 5s ease-in-out infinite; }
.commercial-service-gauge em { animation:commercial-status-pulse 2.4s ease-in-out infinite; }
.commercial-service-bars i { animation:commercial-bar-rise 3.6s ease-in-out infinite; }
.commercial-service-status { animation:commercial-ready-pulse 2.8s ease-in-out infinite; }

@keyframes commercial-fan-spin { to { transform:rotate(360deg); } }
@keyframes commercial-status-pulse { 0%,100% { opacity:.55; filter:saturate(.72); } 50% { opacity:1; filter:saturate(1.25); } }
@keyframes commercial-airflow-left { 0%,18%,100% { opacity:0; transform:translateX(29px) scaleX(.4); } 35%,68% { opacity:1; transform:translateX(0) scaleX(1); } 84% { opacity:0; transform:translateX(-8px); } }
@keyframes commercial-airflow-right { 0%,18%,100% { opacity:0; transform:translateX(-22px) scaleX(.4); } 35%,68% { opacity:1; transform:translateX(0) scaleX(1); } 84% { opacity:0; transform:translateX(11px); } }
@keyframes commercial-flame { 0%,100% { transform:scale(.78) translateY(2px); opacity:.67; } 52% { transform:scale(1.04) translateY(-1px); opacity:1; } }
@keyframes commercial-water-recovery { 0%,15% { height:24%; opacity:.4; } 52%,78% { height:64%; opacity:.8; } 96%,100% { height:24%; opacity:.4; } }
@keyframes commercial-heat-rise { 0% { opacity:0; transform:translateY(9px) scaleY(.55); } 35% { opacity:.8; } 100% { opacity:0; transform:translateY(-23px) scaleY(1.1); } }
@keyframes commercial-particle-capture { 0%,12% { opacity:0; transform:translateX(-9px) scale(.72); } 28% { opacity:.9; } 65% { opacity:.7; transform:translateX(76px) scale(.78); } 78%,100% { opacity:0; transform:translateX(90px) scale(.15); } }
@keyframes commercial-clean-pulse { 0%,100% { opacity:.25; transform:translateX(-4px); } 50% { opacity:1; transform:translateX(6px); } }
@keyframes commercial-drop-fall { 0%,15% { opacity:0; transform:translateY(-4px) rotate(45deg) scale(.7); } 35%,66% { opacity:1; transform:translateY(18px) rotate(45deg) scale(1); } 86%,100% { opacity:0; transform:translateY(29px) rotate(45deg) scale(.7); } }
@keyframes commercial-cartridge-flow { 0%,18% { opacity:0; transform:translateY(-9px) rotate(45deg) scale(.7); } 36%,68% { opacity:.9; transform:translateY(35px) rotate(45deg) scale(1); } 86%,100% { opacity:0; transform:translateY(57px) rotate(45deg) scale(.68); } }
@keyframes commercial-water-output { 0%,22%,100% { opacity:.3; transform:scaleX(.18); transform-origin:left; } 42%,76% { opacity:1; transform:scaleX(1); transform-origin:left; } }
@keyframes commercial-gauge-sweep { 0%,14% { transform:rotate(-54deg); } 48%,74% { transform:rotate(38deg); } 92%,100% { transform:rotate(-54deg); } }
@keyframes commercial-bar-rise { 0%,100% { transform:scaleY(.4); opacity:.48; } 48%,70% { transform:scaleY(1); opacity:1; } }
@keyframes commercial-ready-pulse { 0%,100% { box-shadow:0 5px 12px rgba(25,63,79,.17); } 50% { box-shadow:0 5px 18px rgba(71,177,204,.38); } }

@media (max-width:1050px) {
  body.commercial-mode .commercial-hero { grid-template-columns:1fr; gap:48px; }
  body.commercial-mode .commercial-brief { max-width:700px; }
  .commercial-section-nav { margin-top:-26px; }
  body.commercial-mode .commercial-equipment-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.commercial-mode .commercial-booking-section { padding:44px; }
}

@media (max-width:800px) {
  .commercial-section-nav { grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; border-radius:19px; }
  .commercial-section-nav a { min-height:62px; padding:0 13px; }
  .commercial-section-nav a + a { border-left-color:transparent; }
  .commercial-section-nav a:nth-child(even) { border-left-color:rgba(39,91,114,.09); }
  body.commercial-mode .commercial-equipment-grid { grid-template-columns:1fr; }
  body.commercial-mode .commercial-solution-card { min-height:390px; }
  body.commercial-mode .commercial-process-grid::before { display:none; }
  body.commercial-mode .commercial-booking-section { gap:37px; padding:34px 26px; border-radius:25px; }
}

@media (max-width:520px) {
  body.commercial-mode .commercial-experience { margin-top:14px; background-size:32px 32px,32px 32px,auto,auto,auto; }
  body.commercial-mode .commercial-hero { gap:34px; padding:56px 0 72px; }
  body.commercial-mode .commercial-hero-copy h1 { font-size:clamp(43px,12.4vw,55px); }
  body.commercial-mode .commercial-brief { padding:26px 22px; border-radius:23px; }
  .commercial-section-nav { margin-top:-20px; padding:6px; }
  .commercial-section-nav a { min-height:58px; gap:8px; padding:0 10px; }
  .commercial-section-nav b { font-size:9.5px; }
  .commercial-section-nav i { font-size:11px; }
  .commercial-equipment { padding-top:82px; }
  body.commercial-mode .commercial-solution-card { min-height:378px; padding:19px; border-radius:22px; }
  .commercial-equipment-visual { height:145px; margin-top:17px; }
  body.commercial-mode .commercial-market-grid article,
  body.commercial-mode .commercial-market-grid article:nth-child(2n),
  body.commercial-mode .commercial-market-grid article:nth-child(3n),
  body.commercial-mode .commercial-market-grid article:nth-last-child(-n+3) { min-height:196px; }
  body.commercial-mode .commercial-brand-strip { border-radius:23px; }
  body.commercial-mode .commercial-process-grid li { min-height:205px; }
  body.commercial-mode .commercial-process-grid h3 { margin-top:35px; }
  body.commercial-mode .commercial-booking-section { width:calc(100% - 28px); padding:28px 18px; }
}

@media (prefers-reduced-motion:reduce) {
  .commercial-equipment-visual *,
  .commercial-equipment-visual *::before,
  .commercial-equipment-visual *::after { animation:none !important; }
}

/* Commercial industry symbols. */
.commercial-market-card-head {
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.commercial-market-symbol {
  position:relative;
  width:60px;
  height:60px;
  flex:0 0 60px;
  overflow:hidden;
  border:1px solid rgba(44,102,126,.11);
  border-radius:18px;
  background:linear-gradient(145deg,#f2f8fa,#d8e9ee);
  box-shadow:0 10px 22px rgba(28,76,95,.1),inset 0 1px 0 #fff;
  color:#265f77;
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}

.commercial-market-symbol::after {
  content:"";
  position:absolute;
  left:-15px;
  top:-29px;
  width:68px;
  height:68px;
  border:1px solid rgba(86,163,190,.11);
  border-radius:50%;
}

.commercial-market-symbol i,
.commercial-market-symbol b,
.commercial-market-symbol em {
  position:absolute;
  z-index:1;
  display:block;
  font-style:normal;
}

body.commercial-mode .commercial-market-card-head > span {
  position:relative;
  z-index:1;
  margin-top:2px;
}

body.commercial-mode .commercial-market-grid article h3 {
  position:relative;
  z-index:1;
  margin:28px 0 10px;
}

body.commercial-mode .commercial-market-grid article p {
  position:relative;
  z-index:1;
}

/* Property management: paired commercial buildings. */
.symbol-property i,
.symbol-property b {
  bottom:14px;
  border-radius:3px 3px 1px 1px;
  background:linear-gradient(150deg,#377b96,#1d526a);
  box-shadow:inset 1px 0 0 rgba(255,255,255,.16);
}
.symbol-property i { left:13px; width:15px; height:27px; }
.symbol-property b { right:13px; width:17px; height:36px; }
.symbol-property i::after,
.symbol-property b::after { content:""; position:absolute; left:4px; top:6px; width:3px; height:3px; border-radius:1px; background:#b6e3ed; box-shadow:6px 0 #b6e3ed,0 7px #b6e3ed,6px 7px #b6e3ed,0 14px #b6e3ed,6px 14px #b6e3ed; opacity:.82; }
.symbol-property em { left:9px; right:9px; bottom:10px; height:3px; border-radius:999px; background:#719cac; }

/* Restaurants and hospitality: a serving cloche. */
.symbol-hospitality i { left:12px; top:25px; width:36px; height:18px; border:3px solid #28647d; border-bottom:0; border-radius:27px 27px 2px 2px; background:linear-gradient(180deg,rgba(88,170,198,.22),rgba(45,111,139,.06)); }
.symbol-hospitality b { left:9px; top:43px; width:42px; height:4px; border-radius:999px; background:#28647d; box-shadow:0 4px 0 rgba(45,104,128,.2); }
.symbol-hospitality em { left:26px; top:17px; width:9px; height:7px; border:3px solid #28647d; border-bottom:0; border-radius:8px 8px 0 0; }

/* Retail: storefront and awning. */
.symbol-retail i { left:13px; top:20px; width:34px; height:29px; border:3px solid #28647d; border-radius:3px; background:rgba(255,255,255,.44); }
.symbol-retail b { left:10px; top:16px; width:40px; height:13px; border-radius:4px 4px 8px 8px; background:repeating-linear-gradient(90deg,#28647d 0 7px,#78b7ca 7px 14px); box-shadow:0 4px 8px rgba(31,83,104,.16); }
.symbol-retail em { left:27px; top:34px; width:9px; height:15px; border-radius:2px 2px 0 0; background:#3c7890; box-shadow:-10px -3px 0 -2px #78afc1,10px -3px 0 -2px #78afc1; }

/* Personal care: a refined sparkle. */
.symbol-beauty i { left:27px; top:13px; width:6px; height:34px; border-radius:50%; background:linear-gradient(#72bfd4,#205d76); transform:rotate(8deg); }
.symbol-beauty i::after { content:""; position:absolute; left:-14px; top:14px; width:34px; height:6px; border-radius:50%; background:linear-gradient(90deg,#72bfd4,#205d76); }
.symbol-beauty b { right:12px; top:14px; width:4px; height:15px; border-radius:50%; background:#4c91a9; transform:rotate(40deg); }
.symbol-beauty b::after { content:""; position:absolute; left:-6px; top:6px; width:15px; height:4px; border-radius:50%; background:#4c91a9; }
.symbol-beauty em { left:13px; bottom:13px; width:6px; height:6px; border-radius:50%; background:#79c7da; box-shadow:0 0 0 3px rgba(83,171,196,.13); }

/* Medical facilities: universal care cross. */
.symbol-medical { background:linear-gradient(145deg,#edf6f8,#d5e8ed); }
.symbol-medical i { left:24px; top:12px; width:12px; height:36px; border-radius:4px; background:#24627b; box-shadow:0 7px 16px rgba(31,94,120,.21); }
.symbol-medical b { left:12px; top:24px; width:36px; height:12px; border-radius:4px; background:#24627b; box-shadow:0 7px 16px rgba(31,94,120,.14); }
.symbol-medical em { inset:8px; z-index:0; border:1px solid rgba(67,142,170,.14); border-radius:50%; box-shadow:0 0 0 5px rgba(73,153,181,.045); }

/* Multi-location operators: connected portfolio nodes. */
.symbol-portfolio::before { content:""; position:absolute; left:17px; top:19px; z-index:1; width:26px; height:24px; border-left:2px solid #4a8da6; border-right:2px solid #4a8da6; transform:skewY(-34deg); opacity:.72; }
.symbol-portfolio i,
.symbol-portfolio b,
.symbol-portfolio em { width:13px; height:13px; border:3px solid #d9eef3; border-radius:50%; background:#286a84; box-shadow:0 4px 9px rgba(31,88,111,.22); }
.symbol-portfolio i { left:10px; top:11px; }
.symbol-portfolio b { right:10px; top:11px; }
.symbol-portfolio em { left:24px; bottom:9px; }

@media (hover:hover) {
  body.commercial-mode .commercial-market-grid article:hover .commercial-market-symbol {
    transform:translateY(-3px) scale(1.03);
    background:linear-gradient(145deg,#f8fbfc,#d8edf2);
    box-shadow:0 14px 28px rgba(27,77,97,.15),inset 0 1px 0 #fff;
  }
  body.commercial-mode .commercial-market-grid article:hover .symbol-beauty i { transform:rotate(20deg) scale(1.06); transition:transform .3s ease; }
  body.commercial-mode .commercial-market-grid article:hover .symbol-medical em { box-shadow:0 0 0 8px rgba(73,153,181,.07); transition:box-shadow .3s ease; }
}

@media (max-width:520px) {
  .commercial-market-symbol { width:55px; height:55px; flex-basis:55px; border-radius:16px; transform:scale(.92); transform-origin:left top; }
  body.commercial-mode .commercial-market-grid article h3 { margin-top:20px; }
}

/* Commercial hero without the secondary planning card. */
body.commercial-mode .commercial-hero {
  min-height:570px;
  grid-template-columns:minmax(0,900px);
  align-items:center;
  gap:0;
  padding:90px 0 105px;
}

body.commercial-mode .commercial-hero-copy { max-width:900px; }
body.commercial-mode .commercial-hero-copy h1 { max-width:820px; }
body.commercial-mode .commercial-hero-copy .commercial-lead { max-width:710px; }

@media (max-width:800px) {
  body.commercial-mode .commercial-hero { min-height:0; padding:70px 0 84px; }
}

@media (max-width:520px) {
  body.commercial-mode .commercial-hero { padding:56px 0 72px; }
}