@charset "UTF-8";
:root {
  --baseUnit: 0.75rem;
  --gutter: 2.25rem;
  --xs: 375px;
  --sm: 480px;
  --md: 992px;
  --lg: 1180px;
  --xl: 1920px;
  /* ── 듀오톤 아이콘 3색 (녹색, 로고 충실) — duotone-icon.html 이 읽는다 ──
     밝은 녹색(본체) → 짙은 녹색(뱃지) → 더 짙은 녹색(교집합·앵커)의 명도 램프.
     흰 캔버스에서 밝은 녹색만으론 대비가 빠듯하므로(≈1.9:1) 가장 어두운
     교집합 톤이 그래픽 대비(≥3:1)를 담당한다. 상세: DESIGN.md "Duotone Icon System".
     엔터프라이즈(/solutions/enterprise/)는 mesh 팔레트를 쓰므로 자기 스코프에서
     이 --zz-duo-* 를 mesh 값으로 덮어쓴다(_common.scss). */
  --zz-duo-bg: #60d084; /* 밝은 녹색 — 본체(가장 넓음)        대비 ~1.9:1 */
  --zz-duo-fg: #4aa570; /* 짙은 녹색(#4aa570) — 뱃지(중간) 대비 ~3.0:1 */
  --zz-duo-x: rgb(58.2092050209, 129.7907949791, 88.10041841); /* 더 짙은 녹색 — 교집합·앵커  대비 ~4:1+ */
  /* 경고(warning) 듀오톤 — 개념(녹색)과 시맨틱을 가르는 앰버 2톤.
     alert-triangle·file-warning 전용. 밝은 앰버(본체) + 짙은 앰버(느낌표).
     뱃지는 체크가 아니라 느낌표. 짙은 앰버가 그래픽 대비를 담당한다. */
  --zz-duo-warn-bg: #fcd34d; /* 밝은 앰버 — 본체 */
  --zz-duo-warn-x: #b45309; /* 짙은 앰버 — 느낌표 (밝은 본체 위 강한 대비) */
}

/* 다크 섹션(네비·CTA 등) 위에서는 밝은 녹색이 지배하도록 반전.
   셀렉터는 코드베이스 다크 표준(_color.scss / dark-theme-mixins)과 정렬한다. */
.zz-bg-black,
.zz-bg-black-dim,
.zz-bg-dark {
  --zz-duo-bg: #8fe3ab;
  --zz-duo-fg: #60d084;
  --zz-duo-x: #c9f5da;
  /* 경고 앰버 — 다크 섹션에서도 본체가 지배하고 느낌표가 읽히도록 유지 */
  --zz-duo-warn-bg: #fbbf24;
  --zz-duo-warn-x: #7c2d12;
}

