/* === Base Reset === */
html {
  -webkit-text-size-adjust: 100%;
  scrollbar-color: #ccc transparent;
}
body {
  background: #fff;
  font-family: 'acumin-pro', sans-serif;
  font-weight: 300;
  line-height: 1.3;
  color: #000;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  opacity: 0;
  transition: opacity 0.3s ease;
}
body.page-visible {
  opacity: 1;
}
* {
  box-sizing: border-box;
}

/* === Footer newsletter column width === */
@media (min-width: 640px) {
  footer > div > div:last-child { width: 304px; }
}

/* === Header === */
.site-header {
  background-color: #fff;
  transition: transform 0.4s cubic-bezier(.77, 0, .175, 1);
  overflow: visible;
  padding-bottom: 1vh;
}
.site-header.header-hidden {
  transform: translateY(-100%);
}


/* Mobile menu open */
.site-header.mobile-menu-open a,
.site-header.mobile-menu-open .nav-link {
  color: #000 !important;
}
.site-header.mobile-menu-open .logo-img {
  filter: none !important;
}

/* Nav curtain: black background that appears on hover */
.nav-curtain {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4vh;
  background: #000;
  opacity: 0;
  overflow: hidden;
  transition: opacity 0.05s ease, height 0.35s ease;
  pointer-events: none;
  z-index: 0;
}
.site-header.nav-hovered .nav-curtain {
  opacity: 1;
  pointer-events: auto;
  height: calc(4vh + 50px);
  transition: opacity 0.1s ease, height 0.2s ease 0.4s;
}
.site-header.nav-returning .nav-curtain {
  transition: opacity 0.1s ease 0.35s, height 0.35s ease;
}
.site-header.nav-expanded .nav-curtain {
  height: 270px;
  transition: opacity 0.1s ease, height 0.35s ease;
}
.site-header.nav-closing .nav-curtain {
  opacity: 0;
  height: 4vh;
  transition: opacity 0.1s ease 0.35s, height 0.35s ease;
}
/* B→A: height collapses, curtain stays opaque, text locked white */
.site-header.nav-shrinking .nav-curtain {
  opacity: 1;
  height: 4vh;
  pointer-events: none;
  transition: height 0.2s ease;
}
.site-header.nav-shrinking a,
.site-header.nav-shrinking .nav-link {
  color: #fff !important;
  transition: color 0s !important;
}
.site-header.nav-shrinking .logo-img {
  opacity: 0 !important;
  transition: opacity 0s !important;
}
.site-header.nav-shrinking .nav-logo-home img {
  filter: invert(1) brightness(2);
}
.site-header.nav-shrinking .nav-curtain-footer {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-4px) !important;
  pointer-events: none !important;
  transition: none !important;
}
/* Synchronized final fade: curtain opacity === nav-link color */
.site-header.nav-fading .nav-curtain {
  opacity: 0;
  height: 4vh;
  pointer-events: none;
  transition: opacity 0.2s ease;
}
.site-header.nav-fading .nav-curtain-footer {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: none !important;
}

/* Nav curtain footer: sits inside curtain, glued to its bottom edge */
.nav-curtain-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0 28px 8px;
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease;
  z-index: 1;
}
.site-header.nav-hovered .nav-curtain-footer {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition: opacity 0.15s ease 0.4s, transform 0.15s ease 0.4s;
}
.site-header.nav-closing .nav-curtain-footer {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.1s ease;
}
.site-header.nav-closing-expanded .nav-curtain-footer {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.1s ease 0.55s;
}
.nav-curtain-line {
  height: 1px;
  background: rgba(255, 255, 255, 0.2);
  margin-top: 8px;
}
.nav-curtain-return {
  display: flex;
  justify-content: flex-end;
  padding-top: 3px;
}
.nav-curtain-return a {
  color: rgba(255, 255, 255, 0.45);
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  font-size: 0.64rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  transition: color 0.15s ease;
}
.nav-curtain-return a:hover {
  color: rgba(255, 255, 255, 0.85);
}

/* Keep header-inner above the curtain */
.header-inner {
  position: relative;
  z-index: 1;
  padding-top: 6px;
}

/* Header nav hover: links + logo turn white */
.site-header.nav-hovered a,
.site-header.nav-hovered .nav-link {
  color: #fff !important;
}
.site-header.nav-hovered .logo-img {
  opacity: 0 !important;
  transition: opacity 0.1s ease !important;
}

/* Symbol logo home link */
.nav-logo-home img {
  transition: opacity 0.15s ease, filter 0.15s ease;
}
.site-header .nav-link {
  transition: color 0.2s ease, opacity 0.15s ease;
}
.nav-logo-home:hover img {
  opacity: 0.7;
}
.site-header.nav-hovered .nav-logo-home img {
  filter: invert(1) brightness(2);
}

/* Nav item wrapper */
.nav-item {
  position: relative;
}

/* Dropdown */
.nav-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  padding-top: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.nav-item.active .nav-dropdown {
  opacity: 1;
  pointer-events: auto;
}
.nav-dropdown a {
  display: block;
  color: #fff;
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  font-size: 0.64rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 4px 0;
  white-space: nowrap;
  text-decoration: none;
  transition: opacity 0.15s ease;
}
.nav-dropdown a:hover {
  opacity: 0.7;
}

/* Two-column dropdown — main col + sub-panel to the right */
.nav-dd-col {
  position: relative;
  width: 160px;
}
.nav-dd-toggle {
  display: block;
  width: 100%;
  background: none;
  border: none;
  padding: 4px 0;
  text-align: left;
  cursor: pointer;
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  font-size: 0.64rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  white-space: nowrap;
  transition: opacity 0.15s ease;
}

