/* ============================================
   SUBPAGE COMMON — THE BUNKER PROJECT
   White Luxury Theme v1
   ============================================ */
:root {
  --white:        #ffffff;
  --off-white:    #f9f8f6;
  --warm-white:   #faf9f7;
  --gray-50:      #fafafa;
  --gray-100:     #f4f4f2;
  --gray-200:     #e8e6e2;
  --gray-300:     #ccc9c3;
  --gray-400:     #9e9b94;
  --gray-500:     #6e6b64;
  --gray-700:     #3a3835;
  --gray-900:     #1c1b18;
  --black:        #111111;
  --accent:       #7a5c2e;
  --accent-lt:    #b8924a;
  --accent-bg:    #fdf6ea;
  --accent-pale:  #f5efe3;
  --wine-red:     #8b1a2e;
  --wine-gold:    #b8924a;

  --font-kr:  'Noto Sans KR', sans-serif;
  --font-en:  'Playfair Display', serif;
  --t:        .32s cubic-bezier(.4,0,.2,1);
  --r:        14px;
  --r-sm:     8px;

  --shadow-xs: 0 1px 4px rgba(0,0,0,.05);
  --shadow-sm: 0 3px 12px rgba(0,0,0,.07);
  --shadow-md: 0 8px 32px rgba(0,0,0,.10);
  --shadow-lg: 0 20px 60px rgba(0,0,0,.14);

  /* 팝업 전용 다크 변수 (하위 호환) */
  --bg:          #0c0b09;
  --bg-02:       #131210;
  --surface:     rgba(255,255,255,.055);
  --surface-hv:  rgba(255,255,255,.09);
  --border:      rgba(255,255,255,.10);
  --border-hv:   rgba(255,255,255,.22);
  --accent-dk:   #7a5c2e;
  --accent-glow: rgba(184,146,74,.28);
  --text-1:      rgba(255,255,255,.92);
  --text-2:      rgba(255,255,255,.60);
  --text-3:      rgba(255,255,255,.35);
  --glass-bg:    rgba(255,255,255,.07);
  --glass-bg2:   rgba(255,255,255,.04);
  --glass-blur:  blur(24px) saturate(1.6);
  --glass-border:1px solid rgba(255,255,255,.12);
  --glass-shadow:0 8px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.1);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html {
  font-size: 16px; overflow-x: hidden;
  scroll-behavior: smooth;
  background: var(--white);
}
body {
  font-family: var(--font-kr);
  background: var(--off-white);
  color: var(--gray-900);
  line-height: 1.75;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; object-fit: cover; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; color: inherit; }

/* 스크롤바 */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, transparent, var(--accent-lt), transparent);
  border-radius: 99px;
}

/* ══════════════════════════════════════════
   서브페이지 공통 NAV — 메인과 동일 고급 스타일
══════════════════════════════════════════ */
#navbar {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 900; height: 72px;
  background: transparent;
  transition: background .35s ease, box-shadow .35s ease;
}

/* 서브페이지 기본 — 투명 */
#navbar.sub-page {
  background: transparent;
  box-shadow: none;
  border-bottom: none;
}

/* 스크롤 내려가면 불투명 전환 */
#navbar.sub-page.scrolled {
  background: rgba(255,255,255,.97);
  box-shadow: 0 1px 0 rgba(0,0,0,.07), 0 4px 20px rgba(0,0,0,.06);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* 흰 배경 위 — 로고·아이콘 다크 전환 */
#navbar.sub-page.scrolled .logo-default  { display: none; }
#navbar.sub-page.scrolled .logo-scrolled { display: block; }
#navbar.sub-page.scrolled .nav-sns-icon  { color: rgba(30,28,24,.75); text-shadow: none; }
#navbar.sub-page.scrolled .nav-sns-icon:hover { color: #1c1b18 !important; background: rgba(0,0,0,.06); }
#navbar.sub-page.scrolled .hamburger span { background: rgba(30,28,24,.85); }
#navbar.sub-page.scrolled .hamburger:hover { background: rgba(0,0,0,.07); }

#navbar .nav-inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 100%; padding: 0 2.5rem; max-width: 1280px; margin: 0 auto;
}

