/* 두뇌톡톡 콘텐츠 글 공용 스타일 (_template-article.html에서 추출) */
/* ===== 숲속 산책 디자인 시스템 (index.html과 동일) ===== */
:root{
  --bg:#F3F4EF; --ink:#232A22; --ink-soft:#3B453A;
  --muted:#7E8A78; --muted-2:#9AA091; --line:#E1E5DA; --card:#FFFFFF;
  --sage:#3E7C5A; --sage-light:#DDE9E0; --sage-mid:#EAF1EB;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{
  font-family:'Pretendard','Pretendard Variable',-apple-system,'Noto Sans KR',sans-serif;
  background:var(--bg); color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.75;
}
a{color:var(--sage)}
img{max-width:100%;height:auto;border-radius:12px}

/* ── 상단 바 ── */
.doc-top{
  position:sticky; top:0; z-index:20;
  background:rgba(243,244,239,.94); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.doc-top-in{
  max-width:720px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; gap:10px;
}
.doc-home{
  display:inline-flex; align-items:center; gap:7px;
  font-size:16px; font-weight:700; color:var(--sage); text-decoration:none;
}
.doc-home::before{content:'←'; font-size:17px}
.doc-brand{margin-left:auto; font-size:15px; font-weight:600; color:var(--muted)}

/* ── 본문 ── */
.doc{max-width:720px; margin:0 auto; padding:28px 20px 8px}
.doc-eyebrow{
  display:inline-block; font-size:13px; font-weight:700; letter-spacing:.02em;
  color:var(--sage); background:var(--sage-mid);
  border:1px solid var(--sage-light); border-radius:999px; padding:5px 13px;
}
.doc h1{
  font-size:29px; line-height:1.4; font-weight:800;
  margin:16px 0 10px; letter-spacing:-.01em;
}
.doc-date{font-size:14px; color:var(--muted-2); margin-bottom:26px}
.doc-lead{
  font-size:18px; color:var(--ink-soft); font-weight:500;
  background:var(--card); border:1px solid var(--line);
  border-left:4px solid var(--sage);
  border-radius:12px; padding:18px 20px; margin-bottom:32px;
}

/* 목차 */
.doc-toc{
  background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:18px 20px; margin-bottom:34px;
}
.doc-toc strong{display:block; font-size:15px; margin-bottom:10px; color:var(--ink)}
.doc-toc ol{margin:0; padding-left:20px}
.doc-toc li{margin:6px 0; font-size:16.5px}
.doc-toc a{text-decoration:none}
.doc-toc a:hover{text-decoration:underline}

/* 섹션 */
.doc h2{
  font-size:22px; font-weight:800; line-height:1.45;
  margin:44px 0 14px; padding-bottom:10px;
  border-bottom:2px solid var(--sage-light);
  scroll-margin-top:70px;
}
.doc h3{font-size:18.5px; font-weight:700; margin:28px 0 10px}
.doc p{font-size:17.5px; color:var(--ink-soft); margin:14px 0}
.doc ul,.doc ol{margin:14px 0; padding-left:22px}
.doc li{font-size:17.5px; color:var(--ink-soft); margin:9px 0}
.doc strong{color:var(--ink); font-weight:700}

/* 강조 카드 */
.doc-note{
  background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:18px 20px; margin:24px 0;
}
.doc-note-title{
  font-size:16px; font-weight:700; color:var(--sage); margin-bottom:8px;
}
.doc-note p{margin:8px 0; font-size:17px}

/* 앱 유도 (글 중간 1회) */
.doc-cta{
  display:block; text-decoration:none;
  background:var(--sage); color:#fff;
  border-radius:16px; padding:22px 24px; margin:38px 0;
}
.doc-cta b{display:block; font-size:19px; font-weight:800; margin-bottom:5px}
.doc-cta span{font-size:16px; opacity:.9}

/* 출처 */
.doc-src{margin:38px 0 0}
.doc-src strong{display:block; font-size:15px; margin-bottom:8px}
.doc-src li{font-size:15px; color:var(--muted)}

/* 면책 (건강 콘텐츠 필수) */
.doc-disclaimer{
  margin:30px 0 0; padding:16px 18px;
  border:1px dashed var(--line); border-radius:12px;
  font-size:14.5px; line-height:1.7; color:var(--muted);
}

/* 다음 읽을거리 */
.doc-more{max-width:720px; margin:46px auto 0; padding:0 20px}
.doc-more > strong{display:block; font-size:16px; margin-bottom:12px}
.doc-more-grid{display:grid; gap:10px}
.doc-more a{
  display:block; text-decoration:none; color:var(--ink);
  background:var(--card); border:1px solid var(--line);
  border-radius:12px; padding:15px 17px; font-size:16.5px; font-weight:600;
}
.doc-more a small{display:block; font-weight:400; font-size:14.5px; color:var(--muted); margin-top:3px}

/* ── 광고 (본문 아래 1개만) ── */
.doc-ad{max-width:720px; margin:40px auto 0; padding:0 20px; text-align:center}
.doc-ad small{display:block; font-size:12px; color:var(--muted-2); margin-bottom:6px}

/* ===== 공통 푸터 (전 페이지 동일) ===== */
.site-footer{
  margin-top:52px; border-top:1px solid var(--line);
  background:var(--card);
}
.site-footer-in{max-width:720px; margin:0 auto; padding:30px 20px 40px}
.site-footer h4{font-size:15px; font-weight:700; margin-bottom:14px}
.site-footer nav{
  display:flex; flex-wrap:wrap; gap:9px 10px; margin-bottom:22px;
}
.site-footer nav a{
  font-size:15.5px; color:var(--ink-soft); text-decoration:none;
  border:1px solid var(--line); border-radius:999px; padding:8px 15px;
}
.site-footer nav a:hover{border-color:var(--sage); color:var(--sage)}
.site-footer-meta{font-size:14px; color:var(--muted); line-height:1.8}
.site-footer-meta a{color:var(--muted); text-decoration:underline}

@media (max-width:420px){
  .doc h1{font-size:25px}
  .doc h2{font-size:20px}
  .doc p,.doc li{font-size:17px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}