/* DM LITE — 사업분야 상세(d-*) 공통 스타일 */
:root{--bg:#0f1213;--bg2:#181b1c;--ink:#eef1ef;--dim:#9aa1a0;--faint:#646b6a;--line:rgba(255,255,255,.13);--line2:rgba(255,255,255,.07);--acc:#3dcd58;--acclt:#86e29a;--cell:#181b1c;--cellh:#1f2324;--cta:#181b1c;--mono:ui-monospace,"SFMono-Regular",Menlo,monospace;--maxw:1400px;--pad:clamp(20px,4vw,60px)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{font-family:Pretendard,-apple-system,system-ui,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
a{color:inherit;text-decoration:none}img{display:block;width:100%;height:100%;object-fit:cover}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.rv{opacity:0;transform:translateY(30px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.rv.in{opacity:1;transform:none}.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
/* NAV */
.nav{position:fixed;inset:0 0 auto 0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:18px var(--pad);background:rgba(15,18,19,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line2)}
.brand{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:.04em}
.brandlogo{height:48px;width:auto;display:inline-block;vertical-align:middle;filter:var(--logo-filter)}
.gnb{display:flex;gap:26px;flex-wrap:wrap}
.gnb a{font-size:12.5px;letter-spacing:.04em;font-weight:500;color:var(--ink);opacity:.7;transition:opacity .25s}
.gnb a:hover{opacity:1;color:var(--acc)}.gnb a.active{opacity:1;color:var(--acc)}
.back{font-size:12.5px;color:var(--dim);border:1px solid var(--line);padding:10px 18px;border-radius:999px;cursor:pointer;background:none;font:inherit;transition:.25s}
.back:hover{border-color:var(--acc);color:var(--ink)}
@media(max-width:1024px){.gnb{display:none}}
/* HERO — editorial, light, oversized type */
.hero{min-height:92svh;display:flex;flex-direction:column;justify-content:flex-end;padding:150px var(--pad) clamp(48px,7vh,96px);max-width:var(--maxw);margin:0 auto}
.hero .en{font-family:var(--mono);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--acc)}
.hero h1{font-size:clamp(3.2rem,12vw,11rem);font-weight:800;letter-spacing:-.045em;line-height:.92;margin-top:20px}
.hero h1 em{font-style:normal;color:var(--acc)}
.hero .sub{margin-top:34px;display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:26px}
.hero .tag{font-size:clamp(1.05rem,1.6vw,1.4rem);color:var(--dim);max-width:42ch;font-weight:500;line-height:1.5}
.hero .hmeta{font-family:var(--mono);font-size:13px;color:var(--faint);text-align:right;line-height:1.9}
.herofig{position:relative;width:100%;aspect-ratio:21/8;border-radius:14px;overflow:hidden;background:var(--bg2);margin-top:8px}
.herofig img{transition:transform 1.4s cubic-bezier(.16,1,.3,1)}.herofig:hover img{transform:scale(1.04)}
/* SECTION */
.sec{padding:clamp(72px,10vh,140px) 0}.np{padding-top:0}
.lbl{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.sec h2{font-size:clamp(2.2rem,6vw,4.6rem);font-weight:800;letter-spacing:-.035em;line-height:1;margin-top:14px}
/* OVERVIEW — magazine asymmetric two-column */
.ovwrap{margin-top:46px;display:grid;grid-template-columns:0.85fr 1.15fr;gap:clamp(30px,5vw,80px);align-items:start}
.ovwrap .ovlead{font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:700;letter-spacing:-.02em;line-height:1.28}
.ovwrap .ovlead em{font-style:normal;color:var(--acc)}
.ov{font-size:clamp(1.02rem,1.4vw,1.2rem);line-height:1.9;color:var(--dim);font-weight:450}
@media(max-width:860px){.ovwrap{grid-template-columns:1fr;gap:22px}}
/* WHAT WE DO — sgrid cards */
.sgrid{margin-top:44px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.scell{background:var(--cell);padding:34px 28px;transition:background .3s}.scell:hover{background:var(--cellh)}
.scell .sn{font-family:var(--mono);font-size:13px;color:var(--acc)}
.scell h4{font-size:18px;font-weight:700;margin-top:16px;letter-spacing:-.01em;line-height:1.3}
.scell p{font-size:13.5px;color:var(--dim);margin-top:10px;line-height:1.6}
/* EDITORIAL ROWS — big alternating magazine rows */
.wlist{margin-top:64px;border-top:1px solid var(--line)}
.wrow{display:grid;grid-template-columns:300px 1fr;gap:clamp(28px,4vw,64px);align-items:center;padding:clamp(34px,5vh,58px) 4px;border-bottom:1px solid var(--line);transition:padding .35s}
.wrow:hover{padding-left:18px}
.wrow:nth-child(even){grid-template-columns:1fr 300px}.wrow:nth-child(even) .wthumb{order:2}
.wthumb{width:100%;aspect-ratio:5/4;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--bg2)}
.wthumb img{transition:transform 1s cubic-bezier(.16,1,.3,1)}.wrow:hover .wthumb img{transform:scale(1.06)}
.wtxt .wk{font-family:var(--mono);font-size:13px;letter-spacing:.1em;color:var(--acc)}
.wtxt h4{font-size:clamp(1.5rem,3vw,2.4rem);font-weight:700;letter-spacing:-.025em;margin-top:12px;line-height:1.05}
.wtxt p{font-size:clamp(.95rem,1.3vw,1.1rem);color:var(--dim);line-height:1.9;margin-top:18px;max-width:60ch}
@media(max-width:760px){.wrow,.wrow:nth-child(even){grid-template-columns:1fr;gap:18px}.wrow:nth-child(even) .wthumb{order:0}.wthumb{aspect-ratio:16/9}}
/* PROJECTS gallery */
.pgrid{margin-top:46px;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px)}
.pcard{position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.pcard img{transition:transform 1.1s cubic-bezier(.16,1,.3,1)}.pcard:hover img{transform:scale(1.05)}
.pcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,4,8,.85),transparent 55%)}
.pm{position:absolute;left:0;bottom:0;padding:22px;z-index:2;color:#fff}.pm h4{font-size:18px;font-weight:700;letter-spacing:-.01em}.pm span{font-size:12.5px;color:rgba(255,255,255,.75);display:block;margin-top:5px}
/* CTA — oversized editorial */
.cta{background:var(--cta);border-top:1px solid var(--line)}
.cta h2{font-size:clamp(2.6rem,7vw,6rem);font-weight:800;letter-spacing:-.04em;line-height:1}
.cta h2 em{font-style:normal;color:var(--acc)}
.cbtn{display:inline-flex;align-items:center;gap:10px;margin-top:34px;padding:18px 34px;border-radius:999px;font-weight:600;font-size:15px;background:var(--acc);color:var(--acc-ink);transition:.25s}
.cbtn:hover{background:var(--acclt);transform:translateY(-2px)}
.other{margin-top:42px;display:flex;gap:10px;flex-wrap:wrap}
.other a{font-size:13px;border:1px solid var(--line);border-radius:999px;padding:10px 18px;color:var(--dim);transition:.25s}.other a:hover{border-color:var(--acc);color:var(--ink)}
/* FOOTER */
.site-foot{border-top:1px solid var(--line);background:var(--bg);padding:56px var(--pad) 36px}
.ft-in{max-width:var(--maxw);margin:0 auto}.ft-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.ft-brand{font-weight:800;letter-spacing:.06em;display:flex;align-items:center;gap:9px;font-size:18px;flex-wrap:wrap;max-width:330px;color:var(--ink)}
.ft-brand .brandlogo{height:40px;filter:var(--logo-filter);opacity:1}
.ft-brand p{flex-basis:100%;font-weight:400;font-size:13px;color:var(--dim);line-height:1.8;margin-top:12px;letter-spacing:0}
.ft-nav{display:flex;gap:12px 24px;flex-wrap:wrap;align-content:flex-start;max-width:560px}
.ft-nav a{font-size:13px;color:var(--dim);letter-spacing:.05em;transition:color .2s}.ft-nav a:hover{color:var(--acc)}
.ft-info{margin-top:34px;display:flex;gap:28px;flex-wrap:wrap;font-family:var(--mono);font-size:12.5px;color:var(--dim)}.ft-info b{color:var(--ink);font-weight:500}
.ft-bottom{margin-top:28px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--faint);font-size:12px}
@media(max-width:760px){.ft-top{flex-direction:column;gap:24px}}
@media(max-width:900px){.sgrid{grid-template-columns:1fr 1fr}.pgrid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.sgrid{grid-template-columns:1fr}.pgrid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}.rv{transition:none}}
html,body,h1,h2,h3,h4,p,span,a,div,li,small,button,label{word-break:keep-all;overflow-wrap:break-word}
.ft-home{display:inline-flex;line-height:0;cursor:pointer}