/* ── 로고 ── */
.nav-logo { display: flex; align-items: center; flex-shrink: 0; }
.nav-logo img {
  height: 28px; width: auto; display: block;
  transition: opacity .4s ease, transform .4s ease;
}
.nav-logo:hover img { opacity: .8; transform: scale(1.03); }
/* 기본: 흰색 로고 (히어로/다크 배경 위) */
.nav-logo .logo-default  { display: block; }
.nav-logo .logo-scrolled { display: none; }

/* ── 메뉴 링크: 드로어에서만 표시 ── */
.nav-links { display: none; }

/* ── 우측 영역 ── */
.nav-right { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.nav-sns { display: flex; align-items: center; gap: .1rem; }
/* 서브페이지 SNS 아이콘 — 흰색 (히어로 위 투명 배경) */
.nav-sns-icon {
  width: 34px; height: 34px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.85); font-size: .95rem;
  text-shadow: 0 1px 4px rgba(0,0,0,.4);
  transition: color .3s ease, background .3s ease, transform .3s ease;
}
.nav-sns-icon:hover {
  color: #fff !important;
  background: rgba(255,255,255,.15);
  transform: translateY(-1px);
  text-shadow: none;
}
.nav-sns-icon.insta-icon:hover { background: rgba(225,48,108,.35) !important; }
.nav-sns-icon.naver-icon:hover { background: rgba(3,199,90,.35) !important; }

/* ── 예약 버튼: 숨김 (드로어에서 처리) ── */
.nav-reserve-btn { display: none !important; }
.nav-reserve-btn::before {
  content: '';
  position: absolute; inset: 0;
  background: transparent;
  opacity: 0; transition: opacity .3s ease;
}
.nav-reserve-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(122,92,46,.45), inset 0 1px 0 rgba(255,255,255,.2);
}
.nav-reserve-btn:hover::before { opacity: 1; }

/* ── 햄버거 ── */
.hamburger {
  display: flex; flex-direction: column; justify-content: center;
  gap: 5px; width: 36px; height: 36px;
  border-radius: 9px; flex-shrink: 0; cursor: pointer; padding: 4px;
  transition: background .3s ease;
}
.hamburger:hover { background: rgba(255,255,255,.15); }
.hamburger span {
  display: block; height: 1.5px; background: rgba(255,255,255,.9);
  text-shadow: 0 1px 4px rgba(0,0,0,.4);
  border-radius: 2px;
  transition: transform .38s cubic-bezier(.4,0,.2,1),
              opacity .25s ease,
              width .3s ease;
  transform-origin: center;
}
.hamburger span:nth-child(2) { width: 70%; }
.hamburger:hover span:nth-child(2) { width: 100%; }
.hamburger.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* 서브페이지 body 상단 여백 없음 — navbar가 히어로 위에 오버레이 */
body { padding-top: 0; }

/* ── 모바일 드로어 ── */
.nav-drawer {
  display: none; position: fixed; inset: 0; z-index: 1100;
}
.drawer-backdrop {
  position: absolute; inset: 0;
  background: rgba(10,8,5,.6);
  backdrop-filter: blur(12px) saturate(1.4);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  opacity: 0;
  transition: opacity .45s cubic-bezier(.4,0,.2,1);
}
.drawer-panel {
  position: absolute; top: 0; right: 0;
  width: min(320px, 88vw); height: 100%;
  background: #fff;
  border-left: 1px solid rgba(184,146,74,.15);
  display: flex; flex-direction: column;
  transform: translateX(105%);
  transition: transform .5s cubic-bezier(.16,1,.3,1);
  box-shadow: -12px 0 60px rgba(0,0,0,.18);
  overflow: hidden;
}
.nav-drawer.open { display: block; }
.nav-drawer.open .drawer-backdrop { opacity: 1; pointer-events: auto; }
.nav-drawer.open .drawer-panel { transform: translateX(0); }

