/*
Theme Name: 행간읽기 충청
Description: 행간읽기 충청 — 대전·세종·충남·충북 지원제도 안내 매체. 독립 클래식 테마(부모 테마 없음). 2026-10-30.
Version: 1.0.0
Text Domain: haenggan
*/

:root{
  --hg-paper:#FFFFFF; --hg-ink:#1C1B19; --hg-ink-2:#5D5A54; --hg-ink-3:#8E8A82;
  --hg-rule:#E4E1DB; --hg-rule-strong:#1C1B19; --hg-wash:#F5F3EE;
  --hg-accent:#1F5E4E;            /* 짙은 청록 — 옛 매체(남색)와 구분 */
  --hg-urgent:#A8321E; --hg-open:#1F5E4E; --hg-soon:#7A5B12; --hg-closed:#8E8A82;
  --hg-serif:"Noto Serif KR","Apple SD Gothic Neo",serif;
  --hg-sans:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --hg-max:1080px;
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:16.5px}
body{margin:0;background:var(--hg-paper);color:var(--hg-ink);font-family:var(--hg-sans);line-height:1.75;
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;word-break:keep-all;overflow-wrap:anywhere}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--hg-accent);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--hg-serif);color:var(--hg-ink);letter-spacing:-0.01em}
img{max-width:100%;height:auto}
.hg-wrap{max-width:var(--hg-max);margin:0 auto;padding-inline:20px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.screen-reader-text:focus{position:static;width:auto;height:auto;clip:auto;padding:8px;background:var(--hg-wash)}

/* ===== 제호 ===== */
.hg-topline{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:10px;font-size:14px;color:var(--hg-ink-2);border-bottom:1px solid var(--hg-rule)}
.hg-topline b{font-weight:500;color:var(--hg-ink)}
.hg-masthead{text-align:center;padding-block:30px 20px}
.hg-name{font-family:var(--hg-serif);font-weight:700;font-size:clamp(34px,5.6vw,56px);letter-spacing:-0.02em;line-height:1.05;margin:0}
.hg-name a{color:var(--hg-ink)}
.hg-tag{margin:12px 0 0;font-size:15.5px;color:var(--hg-ink-2)}
nav.hg-nav{border-top:1px solid var(--hg-rule-strong);border-bottom:1px solid var(--hg-rule);display:flex;justify-content:center;flex-wrap:wrap;gap:0 26px;padding-block:10px;font-size:15.5px;font-weight:500}
nav.hg-nav a{padding:6px 0;border-bottom:2px solid transparent}
nav.hg-nav a[aria-current]{border-bottom-color:var(--hg-ink)}
nav.hg-nav a:hover{border-bottom-color:var(--hg-rule-strong)}
nav.hg-nav .hg-nav-sep{width:1px;background:var(--hg-rule);margin-block:8px}

/* ===== 상태 배지 (발행기·갱신기가 본문에 넣는 p.pp-status) ===== */
.pp-status{display:inline-block;margin:0 0 14px;padding:3px 10px;font-family:var(--hg-sans);font-size:14px;font-weight:700;border:1px solid currentColor;border-radius:2px;line-height:1.5}
.pp-status-urgent{color:var(--hg-urgent)} .pp-status-open{color:var(--hg-open)}
.pp-status-soon{color:var(--hg-soon)} .pp-status-closed{color:var(--hg-closed)}
span.pp-status{margin:0 0 0 8px;padding:1px 7px;font-size:12.5px;vertical-align:2px;white-space:nowrap}

/* ===== 1면 ===== */
.hg-intro{padding-block:30px 26px;border-bottom:1px solid var(--hg-rule);display:grid;grid-template-columns:3fr 2fr;gap:40px;align-items:start}
.hg-intro h1,.hg-intro h2{font-size:clamp(24px,3vw,32px);font-weight:600;line-height:1.35;margin:0}
.hg-intro p{margin:12px 0 0;color:var(--hg-ink-2);font-size:16px;max-width:34em}
.hg-how{background:var(--hg-wash);padding:18px 20px;font-size:15px;line-height:1.7}
.hg-how strong{display:block;margin-bottom:6px}
.hg-how ol{margin:0;padding-left:1.2em}
.hg-sechead{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-top:14px;margin-top:34px;border-top:1px solid var(--hg-rule-strong)}
.hg-sechead h2{margin:0;font-family:var(--hg-sans);font-size:17px;font-weight:700}
.hg-sechead a,.hg-sechead span{font-size:14.5px;color:var(--hg-ink-2)}
.hg-cards{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 32px}
.hg-cards li{padding-block:20px 22px;border-bottom:1px solid var(--hg-rule)}
.hg-cards h3{font-size:19px;font-weight:600;line-height:1.45;margin:6px 0 0;text-wrap:balance}
.hg-cards h3 a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.hg-cards p{margin:8px 0 0;font-size:14.5px;color:var(--hg-ink-2);line-height:1.6}
.hg-kicker{font-size:13.5px;font-weight:500;color:var(--hg-accent);margin:0}
.hg-kicker span{color:var(--hg-ink-3);font-weight:400}
.hg-meta{font-size:14px;color:var(--hg-ink-3);margin:0}
.hg-hubs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--hg-rule);margin-top:10px}
.hg-hubs a{padding:18px 12px;border-right:1px solid var(--hg-rule);border-bottom:1px solid var(--hg-rule)}
.hg-hubs a:nth-child(4n){border-right:0}
.hg-hubs .n{display:block;font-family:var(--hg-serif);font-size:20px;font-weight:600;line-height:1.2}
.hg-hubs .d{display:block;margin-top:6px;font-size:13.5px;color:var(--hg-ink-2)}
.hg-hubs a:hover .n{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.hg-empty{padding-block:28px;color:var(--hg-ink-2);font-size:15.5px}

/* ===== 목록(태그·검색·전체) ===== */
.hg-list-head{padding-block:32px 16px;border-bottom:1px solid var(--hg-rule-strong)}
.hg-list-head h1{font-size:clamp(26px,3.2vw,36px);font-weight:600;margin:0;line-height:1.3}
.hg-list-head p{margin:8px 0 0;color:var(--hg-ink-2);font-size:15.5px;max-width:40em}
.hg-list{list-style:none;margin:0;padding:0}
.hg-list li{display:grid;grid-template-columns:7em 1fr;gap:20px;padding-block:22px;border-bottom:1px solid var(--hg-rule)}
.hg-list time{color:var(--hg-ink-3);font-size:14px;padding-top:4px}
.hg-list h2{font-size:21px;font-weight:600;line-height:1.45;margin:4px 0 0}
.hg-list p{margin:6px 0 0;font-size:15px;color:var(--hg-ink-2)}
.hg-pager{padding-block:24px;font-size:15px}
.hg-pager .nav-links{display:flex;gap:16px;flex-wrap:wrap}
.hg-pager a{border-bottom:1px solid var(--hg-rule-strong)}
.hg-pager .current{color:var(--hg-ink-3)}
.hg-search{display:flex;gap:8px;margin-top:14px;max-width:420px}
.hg-search input{flex:1;font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--hg-ink-3);border-radius:2px}
.hg-search button{font:inherit;font-size:15px;padding:10px 16px;background:var(--hg-ink);color:#fff;border:0;border-radius:2px;cursor:pointer}

/* ===== 글 ===== */
.hg-article{max-width:720px;margin:0 auto}
.hg-article-head{padding-block:36px 22px;border-bottom:1px solid var(--hg-rule)}
.hg-article-head h1{font-size:clamp(28px,3.8vw,40px);font-weight:600;line-height:1.3;margin:8px 0 0;text-wrap:balance}
.hg-article-head .hg-meta{margin-top:16px}
.hg-body{padding-top:24px;font-size:17.5px;line-height:1.85}
.hg-body > p{margin:0 0 1.1em}
.hg-body h2{font-family:var(--hg-serif);font-size:25px;font-weight:600;line-height:1.38;margin:2em 0 .7em}
.hg-body h3{font-family:var(--hg-serif);font-size:20px;font-weight:600;line-height:1.4;margin:1.6em 0 .5em}
.hg-body a{color:var(--hg-accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.hg-body ul,.hg-body ol{padding-left:1.4em;margin:0 0 1.2em}
.hg-body li{margin-bottom:.35em}
.hg-body table{width:100%;border-collapse:collapse;margin:1.2em 0 1.8em;font-size:15.5px;font-family:var(--hg-sans)}
.hg-body th,.hg-body td{padding:10px 12px;border-bottom:1px solid var(--hg-rule);text-align:left;vertical-align:top}
.hg-body th{font-weight:700}
.hg-table-scroll{overflow-x:auto}
.hg-body .pp-lead{font-size:19px;line-height:1.75;margin:0 0 12px}
.hg-body .pp-checked{font-size:14px;color:var(--hg-ink-3);margin:0 0 22px}
.hg-body table.pp-facts{margin:0 0 30px;font-size:16px;border-top:2px solid var(--hg-ink)}
.hg-body table.pp-facts th{width:24%;color:var(--hg-ink-2);padding-left:0;white-space:nowrap}
.hg-body table.pp-facts td{padding-right:0;line-height:1.65}
.hg-body ol.pp-steps{counter-reset:s;list-style:none;padding:0}
.hg-body ol.pp-steps li{counter-increment:s;position:relative;padding:10px 0 10px 44px;border-bottom:1px solid var(--hg-rule);margin:0}
.hg-body ol.pp-steps li::before{content:counter(s);position:absolute;left:0;top:10px;width:28px;height:28px;border-radius:50%;background:var(--hg-ink);color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center}
.hg-body ul.pp-related,.hg-body ul.pp-sources,.hg-body ul.pp-hub-list{list-style:none;padding:0}
.hg-body ul.pp-related li,.hg-body ul.pp-hub-list li{padding:10px 0;border-bottom:1px solid var(--hg-rule);margin:0}
.hg-body ul.pp-sources li{font-size:15px;margin:0 0 6px}
.hg-body .pp-hub{font-size:15.5px}
.hg-body .pp-colophon{margin-top:40px;padding-top:16px;border-top:1px solid var(--hg-rule);font-size:14px;color:var(--hg-ink-3);line-height:1.7}
.hg-body .pp-colophon a{color:var(--hg-ink-2)}
.hg-article-foot{max-width:720px;margin:40px auto 0;padding-top:18px;border-top:1px solid var(--hg-rule-strong);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14.5px;color:var(--hg-ink-2)}
.hg-article-foot a{color:var(--hg-ink);border-bottom:1px solid var(--hg-rule-strong)}

/* ===== 문의 폼 ===== */
.hg-form{display:grid;gap:12px;margin:20px 0 0;max-width:560px}
.hg-form label{font-size:15px;font-weight:500;display:grid;gap:6px}
.hg-form input,.hg-form select,.hg-form textarea{font:inherit;font-size:16px;padding:11px 12px;border:1px solid var(--hg-ink-3);border-radius:2px;background:#fff;color:var(--hg-ink);width:100%}
.hg-form textarea{min-height:160px;resize:vertical}
.hg-form button{justify-self:start;font:inherit;font-weight:500;font-size:16px;padding:12px 24px;background:var(--hg-ink);color:#fff;border:0;border-radius:2px;cursor:pointer}
.hg-form .hg-pol{font-weight:400;font-size:14px;color:var(--hg-ink-2);display:flex;gap:8px;align-items:flex-start}
.hg-form .hg-pol input{width:auto;margin-top:5px}
.hg-form .hg-msg{min-height:1.2em;margin:0;font-size:15px;color:var(--hg-accent)}

/* ===== 하단 ===== */
.hg-footer{margin-top:56px;border-top:1px solid var(--hg-rule-strong);padding-block:22px 44px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 24px;font-size:14.5px;color:var(--hg-ink-2)}
.hg-footer nav{display:flex;gap:18px;flex-wrap:wrap}
.hg-footer nav a:hover{color:var(--hg-ink)}
.hg-footer .hg-fname{font-family:var(--hg-serif);font-weight:700;color:var(--hg-ink);font-size:18px}
.hg-footer .hg-copy{flex-basis:100%;font-size:13.5px;color:var(--hg-ink-3);margin:0}

@media (max-width:860px){
  .hg-intro{grid-template-columns:1fr;gap:20px}
  .hg-cards{grid-template-columns:1fr}
  .hg-hubs{grid-template-columns:repeat(2,1fr)}
  .hg-hubs a:nth-child(2n){border-right:0}
  .hg-hubs a:nth-child(4n){border-right:0}
  .hg-list li{grid-template-columns:1fr;gap:4px}
  nav.hg-nav{gap:0 16px;font-size:15px}
  nav.hg-nav .hg-nav-sep{display:none}
  .hg-body{font-size:17px}
  .hg-body table.pp-facts th{white-space:normal;width:30%}
}
@media (max-width:600px){ .hg-topline{justify-content:center;text-align:center} .hg-topline .hg-cadence{display:none} }
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* 신문 삽화 (v6.6) — 첫 문단·핵심 표 다음, 첫 소제목 앞 */
.hg-body .pp-illust{margin:8px 0 34px;padding:0}
.hg-body .pp-illust img{display:block;width:100%;height:auto;border:1px solid var(--hg-rule)}
.hg-body .pp-illust figcaption{font-size:12.5px;color:var(--hg-ink-3);margin-top:8px;text-align:right}

/* 공유 (v6.9) */
.hg-share button{font:inherit;font-size:15px;font-weight:500;padding:9px 16px;border-radius:2px;cursor:pointer;border:1px solid var(--hg-ink);background:#fff;color:var(--hg-ink)}
.hg-share button.hg-share-go{background:#FEE500;border-color:#FEE500;color:#191919}
.hg-share button:hover{filter:brightness(.96)}
.hg-share-mini{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px}
.hg-share-mini button{font-size:14px;padding:6px 12px}
.hg-share-big{margin:36px 0 0;padding:22px 22px 18px;background:var(--hg-wash);border-top:2px solid var(--hg-accent)}
.hg-share-big .hg-share-title{margin:0;font-family:var(--hg-serif);font-size:21px;font-weight:600}
.hg-share-big .hg-share-hint{margin:6px 0 14px;color:var(--hg-ink-2);font-size:15.5px}
.hg-share-big div{display:flex;gap:10px;flex-wrap:wrap}
.hg-share-msg{display:block;margin-top:8px;font-size:14px;color:var(--hg-accent);min-height:1.2em}
.hg-share-mini .hg-share-msg{display:inline;margin:0}
