/* ============================================================
   danjam-custom.css — 2026-07 개편 공통 스타일
   담당: 폰트(명조 제목), 네이버 예약 CTA, 신뢰·리뷰 섹션,
        요금표, 객실 요금패널, FAQ/유의사항 아코디언, 하단 예약바
   기존 optimized.css / bootstrap 위에 얹혀 동작하도록 danjam- 접두사 사용
   ============================================================ */

:root{
  --danjam-serif:"Nanum Myeongjo","Apple SD Gothic Neo",Batang,serif;
  --danjam-naver:#03c75a;
  --danjam-naver-deep:#02b350;
  --danjam-ondol:#a4522e;
  --danjam-ink:#2b2620;
  --danjam-ink-soft:#6d6355;
  --danjam-line:#e7dfcf;
  --danjam-paper:#fdfbf6;
  --danjam-paper-deep:#f5efe2;
  --danjam-seal:#b3402e;
}

/* 한글은 단어 중간에서 줄바꿈되면 어색하므로 어절 단위로만 줄바꿈 (전 페이지 공통) */
body{word-break:keep-all;overflow-wrap:break-word}

/* ===== 히어로 사진·로고 재정비 (전 페이지 공통) =====
   - 기존 로고박스(반투명 흰 사각 배지)를 없애고, 사진에 부드러운 스크림 + 로고 자체에
     드롭섀도를 줘서 사진 내용과 무관하게 항상 또렷하게 보이도록 처리
   - 로고를 절대위치에서 꺼내 header를 flex로 중앙 정렬 → 어떤 화면에서도 어긋나지 않음
   - 홈(.page-home)은 조금 더 크고 여유있게, 내부 페이지는 콤팩트하게 */
header.masthead{
  min-height:42vh!important;
  padding:2.6rem 1rem!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:none!important;
  background-position:center 38%!important;
}
/* 원본 사진의 구도는 보존하고, 헤더에서만 과한 적색·주황색을 낮춰 자연스럽게 표시 */
header.masthead::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:url("/assets/img/danjam-header-bg.webp") center 38%/cover no-repeat;
  filter:saturate(.72) hue-rotate(7deg) brightness(1.03) contrast(.96);
}
header.masthead::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  z-index:1;
  background:linear-gradient(180deg,rgba(18,14,9,.22) 0%,rgba(18,14,9,.03) 30%,rgba(18,14,9,0) 55%);
}
header.masthead .container{position:relative;z-index:2}
.masthead-logo-container{
  position:static!important;transform:none!important;
  box-shadow:none!important;
  padding:2.8rem 3.4rem!important;
  max-width:340px!important;
  margin-top:0;
  background:radial-gradient(ellipse 145px 90px at center,rgba(255,255,255,.88) 0%,rgba(255,255,255,.68) 42%,rgba(255,255,255,.24) 70%,rgba(255,255,255,0) 86%)!important;
}
.masthead-logo{
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.38));
}
@media (min-width:768px){
  header.masthead{min-height:54vh!important;padding:3.2rem 1rem!important}
  .masthead-logo-container{
    max-width:400px!important;padding:3.4rem 4rem!important;margin-top:0;
    background:radial-gradient(ellipse 172px 105px at center,rgba(255,255,255,.88) 0%,rgba(255,255,255,.68) 42%,rgba(255,255,255,.24) 70%,rgba(255,255,255,0) 86%)!important;
  }
}
.page-home header.masthead{min-height:58vh!important}
@media (min-width:768px){.page-home header.masthead{min-height:72vh!important}}

/* ===== 폰트: 한국어 제목을 명조로 ===== */
.section-heading.about1,
.section-heading.about1 *,
.danjam-serif{
  font-family:var(--danjam-serif)!important;
  letter-spacing:.02em;
}
.danjam-section h2{
  font-family:var(--danjam-serif);
  font-size:1.7rem;
  letter-spacing:.03em;
  margin:0;
  color:var(--danjam-ink);
  text-wrap:balance;
}
.danjam-section .danjam-sub{
  color:var(--danjam-ink-soft);
  margin:.5rem 0 0;
  font-size:.98rem;
}
.danjam-section-head{text-align:center;margin-bottom:2rem}

/* ===== 객실 카드 설명글 가독성 (기존 테마가 0.8rem으로 너무 작게 잡아둔 것 보정) ===== */
#portfolio .portfolio-caption-subheading{
  font-size:1rem!important;
  line-height:1.65!important;
  color:var(--danjam-ink-soft)!important;
}
@media (min-width:768px){
  #portfolio .portfolio-caption-subheading{font-size:1.05rem!important}
}