.drawer-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.3rem 1.5rem 1rem;
  border-bottom: 1px solid rgba(184,146,74,.12);
  flex-shrink: 0;
  background: linear-gradient(135deg, #fdfcf8 0%, #f9f5ec 100%);
}
.drawer-logo img { height: 24px; width: auto; }
.drawer-close {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--gray-100);
  display: flex; align-items: center; justify-content: center;
  color: var(--gray-500); font-size: .8rem;
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.drawer-close:hover {
  background: var(--accent-bg);
  color: var(--accent);
  transform: rotate(90deg);
}

.drawer-links {
  list-style: none; overflow-y: auto; flex: 1; padding: .8rem 0;
}
.drawer-links li {
  border-bottom: 1px solid rgba(0,0,0,.03);
}
.drawer-link {
  display: flex; align-items: center; gap: 1rem;
  padding: .9rem 1.5rem;
  font-size: .9rem; font-weight: 500; color: var(--gray-700);
  transition: color .3s ease, background .3s ease, padding-left .3s ease;
  position: relative;
}
.drawer-link::before {
  content: '';
  position: absolute; left: 0; top: 50%;
  transform: translateY(-50%) scaleY(0);
  width: 3px; height: 60%;
  background: linear-gradient(180deg, var(--accent-lt), var(--accent));
  border-radius: 0 3px 3px 0;
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.drawer-link:hover::before,
.drawer-link.active::before { transform: translateY(-50%) scaleY(1); }
.drawer-link:hover,
.drawer-link.active {
  color: var(--accent);
  background: linear-gradient(90deg, rgba(184,146,74,.06) 0%, transparent 100%);
  padding-left: 1.8rem;
}
.dl-icon {
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--gray-100);
  display: flex; align-items: center; justify-content: center;
  font-size: .82rem; color: var(--gray-400); flex-shrink: 0;
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.drawer-link:hover .dl-icon,
.drawer-link.active .dl-icon {
  background: rgba(184,146,74,.12);
  color: var(--accent-lt);
  transform: scale(1.08) rotate(-3deg);
}
.dl-text { font-size: .88rem; letter-spacing: .04em; }
.drawer-link-reserve .dl-text { color: var(--accent); font-weight: 700; }

/* 아이템 순차 등장 */
.nav-drawer.open .drawer-link {
  animation: drawerItemIn .5s cubic-bezier(.16,1,.3,1) both;
}
.nav-drawer.open .drawer-links li:nth-child(1) .drawer-link { animation-delay: .08s; }
.nav-drawer.open .drawer-links li:nth-child(2) .drawer-link { animation-delay: .13s; }
.nav-drawer.open .drawer-links li:nth-child(3) .drawer-link { animation-delay: .18s; }
.nav-drawer.open .drawer-links li:nth-child(4) .drawer-link { animation-delay: .23s; }
.nav-drawer.open .drawer-links li:nth-child(5) .drawer-link { animation-delay: .28s; }
.nav-drawer.open .drawer-links li:nth-child(6) .drawer-link { animation-delay: .33s; }
.nav-drawer.open .drawer-links li:nth-child(7) .drawer-link { animation-delay: .38s; }
@keyframes drawerItemIn {
  from { opacity: 0; transform: translateX(24px); }
  to   { opacity: 1; transform: translateX(0); }
}

.drawer-footer {
  padding: 1.1rem 1.5rem 1.5rem;
  border-top: 1px solid rgba(184,146,74,.12);
  flex-shrink: 0;
  background: linear-gradient(135deg, #fdfcf8 0%, #f9f5ec 100%);
}
.drawer-sns {
  display: flex; gap: .55rem; margin-bottom: .9rem;
}
.drawer-sns a {
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--gray-100); color: var(--gray-500);
  display: flex; align-items: center; justify-content: center;
  font-size: .95rem;
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.drawer-sns a:hover {
  background: var(--accent-bg);
  color: var(--accent);
  transform: translateY(-2px);
}
.drawer-copy {
  font-size: .68rem; color: var(--gray-300);
  letter-spacing: .05em; text-align: center;
}

/* ── 반응형 ── */
@media (max-width: 900px) {
  .nav-links li a { padding: 0 .6rem; font-size: .74rem; }
}
@media (max-width: 768px) {
  .nav-links { display: none; }
  /* SNS 아이콘은 모바일에서도 유지 */
  .nav-reserve-btn { display: none; }
  .hamburger { display: flex; }
  #navbar .nav-inner { padding: 0 1.2rem; }
}

/* ── 서브페이지 히어로 공통: navbar가 투명 오버레이 ── */
/* hero가 화면 맨 위부터 시작하고 navbar가 그 위에 투명하게 올라감 */
/* hero overlay의 content는 padding-top: 72px으로 navbar 아래 표시 */
.ep-hero .ep-hero-overlay,
.rp-hero .rp-hero-overlay,
.wine-hero .wine-hero-inner,
.notice-hero .notice-hero-overlay,
.res-hero .res-hero-overlay {
  padding-top: calc(72px + 1.5rem);
}

/* ============================================
   WINE PAGE
   ============================================ */

/* 히어로 배너 */
.wine-hero {
  position: relative;
  height: clamp(300px, 38vw, 420px);
  overflow: hidden;
}
.wine-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: url('../images/wine_outdoor.jpg') center/cover no-repeat;
  filter: blur(0px) brightness(.55) saturate(.8);
  transform: scale(1.04);
  transition: transform 8s ease;
}
.wine-hero:hover::before { transform: scale(1.08); }
.wine-hero::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(160deg, rgba(60,10,20,.7) 0%, rgba(10,8,5,.6) 100%);
}
.wine-hero-inner {
  padding: 2rem 1.6rem 2.2rem;
  position: relative; z-index: 1;
  display: flex; flex-direction: column; justify-content: flex-end;
  height: 100%;
}
.wine-hero-tag {
  display: inline-block;
  font-family: var(--font-en);
  font-size: .62rem; letter-spacing: .25em; text-transform: uppercase;
  color: var(--accent-lt); margin-bottom: .6rem;
  padding: .2rem .7rem;
  background: rgba(184,146,74,.12);
  border: 1px solid rgba(184,146,74,.25);
  border-radius: 20px;
  width: fit-content;
}
.wine-hero-title {
  font-family: var(--font-en);
  font-size: 2.4rem; font-weight: 400; line-height: 1.1;
  color: #fff;
}
.wine-hero-title em {
  font-style: italic;
  color: var(--accent-lt);
}
.wine-hero-desc {
  font-size: .82rem; color: rgba(255,255,255,.6);
  margin-top: .5rem;
}

