/*
 * 게시판 글(board/<슬러그>/, board/posts/<슬러그>-가이드/) 전용 스타일.
 * 옛 어두운 'theme-shaman' 본문(Tailwind 클래스 + hanji-panel)을 새 디자인(밝은 한지·먹색·오방색)으로 읽히게 한다.
 * 글 마크업은 그대로 두고, body.board-post main 안에서만 덮어쓴다. site.css 다음에 불러온다.
 *
 * 구역
 *  1. 바탕·본문 틀        2. 글자색(어두운 바탕용 → 먹색)   3. 제목·글자 크기
 *  4. 패널·카드·배지       5. 버튼                           6. 링크·목록·표·체크박스
 *  7. FAQ(details)         8. 직답·영상·보조 장치            9. 맨 위로 버튼
 * 10. 반응형(900px 이하)
 *
 * 색: 먹 #1B1714 · 짙은 먹 #2E2925 · 보조 #463F38 · 연한 #6B6158 · 한지 #FAF6EE/#F2EBDC · 빨강 #B8231B · 노랑 #EDBE2F · 파랑 #1E4690
 */

/* ===== 1. 바탕·본문 틀 ===== */
body.board-post{overflow-x:hidden}
body.board-post main{padding-top:48px;padding-bottom:88px;color:#1B1714;font-size:18px;line-height:1.85}
body.board-post main article{min-width:0}
body.board-post main p,body.board-post main li{font-size:18px;line-height:1.9;word-break:keep-all;overflow-wrap:break-word}
body.board-post main strong,body.board-post main b{font-weight:700}
body.board-post main [class*="rounded"]{border-radius:0}
body.board-post main .backdrop-blur-sm,body.board-post main .backdrop-blur-md{-webkit-backdrop-filter:none;backdrop-filter:none}
body.board-post main .shadow-lg,body.board-post main .hover\:shadow-lg:hover,body.board-post main .hover\:shadow-2xl:hover{box-shadow:none}
body.board-post main section[id],body.board-post main [id]{scroll-margin-top:24px}

/* ===== 2. 글자색 ===== */
/* 어두운 바탕에서 쓰던 흰 글자 → 먹색 계열 */
body.board-post main .text-white{color:#1B1714}
body.board-post main .text-white\/90,body.board-post main .text-white\/80,body.board-post main .text-white\/75{color:#2E2925}
body.board-post main .text-white\/70{color:#463F38}
body.board-post main .text-white\/60,body.board-post main .text-white\/50,body.board-post main .text-white\/30{color:#5E564E}
body.board-post main .hover\:text-white:hover,body.board-post main .group:hover .group-hover\:text-white{color:#B8231B}
/* 금색·노랑 글자 → 강조 빨강. strong 은 먹색 굵은 글씨 + 형광펜 */
body.board-post main .text-hanbok-yellow,body.board-post main .text-hanbok-yellow\/70,body.board-post main .text-hanbok-red{color:#B8231B}
body.board-post main .text-hanbok-gold,body.board-post main .text-hanbok-gold\/70,body.board-post main .text-hanbok-gold\/60{color:#8A5A00}
body.board-post main strong.text-hanbok-yellow,body.board-post main b.text-hanbok-yellow,body.board-post main strong.text-hanbok-gold{color:#1B1714;font-weight:700;background:linear-gradient(transparent 62%,rgba(237,190,47,.55) 62%)}
body.board-post main .hover\:text-hanbok-yellow:hover,body.board-post main .group:hover .group-hover\:text-hanbok-yellow{color:#B8231B}
body.board-post main .text-hanbok-navy,body.board-post main .text-hanbok-blue,body.board-post main .text-blue-400,body.board-post main .text-blue-300{color:#1E4690}
body.board-post main .text-hanbok-green,body.board-post main .text-green-400,body.board-post main .text-green-300{color:#2D7A36}
body.board-post main .text-red-400,body.board-post main .text-red-300{color:#B8231B}
body.board-post main .text-purple-400{color:#6B3FA0}
body.board-post main .text-yellow-400{color:#8A5A00}
body.board-post main .text-pink-400{color:#A82B63}
body.board-post main .text-black{color:#1B1714}
body.board-post main .hover\:text-hanbok-yellow:hover{color:#B8231B}

/* ===== 3. 제목·글자 크기 ===== */
body.board-post main .font-display-kr,body.board-post main .font-serif-kr,body.board-post main h1,body.board-post main h2,body.board-post main h3,body.board-post main h4{font-family:'Hahmlet',serif}
body.board-post main h1{margin-top:0;font-weight:900;font-size:64px;line-height:1.14;letter-spacing:-.025em;color:#1B1714;word-break:keep-all;overflow-wrap:break-word}
body.board-post main h2{font-weight:900;font-size:34px;line-height:1.35;letter-spacing:-.01em;color:#1B1714;word-break:keep-all;overflow-wrap:break-word}
body.board-post main h3{font-weight:700;font-size:23px;line-height:1.5;color:#1B1714;word-break:keep-all;overflow-wrap:break-word}
body.board-post main h4{font-weight:700;font-size:20px;line-height:1.5;color:#1B1714}
body.board-post main h2 .fas,body.board-post main h2 .fa,body.board-post main h3 .fas{font-size:.8em;color:#B8231B}
body.board-post main .text-xs{font-size:14px;line-height:1.6}
body.board-post main .text-sm{font-size:16px;line-height:1.75}
body.board-post main .text-base{font-size:18px}
body.board-post main p.text-lg,body.board-post main li.text-lg,body.board-post main .text-lg{font-size:20px;line-height:1.85}
body.board-post main p.text-xl{font-size:22px;line-height:1.8}
body.board-post main .fas,body.board-post main .fa{line-height:1}

/* ===== 4. 패널·카드·배지 ===== */
body.board-post main .hanji-panel{background:#FFFFFF;border:2px solid #1B1714;box-shadow:8px 8px 0 #1B1714;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}
body.board-post main .hanji-panel.rounded-2xl,body.board-post main .hanji-panel.rounded-3xl,body.board-post main .hanji-panel.p-8,body.board-post main .hanji-panel.md\:p-12{box-shadow:12px 12px 0 #1B1714}
body.board-post main .hanji-panel-inner{background:#F2EBDC;border:2px solid #1B1714;box-shadow:none}
body.board-post main .traditional-shadow{box-shadow:12px 12px 0 #1B1714}
/* 반투명 흰 바탕(어두운 패널 위 카드) → 한지색 카드 */
body.board-post main .bg-white\/5,body.board-post main .bg-white\/10,body.board-post main .bg-obsidian-600\/30,body.board-post main .bg-blue-500\/5,body.board-post main .bg-hanbok-navy\/30{background-color:#F7F1E4}
body.board-post main .hover\:bg-white\/10:hover,body.board-post main .hover\:bg-white\/20:hover,body.board-post main .hover\:bg-obsidian-500\/40:hover{background-color:#F2EBDC}
body.board-post main .bg-white\/5.border,body.board-post main .bg-white\/10.border,body.board-post main .bg-obsidian-600\/30,body.board-post main .border-l-4{border-color:rgba(27,23,20,.28)}
body.board-post main .border-white\/10,body.board-post main .border-white\/20,body.board-post main .border-white\/30,body.board-post main .border-hanbok-gold\/10,body.board-post main .border-hanbok-gold\/15,body.board-post main .border-hanbok-gold\/20,body.board-post main .border-hanbok-gold\/30,body.board-post main .border-hanbok-gold\/40,body.board-post main .border-hanbok-gold\/50,body.board-post main .border-hanbok-red\/30,body.board-post main .border-hanbok-yellow\/30,body.board-post main .border-hanbok-blue\/30,body.board-post main .border-blue-500\/30{border-color:rgba(27,23,20,.3)}
body.board-post main .border-hanbok-gold,body.board-post main .border-hanbok-yellow,body.board-post main .border-hanbok-red,body.board-post main .border-blue-500,body.board-post main .border-green-500,body.board-post main .border-purple-500{border-color:#1B1714}
body.board-post main .hover\:border-hanbok-gold\/50:hover,body.board-post main .hover\:border-hanbok-gold\/40:hover,body.board-post main .hover\:border-hanbok-yellow:hover{border-color:#B8231B}
body.board-post main a.group.border,body.board-post main a.group{transition:transform .25s,box-shadow .25s}
body.board-post main a.group.bg-white\/5:hover,body.board-post main a.group.bg-obsidian-600\/30:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 #EDBE2F}
/* 색을 얹은 안내 상자(옛 그라데이션·반투명) → 한지색 상자 */
body.board-post main [class*="from-hanbok-"][class*="/10"],body.board-post main [class*="from-hanbok-"][class*="/20"],body.board-post main [class*="from-hanbok-"][class*="/5"]{background:#F2EBDC;border:2px solid #1B1714}
/* 배지·알약 */
body.board-post main .bg-hanbok-red\/20,body.board-post main .bg-hanbok-red\/10,body.board-post main .bg-red-500\/20{background-color:#F8E1DE}
body.board-post main .bg-hanbok-yellow\/20,body.board-post main .bg-hanbok-yellow\/10,body.board-post main .bg-hanbok-gold\/20,body.board-post main .bg-hanbok-gold\/10,body.board-post main .bg-yellow-500\/20{background-color:#FBF0C8}
body.board-post main .bg-blue-500\/20,body.board-post main .bg-hanbok-blue\/10,body.board-post main .bg-hanbok-blue\/20{background-color:#DCE6F7}
body.board-post main .bg-green-500\/20{background-color:#DDF0DF}
body.board-post main .bg-pink-500\/20{background-color:#F7DDE9}
body.board-post main .bg-purple-500\/20{background-color:#E8DFF4}
body.board-post main .bg-hanbok-teal\/20{background-color:#D9EFEF}
body.board-post main span.inline-block.rounded-full,body.board-post main span.inline-flex.rounded-full,body.board-post main .px-3.py-1[class*="bg-"]{border:2px solid #1B1714;font-weight:700;font-size:16px;line-height:1.5}
body.board-post main span[class*="bg-hanbok-"][class*="/20"].text-hanbok-yellow,body.board-post main span[class*="bg-hanbok-gold"].text-hanbok-yellow{color:#1B1714}
/* 번호·아이콘 동그라미 → 먹색 네모(디자인의 .no) */
body.board-post main [class*="w-12"][class*="h-12"][class*="items-center"],body.board-post main [class*="w-14"][class*="h-14"][class*="p-0.5"],body.board-post main [class*="w-16"][class*="h-16"][class*="p-0.5"],body.board-post main .bg-shaman-obsidian,body.board-post main .bg-black\/80{background:#1B1714;border-radius:0}
body.board-post main [class*="w-12"][class*="h-12"][class*="items-center"] .text-white,body.board-post main [class*="w-12"][class*="h-12"][class*="items-center"] i,body.board-post main [class*="w-16"][class*="h-16"] .text-white{color:#FFFFFF}
body.board-post main [class*="p-0.5"] .text-hanbok-yellow,body.board-post main [class*="p-0.5"] .text-hanbok-gold,body.board-post main .bg-shaman-obsidian .text-hanbok-yellow,body.board-post main .bg-shaman-obsidian .text-hanbok-gold,body.board-post main .bg-black\/80 .text-hanbok-yellow{color:#EDBE2F}
body.board-post main [class*="w-12"][class*="h-12"][class*="items-center"] .text-hanbok-yellow,body.board-post main [class*="w-12"][class*="h-12"][class*="items-center"] .text-hanbok-gold,body.board-post main [class*="w-12"][class*="h-12"] .text-hanbok-red{color:#EDBE2F}
body.board-post main [class*="w-6"][class*="h-6"][class*="bg-hanbok-yellow"]{background:#EDBE2F;color:#1B1714;border:2px solid #1B1714;box-sizing:border-box}
body.board-post main .bg-hanbok-yellow:not([class*="w-12"]){background:#EDBE2F}
/* 제목 밑 색동 줄(옛 그라데이션 막대) → 오방색 5칸 */
body.board-post main .h-1[class*="bg-gradient"],body.board-post main .w-16.h-1{height:8px;background:linear-gradient(90deg,#2457B3 0 20%,#D3382C 0 40%,#EDBE2F 0 60%,#FFFFFF 0 80%,#3C9D46 0);box-shadow:0 0 0 2px #1B1714;border-radius:0}
/* 아래 가로선 */
body.board-post main .border-b,body.board-post main .border-t{border-color:rgba(27,23,20,.2)}
body.board-post main .border-b-0,body.board-post main .last\:border-0:last-child{border-bottom-width:0}

/* ===== 5. 버튼 ===== */
body.board-post main .btn-amulet,body.board-post main a.bg-gradient-to-r.text-white,body.board-post main a.bg-hanbok-gold.text-black{display:inline-flex;align-items:center;justify-content:center;min-height:56px;box-sizing:border-box;border:2px solid #B8231B;background:#B8231B;background-image:none;color:#FFFFFF;font-weight:700;font-size:18px;line-height:1.35;text-align:center;text-decoration:none;box-shadow:none;border-radius:0;filter:none;transition:background-color .3s,border-color .3s}
body.board-post main .btn-amulet:hover,body.board-post main a.bg-gradient-to-r.text-white:hover,body.board-post main a.bg-hanbok-gold.text-black:hover{background:#1B1714;border-color:#1B1714;color:#FFFFFF;transform:none;filter:none}
body.board-post main .btn-amulet *,body.board-post main a.bg-gradient-to-r.text-white *{color:inherit}
body.board-post main .btn-amulet-ghost{display:inline-flex;align-items:center;justify-content:center;min-height:56px;box-sizing:border-box;border:2px solid #1B1714;background:transparent;color:#1B1714;font-weight:700;font-size:18px;line-height:1.35;text-align:center;text-decoration:none;border-radius:0;transition:background-color .3s,color .3s}
body.board-post main .btn-amulet-ghost:hover{background:#1B1714;color:#FFFFFF;transform:none}
body.board-post main .btn-amulet-ghost *{color:inherit}
body.board-post main .btn-amulet .fas,body.board-post main .btn-amulet-ghost .fas{font-size:.95em}

/* ===== 6. 링크·목록·표·체크박스 ===== */
body.board-post main a{text-underline-offset:3px}
body.board-post main a.underline,body.board-post main p a:not([class]),body.board-post main li a:not([class]){color:#B8231B;text-decoration:underline;text-decoration-thickness:2px}
body.board-post main a.underline:hover,body.board-post main p a:not([class]):hover,body.board-post main li a:not([class]):hover{color:#1B1714}
body.board-post main a.hover\:underline:hover{text-decoration:underline}
body.board-post main ul.list-disc,body.board-post main ol.list-decimal{padding-left:1.4em;list-style-position:outside}
body.board-post main ul.list-disc.list-inside{padding-left:1.2em}
body.board-post main ul.list-disc>li,body.board-post main ol.list-decimal>li{padding-left:.2em}
body.board-post main li::marker{color:#B8231B}
body.board-post main li{min-width:0}
body.board-post main .overflow-x-auto{-webkit-overflow-scrolling:touch}
body.board-post main table{width:100%;border-collapse:collapse;border:2px solid #1B1714;background:#FFFFFF;font-size:17px;line-height:1.7}
body.board-post main th,body.board-post main td{padding:12px 14px;border:1px solid rgba(27,23,20,.3);vertical-align:top;text-align:left}
body.board-post main th{background:#1B1714;color:#FFFFFF;font-weight:700;border-color:#1B1714}
body.board-post main th,body.board-post main th.text-white,body.board-post main th.text-hanbok-yellow,body.board-post main thead .text-hanbok-yellow,body.board-post main thead .text-white{color:#FFFFFF}
body.board-post main td.text-hanbok-yellow{color:#1B1714;background:#F2EBDC}
body.board-post main tr{border-color:rgba(27,23,20,.3)}
body.board-post main td.text-sm{font-size:17px}
body.board-post main input[type="checkbox"]{flex:none;width:24px;height:24px;margin-top:3px;accent-color:#B8231B;background:#FFFFFF;border:2px solid #1B1714;border-radius:0;cursor:pointer}
body.board-post main label{cursor:pointer}
body.board-post main blockquote{margin:0;padding:6px 0 6px 22px;border-left:6px solid #B8231B}
body.board-post main pre{overflow:auto}

/* ===== 7. FAQ(details) ===== */
body.board-post main details{background:#FFFFFF;border:2px solid #1B1714;border-radius:0}
body.board-post main details[open]{background:#FFFDF6}
body.board-post main details+details{margin-top:12px}
body.board-post main summary{display:flex;align-items:flex-start;justify-content:flex-start;gap:14px;min-height:64px;box-sizing:border-box;padding:16px 20px;font-family:'Hahmlet',serif;font-weight:700;font-size:20px;line-height:1.5;color:#1B1714;cursor:pointer;list-style:none}
body.board-post main summary:hover{background:#F2EBDC}
body.board-post main summary>i{display:none}
body.board-post main summary>span{flex:1;min-width:0;word-break:keep-all;overflow-wrap:break-word;color:#1B1714}
body.board-post main summary::after{content:"+";flex:none;margin-left:auto;font-family:'Noto Sans KR',sans-serif;font-size:30px;font-weight:400;line-height:1;color:#B8231B;transition:transform .3s}
body.board-post main details[open] summary::after{transform:rotate(45deg)}
body.board-post main details[open]>summary{border-bottom:2px solid #1B1714}
body.board-post main details>div{padding:18px 20px 20px;color:#2E2925}
body.board-post main details p{padding:0}
body.board-post main details p+p{margin-top:10px}
body.board-post main details .text-white\/80{color:#2E2925}

/* ===== 8. 직답·영상·보조 ===== */
/* DIRECT-ANSWER 문단: 디자인의 .answer (site.css) 에 맞추고 글자색만 고정 */
body.board-post main p.answer{margin-left:0;margin-right:0;max-width:none;color:#1B1714;font-size:20px;line-height:1.85;font-weight:500}
body.board-post main p.answer strong{background:none}
body.board-post main iframe{display:block;border:0}
body.board-post main .rounded-xl.overflow-hidden:has(>iframe),body.board-post main div[style*="aspect-ratio"]{border:2px solid #1B1714}
body.board-post main .fa-circle{font-size:.5em}
body.board-post main .space-y-16>:not([hidden])~:not([hidden]){margin-top:3rem;margin-bottom:0}
body.board-post main hr{border:0;border-top:2px solid rgba(27,23,20,.2)}

/* ===== 9. 맨 위로 버튼(일부 글) ===== */
body.board-post #scroll-to-top{position:fixed;right:24px;bottom:28px;z-index:80;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border:2px solid #1B1714;background:#1B1714;color:#FFFFFF;border-radius:0;box-shadow:4px 4px 0 #EDBE2F;cursor:pointer;transition:opacity .3s,background-color .3s}
body.board-post #scroll-to-top:hover{background:#B8231B;border-color:#B8231B;transform:none}
body.board-post #scroll-to-top .fas{color:#FFFFFF;font-size:18px}
body.board-post #scroll-to-top.opacity-0{opacity:0;pointer-events:none}
body.board-post #scroll-to-top.opacity-100{opacity:1;pointer-events:auto}

/* ===== 10. 반응형 ===== */
@media (max-width:900px){
  body.board-post main{padding-top:28px;padding-bottom:72px;font-size:17px}
  body.board-post main p,body.board-post main li{font-size:17px;line-height:1.9}
  body.board-post main h1{font-size:40px;line-height:1.2}
  body.board-post main h2{font-size:28px}
  body.board-post main h3{font-size:21px}
  body.board-post main .text-sm{font-size:16px}
  body.board-post main p.text-lg,body.board-post main .text-lg{font-size:18px}
  body.board-post main p.text-xl{font-size:20px}
  body.board-post main .hanji-panel,body.board-post main .hanji-panel.rounded-2xl,body.board-post main .hanji-panel.rounded-3xl,body.board-post main .hanji-panel.p-8,body.board-post main .hanji-panel.md\:p-12,body.board-post main .traditional-shadow{box-shadow:8px 8px 0 #1B1714}
  body.board-post main .hanji-panel.p-8{padding:22px}
  body.board-post main p.answer{padding:20px;box-shadow:8px 8px 0 #1B1714;font-size:18px}
  body.board-post main summary{font-size:18px;padding:14px 16px}
  body.board-post main details>div{padding:16px}
  body.board-post main th,body.board-post main td{padding:10px;font-size:16px}
  body.board-post main .btn-amulet,body.board-post main .btn-amulet-ghost,body.board-post main a.bg-gradient-to-r.text-white{font-size:17px}
  body.board-post #scroll-to-top{right:16px;bottom:96px;width:48px;height:48px}
}
@media (max-width:600px){
  body.board-post main .flex-wrap>.btn-amulet,body.board-post main .flex-wrap>.btn-amulet-ghost{flex:1 1 100%}
}
@media print{
  body.board-post main .hanji-panel,body.board-post main p.answer{box-shadow:none}
  body.board-post #scroll-to-top{display:none}
}
@media (max-width:767px){
  body.board-post main .grid.md\:grid-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.board-post main .grid.md\:grid-cols-4>.hanji-panel{padding:16px 10px}
}
/* 옛 css/styles.css 에서 가져온 지도·영상 틀(16:9) */
body.board-post main .embed-container{position:relative;height:0;padding-bottom:56.25%;max-width:100%;margin-bottom:0;overflow:hidden;border-bottom:0}
body.board-post main .embed-container iframe,body.board-post main .embed-container object,body.board-post main .embed-container embed{position:absolute;top:0;left:0;width:100%;height:100%;border:0}
body.board-post main section.overflow-hidden>.embed-container{margin:0}