/* theme-sh.css — 순천 산후관리 다크 골드 테마
   Background: #0A0A0A · Gold: #B5A394 · Text: #F0E8D8 */

/* ══════════════════════════════════════════════════
   SH EDITORIAL HERO — 에디토리얼 프리미엄 다크 골드
   ══════════════════════════════════════════════════ */

/* 컨테이너: 풀 뷰포트 */
.hero--sh {
  position: relative;
  height: 100svh;
  height: 100vh;
  min-height: 640px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #060604;
  padding: 0;
}

/* 배경 이미지 — 극단적으로 어둡게, 순수 텍스처 역할 */
.hero--sh .hero-bg-media {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.hero--sh .hero-bg-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  filter: brightness(.18) saturate(.2);
  /* 이미지를 텍스처로만 사용 — 거의 보이지 않게 */
}

/* 상단 → 하단 그라디언트 (하단 통에 골드빛) */
.sh-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(ellipse 120% 80% at 50% 0%, transparent 40%, rgba(6,6,4,.6) 100%),
    linear-gradient(to bottom, rgba(6,6,4,.2) 0%, rgba(6,6,4,.55) 60%, rgba(6,6,4,.92) 100%);
}

/* 왼쪽 에디토리얼 골드 바 */
.sh-overlay::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: linear-gradient(to bottom,
    transparent 0%,
    rgba(181,163,148,.6) 20%,
    rgba(181,163,148,.8) 50%,
    rgba(181,163,148,.6) 80%,
    transparent 100%
  );
}

/* grain 비활성화 */
.sh-grain { display: none; }

/* 구 히어로 요소 완전 숨김 */
.hero--sh .hero-bg-cover,
.hero--sh .hero-mineral,
.hero--sh .hero-shell,
.hero--sh .hero-copy,
.hero--sh .hero-notes-mobile,
.hero--sh .hero-notes-desktop { display: none !important; }

/* ── 본문 레이어 ── */
.sh-hero-body {
  position: relative;
  z-index: 3;
  flex: 1;
  display: flex;
  align-items: center;
  padding: calc(var(--nav-h) + 2.5rem) 0 7rem;
}

/* ── 아이브로우: 에디토리얼 잡지 스타일 ── */
.sh-eyebrow {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: clamp(1.75rem, 3vw, 3rem);
}
.sh-eyebrow-line {
  display: block;
  height: 1px;
  width: 40px;
  flex-shrink: 0;
  background: #B5A394;
  opacity: .65;
}
.sh-eyebrow-line:last-child { display: none; }
.sh-eyebrow-text {
  font-family: 'Manrope', 'Noto Sans KR', sans-serif;
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(181,163,148,.8);
}

/* ── H1: 에디토리얼 투 레이어 타이포 ── */
.sh-h1 {
  display: block;
  margin: 0 0 clamp(1.5rem, 3vw, 2.5rem);
  font-style: normal;
}
/* "순천" — Cormorant italic, 뮤트 골드, 작게-크게 대비 */
.sh-h1-serif {
  display: block;
  font-family: 'Cormorant Garamond', 'Georgia', serif;
  font-size: clamp(2.4rem, 5.5vw, 6.5rem);
  font-weight: 400;
  font-style: italic;
  color: rgba(181,163,148,.6);
  letter-spacing: .08em;
  line-height: 1.05;
  margin-bottom: -.06em;
}
/* "산후관리" — Noto Sans 900, near-white, 압도적 크기 */
.sh-h1-bold {
  display: block;
  font-family: 'Noto Sans KR', sans-serif;
  font-size: clamp(4.5rem, 11.5vw, 13rem);
  font-weight: 900;
  color: #F2ECE0;
  letter-spacing: -.045em;
  line-height: .88;
  word-break: keep-all;
}

/* ── 에디토리얼 구분선 ── */
.sh-rule {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 clamp(1.25rem, 2.5vw, 2rem);
}
.sh-rule::before {
  content: '';
  display: block;
  width: 40px;
  height: 1px;
  background: rgba(181,163,148,.7);
  flex-shrink: 0;
}
.sh-rule::after {
  content: '';
  display: block;
  flex: 1;
  max-width: 120px;
  height: 1px;
  background: linear-gradient(to right, rgba(181,163,148,.25), transparent);
}

