/* ═══════════════════════════════════════════════════════
   ZoneStay 절제형 편집 레이아웃
   ─ branch.css의 기능 구조는 유지하고 시각 밀도만 낮춘다.
   ─ 지점 HTML에서 가장 마지막에 로드한다.
   ═══════════════════════════════════════════════════════ */

/* ── 히어로: 캡슐·박스보다 사진과 핵심 정보 우선 ─── */
.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 300;
  padding: 10px 14px;
  border-radius: 4px;
  background: var(--accent);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  transform: translateY(-160%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }

.hero-eyebrow {
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  letter-spacing: .04em;
  text-transform: none;
}
.hero-eyebrow::before {
  width: 28px;
  height: 1px;
  border-radius: 0;
}
.hero-h1 {
  max-width: 680px;
  line-height: .98;
  letter-spacing: -.05em;
  text-wrap: balance;
}
.hero-sub {
  max-width: 520px;
  margin-bottom: 28px;
  line-height: 1.65;
  text-wrap: pretty;
}
.hero-price {
  display: flex;
  width: fit-content;
  padding: 3px 0 3px 18px;
  border: 0;
  border-left: 2px solid var(--accent);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  margin-bottom: 26px;
}
.btn-primary,
.nav-cta,
.m-cta,
.btn-kakao,
.btn-line,
.btn-insta {
  border-radius: 4px;
  box-shadow: none;
}
.btn-secondary {
  padding: 0 8px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.btn-primary:active,
.nav-cta:active,
.room-cta:active { transform: translateY(1px); }

/* ── 섹션 리듬: 반복되는 랜딩페이지 문법 축소 ─────── */
.section-inner { max-width: 1120px; }
.section-eyebrow {
  margin-bottom: 12px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: none;
}
.section-title {
  max-width: 700px;
  line-height: 1.08;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.section-sub {
  max-width: 640px;
  margin-bottom: 48px;
  text-wrap: pretty;
}

/* ── 입실료: 카드 안의 카드 대신 숫자와 구분선 ──── */
.pricing-policy {
  padding: 96px 24px 104px;
  background: var(--bg);
  border-top: 1px solid var(--line);
}
.policy-banner {
  grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr);
  gap: 48px;
  padding: 30px 0;
  border: 0;
  border-top: 1px solid var(--accent-line);
  border-bottom: 1px solid var(--accent-line);
  border-radius: 0;
  background: transparent;
  margin-bottom: 32px;
}
.policy-kicker { display: none; }
.policy-coupon strong { font-size: clamp(32px, 4vw, 46px); }
.policy-conditions {
  gap: 0 28px;
  border-left: 1px solid var(--line);
  padding-left: 32px;
}
.policy-conditions li {
  min-height: 0;
  padding: 11px 0 12px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.rate-card {
  border-radius: 4px;
  background: transparent;
}
.rate-card-head { padding: 18px 20px; }
.rate-grid { font-variant-numeric: tabular-nums; }
.rate-item { background: transparent; }

/* ── 생활 조건: 이모지 카드 대신 번호형 편집 목록 ── */
.features {
  padding: 104px 24px 112px;
  background: var(--bg);
  border-top: 1px solid var(--line);
}
.features-grid {
  counter-reset: feature;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 56px;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.feature-card {
  counter-increment: feature;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  padding: 24px 0 26px;
  border-top: 1px solid var(--line);
  background: transparent;
}
.feature-card:hover { background: transparent; }
.feature-icon {
  grid-row: 1 / 3;
  width: auto;
  height: auto;
  margin: 1px 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: 0;
  align-items: flex-start;
  justify-content: flex-start;
}
.feature-icon::before {
  content: counter(feature, decimal-leading-zero);
  font-size: 11px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: .06em;
}
.feature-title,
.feature-desc { grid-column: 2; }
.feature-title { font-size: 17px; }

/* ── 객실: 거대한 카드 프레임을 해체하고 사진 우선 ─ */
.rooms { padding: 104px 24px 112px; }
.rooms-list {
  margin-top: 48px;
  gap: 72px;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent;
}
.room-row {
  min-height: 470px;
  border: 0;
  border-top: 1px solid var(--line);
  padding-top: 24px;
}
.room-photo { border-radius: 4px; }
.room-info {
  padding: 32px 0 32px 48px;
  background: transparent;
}
.room-row.reverse .room-info { padding: 32px 48px 32px 0; }
.room-badge {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.room-specs { gap: 0; }
.spec-chip {
  position: relative;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.spec-chip + .spec-chip { margin-left: 18px; }
.spec-chip + .spec-chip::before {
  content: '·';
  position: absolute;
  left: -11px;
  color: var(--accent);
}
.room-fit {
  padding: 0 0 0 14px;
  border-radius: 0;
  background: transparent;
}
.room-cta {
  height: auto;
  padding: 4px 0 6px;
  border: 0;
  border-bottom: 1px solid var(--accent);
  border-radius: 0;
  background: transparent;
}
.room-cta:hover { background: transparent; color: var(--accent-br); }

/* ── 보조 구간도 같은 문법으로 정리 ──────────────── */
.included-item {
  padding: 18px 0;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.included-icon { display: none; }
.gallery-grid,
.map-slot,
.faq-list { border-radius: 4px; }
.inquiry-inner {
  max-width: 1100px;
  text-align: left;
}
.inquiry-h2 { max-width: 720px; }
.inquiry-checklist {
  justify-content: flex-start;
  gap: 8px 24px;
}
.inquiry-checklist li {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.inquiry-btns { justify-content: flex-start; }
.floating { display: none; }

/* ── 인천점: 보조 글자 대비와 이미지 위계 보정 ───── */
.branch-incheon {
  --muted: #96928A;
  --dim: #74716B;
}
.branch-incheon .hero { min-height: calc(100dvh - 64px); }
.branch-incheon .hero-bg::after {
  background:
    linear-gradient(90deg, rgba(10,10,10,.78) 0%, rgba(10,10,10,.48) 38%, rgba(10,10,10,.08) 72%),
    linear-gradient(to top, rgba(10,10,10,.82) 0%, rgba(10,10,10,.08) 58%);
}
.branch-incheon .hero-content { padding-bottom: 64px; }

/* ── 반응형 ───────────────────────────────────────── */
@media (max-width: 768px) {
  .pricing-policy,
  .features,
  .rooms,
  .included,
  .gallery,
  .location,
  .faq,
  .inquiry { padding-left: 20px; padding-right: 20px; }

  .hero-eyebrow { font-size: 11px; }
  .hero-h1 { font-size: clamp(44px, 14vw, 60px); }
  .hero-price { width: 100%; }
  .hero-actions { align-items: center; }

  .policy-banner { grid-template-columns: 1fr; gap: 24px; }
  .policy-conditions { padding-left: 0; border-left: 0; }
  .features-grid { grid-template-columns: 1fr; }

  .rooms-list { gap: 52px; }
  .room-row { padding-top: 18px; }
  .room-info,
  .room-row.reverse .room-info { padding: 28px 0 0; }

  .atmo-inner {
    grid-template-columns: repeat(3, 1fr);
    height: 132px;
  }
  .atmo-inner .atmo-cell:last-child { display: block; }
  .atmo-cell { height: 132px; }
  .atmo-label { display: none; }

  .floating {
    display: flex;
    right: 14px;
    bottom: 14px;
    height: 46px;
    padding: 0 16px;
    border-radius: 4px;
    box-shadow: var(--shadow-subtle);
  }
}

@media (max-width: 540px) {
  .pricing-policy { padding-top: 72px; padding-bottom: 80px; }
  .features,
  .rooms,
  .included,
  .gallery,
  .location,
  .faq,
  .inquiry { padding-top: 80px; padding-bottom: 88px; }

  .section-sub { margin-bottom: 40px; }
  .policy-banner { padding: 26px 0; }
  .policy-conditions {
    grid-template-columns: 1fr;
    gap: 0 18px;
  }
  .policy-conditions li { font-size: 13px; }
  .rate-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rate-item:nth-child(2) { border-right: 0; }
  .rate-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }

  .features-grid { display: block; }
  .feature-card { padding: 20px 0 22px; }
  .spec-chip:nth-child(n+4) { display: none; }
}