.mship {
  position: relative;
  background-color: #070b0a;
  color: #eaf1ec;
  word-break: keep-all;
}
.mship :is(h1, h2, h3, h4, h5) {
  color: inherit;
}
.mship a {
  color: inherit;
  text-decoration: none;
}
.mship :where(section) {
  padding: 0;
}
.mship-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding-inline: 4.005rem;
}
@media (max-width: 1180px) {
  .mship-wrap {
    padding-inline: 1.6275rem;
  }
}
.mship-head {
  padding: 3.5025rem 0 1.5rem;
}
.mship-eyebrow {
  display: block;
  font-size: 0.813rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #c6b8f5;
  margin-bottom: 1.0005rem;
}
.mship-title {
  font-size: 2.25rem;
  font-weight: 600;
  letter-spacing: -0.015em;
  margin: 0 0 0.8775rem;
}
.mship-lede {
  font-size: 0.969rem;
  line-height: 1.75;
  color: #8e9c94;
  max-width: 36em;
  margin: 0;
}
.mship-featured {
  position: relative;
  padding-block: 3.5025rem 4.755rem;
}
.mship-featured__stage {
  position: relative;
  overflow: visible;
  padding-block: 2.505rem;
}
.mship-featured__grid {
  position: absolute;
  inset: -12%;
  z-index: 0;
  background-image: linear-gradient(rgba(169, 210, 184, 0.14) 1px, transparent 1px), linear-gradient(90deg, rgba(169, 210, 184, 0.14) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(ellipse 74% 84% at 50% 50%, #000, transparent 78%);
}
.mship-featured__light {
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  filter: blur(64px);
  mix-blend-mode: screen;
}
.mship-featured__light--a {
  top: -46%;
  left: -14%;
  width: 62%;
  height: 220%;
  background: radial-gradient(ellipse at 50% 50%, rgba(96, 209, 132, 0.36), rgba(96, 209, 132, 0) 66%);
}
.mship-featured__light--b {
  top: -40%;
  right: -16%;
  width: 56%;
  height: 210%;
  background: radial-gradient(ellipse at 50% 50%, rgba(124, 92, 224, 0.32), rgba(124, 92, 224, 0) 66%);
}
.mship-featured__stage::before {
  content: "";
  position: absolute;
  inset: -14px -10px -10px -14px;
  z-index: 0;
  border-radius: calc(1.005rem + 10px);
  background: linear-gradient(160deg, rgba(96, 209, 132, 0.07), rgba(124, 92, 224, 0.07));
  filter: blur(6px);
}
.mship-featured__glass {
  position: relative;
  z-index: 1;
  isolation: isolate;
  border: 1px solid rgba(214, 238, 226, 0.16);
  border-radius: 1.005rem;
  overflow: hidden;
  box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, 0.46), inset 0 -1.5px 0 rgba(255, 255, 255, 0.09), inset 1.5px 0 0 rgba(96, 209, 132, 0.2), inset -1.5px 0 0 rgba(150, 120, 255, 0.2), 0 26px 54px -26px rgba(0, 0, 0, 0.8);
}
.mship-featured__frost {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(176deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.028) 46%, rgba(169, 210, 184, 0.045));
  backdrop-filter: blur(16px) saturate(185%) brightness(1.06);
}
.mship-featured__sheen {
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(118deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 26%, rgba(255, 255, 255, 0) 70%, rgba(255, 255, 255, 0.07) 100%);
}
.mship-featured__in {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: 1fr 0.82fr;
  gap: 3.255rem;
  align-items: center;
  padding: 3.255rem;
}
@media (max-width: 992px) {
  .mship-featured__in {
    grid-template-columns: 1fr;
    padding: 2.0025rem;
  }
}
.mship-featured__img {
  aspect-ratio: 16/11;
  border-radius: 0.50025rem;
  overflow: hidden;
  position: relative;
}
.mship-featured__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.mship-featured__vol {
  display: block;
  font-size: 0.782rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #c6b8f5;
  margin-bottom: 1.0005rem;
}
.mship-featured__title {
  font-size: 1.813rem;
  font-weight: 600;
  line-height: 1.4;
  margin: 0 0 1.0005rem;
}
.mship-featured__desc {
  font-size: 0.938rem;
  line-height: 1.75;
  color: #8e9c94;
  margin: 0 0 1.3755rem;
}
.mship-featured__meta {
  font-size: 0.782rem;
  color: #5e6c65;
  margin-bottom: 1.3755rem;
}
.mship-featured__link {
  display: inline-flex;
  align-items: center;
  padding: 0.813rem 1.5rem;
  border-radius: 0.2505rem;
  background-color: #60d184;
  color: #06120c;
  font-size: 0.875rem;
  font-weight: 600;
}
.mship-sec {
  padding: 3.5025rem 0;
  border-bottom: 1px solid rgba(169, 210, 184, 0.075);
}
.mship-sec__head {
  margin-bottom: 1.875rem;
}
.mship-sec__title {
  font-size: 1.438rem;
  font-weight: 600;
  margin: 0;
}
.mship-hl-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.0025rem;
}
@media (max-width: 992px) {
  .mship-hl-grid {
    grid-template-columns: 1fr;
  }
}
.mship-hl {
  display: block;
}
.mship-hl__img {
  aspect-ratio: 4/3;
  border-radius: 0.375rem;
  overflow: hidden;
  margin-bottom: 1.0005rem;
}
.mship-hl__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.mship-hl__fmt {
  font-size: 0.719rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #7cbc95;
}
.mship-hl__title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0.50025rem 0;
  line-height: 1.5;
}
.mship-hl__desc {
  font-size: 0.844rem;
  line-height: 1.7;
  color: #5e6c65;
  margin: 0;
}
.mship-series__row {
  display: flex;
  align-items: baseline;
  gap: 1.25025rem;
  padding: 1.0005rem 0;
  border-top: 1px solid rgba(169, 210, 184, 0.075);
  font-size: 0.938rem;
}
.mship-series__row:first-child {
  border-top: none;
}
.mship-series__vol {
  width: 64px;
  flex: none;
  font-size: 0.782rem;
  color: #5e6c65;
  font-variant-numeric: tabular-nums;
}
.mship-series__title {
  flex: 1;
  color: #eaf1ec;
}
.mship-series__fmt {
  font-size: 0.75rem;
  color: #7cbc95;
  width: 64px;
  flex: none;
}
.mship-series__date {
  font-size: 0.782rem;
  color: #5e6c65;
  width: 90px;
  flex: none;
  text-align: right;
}
.mship-formats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.mship-formats__chip {
  font-size: 0.844rem;
  color: #8e9c94;
  border: 1px solid rgba(169, 210, 184, 0.15);
  border-radius: 20px;
  padding: 0.42525rem 0.8775rem;
}
.mship-access {
  padding: 2.505rem 0 4.755rem;
  text-align: center;
}
.mship-access p {
  font-size: 0.907rem;
  color: #5e6c65;
  margin: 0;
}

/*# sourceMappingURL=page-resource-membership.css.map */