/* ═══════════════════════════════════
   해운대 고구려 — 디자인 (style.css)
   색상 바꾸려면 아래 :root 값만 수정
═══════════════════════════════════ */
:root{
  --bg:#090806;          /* 배경 (딥 블랙) */
  --card:#12100d;        /* 카드 배경 */
  --gold:#C8A96A;        /* 샴페인 골드 */
  --gold-light:#E2C98F;  /* 밝은 골드 (강조 단어용) */
  --ivory:#F3EFE8;       /* 아이보리 (제목·본문 기본) */
  --gray:#B9B2A9;        /* 웜 그레이 (보조 글자) */
  --txt:#F3EFE8;
  --sub:#B9B2A9;
  --hero-dark:.08;       /* 히어로 어두움 정도(스크롤하면 JS가 자동 증가) */
}

/* ── 기본 ── */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip;width:100%}
/* 폰트 2종 원칙: 제목=Noto Serif KR(명조) / 본문=Pretendard(고딕) / 영문 소제목=Cormorant Garamond */
body{background:var(--bg);color:var(--txt);font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif;line-height:1.7;overflow-x:clip;width:100%;position:relative}
h1,h2,h3{font-family:'Noto Serif KR',serif;font-weight:600}
a{color:inherit;text-decoration:none}
section{padding:80px 20px;max-width:1100px;margin:0 auto}
.label{color:var(--gold);font-size:15px;letter-spacing:4px;text-transform:uppercase;font-family:'Cormorant Garamond','Noto Serif KR',serif}
h2{font-size:32px;margin:8px 0 40px}
h3{font-size:18px;margin:16px 0 8px}
.sub{color:var(--sub)}
.gold{color:var(--gold)}
.bold{font-weight:700}
.note{margin-top:20px}
.price{margin-top:12px;color:var(--gold)}
.stars{color:#f2c14e;letter-spacing:1px}
.reviewer{margin-top:10px}
/* 후기 카드 (구글 리뷰 스타일) */
#review{text-align:center;position:relative;overflow:hidden;max-width:none;
  background:linear-gradient(rgba(9,8,6,.55),rgba(9,8,6,.55)),url('images/review-bg.jpg') center/cover no-repeat}
#review>*{position:relative;z-index:2}
#review .rev-wrap{max-width:1060px;margin-left:auto;margin-right:auto}
#review::before,#review::after{content:"";position:absolute;left:0;right:0;height:110px;z-index:1;pointer-events:none}
#review::before{top:0;background:linear-gradient(180deg,var(--bg) 0%,transparent 100%)}
#review::after{bottom:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 100%)}
#review .card{background:rgba(18,16,13,.55);backdrop-filter:blur(3px)}
/* 접기/펼치기: 접힌 상태 = 첫 줄 3개 + 둘째 줄 절반 */
.rev-wrap{position:relative;max-height:540px;overflow:hidden;transition:max-height .7s ease}
.rev-wrap.open{max-height:3200px}
.rev-wrap::after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;pointer-events:none;
  background:linear-gradient(0deg,rgba(9,8,6,.95),transparent);opacity:1;transition:opacity .5s}
.rev-wrap.open::after{opacity:0}
.rev-toggle{margin-top:22px;background:none;border:1px solid rgba(200,169,106,.5);color:var(--gold);
  padding:12px 34px;border-radius:30px;font-size:15px;cursor:pointer;font-family:inherit;transition:all .3s}
.rev-toggle:hover{background:var(--gold);color:#090806}
.rev-grid .card{text-align:left}
.rev-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.rev-avatar{width:44px;height:44px;border-radius:50%;background:#33353a;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:#e8e8e8;font-weight:700;font-size:17px}
.rev-name{margin:0;font-weight:700;color:var(--ivory)}
.rev-meta{margin:2px 0 0;color:var(--sub);font-size:13px}
.rev-body{color:#dcd7cb;font-size:15px;line-height:1.75}

/* ── 그리드 & 카드 ── */
.grid{display:grid;gap:20px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.map-grid{grid-template-columns:1.2fr 1fr}
.card{background:var(--card);border:1px solid #222;border-radius:12px;padding:28px;
  transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
/* 카드 호버: 살짝 떠오르며 골드 테두리 + 은은한 그림자 */
.card:hover{transform:translateY(-6px);border-color:rgba(200,169,106,.55);
  box-shadow:0 16px 40px rgba(0,0,0,.45),0 0 24px rgba(200,169,106,.12)}
.card:hover .card-icon{transform:scale(1.12)}
.card-icon{transition:transform .35s ease}
/* 섹션2(About) 중앙정렬 + 배경 슬라이드 */
#about{text-align:center;position:relative;overflow:hidden;max-width:none}
/* ── 섹션 경계 부드럽게: 위·아래 가장자리가 배경색으로 서서히 녹아듦 ── */
#about::before,#about::after,#choice::before,#choice::after{
  content:"";position:absolute;left:0;right:0;height:110px;z-index:1;pointer-events:none}
#about::before,#choice::before{top:0;background:linear-gradient(180deg,var(--bg) 0%,transparent 100%)}
#about::after,#choice::after{bottom:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 100%)}
#choice>*{position:relative;z-index:2}

/* 섹션5(Why) — 배경 + 2x2 배너 */
#why{text-align:center;position:relative;overflow:hidden;max-width:none;
  background:linear-gradient(rgba(9,8,6,.5),rgba(9,8,6,.5)),url('images/why-bg.jpg') center/cover no-repeat}
#why>*{position:relative;z-index:2}
#why::before,#why::after{content:"";position:absolute;left:0;right:0;height:110px;z-index:1;pointer-events:none}
#why::before{top:0;background:linear-gradient(180deg,var(--bg) 0%,transparent 100%)}
#why::after{bottom:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 100%)}
.why-rows{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:1100px;margin:0 auto} /* 2x2 배치 */
.why-row{position:relative;min-height:230px;display:flex;align-items:flex-end;text-align:left;
  border:1px solid rgba(200,169,106,.45);border-radius:14px;overflow:hidden;
  transition:border-color .35s ease,box-shadow .35s ease}
.why-bg{position:absolute;inset:0;background-size:cover;background-position:center 30%;
  transition:transform 1.4s cubic-bezier(.16,1,.3,1)}
/* 아래쪽(글자 영역)만 살짝 어둡고 사진은 잘 보이게 */
.why-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(9,8,6,.72) 0%,rgba(9,8,6,.25) 38%,rgba(9,8,6,0) 60%)}
.why-txt{position:relative;z-index:1;padding:26px 34px}
.why-txt h3{margin:0 0 6px;font-size:22px;color:var(--gold-light)}
.why-row:hover{border-color:rgba(200,169,106,.9);box-shadow:0 0 28px rgba(200,169,106,.15)}
.why-row:hover .why-bg{transform:scale(1.05)}
@media(max-width:768px){.why-rows{grid-template-columns:1fr}.why-row{min-height:180px}.why-txt{padding:22px 24px}}

/* ── 공지사항~오시는길 공통 배경 (섹션4와 같은 골드 웨이브, 하나로 이어짐) ── */
.bottom-bg{position:relative;
  background:linear-gradient(rgba(9,8,6,.6),rgba(9,8,6,.6)),url('images/menu-bg.jpg') center/cover no-repeat}
.bottom-bg>section{position:relative;z-index:2}
.bottom-bg::before,.bottom-bg::after{content:"";position:absolute;left:0;right:0;height:120px;z-index:1;pointer-events:none}
.bottom-bg::before{top:0;background:linear-gradient(180deg,var(--bg) 0%,transparent 100%)}
.bottom-bg::after{bottom:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 100%)}
.bottom-bg .card{background:rgba(18,16,13,.55);backdrop-filter:blur(3px)}