/* ── 리드 텍스트 ── */
.sh-lead {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: clamp(.875rem, 1.4vw, 1rem);
  font-weight: 300;
  line-height: 1.95;
  color: rgba(242,236,224,.55);
  margin-bottom: clamp(2rem, 4vw, 3rem);
  max-width: 36ch;
  letter-spacing: .01em;
}

/* ── CTA 버튼 ── */
.sh-cta-wrap {
  display: flex;
  align-items: center;
  gap: .875rem;
  flex-wrap: wrap;
}
.sh-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .95rem 2.25rem;
  min-height: 50px;
  background: #B5A394;
  color: #060604;
  font-family: 'Manrope', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background .22s ease, box-shadow .22s ease;
}
.sh-btn-primary:hover {
  background: #C4B3A2;
  box-shadow: 0 8px 32px rgba(181,163,148,.28);
}
.sh-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .95rem 2.25rem;
  min-height: 50px;
  background: transparent;
  color: rgba(242,236,224,.6);
  font-family: 'Manrope', sans-serif;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  border: 1px solid rgba(181,163,148,.3);
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color .22s ease, color .22s ease;
}
.sh-btn-ghost:hover {
  border-color: rgba(181,163,148,.65);
  color: #B5A394;
}

/* ── 하단 스탯바 — 에디토리얼 thin rule ── */
.sh-statbar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 4;
  border-top: 1px solid rgba(181,163,148,.22);
}
.sh-statbar-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 var(--px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.sh-stat {
  padding: 1.4rem 1rem;
  text-align: center;
  border-right: 1px solid rgba(181,163,148,.1);
}
.sh-stat:last-child { border-right: none; }
.sh-stat-val {
  display: block;
  font-family: 'Cormorant Garamond', 'Georgia', serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 500;
  color: #B5A394;
  line-height: 1;
  margin-bottom: .45rem;
  letter-spacing: .02em;
}
.sh-stat-lbl {
  display: block;
  font-family: 'Manrope', sans-serif;
  font-size: .54rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(242,236,224,.35);
}

/* ── 모바일 ── */
@media(max-width:767px) {
  .sh-hero-body {
    padding: calc(var(--nav-h) + 1.5rem) 0 6.5rem;
    align-items: flex-start;
  }
  .sh-h1-serif { font-size: clamp(1.9rem, 9vw, 2.8rem); }
  .sh-h1-bold  { font-size: clamp(3.5rem, 16vw, 5.5rem); }
  .sh-lead     { font-size: .88rem; max-width: 100%; }
  .sh-lead br  { display: none; }
  .sh-statbar-inner { grid-template-columns: repeat(2, 1fr); }
  .sh-stat     { padding: 1rem .75rem; border-right-color: rgba(181,163,148,.08); }
  .sh-stat-val { font-size: 1.45rem; }
  .sh-eyebrow  { margin-bottom: 1.5rem; }
}
@media(max-width:380px) {
  .sh-h1-bold { font-size: clamp(3rem, 18vw, 4rem); }
}
/* ════════════════════════════════════════════════ */

/* ── 변수 재정의 — LUMIÈRE 컬러 시스템 ── */
:root {
  --c-primary:    #EBE6E0;           /* sand */
  --c-p90:        rgba(235,230,224,.9);
  --c-p60:        rgba(235,230,224,.6);
  --c-p40:        rgba(235,230,224,.4);
  --c-p15:        rgba(235,230,224,.15);
  --c-p06:        rgba(235,230,224,.06);
  --c-p03:        rgba(235,230,224,.03);
  --c-accent:     #B5A394;           /* taupe */
  --c-accent-h:   #8A7B6F;          /* taupe-dark */
  --c-accent-l:   #D4C8BC;          /* taupe-light */
  --c-accent-20:  rgba(181,163,148,.2);
  --c-bg:         #050505;           /* obsidian */
  --c-surface:    #111111;           /* onyx */
  --c-surface2:   #1A1A1A;
  --c-white:      #FFFFFF;
  --c-line:       rgba(38,38,38,.8); /* stone-line */
  --c-line2:      rgba(38,38,38,1);
  --f-d:    'Cormorant Garamond', 'Georgia', serif;
}

/* ── Nav ── */
.nav {
  background: rgba(10,10,10,.95);
  border-bottom: 1px solid rgba(181,163,148,.14);
}
.nav.is-scrolled {
  background: rgba(10,10,10,.98);
  backdrop-filter: blur(20px);
  box-shadow: 0 1px 0 rgba(181,163,148,.22);
}
.nav__links a { color: rgba(240,232,216,.55); }
.nav__links a:hover { color: #F0E8D8; }

/* ── Hero (홈) ── */
.hero { background: #0A0A0A; }
.hero-bg-cover {
  background:
    linear-gradient(180deg, rgba(10,10,10,.42) 0%, rgba(10,10,10,.42) 100%),
    url('/assets/images/hero/main.webp') center/cover no-repeat;
}
.hero-mineral {
  background:
    linear-gradient(180deg, rgba(10,10,10,.68) 0%, rgba(10,10,10,.56) 45%, rgba(10,10,10,.74) 100%),
    linear-gradient(120deg, transparent 0 58%, rgba(181,163,148,.07) 58% 100%);
}
.hero-copy {
  background: linear-gradient(160deg, rgba(10,10,10,.62) 0%, rgba(10,10,10,.3) 100%);
  border: 1px solid rgba(181,163,148,.26);
  backdrop-filter: blur(10px);
}
.hero-chip {
  background: rgba(181,163,148,.1);
  border: 1px solid rgba(181,163,148,.32);
  color: #B5A394;
}
.hero-meta__item {
  background: rgba(10,10,10,.55);
  border: 1px solid rgba(181,163,148,.2);
  color: rgba(240,232,216,.82);
}
.hero-note {
  background: rgba(12,10,4,.94);
  border: 1px solid rgba(181,163,148,.18);
  box-shadow: 0 8px 32px rgba(0,0,0,.4);
}
.hero-note--top strong,
.hero-note--bottom p { color: #F0E8D8; }

/* Mobile hero */
@media(max-width:767px) {
  .hero { background: #0A0A0A; }
  .hero-copy {
    background: rgba(10,10,10,.94);
    border: 1px solid rgba(181,163,148,.2);
    box-shadow: none;
    backdrop-filter: none;
  }
  .hero-h1 { color: #F0E8D8; }
  .hero-lead { color: rgba(240,232,216,.68); }
  .hero-meta__item {
    background: rgba(18,14,5,.92);
    border-color: rgba(181,163,148,.2);
    color: rgba(240,232,216,.85);
  }
  .hero-chip {
    background: rgba(181,163,148,.12);
    border-color: rgba(181,163,148,.3);
    color: #B5A394;
  }
  .hero-notes-mobile .hero-note {
    background: rgba(12,10,4,.96);
    border: 1px solid rgba(181,163,148,.15);
    border-left: 3px solid #B5A394;
    box-shadow: none;
    backdrop-filter: none;
  }
  .hero-notes-mobile .hero-note--bottom { border-left-color: rgba(181,163,148,.38); }
  .hero-notes-mobile .label { color: #B5A394; font-weight: 700; }
  .hero-notes-mobile .hero-note strong,
  .hero-notes-mobile .hero-note p { color: #F0E8D8; }
}

/* ── Trust Strip ── */
.trust-strip {
  background:
    radial-gradient(circle at top left, rgba(181,163,148,.1), transparent 36%),
    linear-gradient(135deg, #0A0A0A 0%, #12100A 100%);
}
.trust-item {
  border-right-color: rgba(181,163,148,.1);
  border-bottom-color: rgba(181,163,148,.1);
}

/* ── Section Head ── */
.sh-line, .sh__line { background: #B5A394; }

/* ── About Badge ── */
.about-badge {
  background: rgba(10,10,10,.94);
  border: 1px solid rgba(181,163,148,.2);
  backdrop-filter: blur(8px);
}
.about-badge-text { color: #F0E8D8; }

/* ── Service Cards ── */
.svc-card {
  background: #111111;
  border: 1px solid rgba(181,163,148,.12);
}
.svc-card:hover {
  background: #151208;
  box-shadow: 0 20px 48px rgba(0,0,0,.5);
  border-color: rgba(181,163,148,.25);
}
.svc-img { background: #1A1208; }

/* ── Process ── */
.process-card { background: #111111; }
.process-card:hover,
.process-card.is-active {
  background: #1A1208;
  box-shadow: 0 16px 48px rgba(0,0,0,.4);
}
.process-num { background: #B5A394; color: #0A0A0A; }
.process-num--outline { background: transparent; color: #B5A394; border-color: rgba(181,163,148,.3); }

/* ── Reviews ── */
.review-signal {
  background: linear-gradient(180deg, rgba(17,14,6,.97), rgba(12,10,4,.88));
  border: 1px solid rgba(181,163,148,.12);
}
.review-signal-count { color: #B5A394; }
.review-card {
  background: #111111;
  border: 1px solid rgba(181,163,148,.1);
}
.review-card-kicker {
  border-color: rgba(181,163,148,.22);
  color: #F0E8D8;
}
.review-card-focus { border-top-color: rgba(181,163,148,.12); }
.review-card-tag {
  background: #1A1208;
  border-color: rgba(181,163,148,.12);
  color: #F0E8D8;
}
.review-keywords {
  background: linear-gradient(180deg, rgba(17,13,5,.99) 0%, rgba(20,15,6,.97) 100%);
  border: 1px solid rgba(181,163,148,.2);
}
.review-keyword { background: rgba(181,163,148,.07); border-color: rgba(181,163,148,.1); }
.review-keyword-icon { border-color: rgba(181,163,148,.18); color: #B5A394; }

/* ── Features ── */
.feat-item {
  background: #111111;
  border: 1px solid rgba(181,163,148,.1);
  backdrop-filter: none;
}
.feat-item:hover {
  background: #161208;
  box-shadow: 0 16px 40px rgba(0,0,0,.4);
  border-color: rgba(181,163,148,.22);
}

/* ── Access / Map ── */
.access__map, .map-wrap {
  border-color: rgba(181,163,148,.15);
  background: #111111;
}
.map-actions {
  background: rgba(12,10,4,.92);
  border-top: 1px solid rgba(181,163,148,.12);
}

/* ── FAQ ── */
.faq-list { border-top-color: rgba(181,163,148,.15); }
.faq-item { border-bottom-color: rgba(181,163,148,.15); }
.faq-question:hover,
.faq-item.open .faq-question { color: #B5A394; }
.faq-item.open .faq-icon {
  background: #B5A394;
  border-color: #B5A394;
  color: #0A0A0A;
}

/* ── CTA Section ── */
.cta-sec {
  background:
    linear-gradient(135deg, #0D0A04 0%, #1A1208 100%);
}
.cta-sec::before { opacity: .03; }

/* ── Buttons ── */
.btn-primary { background: #B5A394; color: #0A0A0A; font-weight: 700; }
.btn-primary:hover { background: #D4C3B0; }
.btn-dark { background: #1A1208; color: #F0E8D8; }
.btn-dark:hover { background: #241A08; box-shadow: 0 10px 28px rgba(0,0,0,.4); }
.btn-outline {
  color: #F0E8D8;
  border: 1px solid rgba(181,163,148,.35);
}
.btn-outline:hover {
  background: rgba(181,163,148,.1);
  color: #B5A394;
  border-color: rgba(181,163,148,.6);
}

/* ── Float CTA / Back Top ── */
.float-cta a { box-shadow: 0 6px 24px rgba(0,0,0,.55); }
.float-cta a:hover { box-shadow: 0 10px 32px rgba(181,163,148,.22); }
.float-cta .fcta-call { background: #B5A394; }
.float-cta .fcta-call::before { border-color: #B5A394; }
.float-cta .fcta-sms { background: #1A1208; }
.back-top { background: #1A1208; color: #F0E8D8; }
.back-top:hover { background: #B5A394; color: #0A0A0A; }

/* ── Sub-hero (서브페이지 히어로) ── */
.sub-hero { background: #0A0A0A; }
.sub-hero-bg { opacity: .25; filter: saturate(.55); }
.sub-hero-overlay {
  background: linear-gradient(to bottom,
    rgba(10,10,10,.52) 0%,
    rgba(10,10,10,.8) 52%,
    rgba(10,10,10,.96) 100%);
}
.sub-hero-media {
  border: 1px solid rgba(181,163,148,.2);
  background: rgba(181,163,148,.05);
}
.sub-tag {
  color: #B5A394;
  border: 1px solid rgba(181,163,148,.42);
}
.sub-breadcrumb a:hover { color: #B5A394; }

/* ── Sub Stats Strip ── */
.sub-hero-strip {
  background: #0A0A0A;
  border-color: rgba(181,163,148,.12);
}
.sub-hero-strip-grid { background: rgba(181,163,148,.1); }
.sub-hero-strip-item { background: #0A0A0A; }
.sub-hero-strip-value { color: #B5A394; }

/* ── Sub Declare ── */
.sub-declare {
  background: #0A0A0A;
  border-top-color: rgba(181,163,148,.1);
  border-bottom-color: rgba(181,163,148,.1);
}
.sub-declare::before { color: rgba(181,163,148,.04); }
.sub-declare-text strong { color: #B5A394; }

/* ── Price Rows ── */
.price-rows { border-top: 2px solid rgba(181,163,148,.4); }
.price-row { border-bottom-color: rgba(181,163,148,.09); }
.price-row:hover { background: rgba(181,163,148,.04); }

/* ── Sub Framework / Summary / Check ── */
.sub-framework-card {
  background: #111111;
  border: 1px solid rgba(181,163,148,.1);
}
.sub-summary-card {
  background: #111111;
  border: 1px solid rgba(181,163,148,.1);
}
.sub-check-item {
  background: #111111;
  border: 1px solid rgba(181,163,148,.1);
}
.sub-check-index { color: #B5A394; }
.sub-framework-step { color: rgba(181,163,148,.4); }
.sub-summary-num { color: rgba(181,163,148,.35); }

/* ── Price/reservation ── */
.sub-price-item {
  background: #111111;
  border-color: rgba(181,163,148,.12);
}
.sub-price-index {
  border-color: rgba(181,163,148,.4);
  background: rgba(181,163,148,.08);
  color: #B5A394;
}
.sub-reservation-card {
  background: linear-gradient(160deg, #111111 0%, #1A1208 100%);
  border-color: rgba(181,163,148,.12);
}
.sub-reservation-kicker { color: #B5A394; }

/* ── Related Cards ── */
.related-card {
  background: #111111;
  border: 1px solid rgba(181,163,148,.1);
}
.related-card:hover {
  background: #1A1208;
  border-color: rgba(181,163,148,.25);
}
.related-card-tag { color: #B5A394; }
.related-card-link { color: #B5A394; }

/* ── Footer ── */
.footer {
  background: #050503;
  border-top: 1px solid rgba(181,163,148,.12);
}
.footer-bottom { border-top: 1px solid rgba(181,163,148,.08); }

/* ── Mobile Bottom Bar ── */
.mob-bar {
  background: rgba(10,10,10,.97);
  border-top: 1px solid rgba(181,163,148,.15);
}
.mob-bar__item { color: rgba(240,232,216,.55); }
.mob-bar__item.is-active,
.mob-bar__item:hover { color: #B5A394; }
.mob-bar__call {
  background: #B5A394;
  color: #0A0A0A;
}
.mob-bar__call:hover { background: #D4C3B0; }

/* ── Scroll Progress ── */
.scroll-prog,
.scroll-progress { background: linear-gradient(to right, #B5A394, #D4C8BC); }

/* ── Cursor ── */
#cursor-dot { background: #B5A394; }
#cursor-ring { border-color: #B5A394; }

/* ── Skip Link ── */
.skip-link:focus {
  background: #B5A394;
  color: #0A0A0A;
  outline: 2px solid #B5A394;
}

/* ── Guide blocks ── */
.guide-authority-item {
  background: #111111;
  border: 1px solid rgba(181,163,148,.12);
}
.guide-time-card {
  background: #111111;
  border: 1px solid rgba(181,163,148,.1);
}
.guide-time-period { color: #B5A394; }
.guide-block-step { color: rgba(181,163,148,.4); }
.guide-point { border: 1px solid rgba(181,163,148,.09); }
.guide-point-num { color: rgba(181,163,148,.35); }
.guide-authority-kicker { color: #B5A394; }

/* ── Mobile Sticky Bar ── */
#mobile-sticky-bar {
  background: rgba(10,10,10,.97);
  border-top: 1px solid rgba(181,163,148,.15);
}
.msb-btn { color: rgba(240,232,216,.7); }
.msb-btn--cta {
  background: #B5A394;
  color: #0A0A0A;
}
.msb-sep { background: rgba(181,163,148,.2); }

/* ── 구글 폰트 Cormorant Garamond (딥 럭셔리 세리프) ── */
/* 메인 HTML에서 폰트 링크 추가 필요 */