/* Hover on non-active toggle: dim slightly */
.nav-dd-toggle:not(.active):hover {
  opacity: 0.7;
}

/* When a category is active: dim all other items */
.nav-dd-col:has(.nav-dd-toggle.active) .nav-dd-toggle:not(.active),
.nav-dd-col:has(.nav-dd-toggle.active) > a {
  opacity: 0.7;
}
.nav-dd-toggle.active {
  opacity: 1;
}

.nav-dd-group {
  position: absolute;
  top: 0;
  left: 100%;
  padding-left: 32px;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}
.nav-dd-group.open {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}
.nav-dd-group a {
  display: block;
  color: #fff;
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  font-size: 0.64rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 4px 0;
  white-space: nowrap;
  text-decoration: none;
  transition: opacity 0.15s ease;
}
.nav-dd-group a:hover {
  opacity: 0.7;
}

.nav-dd-inactive {
  display: block;
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  font-size: 0.64rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 4px 0;
  white-space: nowrap;
  color: rgba(255,255,255,0.2);
  cursor: default;
  pointer-events: none;
}

/* === Region / Language Card === */
#rlCard {
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #000;
  padding: 28px 32px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
  min-width: 200px;
}
#rlCard.rl-visible {
  opacity: 1;
  pointer-events: auto;
}
.rl-label {
  font-family: 'acumin-pro', sans-serif;
  font-size: 0.5rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  margin-bottom: 14px;
}
.rl-option {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 1px 0;
  font-family: 'acumin-pro', sans-serif;
  font-size: 0.64rem;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  cursor: pointer;
  transition: color 0.12s ease;
}
.rl-option:hover:not(.rl-inactive) {
  color: #fff;
}
.rl-option.rl-selected {
  color: #fff;
}
.rl-option.rl-inactive {
  color: rgba(255,255,255,0.2);
  cursor: default;
  pointer-events: none;
}
.rl-divider {
  height: 1px;
  background: rgba(255,255,255,0.12);
  margin: 14px 0;
}

/* === KR nav spacing adjustments === */
body.lang-ko .nav-item:has(a[data-i18n="nav.collections"]) { margin-left: -50px !important; }
body.lang-ko .nav-item:has(a[data-i18n="nav.other"])       { margin-left: 320px !important; }

/* === Policy text justify === */
.lang-block-en p { text-align: justify; hyphens: auto; -webkit-hyphens: auto; line-height: 1.8; }
.lang-block-ko p { text-align: justify; word-break: keep-all; }

/* === Policy nav toggle === */
.policy-nav-link { border-bottom: 1px solid transparent; }
.policy-nav-link.policy-nav-active { border-bottom-color: #000; }

/* === Language content blocks === */
.lang-block-ko { display: none; }
body.lang-ko .lang-block-en { display: none; }
body.lang-ko .lang-block-ko { display: block; }


/* === Policy tables === */
.policy-table { width: 100%; border-collapse: collapse; margin: 20px 0 28px; table-layout: fixed; }
.policy-table th, .policy-table td {
  text-align: left; padding: 7px 0;
  border-bottom: 1px solid rgba(0,0,0,0.07);
  font-family: 'acumin-pro', sans-serif; font-size: 0.6rem;
  font-weight: 300; line-height: 1.6; color: #999;
  vertical-align: top;
}
.policy-table th { font-weight: 400; color: #555; letter-spacing: 0.04em; text-transform: uppercase; }
.policy-table td:not(:last-child), .policy-table th:not(:last-child) { padding-right: 20px; }
.policy-table th:last-child { width: 13%; }
body.lang-ko .policy-table th,
body.lang-ko .policy-table td { font-family: 'Pretendard Variable', 'Pretendard', sans-serif; }

/* === i18n === */
body.lang-ko { font-family: "Pretendard Variable", "Pretendard", sans-serif; font-weight: 400; }
body.lang-ko [data-i18n] { text-transform: none; }


/* === KR Legal (전자상거래법) === */
.ko-business-info { display: none; }
body.region-kr .ko-business-info { display: block; }
.ko-business-info p { color: #999; font-weight: 300; }
.ko-business-info span { color: #999; }
.ko-business-info a { color: #999; }
.ko-business-info .ko-en-text { display: block; white-space: nowrap; color: #999; }
.ko-business-info .ko-kr-text { display: none; }
body.lang-ko .ko-business-info .ko-en-text { display: none; }
body.lang-ko .ko-business-info .ko-kr-text { display: block; }
body.lang-ko footer [data-i18n-html="footer.newsletter"] { font-weight: 500 !important; color: #a5a5a5 !important; }
body.region-kr:not(.lang-ko) footer ul a { color: #a0a0a0; }
body.lang-ko footer ul a { color: #a0a0a0; }
body.lang-ko footer input[type="email"] { font-weight: 300 !important; color: #bbb !important; }
body.lang-ko footer input[type="email"]::placeholder { color: #bbb !important; opacity: 1; }
body.lang-ko footer [data-i18n="footer.subscribe"] { font-weight: 500; }


@media (min-width: 1024px) {
  body.lang-ko footer > div { transform: translateY(-3px); }
  body.lang-ko footer > div > div:nth-child(2) { gap: 70px; }
  body.lang-ko footer > div > div:last-child,
  body.region-kr footer > div > div:last-child {
    position: relative;
    min-height: 80px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  body.region-kr .ko-business-info {
    position: absolute;
    bottom: 180%;
    right: 0;
    padding-bottom: 12px;
    text-align: right;
    width: 420px;
  }
  body.region-kr:not(.lang-ko) .ko-business-info {
    bottom: 185%;
    width: max-content;
  }
}

.header-inner .nav-link { font-weight: 500; letter-spacing: 0.05em; }
footer p[data-i18n] { letter-spacing: 0.05em; }

