/* index.html 전용 스타일 */
:root{--wrap:max(1312px, min(1920px, 86vw))} /* 콘텐츠 최대 폭: 1440 이하 기존과 동일, 큰 모니터에서 최대 1920px까지 확장 */
body{margin:0;background:#FFFFFF}
a{color:#1E5EFF;text-decoration:none}a:hover{color:#0B3FCC}
.en{font-family:'Pretendard Variable','Pretendard',Pretendard,sans-serif}
.mono{font-family:Pretendard Variable,Pretendard,Pretendard,sans-serif}
@keyframes lineIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes popIn{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes grow{from{width:0}to{width:100%}}
@keyframes introOut{0%,85%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-40px);visibility:hidden}}
@keyframes rise{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:translateY(0)}}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes ring{from{stroke-dashoffset:0}to{stroke-dashoffset:113}}
@keyframes scan{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
@keyframes marq{to{transform:translateX(-50%)}}
@keyframes ping{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.4);opacity:0}}
.intro{animation:introOut 3.4s cubic-bezier(.7,0,.3,1) forwards;pointer-events:none}
.tl{opacity:0;animation:lineIn .5s ease-out forwards}
.ck{opacity:0;animation:popIn .35s cubic-bezier(.3,1.6,.5,1) forwards}
.ibar{animation:grow 2.3s .2s cubic-bezier(.6,0,.2,1) forwards}
.r1{opacity:0;animation:rise .9s 4.25s cubic-bezier(.2,.8,.2,1) forwards}
.r2{opacity:0;animation:rise .9s 4.4s cubic-bezier(.2,.8,.2,1) forwards}
.r3{opacity:0;animation:rise .9s 4.55s cubic-bezier(.2,.8,.2,1) forwards}
.r4{opacity:0;animation:rise 1s 4.65s cubic-bezier(.2,.8,.2,1) forwards}
.fl1{animation:floatY 6s ease-in-out infinite}
.fl2{animation:floatY 7s 1s ease-in-out infinite}
.spinner{width:16px;height:16px;border-radius:50%;border:2px solid #C9D6F5;border-top-color:#1E5EFF;animation:spin .8s linear infinite;box-sizing:border-box}
.otp-ring{stroke-dasharray:113;animation:ring 4s linear infinite}
.scan{animation:scan 3.5s ease-in-out infinite}
.marq{animation:marq 36s linear infinite}
.ping{animation:ping 1.8s ease-out infinite}
.tab{transition:background .25s,color .25s}
.card-h{transition:transform .35s,box-shadow .35s}
.card-h:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(11,18,32,.1)}
@keyframes megaIn{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes bgIn{from{opacity:0}to{opacity:1}}
@keyframes miIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes sheen{0%{transform:translateX(-120%)}100%{transform:translateX(220%)}}
.mega{animation:megaIn .55s cubic-bezier(.2,.8,.2,1) both}
.mega-bg{animation:bgIn .4s ease both}
.mi{opacity:0;animation:miIn .55s cubic-bezier(.2,.8,.2,1) forwards}
.navbtn:hover{color:#1E5EFF!important}
.mcard{transition:background .25s,border-color .25s,transform .3s cubic-bezier(.2,.8,.2,1)}
.mcard:hover{background:#F6F8FB;border-color:#C9D6F5!important;transform:translateY(-3px)}
.mcard .marr{opacity:0;transform:translateX(-8px);transition:opacity .25s,transform .25s}
.mcard:hover .marr{opacity:1;transform:none}
.mcard .mmark{transition:background .25s,color .25s}
.mcard:hover .mmark{background:#1E5EFF!important;color:#FFFFFF!important}
.mcard .msheen{transform:translateX(-120%)}
.mcard:hover .msheen{animation:sheen .9s ease-out}
@media (max-width:900px){.nav-menu{display:none!important}}
@keyframes twinkle{0%,100%{opacity:.18}50%{opacity:1}}
@keyframes zoomA{from{transform:scale(1)}to{transform:scale(1.12)}}
@keyframes zoomB{from{transform:scale(1)}to{transform:scale(1.22)}}
@keyframes zoomC{from{transform:scale(1)}to{transform:scale(1.38)}}
@keyframes nebDrift{from{transform:translate(0,0)}to{transform:translate(70px,-30px)}}
@keyframes corePulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.18);opacity:1}}
@keyframes beamPulse{0%,100%{opacity:.28}50%{opacity:.55}}
@keyframes travel{0%{offset-distance:0%;opacity:0}15%{opacity:1}90%{opacity:1}100%{offset-distance:100%;opacity:0}}
@keyframes latF{to{stroke-dashoffset:-280}}
@keyframes aiF{to{stroke-dashoffset:-90}}
@keyframes aiP{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes wheel{0%{transform:translateY(0);opacity:1}100%{transform:translateY(8px);opacity:0}}
.tw{animation:twinkle 3s ease-in-out infinite}
.zoom-a{transform-box:view-box;transform-origin:960px 560px;animation:zoomA 40s ease-in-out infinite alternate}
.zoom-b{transform-box:view-box;transform-origin:960px 560px;animation:zoomB 30s ease-in-out infinite alternate}
.zoom-c{transform-box:view-box;transform-origin:960px 560px;animation:zoomC 22s ease-in-out infinite alternate}
.neb{animation:nebDrift 24s ease-in-out infinite alternate}
.nb2{animation-duration:32s;animation-direction:alternate-reverse}
.core{transform-box:view-box;transform-origin:960px 560px;animation:corePulse 4.5s ease-in-out infinite}
.beam{animation:beamPulse 4.5s ease-in-out infinite}
.qp{offset-rotate:0deg;opacity:0;animation:travel 6s linear infinite}
.latflow{stroke-dasharray:6 14;animation:latF 6s linear infinite}
.aiflow{stroke-dasharray:3 6;animation:aiF 3s linear infinite}
.aipulse{animation:aiP 2.4s ease-in-out infinite}
.wheel{animation:wheel 1.6s ease-in infinite}
.fab-ring{animation:spin 14s linear infinite;transform-origin:50% 50%}
.fi-hero{opacity:0;animation:fadeHero 1s 4.3s forwards}
@keyframes fadeHero{to{opacity:1}}
.hbtn{transition:background .25s,transform .25s}
.hbtn:hover{background:rgba(255,255,255,0.24)!important;transform:scale(1.05)}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important}}