/* ===== 히어로 캡션 (index 전용, 사진 아래 별도 띠 — 로고 오버레이와 겹치지 않도록 분리) ===== */
.danjam-hero-caption{
  background:var(--danjam-paper);
  border-bottom:1px solid var(--danjam-line);
  padding:1.9rem 1.2rem 2.1rem;
  text-align:center;
}
.danjam-tagline-main{
  font-family:var(--danjam-serif);
  color:var(--danjam-ink);
  font-size:1.35rem;
  font-weight:700;
  letter-spacing:.03em;
  margin:0;
  text-wrap:balance;
}
.danjam-tagline-sub{
  font-family:"Noto Sans KR",sans-serif;
  color:var(--danjam-ink-soft);
  font-size:.92rem;
  margin:.55rem 0 0;
  letter-spacing:.01em;
}
@media (min-width:768px){
  .danjam-tagline-main{font-size:1.6rem}
  .danjam-tagline-sub{font-size:1rem}
}

/* ===== 네이버 예약 버튼(공통) ===== */
.danjam-btn-naver{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:var(--danjam-naver);color:#fff!important;
  font-weight:700;border-radius:9px;padding:.75rem 1.7rem;
  text-decoration:none;border:none;cursor:pointer;font-size:1rem;
  box-shadow:0 3px 12px rgba(3,199,90,.35);transition:background .2s;
}
.danjam-btn-naver:hover{background:var(--danjam-naver-deep);color:#fff!important}
.danjam-btn-ghost{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  border:1.5px solid var(--danjam-ink);color:var(--danjam-ink)!important;
  background:none;font-weight:600;border-radius:9px;padding:.7rem 1.6rem;
  text-decoration:none;transition:background .2s;
}
.danjam-btn-ghost:hover{background:var(--danjam-paper-deep)}

/* 네비게이션 예약 버튼 강조 */
#mainNav .nav-item .nav-link.danjam-nav-book{
  background-color:var(--danjam-naver)!important;color:#fff!important;border-radius:6px;
  padding:.35rem 1rem!important;margin-left:.4rem;font-weight:700;text-shadow:none!important;
}
#mainNav .nav-item .nav-link.danjam-nav-book:hover{background-color:var(--danjam-naver-deep)!important;color:#fff!important}

/* 모바일 메뉴 모달 안의 네이버예약 강조 */
.mobile-menu-item.danjam-nav-book{
  display:inline-block;background:var(--danjam-naver);color:#fff!important;
  border-radius:8px;padding:.35rem .9rem;text-shadow:none;
}

/* ===== 모바일 하단 고정 예약 바 ===== */
.danjam-book-bar{display:none}
@media (max-width:767px){
  .danjam-book-bar{
    display:block;
    position:fixed;left:0;right:0;bottom:0;z-index:1055;
    background:#fff;border-top:1px solid var(--danjam-line);
    box-shadow:0 -4px 18px rgba(43,38,32,.14);
    padding:.55rem .85rem calc(.55rem + env(safe-area-inset-bottom,0px));
  }
  .danjam-book-bar .inner{
    display:flex;align-items:center;gap:.7rem;max-width:640px;margin:0 auto;
  }
  .danjam-book-bar .info{
    font-size:.85rem;color:var(--danjam-ink-soft);line-height:1.35;
  }
  .danjam-book-bar .info b{display:block;font-size:.9rem;color:var(--danjam-ink)}
  .danjam-book-bar .danjam-btn-naver{
    margin-left:auto;flex:none;padding:.62rem 1.25rem;font-size:.92rem;
  }
  /* 하단 바에 가리지 않도록 본문 여백 확보 */
  body{padding-bottom:66px}
  /* 기존 우하단 플로팅 버튼과 겹치지 않도록 숨김 */
  .room-info-btn{display:none!important}
}

