:root{--accent:#006e70;--accent-hover:#005456;--accent-ink:#fff;--focus:#006e70;--ink:#092648;--muted:#41566b;--bg:#fbfcfc;--surface:#edf3f4;--line:#cad6dc;--turquoise:#00c9bd}
:root[data-theme=dark]{--accent:#74e5da;--accent-hover:#adf6ee;--accent-ink:#082837;--focus:#74e5da;--ink:#f0f6f8;--muted:#b9cbd6;--bg:#081b2c;--surface:#122d42;--line:#355267}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--accent:#74e5da;--accent-hover:#adf6ee;--accent-ink:#082837;--focus:#74e5da;--ink:#f0f6f8;--muted:#b9cbd6;--bg:#081b2c;--surface:#122d42;--line:#355267}}
.site-header{min-height:76px;max-width:none;background:var(--bg);padding-inline:clamp(24px,5vw,88px);gap:24px}
.site-header>nav{gap:24px}.brand{letter-spacing:-.04em}.brand-period{color:var(--accent)}
.living-page main{max-width:none;padding:0}.living-page main>.section,.living-page main>.solution-preview{max-width:1440px;margin-inline:auto;padding-inline:clamp(24px,5vw,88px)}
.living-page main>.architecture-hero{margin:0;padding:0;background:var(--bg);border-radius:0;color:var(--ink)}
.architecture-hero .living-canvas{position:relative;aspect-ratio:2/1;min-height:650px;max-height:940px;margin-top:0;border-radius:0;overflow:hidden;background:#eae7e4;isolation:isolate}
.architecture-hero .network-depth{position:absolute;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);aspect-ratio:auto;transform-origin:50% 70%;will-change:auto}
.architecture-hero .living-canvas:after{content:"";position:absolute;inset:0 auto auto 0;width:48%;height:68%;background:linear-gradient(90deg,#fbfcfcf5 0%,#fbfcfce8 72%,#fbfcfc00 100%);mask-image:linear-gradient(#000 72%,transparent 100%);pointer-events:none;z-index:1}
:root[data-theme=dark] .architecture-hero .living-canvas:after{background:linear-gradient(90deg,#081b2cf5 0%,#081b2ce8 72%,#081b2c00 100%)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .architecture-hero .living-canvas:after{background:linear-gradient(90deg,#081b2cf5 0%,#081b2ce8 72%,#081b2c00 100%)}}
@media(max-width:860px){.architecture-hero .living-canvas:after{display:none}}
.architecture-picture{display:block;width:100%;height:100%}.architecture-picture img{display:block;width:100%;height:100%;object-fit:cover}
.architecture-hero .living-opening{position:absolute;left:6.4%;top:6%;z-index:2;display:block;width:34%;margin:0;padding:0}
.architecture-hero h1{font-size:clamp(48px,4.7vw,82px);font-weight:750;line-height:1.03;letter-spacing:-.04em;max-width:none;text-wrap:initial;color:#071e3d}
.architecture-hero .living-offer{max-width:440px;margin-top:20px}
.architecture-hero .living-offer p{font-size:clamp(17px,1.35vw,22px);line-height:1.4;color:#153552;margin:0;max-width:36ch}
.architecture-hero .button{background:#082b4c;color:white;margin-top:20px;border-radius:5px;font-size:17px;min-height:54px;max-width:100%}
.architecture-hero .architecture-hotspots{position:absolute;z-index:3;bottom:60px;left:33%;right:7%;display:flex;justify-content:flex-end;gap:12px}
.architecture-hero .live-node{position:static;transform:none;display:flex;flex-direction:row;gap:9px;align-items:center;padding:8px 14px;min-height:46px;width:auto;max-width:220px;background:#f7faf9;color:#092648;box-shadow:0 6px 22px #0926481c;border-radius:6px;font-weight:650;font-size:14px;text-align:left;text-decoration:none}
.architecture-hero .live-node .node-label{padding:0;background:none;color:inherit;font-size:14px;line-height:1.2}
.architecture-hero .live-node svg{width:17px;height:17px}.hotspot-dot{width:8px;height:8px;border-radius:50%;background:#00857e;flex-shrink:0}
.architecture-hero .canvas-caption{position:absolute;z-index:3;bottom:0;left:0;right:0;padding:10px 6.4%;background:#f4f8f8e8;color:#17364b;min-height:46px;margin:0}
.architecture-hero .canvas-caption>span{font-size:13px}#motion-toggle{color:inherit;min-height:44px}
.architecture-caption{padding:14px 6.4%;display:flex;justify-content:space-between;gap:24px;align-items:center;border-bottom:1px solid var(--line)}
.architecture-caption .living-note{margin:0;color:var(--muted);font-size:13px}.architecture-caption .explore-jump{margin:0;white-space:nowrap;font-size:15px;display:flex;gap:15px;align-items:center;color:var(--accent)}
.living-page .living-explorer{margin-top:90px}.scene-controls{margin-top:32px;border-color:var(--line)}
.scene-controls a{border-radius:0;background:transparent;color:var(--muted);border-bottom:3px solid transparent;min-height:64px}
.scene-controls a[aria-current=true]{color:var(--ink);border-color:var(--accent);background:var(--surface)}
.living-page .scene-panel{padding:0;background:none;border-radius:0;grid-template-columns:1.3fr 1fr;gap:54px;margin-top:30px;align-items:center}
.scene-panel .scene-visual{display:block;position:relative;min-height:0;aspect-ratio:1.4;overflow:hidden;background:#e7eded;border-radius:12px;padding:0}
.scene-visual .architecture-picture{position:absolute;inset:0}.scene-visual .image-caption{position:absolute;bottom:18px;left:20px;padding:7px 12px;border-radius:4px;background:#f7faf9;color:#092648;font-size:14px;font-weight:600}
.scene-copy h3{font-size:clamp(27px,2.5vw,38px);max-width:20ch}.scene-copy p{color:var(--muted)}.scene-copy .scene-consider{font-size:15px;border:0;padding:0;margin-top:22px}.scene-copy .text-link{margin-top:24px;color:var(--accent)}
.reset-network{color:var(--accent);margin-top:20px}.capacity-continuity{background:#092648;color:#f3f9fa;padding-block:74px!important;max-width:none!important;margin-top:100px!important}.comparison-heading{max-width:1280px;margin:0 auto 40px}.comparison-heading h2{max-width:920px;font-size:clamp(32px,3.7vw,54px)}.comparison-heading p{color:#bbd9e0}
.comparison-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;max-width:1280px;margin:auto;align-items:center}.comparison-art{position:relative;aspect-ratio:1.5;overflow:hidden;border-radius:12px}.comparison-art .image-caption{position:absolute;bottom:0;left:0;right:0;background:#061b2ee8;color:#d5e4ec;font-size:12px;padding:10px 16px;margin:0}.comparison-route{display:none}
.comparison-controls{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}.comparison-controls button{min-height:48px;border:1px solid #91c4c9;border-radius:5px;padding:10px 15px;background:transparent;color:#e9f6f8;font-size:16px;font-weight:600}.comparison-controls button[aria-pressed=true]{background:#75e5dc;border-color:#75e5dc;color:#082837}
.comparison-copy h3{font-size:32px;line-height:1.15}.comparison-copy p{color:#c8dce7}.comparison-copy .text-link{margin-top:26px;color:#8df0e5}.comparison-copy article+article{margin-top:28px}.comparison-copy article[hidden]+article{margin-top:0}
.architecture-fit{display:grid;grid-template-columns:1fr 1.1fr;gap:70px}.architecture-fit h2{max-width:14ch}.fit-options article{padding:0 0 28px;border-bottom:1px solid var(--line)}.fit-options article+article{padding-top:28px}
.living-page main>.process{border-radius:0;max-width:none;padding-block:65px;background:var(--surface);margin-top:100px}.process h2{max-width:16ch}
.living-page .process{color:var(--ink)}.living-page .process p{color:var(--muted)}.living-page .process li:before{color:var(--accent);border-color:var(--accent)}
.living-page main>.cta{background:#092648;color:#f3f9fa;border-radius:0;max-width:none;margin-bottom:0}.living-page .cta p{color:#c8dce7}.living-page .cta .button{background:#75e5dc;color:#082837}
.comparison-art .architecture-picture[hidden]{display:none}
.interior-image{margin:44px 0 0}.interior-image picture{height:340px;border-radius:12px;overflow:hidden}.interior-image img{object-position:50% 55%}.interior-image figcaption{font-size:12px;color:var(--muted);margin-top:9px}
.living-page .cta{padding-top:70px;padding-bottom:80px}.button{transition:background 160ms,transform 160ms cubic-bezier(.23,1,.32,1)}.button:active,.comparison-controls button:active{transform:scale(.98)}
:root[data-theme=dark] .architecture-hero .living-canvas{background:#092138}
:root[data-theme=dark] .architecture-hero h1{color:#f2f8fa}
:root[data-theme=dark] .architecture-hero .living-offer p{color:#d2e4eb}
:root[data-theme=dark] .architecture-hero .button{color:#082837;background:#75e5dc}
:root[data-theme=dark] .architecture-hero .live-node{background:#132f44;color:#e8f4f7}
:root[data-theme=dark] .architecture-hero .canvas-caption{background:#081e32ee;color:#d6e7ef}
:root[data-theme=dark] .hotspot-dot{background:#75e5dc}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .architecture-hero h1{color:#f2f8fa}:root:not([data-theme=light]) .architecture-hero .living-offer p{color:#d2e4eb}:root:not([data-theme=light]) .architecture-hero .button{color:#082837;background:#75e5dc}:root:not([data-theme=light]) .architecture-hero .live-node{background:#132f44;color:#e8f4f7}:root:not([data-theme=light]) .architecture-hero .canvas-caption{background:#081e32ee;color:#d6e7ef}}
@media(hover:hover) and (pointer:fine){.architecture-hero .live-node:hover,.architecture-hero .live-node:focus-visible{background:#007674;color:#fff}.architecture-hero .live-node:hover .hotspot-dot{background:#fff}.architecture-hero .button:hover{background:#005d64;color:#fff}.scene-controls a:hover{background:var(--surface)}.scene-visual img{transition:transform 700ms cubic-bezier(.23,1,.32,1)}.scene-panel:hover .scene-visual img{transform:scale(1.025)}}
@media(min-width:1600px){.architecture-hero .living-canvas{min-height:800px}.architecture-hero .living-opening{top:8%}.architecture-hero .living-offer{margin-top:28px}}
@media(max-width:1100px){.architecture-hero .living-canvas{min-height:590px}.architecture-hero .living-opening{width:39%;left:5%;top:5%}.architecture-hero h1{font-size:clamp(44px,5vw,62px)}.architecture-hero .architecture-hotspots{left:25%;right:4%}.architecture-hero .live-node{padding:9px 11px}.comparison-layout{gap:35px}.living-page .scene-panel{gap:32px}}
@media(max-width:860px){.site-header{min-height:76px}.architecture-hero .living-canvas{aspect-ratio:auto;min-height:0;max-height:none;padding-top:0;display:flex;flex-direction:column;background:var(--bg)}.architecture-hero .living-opening{position:relative;left:auto;top:auto;width:auto;padding:36px var(--pad) 30px;order:0;background:var(--bg)}.architecture-hero h1{font-size:clamp(46px,7vw,64px);color:var(--ink)!important;max-width:660px}.architecture-hero h1 br{display:none}.architecture-hero .living-offer{margin-top:18px;max-width:650px}.architecture-hero .living-offer p{font-size:20px;color:var(--muted)!important;max-width:52ch}.architecture-hero .button{margin-top:22px}.architecture-hero .network-depth{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1.65;order:1}.architecture-hero .architecture-picture img{object-position:58% center}.architecture-hero .architecture-hotspots{position:relative;bottom:auto;left:auto;right:auto;order:2;padding:16px var(--pad);justify-content:flex-start;flex-wrap:wrap;background:var(--bg);gap:10px}.architecture-hero .canvas-caption{position:relative;order:3;padding:4px var(--pad);background:var(--surface);color:var(--ink)}.architecture-hero .canvas-caption>span{display:none}.architecture-hero .canvas-caption{justify-content:flex-end}.architecture-caption{padding-inline:var(--pad)}.architecture-caption .living-note{max-width:40ch}.living-page .scene-panel{grid-template-columns:1fr;gap:28px}.scene-panel .scene-visual{aspect-ratio:1.6}.scene-copy h3{max-width:28ch}.comparison-layout{grid-template-columns:1fr;gap:32px}.comparison-art{max-height:460px}.architecture-fit{grid-template-columns:1fr;gap:35px}.architecture-fit h2{max-width:25ch}.comparison-copy h3{font-size:30px}.living-page .living-explorer{margin-top:65px}}
@media(max-width:540px){.site-header{padding-top:12px;padding-bottom:10px}.site-header .preferences{border-top:0;padding-top:0;width:auto;order:2;margin-left:auto}.site-header .brand{font-size:22px}.site-header .brand-mark{display:none}.site-header .menu-toggle{order:1}.site-header .languages a{padding:8px 6px;min-width:30px}.site-header .icon-button{width:44px;height:44px}.site-header{flex-wrap:wrap;column-gap:8px;row-gap:0}.site-header>.preferences{width:100%;justify-content:flex-end}.site-header>nav{order:3;font-size:14px;gap:8px}.architecture-hero .living-opening{padding-top:30px;padding-bottom:26px}.architecture-hero h1{font-size:44px;line-height:1.07;letter-spacing:-.035em}.architecture-hero .living-offer p{font-size:18px}.architecture-hero .button{font-size:16px;min-height:52px;width:100%}.architecture-hero .network-depth{aspect-ratio:1.3}.architecture-hero .architecture-picture img{object-position:62% center}.architecture-hero .architecture-hotspots{gap:8px;padding:12px 20px}.architecture-hero .live-node{font-size:12px;padding:9px 10px;flex:1;min-width:85px;max-width:none;gap:7px;box-shadow:none;background:var(--surface);min-height:52px}.architecture-hero .live-node .node-label{font-size:12px}.architecture-hero .live-node svg{display:none}.architecture-caption{align-items:flex-start;gap:12px;flex-direction:column;padding-block:14px}.architecture-caption .living-note{font-size:12px;max-width:none}.architecture-caption .explore-jump{font-size:14px;min-height:44px}.scene-controls{display:grid;grid-template-columns:1fr;gap:0;margin-top:24px}.scene-controls a{min-height:52px;font-size:16px;padding:12px 16px}.scene-panel .scene-visual{aspect-ratio:1.35}.scene-visual .image-caption{left:12px;bottom:12px;font-size:12px}.comparison-heading h2{font-size:32px}.capacity-continuity{padding-block:48px!important;margin-top:65px!important}.comparison-layout{gap:26px}.comparison-art{aspect-ratio:1.25}.comparison-controls{display:grid;grid-template-columns:1fr;gap:9px}.comparison-controls button{text-align:left}.comparison-copy h3{font-size:27px}.architecture-fit{gap:30px}.interior-image picture{height:230px}.living-page main>.process{margin-top:65px;padding-block:45px}.living-page .cta{padding-top:45px;padding-bottom:55px}}
@media(prefers-reduced-motion:reduce){.architecture-hero .network-depth,.scene-visual img{transform:none!important}.architecture-hero .canvas-caption>span{display:none}}