/* 필터 바 */
.wine-filter-bar {
  display: flex; gap: .5rem;
  padding: .8rem 1.4rem;
  background: var(--white);
  border-bottom: 1px solid var(--gray-200);
  overflow-x: auto;
  scrollbar-width: none;
  position: sticky; top: 56px; z-index: 100;
}
.wine-filter-bar::-webkit-scrollbar { display: none; }
.wf-btn {
  flex-shrink: 0;
  padding: .4rem 1.1rem;
  border-radius: 20px;
  border: 1px solid var(--gray-200);
  font-size: .78rem; font-weight: 500;
  color: var(--gray-500);
  background: var(--white);
  transition: all var(--t);
}
.wf-btn:hover { border-color: var(--accent-lt); color: var(--accent); background: var(--accent-pale); }
.wf-btn.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
  box-shadow: 0 2px 12px rgba(122,92,46,.2);
}

/* 와인 카드 목록 */
.wine-main {
  padding: 1rem 1.4rem 2rem;
  display: flex; flex-direction: column; gap: 1rem;
  max-width: 720px; margin: 0 auto;
}

/* 와인 카드 */
.wine-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  animation: wineCardIn .4s ease both;
  transition: box-shadow var(--t), transform var(--t), border-color var(--t);
}
.wine-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
  border-color: var(--accent-lt);
}
@keyframes wineCardIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 카드 상단 */
.wc-top {
  display: flex; align-items: flex-start; gap: 1rem;
  padding: 1.2rem 1.4rem 1rem;
  border-bottom: 1px solid var(--gray-100);
}
.wc-badge {
  flex-shrink: 0;
  padding: .3rem .75rem;
  border-radius: 20px;
  font-size: .68rem; font-weight: 700; letter-spacing: .1em;
  margin-top: .2rem;
}
.wc-badge.white {
  background: var(--accent-pale);
  color: var(--accent);
  border: 1px solid rgba(184,146,74,.3);
}
.wc-badge.red {
  background: #fdf0f3;
  color: var(--wine-red);
  border: 1px solid rgba(139,26,46,.2);
}
.wc-info { flex: 1; }
.wc-name {
  font-size: .98rem; font-weight: 700;
  color: var(--gray-900); line-height: 1.35;
  letter-spacing: -.01em;
}
.wc-name-en {
  font-size: .72rem; color: var(--gray-400);
  font-family: var(--font-en); font-style: italic;
  margin-top: .12rem; line-height: 1.3;
}
.wc-price {
  margin-top: .5rem;
  font-family: var(--font-en);
  font-size: 1.1rem; font-weight: 500;
  color: var(--accent);
  letter-spacing: .02em;
}

