/* =================== hc-hero-slider.css =================== */
.hc-hero-slider {position: relative; min-height: min(620px, 72vh); overflow: hidden; background: var(--hc-ink); color: var(--hc-paper, #ffffff)}
.hc-hero-slider__track {position: relative; height: 100%; min-height: inherit}
.hc-hero-slider__nav {position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(10px); border-radius: 50%; color: var(--hc-paper, #ffffff); cursor: pointer; transition: background var(--hc-dur-fast), transform var(--hc-dur-fast)}
.hc-hero-slider__nav:hover {background: rgba(255,255,255,.22); transform: translateY(-50%) scale(1.06)}
.hc-hero-slider__nav--prev {left: var(--hc-sp-4)}
.hc-hero-slider__nav--next {right: var(--hc-sp-4)}
.hc-hero-slider__dots {position: absolute; left: 50%; bottom: var(--hc-sp-4); transform: translateX(-50%); z-index: 5; display: flex; gap: 6px}
.hc-hero-slider__dot {width: 28px; height: 3px; background: rgba(255,255,255,.28); border-radius: 2px; cursor: pointer; transition: background var(--hc-dur-fast), width var(--hc-dur-fast)}
.hc-hero-slider__dot.is-active {background: var(--hc-gold); width: 40px}
.hero-slider__dot.is-active {background: var(--hc-paper, #ffffff); transform: scale(1.4)}

.hc-hero-slide {position: absolute; inset: 0; min-height: inherit}
.hc-hero-slide__bg {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0}
.hc-hero-slide__bg--mobile {display: none}
.hc-hero-slide::after {content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,16,12,.42) 0%, rgba(20,16,12,.20) 45%, rgba(20,16,12,.08) 100%); z-index: 1}
.hc-hero-slide__body {position: relative; z-index: 2; min-height: inherit; display: flex; align-items: center}
.hc-hero-slide__content {max-width: 620px; padding: var(--hc-sp-8) 0; color: var(--hc-paper, #fff)}
.hc-hero-slide--txt-dark .hc-hero-slide__content {color: #1f1a16}
.hc-hero-slide--txt-dark::after {background: linear-gradient(90deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.42) 45%, rgba(255,255,255,.12) 100%)}
.hc-hero-slide__title {margin: 10px 0 12px; font-size: clamp(34px, 4.4vw, 58px); line-height: 1.06}
.hc-hero-slide__desc {margin: 0 0 var(--hc-sp-4); font-size: clamp(16px, 1.6vw, 22px); max-width: 52ch}
.hc-hero-slide__btns {display: flex; gap: 12px; flex-wrap: wrap}

@media (max-width: 1024px) {
  .hc-hero-slider {min-height: 520px}
  .hc-hero-slide__content {padding: var(--hc-sp-6) 0}
  .hc-hero-slide__title {font-size: clamp(28px, 8vw, 42px)}
}