/* ===== 신뢰·리뷰 섹션 ===== */
.danjam-section{padding:3.2rem 1rem}
.danjam-section.alt{background:var(--danjam-paper-deep)}
.danjam-inner{max-width:960px;margin:0 auto}
.danjam-badges{
  display:flex;justify-content:center;gap:.7rem;flex-wrap:wrap;margin-bottom:2rem;
}
.danjam-badge{
  display:flex;align-items:center;gap:.6rem;background:#fff;
  border:1px solid var(--danjam-line);border-radius:999px;
  padding:.5rem 1.1rem;font-size:.85rem;font-weight:600;color:var(--danjam-ink);
}
.danjam-badge .seal{
  width:32px;height:32px;border-radius:50%;background:var(--danjam-seal);
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-family:var(--danjam-serif);font-size:.85rem;flex:none;
}
.danjam-badge small{display:block;font-weight:400;color:var(--danjam-ink-soft);font-size:.85rem}
.danjam-reviews{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;
}
.danjam-review{
  background:#fff;border:1px solid var(--danjam-line);border-radius:12px;
  padding:1.2rem 1.25rem;position:relative;
  display:flex;flex-direction:column;height:100%;
}
.danjam-review::before{
  content:"\201C";font-family:var(--danjam-serif);font-size:2.6rem;
  color:var(--danjam-ondol);line-height:1;position:absolute;top:.5rem;left:1rem;opacity:.35;
}
.danjam-review .q{
  font-family:var(--danjam-serif);font-size:1.05rem;font-weight:700;
  margin:.9rem 0 .5rem;color:var(--danjam-ink);text-wrap:balance;
}
.danjam-review p{font-size:.92rem;color:var(--danjam-ink-soft);margin:0;line-height:1.55}
.danjam-review .src{
  display:flex;justify-content:space-between;margin-top:auto;padding-top:.9rem;
  font-size:.85rem;color:#8a8070;
}
.danjam-review .src .room{color:var(--danjam-ondol);font-weight:600}
.danjam-agg{text-align:center;margin-top:1.6rem;font-size:.95rem;color:var(--danjam-ink)}
.danjam-agg b{font-variant-numeric:tabular-nums}
.danjam-review-more{
  display:inline-flex;align-items:center;gap:.4rem;
  background:var(--danjam-naver);border:1.5px solid var(--danjam-naver);border-radius:999px;
  padding:.6rem 1.4rem;color:#fff;font-weight:700;font-size:.92rem;text-decoration:none;
  box-shadow:0 3px 10px rgba(3,199,90,.3);transition:background .2s,border-color .2s;
}
.danjam-review-more:hover{background:var(--danjam-naver-deep);border-color:var(--danjam-naver-deep);color:#fff}
.danjam-chips{display:flex;justify-content:center;gap:.45rem;flex-wrap:wrap;margin-top:.8rem}
.danjam-chip{
  background:#fff;border:1px solid var(--danjam-line);border-radius:999px;
  padding:.25rem .85rem;font-size:.85rem;color:var(--danjam-ink-soft);
}
.danjam-chip b{color:var(--danjam-ink)}
@media (max-width:760px){.danjam-reviews{grid-template-columns:1fr}}

/* ===== 단잠 소개: 콤팩트 피처 스트립 (기존 타임라인 대체) ===== */
.danjam-feature-strip{
  display:flex;flex-wrap:wrap;justify-content:center;gap:1.8rem 1.2rem;
}
.danjam-feature{
  width:150px;text-align:center;text-decoration:none;color:inherit;
}
.danjam-feature img{
  width:84px;height:84px;border-radius:50%;object-fit:cover;
  margin:0 auto .8rem;box-shadow:0 3px 10px rgba(43,38,32,.16);
  border:3px solid #fff;transition:box-shadow .2s,transform .2s;
}
.danjam-feature:hover img{box-shadow:0 6px 16px rgba(43,38,32,.24);transform:translateY(-2px)}
.danjam-feature h4{
  font-family:var(--danjam-serif);font-size:1rem;margin:0 0 .3rem;color:var(--danjam-ink);
}
.danjam-feature p{font-size:.85rem;color:var(--danjam-ink-soft);margin:0;line-height:1.5}

/* ===== 푸터 상단: 블로그 소개 + 연락처 (한 줄로 정돈, 중앙정렬) ===== */
.danjam-footer-top{
  text-align:center;max-width:680px;margin:0 auto 2.15rem;
}
.danjam-footer-link{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--danjam-naver);color:#fff;font-weight:700;font-size:.95rem;
  border-radius:999px;padding:.65rem 1.6rem;text-decoration:none;
  box-shadow:0 3px 10px rgba(3,199,90,.3);transition:background .2s;
}
.danjam-footer-link:hover{background:var(--danjam-naver-deep);color:#fff}
.danjam-footer-blog-desc{
  margin:.9rem 0 0;font-size:.92rem;color:var(--danjam-ink-soft);line-height:1.6;
}
.danjam-footer-contact-line{
  margin:1.45rem 0 0;padding-top:1.15rem;border-top:1px solid var(--danjam-line);
  font-size:.92rem;color:var(--danjam-ink-soft);line-height:1.65;
}

/* ===== 객실 카드: 같은 행의 설명 영역 높이를 맞춰 카드 하단 정렬 ===== */
#portfolio .row > [class*="col-"]{display:flex}
#portfolio .portfolio-item{display:flex;flex-direction:column;width:100%;height:100%}
#portfolio .portfolio-item .portfolio-link{flex:0 0 auto}
#portfolio .portfolio-item .portfolio-caption{
  display:flex;flex:1 1 auto;flex-direction:column;align-items:center;
}
#portfolio .portfolio-item .portfolio-caption-subheading{margin-top:auto}