.bizbar{margin-top:116px;background:var(--bg);position:sticky;top:108px;z-index:50}
.bizbar-in{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(6,1fr);background:linear-gradient(90deg,transparent 0%,var(--bg2) 7%,var(--bg2) 93%,transparent 100%)}
.bizbar a{position:relative;display:flex;flex-direction:column;gap:7px;padding:15px clamp(12px,1.4vw,22px);border-left:1px solid var(--line2);color:var(--dim);transition:background .25s,color .25s}
.bizbar a:first-child{border-left:0}
.bizbar a small{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--faint);transition:color .25s}
.bizbar a b{font-size:13.5px;font-weight:600;letter-spacing:-.01em;line-height:1.3}
.bizbar a:hover{background:var(--cellh);color:var(--ink)}
.bizbar a:hover small{color:var(--acc)}
.bizbar a.current{background:rgba(var(--acc-rgb),.12);color:var(--ink)}
.bizbar a.current small{color:var(--acc)}
.bizbar a.current::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--acc)}
.bizbar + .hero{min-height:auto;padding-top:clamp(34px,5vh,66px);padding-bottom:clamp(48px,8vh,110px)}
@media(max-width:880px){.bizbar-in{grid-template-columns:repeat(3,1fr)}.bizbar a:nth-child(n+4){border-top:1px solid var(--line2)}.bizbar a:nth-child(3n+1){border-left:0}}
@media(max-width:520px){.bizbar-in{grid-template-columns:repeat(2,1fr)}.bizbar a:nth-child(2n+1){border-left:0}}