/* 카드 바디: 스펙 + 미터 */
.wc-body {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0;
}
.wc-specs {
  padding: 1rem 1.2rem;
  border-right: 1px solid var(--gray-100);
  background: var(--gray-50);
}
.wcs-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: .28rem 0;
  font-size: .76rem;
  border-bottom: 1px solid var(--gray-100);
  gap: .5rem;
}
.wcs-row:last-child { border-bottom: none; }
.wcs-label {
  font-weight: 600; color: var(--accent);
  flex-shrink: 0; font-size: .72rem;
  letter-spacing: .02em;
}
.wcs-row span:last-child {
  color: var(--gray-500); text-align: right;
  font-size: .74rem;
}

/* 미터 바 */
.wc-meters {
  padding: 1rem 1.2rem;
  display: flex; flex-direction: column; justify-content: center; gap: .65rem;
}
.wc-meter {
  display: flex; align-items: center; gap: .6rem;
  font-size: .72rem; color: var(--gray-400);
}
.wc-meter > span:first-child { width: 26px; flex-shrink: 0; }
.wc-meter > span:last-child  { width: 28px; flex-shrink: 0; text-align: right; }
.wm-bar {
  flex: 1; height: 5px;
  background: var(--gray-200); border-radius: 3px; overflow: hidden;
}
.wm-fill {
  height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, var(--accent-lt), var(--accent));
  transition: width .8s cubic-bezier(.4,0,.2,1);
}
.wm-fill.red {
  background: linear-gradient(90deg, #e8a0b0, var(--wine-red));
}

/* 설명 */
.wc-desc {
  padding: .9rem 1.4rem 1.1rem;
  font-size: .8rem; color: var(--gray-400);
  line-height: 1.85;
  border-top: 1px solid var(--gray-100);
  background: var(--gray-50);
}

/* 하단 안내 */
.wine-footer-note {
  display: flex; align-items: center; gap: .8rem;
  padding: 1.4rem 1.6rem 2.4rem;
  max-width: 720px; margin: 0 auto;
}
.wine-footer-note i {
  font-size: 1.1rem; color: var(--accent-lt); flex-shrink: 0;
}
.wine-footer-note p {
  font-size: .8rem; color: var(--gray-400); line-height: 1.7;
}

/* ============================================
   COMMON SUBPAGE LAYOUT
   ============================================ */
.sub-hero {
  height: 220px;
  background-size: cover; background-position: center;
  position: relative;
  display: flex; align-items: flex-end;
  overflow: hidden;
}
.sub-hero::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(160deg, rgba(0,0,0,.2), rgba(0,0,0,.72));
}
.sub-hero-inner {
  position: relative; z-index: 1;
  padding: 1.8rem 1.6rem;
}
.sub-hero-tag {
  display: block;
  font-family: var(--font-en);
  font-size: .6rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--accent-lt); margin-bottom: .4rem;
}
.sub-hero-title {
  font-family: var(--font-en);
  font-size: 2rem; font-weight: 400; color: #fff; line-height: 1.1;
}
.sub-hero-desc {
  font-size: .78rem; color: rgba(255,255,255,.6); margin-top: .35rem;
}
.sub-main {
  padding: 1.4rem 1.4rem 3rem;
  max-width: 720px; margin: 0 auto;
}

