/* The architectural scene owns the entire hero; copy sits above it. */
.hero{--header-height:94px;min-height:760px;height:calc(100svh - var(--header-height));padding:clamp(42px,7vh,88px) 5% 220px;display:block;background:#cbd3d5;isolation:isolate;overflow:hidden}
.hero-grid{display:none}
.hero-content{position:relative;max-width:30%;z-index:4;pointer-events:none;will-change:transform,opacity}
.hero-content a{pointer-events:auto}
.hero h1{font-size:clamp(60px,5.1vw,102px);line-height:.94;margin:24px 0;letter-spacing:-.018em}
.hero h1>.hero-line{display:block;overflow:hidden;padding-bottom:.07em;margin-bottom:-.07em;color:white}
.hero h1>.hero-line.red-text{color:var(--red)}
.hero-line>span{display:block;will-change:transform}
.hero-description{font-size:17px;line-height:1.55;color:#e4e7e7;margin-bottom:25px;max-width:330px}
.hero .eyebrow{font-size:12px;letter-spacing:.09em;color:white;line-height:1.5}
.hero .button{font-size:14px;min-height:50px;padding:13px 21px}
.hero-scope{display:none}
.engineering-stage{position:absolute;inset:0;z-index:1;pointer-events:none;min-height:0}
.engineering-stage:after{opacity:var(--copy-shade,1);content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,#10171eef 0%,#152029ba 19%,#17212b55 34%,transparent 53%),linear-gradient(0deg,#10171ed9 0%,transparent 29%);pointer-events:none}
.cinematic-scene{--scene-zoom:1;--scene-x:0%;--scene-y:0%;--plan-reveal:1;--install-reveal:0;--test-reveal:0;--maintain-reveal:0;position:absolute;inset:0;overflow:hidden;pointer-events:auto;touch-action:pan-y;outline-offset:-5px}
.cinematic-scene:focus-visible{outline:2px solid var(--red)}
.building-picture{position:absolute;inset:0;overflow:hidden}
.building-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center;will-change:transform;transform-origin:65% 48%;transform:translate3d(var(--scene-x),var(--scene-y),0) scale(var(--scene-zoom));transition:filter .7s ease}
.cinematic-grade{position:absolute;inset:0;background:radial-gradient(circle at 73% 45%,transparent 0 20%,#06121a24 58%,#07101866 100%),linear-gradient(180deg,#6cb2d516 0%,transparent 38%,#07101742 100%);mix-blend-mode:multiply;pointer-events:none}
.systems-overlay{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;transform-origin:65% 48%;transform:translate3d(var(--scene-x),var(--scene-y),0) scale(var(--scene-zoom))}
.systems-overlay path,.systems-overlay circle{vector-effect:non-scaling-stroke;fill:none}
.planning-routes{opacity:calc(var(--plan-reveal)*.58);stroke:#f8fbff;stroke-width:1.35;stroke-dasharray:7 8}
.planning-routes path{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--plan-reveal))}
.planning-routes circle{stroke:#f8fbff;stroke-width:1.3}
.installed-routes{opacity:calc(var(--install-reveal)*.88)}
.installed-routes path{stroke-width:3.25;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--install-reveal))}
.route-fire{stroke:#ff3145}.route-air{stroke:#e8f7ff}.route-power{stroke:#ffd166}
.commissioning-nodes{opacity:var(--test-reveal)}
.commissioning-nodes circle{stroke-width:3;transform-box:fill-box;transform-origin:center;animation:system-pulse 1.6s ease-out infinite}
.commissioning-nodes .node-fire{stroke:#ff3145}.commissioning-nodes .node-air{stroke:#e8f7ff}.commissioning-nodes .node-power{stroke:#ffd166}
.maintenance-zones{opacity:calc(var(--maintain-reveal)*.82);stroke:#fff;stroke-width:1.5;stroke-dasharray:5 7}
.maintenance-zones circle{transform-box:fill-box;transform-origin:center;animation:maintenance-orbit 10s linear infinite}
.system-labels{position:absolute;inset:0;pointer-events:none;opacity:var(--install-reveal);transition:opacity .35s ease}
.system-label{--accent:#fff;position:absolute;min-height:40px;display:flex;align-items:center;padding:10px 15px 10px 32px;background:linear-gradient(100deg,#0a1118f5,#151e25e8);border:1px solid #ffffff8a;border-left:4px solid var(--accent);color:#fff;font-size:clamp(12px,.75vw,14px);font-weight:700;letter-spacing:.085em;line-height:1.2;text-shadow:0 1px 3px #000;box-shadow:0 10px 28px #02090e99,0 0 20px #ffffff26;backdrop-filter:blur(12px);white-space:nowrap}
.system-label:before{content:"";position:absolute;left:13px;top:50%;width:9px;height:9px;border-radius:50%;background:var(--accent);transform:translateY(-50%);box-shadow:0 0 14px var(--accent)}
.system-label.fire{right:3.5%;top:68%;--accent:#ff3145}.system-label.air{right:8%;top:34%;--accent:#e8f7ff}.system-label.power{right:28%;top:65%;--accent:#ffd166}
.cinematic-scene[data-cinematic-stage="0"] .system-labels{opacity:0}.cinematic-scene[data-cinematic-stage="3"] .system-labels{opacity:.45}
.motion-paused .commissioning-nodes circle,.motion-paused .maintenance-zones circle{animation-play-state:paused}
@keyframes system-pulse{0%{transform:scale(.65);opacity:1}70%,100%{transform:scale(2.4);opacity:0}}
@keyframes maintenance-orbit{to{transform:rotate(360deg)}}
.building-coordinate{position:absolute;top:25px;right:4%;z-index:3;font-size:12px;letter-spacing:.095em;color:#344047}
.building-coordinate>span:first-child{display:none}
.scene-controls{position:absolute;bottom:192px;left:5%;right:4%;z-index:3;display:flex;align-items:center;justify-content:flex-end;gap:18px;pointer-events:none}
.scene-controls p{font-size:12px;color:white;letter-spacing:.025em;text-shadow:0 1px 7px #000}
.scene-buttons{display:flex;gap:7px;pointer-events:auto}
.scene-buttons button{white-space:nowrap;border:1px solid #ffffff55;color:white;background:#172026bb;backdrop-filter:blur(10px);padding:10px 14px;min-height:44px;font-size:12px}
.scene-buttons button:hover,.scene-buttons button[aria-pressed=true]{background:#172026;border-color:var(--red)}
.scene-buttons button[hidden]{display:none}
.delivery-story{position:absolute;left:0;right:0;bottom:48px;z-index:6;background:#131a20e8;backdrop-filter:blur(14px);padding:0 5%}
.delivery-heading{padding:14px 0;display:flex;align-items:center;gap:28px;border-bottom:1px solid #ffffff22}
.delivery-heading>span{color:#ff4857;letter-spacing:.1em;font-size:12px;min-width:165px}
.delivery-heading p{font-size:14px;color:#c6cdd1;max-width:790px;line-height:1.45;min-height:21px}
.delivery-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.delivery-steps button{position:relative;display:flex;align-items:center;gap:13px;text-align:left;padding:20px 16px;border:0;background:transparent;color:#b8c0c5;min-height:66px;font-size:15px}
.delivery-steps button+button{border-left:1px solid #ffffff24}
.delivery-steps button>span{font-size:12px;color:#9aa5ad}
.delivery-steps button[aria-pressed=true]{color:white;background:#ffffff06}
.delivery-steps button[aria-pressed=true]>span{color:white}
.delivery-steps i{position:absolute;inset:auto 15px 0;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .4s}
.delivery-steps button[aria-pressed=true] i{transform:scaleX(1)}
.hero-bottom{position:absolute;left:0;right:0;bottom:0;padding:12px 5%;border:0;min-height:48px;font-size:12px;letter-spacing:.04em;z-index:6;background:#131a20;color:#cad0d4}
.hero-chapter{color:#96a1a8}
.hero-timeline{position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left}
.gsap-ready .reveal{opacity:1;transform:none;transition:none}.gsap-ready .project-card.enter{animation:none}.gsap-ready .button,.gsap-ready .contact-arrow{transition:background .2s}.gsap-ready .button:hover,.gsap-ready .contact-arrow:hover{transform:none}.heading-word{display:inline-block;will-change:transform}.project-grid{perspective:1000px}.gsap-ready .project-card{transform-style:preserve-3d;transition:background .25s}.gsap-ready .service-body{overflow:hidden}.about{position:relative;z-index:5;background:white}.annotation-line{height:1px;width:30px;background:var(--red)}

@media(min-width:1001px) and (min-height:650px){.hero.delivery-pinned{min-height:0;height:calc(100svh - 94px)}}
@media(min-width:1001px) and (max-height:800px){.hero{padding-top:30px}.hero h1{font-size:clamp(52px,7.7vh,68px);margin:18px 0}.hero-description{font-size:16px;margin-bottom:20px}.delivery-heading{padding:10px 0}.delivery-steps button{min-height:60px;padding:16px}.scene-controls{bottom:174px}.hero .eyebrow{letter-spacing:.02em}}
@media(max-width:1100px){.hero-content{max-width:36%}.hero h1{font-size:clamp(55px,6.2vw,72px)}.delivery-steps button{font-size:14px;gap:9px;padding:17px 12px}.delivery-heading{gap:18px}.delivery-heading p{font-size:14px}.hero-chapter{display:none}}
/* Normal document scrolling, a dedicated close crop and generous touch targets. */
@media(max-width:1000px){
 .hero{height:auto;min-height:0;padding:38px 0 0;background:#10171e;display:flex;flex-direction:column;overflow:hidden}
 .hero-content{max-width:none;padding:0 6% 30px;pointer-events:auto;will-change:auto}
 .hero h1{font-size:clamp(55px,9.5vw,84px);margin:20px 0;line-height:.91}
 .hero-description{font-size:16px;max-width:430px;margin-bottom:22px}
 .hero .eyebrow{font-size:12px;letter-spacing:.035em}
 .engineering-stage{position:relative;inset:auto;height:clamp(380px,65vw,560px);width:100%;flex-shrink:0}
 .engineering-stage:after{opacity:1;background:linear-gradient(0deg,#10171e 0%,transparent 23%,transparent 85%,#10171e44 100%)}
 .building-fallback{object-position:68% center}
 .system-labels{display:none}
 .systems-overlay{opacity:.8}
 .building-coordinate{top:16px;right:6%;font-size:12px;background:#f5f6f0ce;padding:5px 8px;letter-spacing:.035em}
 .scene-controls{bottom:12px;left:6%;right:6%;gap:8px;justify-content:space-between}
 .scene-controls p{max-width:130px;line-height:1.3}
 .scene-buttons button{font-size:12px;padding:10px 12px;min-height:44px}
 .delivery-story{position:relative;inset:auto;padding:0 6%;background:#10171e;backdrop-filter:none}
 .delivery-heading{display:block;padding:16px 0;min-height:128px}
 .delivery-heading p{font-size:16px;line-height:1.5;margin-top:8px}
 .delivery-steps{grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #ffffff24;border-bottom:1px solid #ffffff24}
 .delivery-steps button{min-height:64px;padding:14px 10px;font-size:14px;gap:10px;line-height:1.3}
 .delivery-steps button:nth-child(3){border-left:0;border-top:1px solid #ffffff24}
 .delivery-steps button:nth-child(4){border-top:1px solid #ffffff24}
 .delivery-steps i{left:10px;right:10px}
 .hero-bottom{position:relative;inset:auto;padding:20px 6%;min-height:65px;background:#10171e;font-size:12px}
 .hero-timeline{display:none}
}
@media(min-width:600px) and (max-width:1000px){.hero-content{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}.hero-content .eyebrow{grid-column:1/-1}.hero h1{grid-column:1;grid-row:2/4}.hero-description{grid-column:2;grid-row:2;align-self:end}.hero-content .button{grid-column:2;grid-row:3;align-self:start;justify-self:start}.engineering-stage{height:540px}}
@media(max-width:380px){.hero h1{font-size:54px}.scene-controls p{max-width:95px}.scene-buttons{gap:4px}.scene-buttons button{padding:10px 9px}.delivery-steps button{gap:7px;padding:13px 8px}}
@media(prefers-reduced-motion:reduce){.hero-content,.hero-line>span,.heading-word,.building-fallback{will-change:auto}.delivery-steps i{transition:none}.commissioning-nodes circle,.maintenance-zones circle{animation:none}}
