:root {
    --navy:#070d1e;
    --navy2:#0e1c40;
    --blue:#12398c;
    --accent:#2f6be4;
    --accent2:#5b96ff;
    --ink:#111827;
    --sub:#5b6478;
    --line:#e6e9f0;
    --bg:#f5f7fb;
    --white:#fff;
    --nav-h:86px;
    --maxw:1300px;
}
* {
    margin:0;
    padding:0;
    box-sizing:border-box;
}
html {
    scroll-behavior:smooth;
}
body {
    font-family:"Pretendard","Noto Sans KR",-apple-system,sans-serif;
    color:var(--ink);
    background:#000;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    word-break:keep-all;
    overflow-wrap:break-word;
}
a {
    text-decoration:none;
    color:inherit;
}
li {
    list-style:none;
}
img {
    max-width:100%;
    display:block;
}
.wrap {
    max-width:var(--maxw);
    margin:0 auto;
    padding:0 40px;
}
.eyebrow {
    font-size:13px;
    letter-spacing:.24em;
    font-weight:700;
    text-transform:uppercase;
}
.btn {
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-weight:600;
    font-size:15px;
    padding:15px 30px;
    border-radius:2px;
    transition:.3s;
    cursor:pointer;
}
.btn-line {
    border:1px solid rgba(255,255,255,.55);
    color:#fff;
}
.btn-line:hover {
    background:#fff;
    color:var(--navy);
}
.btn-fill {
    background:var(--accent);
    color:#fff;
}
.btn-fill:hover {
    background:#1c4fb5;
}
.btn-dark {
    border:1px solid var(--line);
    color:var(--ink);
}
.btn-dark:hover {
    background:var(--navy);
    color:#fff;
    border-color:var(--navy);
}
.btn .ar {
    transition:.3s;
}
.btn:hover .ar {
    transform:translateX(5px);
}
.line-link {
    display:inline-flex;
    align-items:center;
    gap:14px;
    font-size:14px;
    font-weight:600;
    letter-spacing:.03em;
    color:#fff;
}
.line-link::before {
    content:"";
    width:34px;
    height:1px;
    background:#fff;
    transition:.35s;
}
.line-link:hover::before {
    width:54px;
    background:var(--accent2);
}
/* ============ HEADER ============ */
header {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:100;
    height:var(--nav-h);
    transition:background .35s,box-shadow .35s;
}
header .bar {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    height:var(--nav-h);
    max-width:var(--maxw);
    margin:0 auto;
    padding:0 40px;
}
nav {
    position:absolute;
    left:50%;
    top:0;
    height:100%;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
}
.logo {
    display:flex;
    align-items:center;
    z-index:2;
}
.logo img {
    height:48px;
    width:auto;
    display:block;
    transition:transform .5s ease,filter .35s;
}
header.light .logo img {
    filter:drop-shadow(0 2px 7px rgba(0,0,0,.4));
}
.logo:hover img {
    transform:scale(1.04);
}
/* ---- GNB : glassmorphism ---- */
nav>ul {
    display:flex;
    align-items:center;
    gap:4px;
    padding:6px;
    border-radius:100px;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.20);
    -webkit-backdrop-filter:blur(16px) saturate(150%);
    backdrop-filter:blur(16px) saturate(150%);
    box-shadow:0 10px 34px rgba(5,10,28,.20),inset 0 1px 0 rgba(255,255,255,.28);
    transition:background .35s,border-color .35s,box-shadow .35s;
}
nav>ul>li {
    position:relative;
}
nav>ul>li>a {
    display:block;
    padding:13px 24px;
    border-radius:100px;
    font-size:16px;
    font-weight:600;
    line-height:1;
    transition:.28s;
}
nav>ul>li>a:hover,
nav>ul>li:hover>a {
    background:rgba(255,255,255,.20);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
/* mega dropdown : frosted glass (works on dark hero and light sections) */
.mega {
    position:absolute;
    top:calc(var(--nav-h) - 6px);
    left:50%;
    transform:translateX(-50%) translateY(12px);
    min-width:224px;
    border-radius:18px;
    padding:14px 0;
    opacity:0;
    visibility:hidden;
    transition:.3s;
    overflow:hidden;
    background:rgba(20,29,52,.55);
    border:1px solid rgba(255,255,255,.22);
    -webkit-backdrop-filter:blur(26px) saturate(170%);
    backdrop-filter:blur(26px) saturate(170%);
    box-shadow:0 30px 70px rgba(4,10,28,.42),inset 0 1px 0 rgba(255,255,255,.30);
}
nav>ul>li:hover .mega {
    opacity:1;
    visibility:visible;
    transform:translateX(-50%) translateY(0);
}
.mega a {
    display:block;
    padding:11px 26px;
    font-size:15px;
    color:rgba(255,255,255,.9);
    white-space:nowrap;
    transition:.22s;
    font-weight:500;
}
.mega a:hover {
    color:#fff;
    background:rgba(255,255,255,.14);
    padding-left:31px;
}
.mega.wide {
    min-width:470px;
    padding:20px 8px 12px;
}
.mega.wide .cat {
    font-size:11px;
    letter-spacing:.16em;
    font-weight:800;
    color:var(--accent2);
    padding:0 26px 10px;
}
.mega.wide .cols {
    display:grid;
    grid-template-columns:1fr 1fr;
}
.mega.prod {
    min-width:660px;
    padding:22px 12px 16px;
}
.mega.prod .cols3 {
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:6px;
}
.mega.prod .mcol .cat {
    font-size:11px;
    letter-spacing:.12em;
    font-weight:800;
    color:var(--accent2);
    padding:0 22px 8px;
    border-bottom:1px solid rgba(255,255,255,.12);
    margin-bottom:6px;
}
.mega.prod .mcol a {
    padding:9px 22px;
    font-size:14.5px;
}
.util {
    display:flex;
    align-items:center;
    gap:18px;
    z-index:2;
}
.lang {
    font-size:14px;
    font-weight:600;
    padding:10px 18px;
    border-radius:100px;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.20);
    -webkit-backdrop-filter:blur(16px) saturate(150%);
    backdrop-filter:blur(16px) saturate(150%);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
    transition:background .35s,border-color .35s;
}
header.solid .lang {
    background:rgba(18,32,70,.05);
    border-color:rgba(18,32,70,.10);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
.lang b {
    font-weight:800;
}
.lang span {
    opacity:.4;
    margin:0 7px;
}
.lang a {
    opacity:.7;
    transition:.2s;
}
.lang a.on {
    opacity:1;
}
.lang a:hover {
    opacity:1;
    color:var(--accent);
}
header.light {
    color:#fff;
}
header.solid {
    background:rgba(255,255,255,.82);
    -webkit-backdrop-filter:blur(16px) saturate(150%);
    backdrop-filter:blur(16px) saturate(150%);
    box-shadow:0 6px 24px rgba(15,30,70,.08);
    color:var(--ink);
}
/* adaptive glass pill on light (white) header */
header.solid nav>ul {
    background:rgba(18,32,70,.05);
    border-color:rgba(18,32,70,.10);
    box-shadow:0 6px 20px rgba(15,30,70,.06),inset 0 1px 0 rgba(255,255,255,.6);
}
header.solid nav>ul>li>a:hover,
header.solid nav>ul>li:hover>a {
    background:rgba(47,107,228,.12);
    color:var(--accent);
    box-shadow:none;
}
nav>ul>li>a:hover {
    color:#fff;
}
header::after {
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:1px;
    background:rgba(255,255,255,.14);
    transition:.3s;
}
header.solid::after {
    opacity:0;
}
/* ============ SECTION 1 · HERO ============ */
.hero {
    position:relative;
    height:100vh;
    min-height:660px;
    overflow:hidden;
    background:#000;
}
.slide {
    position:absolute;
    inset:0;
    opacity:0;
    pointer-events:none;
    transition:opacity 1.2s ease;
    background-size:cover;
    background-position:center;
    transform:scale(1.05);
}
.slide.active {
    opacity:1;
    pointer-events:auto;
    animation:kb 7s ease-out forwards;
}
@keyframes kb {
    from {
        transform:scale(1.09);
    }
    to {
        transform:scale(1.0);
    }
}
.slide::before {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(95deg,rgba(4,8,20,.86) 0%,rgba(6,11,26,.6) 40%,rgba(6,11,26,.2) 72%,rgba(6,11,26,.4) 100%);
}
.slide::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(4,8,20,.6),transparent 30%);
}
.hero-inner {
    position:relative;
    height:100%;
    max-width:var(--maxw);
    margin:0 auto;
    padding:0 40px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    z-index:3;
}
.hero-inner .eyebrow {
    color:var(--accent2);
    opacity:0;
    transform:translateY(20px);
}
.hero-inner h1 {
    color:#fff;
    font-size:clamp(36px,5vw,68px);
    font-weight:800;
    line-height:1.16;
    margin:22px 0 24px;
    letter-spacing:-.02em;
    opacity:0;
    transform:translateY(24px);
}
.hero-inner p {
    color:rgba(255,255,255,.82);
    font-size:clamp(15px,1.3vw,20px);
    max-width:600px;
    opacity:0;
    transform:translateY(24px);
}
.hero-inner .cta {
    margin-top:40px;
    display:flex;
    gap:14px;
    opacity:0;
    transform:translateY(24px);
}
.slide.active .eyebrow {
    animation:up .8s .3s forwards;
}
.slide.active h1 {
    animation:up .9s .45s forwards;
}
.slide.active p {
    animation:up .9s .62s forwards;
}
.slide.active .cta {
    animation:up .9s .78s forwards;
}
@keyframes up {
    to {
        opacity:1;
        transform:translateY(0);
    }
}
.hero-dots {
    position:absolute;
    left:50%;
    bottom:44px;
    transform:translateX(-50%);
    display:flex;
    gap:14px;
    z-index:5;
}
.hero-dots button {
    width:11px;
    height:11px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.7);
    background:transparent;
    cursor:pointer;
    transition:.3s;
    padding:0;
}
.hero-dots button.on {
    background:#fff;
    width:34px;
    border-radius:6px;
}
.hero-arrow {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:5;
    width:52px;
    height:52px;
    border:1px solid rgba(255,255,255,.3);
    background:rgba(255,255,255,.05);
    color:#fff;
    font-size:18px;
    cursor:pointer;
    transition:.3s;
    display:flex;
    align-items:center;
    justify-content:center;
}
.hero-arrow:hover {
    background:rgba(255,255,255,.18);
    border-color:#fff;
}
.hero-arrow.prev {
    left:26px;
}
.hero-arrow.next {
    right:26px;
}
.scroll-ind {
    position:absolute;
    right:44px;
    bottom:44px;
    z-index:5;
    color:rgba(255,255,255,.7);
    font-size:11px;
    letter-spacing:.2em;
    writing-mode:vertical-rl;
}
.scroll-ind span {
    display:block;
    height:46px;
    width:1px;
    background:linear-gradient(rgba(255,255,255,.7),transparent);
    margin-top:12px;
    animation:sc 1.8s infinite;
}
@keyframes sc {
    0% {
        transform:scaleY(0);
        transform-origin:top;
    }
    50% {
        transform:scaleY(1);
        transform-origin:top;
    }
    51% {
        transform-origin:bottom;
    }
    100% {
        transform:scaleY(0);
        transform-origin:bottom;
    }
}
/* reveal */
.rv {
    opacity:0;
    transform:translateY(40px);
    transition:opacity 1s,transform 1s;
}
.rv.in {
    opacity:1;
    transform:none;
}
/* ============ SECTION 2 · BUSINESS (full-bleed) ============ */
.biz {
    position:relative;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:#04070f;
    overflow:hidden;
}
.biz-bg {
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
}
.biz-bg::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(4,7,15,.82),rgba(4,7,15,.62) 40%,rgba(4,7,15,.8));
}
.biz .head {
    position:relative;
    text-align:center;
    color:#fff;
    padding:100px 0 20px;
    z-index:2;
}
.biz .head .eyebrow {
    color:var(--accent2);
}
.biz .head h2 {
    font-size:clamp(28px,3.2vw,46px);
    font-weight:800;
    margin-top:14px;
    letter-spacing:-.02em;
}
.biz-cols {
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    max-width:1500px;
    margin:0 auto;
    width:100%;
    flex:1;
    align-items:stretch;
}
.bcol {
    padding:70px clamp(28px,3.4vw,58px) 90px;
    border-left:1px solid rgba(255,255,255,.12);
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    color:#fff;
    transition:background .4s;
    position:relative;
}
.bcol:first-child {
    border-left:none;
}
.bcol:hover {
    background:rgba(47,107,228,.14);
}
.bcol .idx {
    font-size:13px;
    font-weight:700;
    letter-spacing:.2em;
    color:var(--accent2);
    margin-bottom:20px;
}
.bcol h3 {
    font-size:clamp(26px,2.4vw,36px);
    font-weight:800;
    line-height:1.2;
    margin-bottom:20px;
}
.bcol h3 small {
    display:block;
    font-size:14px;
    font-weight:600;
    letter-spacing:.14em;
    color:rgba(255,255,255,.55);
    margin-bottom:10px;
}
.bcol p {
    font-size:15.5px;
    color:rgba(255,255,255,.75);
    margin-bottom:34px;
    min-height:96px;
}
/* ============ SECTION 3 · PRODUCT ============ */
.product {
    background:#fff;
    padding:120px 0;
}
.sec-head {
    text-align:center;
    margin-bottom:60px;
}
.sec-head .eyebrow {
    color:var(--accent);
    letter-spacing:.3em;
}
.sec-head h2 {
    font-size:clamp(30px,3.4vw,50px);
    font-weight:800;
    margin-top:12px;
    letter-spacing:.02em;
}
.sec-head p {
    color:var(--sub);
    margin-top:16px;
    font-size:17px;
}
.pgrid {
    display:flex;
    flex-wrap:wrap;
    gap:28px;
    justify-content:center;
}
.pcard {
    flex:0 1 calc((100% - 56px)/3);
}
.pcard {
    display:block;
    color:inherit;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    overflow:hidden;
    transition:.4s;
    cursor:pointer;
}
.pcard .thumb {
    aspect-ratio:17/13;
    background:#fff;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    transition:.5s;
}
.pcard:hover {
    box-shadow:0 30px 60px rgba(15,35,80,.16);
    transform:translateY(-8px);
    border-color:transparent;
}
.pcard:hover .thumb {
    transform:scale(1.05);
}
.pcard .info {
    padding:24px 26px 26px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    background:linear-gradient(135deg,#eef4ff,#e3edfc);
    border-top:1px solid #e5ecf8;
    transition:background .4s;
}
.pcard:hover .info {
    background:linear-gradient(135deg,var(--accent),#1b4bb0);
}
.pcard .info .t .en {
    font-size:12px;
    font-weight:700;
    letter-spacing:.12em;
    color:var(--accent);
    transition:.35s;
}
.pcard .info .t h3 {
    font-size:20px;
    font-weight:700;
    margin-top:6px;
    color:var(--ink);
    transition:.35s;
}
.pcard .info .t p {
    font-size:13.5px;
    color:var(--sub);
    margin-top:5px;
    transition:.35s;
}
.pcard:hover .info .t .en {
    color:#c3d8ff;
}
.pcard:hover .info .t h3 {
    color:#fff;
}
.pcard:hover .info .t p {
    color:rgba(255,255,255,.9);
}
.pcard .info .go {
    width:42px;
    height:42px;
    border-radius:50%;
    border:1px solid #c7d6f1;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--accent);
    flex:0 0 auto;
    transition:.35s;
    background:rgba(255,255,255,.6);
}
.pcard:hover .info .go {
    background:#fff;
    border-color:#fff;
    color:var(--accent);
}
.product .more-wrap {
    text-align:center;
    margin-top:56px;
}
/* ============ SECTION 4 · ABOUT ============ */
.about {
    display:grid;
    grid-template-columns:1.05fr 1fr;
    min-height:100vh;
}
.about .pic {
    background-size:cover;
    background-position:center;
    position:relative;
    min-height:520px;
}
.about .pic .cap {
    position:absolute;
    left:44px;
    bottom:40px;
    color:#fff;
    z-index:2;
}
.about .pic .cap .eyebrow {
    color:var(--accent2);
}
.about .pic .cap h4 {
    font-size:22px;
    font-weight:700;
    margin-top:10px;
}
.about .panel {
    background:linear-gradient(150deg,var(--blue),#0c2a68);
    color:#fff;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:100px clamp(40px,6vw,120px);
    position:relative;
    overflow:hidden;
}
.about .panel .watermark {
    position:absolute;
    right:-14px;
    bottom:-46px;
    font-size:220px;
    font-weight:800;
    color:rgba(255,255,255,.06);
    line-height:.8;
    letter-spacing:-.04em;
}
.about .panel .eyebrow {
    color:var(--accent2);
}
.about .panel h2 {
    font-size:clamp(28px,2.8vw,42px);
    font-weight:800;
    margin:18px 0 26px;
    line-height:1.3;
    position:relative;
}
.about .panel .lead {
    color:rgba(255,255,255,.85);
    font-size:16px;
    position:relative;
    max-width:500px;
}
.about .panel .sign {
    margin-top:26px;
    font-size:15px;
    color:rgba(255,255,255,.9);
    position:relative;
}
.about .panel .sign b {
    font-size:19px;
    font-weight:700;
    display:block;
    margin-top:4px;
}
.about .panel .stats {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin-top:44px;
    position:relative;
    padding-top:34px;
    border-top:1px solid rgba(255,255,255,.16);
}
.about .panel .stats b {
    font-size:34px;
    font-weight:800;
    background:linear-gradient(120deg,#fff,#9dc0ff);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
}
.about .panel .stats span {
    display:block;
    font-size:12.5px;
    color:rgba(255,255,255,.6);
    margin-top:4px;
}
.about .panel .btn {
    margin-top:40px;
    align-self:flex-start;
    position:relative;
}
/* ============ GLOBAL band ============ */
.gband {
    background:var(--bg);
    padding:100px 0;
}
.gwrap {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:66px;
    align-items:center;
}
.gwrap .txt .eyebrow {
    color:var(--accent);
}
.gwrap .txt h2 {
    font-size:clamp(26px,2.7vw,40px);
    font-weight:800;
    margin:14px 0 20px;
    letter-spacing:-.02em;
}
.gwrap .txt p {
    color:var(--sub);
    font-size:16.5px;
    max-width:520px;
}
.partner {
    margin-top:30px;
    background:#fff;
    border:1px solid var(--line);
    border-left:3px solid var(--accent);
    border-radius:6px;
    padding:22px 26px;
}
.partner .k {
    font-size:12px;
    letter-spacing:.12em;
    font-weight:700;
    color:var(--accent);
}
.partner b {
    display:block;
    font-size:17px;
    font-weight:700;
    margin:8px 0 4px;
}
.partner span {
    font-size:14px;
    color:var(--sub);
}
.clients {
    margin-top:34px;
}
.clients .k {
    font-size:13px;
    color:var(--sub);
    font-weight:600;
    margin-bottom:14px;
}
.client-logos {
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:10px;
    max-width:560px;
}
.client-logos li {
    background:#fff;
    border:1px solid var(--line);
    border-radius:10px;
    height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:8px 10px;
}
.client-logos li img {
    max-width:100%;
    max-height:30px;
    object-fit:contain;
    display:block;
}
.mapcard {
    background:var(--navy);
    border-radius:14px;
    padding:44px;
    color:#fff;
    position:relative;
    overflow:hidden;
    min-height:400px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}
.mapcard .glow {
    position:absolute;
    width:340px;
    height:340px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(91,150,255,.4),transparent 70%);
    top:-80px;
    right:-60px;
}
.loc {
    position:relative;
    z-index:2;
    padding:18px 0;
    border-bottom:1px solid rgba(255,255,255,.12);
    display:flex;
    gap:16px;
}
.loc:last-child {
    border-bottom:none;
}
.loc .pin {
    width:36px;
    height:36px;
    border-radius:50%;
    background:rgba(91,150,255,.16);
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    color:var(--accent2);
    font-size:11px;
}
.loc .h {
    font-weight:700;
    font-size:16px;
}
.loc .d {
    font-size:13.5px;
    color:rgba(255,255,255,.6);
    margin-top:3px;
}
/* ============ CTA ============ */
.cta-band {
    background:linear-gradient(115deg,var(--navy) 0%,var(--blue) 100%);
    color:#fff;
    text-align:center;
    padding:100px 40px;
    position:relative;
    overflow:hidden;
}
.cta-band .glow {
    position:absolute;
    width:560px;
    height:560px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(91,150,255,.28),transparent 70%);
    top:-200px;
    left:50%;
    transform:translateX(-50%);
}
.cta-band h2 {
    font-size:clamp(26px,3vw,42px);
    font-weight:800;
    position:relative;
    letter-spacing:-.02em;
}
.cta-band p {
    color:rgba(255,255,255,.8);
    margin:18px 0 36px;
    font-size:17px;
    position:relative;
}
.cta-band .btn {
    position:relative;
}
/* ============ FOOTER ============ */
footer {
    background:#04070f;
    color:#9aa4bb;
    padding:70px 0 40px;
    font-size:14px;
}
.fgrid {
    display:grid;
    grid-template-columns:1.6fr 1fr 1fr 1.2fr;
    gap:40px;
    padding-bottom:44px;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.fgrid h4 {
    color:#fff;
    font-size:15px;
    font-weight:700;
    margin-bottom:18px;
}
.fgrid .flogo {
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
}
.fgrid .flogo img {
    height:44px;
    width:auto;
}
.fgrid .flogo b {
    color:#fff;
    font-size:21px;
    font-weight:800;
}
.fgrid ul li {
    margin-bottom:11px;
}
.fgrid ul li a:hover {
    color:#fff;
}
.fgrid .contact p {
    margin-bottom:9px;
    line-height:1.5;
}
.fgrid .contact b {
    color:#cdd5e8;
}
.fbot {
    padding-top:26px;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
    font-size:13px;
    color:#6b7594;
}
.fbot .badge {
    border:1px solid rgba(255,255,255,.16);
    border-radius:4px;
    padding:5px 12px;
    font-size:12px;
    letter-spacing:.05em;
}
/* ================= MOTION & INTERACTION ================= */
.cursor-glow {
    position:fixed;
    left:0;
    top:0;
    width:560px;
    height:560px;
    border-radius:50%;
    pointer-events:none;
    z-index:95;
    background:radial-gradient(circle,rgba(70,140,255,.32),rgba(70,140,255,.10) 42%,transparent 68%);
    mix-blend-mode:screen;
    opacity:0;
    transition:opacity .4s;
    will-change:transform;
}
.cursor-dot {
    position:fixed;
    left:0;
    top:0;
    width:9px;
    height:9px;
    border-radius:50%;
    pointer-events:none;
    z-index:96;
    background:#a9caff;
    box-shadow:0 0 12px 2px rgba(90,150,255,.9);
    opacity:0;
    transition:opacity .3s;
    will-change:transform;
}
@media(hover:none) {
    .cursor-glow,
.cursor-dot {
        display:none;
    }
}
.scroll-prog {
    position:fixed;
    left:0;
    top:0;
    height:3px;
    width:0;
    z-index:200;
    background:linear-gradient(90deg,var(--accent),var(--accent2));
    box-shadow:0 0 14px rgba(47,107,228,.8);
}
.hero-fx {
    position:absolute;
    inset:0;
    z-index:2;
    pointer-events:none;
    will-change:transform;
}
.hero-inner {
    will-change:transform;
    transition:transform .25s ease-out;
}
/* button shine sweep */
.btn {
    position:relative;
    overflow:hidden;
    will-change:transform;
}
.btn::after {
    content:"";
    position:absolute;
    top:0;
    left:-160%;
    width:55%;
    height:100%;
    transform:skewX(-20deg);
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);
    transition:left .6s;
    pointer-events:none;
}
.btn:hover::after {
    left:175%;
}
/* product card : spotlight + 3D tilt */
.pcard {
    transform-style:preserve-3d;
    will-change:transform;
    transition:box-shadow .4s,border-color .4s,transform .25s ease-out;
}
.pcard::after {
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:0;
    transition:opacity .35s;
    z-index:3;
    background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(47,107,228,.18),transparent 60%);
}
.pcard:hover::after {
    opacity:1;
}
/* business column spotlight */
.bcol::after {
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:0;
    transition:opacity .45s;
    background:radial-gradient(440px circle at var(--mx,50%) var(--my,50%),rgba(91,150,255,.20),transparent 55%);
}
.bcol:hover::after {
    opacity:1;
}
.bcol .line-link {
    position:relative;
    z-index:2;
}
/* staggered reveal */
.pgrid .pcard:nth-child(3n+2) {
    transition-delay:.1s;
}
.pgrid .pcard:nth-child(3n) {
    transition-delay:.2s;
}
.biz-cols .bcol:nth-child(2) {
    transition-delay:.13s;
}
.biz-cols .bcol:nth-child(3) {
    transition-delay:.26s;
}
.client-logos li {
    transition:transform .3s,box-shadow .3s,border-color .3s;
}
.client-logos li:hover {
    transform:translateY(-4px);
    border-color:var(--accent);
    box-shadow:0 8px 20px rgba(0,0,0,.08);
}
/* CTA animated gradient */
.cta-band {
    background:linear-gradient(120deg,var(--navy),var(--blue),#1b52b6,var(--navy));
    background-size:300% 300%;
    animation:ctaflow 14s ease infinite;
}
@keyframes ctaflow {
    0% {
        background-position:0% 50%;
    }
    50% {
        background-position:100% 50%;
    }
    100% {
        background-position:0% 50%;
    }
}
.cta-band .glow {
    animation:pulseC 5s ease-in-out infinite;
}
@keyframes pulseC {
    0%,
100% {
        opacity:.65;
        transform:translateX(-50%) scale(1);
    }
    50% {
        opacity:1;
        transform:translateX(-50%) scale(1.14);
    }
}
.mapcard .glow {
    animation:pulseM 6s ease-in-out infinite;
}
@keyframes pulseM {
    0%,
100% {
        opacity:.75;
        transform:scale(1);
    }
    50% {
        opacity:1;
        transform:scale(1.16);
    }
}
/* animated pins */
.loc .pin {
    animation:blink 2.4s ease-in-out infinite;
}
.loc:nth-child(2) .pin {
    animation-delay:.5s;
}
.loc:nth-child(3) .pin {
    animation-delay:1s;
}
@keyframes blink {
    0%,
100% {
        box-shadow:0 0 0 0 rgba(91,150,255,.5);
    }
    50% {
        box-shadow:0 0 0 8px rgba(91,150,255,0);
    }
}
/* logo hover spin + float accents */
.logo:hover .mark {
    animation:spinm 1.1s cubic-bezier(.4,0,.2,1);
}
@keyframes spinm {
    to {
        transform:rotate(360deg);
    }
}
.scroll-ind span {
    animation:sc 1.8s infinite;
}
/* section title underline draw */
.sec-head h2 {
    position:relative;
    display:inline-block;
}
.sec-head h2::after {
    content:"";
    position:absolute;
    left:50%;
    bottom:-14px;
    width:0;
    height:3px;
    background:var(--accent);
    transform:translateX(-50%);
    transition:width .9s .3s ease;
}
.sec-head.in h2::after {
    width:64px;
}
@media(max-width:1080px) {
    nav,
.lang .en {
        display:none;
    }
    .biz-cols {
        grid-template-columns:1fr;
    }
    .bcol {
        border-left:none;
        border-top:1px solid rgba(255,255,255,.12);
        min-height:auto;
        padding:44px 40px;
    }
    .bcol p {
        min-height:auto;
    }
    .pcard {
        flex-basis:calc((100% - 28px)/2);
    }
    .about,
.gwrap {
        grid-template-columns:1fr;
    }
    .about .pic {
        min-height:360px;
    }
}
@media(max-width:640px) {
    .wrap {
        padding:0 22px;
    }
    .pcard {
        flex-basis:100%;
    }
    .hero-arrow {
        display:none;
    }
    .about .panel .stats {
        grid-template-columns:1fr 1fr;
        gap:24px;
    }
}


/* ============================================================
   [CMS] getMenu 마크업 → MIS 메가메뉴 매핑 + 모바일 드로우 + 서브페이지 보정
   ============================================================ */
nav>ul.gnb>li>ul.ulDepth2{
  position:absolute;top:calc(var(--nav-h) - 6px);left:50%;
  transform:translateX(-50%) translateY(12px);
  min-width:230px;border-radius:18px;padding:14px 0;
  opacity:0;visibility:hidden;transition:.3s;overflow:hidden;display:block;
  background:rgba(16,25,46,.9);border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);
  box-shadow:0 30px 70px rgba(4,10,28,.42),inset 0 1px 0 rgba(255,255,255,.30);
}
nav>ul.gnb>li:hover>ul.ulDepth2{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
nav>ul.gnb>li>ul.ulDepth2>li>a{
  display:block;padding:11px 26px;font-size:15px;color:rgba(255,255,255,.9);
  white-space:nowrap;transition:.22s;font-weight:500;
}
nav>ul.gnb>li>ul.ulDepth2>li>a:hover{color:#fff;background:rgba(255,255,255,.14);padding-left:31px;}
/* 제품소개(9개) 드롭다운 2컬럼 */
nav>ul.gnb>li:nth-child(2)>ul.ulDepth2{min-width:430px;padding:16px 10px;}
nav>ul.gnb>li:nth-child(2)>ul.ulDepth2>li{display:inline-block;width:calc(50% - 6px);vertical-align:top;}

/* 모바일 햇버거 버튼 + 드로우 */
.menu-btn{display:none;margin-left:auto;width:44px;height:44px;border:0;background:transparent;cursor:pointer;color:#fff;align-items:center;justify-content:center;z-index:5;}
header.solid .menu-btn{color:var(--ink);}
.menu-btn svg{width:26px;height:26px;}
.m-overlay{position:fixed;inset:0;background:rgba(4,8,20,.55);z-index:299;opacity:0;visibility:hidden;transition:.35s;}
.m-overlay.open{opacity:1;visibility:visible;}
.m-drawer{position:fixed;top:0;right:0;bottom:0;width:min(84vw,340px);background:#0a1226;color:#fff;z-index:300;transform:translateX(100%);transition:transform .35s;overflow-y:auto;padding:80px 0 40px;box-shadow:-20px 0 60px rgba(0,0,0,.4);}
.m-drawer.open{transform:none;}
.m-close{position:absolute;top:20px;right:18px;width:42px;height:42px;border:0;background:transparent;color:#fff;font-size:28px;line-height:1;cursor:pointer;}
.m-nav ul.ulDepth1>li.menuDepth1{border-bottom:1px solid rgba(255,255,255,.08);}
.m-nav .menuDepth1>a{display:block;padding:16px 26px;font-size:16px;font-weight:700;color:#fff;}
.m-nav ul.ulDepth2{max-height:0;overflow:hidden;transition:max-height .32s;background:rgba(255,255,255,.03);}
.m-nav .menuDepth1.open>ul.ulDepth2{max-height:640px;}
.m-nav ul.ulDepth2>li>a{display:block;padding:12px 34px;font-size:14.5px;color:rgba(255,255,255,.72);}
.m-nav ul.ulDepth2>li>a:hover{color:#fff;}

/* [CMS] 서브페이지 탭메뉴(subnav) 센터 정렬 */
.subnav .wrap{justify-content:center!important;overflow:visible!important;}


/* [CMS] 제품 메가메뉴 3카테고리 그룹 */
nav>ul.gnb>li>ul.ulDepth2.prod-mega{min-width:760px;left:50%;transform:translateX(-50%) translateY(12px);padding:20px 12px 14px;}
nav>ul.gnb>li:hover>ul.ulDepth2.prod-mega{transform:translateX(-50%) translateY(0);}
.ulDepth2.prod-mega .mega3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;}
.ulDepth2.prod-mega .mcol{min-width:0;}
.ulDepth2.prod-mega .mcol .cat{font-size:11px;letter-spacing:.1em;font-weight:800;color:var(--accent2);padding:0 18px 8px;border-bottom:1px solid rgba(255,255,255,.16);margin-bottom:6px;white-space:nowrap;}
.ulDepth2.prod-mega .mcol a{display:block;padding:9px 18px;font-size:14px;color:rgba(255,255,255,.9);white-space:nowrap;transition:.2s;}
.ulDepth2.prod-mega .mcol a:hover{color:#fff;background:rgba(255,255,255,.14);}

@media(max-width:760px){.client-logos{grid-template-columns:repeat(3,1fr);max-width:none}.client-logos li{height:46px}.client-logos li img{max-height:26px}}