:root{--navy:#091c2b;--cyan:#8ce8eb;--ink:#112d3c;--paper:#f5f8f9;--pad:clamp(24px,5.5vw,100px);font-family:Inter,"Pretendard","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:#fff;background:var(--navy);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #3cc6da;outline-offset:6px}button{border:0}h1,h2,h3,p{margin:0;word-break:keep-all}button{touch-action:manipulation}.skip{position:fixed;left:20px;top:-100px;z-index:100;background:#fff;color:var(--ink);padding:16px}.skip:focus{top:12px}.header{height:104px;position:absolute;inset:0 0 auto;z-index:20;padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff24;gap:30px}.brand{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:750;letter-spacing:-1px;white-space:nowrap}.brand small{display:block;font-size:10px;letter-spacing:2.2px;margin-top:5px;font-weight:500}.brand-symbol{font-size:42px;font-weight:900;font-style:italic;color:var(--cyan);line-height:1;letter-spacing:-8px;padding-right:7px}.header nav{display:flex;gap:32px;font-size:14px;color:#e0e9ee}.header nav a:hover,.contact-link:hover{color:var(--cyan)}.contact-link{border:1px solid #ffffff60;border-radius:30px;padding:12px 20px;font-size:14px;white-space:nowrap;display:flex;gap:22px}.cinema{height:calc(100vh + 4400px);position:relative}.stage{height:100vh;min-height:680px;position:sticky;top:0;overflow:hidden;background:#12375b;isolation:isolate}.scene{position:absolute;inset:0;z-index:-1;overflow:hidden}.scene img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center;will-change:transform}.scene-base{transform:scale(var(--zoom,1)) translate3d(var(--mx,0px),var(--my,0px),0);filter:blur(var(--blur,0px));opacity:.95}.split{opacity:var(--split-opacity,1)}.split-left{clip-path:inset(0 50% 0 0);transform:translate3d(var(--left,0px),0,0) scale(var(--split-scale,1))}.split-right{clip-path:inset(0 0 0 50%);transform:translate3d(var(--right,0px),0,0) scale(var(--split-scale,1))}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,20,36,.76),rgba(4,20,36,.3) 50%,rgba(4,20,36,.05)),linear-gradient(0deg,rgba(4,18,29,.88),transparent 30%,transparent 80%,rgba(4,18,29,.35))}.scene-caption{position:absolute;right:var(--pad);top:145px;writing-mode:vertical-rl;font-size:11px;letter-spacing:2.5px;color:#d2e3ef;opacity:.7}.panel{position:absolute;left:var(--pad);top:49%;width:min(810px,80%);transform:translateY(-45%);opacity:0;pointer-events:none;will-change:transform,opacity}.panel.hero{opacity:1;pointer-events:auto}.eyebrow{display:block;font-size:12px;font-weight:600;letter-spacing:2.3px;color:var(--cyan);margin-bottom:25px}.panel h1,.panel h2{font-size:clamp(44px,5.25vw,84px);font-weight:550;line-height:1.23;letter-spacing:-3.5px}.panel h2{font-size:clamp(40px,4.5vw,70px)}em{font-style:normal;color:var(--cyan)}.panel>p{font-size:18px;line-height:1.85;color:#dce8ef;margin-top:27px;font-weight:400}.hero-link{display:inline-flex;gap:30px;align-items:center;margin-top:38px;padding-bottom:12px;border-bottom:1px solid #ffffff8a;font-size:15px}.hero-link span{color:var(--cyan);font-size:23px}.tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:25px}.tags span{border:1px solid #a1d1df66;background:#12354b80;padding:10px 17px;border-radius:50px;font-size:14px;backdrop-filter:blur(8px)}.panel p.detail{font-size:15px;color:#b8cad6;line-height:1.75;margin-top:24px}.bottom-bar{position:absolute;bottom:43px;left:var(--pad);right:var(--pad);display:flex;align-items:end;justify-content:space-between;gap:20px}.scroll-cue{font-size:10px;letter-spacing:2px;display:flex;gap:20px}.scroll-cue>span{font-size:20px;line-height:10px}.step-nav{display:flex;gap:32px;font-size:12px}.step-nav a{display:flex;gap:12px;color:#aabfcd;padding:12px 0;border-top:1px solid #ffffff3b;min-width:100px;transition:color .3s,border-color .3s}.step-nav a.current{color:var(--cyan);border-color:var(--cyan)}.step-nav span{font-size:14px}.concept{font-size:10px;color:#99acbc}.progress{position:absolute;bottom:0;left:0;width:100%;height:3px;background:var(--cyan);transform:scaleX(var(--progress,0));transform-origin:left}.anchor{position:absolute;left:0;width:1px;height:1px;pointer-events:none}.solutions{padding:105px 0 68px;background:var(--paper);color:var(--ink);overflow:hidden}.section-heading{padding:0 var(--pad);display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:48px}.solutions .eyebrow{color:#397480}.section-heading h2{font-size:clamp(34px,3.4vw,52px);font-weight:550;letter-spacing:-2px;line-height:1.3}.section-heading p{font-size:17px;line-height:1.85;color:#657782;margin-bottom:4px}.carousel{overflow-x:auto;scrollbar-width:none;padding:4px var(--pad) 20px;scroll-snap-type:x mandatory}.carousel::-webkit-scrollbar{display:none}.track{display:flex;gap:20px;width:max-content}.card{position:relative;width:clamp(300px,28vw,400px);height:337px;flex:none;padding:28px;border:1px solid #d5dfe3;border-radius:6px;background:#fff;scroll-snap-align:start;transition:background .3s,transform .3s}.card:hover{background:#e9f5f6;transform:translateY(-3px)}.card-num{font-size:11px;color:#68818b;letter-spacing:1.4px}.card-mark{display:block;font-size:43px;font-weight:350;color:#91aeb7;letter-spacing:-2px;margin-top:18px}.card h3{font-size:25px;font-weight:550;margin-top:16px;letter-spacing:-.8px}.card p{font-size:16px;line-height:1.7;color:#637783;margin-top:13px}.card button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:20px 0 0;margin-top:18px;border-top:1px solid #e2e9ec;background:none;color:var(--ink);font-size:14px}.card button span{font-size:20px}.carousel-footer{padding:10px var(--pad) 0;display:flex;justify-content:space-between;align-items:center;gap:20px}.carousel-footer>span{color:#788a95;font-size:13px}.carousel-footer>div{display:flex;gap:10px}.prev,.next{width:48px;height:48px;border-radius:50%;border:1px solid #c6d3d9;background:transparent;font-size:23px;color:var(--ink)}.prev:hover,.next:hover{background:var(--ink);color:#fff}.company{padding:90px var(--pad) 30px;background:#0c2534}.company-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}.company h2{font-size:clamp(36px,4vw,58px);font-weight:500;line-height:1.3;letter-spacing:-2px}.company p{font-size:17px;line-height:1.9;color:#bdd0d9}.email{display:block;font-size:clamp(17px,2vw,26px);margin-top:28px;letter-spacing:-.5px}.email span{margin-left:18px;color:var(--cyan)}.phone{display:block;margin-top:13px;color:#bdd0d9;font-size:16px}footer{display:flex;justify-content:space-between;align-items:center;gap:30px;border-top:1px solid #ffffff24;margin-top:75px;padding-top:30px;color:#8da6b3;font-size:12px;line-height:1.85}.footer-brand{color:#e1eaee;font-size:20px;font-weight:600;white-space:nowrap}.footer-brand span{display:block;font-size:10px;letter-spacing:1.3px;font-weight:400}dialog{border:1px solid #d5e5eb;background:#f5f9fa;color:var(--ink);width:min(600px,calc(100% - 32px));padding:48px;border-radius:10px;max-height:90vh;overflow:auto}dialog::backdrop{background:#03131dbe;backdrop-filter:blur(8px)}dialog .eyebrow{color:#377380;margin-top:8px}dialog h2{font-size:34px;letter-spacing:-1px;margin-bottom:22px}dialog p,dialog li{font-size:16px;line-height:1.85;color:#526d7a}dialog ul{padding-left:22px;margin:24px 0}.close{position:absolute;right:18px;top:12px;background:none;font-size:32px;color:var(--ink);width:36px;height:36px}.dialog-contact{display:inline-block;color:#175968;padding:13px 0;border-bottom:1px solid #4c99a4;font-size:16px}
@media(min-width:1800px){.panel{left:calc((100vw - 1600px)/2)}.scene img{object-position:center 58%}}
@media(max-width:1100px){.header nav{gap:20px}.bottom-bar{flex-wrap:wrap}.concept{display:none}.step-nav{gap:18px}.step-nav a{min-width:80px}.panel{width:90%}.panel h1{font-size:68px}.panel h2{font-size:56px}.scene img{object-position:60% center}.section-heading p{font-size:15px}.card{width:330px}}
@media(max-width:760px){.header{height:90px;gap:14px}.brand{font-size:19px}.brand-symbol{font-size:35px}.header nav{display:none}.contact-link{padding:10px 14px;font-size:13px;gap:14px}.stage{min-height:660px}.panel{left:24px;width:calc(100% - 48px);top:47%}.panel h1{font-size:clamp(42px,9vw,65px);letter-spacing:-2px}.panel h2{font-size:clamp(35px,8vw,54px);letter-spacing:-1.8px}.eyebrow{font-size:10px;letter-spacing:1.7px;margin-bottom:22px}.panel>p{font-size:16px;line-height:1.8;margin-top:24px}.panel p.detail{font-size:14px}.panel p br{display:none}.hero-link{margin-top:27px;font-size:14px}.tags{gap:7px}.tags span{font-size:12px;padding:9px 12px}.scene-caption{display:none}.scene img{object-position:61% center}.shade{background:linear-gradient(90deg,#05182cd9,#071d3266),linear-gradient(0deg,#04121be6,transparent 45%)}.bottom-bar{bottom:27px;left:24px;right:24px;gap:22px}.scroll-cue{font-size:9px;order:2}.step-nav{width:100%;justify-content:space-between;gap:14px}.step-nav a{min-width:0;flex:1;gap:8px;font-size:10px}.step-nav span{font-size:13px}.section-heading{display:block;margin-bottom:34px}.section-heading p{margin-top:22px;font-size:16px}.solutions{padding-top:68px;padding-bottom:45px}.card{width:calc(100vw - 70px);max-width:370px;height:337px}.carousel-footer>span{max-width:200px;font-size:12px;line-height:1.7}.company{padding-top:60px}.company-grid{grid-template-columns:1fr;gap:30px}.company p{font-size:16px}.company p br{display:none}footer{flex-direction:column;align-items:flex-start;gap:20px;margin-top:48px;padding-top:27px}.email{font-size:20px}dialog{padding:32px 24px}dialog h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cinema{height:auto}.stage{height:auto;min-height:0;position:relative;overflow:hidden;padding-top:140px}.scene img{transform:none!important;filter:none!important}.split{display:none}.panel{position:relative;left:auto;top:auto!important;transform:none!important;opacity:1!important;pointer-events:auto!important;width:auto;padding:45px var(--pad) 65px}.panel.hero{padding-top:20px}.scene-caption,.bottom-bar,.progress{display:none}.anchor{display:none}.card{transition:none}.scene-base{opacity:.4}.shade{background:#061a2ba6}.hero-link{margin-bottom:0}}
@media(max-height:700px) and (min-width:761px){.panel{top:48%}.panel h1{font-size:58px}.panel h2{font-size:48px}.panel>p{margin-top:18px}.panel p.detail{margin-top:14px}.tags{margin-top:16px}.eyebrow{margin-bottom:18px}.bottom-bar{bottom:28px}}
/* Building lifecycle motion story */
:root{--navy:#071e25;--cyan:#8ae5de}.header{position:absolute;height:92px;background:#f7f7f7;color:#17383b;border:0}.brand{height:92px;width:190px;overflow:hidden}.brand img{display:block;width:190px;height:104px;object-fit:contain}.header nav{color:#21494b}.header nav a:hover,.contact-link:hover{color:#297c7b}.contact-link{border-color:#21494b50}.footer-brand{display:block;background:#f7f7f7;width:175px;height:96px;border-radius:3px;overflow:hidden}.footer-brand img{display:block;width:175px;height:96px;object-fit:contain}.cinema{height:calc(100vh + 3850px)}.stage{background:radial-gradient(ellipse at 73% 45%,#113e45 0,#092831 35%,#071e25 75%);min-height:650px}.story-topline{position:absolute;top:122px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;color:#a4c1c5;font-size:12px;letter-spacing:2px}.slide-count{font-size:19px;color:#d4f2f0;letter-spacing:1px}.slide-count i{font-size:13px;font-style:normal;color:#78989d}.visual-rig{position:absolute;width:min(65vw,850px);aspect-ratio:1;right:1vw;top:51%;transform:translate3d(var(--rig-x,0px),calc(-45% + var(--rig-y,0px)),0) scale(var(--rig-scale,1));will-change:transform;isolation:isolate}.state-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;will-change:opacity,transform;transform-origin:50% 65%;filter:drop-shadow(0 20px 40px #00111644)}.state-image:first-child{opacity:1}.data-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.network-lines{opacity:calc(var(--connect,1)*.18)}.network-nodes{opacity:calc(var(--connect,1)*.5)}.data-packet{stroke-dasharray:8 200;stroke-width:4;stroke-dashoffset:var(--flow-offset,0);opacity:1;filter:drop-shadow(0 0 6px #8affee)}.fault-marker{opacity:var(--diagnose,0);transform:scale(var(--fault-scale,1));transform-origin:620px 590px}.fault-pulse{opacity:.5;stroke-width:3;transform:scale(var(--pulse,1));transform-origin:620px 590px}.engineering-lines{opacity:var(--engineer,0)}.engineering-lines path{stroke-dasharray:1;stroke-dashoffset:var(--draw,1)}.recovery-marker{opacity:var(--restore,0);transform:scale(var(--check-scale,1));transform-origin:655px 560px}.scan-band{position:absolute;left:15%;right:14%;height:1px;top:var(--scan-y,20%);background:#9bf5f6;box-shadow:0 0 18px 4px #64e9e744,0 -15px 35px 7px #64e9e722;opacity:calc(var(--diagnose,0)*.7);transform:rotate(2deg)}.graphic-label{position:absolute;bottom:4%;left:18%;right:10%;text-align:center;color:#a8d4d6;font-size:14px;letter-spacing:.2px;opacity:0;white-space:nowrap}.graphic-label[data-label="0"]{opacity:1}.graphic-label[data-label="1"]{color:#ffb79d}.graphic-label[data-label="2"]{color:#e2c595}.graphic-label[data-label="3"]{color:#adf0c9}.label-line{display:inline-block;vertical-align:middle;width:20px;height:1px;background:currentColor;margin-right:10px}.panel,.panel.hero{width:42%;top:47%;z-index:3;transform:translateY(-45%)}.panel h1,.panel h2{font-size:clamp(35px,3.45vw,58px);line-height:1.32;letter-spacing:-2.2px}.panel>p{font-size:16px;line-height:1.85;max-width:410px}.panel>p br{display:none}.panel .eyebrow{font-size:13px;letter-spacing:2px}.panel .tags{max-width:380px}.panel .tags span{background:#153b4055;font-size:13px;padding:9px 14px}.panel[data-step="1"] em{color:#ffb092}.panel[data-step="2"] em{color:#ead09c}.panel[data-step="3"] em{color:#b0e9be}.bottom-bar{bottom:49px;align-items:center}.scroll-cue{max-width:200px;line-height:1.7;font-size:12px;letter-spacing:0;color:#a1bdc2}.scroll-cue>span{line-height:1.7;flex:none}.step-nav{gap:23px}.story-arrows{display:flex;gap:10px}.story-arrows button{width:43px;height:43px;border:1px solid #8dbabc60;border-radius:50%;background:transparent;color:#cbe5e5;font-size:21px}.story-arrows button:hover{background:#16434a}.story-arrows button:disabled{opacity:.28;cursor:default}.concept{position:absolute;bottom:17px;right:var(--pad);display:block;font-size:11px;color:#719096}.company{background:#0a272e}.solutions{scroll-margin-top:30px}.company{scroll-margin-top:30px}
@media(max-width:1100px){.visual-rig{width:66vw;right:-5vw}.panel,.panel.hero{width:46%}.panel h1,.panel h2{font-size:40px}.panel>p{max-width:340px}.step-nav a{min-width:70px}.scroll-cue{max-width:170px}.bottom-bar{flex-wrap:nowrap}.header nav{gap:18px;font-size:13px}}
@media(max-width:760px){.header,.brand{height:78px}.brand,.brand img{width:155px}.brand img{height:85px}.header .contact-link{padding:9px 13px}.story-topline{top:98px;font-size:10px}.slide-count{font-size:16px}.stage{min-height:680px}.panel,.panel.hero{top:150px;left:24px;width:calc(100% - 48px);transform:none!important}.panel h1,.panel h2{font-size:clamp(30px,7.5vw,42px);line-height:1.26;letter-spacing:-1.5px}.panel h1 br,.panel h2 br{display:none}.panel .eyebrow{font-size:11px;margin-bottom:13px}.panel>p{font-size:14px;line-height:1.7;margin-top:13px;max-width:100%}.panel .tags{margin-top:13px;gap:6px}.panel .tags span{font-size:11px;padding:6px 10px}.visual-rig{width:min(100vw,53vh);right:50%;top:64%;transform:translate3d(50%,calc(-50% + var(--rig-y,0px)),0) scale(var(--rig-scale,1))}.graphic-label{font-size:12px;bottom:1%;left:5%;right:5%}.bottom-bar{bottom:32px;display:flex;flex-wrap:wrap;gap:10px}.step-nav{order:0;width:calc(100% - 94px);gap:10px}.step-nav a{min-width:0;gap:6px;font-size:10px}.step-nav span{font-size:12px}.story-arrows{order:1;gap:7px}.story-arrows button{width:35px;height:35px;font-size:18px}.scroll-cue{order:2;max-width:none;font-size:10px}.concept{font-size:9px;bottom:13px;left:24px;right:auto}.footer-brand{width:160px;height:88px}.footer-brand img{width:160px;height:88px}}
@media(max-height:720px) and (min-width:761px){.story-topline{top:111px}.panel,.panel.hero{top:47%}.panel h1,.panel h2{font-size:40px}.visual-rig{width:min(58vw,620px);top:51%;right:1vw}.bottom-bar{bottom:32px}.panel>p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.cinema{height:calc(100vh + 3850px)}.stage{height:100vh;min-height:680px;position:sticky;padding-top:0}.panel,.panel.hero{position:absolute;left:var(--pad);width:42%;top:47%!important;padding:0;transform:translateY(-45%)!important;opacity:var(--panel-opacity,0)!important;pointer-events:none!important}.panel.is-visible{pointer-events:auto!important}.visual-rig{will-change:auto}.state-image{will-change:auto}.story-topline,.bottom-bar,.progress{display:flex}.anchor{display:block}.data-packet{stroke-dasharray:none}.fault-pulse{display:none}@media(max-width:760px){.panel,.panel.hero{left:24px;width:calc(100% - 48px);top:150px!important;transform:none!important}}}
@media(max-width:760px){.panel .tags{display:none}.panel,.panel.hero{top:142px}.panel>p{line-height:1.65}.graphic-label{font-size:12px}}
@media(prefers-reduced-motion:reduce) and (max-width:760px){.panel,.panel.hero{top:142px!important}}
/* Real-time 3D replaces the raster sequence on supported devices. */
#building-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;touch-action:pan-y;cursor:grab;outline-offset:-7px;z-index:2}#building-canvas:active{cursor:grabbing}.has-webgl #building-canvas{opacity:1}.has-webgl .state-image,.has-webgl .data-overlay,.has-webgl .scan-band{visibility:hidden}.graphic-label{z-index:3;pointer-events:none}.model-tools{position:absolute;left:19%;right:10%;bottom:-1%;display:none;align-items:center;justify-content:center;gap:18px;font-size:12px;color:#94b8ba;z-index:4}.has-webgl .model-tools{display:flex}.model-tools button{padding:5px 8px;border-bottom:1px solid #5e8a8f;background:transparent;color:#c1dadb;font-size:12px}.webgl-unavailable #building-canvas{display:none}.visual-rig.has-webgl{transform:translate3d(0,-45%,0)!important}.has-webgl .graphic-label{bottom:5%}
.footer-brand{background:transparent;border-radius:0}.footer-brand img{object-fit:contain}
.header-actions{display:flex;align-items:center;gap:14px}.language-switcher{display:flex;align-items:center;padding:4px;border:1px solid #21494b35;border-radius:999px;white-space:nowrap}.language-switcher button{padding:7px 9px;border-radius:999px;background:transparent;color:#577173;font-size:11px;transition:background .2s,color .2s}.language-switcher button[aria-pressed="true"]{background:#17383b;color:#fff}.language-switcher button:hover{color:#17383b}.language-switcher button[aria-pressed="true"]:hover{color:#fff}
@media(max-width:1180px){.header{gap:18px}.header nav{gap:14px}.header-actions{gap:8px}.contact-link{padding:10px 14px}.language-switcher button{padding:6px 7px;font-size:10px}}
@media(max-width:900px){.header nav{display:none}}
@media(max-width:760px){.header{padding-left:20px;padding-right:20px}.header-actions .contact-link{display:none}.language-switcher button{padding:7px 8px}.language-switcher button:not([aria-pressed="true"]){font-size:0}.language-switcher button:not([aria-pressed="true"])::after{content:attr(data-lang);font-size:10px;text-transform:uppercase}}
@media(max-width:760px){.visual-rig.has-webgl{transform:translate3d(50%,-50%,0)!important}.model-tools{font-size:10px;gap:10px;bottom:-2%;left:5%;right:5%}.model-tools button{font-size:10px}.has-webgl .graphic-label{bottom:4%;font-size:11px}}