/* CTA 버튼 */
.sub-cta {
  text-align: center;
  padding: 2rem 0 .5rem;
  border-top: 1px solid var(--gray-200);
  margin-top: 2rem;
}
.sub-cta p { font-size: .82rem; color: var(--gray-400); margin-bottom: .9rem; }
.sub-cta-btn {
  display: inline-flex; align-items: center;
  padding: .75rem 2rem;
  background: var(--accent);
  border: 1px solid var(--accent);
  color: #fff;
  border-radius: 40px; font-size: .88rem; font-weight: 600;
  box-shadow: 0 4px 20px rgba(122,92,46,.25);
  transition: background var(--t), transform var(--t);
}
.sub-cta-btn:hover { background: var(--accent-lt); transform: translateY(-2px); }

/* ── NOTICE 페이지 ── */
.notice-quick-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: .7rem; margin-bottom: 1.6rem;
}
.nq-card {
  display: flex; align-items: center; gap: .9rem;
  padding: 1rem 1.1rem;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  box-shadow: var(--shadow-xs);
  transition: transform var(--t), border-color var(--t), box-shadow var(--t);
}
.nq-card:hover { transform: translateY(-2px); border-color: var(--accent-lt); box-shadow: var(--shadow-sm); }
.nq-card i {
  font-size: 1.1rem; color: var(--accent-lt);
  width: 24px; text-align: center; flex-shrink: 0;
}
.nq-card strong { display: block; font-size: .72rem; color: var(--gray-400); margin-bottom: .1rem; }
.nq-card span   { font-size: .82rem; font-weight: 600; color: var(--gray-900); }

/* 서브페이지 아코디언 */
.sub-accordion { display: flex; flex-direction: column; gap: .5rem; }
.sa-item {
  border: 1px solid var(--gray-200);
  border-radius: 12px; overflow: hidden;
  background: var(--white);
  box-shadow: var(--shadow-xs);
  transition: border-color var(--t), box-shadow var(--t);
}
.sa-item.open { border-color: var(--accent-lt); box-shadow: var(--shadow-sm); }
.sa-btn {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.2rem;
  font-size: .88rem; font-weight: 600; color: var(--gray-900);
  text-align: left;
  transition: color var(--t), background var(--t);
}
.sa-btn:hover { background: var(--gray-50); color: var(--accent); }
.sa-item.open .sa-btn { color: var(--accent); background: var(--accent-pale); }
.sa-btn span { display: flex; align-items: center; gap: .6rem; }
.sa-btn i:not(.sa-icon) { color: var(--accent-lt); font-size: .9rem; }
.sa-icon { color: var(--gray-300); transition: transform .3s ease; font-size: .75rem; }
.sa-item.open .sa-icon { transform: rotate(180deg); color: var(--accent); }
.sa-body {
  max-height: 0; overflow: hidden;
  transition: max-height .35s ease, padding .35s ease;
  padding: 0 1.2rem;
  border-top: 0px solid var(--gray-100);
}
.sa-item.open .sa-body {
  max-height: 600px;
  padding: .8rem 1.2rem 1.1rem;
  border-top: 1px solid var(--gray-100);
}
.sa-list { list-style: none; display: flex; flex-direction: column; gap: .45rem; }
.sa-list li {
  font-size: .82rem; color: var(--gray-500);
  padding-left: .8rem; position: relative; line-height: 1.7;
}
.sa-list li::before {
  content: '·'; position: absolute; left: 0; color: var(--accent-lt); font-weight: 700;
}
.sa-service-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: .55rem;
}
.sa-svc {
  display: flex; align-items: center; gap: .6rem;
  padding: .55rem .7rem;
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: 8px;
  font-size: .78rem; color: var(--gray-700);
  transition: background var(--t), border-color var(--t);
}
.sa-svc:hover { background: var(--accent-pale); border-color: var(--accent-lt); }
.sa-svc i { color: var(--accent-lt); width: 16px; text-align: center; flex-shrink: 0; }

