/* BLACK campaign: scoped to the storefront home, within the existing 480px shell. */
.home-page {
  --home-ink: #111111;
  --home-muted: #666666;
  --home-paper: #ffffff;
  --home-accent: #111111;
  --home-line: #dddddd;
  background: #f5f5f5;
}

.home-main {
  color: var(--home-ink);
  background: var(--home-paper);
  word-break: keep-all;
  overflow-wrap: break-word;
}

.home-main figure,
.home-main dl,
.home-main dd {
  margin: 0;
}

.home-main img {
  display: block;
  width: 100%;
}

.home-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: max(10px, calc(10 * var(--unit)));
  font-weight: 550;
  line-height: 1.5;
  letter-spacing: .13em;
}

.home-kicker > span {
  color: var(--home-accent);
  font-family: Georgia, serif;
  font-size: calc(17 * var(--unit));
  font-style: italic;
  letter-spacing: 0;
}

.home-main h1,
.home-main h2 {
  font-family: 'AppleMyungjo', 'Nanum Myeongjo', 'Noto Serif KR', Georgia, serif;
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: 1.45;
}

.home-main h2 {
  margin-top: calc(22 * var(--unit));
  font-size: calc(30 * var(--unit));
}

.home-main h1 em,
.home-main h2 em {
  color: var(--home-accent);
  font-style: normal;
}

.home-description,
.home-intro {
  margin-top: calc(20 * var(--unit));
  color: var(--home-muted);
  font-size: max(13px, calc(13 * var(--unit)));
  line-height: 1.85;
  letter-spacing: -.025em;
}

.home-section {
  padding: calc(65 * var(--unit)) calc(26 * var(--unit));
}

.home-hero-copy {
  padding: calc(36 * var(--unit)) calc(26 * var(--unit)) calc(28 * var(--unit));
}

.home-hero h1 {
  margin-top: calc(18 * var(--unit));
  font-size: calc(38 * var(--unit));
  line-height: 1.32;
}

.home-hero .home-intro {
  margin-top: calc(16 * var(--unit));
}

.home-hero-media {
  position: relative;
  aspect-ratio: 1.42;
  background: #eeeeee;
}

.home-hero-media img {
  height: 100%;
  object-fit: cover;
  object-position: 55% 65%;
}

.home-image-caption {
  position: absolute;
  bottom: calc(16 * var(--unit));
  left: calc(26 * var(--unit));
  color: #fff;
  font-size: 9px;
  font-weight: 550;
  letter-spacing: .18em;
  text-shadow: 0 1px 5px #0009;
}

.home-hero-action {
  padding: calc(24 * var(--unit)) calc(26 * var(--unit)) calc(22 * var(--unit));
}

.home-product-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: calc(17 * var(--unit));
  font-size: max(13px, calc(14 * var(--unit)));
}

.home-product-line strong {
  font-weight: 600;
}

.home-product-line > span {
  color: var(--home-muted);
  font-size: max(11px, calc(11 * var(--unit)));
  white-space: nowrap;
}

.home-cta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-height: 52px;
  padding: calc(17 * var(--unit)) calc(19 * var(--unit));
  background: var(--home-ink);
  color: #fff;
  text-align: left;
  font-size: max(13px, calc(14 * var(--unit)));
  font-weight: 500;
  line-height: 1.5;
  transition: background-color .3s ease;
}

.home-cta > span {
  font-size: 21px;
  line-height: 1;
  transition: transform .3s ease;
}

.home-scroll-link {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin-top: 6px;
  color: var(--home-muted);
  font-size: 12px;
}

.home-campaign {
  background: #fff;
  scroll-margin-top: 100px;
}

.home-campaign img {
  width: 100%;
  height: auto;
}

.home-purchase {
  padding-bottom: calc(22 * var(--unit));
  background: #f5f5f5;
}

.home-purchase-heading {
  padding: calc(56 * var(--unit)) calc(26 * var(--unit)) calc(28 * var(--unit));
}

.home-purchase-image {
  height: auto;
}

.home-purchase-info {
  padding: calc(28 * var(--unit)) calc(26 * var(--unit)) calc(24 * var(--unit));
}

.home-purchase-info h3 {
  margin-top: 10px;
  font-size: calc(19 * var(--unit));
  font-weight: 500;
  line-height: 1.5;
  white-space: pre-line;
}

.home-price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
  margin-bottom: 22px;
}

.home-price del {
  color: var(--home-muted);
  font-size: 13px;
}

.home-price strong {
  font-size: calc(27 * var(--unit));
  font-weight: 550;
  letter-spacing: -.04em;
}

.home-member-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 calc(26 * var(--unit));
  padding: 18px 0 8px;
  border-top: 1px solid #dddddd;
  font-size: 11px;
  line-height: 1.6;
}

.home-member-link > span {
  color: var(--home-muted);
}

.home-member-link strong {
  font-weight: 500;
}

.home-member-link strong span {
  margin-left: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .home-cta:hover {
    background: #333333;
  }

  .home-cta:hover > span {
    transform: translate(2px, -2px);
  }

  .home-scroll-link:hover,
  .home-member-link:hover strong {
    color: var(--home-ink);
    text-decoration: underline;
    text-underline-offset: 4px;
  }
}

@media (min-width: 768px) {
  .home-page .site {
    box-shadow: 0 0 0 1px #11111108;
  }

  .home-hero-copy {
    padding-top: calc(26 * var(--unit));
    padding-bottom: calc(22 * var(--unit));
  }

  .home-hero h1 {
    font-size: calc(34 * var(--unit));
  }

  .home-hero-media {
    aspect-ratio: 1.6;
  }
}

@media (max-width: 359px) {
  .home-kicker {
    letter-spacing: .08em;
    gap: 8px;
  }


}

@media (prefers-reduced-motion: reduce) {
  html:not([data-motion="full"]) .home-cta,
  html:not([data-motion="full"]) .home-cta > span {
    transition: none;
  }
}