/* ===== 요금표 (rooms) ===== */
.danjam-contrast{
  max-width:720px;margin:0 auto 1.3rem;background:#eef5ef;
  border:1px solid #cde3d2;color:#1c5c37;border-radius:10px;
  padding:.85rem 1.2rem;font-size:.95rem;font-weight:600;text-align:center;
  line-height:1.65;text-wrap:pretty;
}
.danjam-contrast span{display:block}
.danjam-contrast span+span{margin-top:.2rem}
.danjam-table-wrap{
  overflow-x:auto;border:1px solid var(--danjam-line);border-radius:12px;background:#fff;
}
table.danjam-price{
  width:100%;border-collapse:collapse;font-size:.92rem;
  font-variant-numeric:tabular-nums;min-width:560px;
}
table.danjam-price th,table.danjam-price td{
  padding:.7rem .9rem;text-align:right;border-bottom:1px solid var(--danjam-line);white-space:nowrap;
}
table.danjam-price thead th{background:var(--danjam-paper-deep);font-size:.85rem;font-weight:700}
table.danjam-price thead th:first-child,table.danjam-price td:first-child{text-align:left}
table.danjam-price td:first-child{font-weight:700;font-family:var(--danjam-serif)}
table.danjam-price td:first-child small{
  display:block;font-family:"Noto Sans KR",sans-serif;font-weight:400;
  color:var(--danjam-ink-soft);font-size:.82rem;
}
table.danjam-price tbody tr:last-child td{border-bottom:none}
table.danjam-price .low{color:#1c6b46;font-weight:700}
.danjam-table-note{font-size:.85rem;color:var(--danjam-ink-soft);margin:.9rem 0 0;text-align:center}

/* 객실 카드 시작가 */
.danjam-card-price{
  margin-top:.4rem;font-size:.9rem;color:var(--danjam-ink-soft);
}
.danjam-card-price b{color:var(--danjam-ondol);font-size:1.1rem;font-variant-numeric:tabular-nums}

/* ===== 객실 상세 요금 패널 ===== */
.danjam-price-panel{
  background:#fff;border:1px solid var(--danjam-line);border-radius:14px;
  padding:1.4rem;max-width:420px;margin:0 auto;
}
.danjam-price-panel h4{
  margin:0 0 .8rem;font-family:var(--danjam-serif);font-size:1.1rem;color:var(--danjam-ink);
}
.danjam-price-rows{font-variant-numeric:tabular-nums;font-size:.95rem}
.danjam-price-rows .r{
  display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;padding:.55rem 0;
  border-bottom:1px dashed var(--danjam-line);
}
.danjam-price-rows .r:last-of-type{border-bottom:none}
.danjam-price-rows .d{flex:1 1 auto;min-width:0;color:var(--danjam-ink-soft)}
.danjam-price-rows .r b{flex:0 0 auto;color:var(--danjam-ink);white-space:nowrap}
.danjam-price-rows .r.low b{color:#1c6b46}
.danjam-price-panel .extra{display:flex;flex-direction:column;gap:.25rem;font-size:.85rem;color:var(--danjam-ink-soft);margin:.8rem 0 1rem}
.danjam-price-panel .extra span{display:block}
.danjam-price-panel .danjam-btn-naver{width:100%}

/* ===== 아코디언 (FAQ / 유의사항) ===== */
.danjam-acc{
  background:#fff;border:1px solid var(--danjam-line);border-radius:10px;
  margin:.55rem 0;overflow:hidden;
}
.danjam-acc>summary{
  list-style:none;cursor:pointer;padding:.95rem 1.2rem;
  font-weight:700;font-size:.98rem;color:var(--danjam-ink);
  display:flex;align-items:center;gap:.6rem;
}
.danjam-acc>summary::-webkit-details-marker{display:none}
.danjam-acc>summary::after{
  content:"\25BE";margin-left:auto;color:var(--danjam-ink-soft);transition:transform .2s;
}
.danjam-acc[open]>summary::after{transform:rotate(180deg)}
.danjam-acc>summary:focus-visible{outline:2px solid var(--danjam-ondol);outline-offset:-2px}
.danjam-acc .acc-body{
  max-height:0;overflow:hidden;padding:0 1.2rem;
  font-size:.92rem;color:var(--danjam-ink-soft);line-height:1.7;
  transition:max-height .4s ease;
}
.danjam-acc .acc-body-inner{padding-bottom:1rem}
.danjam-acc .acc-body p{margin:.15rem 0 .7rem}
.danjam-acc .acc-body p:last-child{margin-bottom:0}
.danjam-acc .acc-body ul{margin:.15rem 0 .75rem;padding-left:1.25rem}
.danjam-acc .acc-body li+li{margin-top:.45rem}
.danjam-acc .acc-label{font-weight:700;color:var(--danjam-ink)}
@media (prefers-reduced-motion:reduce){.danjam-acc .acc-body{transition:none}}
.danjam-acc-wrap{max-width:760px;margin:0 auto}

/* ===== 예약 3단계 ===== */
.danjam-steps{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:760px;margin:0 auto;
}
.danjam-step{
  background:#fff;border:1px solid var(--danjam-line);border-radius:12px;
  padding:1.3rem 1.1rem;text-align:center;
}
.danjam-step .no{font-family:var(--danjam-serif);font-size:1.7rem;color:var(--danjam-ondol)}
.danjam-step h4{margin:.3rem 0;font-size:1rem;color:var(--danjam-ink)}
.danjam-step p{font-size:.87rem;color:var(--danjam-ink-soft);margin:0}
@media (max-width:620px){.danjam-steps{grid-template-columns:1fr}}

/* 결제 핵심 상시 노출 박스 */
.danjam-paybox{
  max-width:760px;margin:2rem auto 0;border:2px solid var(--danjam-ondol);
  background:#fdf4ec;border-radius:12px;padding:1.2rem 1.4rem;
}
.danjam-paybox h4{margin:0 0 .6rem;color:#7c3a17;font-size:1rem;font-family:var(--danjam-serif)}
.danjam-paybox ul{margin:0;padding-left:1.2rem;font-size:.9rem;color:#5c3a22;line-height:1.7}
.danjam-paybox li{margin:.3rem 0}
.danjam-paybox b{color:#7c3a17}

.danjam-center{text-align:center}
.danjam-mt-lg{margin-top:1.8rem}

/* 객실 카드 캡션(글자) 전체를 해당 방 링크로 — 색/밑줄 변화 없이 상속 */
.danjam-caption-link{display:block;color:inherit;text-decoration:none;cursor:pointer}
.danjam-caption-link:hover,.danjam-caption-link:focus{color:inherit;text-decoration:none}

/* 요금표 가로 스크롤바 상시 표시 (모바일에서 넘김 인지) */
.danjam-table-wrap{scrollbar-width:thin;scrollbar-color:#b89b72 #ece7dd}
.danjam-table-wrap::-webkit-scrollbar{height:9px;-webkit-appearance:none}
.danjam-table-wrap::-webkit-scrollbar-track{background:#ece7dd;border-radius:0 0 12px 12px}
.danjam-table-wrap::-webkit-scrollbar-thumb{background:#b89b72;border-radius:8px;border:2px solid #ece7dd}
@media (max-width:767px){
  .danjam-table-wrap{overflow-x:scroll}
  /* 모바일: 여백·헤더 축소해 '평일' 요금이 스크롤 없이도 보이게 */
  table.danjam-price{min-width:470px;font-size:.85rem}
  table.danjam-price th,table.danjam-price td{padding:.58rem .42rem}
  table.danjam-price thead th{white-space:normal;font-size:.76rem;line-height:1.25}
}

/* 상단 메뉴: 모달 제거 → 모바일에서도 인라인 5링크 표시 (네이버예약은 하단 바) */
#mainNav .navbar-collapse{display:flex!important}
#mainNav .navbar-nav .nav-link:not(.danjam-nav-book){color:rgba(255,255,255,.68)!important;font-weight:400}
@media (max-width:767px){
  #mainNav .container{padding-left:.4rem;padding-right:.4rem}
  #mainNav .navbar-nav{flex-direction:row;flex-wrap:nowrap;width:100%;margin:0!important;padding:.3rem 0!important}
  #mainNav .navbar-nav .nav-item{flex:1 1 0}                 /* 5개 동일 너비 */
  #mainNav .nav-link{font-size:.68rem;padding:.35rem .1rem;white-space:nowrap;letter-spacing:.02em;text-align:center}  /* 가운데 정렬 */
  #mainNav .danjam-nav-book-item{display:none}
}
