/* Preserve the entire photograph at its original proportions on every screen. */
html{scrollbar-gutter:stable}
.home-page{--nav-height:76px}
.home-page nav{background:#080c10f5}
.home-jobsite{padding:var(--nav-height) 0 0;background:#080d12}
.home-jobsite .jobsite-frame{max-width:none;border:0;background:#0b1015}
.home-jobsite .jobsite-scene{width:100%;height:auto;margin:0;aspect-ratio:16/9;isolation:isolate;overflow:hidden}
.scene-canvas{position:absolute;top:50%;left:0;width:100%;aspect-ratio:16/9;transform:translateY(-50%)}
.scene-canvas>picture,.scene-canvas>picture img{display:block;width:100%;height:100%;object-fit:contain}
.home-jobsite .jobsite-scene::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(115deg,#050a126e,transparent 43%);pointer-events:none}
.scene-intro{position:absolute;z-index:3;left:3%;top:4%;pointer-events:none;text-shadow:0 2px 16px #000c}
.scene-intro .eyebrow{font-size:clamp(7px,.8vw,10px);letter-spacing:.22em;margin:0 0 6px;color:#d2e6ef}
.scene-intro h1{font:500 clamp(18px,2.8vw,40px)/1.04 Oswald,sans-serif;text-transform:uppercase;letter-spacing:-.01em}
.scene-intro h1 em{display:block;font:500 clamp(10px,1.4vw,19px)/1.6 Inter,sans-serif;letter-spacing:.025em;color:#d9e9ed;font-style:normal;margin-top:5px}
.scene-instruction{position:absolute;right:3%;top:4.5%;z-index:3;text-shadow:0 2px 12px #000;font:600 clamp(8px,1vw,12px)/1.6 Inter,sans-serif;color:#fff;text-align:right}
.scene-instruction>span:last-child{display:block;font-weight:400;color:#dce6ea;margin-top:5px;font-size:clamp(8px,.9vw,11px)}
.instruction-dot,.toolbar-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#8fc0db;margin:0 7px 2px 0;box-shadow:0 0 10px #77bdf366}
.home-jobsite .machine-hotspot,.home-jobsite .machine-hotspot:hover,.home-jobsite .machine-hotspot.featured{cursor:pointer;border:0!important;background:transparent!important;box-shadow:none!important;z-index:4}
.home-jobsite .machine-hotspot:focus-visible{outline:0;background:none!important}
.home-jobsite .hotspot-label{position:absolute!important;left:var(--label-x);top:var(--label-y);width:max-content!important;height:auto!important;padding:8px 9px 8px 12px!important;margin:0!important;overflow:visible!important;clip-path:none!important;white-space:nowrap!important;border:1px solid #ffffff38!important;border-radius:5px;display:flex;align-items:center;gap:14px;transform:translate(-50%,-50%);background:#0a111be6!important;box-shadow:0 3px 18px #0004;backdrop-filter:blur(10px);color:#fff;transition:background .2s,box-shadow .2s,border-color .2s,translate .2s}
.home-jobsite .hotspot-label::before{content:'';position:absolute;left:50%;top:-12px;width:1px;height:12px;background:#e0edf38c}
.marker-copy{display:grid;gap:4px}
.marker-copy strong{font:500 clamp(10px,.95vw,13px)/1.1 Inter,sans-serif;letter-spacing:0}
.marker-copy>span{font:400 9px/1 Inter,sans-serif;letter-spacing:.015em;color:#bdd0db}
.marker-arrow{font:400 19px/1 Inter,sans-serif;color:#d9edfa;transition:transform .25s}
.home-jobsite .machine-hotspot:hover .hotspot-label,.home-jobsite .machine-hotspot:focus-visible .hotspot-label{background:#142937f5!important;border-color:#b5e2fa!important;box-shadow:0 4px 25px #0007;translate:0 -3px}
.machine-hotspot:hover .marker-arrow{transform:translate(2px,-2px)}
.home-jobsite .machine-hotspot:focus-visible .hotspot-label{outline:2px solid white;outline-offset:4px}
.home-jobsite .scene-toolbar{height:48px;min-height:48px;padding:0 3%;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#0b1118;border-bottom:1px solid #ffffff12;font-size:10px;box-sizing:border-box}
.home-jobsite .scene-toolbar p{font-size:10px;color:#b5c6d1}
.home-jobsite .scene-toolbar a{font:500 10px/1.6 Inter,sans-serif;text-decoration:none;color:#cddce5;letter-spacing:.015em;min-height:44px;display:flex;align-items:center;gap:14px}
.home-jobsite .scene-toolbar a:hover{color:white}
.scene-scroll span{font-size:17px}
/* The camera travels from and back to the actual scene rectangle. */
.machine-dialog{width:100%;background:transparent;transition:background .35s}
.machine-dialog::backdrop{background:#05090de0;opacity:0;transition:opacity .35s}
.machine-dialog.zoomed{background:#080d13}
.machine-dialog.zoomed::backdrop{opacity:1}
.machine-dialog .dialog-stage{background:transparent}
.machine-dialog .dialog-stage::after{opacity:0;transition:opacity .5s}
.machine-dialog.zoomed .dialog-stage::after{opacity:1}
.machine-dialog .dialog-camera,.machine-dialog.zoomed .dialog-camera{position:fixed;top:0;left:0;margin:0;width:var(--camera-width);height:var(--camera-height);max-width:none;object-fit:fill;aspect-ratio:auto;transform-origin:0 0;transition:none;opacity:0;z-index:1;will-change:transform,opacity;pointer-events:none}
.machine-dialog .dialog-details{background:#080d13;opacity:0;transform:translateX(36px);transition:opacity .45s .15s,transform .6s .1s}
.machine-dialog.zoomed .dialog-details{opacity:1;transform:none}
.machine-dialog .closeup-wrap{transition:opacity .45s .25s,transform .65s .2s}
.machine-dialog .dialog-controls,.machine-dialog .dialog-close,.machine-dialog .stage-caption{opacity:0;transition:opacity .3s .2s}
.machine-dialog.zoomed .dialog-controls,.machine-dialog.zoomed .dialog-close,.machine-dialog.zoomed .stage-caption{opacity:1}
.machine-dialog .dialog-close{width:44px;height:44px;border-radius:50%;padding:0;font-size:17px;background:#14212bf2}
.machine-dialog .scene-control{border-color:#ffffff30;border-radius:4px}
.machine-dialog .scene-control.dialog-close{border-radius:50%}
.machine-dialog.closing{background:transparent;transition:background .5s .18s}
.machine-dialog.closing::backdrop{opacity:0;transition:opacity .55s .15s}
.machine-dialog.closing .dialog-details{opacity:0;transform:translateX(25px);transition:opacity .22s,transform .35s}
.machine-dialog.closing .closeup-wrap{opacity:0;transform:scale(.97);transition:opacity .22s,transform .35s}
.machine-dialog.closing .dialog-stage::after{opacity:0;transition:opacity .25s}
.machine-dialog.closing .dialog-controls,.machine-dialog.closing .dialog-close,.machine-dialog.closing .stage-caption{opacity:0;transition:opacity .15s}
@media(max-width:1100px){.home-page{--nav-height:70px}.home-jobsite .hotspot-label{padding:7px 8px 7px 10px!important;gap:10px}.marker-copy strong{font-size:10px}.marker-copy>span{font-size:8px}.marker-arrow{font-size:17px}}
@media(max-width:900px){.home-page{--nav-height:76px}}
@media(max-width:600px){.home-page{--nav-height:76px}.scene-intro{left:3%;top:3%}.scene-intro .eyebrow{font-size:6px;letter-spacing:.12em;margin-bottom:4px}.scene-intro h1{font-size:17px}.scene-intro h1 em{font-size:9px;line-height:1.3;margin-top:4px}.scene-instruction{top:3%;font-size:8px}.scene-instruction>span:last-child{font-size:7px;line-height:1.4;margin-top:2px}.instruction-dot{width:4px;height:4px;margin-right:4px}.home-jobsite .hotspot-label{padding:6px!important;gap:5px;border-radius:3px}.marker-copy strong{font-size:8px}.marker-copy>span{display:none}.marker-arrow{font-size:13px}.home-jobsite .hotspot-label::before{top:-7px;height:7px}.home-jobsite .scene-toolbar{height:46px;min-height:46px;gap:9px;padding:0 14px}.home-jobsite .scene-toolbar p{display:none}.home-jobsite .scene-toolbar a{font-size:9px;gap:8px}.home-jobsite .jobsite-scene{width:min(100%,calc((100svh - var(--nav-height) - 46px) * 16 / 9))}}
/* Quiet, unboxed labels with continuous guide lines and a small blue accent. */
.home-jobsite .hotspot-label{background:none!important;border:0!important;border-radius:0;padding:3px 0!important;backdrop-filter:none;box-shadow:none!important;text-shadow:0 1px 5px #000,0 2px 14px #000;gap:12px}
.home-jobsite .hotspot-label::before{background:#d5e3e9b3;top:-18px;height:16px}
.home-jobsite .hotspot-label::after{content:'';position:absolute;left:0;right:0;bottom:-3px;height:1px;background:linear-gradient(90deg,#dae6ed99,#8dd7ff99);box-shadow:0 0 8px #7acfff22}
.home-jobsite .machine-hotspot:hover .hotspot-label,.home-jobsite .machine-hotspot:focus-visible .hotspot-label{background:transparent!important;border:0!important;box-shadow:none!important;text-shadow:0 1px 5px #000,0 0 13px #76cfff88;translate:0 -2px}
.marker-copy strong{font-weight:500}
.marker-arrow{color:#c9eaff;text-shadow:0 0 12px #63bfff66}
.home-page .nav-cta,.home-page .nav-cta:hover{border:0!important;background:none!important;box-shadow:none!important;color:#c7e4f2!important;padding:10px 0!important}
.home-page .nav-cta:hover{text-shadow:0 0 16px #78caff99}
.home-page .nav-logo span{color:#8bbbd4}
@media(min-width:601px){.home-jobsite [data-machine=ctx100]{--label-x:-28.6%!important;--label-y:72.4%!important}.home-jobsite [data-machine=c30x]{--label-x:-20%!important;--label-y:75.7%!important}.home-jobsite [data-machine=ctx100] .hotspot-label::before,.home-jobsite [data-machine=c30x] .hotspot-label::before{left:calc(100% + 8px);top:50%;width:4vw;height:1px}}
@media(max-width:600px){.home-jobsite .jobsite-scene{width:100%;height:56.25vw}.home-jobsite .hotspot-label{padding:3px 0!important;gap:5px}.home-jobsite .hotspot-label::before{height:8px;top:-10px}.scene-intro h1 em{font-size:8px}.home-page .nav-cta{padding:10px 0!important}}
@media(prefers-reduced-motion:reduce){.machine-dialog,.machine-dialog::backdrop,.machine-dialog *{transition:none!important;animation:none!important}.machine-dialog .dialog-camera{will-change:auto}}