/* ── 문의하기 ── */
#inquiry{text-align:center}
.inq-desc{margin:-14px auto 34px}
.inq-form{max-width:760px;margin:0 auto 34px;text-align:left}
.inq-top{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.inq-form input[type=text],.inq-form input[type=password],#inq-name,#inq-pw,.inq-form textarea{
  background:#14110d;border:1px solid rgba(255,255,255,.12);border-radius:10px;
  color:var(--ivory);padding:13px 16px;font-family:inherit;font-size:15px;outline:none;
  transition:border-color .3s}
.inq-form input:focus,.inq-form textarea:focus{border-color:var(--gold)}
#inq-name{width:200px}
.inq-vis{display:flex;align-items:center;gap:14px;color:var(--sub);font-size:15px}
.inq-vis label{display:flex;align-items:center;gap:6px;cursor:pointer}
.inq-vis input[type=radio]{accent-color:#C8A96A}
#inq-pw{width:140px;display:none}
.inq-form textarea{width:100%;resize:vertical;margin-bottom:16px}
.inq-form .btn{border:none;cursor:pointer;font-family:inherit;font-size:15px}
/* 문의 목록 */
.inq-list{max-width:760px;margin:0 auto;text-align:left;display:flex;flex-direction:column;gap:12px}
.inq-item{background:var(--card);border:1px solid #222;border-radius:12px;padding:18px 24px;cursor:pointer;
  transition:border-color .3s}
.inq-item:hover{border-color:rgba(200,169,106,.45)}
.inq-meta{display:flex;gap:12px;align-items:center;color:var(--sub);font-size:13px;margin-bottom:6px}
.inq-meta .inq-who{color:var(--ivory);font-weight:700;font-size:15px}
.inq-lock{color:var(--gold)}
.inq-body{color:#dcd7cb;font-size:15px;white-space:pre-wrap}
.inq-secret{color:var(--sub);font-size:14px}
.inq-empty{color:var(--sub);text-align:center;padding:10px}
/* 문의 답글 */
.inq-comments{margin-top:14px;border-top:1px dashed rgba(255,255,255,.12);padding-top:12px}
.inq-c{margin:10px 0;padding-left:14px;border-left:2px solid rgba(200,169,106,.45)}
.inq-c b{color:var(--gold-light);font-size:14px}
.inq-c span{color:var(--sub);font-size:12px}
.inq-c p{margin:3px 0 0;color:#d5d0c4;font-size:14px;white-space:pre-wrap}
.inq-c-form{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.inq-c-form input{background:#14110d;border:1px solid rgba(255,255,255,.12);border-radius:8px;
  color:var(--ivory);padding:9px 12px;font-family:inherit;font-size:14px;outline:none}
.inq-c-form input:focus{border-color:var(--gold)}
.inq-c-form .c-text{flex:1;min-width:180px}
.c-admin{background:none;border:none;color:var(--sub);font-size:13px;cursor:pointer;
  font-family:inherit;padding:4px 0;margin-top:8px;transition:color .3s}
.c-admin:hover{color:var(--gold)}
.inq-c-form .c-btn{border:none;cursor:pointer;padding:9px 20px;margin:0;font-size:14px;border-radius:8px}

/* ── 오시는 길 ── */
#contact{text-align:center}
.map-box{border-radius:16px;overflow:hidden;border:1px solid rgba(200,169,106,.3);min-height:460px}
.map-box iframe{width:100%;height:100%;min-height:460px;border:0;display:block;filter:saturate(.85)}
.loc-info{text-align:left;display:flex;flex-direction:column;justify-content:center}
.loc-row{display:flex;align-items:center;gap:20px;padding:20px 4px;margin:0;
  border-bottom:1px solid rgba(255,255,255,.07)}
.loc-row:first-child{padding-top:4px}
.loc-ico{width:52px;height:52px;border-radius:14px;background:#1d1a14;border:1px solid rgba(200,169,106,.25);
  display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.loc-ico svg{width:22px;height:22px}
.loc-row h3{margin:0 0 4px;font-size:17px}
.loc-row p{margin:0;line-height:1.6}
.loc-tel{font-family:'Noto Serif KR',serif;font-size:24px;font-weight:700;color:var(--gold);letter-spacing:.02em}
.loc-info .btn{align-self:stretch;text-align:center;margin-top:24px}
@media(max-width:768px){.map-box,.map-box iframe{min-height:320px}}

/* ── 공지사항: 가로 행 배치 ── */
#notice{text-align:center}
.notice-rows{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1100px;margin:0 auto} /* 1x3 가로 배치 */
.notice-row{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding:32px 26px;
  border-left:none;border-top:3px solid rgba(200,169,106,.35)}
@media(max-width:768px){.notice-rows{grid-template-columns:1fr}}
.notice-row:hover{border-top-color:var(--gold)}
.notice-ico{width:56px;height:56px;border-radius:50%;background:#1d1a14;border:1px solid rgba(200,169,106,.25);
  display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.notice-ico svg{width:24px;height:24px}
.notice-txt h3{margin:0 0 4px;font-size:19px}
.notice-txt .sub{margin:0}

/* ── 섹션6(서비스) 아이콘 카드 + 이벤트 강조 카드 ── */
#service{text-align:center;position:relative;overflow:hidden;max-width:none;
  background:linear-gradient(rgba(9,8,6,.5),rgba(9,8,6,.5)),url('images/choice-bg.jpg') center/cover no-repeat}
#service>*{position:relative;z-index:2}
#service .grid{max-width:1060px;margin-left:auto;margin-right:auto}
#service::before,#service::after{content:"";position:absolute;left:0;right:0;height:110px;z-index:1;pointer-events:none}
#service::before{top:0;background:linear-gradient(180deg,var(--bg) 0%,transparent 100%)}
#service::after{bottom:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 100%)}
#service .card{background:rgba(18,16,13,.5);backdrop-filter:blur(3px)}
.svc-ico{width:64px;height:64px;border-radius:50%;background:#1d1a14;border:1px solid rgba(200,169,106,.2);
  display:flex;align-items:center;justify-content:center;margin:4px auto 10px;color:var(--gold)}
.svc-ico svg{width:26px;height:26px}
.event-card{max-width:640px;margin:26px auto 0;padding:46px 40px}
.event-ico{width:88px;height:88px;border-radius:50%;margin:0 auto 18px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,#E2C98F,#C8A96A);color:#090806;
  box-shadow:0 8px 30px rgba(200,169,106,.25)}
.event-ico svg{width:38px;height:38px}
.event-card h3{font-size:26px;margin:8px 0 10px}
.event-sub{color:var(--gold);font-size:17px}

/* 섹션3(맞춤 초이스) 중앙정렬 + 배경 (사진 교체: images/choice-bg.jpg) */
#choice{text-align:center;position:relative;overflow:hidden;max-width:none;
  background:linear-gradient(rgba(9,8,6,.5),rgba(9,8,6,.5)),url('images/choice-bg.jpg') center/cover no-repeat}
#choice .grid{max-width:1060px;margin-left:auto;margin-right:auto}
#choice .card{background:rgba(18,16,13,.5);backdrop-filter:blur(3px)}
#choice h3{color:var(--ivory)}
/* 카드 사진: 호버 시 줌인(빨려드는 느낌) */
.img-wrap{overflow:hidden;border-radius:10px}
.card-img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center 20%;display:block;
  filter:brightness(.9); /* 어두운 막 10% */
  transition:transform 1.4s cubic-bezier(.16,1,.3,1),filter 1.4s ease}
.card:hover .card-img{transform:scale(1.12);filter:brightness(1.02)}
#choice h3 .gold-em{font-style:normal;color:var(--gold)}
.choice-sub{color:var(--ivory);margin:-14px auto 34px;max-width:560px}
.choice-note{color:var(--gold-light);font-family:'Noto Serif KR',serif;font-size:17px;margin-top:36px}
/* 무드 선택기 */
.mood-picker{margin-top:54px}
.mood-q{color:var(--ivory);font-family:'Noto Serif KR',serif;font-size:24px;font-weight:600;margin-bottom:24px;
  text-shadow:0 2px 8px rgba(0,0,0,.7)}
.mood-btns{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.mood-btn{background:rgba(18,16,13,.65);border:1px solid rgba(200,169,106,.45);color:var(--ivory);
  padding:18px 44px;border-radius:40px;font-size:18px;cursor:pointer;font-family:inherit;
  animation:mood-breathe 3s ease-in-out infinite; /* 은은하게 빛나며 클릭 유도 */
  transition:all .3s ease}
.mood-btn:nth-child(2){animation-delay:1s}
.mood-btn:nth-child(3){animation-delay:2s}
@keyframes mood-breathe{0%,100%{box-shadow:0 0 0 rgba(200,169,106,0)}50%{box-shadow:0 0 22px rgba(200,169,106,.35)}}
.mood-btn:hover{border-color:var(--gold);color:var(--gold-light);transform:translateY(-4px) scale(1.05);
  box-shadow:0 10px 30px rgba(0,0,0,.5),0 0 26px rgba(200,169,106,.4);animation:none}
.mood-btn:active{transform:translateY(-1px) scale(.97)}
.mood-btn.on{background:var(--gold);color:#090806;border-color:var(--gold);font-weight:700;animation:none;
  box-shadow:0 8px 28px rgba(200,169,106,.45)}
.mood-result{min-height:1.8em;margin-top:24px;color:var(--gold-light);font-size:18px;transition:opacity .4s}
@media(max-width:768px){.mood-q{font-size:19px}.mood-btn{padding:14px 30px;font-size:16px}}
.mood-result a{color:var(--gold);text-decoration:underline}
/* 선택된 무드 카드 하이라이트 */
#choice .card.picked{border-color:var(--gold);box-shadow:0 0 34px rgba(200,169,106,.28);transform:translateY(-6px)}

/* ── 섹션4(주류 안내) 배경 + 가격 카드 ── */
#menu{position:relative;overflow:hidden;max-width:none;
  background:linear-gradient(rgba(9,8,6,.5),rgba(9,8,6,.5)),url('images/menu-bg.jpg') center/cover no-repeat}
#menu>*{position:relative;z-index:2}
#menu .grid,#menu .menu-wide{max-width:1060px;margin-left:auto;margin-right:auto}
#menu::before,#menu::after{content:"";position:absolute;left:0;right:0;height:110px;z-index:1;pointer-events:none}
#menu::before{top:0;background:linear-gradient(180deg,var(--bg) 0%,transparent 100%)}
#menu::after{bottom:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 100%)}
#menu .card{background:rgba(18,16,13,.3);backdrop-filter:blur(3px)}
/* 섹션4 타이틀 중앙정렬 */
#menu{text-align:center}
#menu .menu-card{text-align:left}
#menu .menu-wide{margin-top:20px}

.menu-card{padding:36px 40px}
.menu-card.featured{border-color:rgba(200,169,106,.5)} /* 17년산 골드 테두리 강조 */
.menu-head{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.menu-head h3{margin:0;font-size:22px}
.menu-ico{width:38px;height:38px;border-radius:50%;background:#1d1a14;border:1px solid rgba(200,169,106,.3);
  display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:13px;flex-shrink:0}
.menu-ico svg{width:19px;height:19px}
/* 가격 카드 상단 사진 (가로형) */
.menu-img{margin-bottom:24px}
.menu-img .card-img{aspect-ratio:16/9}
.menu-row{display:flex;justify-content:space-between;align-items:center;margin:16px 0}
.menu-row span{color:var(--sub)}
.menu-row strong{font-family:'Noto Serif KR',serif;font-size:18px;color:var(--ivory)}
.menu-row strong.gold{color:var(--gold)}
/* 전화문의 클릭 → 바로 전화 */
.menu-row .tel-link{font-family:'Noto Serif KR',serif;font-size:18px;font-weight:700;color:var(--gold);
  transition:color .3s}
.menu-row .tel-link:hover{color:var(--gold-light);text-decoration:underline}
.menu-row .tel-link.wh{color:var(--ivory)}
.menu-row .tel-link.wh:hover{color:#fff}
.menu-div{border:none;border-top:1px solid rgba(255,255,255,.1);margin:24px 0}
.menu-label{color:var(--sub);margin-bottom:12px}
.menu-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 16px} /* 구성 2열 */
.menu-list li{margin:6px 0;color:var(--ivory)}
@media(max-width:768px){.menu-list{grid-template-columns:1fr}}
.menu-list li::before{content:"✓";color:var(--gold);margin-right:12px}
.menu-note{color:var(--sub);font-size:14px;margin-top:22px}
.menu-wide{margin-top:20px;text-align:center}
.menu-wide h3{margin-top:0}
/* 프리미엄 위스키 세팅 */
.premium-head{display:flex;align-items:center;justify-content:center;gap:14px;max-width:1060px;margin:48px auto 22px}
.premium-head h3{margin:0;font-size:22px}
.premium-img{position:relative}
.premium-img .ph{aspect-ratio:16/9;min-height:0}
.premium-badge{position:absolute;top:14px;right:14px;z-index:2;
  background:var(--gold);color:#000;font-size:12px;font-weight:700;letter-spacing:.08em;
  padding:5px 16px;border-radius:20px;
  animation:badge-breathe 2.8s ease-in-out infinite} /* 희미해졌다 보였다 */
@keyframes badge-breathe{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.premium-badge{animation:none}}
.premium-title{font-size:22px;margin:0 0 6px}
.menu-row strong.sm{font-size:18px}
/* 기타 프리미엄 라인업 카드 */
.lineup-card{max-width:1060px;margin:20px auto 0;text-align:center;padding:0 24px 34px;overflow:hidden}
.lineup-img{margin:0 -24px 26px;border-radius:0}
.lineup-img .card-img{aspect-ratio:21/9}
.chip-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:16px 0 8px}
.chip{background:#1d1a14;border:1px solid rgba(255,255,255,.1);border-radius:30px;padding:10px 24px;color:var(--ivory);font-size:15px}
.lineup-card .menu-note{margin-top:16px}
#menu .grid+.grid{margin-top:0}
#about>*{position:relative;z-index:2}
#about .grid{max-width:1060px;margin-left:auto;margin-right:auto}
#about>.about-bg{position:absolute;inset:0;z-index:0}
/* 3장 나란히 → 5초마다 세트 교체 */
.bg-group{position:absolute;inset:0;display:flex;opacity:0;transition:opacity 1.6s}
.bg-group.active{opacity:1}
.bg-panel{flex:1;background-size:cover;background-position:center 20%}
/* 패널 사이 흰 틈 제거 (넉넉히 겹치게) */
.bg-panel:not(:first-child){margin-left:-10px}
.bg-group{background:#090806}
/* 배경 위 어두운 막 — 글자 있는 중앙만 어둡고 바깥쪽으로 서서히 사라짐 */
.about-bg::after{content:"";position:absolute;inset:0;z-index:1;
  background:radial-gradient(ellipse 55% 80% at 50% 34%,rgba(9,8,6,.68) 0%,rgba(9,8,6,.32) 52%,rgba(9,8,6,0) 78%)}
/* 타이틀 가독성 */
#about .label{color:var(--gold-light);text-shadow:0 1px 8px rgba(0,0,0,.95)}
#about h2{text-shadow:0 2px 10px rgba(0,0,0,.95),0 0 34px rgba(0,0,0,.7)}
#about .card{background:rgba(18,16,13,.38);backdrop-filter:blur(3px)}
/* 카드 상단 아이콘 (샴페인 골드 라인) */
.card-icon{width:40px;height:40px;color:var(--gold);display:block;margin:2px auto 6px}
.card h3:first-child{margin-top:0}

/* ── 사진 자리표시자 ── */
.ph{background:#1c1c1c;border:1px dashed #444;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#555;font-size:14px;min-height:180px}
.ph.map{min-height:320px}

/* ── 버튼 ── */
.btn{display:inline-block;background:var(--gold);color:#000;font-weight:700;padding:14px 36px;border-radius:50px;margin-top:16px;transition:opacity .2s}
.btn:hover{opacity:.85}
.btn.line{background:none;border:1px solid var(--gold);color:var(--gold)}
.btn.big{font-size:20px}

/* ── 헤더 ── */
/* 고정 헤더: 스크롤 내려도 항상 따라옴 (모바일 포함) */
header{position:fixed;top:0;left:0;right:0;background:rgba(10,10,10,.92);backdrop-filter:blur(8px);border-bottom:1px solid #1e1e1e;z-index:50;transition:box-shadow .3s}
body{padding-top:73px} /* 고정 헤더 높이만큼 본문 내림 */
section[id]{scroll-margin-top:84px} /* 메뉴 이동 시 제목이 헤더에 안 가리게 */
header.scrolled{box-shadow:0 2px 20px rgba(0,0,0,.6)}
header .in{max-width:1100px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between}
header .logo{display:flex;align-items:center;gap:12px}
header .logo img{height:44px;width:auto}
header .logo img.wm{height:20px}
.hero-logo{height:130px;width:auto;margin:0 auto 20px;display:block}
.hero-wm{width:min(440px,80vw);height:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
nav a{margin-left:22px;font-size:15px;color:var(--sub);transition:color .2s}
nav a:hover,nav a.active{color:var(--gold)}
nav .nav-call{color:var(--gold)}

/* ── 관리자 자물쇠 (우측 상단) ── */
.admin-lock{background:none;border:none;cursor:pointer;padding:6px;margin-left:14px;
  color:#5a554d;transition:color .3s}
.admin-lock:hover{color:var(--gold)}
.admin-lock.on{color:var(--gold)}
.admin-lock svg{width:20px;height:20px;display:block}
.admin-lock.pop{animation:lock-pop .45s cubic-bezier(.34,1.56,.64,1)}
@keyframes lock-pop{0%{transform:scale(1)}40%{transform:scale(1.45) rotate(-8deg)}100%{transform:scale(1)}}
/* 로그인/로그아웃 토스트 */
.admin-toast{position:fixed;top:74px;left:50%;transform:translateX(-50%) translateY(0);z-index:99;
  background:rgba(18,16,13,.95);border:1px solid rgba(255,255,255,.15);color:var(--ivory);
  padding:12px 26px;border-radius:30px;font-size:15px;box-shadow:0 10px 30px rgba(0,0,0,.5);
  animation:toast-in .4s cubic-bezier(.16,1,.3,1);transition:opacity .5s,transform .5s}
.admin-toast.gold{border-color:rgba(200,169,106,.6);color:var(--gold-light)}
.admin-toast.hide{opacity:0;transform:translateX(-50%) translateY(-14px)}
@keyframes toast-in{from{opacity:0;transform:translateX(-50%) translateY(-14px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
/* 모바일: 토스트 항상 화면 정중앙 */
@media(max-width:768px){
  .admin-toast{left:50%;right:auto;width:max-content;max-width:86vw;text-align:center;font-size:14px;padding:11px 22px}
}

/* ── 햄버거 (모바일) ── */
#hamburger{display:none;background:none;border:none;cursor:pointer;padding:6px}
#hamburger span{display:block;width:24px;height:2px;background:var(--gold);margin:5px 0;transition:.3s}
#hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
#hamburger.open span:nth-child(2){opacity:0}
#hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ── 히어로 ──
   배경 사진: images/hero.jpg 파일만 교체하면 됨
   사진이 밝으면 아래 .65 / .85 숫자를 키우면 글자가 잘 보임 */
.hero{min-height:80vh;display:flex;flex-direction:column;justify-content:center;text-align:center;
  max-width:none;width:100%;overflow-x:clip; /* 좌우 밀림 방지(스티키 배경 유지형) */
  background:var(--bg);z-index:0}
/* 배경사진 레이어 — 화면 기준 크기(예전 비율 유지) + 천천히 확대↔축소 (켄번즈) */
.hero-bg{position:absolute;inset:0;z-index:-1;overflow:clip;pointer-events:none}
.hero-bg::before{content:"";position:sticky;top:0;display:block;
  height:100vh;height:var(--heroH,100svh); /* JS가 접속 시 픽셀 고정 → 주소창 접혀도 배경 안 튐 */
  background:url('images/hero.jpg') top center/cover no-repeat;
  animation:hero-zoom 16s ease-in-out infinite alternate;will-change:transform}
/* 모바일: 줌 애니메이션 끄기 (스크롤 렉 방지) */
@media(max-width:768px){.hero-bg::before{animation:none}}
.hero-bg::after{content:"";position:absolute;inset:0;background:rgba(10,10,10,var(--hero-dark))}
@keyframes hero-zoom{from{transform:scale(1)}to{transform:scale(1.07)}}
@media(prefers-reduced-motion:reduce){.hero-bg::before{animation:none}}
.hero h1{font-size:44px;margin:16px 0}
.hero p{color:var(--sub);max-width:560px;margin:0 auto 16px}
.hero-btns .btn{margin:8px}

/* ── 최종 CTA: 배경사진 + 명조 타이틀 ── */
.cta{text-align:center;position:relative;overflow:hidden;max-width:none;padding:130px 20px;
  background:linear-gradient(rgba(9,8,6,.78),rgba(9,8,6,.82)),url('images/hero.jpg') center/cover no-repeat fixed}
.cta>*{position:relative;z-index:2}
.cta::before{content:"";position:absolute;top:0;left:0;right:0;height:110px;z-index:1;
  background:linear-gradient(180deg,var(--bg),transparent);pointer-events:none}
.cta-title{font-size:clamp(28px,3.4vw,44px);margin:14px 0 0;line-height:1.45}
.cta-title .gold-em{font-style:normal;color:var(--gold-light)}
.cta-line{display:block;width:64px;height:1px;margin:26px auto;
  background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.cta-sub{color:var(--gray);margin-bottom:30px}
.cta-btn{font-family:'Noto Serif KR',serif;letter-spacing:.03em;
  box-shadow:0 10px 40px rgba(200,169,106,.3)}
.cta-btn:hover{opacity:1;transform:translateY(-3px);box-shadow:0 16px 50px rgba(200,169,106,.45)}
.cta-hours{color:var(--sub);font-size:14px;margin-top:20px}

/* ── 푸터 ── */
footer{border-top:1px solid rgba(200,169,106,.15);padding:70px 20px 56px;text-align:center;
  color:var(--sub);font-size:14px;background:#070604}
.foot-brand{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:6px}
.foot-logo{height:58px;width:auto}
.foot-wm{height:20px;width:auto}
.foot-div{display:block;width:80px;height:1px;margin:22px auto 24px;
  background:linear-gradient(90deg,transparent,rgba(200,169,106,.7),transparent)}
footer p{margin:4px 0}
.foot-keywords{margin-top:14px;color:#6e675c;font-size:13px}
footer .copy{margin-top:18px;color:#55504a;font-size:12px}

/* ── 입장 팝업 ── */
.popup-overlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;
  background:rgba(5,4,3,.78);backdrop-filter:blur(4px);padding:20px}
.popup-overlay.show{display:flex;animation:popup-fade .4s ease}
.popup-box{position:relative;max-width:420px;width:100%;
  background:url('images/popup-bg.jpg') top center/cover no-repeat #12100d; /* 팝업 전체에 배경사진 */
  border:1px solid rgba(200,169,106,.45);border-radius:16px;overflow:hidden;
  box-shadow:0 30px 90px rgba(0,0,0,.7),0 0 40px rgba(200,169,106,.12);
  animation:popup-in .5s cubic-bezier(.16,1,.3,1)}
/* 팝업 상단 (골드 그라데이션 + 선물 아이콘) */
.popup-head{position:relative;text-align:center;padding:26px 20px 22px;
  background:linear-gradient(rgba(9,8,6,.35),rgba(9,8,6,.45))} /* 투명 — 뒤 사진 비침 */
.popup-gift{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.95);color:#161209;
  display:flex;align-items:center;justify-content:center;margin:0 auto 10px;
  box-shadow:0 6px 20px rgba(0,0,0,.4)}
.popup-gift svg{width:28px;height:28px}
.popup-event{margin:0;font-weight:800;font-size:22px;color:#fff;letter-spacing:.12em;
  text-shadow:0 2px 8px rgba(0,0,0,.8)}
.popup-x{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;
  background:rgba(9,8,6,.55);border:none;color:#fff;font-size:16px;cursor:pointer;transition:all .3s}
.popup-x:hover{background:#090806}
/* 팝업 본문 — 가독성용 어두운 막 (사진은 popup-box 전체에 깔림) */
.popup-body{padding:26px 24px 22px;text-align:center;
  background:linear-gradient(rgba(9,8,6,.52),rgba(9,8,6,.6))}
.popup-body h3{margin:0 0 8px;font-size:21px;color:#fff}
.popup-sub{color:var(--sub);font-size:14px;margin:0 0 18px}
.popup-inner{background:rgba(255,255,255,.05);border-radius:12px;padding:20px 16px;margin-bottom:18px}
.popup-gold{color:var(--gold);font-size:17px;font-weight:700;margin:0 0 6px}
.popup-sub2{color:var(--sub);font-size:13px;margin:0}
.popup-note{color:var(--sub);font-size:13px;margin:0 0 16px}
.popup-cta{display:flex;gap:10px;margin-bottom:14px}
.popup-call{flex:1;display:block;background:rgba(18,16,13,.6);border:1px solid var(--gold);color:var(--gold);
  font-weight:700;font-size:16px;padding:14px 0;border-radius:40px;transition:all .3s}
.popup-call:hover{background:var(--gold);color:#161209;transform:translateY(-2px)}
.popup-inq{flex:1;display:block;background:rgba(18,16,13,.6);border:1px solid var(--gold);color:var(--gold);
  font-weight:700;font-size:16px;padding:14px 0;border-radius:40px;transition:all .3s}
.popup-inq:hover{background:var(--gold);color:#161209;transform:translateY(-2px)}
.popup-foot2{display:flex;gap:10px;justify-content:center}
.popup-mini{background:none;border:1px solid rgba(255,255,255,.25);color:#cfc9bd;
  padding:9px 20px;border-radius:20px;font-size:13px;cursor:pointer;font-family:inherit;transition:all .3s}
.popup-mini:hover{border-color:var(--gold);color:var(--gold)}
@media(max-width:768px){.popup-box{max-width:340px}.popup-body h3{font-size:18px}}
@keyframes popup-fade{from{opacity:0}to{opacity:1}}
@keyframes popup-in{from{opacity:0;transform:translateY(26px) scale(.94)}to{opacity:1;transform:none}}

/* ── 플로팅 버튼 (문의 + 전화) ── */
.float-wrap{position:fixed;right:20px;bottom:20px;
  display:flex;flex-direction:column;gap:10px;z-index:999}
.float-btn{background:var(--gold);color:#000;font-weight:700;padding:14px 22px;border-radius:50px;box-shadow:0 4px 20px rgba(0,0,0,.5);text-align:center}
.float-btn.kakao{background:#fee500}
.float-btn.line{background:rgba(18,16,13,.9);border:1px solid var(--gold);color:var(--gold)}
.float-btn.line:hover{background:var(--gold);color:#090806}

/* ── 히어로 메인 타이틀 (아이보리 제목 + 골드 포인트) ── */
.hero-message{position:relative;z-index:0;text-align:center}
/* 타이틀 뒤 어두운 막 — 블러 방식(경계선 없음) */
.hero-message::before{content:"";position:absolute;inset:-50px -40px -140px;z-index:-1;pointer-events:none;
  background:rgba(9,8,6,.32);border-radius:50%;filter:blur(80px)} /* 아래로 연장 → 본문 막과 겹침 */
/* 배경 동심원 링 장식 — 인물 사진과 겹쳐 보여 제거 (필요 시 복원 가능) */
.hero{position:relative}
/* 섹션1→2 경계: 아래로 갈수록 배경색에 녹아들게 (섹션2→3과 동일한 방식) */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,var(--bg) 0%,transparent 100%)}
.hero-message,.hero-copy,.hero-btns{position:relative;z-index:2}
.hero .hero-keyword{margin:0 auto 30px;max-width:none;font-family:'Pretendard',sans-serif;
  font-size:15px;font-weight:500;letter-spacing:.32em;color:#C7A767;
  text-shadow:0 2px 8px rgba(0,0,0,.9);
  display:flex;align-items:center;justify-content:center;gap:18px}
/* 라벨 양옆 골드 라인 장식 */
.hero .hero-keyword::before,.hero .hero-keyword::after{content:"";width:44px;height:1px;
  background:linear-gradient(90deg,transparent,#C7A767);flex-shrink:0}
.hero .hero-keyword::after{background:linear-gradient(90deg,#C7A767,transparent)}
.hero .rotating-title{min-height:1.5em;margin:0 auto;max-width:none;
  font-family:'Noto Serif KR',serif;font-size:clamp(38px,5vw,84px);font-weight:500;
  line-height:1.28;letter-spacing:-.045em;color:#F5F1E9;
  text-shadow:0 3px 10px rgba(0,0,0,.45),0 15px 45px rgba(0,0,0,.35);
  will-change:opacity,transform,filter,letter-spacing}
/* 타이틀 아래 소개 문장 */
.hero .hero-sub{color:#e9e4d8;font-size:18px;line-height:1.9;max-width:640px;margin:30px auto 0;
  text-shadow:0 1px 3px rgba(0,0,0,.95),0 3px 12px rgba(0,0,0,.6);
  text-shadow:0 1px 6px rgba(0,0,0,.8)}
/* 타이틀 뒤 은은한 원형 라인 장식 */
.hero-message::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(760px,92vw);height:min(760px,92vw);border-radius:50%;
  border:1px solid rgba(200,169,106,.14);z-index:-1;pointer-events:none}
/* ── 2줄 로테이션: "OOO + 밤(고정)" ── */
.title-gold-line{display:block;white-space:nowrap;height:1.6em;line-height:1.6;font-size:.78em} /* 높이 고정 → 흔들림 없음 */
.rotate-wrap{display:inline-block;min-width:5.6em;text-align:right;height:1.5em;overflow:hidden;
  vertical-align:top;filter:drop-shadow(0 2px 5px rgba(0,0,0,.85))} /* 최소 너비 고정 → "밤" 위치 고정 */
.rotate-word{display:inline-block;will-change:opacity,transform,filter}
.night-fixed{display:inline-block;margin-left:.28em;filter:drop-shadow(0 2px 5px rgba(0,0,0,.85))}
.rotate-word,.night-fixed{
  background:linear-gradient(180deg,#F6E7C1 0%,#E2C98F 45%,#C8A96A 100%); /* 절제된 골드 그라데이션 */
  -webkit-background-clip:text;background-clip:text;color:transparent}

/* 1줄: 아이보리 / 2줄: 골드 샤인 (각 줄은 줄바꿈 없이) */
.rotating-title .title-white{display:block;white-space:nowrap;color:#F5F1E9;
  text-shadow:0 2px 6px rgba(0,0,0,.9),0 6px 24px rgba(0,0,0,.7)}
.rotating-title .title-gold{display:block;white-space:nowrap;
  background:linear-gradient(110deg,#C8A96A 0%,#C8A96A 38%,#F6E7C1 50%,#C8A96A 62%,#C8A96A 100%);
  background-size:250% 100%;background-position:0% 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:none;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.85)) drop-shadow(0 6px 18px rgba(0,0,0,.6)) drop-shadow(0 0 16px rgba(200,169,106,.2))} /* 그림자 + 골드 글로우 */
/* 밝은 금빛이 오른쪽→왼쪽으로 한 번만 통과 */
.rotating-title .title-gold.shine{animation:gold-sweep 1.8s ease-in-out 1 both}
@keyframes gold-sweep{from{background-position:0% 0}to{background-position:100% 0}}
.title-line{display:block;width:58px;height:1px;margin:34px auto 0;
  background:linear-gradient(90deg,transparent,#D5B66F,transparent);transform-origin:center}
@media(max-width:768px){
  .hero .hero-keyword{margin-bottom:20px;font-size:11px;gap:10px}
  .hero .hero-keyword::before,.hero .hero-keyword::after{width:24px}
  .hero .rotating-title{font-size:7vw;line-height:1.35}
  .hero .hero-sub{font-size:15px;margin-top:22px}
  .title-line{margin-top:24px}
}
@media(prefers-reduced-motion:reduce){
  .rotating-title,.title-line{animation:none!important;transition:none!important}
}

/* ── 히어로 카피 박스 (반투명 블랙 + 얇은 골드 테두리) ── */
/* 경계 없이 서서히 사라지는 부드러운 어두운 막 (블러 경계 끊김 제거) */
/* 어두운 막: 그라데이션 대신 강한 블러 처리 → 경계선·띠 현상 완전 제거 */
.hero-copy{position:relative;z-index:0;background:none;border:none;border-radius:0;box-shadow:none;
  padding:60px 90px;max-width:720px;margin:14px auto 0}
.hero-copy::before{content:"";position:absolute;inset:-110px 10% 4%;z-index:-1;
  background:rgba(8,7,6,.38);border-radius:50%;filter:blur(70px)} /* 위로 연장 → 타이틀 막과 겹침 */
.quote{margin:26px auto 0;max-width:600px}
.quote:first-child{margin-top:0}
.q-title{font-size:21px;font-weight:700;color:var(--gold);margin-bottom:8px;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.q-body{color:#e6e2d8;font-size:16px;text-shadow:0 1px 6px rgba(0,0,0,.8)}
.copy-lines p{color:#fdfcf9;font-size:17px;margin:4px 0;
  text-shadow:0 1px 3px rgba(0,0,0,.95),0 3px 12px rgba(0,0,0,.7)}
.copy-lines .gold-line{color:var(--gold-light);font-weight:600}
.copy-pair{margin:26px 0}
.copy-pair:first-child{margin-top:0}
.copy-pair:last-child{margin-bottom:0}
.sign{margin:36px auto 0;max-width:600px;padding-top:26px;border-top:1px solid rgba(255,255,255,.15)}
.sign p{margin:4px 0}
.sign-name{font-size:20px;font-weight:700}
.btn.kakao{background:#fee500}

/* ── 스크롤 등장 애니메이션 ── */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s,transform .6s}
.reveal.show{opacity:1;transform:none}

/* CTA 문구: PC는 한 줄(· 구분), 모바일은 두 줄 */
.m-block{display:inline}
/* 모바일 전용 줄바꿈: PC에선 무시 */
.m-br{display:none}

/* ── 모바일 ── */
@media(max-width:768px){
  .g2,.g3,.g4,.map-grid{grid-template-columns:1fr}
  /* 히어로 카피: 한 문장 = 한 줄 유지 + 정중앙 정렬 */
  .hero-copy{padding:36px 6px;max-width:100%;margin-left:auto;margin-right:auto;text-align:center}
  .copy-lines{width:100%}
  .copy-lines p{white-space:nowrap;font-size:min(15px,3.5vw);text-align:center;
    width:100%;display:block;margin-left:0;margin-right:0}
  .sign{text-align:center}
  .hero-message{width:100%;text-align:center}
  /* CTA 문구 두 줄 처리 */
  .pc-sep{display:none}
  .m-block{display:block}
  .m-br{display:inline}
  .float-wrap{right:14px;bottom:14px;display:flex}
  .float-btn{padding:12px 18px;font-size:14px}
  .hero h1{font-size:30px}
  h2{font-size:24px}
  /* 모바일: 햄버거·자물쇠를 우측 상단에 붙임 (메뉴가 숨겨져도 중앙으로 안 밀리게) */
  #hamburger{display:block;margin-left:auto}
  .admin-lock{margin-left:10px}
  nav{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(10,10,10,.98);flex-direction:column;padding:10px 0;border-bottom:1px solid #1e1e1e}
  nav.open{display:flex}
  nav a{margin:0;padding:14px 24px}
}

/* ══════════════════════════════════════
   서브페이지 (busan-roomsalon / karaoke / noraebang / public / marine-city)
   ══════════════════════════════════════ */
body.subpage{background:
  radial-gradient(ellipse 90% 50% at 50% 0%,#17130e 0%,var(--bg) 60%) no-repeat,
  var(--bg)}
.sub-nav a.on{color:var(--gold)}
.sub-hero{text-align:center;padding:90px 20px 60px;max-width:900px}
.sub-hero h1{font-family:'Noto Serif KR',serif;font-size:clamp(28px,3.4vw,46px);
  font-weight:600;line-height:1.4;margin:10px 0 22px;color:var(--ivory);
  text-shadow:0 2px 10px rgba(0,0,0,.6)}
.sub-lead{color:var(--gray);font-size:17px;line-height:1.9;margin-bottom:8px}
.sub-body{max-width:860px;padding-top:20px}
.sub-block{margin-bottom:44px;padding-left:22px;border-left:2px solid rgba(200,169,106,.4)}
.sub-block h2{font-size:23px;margin:0 0 12px;color:var(--gold-light)}
.sub-block p{color:#ddd8cc;font-size:16px;line-height:1.95;margin:0}
.sub-faq{max-width:860px;text-align:center}
.faq-list{display:flex;flex-direction:column;gap:14px;text-align:left}
.faq-item{background:var(--card);border:1px solid #222;border-radius:12px;padding:22px 26px;
  transition:border-color .3s}
.faq-item:hover{border-color:rgba(200,169,106,.45)}
.faq-q{color:var(--gold);font-weight:700;margin:0 0 8px}
.faq-a{color:#dcd7cb;margin:0;font-size:15px;line-height:1.8}
.sub-info{max-width:640px}
.sub-info .card{text-align:center}
.sub-info h3{margin-top:0}
.sub-info .sub{margin:6px 0}
.sub-links{text-align:center;max-width:900px;padding-bottom:100px}
.link-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.link-chip{background:rgba(18,16,13,.7);border:1px solid rgba(200,169,106,.4);
  border-radius:30px;padding:12px 26px;color:var(--ivory);font-size:15px;transition:all .3s}
.link-chip:hover{background:var(--gold);color:#090806;transform:translateY(-2px)}
@media(max-width:768px){
  .sub-hero{padding:60px 18px 40px}
  .sub-block{padding-left:16px;margin-bottom:34px}
  .sub-block h2{font-size:20px}
  .sub-nav{display:none}
  .sub-nav.open{display:flex}
}
/* 푸터 내부링크 (SEO) */
.foot-links{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;margin:18px 0 6px}
.foot-links a{color:var(--sub);font-size:13px;transition:color .3s}
.foot-links a:hover{color:var(--gold)}