/* === GNB: 랜딩과 동일한 2단 헤더로 통일 (override) === */
.nav{position:fixed;inset:0 0 auto 0;z-index:60;display:block;padding:0;background:var(--nav-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line2)}
.gnb,.back{display:none!important}
.nav-utility{border-bottom:1px solid var(--line2);background:var(--nav-util-bg)}
.nav-utility-in{max-width:1320px;margin:0 auto;padding:0 clamp(20px,5vw,64px);height:34px;display:flex;align-items:center;justify-content:flex-end;gap:8px}
.nav-utility .lang{display:inline-flex;align-items:center;gap:2px;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em}
.nav-utility .lang button{font:inherit;background:none;border:0;cursor:pointer;color:var(--faint);padding:2px 5px;border-radius:3px;transition:.2s}
.nav-utility .lang button:hover{color:var(--ink)}
.nav-utility .lang button.on{color:var(--acc)}
.nav-utility .lang .sep{color:var(--faint);opacity:.5}
.nav-utility .util-link{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;letter-spacing:.06em;color:var(--dim);padding:2px 4px 2px 14px;transition:.2s;border-left:1px solid var(--line2);margin-left:6px}
.nav-utility .util-link:hover{color:var(--acc)}
.nav-utility .util-link::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--acc)}
.nav-main{max-width:1320px;margin:0 auto;padding:14px clamp(20px,5vw,64px);display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-main .brand{display:flex;align-items:center}
.nav-main .brandlogo{height:45px;width:auto;filter:var(--logo-filter)}
.menu{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.menu a{font-size:12.5px;letter-spacing:.08em;color:var(--ink);opacity:.78;font-weight:700;transition:.25s}
.menu a:hover,.menu a.active{opacity:1;color:var(--acc)}
.nav-cta{font-size:12.5px;font-weight:700;background:var(--acc);color:var(--acc-ink);padding:10px 18px;border-radius:4px;transition:.25s;white-space:nowrap}
.nav-cta:hover{background:var(--acc-d)}
.nav-main .burger{display:none}
@media(max-width:1024px){.menu,.nav-cta{display:none}}