/* ── FACILITIES 페이지 ── */
.fac-type-bar {
  display: flex; flex-wrap: wrap; gap: .5rem;
  margin-bottom: 1.4rem;
}
.fac-type-badge {
  display: flex; align-items: center; gap: .45rem;
  padding: .38rem .9rem;
  background: var(--accent-pale);
  border: 1px solid rgba(184,146,74,.25);
  border-radius: 20px;
  font-size: .76rem; font-weight: 500; color: var(--accent);
  transition: background var(--t);
}
.fac-type-badge:hover { background: rgba(184,146,74,.18); }
.fac-type-badge i { font-size: .75rem; }
.fac-card-grid { display: flex; flex-direction: column; gap: 1rem; }

.fac-pg-card {
  display: grid; grid-template-columns: 140px 1fr;
  border: 1px solid var(--gray-200); border-radius: 14px;
  overflow: hidden;
  background: var(--white);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--t), transform var(--t), border-color var(--t);
}
.fac-pg-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); border-color: var(--accent-lt); }
.fpc-img-wrap { height: 130px; overflow: hidden; }
.fpc-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.fac-pg-card:hover .fpc-img-wrap img { transform: scale(1.06); }
.fpc-info { padding: .9rem 1rem; display: flex; flex-direction: column; justify-content: center; gap: .3rem; }
.fpc-info h3 { font-size: .9rem; font-weight: 700; color: var(--gray-900); }
.fpc-info p  { font-size: .76rem; color: var(--gray-400); line-height: 1.7; }
.fpc-tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .3rem; }
.fpc-tags span {
  font-size: .66rem; padding: .18rem .55rem;
  background: var(--gray-100);
  border: 1px solid var(--gray-200);
  border-radius: 10px; color: var(--gray-400);
}

/* ── EVENTS 페이지 ── */
.special-list { display: flex; flex-direction: column; gap: 1rem; }
.sp-card {
  display: grid; grid-template-columns: 130px 1fr;
  border: 1px solid var(--gray-200); border-radius: 14px;
  overflow: hidden;
  background: var(--white);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--t), border-color var(--t);
}
.sp-card:hover { box-shadow: var(--shadow-md); border-color: var(--accent-lt); }
.sp-img { height: 130px; overflow: hidden; }
.sp-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.sp-card:hover .sp-img img { transform: scale(1.06); }
.sp-info { padding: .9rem 1rem; display: flex; flex-direction: column; gap: .3rem; }
.sp-tag {
  display: inline-block;
  font-size: .62rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--accent-lt); font-weight: 600;
}
.sp-info h3 { font-size: .9rem; font-weight: 700; color: var(--gray-900); }
.sp-info p  { font-size: .76rem; color: var(--gray-400); line-height: 1.7; }
.sp-price { font-size: .78rem; color: var(--accent); font-weight: 600; margin-top: .2rem; }
.sp-link-btn {
  display: inline-flex; align-items: center; gap: .2rem;
  font-size: .76rem; color: var(--accent); font-weight: 600;
  margin-top: .3rem;
  transition: gap var(--t), color var(--t);
}
.sp-link-btn:hover { gap: .4rem; color: var(--gray-900); }

/* 모바일 */
@media (max-width: 480px) {
  .wine-hero { height: 200px; }
  .wine-hero-title { font-size: 2rem; }
  .wc-body { grid-template-columns: 1fr; }
  .wc-specs { border-right: none; border-bottom: 1px solid var(--gray-100); }
  .wine-main { padding: 1rem 1rem 2rem; }
  .wc-top { padding: 1rem 1rem .85rem; }
  .wc-specs, .wc-meters { padding: .85rem 1rem; }
  .wc-desc { padding: .8rem 1rem 1rem; }

  .notice-quick-grid { grid-template-columns: repeat(2,1fr); gap: .5rem; }
  .fac-pg-card { grid-template-columns: 110px 1fr; }
  .fpc-img-wrap { height: 110px; }
  .sp-card { grid-template-columns: 110px 1fr; }
  .sp-img { height: 110px; }
  .sub-main { padding: 1.2rem 1rem 2.5rem; }
  .sa-service-grid { grid-template-columns: 1fr; }
}