*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#ffffff;
  --bg1:#fafafa;
  --bg2:#f5f5f5;
  --bg3:#0f0f0f;
  --text:#111111;
  --text-w:#eeeeee;
  --sub:#777777;
  --line:#e0e0e0;
  --accent:#00b9b5;
}

html{
  scroll-behavior:smooth;
  font-size:clamp(14px,1.2vw,16px);
}

body{
  font-family:'Pretendard Variable',Pretendard,-apple-system,sans-serif;
  background:var(--bg);
  color:var(--text);
  font-size:1rem;
  line-height:1.7;
  word-break: keep-all;
  -webkit-font-smoothing:antialiased;
}

/* NAV */
nav{
  position:fixed;top:0;left:0;right:0;z-index:99;
  height:3.5rem;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 2.5rem;
  background:rgba(255,255,255,0.9);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.logo{
  font-size:1rem;
  font-weight:600;
  letter-spacing:-.01em;
  color:var(--text);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.625rem;
  text-decoration:none;
}
.logo img{width:auto;height:2rem}
.nav-links{display:flex;gap:1.5rem}
.nav-links a{font-size:0.8125rem;color:var(--sub);text-decoration:none;transition:color .15s}
.nav-links a:hover{color:var(--text)}
.nav-cta{
  font-size:0.75rem;font-weight:500;
  padding:0.4375rem 1rem;
  border:1px solid var(--text);
  border-radius:2px;
  text-decoration:none;
  transition:all .15s;
  background:var(--bg3);
  color:var(--bg);
}
.nav-cta:hover{background:var(--text);color:var(--accent)}

/* style.css에 추가 */
.nav-lang {
  font-size: 0.75rem;
  font-weight: 500;
  padding: 0.4375rem 1rem;
  border: 1px solid var(--line);
  border-radius: 2px;
  color: var(--text);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all .15s;
  background: var(--bg);
}
.nav-lang:hover {
  border-color: var(--text);
  background: var(--bg2);
}

/* COMMON */
.wrap{max-width:1080px;margin:0 auto;padding:0 2.5rem}
.label{
  font-size:0.6875rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:0.75rem;
}
h2{font-size:clamp(1.75rem,3.5vw,2.75rem);font-weight:600;line-height:1.15;letter-spacing:-.02em;margin-bottom:1rem}
.lead{font-size:1rem;color:var(--sub);line-height:1.8;max-width:37.5rem}
.divider{height:1px;background:var(--line)}
section{padding:6rem 0}

.accent{
  color: var(--accent);
}

/* HERO */
.hero{
  min-height:100vh;
  display:grid;place-items:center;
  padding-top:3.5rem;
  background:var(--bg3);
}
.hero-inner{
  max-width:1080px;
  width:100%;
  padding:0 2.5rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:3.75rem;
}
.hero-logo{display:flex;justify-content:center;align-items:center}
.hero-kicker{font-size:0.75rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#888;margin-bottom:2.5rem}
.hero-h1{
  font-size:clamp(3rem,6vw,5.5rem);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-.03em;
  color:#fff;
  margin-bottom:2rem;
}
.hero-h1 span{color:#00b9b5}
.hero-desc{font-size:1rem;color:#888;line-height:1.8;max-width:32.5rem;margin-bottom:4rem}
.hero-nums{display:flex;gap:4rem;padding-top:2.5rem;border-top:1px solid #222}
.hero-n{font-size:2.25rem;font-weight:700;color:#fff;letter-spacing:-.02em;margin-bottom:0.25rem}
.hero-nl{font-size:0.6875rem;color:#888;letter-spacing:.04em}

/* ABOUT */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.about-quote{
  font-size:1.375rem;font-weight:500;line-height:1.5;
  letter-spacing:-.01em;color:var(--text);
  margin-bottom:2rem;
  padding-bottom:2rem;
  border-bottom:1px solid var(--line);
}
.about-pills{display:flex;flex-wrap:wrap;gap:0.375rem;margin-top:1.5rem}
.pill{
  font-size:0.75rem;padding:0.3125rem 0.75rem;
  border:1px solid var(--line);
  border-radius:2px;color:var(--sub);
  text-decoration:none;
}
.pill:hover{background:rgba(0,185,181,0.1)}
.about-body p{font-size:0.875rem;color:var(--sub);line-height:1.9;margin-bottom:1rem}
.about-body p:last-child{margin-bottom:0}
.about-body strong{color:var(--text);font-weight:500}

/* MARKET */
.market{background:var(--bg3);padding:6rem 0}
.market .label{color:#666}
.market h2{color:#fff}
.market .lead{color:#777}
.news-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#222;border:1px solid #222;margin:3rem 0}
.nc{background:var(--bg3);padding:2rem 1.75rem}
.nc-src{font-size:0.6875rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#666;margin-bottom:0.875rem}
.nc-head{font-size:1.125rem;font-weight:600;color:#fff;line-height:1.3;margin-bottom:0.625rem;letter-spacing:-.01em}
.nc-body{font-size:0.8125rem;color:#888;line-height:1.75}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#222;border:1px solid #222}
.sb{background:var(--bg3);padding:2rem 1.75rem}
.sb-n{font-size:2.5rem;font-weight:700;color:#fff;letter-spacing:-.02em;line-height:1;margin-bottom:0.5rem}
.sb-n sup{font-size:1.25rem;color:#888}
.sb-l{font-size:0.75rem;color:#888;line-height:1.6}
.shift{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#222;border:1px solid #222;margin-top:3rem}
.sh-before,.sh-after{padding:2.25rem 2rem}
.sh-before{background:var(--bg3)}
.sh-after{background:#1a1a1a}
.sh-label{font-size:0.6875rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1.25rem}
.sh-before .sh-label{color:#666}
.sh-after .sh-label{color:#999}
.sh-item{display:flex;gap:0.625rem;margin-bottom:0.75rem;align-items:flex-start}
.sh-dot{width:4px;height:4px;border-radius:50%;background:#555;flex-shrink:0;margin-top:0.5rem}
.sh-after .sh-dot{background:#777}
.sh-item p{font-size:0.8125rem;color:#888;line-height:1.7}
.sh-after .sh-item p{color:#999}
.src-note{font-size:0.6875rem;color:#666;margin-top:1rem;line-height:1.7}

/* EXPORT */
.biz-header{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:end;margin-bottom:3.5rem}
.biz-num{font-size:4.5rem;font-weight:700;color:var(--line);letter-spacing:-.04em;line-height:1}
.cards-2{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.card{background:var(--bg);padding:2rem 1.75rem}
.card-t{
  font-size:1.125rem;
  font-weight:400;
  color:var(--text);
  margin-bottom:0.5rem;
  letter-spacing:-.01em;
}
.card-b{font-size:0.9375rem;color:var(--text);line-height:1.75}
.card-b.dark{color:var(--text-w)}
.card.dark{background:var(--text)}
.card.dark .card-t{color:#fff}
.card.dark .card-b{color:#aaa}
.card.gray{background:#444444}
.card.gray .card-t{color:var(--accent);font-weight:600}

/* CARD NUMBER */
.card-n{
  font-size:1.75rem;
  font-weight:700;
  letter-spacing:-.02em;
  margin-bottom:0.5rem;
  color:var(--text);
}

/* COUNTRIES */
.country-wrap{background:var(--bg2);padding:4rem 0}
.country-label-sm{font-size:0.6875rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--sub);margin-bottom:1.5rem}
.chips{display:flex;flex-wrap:wrap;gap:0.375rem}
.chip{
  font-size:0.75rem;padding:0.3125rem 0.75rem;
  background:#fff;border:1px solid var(--line);border-radius:2px;color:var(--text);
  transition:background .15s,border-color .15s,color .15s;
  cursor:default;
}
.chip:hover{background:var(--bg3);color:#fff;border-color:var(--bg3)}
.chip.total{background:#111;color:#fff;font-weight:600}
.chip.etc{background:var(--bg3);color:#fff}
.chip.etc:hover{background:var(--bg3);color:var(--accent)}
.chip .fi{margin-right:0.2rem}
.note{font-size:0.6875rem;color:var(--sub);margin-top:1rem;line-height:1.7}

/* RETAIL */
.retail-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.brand-logo-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0.75rem;
  margin-bottom:2rem;
}
.brand-logo-item{
  aspect-ratio:2/1;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:8px;
  padding:0.75rem 1rem;
}
.brand-logo-item img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  filter:grayscale(1);
  opacity:0.6;
  transition:all .2s;
}
.brand-logo-item:hover img{filter:grayscale(0);opacity:1}

/* COMPARE TABLE */
.compare-table{
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  text-align:center;
}
.ct-row{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  border-bottom:1px solid var(--line);
}
.ct-row:last-child{border-bottom:none}
.ct-cell{
  padding:0.875rem 1.25rem;
  font-size:0.875rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
.ct-row .ct-cell:first-child{justify-content:flex-start;text-align:left}
.ct-head .ct-cell{
  font-weight:600;
  font-size:0.75rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--sub);
  background:var(--bg2);
}
.ct-cell.accent{color:var(--text);font-weight:600;background:rgba(0,185,181,0.06)}
.ct-cell.muted{color:var(--sub)}
.ct-head .ct-cell.accent{background:rgba(0,185,181,0.1)}

/* RC */
.rc{background:var(--bg);padding:2.25rem 1.75rem}
.rc-region{
  font-size:0.6875rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--sub);
  margin-bottom:0.875rem;
}
.rc-logos{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:3rem 1rem;
  align-items:center;
  margin-bottom:2.5rem;
}
.rc-logos img{
  max-height:2rem;
  max-width:80%;
  width:auto;
  object-fit:contain;
  display:block;
  margin:0 auto;
  opacity:0.85;
}
.rc-names{
  font-size:0.875rem;
  color:var(--text);
  line-height:1.9;
  opacity:0.8;
  word-spacing:2px;
  word-break:keep-all;
}

/* EXPORT MAP */
.export-map-wrap{background:none;border:none;padding:0}
.export-map-svg-wrap{
  position:relative;
  width:100%;
  line-height:0;
  margin-bottom:2rem;
}
.world-svg{
  width:100%;
  height:auto;
  display:block;
  opacity:0.9;
  aspect-ratio:2/1;
}
.pin-layer{position:absolute;top:0;left:0;width:100%;height:100%}
.pd{fill:#00b9b5}
.pr{fill:#00b9b5;opacity:0;transform-box:fill-box;transform-origin:center}
.export-map-label{
  font-size:0.6875rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--sub);
  text-align:right;
  margin-top:0.75rem;
}

/* DOMESTIC */
.domestic-header{margin-bottom:2.5rem}
.domestic-lead{
  font-size:1rem;
  color:var(--sub);
  line-height:1.85;
  margin-bottom:1.25rem;
  max-width:35rem;
}
.domestic-points{display:flex;flex-direction:column;gap:0.5rem}
.domestic-point{
  font-size:1rem;
  color:var(--text);
  padding-left:0.875rem;
  position:relative;
}
.domestic-point::before{content:'·';position:absolute;left:0;color:var(--accent)}
.domestic-logos{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.domestic-logo-item{
  background:var(--bg);
  padding:1.5rem 1.25rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
.domestic-logo-item img{
  max-height:1.75rem;
  max-width:80%;
  width:auto;
  object-fit:contain;
  opacity:0.8;
}
.domestic-logo-text{
  font-size:0.75rem;
  color:var(--sub);
  letter-spacing:.04em;
  background-color:var(--bg1);
}

/* PROCESS */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line)}
.ps{padding:1.75rem 1.5rem;border-right:1px solid var(--line)}
.ps:last-child{border-right:none}
.ps-n{font-size:3rem;font-weight:700;color:var(--line);line-height:1;margin-bottom:1rem;letter-spacing:-.03em}
.ps-t{font-size:0.8125rem;font-weight:600;color:var(--text);margin-bottom:0.375rem}
.ps-b{font-size:0.75rem;color:var(--sub);line-height:1.7}
.ps:nth-child(1){background:#ffffff}
.ps:nth-child(2){background:#f5fafa}
.ps:nth-child(3){background:#eaf4f3}
.ps:nth-child(4){background:#daeeed}
.ps:nth-child(1) .ps-n{color:#e0e0e0}
.ps:nth-child(2) .ps-n{color:#b0d8d6}
.ps:nth-child(3) .ps-n{color:#7ec4c1}
.ps:nth-child(4) .ps-n{color:#00b9b5}

/* BRAND SLIDER */
.brand-slider-wrap{overflow:hidden;width:100%;position:relative}
.brand-slider-wrap::before,
.brand-slider-wrap::after{content:'';position:absolute;top:0;bottom:0;width:80px;z-index:2}
.brand-slider-wrap::before{left:0;background:linear-gradient(to right,var(--bg),transparent)}
.brand-slider-wrap::after{right:0;background:linear-gradient(to left,var(--bg),transparent)}
.brand-slider{display:flex;gap:1.5rem;animation:slide 30s linear infinite;width:max-content}
.brand-slider:hover{animation-play-state:paused}
.brand-slide{
  flex-shrink:0;
  width:7.5rem;height:3.5rem;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:8px;
  padding:0.5rem 1rem;
}
.brand-slide img{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1);opacity:0.6;transition:all .2s}
.brand-slide:hover img{filter:grayscale(0);opacity:1}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* BRAND SECTION */
.brand-section{background:var(--bg2);padding:6rem 0}

.brand-main{
  display:grid;grid-template-columns:1fr 1fr;
  gap:0;border:1px solid var(--line);
  margin-top:3.5rem;background:var(--bg);
}
.brand-main-image{
  position:relative;overflow:hidden;
  min-height:42rem;background:var(--bg3);
}
.brand-main-image img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;display:block;
  transition:transform .6s ease;
}
.brand-main:hover .brand-main-image img{transform:scale(1.02)}
.brand-main-image-placeholder{
  width:100%;height:100%;min-height:35rem;
  background:var(--bg3);
  display:flex;align-items:center;justify-content:center;
  color:#333;font-size:0.75rem;letter-spacing:.08em;text-transform:uppercase;
}
.brand-main-content{
  padding:2.5rem 3rem;
  display:flex;flex-direction:column;
  justify-content:space-between;gap:2rem;
}
.brand-main-kicker{
  font-size:0.6875rem;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--sub);margin-bottom:1.25rem;
}
.brand-main-name{
  font-size:clamp(1.75rem,3vw,2.5rem);font-weight:700;
  letter-spacing:-.03em;line-height:1.1;color:var(--text);margin-bottom:0.625rem;
}
.brand-main-tagline{
  font-size:0.875rem;color:var(--accent);
  font-weight:500;letter-spacing:-.01em;margin-bottom:1.5rem;
}
.brand-main-desc{font-size:0.8125rem;color:var(--sub);line-height:1.9;max-width:25rem}
.brand-main-stats{
  display:flex;gap:0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:1.5rem 0;
}
.brand-main-stat{flex:1;padding-right:1.5rem;min-width:0}
.brand-main-stat+.brand-main-stat{padding-left:1.5rem;border-left:1px solid var(--line)}
.brand-main-stat-n{
  font-size:1.25rem;font-weight:700;letter-spacing:-.03em;
  color:var(--text);line-height:1;margin-bottom:0.3125rem;white-space:nowrap;
}
.brand-main-stat-l{font-size:0.6875rem;color:var(--sub);letter-spacing:.02em;line-height:1.5}
.brand-main-chips{display:flex;flex-wrap:wrap;gap:0.375rem;margin-bottom:1.5rem}
.brand-main-cta{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-size:0.75rem;font-weight:500;color:var(--text);
  text-decoration:none;letter-spacing:.02em;
  border-bottom:1px solid var(--text);padding-bottom:0.125rem;
  transition:color .15s,border-color .15s;
}
.brand-main-cta:hover{color:var(--accent);border-color:var(--accent)}
.brand-main-cta svg{transition:transform .15s}
.brand-main-cta:hover svg{transform:translateX(3px)}

.brand-sub-list{
  display:flex;flex-direction:column;
  gap:2rem;border-top:none;margin-top:2rem;
}
.brand-sub{
  display:grid;grid-template-columns:1fr 1fr;
  gap:0;background:var(--bg);
  min-height:17.5rem;border:1px solid var(--line);
}
.brand-sub:nth-child(odd){direction:rtl}
.brand-sub:nth-child(odd)>*{direction:ltr;text-align:left}
.brand-sub-image{
  position:relative;overflow:hidden;
  min-height:17.5rem;background:var(--bg3);
}
.brand-sub-image img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;display:block;
  transition:transform .6s ease;
}
.brand-sub:hover .brand-sub-image img{transform:scale(1.02)}
.brand-sub-image-placeholder{
  width:100%;height:100%;min-height:17.5rem;
  background:var(--bg2);
  display:flex;align-items:center;justify-content:center;
  color:#ccc;font-size:0.6875rem;letter-spacing:.08em;text-transform:uppercase;
}
.brand-sub-content{
  padding:2rem 2.5rem;
  display:flex;flex-direction:column;justify-content:center;gap:1rem;
}
.brand-sub-kicker{font-size:0.625rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--sub)}
.brand-sub-name{font-size:clamp(1.25rem,2vw,1.75rem);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--text)}
.brand-sub-tagline{font-size:0.8125rem;color:var(--accent);font-weight:500}
.brand-sub-desc{font-size:0.8125rem;color:var(--sub);line-height:1.85}
.brand-sub-chips{display:flex;flex-wrap:wrap;gap:0.375rem}

/* ROADMAP */
.roadmap{margin-top:3rem}
.rs{display:grid;grid-template-columns:5rem 1fr;gap:2rem;padding:1.75rem 0;border-bottom:1px solid var(--line);align-items:start}
.rs:last-child{border-bottom:none}
.rs-n{font-size:0.6875rem;font-weight:600;letter-spacing:.06em;color:var(--sub);padding-top:3px}
.rs-t{font-size:1rem;font-weight:600;color:var(--text);margin-bottom:0.375rem;letter-spacing:-.01em}
.rs-b{font-size:0.8125rem;color:var(--sub);line-height:1.75}
.rs-tags{display:flex;gap:0.375rem;flex-wrap:wrap;margin-top:0.625rem}
.rs-tag{font-size:0.6875rem;padding:0.1875rem 0.625rem;border:1px solid var(--line);border-radius:2px;color:var(--sub)}

/* CTA */
.cta-section{background:var(--bg3);padding:7.5rem 0;text-align:center}
.cta-section h2{color:#fff;margin-bottom:1.25rem}
.cta-section .lead{color:#777;margin:0 auto 3rem}
.cta-btns{display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap}
.btn-primary{
  font-size:0.8125rem;font-weight:500;
  padding:0.75rem 1.75rem;
  background:#fff;color:var(--bg3);
  border:1px solid #fff;border-radius:2px;
  text-decoration:none;transition:all .15s;
}
.btn-primary:hover{
  background:var(--accent);color:#000;
  border:1px solid #000000;
}
.btn-outline{
  font-size:0.8125rem;font-weight:400;
  padding:0.75rem 1.75rem;
  background:transparent;color:#888;
  border:1px solid #444;border-radius:2px;
  text-decoration:none;transition:all .15s;
}
.btn-outline:hover{border-color:#777;color:#bbb}
.sources{
  margin-top:4rem;padding-top:2.5rem;
  border-top:1px solid #222;
  font-size:0.6875rem;color:#666;line-height:1.9;
  text-align:left;
  max-width:640px;margin-left:auto;margin-right:auto;
}

/* FOOTER */
footer{background:var(--bg3);border-top:1px solid #1a1a1a;padding:3.5rem 0 2.5rem}
.footer-grid {
  grid-template-columns: 2fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
  display: grid;
}
.fc-title{font-size:0.6875rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#666;margin-bottom:0.875rem}
.fc p{font-size:0.8125rem;color:#666;line-height:1.8;margin-bottom:0.25rem}
.footer-bottom{border-top:1px solid #1a1a1a;padding-top:1.5rem;display:flex;justify-content:space-between;font-size:0.6875rem;color:#555}
.footer-logo-text{font-size:1rem;font-weight:700;color:#fff;margin-bottom:2.25rem;letter-spacing:-.01em}
.fc-link {
  color: #555;
  text-decoration: none;
  transition: color .15s;
}
.fc-link:hover { color: var(--accent); }