.navbtn{position:relative;display:flex;align-items:center;gap:8px;height:100%;min-height:44px;padding:0 26px;border:0;background:transparent;font-family:inherit;font-size:18px;font-weight:600;letter-spacing:-.01em;color:#FFFFFF;cursor:pointer;transition:color .25s}
.navbtn .chev{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.navbtn .uline{position:absolute;left:26px;right:26px;bottom:-1px;height:2px;background:#1E5EFF;transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.navbtn[aria-expanded="true"]{color:#8FB0FF}
.navbtn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.navbtn[aria-expanded="true"] .uline{transform:scaleX(1)}
/* 드롭다운 메뉴 (토마토시스템 스타일) */
.navitem{position:relative;display:flex;align-items:stretch}
.drop{position:absolute;top:100%;left:0;min-width:100%;width:max-content;white-space:nowrap;background:#1E5EFF;box-shadow:0 18px 40px rgba(2,6,15,.35);padding:10px 0;box-sizing:border-box;z-index:30}
.drop:not([hidden]){animation:dropIn .38s cubic-bezier(.2,.8,.2,1) both}
@keyframes dropIn{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
.drop a{display:block;padding:12px 16px;text-align:center;color:#FFFFFF;opacity:0;animation:miIn .4s cubic-bezier(.2,.8,.2,1) forwards;transition:background .2s}
.drop a:hover,.drop a:focus-visible{background:rgba(255,255,255,.14);color:#FFFFFF}
.drop a .dn{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em}
.drop a .dd{display:block;margin-top:4px;font-size:12px;font-weight:400;color:rgba(255,255,255,.72)}
.drop a:hover .dn{text-decoration:underline;text-underline-offset:4px}
.navbtn[aria-expanded="true"]{color:#8FB0FF}
.slide{grid-area:1/1;transition:opacity 1.1s cubic-bezier(.2,.8,.2,1),filter 1.1s cubic-bezier(.2,.8,.2,1),transform 1.1s cubic-bezier(.2,.8,.2,1)}
.slide:not(.on){opacity:0;filter:blur(12px);transform:translateY(18px)}
.tab[aria-selected="true"]{background:#0B1220!important;color:#FFFFFF!important;border-color:#0B1220!important}
:focus-visible{outline:2px solid #5B8CFF;outline-offset:3px}

/* ===== WHO WE ARE ===== */
.who{position:relative;overflow:hidden;background:linear-gradient(125deg,#EEF4FC 0%,#F8FAFD 45%,#E4EDF9 100%);color:#0B1220;padding:140px clamp(20px,5vw,64px) 160px}
.who-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.who-blob{position:absolute;border-radius:50%;filter:blur(110px);opacity:.5;pointer-events:none}
.who-blob.b1{width:56vw;height:56vw;left:-14vw;top:-18vw;background:radial-gradient(circle,rgba(91,140,255,.35) 0%,rgba(91,140,255,0) 65%);animation:whoB1 22s ease-in-out infinite alternate}
.who-blob.b2{width:48vw;height:48vw;right:-12vw;bottom:-20vw;background:radial-gradient(circle,rgba(63,198,230,.3) 0%,rgba(63,198,230,0) 65%);animation:whoB2 26s ease-in-out infinite alternate}
@keyframes whoB1{to{transform:translate(18vw,10vw) scale(1.15)}}
@keyframes whoB2{to{transform:translate(-16vw,-8vw) scale(1.2)}}
.who-shade{display:none}
.who-in{position:relative;max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:clamp(32px,5vw,96px);align-items:start}
.who-left{position:sticky;top:140px;padding-top:60px}
.who-eye{font-size:15px;font-weight:700;color:#1E5EFF;letter-spacing:.02em}
.who-h{margin:22px 0 0;display:flex;flex-direction:column;font-weight:700;letter-spacing:-.035em;line-height:1.02}
.who-h span{font-size:clamp(48px,5.4vw,96px)}
.who-h .i2{white-space:nowrap;background:linear-gradient(90deg,#0B1220 0%,#1E5EFF 55%,#0FA3C7 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.who-h .i3{margin-top:18px;font-size:clamp(30px,3.2vw,56px);font-weight:400;color:#4A5A75}
.who-p{margin:40px 0 0;max-width:36em;font-size:17px;line-height:1.85;color:#4A5A75;word-break:keep-all}
.who-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(56px,6vw,104px)}
.who-col{display:flex;flex-direction:column;gap:clamp(28px,2.6vw,44px);will-change:transform}
.who-col.c2{margin-top:0}
.who-col.c1{margin-top:96px}
.wcard{position:relative;min-height:clamp(330px,20vw,380px);padding:clamp(28px,2.4vw,40px);box-sizing:border-box;display:flex;flex-direction:column;background:#FFFFFF;border:1px solid #E3EAF4;box-shadow:0 24px 60px rgba(11,18,32,.07);transition:background .5s,border-color .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
.wcard:hover{background:linear-gradient(160deg,#2A6BFF,#1446D9);border-color:#1E5EFF;box-shadow:0 30px 70px rgba(30,94,255,.28);transform:translateY(-8px)}
.wcard::before{content:"";position:absolute;left:0;top:0;height:2px;width:0;background:linear-gradient(90deg,#7FE3FF,#1E5EFF);transition:width .7s cubic-bezier(.2,.8,.2,1)}
.wcard:hover::before{width:100%}
.wcard:hover .wic,.wcard:hover .wlb,.wcard:hover .wnum,.wcard:hover .wnum em{color:#FFFFFF}
.wcard:hover .wds{color:rgba(255,255,255,.85)}
.wcard .wic{width:48px;height:48px;color:#1E5EFF;transition:color .4s}
.wcard .wic path,.wcard .wic circle,.wcard .wic rect,.wcard .wic line{stroke-dasharray:120;stroke-dashoffset:0}
.wcard:hover .wic path,.wcard:hover .wic circle,.wcard:hover .wic rect,.wcard:hover .wic line{animation:wicDraw 1.1s cubic-bezier(.6,0,.3,1)}
@keyframes wicDraw{from{stroke-dashoffset:120}to{stroke-dashoffset:0}}
.wcard .wlb{margin-top:36px;font-size:17px;font-weight:600;color:#0B1220;transition:color .4s}
.wcard .wnum{margin-top:10px;display:flex;align-items:baseline;gap:12px;font-family:Pretendard Variable,sans-serif;font-weight:700;letter-spacing:-.04em;line-height:1}
.wcard .wnum{color:#0B1220;transition:color .4s}
.wcard .wnum b{font-size:clamp(52px,4.4vw,80px);font-weight:700;font-variant-numeric:tabular-nums}
.wcard .wnum em{font-style:normal;font-size:20px;font-weight:500;letter-spacing:0;color:#6B7A93;transition:color .4s;font-family:Pretendard,Pretendard,sans-serif}
.wcard .wds{margin:18px 0 0;font-size:15px;line-height:1.75;color:#5B6B84;transition:color .4s;word-break:keep-all}
.wcard .wside{position:absolute;top:0;right:calc(-1 * clamp(30px,3vw,48px));writing-mode:vertical-rl;font:600 13px Pretendard Variable,sans-serif;letter-spacing:.22em;color:#8C96A8;white-space:nowrap}
.wcard .wsrc{margin-top:10px;font-size:11px;color:#6F86A6}
.who .rv{transition:opacity 1s cubic-bezier(.2,.8,.2,1) var(--d,0s),transform 1s cubic-bezier(.2,.8,.2,1) var(--d,0s)}
.who.pre .rv{opacity:0;transform:translateY(40px)}
.who.pre .wcard{opacity:0;transform:translateY(80px)}
.who .wcard{transition:opacity 1.1s cubic-bezier(.2,.8,.2,1) var(--d,0s),transform 1.1s cubic-bezier(.2,.8,.2,1) var(--d,0s),background .5s,border-color .5s}
@media (max-width:1100px){.who-in{grid-template-columns:1fr}.who-left{position:static;padding-top:0}.who-col.c1{margin-top:80px}.who-col.c2{margin-top:0}}
@media (max-width:640px){.who{padding-block:96px 110px}.who-grid{grid-template-columns:1fr;gap:28px}.who-col.c1{margin-top:0}.who-col{gap:28px}.wcard{margin-right:34px}}
/* ===== NEWS (What's On?) ===== */
.nbtn{width:64px;height:64px;border-radius:50%;border:1px solid #DCE4F2;background:#FFFFFF;color:#0B1220;font-size:20px;cursor:pointer;transition:background .25s,color .25s,border-color .25s,opacity .25s}
.nbtn:hover:not(:disabled){background:#0B1220;color:#FFFFFF;border-color:#0B1220}
.nbtn:disabled{opacity:.35;cursor:default}
.news-vp{overflow:visible}
.news-track{display:flex;gap:24px;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.ncard{flex:0 0 calc((100% - 72px)/4);min-width:0;color:#0B1220;display:block}
@media (max-width:1180px){.ncard{flex-basis:calc((100% - 48px)/3)}}
@media (max-width:860px){.ncard{flex-basis:calc((100% - 24px)/2)}}
@media (max-width:640px){.news-track{gap:16px}.ncard{flex-basis:84%}}
.ncard .nimg{position:relative;aspect-ratio:1/1;overflow:hidden;background:linear-gradient(135deg,#0B2C46,#1E5EFF 60%,#4A3A8E)}
.ncard .nimg img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.ncard:hover .nimg img{transform:scale(1.06)}
.ncard .nimg .nview{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:50%;background:#1E5EFF;color:#FFFFFF;display:flex;align-items:center;justify-content:center;font:700 13px Pretendard Variable,sans-serif;letter-spacing:.06em;opacity:0;transform:scale(.6);transition:opacity .35s,transform .45s cubic-bezier(.2,.8,.2,1)}
.ncard:hover .nimg .nview{opacity:1;transform:scale(1)}
.ncard .ncat{margin-top:28px;font-size:16px;font-weight:600;color:#1E5EFF}
.ncard .ntit{margin:12px 0 0;font-size:clamp(19px,1.35vw,23px);word-break:keep-all;font-weight:700;line-height:1.5;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .25s}
.ncard:hover .ntit{color:#1E5EFF}
.ncard .nmeta{margin-top:14px;font-size:15px;color:#8C96A8}
.nthumb{background:radial-gradient(circle at 50% 45%,#0B2540 0%,#061426 55%,#02060F 100%)!important;color:#FFFFFF}
.nt-bg{position:absolute;inset:0;width:100%;height:100%;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.ncard:hover .nt-bg{transform:scale(1.08)}
.nt-rot{transform-box:view-box;transform-origin:200px 200px;animation:spin 46s linear infinite}
.nt-rot2{transform-box:view-box;transform-origin:200px 200px;animation:spin 14s linear infinite}
.nt-rot3{transform-box:view-box;transform-origin:200px 200px;animation:spin 30s linear infinite reverse}
.nt-dot{animation:aiP 2.5s ease-in-out infinite}
.nt-glow{transform-box:view-box;transform-origin:200px 200px;filter:blur(34px);animation:ntGlow 5s ease-in-out infinite}
@keyframes ntGlow{0%,100%{transform:scale(1);opacity:.16}50%{transform:scale(1.18);opacity:.3}}
.nt-scan{animation:ntScan 4.5s cubic-bezier(.5,0,.5,1) infinite}
@keyframes ntScan{0%{transform:translateY(40px);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateY(360px);opacity:0}}
.nt-top{position:absolute;left:24px;right:24px;top:22px;display:flex;justify-content:space-between;font-size:13px;letter-spacing:.16em;color:rgba(255,255,255,.55)}
.nt-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;transition:opacity .35s}
.nt-x{font:300 18px Pretendard Variable,sans-serif;color:var(--ac)}
.nt-partner{font-size:clamp(20px,1.9vw,30px);font-weight:800;letter-spacing:-.02em;color:#FFFFFF}
.nt-plogo{max-width:58%;max-height:56px;object-fit:contain}
.nt-tag{position:absolute;left:24px;bottom:22px;font-size:13px;letter-spacing:.16em;color:var(--ac)}
.ncard:hover .nt-center{opacity:.15}
.nthumb .nview{z-index:2}
/* 뉴스 카드 클릭 모션 */
.ncard{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.ncard:active{transform:scale(.975)}
.nrip{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:radial-gradient(circle,#FFFFFF 0%,var(--ac) 35%,rgba(30,94,255,.85) 60%,rgba(30,94,255,0) 72%);transform:scale(0);pointer-events:none;z-index:3;animation:nRip .75s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes nRip{70%{opacity:1}to{transform:scale(70);opacity:0}}
.ncard.go .nt-rot{animation-duration:2.4s}
.ncard.go .nt-rot2{animation-duration:1s}
.ncard.go .nt-rot3{animation-duration:1.6s}
.ncard.go .nt-bg{transform:scale(1.25)}
.ncard.go .nt-center{opacity:0!important;transform:scale(1.25)}
.ncard.go .nview{opacity:1;transform:scale(1.5);background:#FFFFFF;color:#1E5EFF}
.ncard.go .ntit{color:#1E5EFF}
#pageWipe{position:fixed;inset:0;z-index:200;pointer-events:none;background:#1E5EFF;color:#FFFFFF;display:flex;align-items:center;justify-content:center;transform:translateY(101%);visibility:hidden}
#pageWipe.in{visibility:visible;animation:wipeIn .5s .18s cubic-bezier(.7,0,.2,1) forwards}
#pageWipe.out{visibility:visible;transform:translateY(0);animation:wipeOut .55s cubic-bezier(.7,0,.2,1) forwards}
@keyframes wipeIn{from{transform:translateY(101%)}to{transform:translateY(0)}}
@keyframes wipeOut{from{transform:translateY(0)}to{transform:translateY(-101%)}}
#pageWipe .pw-in{text-align:center;padding:0 24px;opacity:0}
#pageWipe.in .pw-in{animation:miIn .45s .45s cubic-bezier(.2,.8,.2,1) forwards}
#pageWipe.out .pw-in{opacity:1}
#pageWipe .pw-k{font-size:12px;letter-spacing:.3em;color:rgba(255,255,255,.75)}
#pageWipe .pw-t{margin-top:18px;font-size:clamp(20px,2.4vw,34px);font-weight:800;letter-spacing:-.02em;max-width:900px;line-height:1.4}
#pageWipe .pw-s{margin-top:16px;font-size:14px;color:rgba(255,255,255,.8)}
#pageWipe .pw-bar{margin:28px auto 0;width:160px;height:2px;background:rgba(255,255,255,.25);overflow:hidden}
#pageWipe.in .pw-bar i{display:block;height:2px;background:#FFFFFF;transform:scaleX(0);transform-origin:left;animation:qiGrowX .6s .5s cubic-bezier(.5,0,.2,1) forwards}
.ncard.empty .nimg{background:#EEF2F8;border:1px dashed #C9D6F5;box-sizing:border-box;display:flex;align-items:center;justify-content:center;color:#8C96A8;font-size:14px}
/* ===== INTRO v2: Quantum zoom-through ===== */
.qi{position:absolute;inset:0;animation:qiEnd 4.5s steps(1,end) forwards}
@keyframes qiEnd{to{visibility:hidden}}
.qi-bg{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,#1C1A3C 0%,#0D0C22 55%,#08061A 100%);animation:qiFade .9s 3.45s cubic-bezier(.5,0,.5,1) forwards}
@keyframes qiFade{to{opacity:0}}
.qi-gl{position:absolute;background:rgba(185,160,255,.12)}
.qi-gl.v{top:0;bottom:0;width:1px;transform:scaleY(0);transform-origin:top;animation:qiGrowY 1s cubic-bezier(.6,0,.2,1) forwards,qiFade .5s 3.1s forwards}
.qi-gl.h{left:0;right:0;height:1px;transform:scaleX(0);transform-origin:left;animation:qiGrowX 1.1s cubic-bezier(.6,0,.2,1) forwards,qiFade .5s 3.1s forwards}
@keyframes qiGrowY{to{transform:scaleY(1)}}
@keyframes qiGrowX{to{transform:scaleX(1)}}
@keyframes qiIn{to{opacity:1}}
.qi-cv{position:absolute;inset:0;width:100%;height:100%;display:block;animation:qiFade .35s 4.2s forwards}
.qi-text{position:absolute;left:0;right:0;top:72%;text-align:center;animation:qiFade .35s 3.05s forwards}
.qi-logo{opacity:0;margin-bottom:18px;animation:qiIn .6s 2.2s forwards}
.qi-logo svg{display:inline-block}
.qi-t1{font-size:clamp(12px,1.05vw,15px);font-weight:600;letter-spacing:.38em;color:#E6F7FF;white-space:nowrap}
.qi-t2{margin-top:14px;font-size:11px;font-weight:500;letter-spacing:.24em;color:#6FA8C8;opacity:0;animation:qiIn .6s 2.2s forwards}
.qi-hud{position:absolute;bottom:40px;font-size:11px;font-weight:600;letter-spacing:.16em;font-variant-numeric:tabular-nums;color:#6F86A6;opacity:0;animation:qiIn .5s .4s forwards,qiFade .35s 2.95s forwards}
.qi-hud.l{left:max(clamp(20px,5vw,64px),calc((100% - var(--wrap)) / 2))}.qi-hud.r{right:max(clamp(20px,5vw,64px),calc((100% - var(--wrap)) / 2));text-align:right}
.qi-bar{margin-top:10px;width:180px;height:1px;background:rgba(127,227,255,.15);overflow:hidden}
.qi-bar i{display:block;height:1px;width:100%;background:#7FE3FF;transform:scaleX(0);transform-origin:left;animation:qiGrowX 2.5s .3s cubic-bezier(.5,0,.2,1) forwards}
.qi-hud.r .qi-bar{margin-left:auto}
.hl{white-space:nowrap}
@media (max-width:720px){.hl{white-space:normal}}

.nav-menu:has(.navbtn[aria-expanded="true"]) .navbtn.cur:not([aria-expanded="true"]) .uline,.nav:has(.navbtn[aria-expanded="true"]) .navbtn.cur:not([aria-expanded="true"]) .uline{transform:scaleX(0)}

/* ===== v3.30 SOLUTIONS index + ISO ARCHITECTURE ===== */
.sx{padding:140px clamp(20px,5vw,64px);background:#F6F8FB;position:relative;overflow:hidden}
.sx-in{max-width:var(--wrap);margin:0 auto}
.sx-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.sx-eye{font:700 15px 'Pretendard Variable',sans-serif;color:#1E5EFF;letter-spacing:.02em}
.sx-h{margin:16px 0 0;font-size:clamp(32px,3.4vw,56px);font-weight:800;line-height:1.25;letter-spacing:-.03em}
.sx-lead{margin:0;max-width:30em;font-size:18px;line-height:1.8;color:#4A5A75}
.sx-g{margin-top:72px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,4vw,72px);align-items:start}
.sx-pv{position:sticky;top:110px;background:#FFFFFF;border:1px solid #E3EAF4;box-shadow:0 30px 80px rgba(30,60,160,.08)}
.sx-vis{position:relative;height:clamp(280px,24vw,380px);background:linear-gradient(160deg,#F7F9FE,#E4ECFB);border-bottom:1px solid #E3EAF4;overflow:hidden}
.sx-vis.ai{background:linear-gradient(160deg,#FAF8FF,#ECE6FF)}
.sx-vis::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(30,94,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(30,94,255,.06) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%)}
.pvs{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.96);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.pvs.on{opacity:1;transform:none}
.pvs svg{width:min(86%,460px);height:auto;overflow:visible}
.sx-bd{padding:clamp(26px,2.6vw,40px)}
.sx-code{font:700 12px 'Pretendard Variable',sans-serif;letter-spacing:.1em;color:#1E5EFF}
.sx-bd h3{margin:12px 0 0;font:800 clamp(26px,2.2vw,34px)/1.2 'Pretendard Variable',Pretendard,sans-serif;letter-spacing:-.02em}
.sx-bd p{margin:14px 0 0;font-size:16.5px;line-height:1.75;color:#4A5A75;min-height:3.5em}
.sx-ft{margin-top:24px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.sx-tg{display:flex;gap:6px;flex-wrap:wrap}.sx-tg span{padding:5px 11px;border-radius:999px;background:#EEF3FF;font-size:12.5px;font-weight:700;color:#0B3FCC}
.sx-go{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;background:#1E5EFF;color:#FFFFFF!important;font-size:15px;font-weight:700;transition:background .25s,gap .25s}
.sx-go:hover{background:#0B3FCC;gap:14px}
.sx-go.soon{background:#FFFFFF;color:#6B7A93!important;border:1px solid #DCE4F2;pointer-events:none}.sx-go.ai{background:#6A4BFF}.sx-go.ai:hover{background:#5236E0}
.sx-grp{margin:0 0 8px;display:flex;align-items:center;gap:12px;font:800 12px 'Pretendard Variable',sans-serif;letter-spacing:.12em;color:#6B7A93}
.sx-grp b{font-weight:800;color:#0B1220}.sx-grp::after{content:"";flex:1;height:1px;background:#DCE4F2}
.sx-grp+.sx-ls{margin-bottom:48px}
.sx-ls{list-style:none;margin:0;padding:0}
.sx-it{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr) 48px;align-items:center;gap:18px;padding:26px 20px 26px 22px;border-bottom:1px solid #E3EAF4;color:#0B1220!important;cursor:pointer;transition:background .35s}
.sx-it::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#1E5EFF;transform:scaleY(0);transform-origin:top;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.sx-it.ai::before{background:#6A4BFF}
.sx-it .no{font:800 14px 'Pretendard Variable',sans-serif;color:#B5C2D9;transition:color .3s}
.sx-it .nm{font:800 clamp(20px,1.7vw,26px)/1.25 'Pretendard Variable',Pretendard,sans-serif;letter-spacing:-.02em;transition:color .3s}
.sx-it .ds{display:block;margin-top:6px;font-size:14.5px;color:#6B7A93;line-height:1.6}
.sx-it .ar{width:44px;height:44px;border-radius:50%;border:1px solid #DCE4F2;display:flex;align-items:center;justify-content:center;color:#1E5EFF;transition:background .35s,color .35s,transform .45s,border-color .35s}
.sx-it .ar svg{width:18px;height:18px}
.sx-it.on{background:#FFFFFF}.sx-it.on::before{transform:scaleY(1)}
.sx-it.on .no{color:#1E5EFF}.sx-it.on .nm{color:#1E5EFF}
.sx-it.on .ar{background:#1E5EFF;border-color:#1E5EFF;color:#FFFFFF;transform:rotate(-45deg)}
.sx-it.ai.on .no,.sx-it.ai.on .nm{color:#6A4BFF}.sx-it.ai.on .ar{background:#6A4BFF;border-color:#6A4BFF}
.sx-it .pg{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:transparent;overflow:hidden}
.sx-it .pg i{display:block;height:100%;width:0;background:linear-gradient(90deg,#1E5EFF,#0FA3C7)}
.sx-it.ai .pg i{background:linear-gradient(90deg,#6A4BFF,#B59BFF)}
.sx-it.on .pg i{animation:sxPg 5s linear forwards}.sx.hold .sx-it.on .pg i{animation-play-state:paused}
@keyframes sxPg{to{width:100%}}
.sx-rv{opacity:0;transform:translateY(36px);transition:opacity 1s cubic-bezier(.2,.8,.2,1) var(--d,0s),transform 1s cubic-bezier(.2,.8,.2,1) var(--d,0s)}
.in .sx-rv{opacity:1;transform:none}
/* scenes */
.dw{stroke-dasharray:240;stroke-dashoffset:240;animation:dw 3.6s ease infinite}
@keyframes dw{0%{stroke-dashoffset:240}45%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
.rot{transform-box:fill-box;transform-origin:center;animation:rot 9s linear infinite}@keyframes rot{to{transform:rotate(360deg)}}
.tunl{stroke-dasharray:4 8;animation:flow 2s linear infinite}
.kp rect{transition:fill .25s}.kp text{font:700 15px 'Pretendard Variable',sans-serif;fill:#0B1220}
.kp .hi rect{fill:#1E5EFF}.kp .hi text{fill:#FFFFFF}
.ck{opacity:0;animation:ckA 3.6s ease infinite}@keyframes ckA{0%,40%{opacity:0;transform:scale(.6)}50%,90%{opacity:1;transform:none}100%{opacity:0}}
.ck{transform-box:fill-box;transform-origin:center}
.otp text{font:800 26px 'Pretendard Variable',sans-serif;fill:#2A1E6B;letter-spacing:.02em}
/* iso architecture */
.qx{padding:140px clamp(20px,5vw,64px);background:#FFFFFF;position:relative;overflow:hidden}
.qx-in{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:clamp(32px,5vw,96px);align-items:center}
.qx .sx-h{font-size:clamp(30px,2.8vw,48px)}
.qx-pt{margin-top:44px;display:grid;gap:0;border-top:1px solid #E3EAF4}
.qx-pt>div{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding:22px 0;border-bottom:1px solid #E3EAF4}
.qx-pt b{font:800 13px 'Pretendard Variable',sans-serif;color:#1E5EFF;padding-top:3px}
.qx-pt h4{margin:0;font-size:18px;font-weight:800;letter-spacing:-.02em}
.qx-pt p{margin:6px 0 0;font-size:15px;line-height:1.7;color:#4A5A75}
.qx-vis{position:relative}
.qx-vis svg{display:block;width:100%;height:auto;overflow:visible}
.iso-t{transform-box:view-box;animation:isoUp 7.2s cubic-bezier(.4,0,.2,1) infinite}
.iso-t .tp{transition:fill .3s;animation:isoFill 7.2s cubic-bezier(.4,0,.2,1) infinite;animation-delay:inherit}
@keyframes isoUp{0%,4%{transform:translateY(0)}9%,16%{transform:translateY(-14px)}22%,100%{transform:translateY(0)}}
@keyframes isoFill{0%,4%{fill:#FFFFFF}9%,16%{fill:#1E5EFF}22%,100%{fill:#FFFFFF}}
.iso-t .lb{animation:isoLb 7.2s cubic-bezier(.4,0,.2,1) infinite;animation-delay:inherit}
@keyframes isoLb{0%,4%{fill:#0B1220}9%,16%{fill:#FFFFFF}22%,100%{fill:#0B1220}}
.iso-t.ai .tp{animation-name:isoFillA}@keyframes isoFillA{0%,4%{fill:#FFFFFF}9%,16%{fill:#6A4BFF}22%,100%{fill:#FFFFFF}}
.iso-fl{animation:isoFl 6s ease-in-out infinite}@keyframes isoFl{50%{transform:translateY(-8px)}}
.iso-bm{animation:isoBm 2.4s ease-in infinite}@keyframes isoBm{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-190px);opacity:0}}
.iso-lt{font:800 11px 'Pretendard Variable',sans-serif;letter-spacing:.12em;fill:#1E5EFF}.iso-ln{font:800 16px Pretendard,Pretendard,sans-serif;fill:#0B1220}.iso-ls{font:500 12.5px Pretendard,Pretendard,sans-serif;fill:#6B7A93}
@media (max-width:1100px){.sx-g,.qx-in{grid-template-columns:1fr}.sx-pv{position:relative;top:0}}
@media (max-width:640px){.sx,.qx{padding-block:96px}.sx-it{grid-template-columns:36px minmax(0,1fr) 40px;padding:20px 8px 20px 14px;gap:12px}.sx-it .ar{width:38px;height:38px}}
@media (prefers-reduced-motion:reduce){.iso-t,.iso-t .tp,.iso-t .lb,.iso-fl,.iso-bm,.dw,.rot{animation:none!important}.dw{stroke-dashoffset:0}}


/* v3.36 solution tabs */
.sx-tabs{position:relative;margin-top:64px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:1px solid #DCE4F2}
.sx-tb{position:relative;display:flex;align-items:center;gap:20px;padding:28px 28px 30px;border:0;background:transparent;font:inherit;color:#8C96A8;text-align:left;cursor:pointer;transition:color .35s,background .35s}
.sx-tb:hover{background:rgba(30,94,255,.03);color:#4A5A75}
.sx-tb .k{font:800 14px 'Pretendard Variable',sans-serif;color:#B5C2D9;transition:color .35s}
.sx-tb .tx{display:flex;flex-direction:column;gap:6px;min-width:0}
.sx-tb b{font:800 clamp(24px,2vw,34px)/1.1 'Pretendard Variable',sans-serif;letter-spacing:-.02em}
.sx-tb small{font-size:15px;font-weight:600}
.sx-tb .c{margin-left:auto;min-width:44px;height:30px;padding:0 10px;border-radius:999px;border:1px solid #DCE4F2;display:inline-flex;align-items:center;justify-content:center;font:800 13px 'Pretendard Variable',sans-serif;transition:all .35s}
.sx-tb.on{color:#0B1220}.sx-tb.on .k{color:#1E5EFF}.sx-tb.on .c{background:#1E5EFF;border-color:#1E5EFF;color:#FFFFFF}
.sx-tb.ai.on .k{color:#6A4BFF}.sx-tb.ai.on .c{background:#6A4BFF;border-color:#6A4BFF}
.sx-tb.on small{color:#4A5A75}
.sx-ind{position:absolute;left:0;bottom:-1px;width:50%;height:3px;background:#1E5EFF;transition:transform .55s cubic-bezier(.2,.8,.2,1),background .4s}
.sx-tabs.g1 .sx-ind{transform:translateX(100%);background:#6A4BFF}
.sx-tabs+.sx-g{margin-top:48px}
.sx-pane{animation:sxPane .6s cubic-bezier(.2,.8,.2,1)}
@keyframes sxPane{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.sx-intro{margin:0 0 20px;padding:0 0 22px;border-bottom:1px solid #E3EAF4;font-size:16.5px;line-height:1.75;color:#4A5A75}
.sx-ft-ls{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:12px}
.sx-ft-ls li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding:22px 22px;background:#FFFFFF;border:1px solid #E3EAF4;transition:border-color .3s,transform .3s}
.sx-ft-ls li:hover{border-color:#CFC4FF;transform:translateX(4px)}
.sx-ft-ls i{width:44px;height:44px;border-radius:12px;background:#F1EDFF;color:#6A4BFF;display:flex;align-items:center;justify-content:center}
.sx-ft-ls i svg{width:22px;height:22px}
.sx-ft-ls b{display:block;font-size:17px;font-weight:800;letter-spacing:-.01em}
.sx-ft-ls span{display:block;margin-top:4px;font-size:14.5px;line-height:1.65;color:#6B7A93}
.sx-it.solo .pg{display:none}
#sxVis.ai~.sx-bd .sx-tg span{background:#F1EDFF;color:#5236E0}
@media (max-width:640px){.sx-tb b{font-size:19px}.sx-tb{padding:20px 12px 22px;gap:10px}.sx-tb .k{display:none}.sx-tb small{font-size:12.5px}.sx-tb .c{display:none}}

/* v3.37 solutions simple cards */
.sx-seg{position:relative;margin-top:56px;display:inline-grid;grid-template-columns:1fr 1fr;padding:6px;border-radius:999px;background:#FFFFFF;border:1px solid #E3EAF4;box-shadow:0 10px 30px rgba(30,60,160,.06)}
.sx-seg button{position:relative;z-index:1;min-width:200px;height:56px;padding:0 28px;border:0;border-radius:999px;background:transparent;font:800 17px 'Pretendard Variable',sans-serif;color:#6B7A93;cursor:pointer;transition:color .35s;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.sx-seg button em{font-style:normal;font-size:12px;font-weight:800;padding:3px 8px;border-radius:999px;background:#EEF2F8;color:#8C96A8;transition:all .35s}
.sx-seg button.on{color:#FFFFFF}.sx-seg button.on em{background:rgba(255,255,255,.2);color:#FFFFFF}
.sx-seg-bg{position:absolute;top:6px;bottom:6px;left:6px;width:calc(50% - 6px);border-radius:999px;background:#1E5EFF;box-shadow:0 10px 24px rgba(30,94,255,.3);transition:transform .55s cubic-bezier(.2,.8,.2,1),background .4s,box-shadow .4s}
.sx-seg.g1 .sx-seg-bg{transform:translateX(100%);background:#6A4BFF;box-shadow:0 10px 24px rgba(106,75,255,.3)}
.sx-panes{margin-top:40px}
.sx-pn{display:none}.sx-pn.on{display:grid}
.sx-pn.g0{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.sx-cd{position:relative;display:flex;flex-direction:column;background:#FFFFFF;border:1px solid #E3EAF4;color:#0B1220!important;overflow:hidden;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s;opacity:0;transform:translateY(24px);animation:sxCd .7s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--k) * .08s)}
@keyframes sxCd{to{opacity:1;transform:none}}
.sx-cd:hover{transform:translateY(-8px);box-shadow:0 30px 60px rgba(30,60,160,.12);border-color:#C9D6F5}
.sx-cd .v{position:relative;aspect-ratio:4/3;background:linear-gradient(160deg,#F7F9FE,#E4ECFB);overflow:hidden;display:flex;align-items:center;justify-content:center}
.sx-cd .v::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(30,94,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(30,94,255,.06) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%)}
.sx-cd .v svg{position:relative;width:88%;height:auto;overflow:visible;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.sx-cd:hover .v svg{transform:scale(1.05)}
.sx-cd .b{flex:1;display:flex;flex-direction:column;padding:26px 26px 24px}
.sx-cd .t{font:700 12px 'Pretendard Variable',sans-serif;letter-spacing:.1em;color:#1E5EFF;text-transform:uppercase}
.sx-cd h3{margin:10px 0 0;font:800 clamp(20px,1.5vw,24px)/1.25 'Pretendard Variable',Pretendard,sans-serif;letter-spacing:-.02em}
.sx-cd p{margin:8px 0 0;font-size:15px;line-height:1.6;color:#6B7A93}
.sx-cd .go{margin-top:auto;padding-top:22px;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:700;color:#4A5A75}
.sx-cd .go i{width:40px;height:40px;border-radius:50%;border:1px solid #DCE4F2;display:flex;align-items:center;justify-content:center;color:#1E5EFF;transition:all .35s}
.sx-cd .go i svg{width:16px;height:16px}
.sx-cd:hover .go i{background:#1E5EFF;border-color:#1E5EFF;color:#FFFFFF;transform:rotate(-45deg)}
.sx-cd.soon .go span{color:#A3AEC2}
.sx-pn.g1{grid-template-columns:1fr}
.sx-cd.wide{flex-direction:row;align-items:stretch}
.sx-cd.wide .v{flex:1.15;aspect-ratio:auto;min-height:clamp(320px,26vw,420px);background:linear-gradient(160deg,#FAF8FF,#ECE6FF)}
.sx-cd.wide .v svg{width:min(78%,520px)}
.sx-cd.wide .b{flex:1;justify-content:center;padding:clamp(32px,4vw,64px)}
.sx-cd.wide .t{color:#6A4BFF}
.sx-cd.wide h3{font-size:clamp(28px,2.6vw,44px)}
.sx-cd.wide p{font-size:17px;line-height:1.75;max-width:30em}
.sx-cd.wide .ch{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px}
.sx-cd.wide .ch span{padding:8px 14px;border-radius:999px;background:#F1EDFF;color:#5236E0;font-size:14px;font-weight:700}
.sx-cd.wide .go{margin-top:32px;justify-content:flex-start;gap:14px}
.sx-cd.wide .go i{color:#6A4BFF}.sx-cd.wide:hover .go i{background:#6A4BFF;border-color:#6A4BFF;color:#FFFFFF}
.sx-cd.wide:hover{border-color:#D9D1FF;box-shadow:0 30px 60px rgba(106,75,255,.12)}
@media (max-width:1100px){.sx-pn.g0{grid-template-columns:repeat(2,minmax(0,1fr))}.sx-cd.wide{flex-direction:column}.sx-cd.wide .v{min-height:280px}}
@media (max-width:640px){.sx-pn.g0{grid-template-columns:1fr}.sx-seg{display:grid;width:100%}.sx-seg button{min-width:0;padding:0 10px;font-size:15px;height:50px}}

/* v3.39 product palette (main cards) */
.sx-cd[href="#solutions"] .t{color:#0E9F7E}.sx-cd[href="#solutions"] .v{background:linear-gradient(160deg,#F5FCF9,#DDF3EB)}.sx-cd[href="#solutions"] .go i{color:#0E9F7E}.sx-cd[href="#solutions"]:hover .go i{background:#0E9F7E;border-color:#0E9F7E;color:#fff}.sx-cd[href="#solutions"]:hover{border-color:#BFE6DA}
.sx-cd[href*="safepad"] .t{color:#3D5A99}.sx-cd[href*="safepad"] .v{background:linear-gradient(160deg,#F7F9FC,#DFE6F2)}.sx-cd[href*="safepad"] .go i{color:#3D5A99}.sx-cd[href*="safepad"]:hover .go i{background:#3D5A99;border-color:#3D5A99;color:#fff}.sx-cd[href*="safepad"]:hover{border-color:#CDD6E6}
.sx-cd[href*="safeapi"] .t{color:#C9731F}.sx-cd[href*="safeapi"] .v{background:linear-gradient(160deg,#FFFAF3,#F9E6CC)}.sx-cd[href*="safeapi"] .go i{color:#D9822B}.sx-cd[href*="safeapi"]:hover .go i{background:#D9822B;border-color:#D9822B;color:#fff}.sx-cd[href*="safeapi"]:hover{border-color:#EED9BF}
.sx-cd[href*="safepad"] .kp .hi rect{fill:#3D5A99}.sx-cd[href*="safepad"] #sxDots circle[fill="#1E5EFF"]{fill:#3D5A99}

/* v3.40 product sub-tabs + single wide card */
.sx-pn.on{display:block!important}
.sx-sub{display:flex;gap:4px;margin:0 0 28px;border-bottom:1px solid #DCE4F2;overflow-x:auto;scrollbar-width:none}
.sx-sub::-webkit-scrollbar{display:none}
.sx-sub button{position:relative;flex:none;display:inline-flex;align-items:center;gap:10px;padding:16px 22px 18px;border:0;background:transparent;font:800 clamp(17px,1.25vw,21px) 'Pretendard Variable',sans-serif;letter-spacing:-.01em;color:#8C96A8;cursor:pointer;transition:color .3s}
.sx-sub button i{width:9px;height:9px;border-radius:50%;background:var(--c);opacity:.35;transition:opacity .3s,transform .3s}
.sx-sub button::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:3px;border-radius:3px;background:var(--c);transform:scaleX(0);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.sx-sub button:hover{color:#4A5A75}
.sx-sub button.on{color:#0B1220}.sx-sub button.on i{opacity:1;transform:scale(1.2)}.sx-sub button.on::after{transform:scaleX(1)}
.sx-stage .sx-cd{display:none}.sx-stage .sx-cd.on{display:flex}
.sx-pn .sx-cd.wide{flex-direction:row;animation-delay:0s}
.sx-pn .sx-cd.wide .v{background:linear-gradient(160deg,var(--b1),var(--b2))!important}
.sx-pn .sx-cd.wide .t{color:var(--c)!important}
.sx-pn .sx-cd.wide .ch span{background:var(--tn);color:var(--cd)}
.sx-pn .sx-cd.wide .go i{color:var(--c)!important;border-color:#DCE4F2}
.sx-pn .sx-cd.wide:hover .go i{background:var(--c)!important;border-color:var(--c)!important;color:#FFFFFF!important}
.sx-pn .sx-cd.wide:hover{border-color:var(--tn)!important;box-shadow:0 30px 60px rgba(11,18,32,.08)}
.sx-pn .sx-cd.wide.soon .go span{color:#A3AEC2}
@media (max-width:1100px){.sx-pn .sx-cd.wide{flex-direction:column}}
@media (max-width:640px){.sx-sub button{padding:14px 14px 16px;font-size:15px}}

/* v3.42 solution nav: big text tabs + product pills */
.sx-seg{position:relative;display:flex!important;justify-content:center;gap:clamp(32px,5vw,88px);width:auto;margin:72px auto 0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important}
.sx-seg-bg{display:none!important}
.sx-seg button{position:relative;height:auto!important;min-width:0!important;padding:0 0 18px!important;border-radius:0!important;background:none!important;font:800 clamp(28px,2.6vw,44px)/1.1 'Pretendard Variable',sans-serif!important;letter-spacing:-.03em;color:#C3CBD8!important;gap:10px!important;align-items:flex-start!important;transition:color .35s}
.sx-seg button em{margin-top:4px;font:800 13px 'Pretendard Variable',sans-serif!important;padding:3px 9px!important;border-radius:999px;background:#EEF1F6!important;color:#9AA4B5!important;letter-spacing:0}
.sx-seg button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;border-radius:4px;background:#1E5EFF;transform:scaleX(0);transform-origin:center;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.sx-seg button[data-g="1"]::after{background:#6A4BFF}
.sx-seg button:hover{color:#8C96A8!important}
.sx-seg button.on{color:#0B1220!important}.sx-seg button.on::after{transform:scaleX(1)}
.sx-seg button.on em{background:#1E5EFF!important;color:#FFFFFF!important}.sx-seg button[data-g="1"].on em{background:#6A4BFF!important}
.sx-sub{justify-content:center;gap:10px!important;margin:36px 0 40px!important;border-bottom:0!important;flex-wrap:wrap;overflow:visible}
.sx-sub button{padding:12px 22px 12px 18px!important;border:1px solid #DCE4F2!important;border-radius:999px!important;background:#FFFFFF!important;font:700 16px 'Pretendard Variable',sans-serif!important;color:#4A5A75!important;box-shadow:0 4px 14px rgba(11,18,32,.04);transition:all .3s}
.sx-sub button::after{display:none}
.sx-sub button i{opacity:1!important;transform:none!important}
.sx-sub button:hover{border-color:var(--c)!important;color:#0B1220!important}
.sx-sub button.on{background:var(--c)!important;border-color:var(--c)!important;color:#FFFFFF!important;box-shadow:0 10px 24px rgba(11,18,32,.12)}
.sx-sub button.on i{background:#FFFFFF}
@media (max-width:640px){.sx-seg{gap:24px}.sx-seg button{font-size:21px!important;white-space:nowrap}.sx-seg button em{font-size:11px!important;padding:2px 7px!important}.sx-sub{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto}.sx-sub button{font-size:14px!important;padding:10px 16px 10px 14px!important}}

/* v3.43 solutions: clean split (who-we-are style) */
#solutions.sx{background:linear-gradient(125deg,#F8FAFD 0%,#FFFFFF 45%,#EEF4FC 100%)}
.sx2{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);gap:clamp(40px,6vw,120px);align-items:center}
.sx2 .sx-h{font-size:clamp(32px,3vw,52px);white-space:nowrap}
.sx2-lead{margin:22px 0 0;max-width:28em;font-size:17px;line-height:1.8;color:#4A5A75}
.sx2-nav{margin-top:48px;display:flex;flex-direction:column;gap:28px}
.sx2-gl{display:block;margin-bottom:8px;font:700 12px Pretendard Variable,sans-serif;letter-spacing:.18em;color:#9AA4B5;text-transform:uppercase}
.sx2-it{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:center;gap:4px 16px;padding:16px 0 16px 22px;border:0;border-bottom:1px solid #E3EAF4;background:none;font:inherit;text-align:left;cursor:pointer}
.sx2-it::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#D5DCE7;transition:background .3s,transform .3s}
.sx2-it .nm{grid-column:1;font:800 clamp(22px,1.7vw,28px)/1.2 Pretendard Variable,sans-serif;letter-spacing:-.02em;color:#A3AEC2;transition:color .3s}
.sx2-it .ds{grid-column:1;font-size:14.5px;color:#A3AEC2;max-height:0;opacity:0;overflow:hidden;transition:max-height .45s,opacity .35s}
.sx2-it i{grid-column:2;grid-row:1/span 2;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#C3CBD8;transition:all .35s}
.sx2-it i svg{width:15px;height:15px}
.sx2-it:hover .nm{color:#4A5A75}
.sx2-it.on::before{background:var(--c);transform:scale(1.3)}
.sx2-it.on .nm{color:#0B1220}
.sx2-it.on .ds{max-height:3em;opacity:1;color:#6B7A93}
.sx2-it.on i{background:var(--c);color:#FFFFFF}
.sx2-r{position:relative;padding-right:40px}
.sx2-stage{position:relative;display:grid}
.sx2-cd{grid-area:1/1;position:relative;display:flex;flex-direction:column;background:#FFFFFF;border:1px solid #E3EAF4;box-shadow:0 30px 70px rgba(11,18,32,.08);opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1),visibility .5s}
.sx2-cd.on{opacity:1;visibility:visible;transform:none}
.sx2-side{position:absolute;top:0;right:-40px;writing-mode:vertical-rl;font:600 13px Pretendard Variable,sans-serif;letter-spacing:.22em;color:#8C96A8;white-space:nowrap}
.sx2-cd .v{position:relative;height:clamp(260px,22vw,340px);display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--t),#FFFFFF);overflow:hidden}
.sx2-cd .v::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(11,18,32,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(11,18,32,.04) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse at center,#000 25%,transparent 72%)}
.sx2-cd .v svg{position:relative;width:min(70%,460px);height:auto;overflow:visible}
.sx2-cd .b{padding:clamp(28px,2.6vw,44px)}
.sx2-cd .t{font:700 13px Pretendard Variable,sans-serif;letter-spacing:.06em;color:var(--c)}
.sx2-cd h3{margin:10px 0 0;font:800 clamp(30px,2.6vw,44px)/1.1 Pretendard Variable,sans-serif;letter-spacing:-.03em;color:#0B1220}
.sx2-cd p{margin:16px 0 0;max-width:36em;font-size:16.5px;line-height:1.75;color:#4A5A75}
.sx2-cd .ft{margin-top:28px;padding-top:24px;border-top:1px solid #EEF1F6;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sx2-cd .ch{display:flex;gap:8px;flex-wrap:wrap}
.sx2-cd .ch span{padding:6px 12px;border:1px solid #E3EAF4;font-size:13px;font-weight:700;color:#4A5A75}
.sx2-cd .go{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;background:#0B1220;color:#FFFFFF!important;font-size:15px;font-weight:700;transition:background .3s,gap .3s}
.sx2-cd .go svg{width:16px;height:16px}
.sx2-cd .go:hover{background:var(--c);gap:14px}
.sx2-cd .go.soon{background:none;padding:0;color:#A3AEC2!important;min-height:0}
@media (max-width:1100px){.sx2{grid-template-columns:1fr}.sx2-r{padding-right:0}.sx2-side{display:none}}
@media (max-width:640px){.sx2 .sx-h{white-space:normal}.sx2-it .nm{font-size:20px}.sx2-cd .v{height:220px}}

/* v3.44 nav as icon cards */
.sx2-nav{gap:24px!important}
.sx2-g{display:flex;flex-direction:column;gap:10px}
.sx2-gl{margin-bottom:2px!important}
.sx2-it{grid-template-columns:52px minmax(0,1fr) 28px!important;gap:0 18px!important;padding:20px 22px!important;border:1px solid #E3EAF4!important;background:#FFFFFF!important;transition:border-color .3s,box-shadow .3s,transform .3s}
.sx2-it::before{display:none!important}
.sx2-it .ic{grid-row:1;width:52px;height:52px;border-radius:12px;background:var(--t);color:var(--c);display:flex;align-items:center;justify-content:center}
.sx2-it .ic svg{width:24px;height:24px}
.sx2-it .tx{display:flex;flex-direction:column;gap:6px;min-width:0}
.sx2-it .nm{font:800 18px/1.3 Pretendard Variable,Pretendard,sans-serif!important;letter-spacing:-.01em;color:#0B1220!important}
.sx2-it .ds{max-height:none!important;opacity:1!important;font-size:14.5px!important;line-height:1.5;color:#6B7A93!important}
.sx2-it i{grid-column:3!important;grid-row:1!important;width:28px!important;height:28px!important;background:none!important;color:#C3CBD8!important}
.sx2-it:hover{border-color:#C9D6F5!important}
.sx2-it.on{border-color:var(--c)!important;box-shadow:0 16px 36px rgba(11,18,32,.08);transform:translateX(6px)}
.sx2-it.on i{color:var(--c)!important}
@media (max-width:640px){.sx2-it{grid-template-columns:44px minmax(0,1fr) 20px!important;gap:0 14px!important;padding:16px!important}.sx2-it .ic{width:44px;height:44px}.sx2-it .nm{font-size:16px!important}.sx2-it.on{transform:none}}

/* v3.45 horizontal product tabs above card */
.sx2{display:block!important}
.sx2-l{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:end}
.sx2-l .sx-eye,.sx2-l .sx-h{grid-column:1}.sx2-l .sx-eye{align-self:end}
.sx2-lead{grid-column:2;grid-row:1/span 2;align-self:end;margin:0!important;justify-self:end}
.sx2-nav{margin-top:56px!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px!important}
.sx2-g{display:contents!important}.sx2-gl{display:none!important}
.sx2-it{grid-template-columns:48px minmax(0,1fr)!important;gap:0 14px!important;padding:18px 18px!important;height:100%;align-items:center}
.sx2-it .ic{width:48px!important;height:48px!important}
.sx2-it .nm{font-size:17px!important}
.sx2-it .ds{font-size:13.5px!important}
.sx2-it i{display:none!important}
.sx2-it.on{transform:translateY(-4px)!important}
.sx2-it.on::after{content:"";position:absolute;left:50%;bottom:-9px;width:14px;height:14px;margin-left:-7px;background:#FFFFFF;border-right:1px solid var(--c);border-bottom:1px solid var(--c);transform:rotate(45deg)}
.sx2-r{margin-top:28px;padding-right:40px}
.sx2-cd{flex-direction:row!important}
.sx2-cd .v{flex:1.1;height:auto!important;min-height:clamp(320px,26vw,420px)}
.sx2-cd .b{flex:1;display:flex;flex-direction:column;justify-content:center}
@media (max-width:1100px){.sx2-l{grid-template-columns:1fr}.sx2-lead{grid-column:1;grid-row:auto;justify-self:start}.sx2-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.sx2-cd{flex-direction:column!important}.sx2-r{padding-right:0}}
@media (max-width:640px){.sx2-nav{display:flex!important;flex-direction:row!important;overflow-x:auto;scrollbar-width:none;padding:6px 2px 14px}.sx2-it{flex:0 0 230px;height:auto}.sx2-it.on::after{display:none}}

/* v3.46 centered solutions header */
.sx2-l{display:flex!important;flex-direction:column;align-items:center;text-align:center;gap:0}
.sx2-l .sx-eye{align-self:center!important;font-size:clamp(18px,1.3vw,22px)!important;font-weight:800;letter-spacing:.01em}
.sx2-l .sx-h{margin-top:14px!important;white-space:nowrap}
.sx2-lead{margin:20px 0 0!important;justify-self:auto!important;align-self:center!important;max-width:none!important;text-align:center}
.sx2-it .nm{font-size:clamp(19px,1.35vw,23px)!important}
.sx2-it .ds{font-size:14px!important}
@media (max-width:900px){.sx2-l .sx-h{white-space:normal}}

/* v3.47 bigger type & taller section */
#solutions.sx{padding-block:clamp(140px,10vw,200px)!important}
.sx2-l .sx-eye{font-size:clamp(20px,1.4vw,24px)!important}
.sx2-l .sx-h{font-size:clamp(36px,3.2vw,58px)!important;margin-top:18px!important}
.sx2-lead{font-size:clamp(17px,1.15vw,20px)!important;margin-top:24px!important}
.sx2-nav{margin-top:72px!important;gap:16px!important}
.sx2-it{padding:24px 22px!important}
.sx2-it .ds{font-size:clamp(14px,.92vw,16px)!important}
.sx2-r{margin-top:36px!important}
.sx2-cd .v{min-height:clamp(380px,30vw,520px)!important}
.sx2-cd .v svg{width:min(78%,520px)!important}
.sx2-cd .b{padding:clamp(36px,3.4vw,64px)!important}
.sx2-cd .t{font-size:clamp(14px,.95vw,16px)!important}
.sx2-cd h3{font-size:clamp(34px,3vw,54px)!important}
.sx2-cd p{font-size:clamp(17px,1.15vw,20px)!important}
.sx2-cd .ch span{font-size:clamp(13px,.9vw,15px)!important;padding:8px 14px!important}
.sx2-cd .go{font-size:clamp(15px,1vw,17px)!important;min-height:54px!important;padding:0 26px!important}
.sx2-cd .go.soon{padding:0!important;min-height:0!important}
.sx2-side{font-size:14px!important}

/* v3.48 carousel (peek both sides) */
#solutions.sx{overflow:hidden}
.sx2-r{position:relative;padding-right:0!important;margin-top:48px!important}
.sx2-stage{display:grid!important;justify-items:center;touch-action:pan-y;user-select:none}
.sx2-cd{--w:min(1100px,64vw);grid-area:1/1;width:var(--w);opacity:1!important;visibility:visible!important;transform:translateX(calc(var(--o,0) * (var(--w) + 48px))) scale(.86)!important;filter:saturate(.6);transition:transform .9s cubic-bezier(.65,0,.2,1),opacity .7s,filter .7s,box-shadow .7s!important;box-shadow:0 16px 40px rgba(11,18,32,.05)!important;cursor:pointer}
.sx2-cd.on{transform:translateX(0) scale(1)!important;filter:none;z-index:2;cursor:default;box-shadow:0 40px 90px rgba(11,18,32,.12)!important}
.sx2-cd.near{opacity:.55!important}.sx2-cd.near:hover{opacity:.85!important}
.sx2-cd.far{opacity:0!important;pointer-events:none}
.sx2-cd:not(.on) .sx2-side{opacity:0}
.sx2-cd:not(.on) .b *{pointer-events:none}
.sx2-cd .v svg{transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.sx2-cd:not(.on) .v svg{transform:scale(.9)}
.sx2-cd.on .b>*{animation:sxIn .8s cubic-bezier(.2,.8,.2,1) both}
.sx2-cd.on .b>*:nth-child(2){animation-delay:.08s}.sx2-cd.on .b>*:nth-child(3){animation-delay:.16s}
@keyframes sxIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.sx2-side{right:-36px!important;transition:opacity .4s}
.sx2-cd h3{font-size:clamp(28px,2.3vw,44px)!important;line-height:1.15!important;white-space:nowrap}
.sx2-cd .hd{height:auto!important}
.sx2-ar{position:absolute;top:50%;z-index:5;width:64px;height:64px;margin-top:-32px;border-radius:50%;border:1px solid #E3EAF4;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);color:#0B1220;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 12px 30px rgba(11,18,32,.08);transition:background .3s,color .3s,transform .3s}
.sx2-ar svg{width:22px;height:22px}
.sx2-ar.l{left:calc(50% - var(--w2) / 2 - 32px)}.sx2-ar.r{right:calc(50% - var(--w2) / 2 - 32px)}
.sx2-r{--w2:min(1100px,64vw)}
.sx2-ar:hover{background:#0B1220;color:#FFFFFF;transform:scale(1.06)}
@media (max-width:1100px){.sx2-cd,.sx2-r{--w:80vw;--w2:80vw}.sx2-cd h3{font-size:clamp(24px,6.6vw,34px)!important;line-height:1.2!important;white-space:normal}.sx2-ar{width:44px;height:44px;margin-top:0;top:clamp(110px,26vw,190px)}.sx2-ar.l{left:4px}.sx2-ar.r{right:4px}}

/* v3.49 chips & CTA below the box (brainall style) */
.sx2-cd,.sx2-cd.on,.sx2-cd.near,.sx2-cd.far{background:transparent!important;border:0!important;box-shadow:none!important;flex-direction:column!important}
.sx2-cd .box{position:relative;display:flex;background:#FFFFFF;border:1px solid #E3EAF4;border-radius:20px;box-shadow:0 16px 40px rgba(11,18,32,.05);transition:box-shadow .7s;overflow:visible}
.sx2-cd .box .v{border-radius:20px 0 0 20px}
.sx2-cd.on .box{box-shadow:0 40px 90px rgba(11,18,32,.12)}
.sx2-cd .b{justify-content:center}
.sx2-cd .ft{margin-top:30px!important;padding:0 6px!important;border-top:0!important;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;transition:opacity .5s}
.sx2-cd:not(.on) .ft{opacity:0}
.sx2-cd .ch{gap:10px!important}
.sx2-cd .ch span{padding:14px 26px!important;border:0!important;border-radius:999px!important;background:#EEF1F6;font-size:clamp(15px,1.05vw,18px)!important;font-weight:600!important;color:#1F2A3D!important}
.sx2-cd.on .ch span{background:var(--t)}
.sx2-cd .go{min-height:56px!important;padding:0 30px!important;border-radius:999px;font-size:clamp(16px,1.05vw,18px)!important}
.sx2-cd .go.soon{font-size:clamp(15px,1vw,17px)!important}
.sx2-cd.on .ft>*{animation:sxIn .8s cubic-bezier(.2,.8,.2,1) .2s both}
.sx2-ar{top:calc(50% - 50px)!important}
@media (max-width:1100px){.sx2-cd .box{flex-direction:column}.sx2-cd .box .v{border-radius:20px 20px 0 0}.sx2-cd .ch span{padding:10px 18px!important}}

/* v3.50 larger type & airy layout for wide screens */
#solutions.sx{padding-block:clamp(150px,11vw,260px)!important}
.sx2-l .sx-eye{font-size:clamp(20px,1.5vw,30px)!important}
.sx2-l .sx-h{font-size:clamp(38px,3.6vw,76px)!important;margin-top:20px!important}
.sx2-lead{font-size:clamp(17px,1.3vw,26px)!important;margin-top:28px!important}
.sx2-nav{margin-top:clamp(64px,5vw,110px)!important;gap:clamp(14px,1vw,22px)!important;width:max(min(1500px,66vw),min(1400px,92vw));max-width:none;margin-inline:auto}
.sx2-it .nm{white-space:nowrap}
@media (max-width:1100px){.sx2-nav{width:auto}}
.sx2-it{padding:clamp(22px,1.6vw,34px) clamp(20px,1.4vw,30px)!important;grid-template-columns:clamp(48px,3.2vw,64px) minmax(0,1fr)!important}
.sx2-it .ic{width:clamp(48px,3.2vw,64px)!important;height:clamp(48px,3.2vw,64px)!important}
.sx2-it .ic svg{width:clamp(24px,1.5vw,30px)!important;height:clamp(24px,1.5vw,30px)!important}
.sx2-it .nm{font-size:clamp(19px,1.45vw,30px)!important}
.sx2-it .ds{font-size:clamp(14px,.95vw,19px)!important}
.sx2-r{margin-top:clamp(40px,3.2vw,70px)!important}
.sx2-cd,.sx2-r{--w:min(1500px,66vw)!important;--w2:min(1500px,66vw)!important}
.sx2-cd .box .v{min-height:clamp(400px,30vw,620px)!important}
.sx2-cd .v svg{width:min(80%,640px)!important}
.sx2-cd .b{padding:clamp(40px,3.6vw,80px)!important}
.sx2-cd .t{font-size:clamp(14px,1vw,20px)!important}
.sx2-cd h3{font-size:clamp(30px,2.8vw,60px)!important;margin-top:14px!important}
.sx2-cd p{font-size:clamp(17px,1.25vw,24px)!important;line-height:1.75!important;margin-top:22px!important}
.sx2-cd .ft{margin-top:clamp(28px,2.2vw,44px)!important}
.sx2-cd .ch span{font-size:clamp(15px,1.05vw,21px)!important;padding:clamp(12px,.9vw,18px) clamp(22px,1.6vw,32px)!important}
.sx2-cd .go{font-size:clamp(16px,1.05vw,21px)!important;min-height:clamp(54px,3.6vw,70px)!important;padding:0 clamp(26px,1.9vw,40px)!important}
.sx2-side{font-size:clamp(13px,.8vw,16px)!important}
.sx2-ar{width:clamp(56px,3.8vw,76px)!important;height:clamp(56px,3.8vw,76px)!important}
.sx2-ar svg{width:clamp(20px,1.3vw,26px)!important;height:clamp(20px,1.3vw,26px)!important}
@media (max-width:1100px){.sx2-cd,.sx2-r{--w:80vw!important;--w2:80vw!important}.sx2-cd .box .v{min-height:240px!important}.sx2-ar{width:44px!important;height:44px!important}}
@media (max-width:640px){.sx2-l .sx-h{font-size:30px!important}.sx2-cd h3{font-size:26px!important}}

/* v3.51 wider tabs, one-line desc */
html[lang="en"] .sx2-it .ds{white-space:normal!important}
.sx2-nav{width:min(2240px,94vw)!important}
@media (min-width:1200px){.sx2-it .ds{white-space:nowrap;overflow:visible!important;font-size:clamp(13px,.74vw,17px)!important}.sx2-it{gap:0 clamp(12px,.9vw,18px)!important;padding-inline:clamp(16px,1.1vw,26px)!important}}

/* v3.52 architecture section refresh */
#quantum.qx{padding-block:clamp(150px,11vw,260px)!important;background:linear-gradient(125deg,#FFFFFF 0%,#F8FAFD 50%,#EEF4FC 100%)}
.qx-in{max-width:min(1900px,92vw)!important;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)!important;gap:clamp(48px,6vw,140px)!important}
#quantum .sx-eye{font-size:clamp(18px,1.3vw,26px)!important;font-weight:800}
#quantum .sx-h{font-size:clamp(36px,3vw,64px)!important;line-height:1.25;margin-top:18px;white-space:nowrap}
.qx-pt{max-width:none!important}.qx-vis{transform:scale(1.08);transform-origin:center}
.qx-pt{margin-top:clamp(40px,3.4vw,72px)!important}
.qx-pt>div{grid-template-columns:clamp(44px,3vw,64px) minmax(0,1fr)!important;padding:clamp(24px,1.9vw,38px) 0!important;transition:background .3s}
.qx-pt>div:hover{background:linear-gradient(90deg,rgba(30,94,255,.04),transparent)}
.qx-pt b{font-size:clamp(14px,1vw,20px)!important;padding-top:6px!important}
.qx-pt h4{font-size:clamp(19px,1.45vw,30px)!important}
.qx-pt p{font-size:clamp(15px,1.1vw,21px)!important;margin-top:10px!important}
.qx-vis svg{width:100%!important;max-width:none}
.iso-lt{font-size:12px!important}.iso-ln{font-size:18px!important}.iso-ls{font-size:13.5px!important}
@media (max-width:1100px){.qx-in{grid-template-columns:1fr!important}.qx-vis{transform:none}}
@media (max-width:640px){#quantum .sx-h{white-space:normal}}
@media (max-width:760px){.h-scroll{display:none!important}.h-ctl{left:20px;right:20px!important;bottom:28px!important;justify-content:flex-end;gap:10px!important}.h-ctl .h-num{margin-right:auto!important}.h-ctl .hbtn{width:56px!important;height:56px!important;font-size:26px!important}.h-ctl .h-fab{width:108px!important;height:108px!important;margin-left:4px!important}.h-ctl .h-fab svg:not(.fab-ring){width:28px;height:28px}}
/* v3.33 header scale & align */
header.fi-hero,.hd{height:clamp(76px,4.6vw,100px)!important}
header.fi-hero>a:first-child svg,.hd .logo svg{width:clamp(120px,7.4vw,156px)!important;height:auto!important}
header.fi-hero .navbtn,.hd .navbtn{font-size:clamp(18px,1.06vw,22px)!important;padding:0 clamp(22px,1.6vw,34px)!important;gap:10px!important}
header.fi-hero .navbtn .chev,.hd .navbtn .chev{width:clamp(12px,.7vw,14px);height:clamp(12px,.7vw,14px)}
header.fi-hero .navbtn .uline,.hd .navbtn .uline{left:clamp(22px,1.6vw,34px)!important;right:clamp(22px,1.6vw,34px)!important}
header.fi-hero>nav,.hd>.nav{position:absolute;left:50%;top:0;bottom:0;transform:translateX(-50%)}
header.fi-hero>div:last-child,.hd .hd-r{gap:clamp(8px,.6vw,14px)!important}
header.fi-hero>div:last-child>a.en,.hd .hd-r .en{font-size:clamp(13px,.8vw,15.5px)!important;font-weight:600}
header.fi-hero>div:last-child>a:last-child,.hd .hd-r .btn-q{min-height:clamp(44px,2.5vw,52px)!important;padding:0 clamp(20px,1.3vw,28px)!important;font-size:clamp(14px,.86vw,16.5px)!important}

/* v3.63 솔루션 탭 6개(SafeOTP 추가) */
@media (min-width:1101px){.sx2-nav{grid-template-columns:repeat(8,minmax(0,1fr))!important}
.sx2-it{grid-template-columns:clamp(44px,2.7vw,56px) minmax(0,1fr)!important;padding-inline:clamp(14px,.95vw,22px)!important}
.sx2-it .ic{width:clamp(44px,2.7vw,56px)!important;height:clamp(44px,2.7vw,56px)!important}
.sx2-it .ic svg{width:clamp(22px,1.3vw,28px)!important;height:clamp(22px,1.3vw,28px)!important}
.sx2-it .nm{font-size:clamp(18px,1.25vw,26px)!important}
.sx2-it .ds{white-space:normal!important;word-break:keep-all;font-size:clamp(13px,.8vw,16px)!important}}
@media (min-width:1101px) and (max-width:1499px){.sx2-nav{grid-template-columns:repeat(3,minmax(0,1fr))!important}}

/* v3.66 솔루션 탭 행 중앙정렬 (컨테이너보다 넓을 때도 화면 중앙) */
@media (min-width:1101px){.sx2-nav{margin-left:calc(50% - min(2240px,94vw) / 2)!important;margin-right:0!important}}

/* v3.67 뉴스 썸네일 PRESS·날짜·키워드 일반 폰트 */
.nthumb .nt-top,.nthumb .nt-tag{font-family:Pretendard Variable,Pretendard,Pretendard,sans-serif!important;font-weight:600;letter-spacing:.06em!important;font-variant-numeric:tabular-nums}

/* v3.71 영문 줄바꿈 보정 */
html[lang="en"] .sx-h{white-space:normal!important;text-wrap:balance}

/* v3.72 Architecture 그래픽 영문 라벨 크기 */
html[lang="en"] .qx-vis .iso-ln{font-size:15px!important}html[lang="en"] .qx-vis .iso-ls{font-size:10.5px!important}

/* v3.76 Architecture 그래픽 확정(시안4) · 그래픽 영역 확대 */
@media (min-width:1101px){.qx-in{grid-template-columns:minmax(0,.82fr) minmax(0,1.38fr)!important}}

/* v3.78 솔루션 탭 7개(SafeBOX 추가) — 카드 폭 축소 */
@media (min-width:1500px){.sx2-nav{gap:clamp(10px,.7vw,16px)!important}
.sx2-it{grid-template-columns:clamp(40px,2.3vw,50px) minmax(0,1fr)!important;gap:0 clamp(10px,.7vw,14px)!important;padding:clamp(20px,1.4vw,30px) clamp(12px,.8vw,18px)!important}
.sx2-it .ic{width:clamp(40px,2.3vw,50px)!important;height:clamp(40px,2.3vw,50px)!important}
.sx2-it .ic svg{width:clamp(20px,1.15vw,25px)!important;height:clamp(20px,1.15vw,25px)!important}
.sx2-it .nm{font-size:clamp(17px,1.1vw,23px)!important}
.sx2-it .ds{font-size:clamp(12px,.66vw,14px)!important;white-space:nowrap!important;letter-spacing:-.01em}}
@media (min-width:1101px) and (max-width:1499px){.sx2-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}}

/* v3.88 QA 최종 보정 */
html body{word-break:keep-all;overflow-wrap:break-word}
@media (max-width:640px){#solutions .ch{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important}#solutions .ch span{width:auto!important;margin:0!important;flex:none!important}}

/* v4.03 메인 솔루션 카드: 박스 전체 클릭 시 상세 페이지 이동 */
.sx2-cd.on .box{cursor:pointer}
.sx2-cd.on .box h3{transition:color .2s}
.sx2-cd.on .box:hover h3{color:var(--c)}
/* v4.04 UX: 카드 그림 잘림 방지, 모바일 태그 칩 크기 */
.sx2-cd .v svg{max-height:calc(100% - 28px)}
@media (max-width:640px){.sx2-cd .ch span{padding:8px 14px!important;font-size:13.5px!important}.sx2-cd .ch{gap:8px!important}}
/* v4.05 모바일 아키텍처: 그림 대신 세로 배치 */
.qx-m{display:none}
@media (max-width:640px){
.qx-vis{display:none!important}
.qx-m{display:flex;flex-direction:column;align-items:stretch;margin-top:36px}
.qm-l{position:relative;display:flex;flex-direction:column;gap:4px;padding:20px 20px 18px;border-radius:18px;background:#FFFFFF;border:1px solid #E3E9F4;box-shadow:0 14px 34px -18px rgba(11,18,32,.18);color:#0B1220;text-decoration:none}
.qm-k{font:700 11px Pretendard Variable,sans-serif;letter-spacing:.16em;color:#1E5EFF}
.qm-l b{font:800 19px/1.3 Pretendard Variable,Pretendard,Pretendard,sans-serif;letter-spacing:-.02em}
.qm-l small{font-size:13.5px;color:#6B7A93}
.qm-ln{align-self:center;width:2px;height:28px;background:linear-gradient(#9DB4F5,#1E5EFF);position:relative}
.qm-ln:after{content:"";position:absolute;left:50%;bottom:-3px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:#1E5EFF}
.qm-g{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.qm-c{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;padding:11px 12px;border-radius:12px;background:#F6F8FC;border:1px solid #EAEFF7;color:#0B1220;text-decoration:none;transition:background .2s,border-color .2s}
.qm-c i{grid-row:span 2;width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 16%,transparent)}
.qm-c b{font:700 14px Pretendard Variable,sans-serif;letter-spacing:-.01em;font-size:14px}
.qm-c small{grid-column:2;font-size:12px;color:#6B7A93}
.qm-c:active,.qm-c:hover{background:color-mix(in srgb,var(--c) 8%,#FFFFFF);border-color:color-mix(in srgb,var(--c) 35%,#FFFFFF)}
.qm-box{background:linear-gradient(135deg,#3D74FF,#1A47CC);border:0;color:#FFFFFF;box-shadow:0 22px 40px -18px rgba(30,94,255,.65)}
.qm-box .qm-k{color:#BFD4FF}.qm-box small{color:#DCE6FF}
.qm-go{position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:20px}
}
/* v4.09 모바일 메인 다듬기: 글자·여백·컨트롤 크기 */
@media (max-width:640px){
html:not(.uxz) body:not(.uxz) #slides .slide>div:first-child{font-size:13.5px!important;line-height:1.5!important}
html:not(.uxz) body:not(.uxz) #slides .hl{font-size:clamp(24px,7.4vw,28px)!important;margin-top:12px!important;line-height:1.15!important}
html:not(.uxz) body:not(.uxz) #prevSlide,html:not(.uxz) body:not(.uxz) #nextSlide,html:not(.uxz) body:not(.uxz) #playSlide{width:40px!important;height:40px!important;font-size:18px!important}
html:not(.uxz) body:not(.uxz) #slideNum{font-size:13px!important}
html:not(.uxz) body:not(.uxz) .h-fab{width:76px!important;height:76px!important}
html:not(.uxz) body:not(.uxz) #solutions,html:not(.uxz) body:not(.uxz) #quantum{padding-top:72px!important;padding-bottom:72px!important}
html:not(.uxz) body:not(.uxz) #who{padding:72px 20px!important}
html:not(.uxz) body:not(.uxz) #news{padding:72px 0!important}
html:not(.uxz) body:not(.uxz) #solutions .sx2-l p{font-size:15px!important;line-height:1.65!important;margin-top:16px!important}
html:not(.uxz) body:not(.uxz) .sx2-nav{margin-top:32px!important}
html:not(.uxz) body:not(.uxz) .sx2-it{padding:12px 14px!important;gap:2px 10px!important}
html:not(.uxz) body:not(.uxz) .sx2-it .nm{font-size:15px!important}
html:not(.uxz) body:not(.uxz) .sx2-it .ds{font-size:12px!important}
html:not(.uxz) body:not(.uxz) .sx2-it .ic{width:34px!important;height:34px!important}
html:not(.uxz) body:not(.uxz) .sx2-cd .v{height:190px!important}
html:not(.uxz) body:not(.uxz) .sx2-cd .b{padding:22px 20px!important}
html:not(.uxz) body:not(.uxz) .sx2-cd .t{font-size:12px!important}
html:not(.uxz) body:not(.uxz) .sx2-cd h3{font-size:22px!important;margin-top:8px!important}
html:not(.uxz) body:not(.uxz) .sx2-cd .b p{font-size:14.5px!important;line-height:1.6!important;margin-top:12px!important}
html:not(.uxz) body:not(.uxz) .sx2-cd .ft{margin-top:18px!important}
html:not(.uxz) body:not(.uxz) .sx2-cd .go{height:42px!important;min-height:42px!important;padding:0 18px!important;font-size:14px!important}
html:not(.uxz) body:not(.uxz) .qx-pt h4{font-size:16px!important}
html:not(.uxz) body:not(.uxz) .qx-pt p{font-size:14px!important}
html:not(.uxz) body:not(.uxz) .who-eye{font-size:13px!important}
html:not(.uxz) body:not(.uxz) .who-h{font-size:38px!important;margin-top:14px!important}
html:not(.uxz) body:not(.uxz) .who-h .i3{font-size:21px!important;margin-top:8px!important}
html:not(.uxz) body:not(.uxz) .who-p{font-size:14.5px!important;line-height:1.7!important;margin-top:18px!important}
html:not(.uxz) body:not(.uxz) .who-grid{grid-template-columns:1fr!important;gap:10px!important;margin-top:28px!important}
html:not(.uxz) body:not(.uxz) .who-col{gap:10px!important;transform:none!important}
html:not(.uxz) body:not(.uxz) .who-grid,html:not(.uxz) body:not(.uxz) .who-col,html:not(.uxz) body:not(.uxz) .who-grid .wcard{width:100%!important;max-width:none!important}
html:not(.uxz) body:not(.uxz) .wcard{min-height:0!important;padding:16px 18px!important;display:grid!important;grid-template-columns:auto minmax(0,1fr);column-gap:14px;align-items:center}
html:not(.uxz) body:not(.uxz) .wcard .wic{grid-row:1/span 2;align-self:start;margin-top:2px}
html:not(.uxz) body:not(.uxz) .wcard .wds{grid-column:1/-1}
html:not(.uxz) body:not(.uxz) .who-col.c2{margin-top:0!important;padding-top:0!important}
html:not(.uxz) body:not(.uxz) .wcard .wic{width:28px!important;height:28px!important}
html:not(.uxz) body:not(.uxz) .wcard .wlb{margin-top:0!important;font-size:13px!important}
html:not(.uxz) body:not(.uxz) .wcard .wnum{margin-top:6px!important;gap:4px!important}
html:not(.uxz) body:not(.uxz) .wcard .wnum b{font-size:30px!important}
html:not(.uxz) body:not(.uxz) .wcard .wnum em{font-size:13px!important}
html:not(.uxz) body:not(.uxz) .wcard .wds{font-size:12.5px!important;line-height:1.55!important;margin-top:10px!important}
html:not(.uxz) body:not(.uxz) .wcard .wside{display:none!important}
html:not(.uxz) body:not(.uxz) #news .en[style*="17px"]{font-size:13px!important}
html:not(.uxz) body:not(.uxz) #news h2{font-size:32px!important;margin-top:8px!important}
html:not(.uxz) body:not(.uxz) #news h2+p{font-size:14.5px!important;margin-top:12px!important}
html:not(.uxz) body:not(.uxz) .ncard{width:240px!important;flex-basis:240px!important}
html:not(.uxz) body:not(.uxz) .ntit{font-size:15px!important;line-height:1.45!important}
html:not(.uxz) body:not(.uxz) .ncat{font-size:12px!important}
html:not(.uxz) body:not(.uxz) .nmeta{font-size:12px!important}
html:not(.uxz) body:not(.uxz) #newsPrev,html:not(.uxz) body:not(.uxz) #newsNext{width:40px!important;height:40px!important}
}
/* ===== v4.10 시안: 히어로 장면 02~04 (기존 우주 무대 위 연출) ===== */
#top .scn{opacity:0;transition:opacity 1.3s cubic-bezier(.2,.8,.2,1);pointer-events:none}
#top .scn.on{opacity:1}
#top .core,#top .beam{transition:filter 1.2s}
#top[data-scene="2"] .core,#top[data-scene="2"] .beam{filter:opacity(.12)}
#top[data-scene="3"] .beam{filter:opacity(.12)}#top[data-scene="3"] .core{filter:opacity(.38)}
#top .zoom-a,#top .zoom-b{transition:transform 2.4s cubic-bezier(.2,.8,.2,1)}
#top[data-scene="2"] .zoom-a{transform:translateY(-18px)}#top[data-scene="3"] .zoom-a{transform:translateY(-34px)}#top[data-scene="4"] .zoom-a{transform:translateY(-10px) scale(1.02)}
.sc-t1{font:600 15px var(--font-main);letter-spacing:.06em;fill:#EDE6FF}
.sc-t2{font:500 12px var(--font-main);letter-spacing:.02em;fill:#A9A3D6}
.sc-orb{font:600 18px var(--font-main);letter-spacing:.01em;fill:#F6F2FF}
#top .orb{transition:opacity .3s linear}
.wire{animation:wireFlow 1.6s linear infinite}
@keyframes wireFlow{to{stroke-dashoffset:-16}}
.sb-chip{transform-box:view-box;transform-origin:960px 660px;animation:sbFloat 6s ease-in-out infinite}
@keyframes sbFloat{50%{transform:translateY(-8px)}}
.sb-core{animation:sbGlow 3.2s ease-in-out infinite}
@keyframes sbGlow{50%{opacity:.55}}
.fn-arc{animation:wireFlow 1.2s linear infinite}
.fn-dot{animation:fnPulse 2.4s ease-in-out infinite}
@keyframes fnPulse{50%{opacity:.35}}
#top .pk{offset-rotate:0deg;opacity:0;animation:travel 3.2s cubic-bezier(.45,0,.55,1) infinite}
#scn3 .fn{opacity:0;transition:opacity .9s}
#scn3.on .fn{opacity:1}
#scn3.on .fn:nth-child(1){transition-delay:.25s}#scn3.on .fn:nth-child(2){transition-delay:.4s}#scn3.on .fn:nth-child(3){transition-delay:.55s}#scn3.on .fn:nth-child(4){transition-delay:.7s}#scn3.on .fn:nth-child(5){transition-delay:.85s}
.scan{transform-box:view-box;transform-origin:960px 560px;opacity:0;animation:scanOut 3.9s cubic-bezier(.2,.6,.3,1) infinite}
@keyframes scanOut{0%{transform:scale(.6);opacity:0}15%{opacity:.7}100%{transform:scale(5.2);opacity:0}}
#slides .slide.up.on{transform:translateY(-13vh)}
.hx-link{display:inline-flex;align-items:center;gap:10px;margin-top:30px;padding-bottom:6px;border-bottom:1px solid rgba(237,230,255,.35);font:600 clamp(14px,1vw,17px) var(--font-main);letter-spacing:.04em;color:#E3DCFF;transition:color .3s,border-color .3s}
.hx-link span{transition:transform .3s}.hx-link:hover{color:#FFFFFF;border-color:#FFFFFF}.hx-link:hover span{transform:translateX(5px)}
.hx-st{display:flex;justify-content:center;align-items:center;gap:clamp(20px,2.6vw,48px);margin-top:clamp(28px,2.6vw,44px)}
.hx-st>div{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:6.5em}
.hx-st b{font:700 clamp(30px,2.5vw,46px)/1 var(--font-main);letter-spacing:-.03em;color:#FFFFFF;font-variant-numeric:tabular-nums;text-shadow:0 0 30px rgba(185,168,255,.45)}
.hx-st small{position:absolute;opacity:0}
.hx-st>div>b+small{position:static;opacity:1;margin-top:-4px;font:600 13px var(--font-main);color:#C9BFFF}
.hx-st em{font-style:normal;font:500 clamp(12px,.85vw,14px) var(--font-main);letter-spacing:.06em;color:#A9A3D6}
.hx-st i{width:1px;height:44px;background:linear-gradient(transparent,rgba(237,230,255,.4),transparent)}
.hx-pl{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:clamp(28px,2.6vw,44px) auto 0;max-width:820px}
.hx-pl span{padding:8px 16px;border:1px solid rgba(237,230,255,.22);border-radius:999px;background:rgba(255,255,255,.04);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font:600 clamp(12px,.85vw,14px) var(--font-main);letter-spacing:.02em;color:#E3DCFF;opacity:0;transform:translateY(10px);transition:opacity .6s,transform .7s cubic-bezier(.2,.8,.2,1)}
.hx-pl span.ai{border-color:rgba(182,156,255,.7);color:#FFFFFF;background:rgba(124,99,255,.22);box-shadow:0 0 24px rgba(124,99,255,.35)}
.slide.on .hx-pl span{opacity:1;transform:none}
.slide.on .hx-pl span:nth-child(1){transition-delay:.35s}.slide.on .hx-pl span:nth-child(2){transition-delay:.42s}.slide.on .hx-pl span:nth-child(3){transition-delay:.49s}.slide.on .hx-pl span:nth-child(4){transition-delay:.56s}.slide.on .hx-pl span:nth-child(5){transition-delay:.63s}.slide.on .hx-pl span:nth-child(6){transition-delay:.7s}.slide.on .hx-pl span:nth-child(7){transition-delay:.85s}
@media (max-width:640px){
#slides .slide.up.on{transform:translateY(-16vh)}
.hx-link{margin-top:20px;font-size:13px}
.hx-st{gap:14px;margin-top:22px}.hx-st>div{min-width:0}.hx-st b{font-size:24px}.hx-st em{font-size:11px}.hx-st i{height:32px}
.hx-pl{gap:6px;margin-top:20px;padding:0 6px}.hx-pl span{padding:5px 10px;font-size:11px}
.sc-orb{font-size:17px}.sc-t1{font-size:15px}
}
.hx-st .n{display:flex;align-items:baseline;gap:3px}
.hx-st>div>b+small,.hx-st small{position:static!important;opacity:1!important;margin:0!important;font:600 clamp(13px,.95vw,16px) var(--font-main);color:#C9BFFF}
#scn3.mob .fn text:nth-of-type(1){display:none}
#scn3.mob .fn text:nth-of-type(2){font:600 21px var(--font-main);fill:#FFF1E6;letter-spacing:0;transform:translateY(-20px)}
/* v4.10b 장면별 색 변화(같은 우주 무대, 밤 보라 → 심해 블루 → 새벽 앰버) */
#top .sp0,#top .sp1,#top .sp2,#top .pl0,#top .pl1,#top .co1,#top .co2{transition:stop-color 1.8s ease}
#top .neb,#top .hz{transition:fill 1.8s ease,opacity 1.8s ease}
#top .rimA,#top .rimB,#lattice line{transition:stroke 1.8s ease}
#top .dawn{transition:opacity 1.8s ease}
#top[data-scene="2"] .sp0{stop-color:#0F3350}#top[data-scene="2"] .sp1{stop-color:#071D33}#top[data-scene="2"] .sp2{stop-color:#030C19}
#top[data-scene="2"] .pl0{stop-color:#14405F}#top[data-scene="2"] .pl1{stop-color:#0A2036}
#top[data-scene="2"] .co1{stop-color:#E6FAFF}#top[data-scene="2"] .co2{stop-color:#7FD3FF}
#top[data-scene="2"] .n1{fill:#2D74B8}#top[data-scene="2"] .n2{fill:#2A9AB4}#top[data-scene="2"] .n3{fill:#2F5FC0}
#top[data-scene="2"] .hz{fill:#3FA9E0}
#top[data-scene="2"] .rimA{stroke:#6FC0EE}#top[data-scene="2"] .rimB{stroke:#DDF6FF}
#top[data-scene="2"] #lattice line{stroke:#5FA6D2}
#top[data-scene="3"] .sp0{stop-color:#3A1E3A}#top[data-scene="3"] .sp1{stop-color:#1A0E24}#top[data-scene="3"] .sp2{stop-color:#0B0614}
#top[data-scene="3"] .pl0{stop-color:#5A2A3C}#top[data-scene="3"] .pl1{stop-color:#241226}
#top[data-scene="3"] .co1{stop-color:#FFF0E2}#top[data-scene="3"] .co2{stop-color:#FFB48A}
#top[data-scene="3"] .n1{fill:#9A3E72}#top[data-scene="3"] .n2{fill:#C26A48}#top[data-scene="3"] .n3{fill:#7A3A8E}
#top[data-scene="3"] .hz{fill:#FF9A6A;opacity:.3}
#top[data-scene="3"] .rimA{stroke:#FFB48A}#top[data-scene="3"] .rimB{stroke:#FFEBDA}
#top[data-scene="3"] #lattice line{stroke:#D2907E}
#top[data-scene="3"] .dawn{opacity:.18}
/* 02 세부 */
.orb-pill{fill:rgba(6,22,44,.55);stroke:rgba(191,239,255,.28);stroke-width:1}
.sc-orb{font:600 16px var(--font-main)!important;letter-spacing:.01em;fill:#EAF8FF!important}
.sb-tr{animation:sbTr 3.2s ease-in-out infinite}@keyframes sbTr{50%{stroke-opacity:.2}}
.sb-col{animation:beamPulse 4.5s ease-in-out infinite}
/* 03 세부 */
#scn3 .sc-t1{fill:#FFF3E8;letter-spacing:.06em;font-weight:700}#scn3 .sc-t2{fill:#E7BFA8}
.fn-ring{transform-box:fill-box;transform-origin:center;animation:fnSpin 14s linear infinite}@keyframes fnSpin{to{transform:rotate(360deg)}}
.fn-ping{transform-box:fill-box;transform-origin:center;animation:fnPing 2.8s cubic-bezier(.2,.6,.3,1) infinite}@keyframes fnPing{0%{transform:scale(1);opacity:.8}100%{transform:scale(3.2);opacity:0}}
#top[data-scene="3"] .hx-st b{text-shadow:0 0 30px rgba(255,170,120,.45)}
#top[data-scene="3"] .hx-st small{color:#FFC9A3}#top[data-scene="3"] .hx-st em{color:#E7BFA8}
#top[data-scene="2"] .hx-link{color:#D6F3FF;border-color:rgba(191,239,255,.4)}
@media (max-width:640px){.sc-orb{font-size:19px!important}}

/* v4.11 장면3: 잔잔한 네트워크 라인 */
#scn3 path.fn-arc{animation-duration:3.2s}
#scn3 .fn-pk{animation-duration:7.8s;animation-timing-function:linear}
#scn3 path:not(.fn-arc){stroke-opacity:.35}

/* v4.11 히어로 정지/재생 버튼 */
.hx-play{display:inline-grid;place-items:center}
.hx-play .hx-ic{width:42%;height:42%;fill:#FFFFFF}
.hx-play .i-play{display:none}.hx-play.is-paused .i-play{display:block}.hx-play.is-paused .i-pause{display:none}
.hx-play:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}
.hx-st .hx-en{display:none!important}html[lang="en"] .hx-st .hx-en{display:flex!important}html[lang="en"] .hx-st .hx-ko{display:none!important}
.news-track{touch-action:pan-y;user-select:none;-webkit-user-select:none}.news-track a,.news-track img{-webkit-user-drag:none}
/* v4.13 모바일 제품명 탭: 좌우 가장자리 페이드로 더 있음 표시 */
@media (max-width:640px){.sx2-nav{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);scroll-padding-inline:24px}}
/* v4.13 모바일: 카드 위 화살표 대신 스와이프 + 아래 점 표시 */
.sx2-dots{display:none}
@media (max-width:640px){.sx2-ar{display:none!important}
.sx2-dots{display:flex;justify-content:center;align-items:center;gap:4px;margin:18px auto 0}
.sx2-dots button{width:22px;height:22px;padding:0;border:0;background:transparent;display:grid;place-items:center;cursor:pointer}
.sx2-dots button::before{content:"";width:6px;height:6px;border-radius:3px;background:#D5DCE8;transition:width .3s,background .3s}
.sx2-dots button.on::before{width:20px;background:var(--c)}}
/* v4.15 웹: 제품명 탭은 어떤 가로폭에서도 한 줄 */
@media (min-width:1101px) and (max-width:1499px){
html body #sx2Nav{grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:8px!important}
html body #sx2Nav .sx2-it{grid-template-columns:1fr!important;grid-template-rows:auto auto;align-content:start;justify-items:start;gap:12px!important;padding:16px 14px!important}
html body #sx2Nav .sx2-it .ic{width:38px!important;height:38px!important;border-radius:10px}
html body #sx2Nav .sx2-it .ic svg{width:19px!important;height:19px!important}
html body #sx2Nav .sx2-it .tx{gap:4px}
html body #sx2Nav .sx2-it .nm{font-size:clamp(13px,1.08vw,16px)!important;white-space:nowrap}
html body #sx2Nav .sx2-it .ds{font-size:12px!important;line-height:1.45!important;white-space:normal!important;word-break:keep-all}
}
@media (min-width:641px) and (max-width:1100px){
html body #sx2Nav{display:flex!important;flex-direction:row!important;gap:12px!important;overflow-x:auto;scrollbar-width:none;padding:6px 4px 16px!important;width:auto!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%)}
html body #sx2Nav::-webkit-scrollbar{display:none}
html body #sx2Nav .sx2-g{display:contents!important}
html body #sx2Nav .sx2-it{flex:0 0 220px;height:auto}
html body #sx2Nav .sx2-it.on::after{display:none}
}

/* v4.22 AI 솔루션 추가(8개): 1500px 이상도 아이콘 위·이름 아래로 쌓아 한 줄 8칸 유지 */
@media (min-width:1500px){
html body #sx2Nav{gap:clamp(8px,.6vw,14px)!important}
html body #sx2Nav .sx2-it{grid-template-columns:1fr!important;grid-template-rows:auto auto;align-content:start;justify-items:start;gap:14px!important;padding:clamp(18px,1.1vw,26px) clamp(14px,.9vw,20px)!important}
html body #sx2Nav .sx2-it .tx{gap:4px}
html body #sx2Nav .sx2-it .nm{font-size:clamp(15px,.95vw,21px)!important;white-space:nowrap}
html body #sx2Nav .sx2-it .ds{white-space:normal!important;word-break:keep-all;line-height:1.45!important}}

/* v4.28 What's On: 컨테이너 폭 안에 최대 4장만 보이게(양옆 카드 잘림 노출 없음) */
@media (min-width:641px){.news-vp{overflow:hidden!important}}