/*
 * 원본 사이트에서 컴파일 CSS 로 들어오지 않는 스타일만 모은다.
 * (원본은 styled-jsx 로 런타임 주입 — 히어로 슬라이더 페이지네이션)
 * 컴파일 CSS(static/css/chunks/*.css)에 없는 Tailwind 클래스를 새로 쓰려면
 * Tailwind 빌드 도입 전까지는 여기에 직접 CSS 로 작성한다.
 */
.swiper-pagination {
  bottom: 40px !important;
}
.swiper-pagination-bullet {
  opacity: 1;
  border-radius: unset;
  background: #ffffff80;
  width: 14px;
  height: 2px;
  transition: all 0.2s;
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 2px) !important;
}
.swiper-pagination-bullet-active {
  background: var(--white);
  width: 42px;
}

/* 오시는 길 지도 — 컴파일 CSS 에 없는 클래스라 여기에 직접 쓴다.
 * .h-90(=22.5rem) 크기는 원본 그대로 두고 그 안을 채운다. */
.map-area {
  overflow: hidden;
  border-radius: 8px;
  background: #f1f1f1;
}
.map-canvas {
  width: 100%;
  height: 100%;
}
.map-fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  height: 100%;
  text-align: center;
  text-decoration: none;
  color: inherit;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  transition: background 0.2s;
}
.map-fallback:hover {
  background: #ebebeb;
}
.map-fallback-title {
  font-size: 18px;
  font-weight: 600;
}
.map-fallback-address {
  font-size: 15px;
  color: var(--gray, #767676);
}

/* 소식 본문 사진 그리드: 원본은 md 이상에서 음수 마진(-mx-16)으로 본문 폭보다 넓게 깔린다.
 * 그런데 768~1023px(태블릿 가로 등)에서는 그 폭이 화면을 넘어 좌우 스크롤이 생긴다(원본도 동일).
 * 이 구간에서만 음수 마진을 거두어 본문 폭에 맞춘다 — 사진이 잘리지 않고 스크롤도 없다.
 * 1024px 이상은 lg:-mx-24 가 화면 안에 들어오므로 원본 그대로 둔다. */
@media (min-width: 768px) and (max-width: 1023.98px) {
  /* 사진 그리드(.grid)뿐 아니라 영상 블록에도 같은 음수 마진이 붙는다 —
   * .grid 로 좁히면 영상 블록이 그대로 넘친다(실제로 한 번 놓쳤다). */
  article.max-w-3xl [class*="-mx-16"] {
    margin-left: 0;
    margin-right: 0;
  }
}

/* 제휴기관 고정 배지 — 원본은 PC 에서 세로 가운데(top-1/2)라 홈 히어로의
 * '다음 슬라이드' 버튼과 정확히 겹쳐 클릭을 막았다. 모바일처럼 오른쪽 아래에 둔다. */
@media (min-width: 768px) {
  .partner-badges {
    right: 1.5rem;
    bottom: 1.5rem;
  }
}

/* ── 머리글·바닥글 — 1안 '쪽빛과 단청' A안 + 24절기(2026-09-23) ──────────────
 * 원본 마크업(header.html·footer.html)은 그대로 두고 여기서 색만 덮어쓴다.
 * 계절은 장식 띠가 아니라 ① 절기 글자(홈 히어로 아래·바닥글 맨 위, partials/solar_term.html)
 * ② 아주 작은 계절색(머리글 메뉴의 마우스 올림·현재 페이지 밑줄 = --primary)으로만 드러낸다.
 * 머리글 아래 가는 금선은 계절과 관계없이 항상 같다.
 * 계절은 <body data-season> — apps/pages/seasons.py(24절기, 콘솔에서 기간 고정 가능). */
body[data-season] { --season-accent: #ebcb99; } /* 원래 사이트 강조색(금빛) — 단청·기본 */
body[data-season="spring"] { --season-accent: #f2c4ce; }
body[data-season="summer"] { --season-accent: #c6e3c1; }
body[data-season="autumn"] { --season-accent: #f3c08a; }
body[data-season="winter"] { --season-accent: #f4f1ea; }

/* 메뉴 강조색 — 컴파일 CSS 의 text-(--primary)·bg-(--primary) 가 머리글 안에서만 계절색을 쓴다 */
#site-header { --primary: var(--season-accent); }

#site-header.bg-black {
  background-color: #1f3a5f; /* 쪽빛 */
  box-shadow: inset 0 -1px 0 rgba(200, 155, 60, 0.55); /* 가는 금단청 선 */
}
#site-header [data-nav-panel] { background-color: #fffdf8; }
#site-header [data-drawer-panel].bg-black { background-color: #1f3a5f; }

footer > .bg-stone-950 {
  background-color: #2a2724; /* 먹 */
  box-shadow: inset 0 1px 0 rgba(200, 155, 60, 0.35);
  color: #d9cfbf;
}
/* 먹 바탕에서 읽히도록 바닥글 글자를 밝힌다(원본 stone-500/600 은 대비가 부족했다) */
footer > .bg-stone-950 .text-stone-500 { color: #a99f90; }
footer > .bg-stone-950 .text-stone-600 { color: #9a8f80; }

/* 절기 글꼴 — 자체 호스팅 부분 글꼴(라이선스·출처는 static/fonts/LICENSE.txt).
 * 문구: 마루 부리 Light(한글 2,350자) — 없는 글자는 Aritaburi 로 넘어간다.
 * 한자: 본명조 Light 에서 24절기 한자 27자만. unicode-range 로 그 글자에만 쓴다. */
@font-face {
  font-family: "Sangcheon Buri"; font-weight: 300; font-display: swap;
  src: url("../fonts/MaruBuri-Light-ks.88b345983c97.woff2") format("woff2");
}
@font-face {
  font-family: "Sangcheon Term Hanja"; font-weight: 300; font-display: swap;
  src: url("../fonts/NotoSerifKR-Light-terms.ef7983b14f5d.woff2") format("woff2");
  unicode-range: U+51AC, U+5206, U+590F, U+5927, U+5BD2, U+5C0F, U+660E, U+6625, U+6691, U+6C34,
    U+6DF8, U+6EFF, U+767D, U+79CB, U+7A2E, U+7A40, U+7ACB, U+81F3, U+8292, U+8655, U+87C4,
    U+964D, U+96E8, U+96EA, U+971C, U+9732, U+9A5A;
}

/* 절기 현판(A+C) — 홈 히어로 바로 아래. 세로 한자 | 금선 | 두 줄 문구·이름·날짜 | 해의 길(24절기 점) */
.st-home { background: #fffdf8; padding: 44px 24px 40px; }
.st-plaque {
  display: flex; align-items: center; justify-content: center; gap: 26px;
  max-width: 72rem; margin: 0 auto;
}
.st-home .st-hanja {
  writing-mode: vertical-rl; font-family: "Sangcheon Term Hanja", var(--font-buri), serif; font-weight: 300;
  font-size: 30px; line-height: 1; letter-spacing: 0.32em; color: #1f3a5f;
}
.st-rule { flex: none; width: 1px; height: 84px; background: #c89b3c; }
.st-body { flex: 0 1 auto; max-width: 520px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.st-home .st-text {
  margin: 0; font-family: "Sangcheon Buri", var(--font-buri), serif; font-weight: 300;
  font-size: 26px; line-height: 1.5; letter-spacing: -0.01em; color: #2a2724; word-break: keep-all;
}
.st-home .st-line { display: block; }
.st-home .st-name {
  margin: 0; font-size: 12px; letter-spacing: 0.22em; color: #6e645a; font-variant-numeric: tabular-nums;
}
.st-ring { flex: none; margin: 0 0 0 18px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.st-ring svg { width: 64px; height: 64px; display: block; }
.st-ring figcaption { font-size: 11px; letter-spacing: 0.12em; color: #6e645a; font-variant-numeric: tabular-nums; }
.st-track { fill: none; stroke: #e6dccb; stroke-width: 0.8; }
.st-dot { stroke-width: 0.8; }
.st-dot.is-past { fill: #8fa6c2; stroke: #8fa6c2; }
.st-dot.is-ahead { fill: #fffdf8; stroke: #b9ae9c; }
.st-dot.is-now { fill: #c89b3c; stroke: #8a6a22; }

/* 바닥글 맨 위 한 줄 — 금빛 한자 · 짧은 금선 · 문구 */
.st-foot { margin: 0 0 1.75rem; font-size: 13px; line-height: 1.6; letter-spacing: 0.02em; }
.st-foot .st-hanja {
  font-family: "Sangcheon Term Hanja", var(--font-buri), serif; font-weight: 300; letter-spacing: 0.2em; color: #ebcb99;
}
.st-dash {
  display: inline-block; width: 18px; height: 1px; margin: 0 10px; vertical-align: middle;
  background: rgba(200, 155, 60, 0.6);
}
.st-foot .st-text { font-family: "Sangcheon Buri", var(--font-buri), serif; font-weight: 300; color: #e3d9c8; }

@media (max-width: 767.98px) {
  .st-home { padding: 30px 16px 26px; }
  .st-plaque { gap: 16px; }
  .st-home .st-hanja { font-size: 24px; }
  .st-rule { height: 72px; }
  .st-home .st-text { font-size: 19px; }
  .st-ring { margin-left: 2px; }
  .st-ring svg { width: 40px; height: 40px; }
  .st-foot { font-size: 12px; }
}
@media (max-width: 359.98px) {
  .st-plaque { gap: 12px; }
  .st-home .st-text { font-size: 17px; }
}

/* 대관 소개 문구 스타일 — 콘솔 '대관 소개'의 선택지와 강조(apps/pages/richtext.py).
 * 포인트는 쪽빛 + 굵게(색만으로 구분하지 않는다). 부리(명조) 글꼴은 Light 한 굵기뿐이라
 * 그 안의 포인트는 가짜 굵게 대신 가는 금선 밑줄로 구분한다. */
.rt-b { font-weight: 700; color: var(--foreground, #1c1917); }
.rt-p { font-weight: 700; color: #1f3a5f; }
.rt-buri { font-family: "Sangcheon Buri", var(--font-buri), serif; font-weight: 300; letter-spacing: -0.01em; }
.rt-buri .rt-b, .rt-buri .rt-p { font-weight: inherit; }
.rt-buri .rt-p {
  text-decoration: underline; text-decoration-thickness: 1px;
  text-decoration-color: rgba(200, 155, 60, 0.7); text-underline-offset: 0.28em;
}
.rt-buri .rt-b { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.28em; }
p.rt-lead-indigo { color: #1f3a5f; }
p.rt-lead-small { font-size: 16px; }

/* 대관문의 시설 사진 — 모두 원본 밝기(원본의 '선택 안 된 카드 70% 흐림'을 걷어 냄), 모서리 8px.
 * 선택된 카드는 사진에 쪽빛 테두리 + 제목 쪽빛(색만으로 구분하지 않도록 테두리와 함께). */
#inquiry .rental-card-img, #inquiry .rental-detail-img { border-radius: 8px; }
#inquiry .rental-card-img img { transition: transform 0.4s ease; }
#inquiry button.group:hover .rental-card-img img { transform: scale(1.03); }
#inquiry button.group[aria-pressed="true"] .rental-card-img { outline: 2px solid #1f3a5f; outline-offset: 3px; }
#inquiry button.group[aria-pressed="true"] .rental-card-title { color: #1f3a5f; }
#inquiry button.group:focus-visible { outline: none; }
#inquiry button.group:focus-visible .rental-card-img { outline: 2px dashed #1f3a5f; outline-offset: 3px; }
#inquiry button.group[aria-pressed="true"]:focus-visible .rental-card-img { outline-style: solid; box-shadow: 0 0 0 6px rgba(31, 58, 95, 0.18); }
@media (prefers-reduced-motion: reduce) {
  #inquiry .rental-card-img img { transition: none; }
  #inquiry button.group:hover .rental-card-img img { transform: none; }
}

/* 개인정보 처리방침 개정 안내(apps/pages/policy.py) — 처리방침 맨 위 상자 + 바닥글 링크 옆 표시 */
.pp-notice { margin-top: 28px; padding: 18px 20px; border: 1px solid #e6dccb; border-radius: 8px; background: #fbf7ef; font-size: 14px; line-height: 1.7; color: #3f3830; }
.pp-notice p { margin: 0; }
.pp-notice .pp-notice-h { margin-bottom: 6px; font-weight: 700; color: #1f3a5f; }
.pp-notice ul { margin: 10px 0 0; padding-left: 18px; list-style: disc; display: flex; flex-direction: column; gap: 6px; }
.pp-notice strong { color: #2a2724; }
.pp-notice .pp-notice-terms { margin-top: 6px; }
.pp-notice a { color: #1f3a5f; text-decoration: underline; text-underline-offset: 3px; }
.pp-badge { display: inline-block; margin-left: 8px; padding: 0 7px; border: 1px solid rgba(235, 203, 153, 0.55); border-radius: 999px; font-size: 10px; line-height: 17px; letter-spacing: 0.02em; color: #ebcb99; vertical-align: 1px; }

/* 회원·대관 예약 입구(공개일부터 — context 'members_open') */
#site-header > div:first-child { position: relative; }
.hdr-member { display: none; }
@media (min-width: 768px) {
  .hdr-member { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; gap: 18px; font-size: 13px; letter-spacing: 0.02em; }
  .hdr-member a { color: #d6d3d1; transition: color 0.2s; }
  .hdr-member a:hover, .hdr-member a:focus-visible { color: var(--primary, #ebcb99); }
}
.drawer-member { display: flex; gap: 10px; margin-bottom: 8px; }
.drawer-member a { flex: 1; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid rgba(255, 255, 255, 0.25); border-radius: 999px; font-size: 14px; color: #fff; }
.foot-sep { margin: 0 8px; color: #6e645a; }
.rsv-cta { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; margin-top: 12px; padding: 0 22px; border-radius: 999px; background: #1f3a5f; color: #fffdf8; font-size: 16px; font-weight: 700; transition: background 0.2s; }
.rsv-cta:hover, .rsv-cta:focus-visible { background: #2c4c75; }

/* 안내도(/map) — 현장 안내판 사진(2026-09-24) */
.park-map { margin-bottom: 72px; }
.park-map-figure { margin: 0; }
.park-map-figure a { display: block; }
.park-map-figure img { display: block; width: 100%; height: auto; border-radius: 8px; }
.park-map-figure a:focus-visible { outline: 2px solid #1f3a5f; outline-offset: 3px; }
.park-map-caption { margin-top: 12px; padding: 0 20px; font-size: 14px; line-height: 1.7; color: #5a5148; }
.park-map-zones { display: flex; flex-direction: column; gap: 14px; margin: 28px 0 0; list-style: none; }
.park-map-zones li { display: flex; gap: 28px; font-size: 16px; line-height: 1.6; }
.park-map-zones b { flex-shrink: 0; min-width: 84px; color: #1f3a5f; }
@media (min-width: 768px) { .park-map-caption { padding: 0; } }
@media (max-width: 767.98px) {
  .park-map { margin-bottom: 48px; }
  .park-map-figure img { border-radius: 0; }
  .park-map-zones li { flex-direction: column; gap: 2px; font-size: 15px; }
}
