/* Namespace scope */
:root {
  --cs-red-600: #DA1F3D;
  --cs-red-700: #b11d27;
  --cs-gray-900: #222;
  --cs-gray-700: #757575;
  --cs-gray-500: #888;
  --cs-gray-200: #eee;
  --cs-white: #fff;
  --cs-radius-lg: 16px;
  --cs-radius-md: 12px;
  --cs-radius-sm: 8px;
  --cs-spacing-2: 8px;
  --cs-spacing-3: 12px;
  --cs-spacing-4: 16px;
  --cs-spacing-6: 24px;
  --cs-spacing-8: 32px;
  --cs-spacing-10: 40px;
  --cs-spacing-12: 48px;
  --cs-shadow-sm: 0 2px 6px rgba(0,0,0,0.06);
  --cs-shadow-md: 0 6px 16px rgba(0,0,0,0.08);
}

body {
  margin: 0;
}

.cafeshow-lodging {
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color: var(--cs-gray-900);
  line-height: 1.6;
}

/* Header */
.cafeshow-lodging__header { padding: 0; }
.cafeshow-lodging__header-visual img { width: 100%; height: auto; display: block; }

/* Highlights */
.cafeshow-lodging__highlights { width: 100%; }
/* .cafeshow-lodging__highlights-visual { max-width: 1080px; } */
.cafeshow-lodging__highlights-visual img { width: 100%; height: auto; display: block; margin: 0px; }
.cafeshow-lodging__combined-visual { display: none; }
.cafeshow-lodging__combined-visual img { width: 100%; height: auto; display: block; }
.cafeshow-lodging__highlight-item {
  background: var(--cs-white);
  border-radius: var(--cs-radius-lg);
  padding: var(--cs-spacing-6);
  box-shadow: var(--cs-shadow-sm);
}
.cafeshow-lodging__highlight-title {
  margin: 0 0 6px;
  font-size: 18px;
}
.cafeshow-lodging__highlight-text {
  margin: 0;
  color: var(--cs-gray-700);
}

/* List */
.cafeshow-lodging__list {
  padding-top: 84px;
  max-width: 1200px;
  margin: 0 auto;
}
.cafeshow-lodging__section-title {
  text-align: center;
  font-size: 40px;
  font-weight: 900;
  margin: 0 0 var(--cs-spacing-10);
}
.cafeshow-lodging__section-title em { color: var(--cs-red-600); font-style: normal; }

.cafeshow-lodging__cards {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(272px, 272px));
  gap: var(--cs-spacing-6);
  justify-content: center;
}

@media (min-width: 640px) {
  .cafeshow-lodging__cards { grid-template-columns: repeat(auto-fill, minmax(272px, 272px)); }
}
@media (min-width: 960px) {
  .cafeshow-lodging__cards { grid-template-columns: repeat(auto-fill, minmax(272px, 272px)); }
}
@media (min-width: 1200px) {
  .cafeshow-lodging__cards { grid-template-columns: repeat(auto-fill, minmax(272px, 272px)); }
}

/* Card */
.cafeshow-lodging-card {
  background: var(--cs-white);
  border-radius: var(--cs-radius-md);
  box-shadow: var(--cs-shadow-sm);
  overflow: hidden;
  width: 272px;
  /* width: 327px; */
  height: 420px;
}
.cafeshow-lodging-card__link {
  color: inherit;
  display: grid;
  grid-template-rows: auto 1fr auto;
  height: 100%;
}
.cafeshow-lodging-card__media { position: relative; width: 100%; height: 191px; overflow: hidden; margin: 0 auto; border-radius: 0px; }
.cafeshow-lodging-card__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cafeshow-lodging-card__rating { font-size: 12px; color: #FFB13C; margin-bottom: 8px; }
.cafeshow-lodging-card__content { display: flex; flex-direction: column; }
.cafeshow-lodging-card__body { padding: var(--cs-spacing-4); display: flex; flex-direction: column; justify-content: space-between; max-height: 212px; }
.cafeshow-lodging-card__name { font-size: 16px; font-weight: 700; line-height: 25.6px; margin-bottom: 4px; }
.cafeshow-lodging-card__en { display: none; }
.cafeshow-lodging-card__meta { font-size: 12px; font-weight: 500; line-height: 19.2px; color: var(--cs-gray-700); }
.cafeshow-lodging-card__distance { font-size: 12px; font-weight: 500; line-height: 19.2px; color: var(--cs-gray-700); }
.cafeshow-lodging-card__price { font-size: 13px; color: var(--cs-red-700); font-weight: 700; }

/* Icon row */
.cafeshow-lodging-card__info { display: flex; align-items: flex-start; gap: 4px; height: 38px; }
.cafeshow-lodging-card__info-icon { width: 14px; height: 14px; margin-top: 2px; flex: 0 0 14px; margin-top: 3px; }

/* Minimal utility classes (scoped) */
.flex { display: flex; }
.flex-col { flex-direction: column; }

.cafeshow-lodging-card__cta {
  display: inline-block;
  margin-top: 0;
  background: var(--cs-red-600);
  color: var(--cs-white);
  padding: 15px 16px;
  border-radius: 8px;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  line-height: 13px;
  text-decoration: none;
}

.cafeshow-lodging-card__cta em { font-size: 18px; font-weight: 700; font-style: normal; }

/* Actions */
.cafeshow-lodging__actions { text-align: center; margin-top: var(--cs-spacing-12); }
.cafeshow-lodging__more {
  display: inline-block;
  padding: 16px 32px;
  border-radius: 8px;
  border: 1px solid var(--cs-red-600);
  color: var(--cs-red-600);
  text-decoration: none;
  background: var(--cs-white);
  font-size: 16px;
  font-weight: 700;
  line-height: 16px;
}

/* Policies */
.cafeshow-lodging__policies { background: #fafafa; padding: var(--cs-spacing-8) 16px; }
.cafeshow-lodging__policy-list { list-style: none; padding: 0; margin: 0 auto; display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
.cafeshow-lodging__policy-list a { color: var(--cs-gray-700); text-decoration: none; }
/* 375~1024: section3만 노출 */
@media (min-width: 375px) and (max-width: 1024px) {
  .cafeshow-lodging__header,
  .cafeshow-lodging__highlights { display: none; }
  .cafeshow-lodging__combined-visual { display: block; }
}

/* 모바일: 섹션 타이틀 숨김 */
@media (max-width: 1024px) {
  .cafeshow-lodging__section-title { display: none; }
  .cafeshow-lodging__list { padding-top: 16px; }
}

/* 작은 모바일(예: 375px): 카드 1열, 좌우 24px → 카드폭 327px */
@media (max-width: 480px) {
  .cafeshow-lodging__list { padding-left: var(--cs-spacing-6); padding-right: var(--cs-spacing-6); }
  .cafeshow-lodging__cards { grid-template-columns: 1fr; }
  .cafeshow-lodging-card { width: 100%; }
}