.industrial-hero{background:#101b25;color:#eef4f7;padding-top:43px;position:relative}
.industrial-hero>.eyebrow{color:#a9bbc7;font-size:12px;letter-spacing:2px}
.industrial-hero .hero-grid{grid-template-columns:.85fr 1.3fr;gap:40px;margin-top:35px;align-items:center}
.industrial-hero h1{font-size:clamp(45px,4.6vw,72px);letter-spacing:-2.5px;line-height:1.09}
.industrial-hero h1 em{color:#b4ddf0}
.industrial-hero .intro{color:#aebfc9;font-size:17px;line-height:1.8;max-width:445px;margin:27px 0}
.industrial-hero .text-link{color:#d6e6ee;font-size:14px}
.industrial-hero .hero-note{font-size:12px;letter-spacing:1px;color:#8197a8;max-width:340px;line-height:1.8}
.industrial-hero .actions{flex-wrap:wrap;gap:23px}
.twin-explorer{border:1px solid #385062;border-radius:6px;overflow:hidden;min-width:0;background:#101c26;box-shadow:0 32px 100px #02080f55}
.twin-topline{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:17px 20px;font-size:12px;letter-spacing:1.1px;border-bottom:1px solid #294152;color:#bed0da}
.twin-topline>span:last-child{color:#849caa;font-size:12px;letter-spacing:.8px}
.twin-scene{position:relative;aspect-ratio:1.52;overflow:hidden;isolation:isolate;background:#101b25}
.twin-scene img{width:100%;height:100%;object-fit:cover;display:block;transition:filter .6s,transform .8s;transform:scale(1.015)}
.twin-scene-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#0d1b261a 55%,#0b1925d9);z-index:1}
.twin-connections{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible}
.twin-connections path{fill:none;stroke:#baf487;stroke-width:1.1;opacity:.28;transition:opacity .4s}
.twin-connections circle{fill:#d2f88a;stroke:#d2f88a55;stroke-width:9;opacity:.8}
.asset-pin{position:absolute;z-index:3;display:flex;align-items:center;gap:7px;background:#0c1b29e8;color:#dbeaf2;border:1px solid #6b8fa7;padding:8px 10px;border-radius:3px;font-size:12px;box-shadow:0 6px 20px #020c1777;transition:border-color .2s,background .2s}
.asset-pin:hover,.asset-pin[aria-pressed=true]{background:#183440;color:#e9ffc6;border-color:#c3ec8c}
.pin-dot{width:6px;height:6px;flex-shrink:0;border-radius:50%;background:#abd9f0}
.asset-pin[aria-pressed=true] .pin-dot{background:#d2f88a}
.pin-buildings{left:7%;top:27%}.pin-energy{right:5%;top:40%}.pin-transport{left:30%;top:69%}
.scene-caption{position:absolute;bottom:15px;left:20px;right:20px;z-index:3;display:flex;justify-content:space-between;gap:16px;color:#c1d9e9;font-size:12px;letter-spacing:.6px}
.scene-caption>span:last-child{font-size:12px;color:#91a7b7}
.twin-modes{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #385062;border-bottom:1px solid #385062}
.twin-modes button{padding:16px 8px;background:#142431;color:#9db3c3;font-size:14px;border-right:1px solid #2a4051;transition:background .2s,color .2s}
.twin-modes button:last-child{border-right:0}.twin-modes button span{font-size:12px;margin-right:6px;opacity:.6}
.twin-modes button[aria-pressed=true]{color:#d9f8b2;background:#284139;box-shadow:inset 0 -2px #d2f88a}
.twin-detail{padding:24px;min-height:214px;background:linear-gradient(135deg,#162a35,#111d28)}
.twin-detail-heading>span{font-size:12px;color:#95b3c5;letter-spacing:1.4px}
.twin-detail h3{font-size:22px;color:#e8f1f6;letter-spacing:-.5px;margin:9px 0 12px;line-height:1.25}
.twin-detail p{color:#a7bdca;font-size:14px;line-height:1.7;margin:0}
.twin-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}
.twin-tags span{font-size:12px;color:#bed1db;border:1px solid #344e60;border-radius:3px;padding:4px 8px}
.infrastructure-ribbon{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid #2b4050;padding:27px 0;margin-top:45px}
.ribbon-label{font-size:12px;letter-spacing:1.1px;color:#8fa6b6}
.infrastructure-ribbon>div{display:flex;align-items:center;flex-wrap:wrap;gap:18px;font-size:14px;color:#d3e3eb}
.infrastructure-ribbon i{font-size:15px;color:#7393a8;font-style:normal}
.infrastructure-ribbon>a{font-size:12px;color:#cde6a8;white-space:nowrap}
.twin-explorer[data-mode=simulate] img{filter:saturate(.45) contrast(1.13) hue-rotate(9deg);transform:scale(1.05)}
.twin-explorer[data-mode=simulate] .twin-connections path{opacity:.7;stroke:#91d9ff;stroke-dasharray:5 5}
.twin-explorer[data-mode=orchestrate] .twin-connections path{opacity:.9;stroke:#d2f88a;stroke-dasharray:8 12;animation:signalflow 4s linear 3}
.twin-explorer[data-mode=execute] .twin-connections path{opacity:.95;stroke:#d2f88a;stroke-width:1.8}
.twin-explorer[data-mode=execute] img{filter:saturate(.85) brightness(1.12)}
.twin-explorer button:focus-visible{outline:2px solid #d2f88a;outline-offset:-4px}
@keyframes signalflow{to{stroke-dashoffset:-100}}
@media(max-width:1100px){.industrial-hero .hero-grid{grid-template-columns:.9fr 1.1fr;gap:25px}.industrial-hero h1{font-size:50px}.twin-modes button{font-size:13px}.twin-modes button span{display:none}.scene-caption>span:last-child{display:none}.infrastructure-ribbon{flex-wrap:wrap}.infrastructure-ribbon>div{gap:13px}.ribbon-label{width:100%}.twin-detail{min-height:260px}}
@media(max-width:800px){.industrial-hero .hero-grid{grid-template-columns:1fr;gap:35px}.industrial-hero h1{font-size:58px}.industrial-hero h1 em br{display:none}.industrial-hero .intro{max-width:600px}.industrial-hero .hero-note{max-width:none;margin-top:24px}.twin-detail{min-height:215px}.twin-scene{aspect-ratio:1.65}.twin-modes button span{display:inline}.infrastructure-ribbon{margin-top:30px}.infrastructure-ribbon>div{font-size:13px}.industrial-hero>.eyebrow{font-size:11px}}
@media(max-width:480px){.industrial-hero{padding-top:30px}.industrial-hero h1{font-size:45px;letter-spacing:-1.8px}.industrial-hero h1 em br{display:block}.industrial-hero .intro{font-size:16px}.twin-topline{padding:14px 12px;flex-wrap:wrap;gap:5px}.twin-topline span{font-size:11px!important}.twin-scene{aspect-ratio:1.15}.twin-scene img{object-fit:cover}.asset-pin{padding:8px;font-size:12px}.pin-buildings{left:4%;top:21%}.pin-energy{right:3%;top:44%}.pin-transport{left:21%;top:69%}.twin-modes button{padding:14px 3px;font-size:12px}.twin-modes button span{display:none}.twin-detail{padding:20px;min-height:265px}.twin-detail h3{font-size:22px}.scene-caption{left:14px;bottom:12px}.scene-caption span{font-size:11px}.infrastructure-ribbon>div{display:grid;grid-template-columns:1fr 15px 1fr;gap:10px 12px;width:100%}.infrastructure-ribbon>div i:nth-of-type(2){display:none}.infrastructure-ribbon{gap:17px}.industrial-hero .hero-note{font-size:11px}}
@media(prefers-reduced-motion:reduce){.twin-explorer *{animation:none!important;transition:none!important}}
