html { scroll-padding-top: 112px; }
body { font-family: 'Pretendard Variable', Pretendard, system-ui, sans-serif; color:#2B2622; background:#FFFFFF; }

.font-serif-display { font-family: 'Gowun Batang', 'Nanum Myeongjo', serif; letter-spacing:-0.01em; }
.font-accent { font-family: 'Cormorant Garamond', serif; font-style: italic; }

/* 한지 질감 */
.bg-hanji {
  background-color: #F8F4ED;
  background-image:
    radial-gradient(rgba(184,153,104,0.06) 1px, transparent 1px),
    radial-gradient(rgba(43,38,34,0.04)  1px, transparent 1px);
  background-size: 24px 24px, 13px 13px;
  background-position: 0 0, 6px 6px;
}

/* 먹 번짐 */
.ink-stroke { position: relative; }
.ink-stroke::after {
  content: ''; position: absolute;
  bottom: -6px; left: 0; width: 48px; height: 8px;
  background: #2B2622; border-radius: 99px;
  filter: blur(2px); opacity: 0.85;
}

/* 캘리그라피 라인 애니메이션 */
@keyframes draw { from { stroke-dashoffset: 1200; } to { stroke-dashoffset: 0; } }
.calli-stroke path {
  stroke-dasharray: 1200; stroke-dashoffset: 1200;
  animation: draw 2.4s ease-out 0.3s forwards;
}

@keyframes fadeUp { from { opacity:0; transform: translateY(16px); } to { opacity:1; transform: translateY(0); } }
.fade-up   { animation: fadeUp .9s ease-out both; }
.fade-up-1 { animation: fadeUp .9s ease-out .15s both; }
.fade-up-2 { animation: fadeUp .9s ease-out .30s both; }
.fade-up-3 { animation: fadeUp .9s ease-out .45s both; }

/* 모바일 메뉴 */
.mo-nav { transform: translateX(100%); transition: transform .35s ease; }
.mo-nav.open { transform: translateX(0); }

/* 모바일 아코디언 */
.mo-accordion { display: flex; flex-direction: column; }
.mo-group { border-bottom: 1px solid rgba(255,255,255,0.06); background: #8E6C47; }
.mo-group > summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 24px;
  color: #fff;
  font-family: 'Gowun Batang', serif;
  font-size: 1.05rem;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  transition: background .25s ease;
}
.mo-group > summary::-webkit-details-marker { display: none; }
.mo-group > summary::after {
  content: '+';
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.4rem;
  line-height: 1;
  color: rgba(255,255,255,0.85);
  transition: transform .25s ease;
}
.mo-group[open] > summary { background: #735237; }
.mo-group[open] > summary::after { content: '−'; transform: rotate(0); }
.mo-group > ul {
  background: #6B5E50;
  list-style: none;
  margin: 0; padding: 0;
}
.mo-group > ul > li > a {
  display: block;
  padding: 16px 24px 16px 36px;
  color: rgba(255,255,255,0.85);
  font-size: 0.95rem;
  letter-spacing: -0.01em;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  transition: background .2s ease, color .2s ease;
}
.mo-group > ul > li:last-child > a { border-bottom: none; }
.mo-group > ul > li > a:hover,
.mo-group > ul > li > a:active { background: rgba(0,0,0,0.18); color: #D4BB8E; }

.mo-solo {
  display: block;
  padding: 22px 24px;
  background: #8E6C47;
  color: #fff;
  font-family: 'Gowun Batang', serif;
  font-size: 1.05rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: background .2s ease;
}
.mo-solo:hover, .mo-solo:active { background: #735237; }

details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
details[open] .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform .25s ease; }

/* 링크 호버 */
.link-u { position: relative; }
.link-u::after {
  content:''; position:absolute; left:0; bottom:-3px; width:0; height:1px;
  background:#B89968; transition: width .3s ease;
}
.link-u:hover::after { width:100%; }

/* 도장 */
.seal {
  width: 56px; height: 56px;
  border: 2px solid #9B3A2E; color: #9B3A2E;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: 'Gowun Batang', serif; font-weight: 700;
  letter-spacing: -0.02em; line-height: 1;
  transform: rotate(-3deg);
  box-shadow: inset 0 0 0 4px #fff, 0 0 0 1px rgba(155,58,46,0.3);
}

/* 헤더 — 페이지 최상단 투명, 스크롤 시 한지 톤 */
.site-header { background: transparent; border-color: transparent; transition: background-color .35s ease, border-color .35s ease, backdrop-filter .35s ease; }
.site-header.scrolled {
  background: rgba(248,244,237,0.88);
  border-color: rgba(229,220,203,0.6);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* 성당 — 한지에 워터컬러 녹아들기 */
.cathedral-bg {
  mix-blend-mode: multiply;
  filter: contrast(1.05) saturate(0.95);
}
@media (min-width: 1024px) {
  /* 데스크탑: 좌측 페이드 마스크 (텍스트 영역 비우기) */
  .cathedral-bg {
    -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.4) 18%, #000 45%, #000 100%);
            mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.4) 18%, #000 45%, #000 100%);
  }
}

/* 모바일 hero — 텍스트 카드 (한지 톤 + 가벼운 블러) */
.hero-card {
  background: rgba(248, 244, 237, 0.82);
  backdrop-filter: blur(10px) saturate(110%);
  -webkit-backdrop-filter: blur(10px) saturate(110%);
  border: 1px solid rgba(229, 220, 203, 0.6);
  box-shadow: 0 24px 60px -25px rgba(43, 38, 34, 0.25);
}
@media (min-width: 1024px) {
  .hero-card {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: none;
    box-shadow: none;
  }
}

/* 게시판 본문 — 줄바꿈 보존 + 단락 간격 */
.prose-body { font-size: 1rem; }
.line-clamp-2 {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}