
:root{
  --bg:#ffffff;
  --ink:#0b1220;
  --muted:#5b667a;
  --line:#e8edf5;
  --blue:#0b5fff;
  --blue2:#0aa2ff;
  --card:#ffffff;
  --shadow:0 10px 30px rgba(12,28,64,.08);
  --radius:18px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
}
a{color:inherit}
.site-header{position:sticky; top:0; background:rgba(255,255,255,.92); backdrop-filter:saturate(180%) blur(10px); border-bottom:1px solid var(--line); z-index:50}
/* 핵심: 좌측 여백 없이 로고를 크게 */
.topbar{display:flex; align-items:center; justify-content:space-between; gap:20px; padding:10px 20px 10px 0}
.brand{display:flex; align-items:center; gap:14px}
.logo-wrap{display:block; padding-left:0; margin-left:0}
.logo{display:block; height:78px; width:auto; object-fit:contain}
.brand-meta{display:flex; flex-direction:column}
.brand-title{font-weight:700; font-size:14px; color:var(--muted); letter-spacing:.02em}
.brand-sub{font-weight:1000; font-size:22px; line-height:1.1}
.contact-mini{display:flex; gap:18px; font-size:13px; color:var(--muted)}
.contact-mini .k{font-weight:800; margin-right:8px; color:#23314a}
.nav{
  display:flex; align-items:center; gap:18px;
  padding:10px 20px 14px 0;
  border-top:1px solid var(--line);
}
.nav a{
  text-decoration:none;
  font-weight:800;
  padding:10px 8px;
  border-radius:12px;
  color:#23314a;
}
.nav a:hover{background:#f2f6ff}
.nav a.active{background:#eaf2ff; color:#0035b7}
.container{max-width:78%; margin:0 auto; padding:0 20px}
.hero{
  position:relative;
  background: url('/assets/hero.jpg');
  background-size:cover;
  background-position:center;
  border-bottom:1px solid var(--line);
}
.hero:before{
  content:'';
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(7,16,35,.72) 0%, rgba(7,16,35,.52) 45%, rgba(7,16,35,.18) 100%);
}
.hero-inner{position:relative; padding:84px 0 66px}

.hero-kicker{font-weight:900; color:#0b3cbd; letter-spacing:.02em}
.hero-title{font-weight:1000; font-size:52px; line-height:1.08; margin:10px 0 12px}
.hero-sub{max-width:720px; color:var(--muted); font-weight:650}
.hero-cta{margin-top:22px; display:flex; gap:12px; flex-wrap:wrap}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 16px; border-radius:14px;
  text-decoration:none; font-weight:900;
}
.btn.primary{background:linear-gradient(120deg, var(--blue), var(--blue2)); color:#fff; box-shadow:var(--shadow); border:none}
.btn.ghost{border:1px solid var(--line); background:#fff}
.section{padding:46px 0}
.section h2{font-size:34px; margin:0 0 10px; letter-spacing:-.02em}
.section .lead{color:var(--muted); font-weight:650; margin:0 0 22px}
.cards{display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:18px}
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:18px;
  box-shadow: 0 10px 30px rgba(12,28,64,.08);
}
.card h3{margin:0 0 8px; font-size:18px}
.badge{display:inline-flex; gap:8px; align-items:center; font-weight:900; font-size:12px; color:#0b3cbd; background:#eaf2ff; padding:6px 10px; border-radius:999px; margin-bottom:10px}
.split{display:grid; grid-template-columns: 1.2fr .8fr; gap:20px; align-items:start}
@media (max-width: 860px){ .split{grid-template-columns:1fr} .hero-title{font-size:40px} .contact-mini{display:none} }
.list{margin:10px 0 0; padding-left:18px; color:var(--muted); font-weight:650}
.hr{height:1px; background:var(--line); margin:24px 0}
.form{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.form .full{grid-column:1/-1}
input, select, textarea{
  width:100%; padding:12px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  font-size:14px;
}
textarea{min-height:120px; resize:vertical}
.small{font-size:12px; color:var(--muted)}
.site-footer{border-top:1px solid var(--line); margin-top:30px}
.footer-inner{max-width:78%; margin:0 auto; padding:26px 20px; display:grid; gap:18px}
.foot-brand{display:flex; align-items:center; gap:14px}
.foot-logo{height:40px; width:auto}
.foot-grid{display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:12px}
.foot-h{font-weight:900; color:#23314a}
.muted{color:var(--muted); font-weight:650}


/* Premium hero text contrast */
.hero .hero-kicker{color: rgba(255,255,255,.92)}
.hero .hero-title{color: #fff}
.hero .hero-sub{color: rgba(255,255,255,.84)}
.nav a.active{background: rgba(234,242,255,.9)}


/* Responsive full width */
@media (max-width: 860px){
  .container{padding:0 20px}
  .footer-inner{padding:26px 20px}
  .topbar{padding-right:20px}
  .nav{padding-right:20px}
}


/* Premium width cap */
@media (min-width: 1500px){
  .container{max-width:1280px}
  .footer-inner{max-width:1280px}
}



/* ===== International Premium Upgrade ===== */
:root{
  --ink:#0a1020;
  --muted:#667085;
  --line:#e6ebf2;
  --blue:#1b5cff;
  --blue2:#31b5ff;
  --card:#ffffff;
  --radius:18px;
  --shadow:0 16px 48px rgba(9,20,55,.10);
  --shadow2:0 6px 18px rgba(9,20,55,.08);
}

/* Improve typography + rendering */
body{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: -0.01em;
}

/* Header refinement */
.site-header{
  background: rgba(255,255,255,.86);
  backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid rgba(230,235,242,.9);
}
.brand-sub{font-weight: 900; letter-spacing:-.02em}
.brand-title{font-weight: 700; color: rgba(102,112,133,.95)}
.nav a{font-weight: 800; color: rgba(18,28,52,.92)}
.nav a:hover{background: rgba(27,92,255,.08)}
.nav a.active{background: rgba(27,92,255,.12); color: #0a3dff}

/* Hero overlay + spacing */
.hero:before{
  background: linear-gradient(90deg,
    rgba(7,14,28,.78) 0%,
    rgba(7,14,28,.58) 42%,
    rgba(7,14,28,.18) 100%);
}
.hero-inner{padding: 96px 0 78px}
.hero-kicker{font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; opacity:.92}
.hero-title{font-weight: 950; letter-spacing:-.03em}
.hero-sub{font-weight: 600; max-width: 760px}

/* Buttons */
.btn{border-radius: 999px; padding: 12px 18px}
.btn.primary{box-shadow: var(--shadow2)}
.btn.ghost{border: 1px solid rgba(255,255,255,.24); background: rgba(255,255,255,.10); color:#fff}
.hero .btn.ghost:hover{background: rgba(255,255,255,.16)}

/* Sections */
.section{padding: 56px 0}
.section h2{font-size: 36px; letter-spacing:-.03em}
.section .lead{font-weight: 600; color: rgba(102,112,133,.95)}

/* Cards */
.cards{gap: 20px}
.card{
  border: 1px solid rgba(230,235,242,.95);
  box-shadow: var(--shadow2);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow);
  border-color: rgba(27,92,255,.18);
}
.badge{
  background: rgba(27,92,255,.10);
  color: rgba(27,92,255,.95);
  font-weight: 900;
}

/* Improve split layout on wide screens */
@media (min-width: 1100px){
  .split{grid-template-columns: 1.35fr .65fr}
}

/* Footer polish */
.site-footer{
  background: linear-gradient(180deg, rgba(248,250,252,.7) 0%, rgba(255,255,255,1) 100%);
}
.foot-h{letter-spacing:-.01em}
.muted{color: rgba(102,112,133,.98)}
/* ===== End Upgrade ===== */


/* Language switch (KR/EN) */
.lang-switch{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: rgba(102,112,133,.95);
}
.lang-switch .sep{opacity:.55}
.lang-switch .lang-on{color: rgba(18,28,52,.92)}
.lang-switch .lang-switch .lang-link:hover{color: rgba(27,92,255,.95)}


/* Footer one-line layout */
.footer-inner{
  max-width:90%;
  margin:0 auto;
}

.footer-grid{
  display:flex;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:center;
  gap:40px;
}

.footer-grid > div{
  white-space:nowrap;
}

/* responsive */
@media (max-width:900px){
  .footer-grid{
    flex-wrap:wrap;
    gap:16px;
  }
}



/* ===== Enterprise Polish ===== */
/* Header: slimmer, more international */
.nav{
  padding-top: 6px;
  padding-bottom: 10px;
  gap: 14px;
}
.nav a{
  padding: 8px 8px;
  font-weight: 750;
  font-size: 13px;
  letter-spacing: .02em;
}
.topbar{
  padding-top: 8px;
  padding-bottom: 8px;
}
.logo{height: 66px}
.brand-sub{font-size:20px}
/* Hero: more breathing room */
.hero-inner{padding: 110px 0 92px}
.hero-title{font-size:56px}
.hero-sub{font-size:16px}
/* Section rhythm */
.section{padding: 64px 0}
/* Cards: stronger premium hover */
.card{
  box-shadow: 0 10px 26px rgba(9,20,55,.08);
  border-color: rgba(230,235,242,.95);
}
.card:hover{
  transform: translateY(-4px);
  box-shadow: 0 22px 60px rgba(9,20,55,.14);
  border-color: rgba(27,92,255,.22);
}
/* Services grid: feel wider & balanced */
.cards{gap: 22px}
/* Footer: force one-line on desktop */
.foot-grid, .footer-grid{
  display:flex;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:flex-start;
  gap: 56px;
}
.foot-grid > div, .footer-grid > div{white-space:nowrap}
/* Make address stay one line by allowing more width */
.foot-grid > div:nth-child(3), .footer-grid > div:nth-child(3){flex:1}
/* Make overall footer area a bit wider on desktop */
.footer-inner{max-width:94%}
@media (max-width: 1100px){
  .container{max-width:92%}
  .footer-inner{max-width:92%}
}
@media (max-width: 900px){
  .foot-grid, .footer-grid{flex-wrap:wrap; gap:16px}
  .foot-grid > div:nth-child(3), .footer-grid > div:nth-child(3){flex:auto}
  .hero-title{font-size:42px}
  .hero-inner{padding:84px 0 66px}
}
/* ===== End Enterprise Polish ===== */

.hero + .section{padding-top:72px}



/* Service cards: keep bullet lines on a single line */
.card .list li{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Slightly wider service cards on desktop for cleaner one-line bullets */
@media (min-width: 900px){
  .cards{
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  }
}



/* Hero title one-line helper */
.hero-title.one-line{white-space:nowrap}

/* Service badges with icons */
.badge .ico{margin-right:8px}

/* Network map card */
.map-card{
  padding:0;
  overflow:hidden;
}
.map-card img{
  width:100%;
  height:auto;
  display:block;
}
.map-meta{
  padding:18px;
}
.map-meta h3{margin:0 0 6px; font-size:18px}
.map-meta p{margin:0; color:rgba(102,112,133,.98); font-weight:600}



/* ===== Service Section Upgrade ===== */
.badge .ico{
  margin-right:8px;
  display:inline-flex;
  align-items:center;
}
/* Make service cards feel more premium */
.card h3{letter-spacing:-.02em}
.card .muted{line-height:1.5}
/* Service cards: slightly bigger radius & header spacing */
.card{border-radius:18px}
/* ===== End Service Section Upgrade ===== */

/* Coverage cards: comfortable min width */
@media (min-width: 900px){
  .cards{grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));}
}



/* Coverage section: force 3 + 3 layout on desktop */
.section .cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}

@media (max-width:900px){
  .section .cards{
    grid-template-columns:repeat(2,1fr);
  }
}

@media (max-width:600px){
  .section .cards{
    grid-template-columns:1fr;
  }
}



/* ===== Hero Slider ===== */
.hero{
  transition: background-image .6s ease-in-out;
}
.hero.fade{
  animation: heroFade .8s ease both;
}
@keyframes heroFade{
  from{filter:saturate(.98) brightness(.98)}
  to{filter:saturate(1) brightness(1)}
}
/* ===== Partners / Networks ===== */
.partners{
  margin-top: 22px;
}
.partner-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.partner-pill{
  border:1px solid rgba(230,235,242,.95);
  background: rgba(255,255,255,.78);
  padding:10px 14px;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: .02em;
  color: rgba(18,28,52,.88);
  box-shadow: 0 10px 26px rgba(9,20,55,.06);
}
.partner-pill small{
  font-weight:700;
  color: rgba(102,112,133,.95);
  margin-left:6px;
}



/* Interactive network map */
.network-map-wrap{
  border:1px solid rgba(230,235,242,.95);
  border-radius:24px;
  overflow:hidden;
  background:#eef3fb;
  box-shadow:0 14px 40px rgba(9,20,55,.08);
}
.network-map{width:100%;height:520px}
.network-map-note{padding:16px 20px 20px}
.network-map-note h3{margin:0 0 8px;font-size:28px;letter-spacing:-.02em}
.network-map-note p{margin:0;color:rgba(102,112,133,.95);font-weight:600}
.network-legend{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.network-chip{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
  background:#fff;border:1px solid rgba(230,235,242,.95);box-shadow:0 8px 18px rgba(9,20,55,.05);
  font-weight:800;color:#122034
}
.network-dot{width:10px;height:10px;border-radius:50%;background:#1b5cff}
