/* ============================================================
   HIKMA KOREA — /insights/ 자료실
   회사홈(style.css)의 팔레트를 그대로 쓰되, 읽는 문서에 맞게
   본문 폭과 타이포를 따로 잡는다. style.css는 불러오지 않는다
   (회사홈은 랜딩용 레이아웃이라 글 페이지와 규칙이 충돌한다).
   Palette: paper #F7F5F0 / ink #1A2620 / green #14532D
            deep #0D2E1C / gold #C9A24B
   ============================================================ */

:root{
  --paper:#F7F5F0;
  --paper-2:#FFFFFF;
  --paper-3:#F1EDE4;
  --ink:#1A2620;
  --ink-soft:#46544C;
  --ink-faint:#77857B;
  --green:#14532D;
  --deep:#0D2E1C;
  --gold:#C9A24B;
  --gold-wash:#F6EFDD;
  --hair:rgba(26,38,32,.14);
  --hair-2:rgba(26,38,32,.08);
  --serif:"Noto Serif KR","Apple SD Gothic Neo",serif;
  --sans:"Pretendard Variable",Pretendard,-apple-system,"Malgun Gothic",sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body.ins{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  font-size:17px;
  line-height:1.85;
  word-break:keep-all;
  overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--gold);color:var(--deep)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ── 상단 바 ── */
.a-top{
  border-bottom:1px solid var(--hair);
  background:rgba(247,245,240,.92);
  backdrop-filter:saturate(1.4) blur(8px);
  position:sticky;top:0;z-index:20;
}
.a-top-in{
  max-width:860px;margin:0 auto;padding:0 28px;
  height:60px;display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.a-home{
  font-family:var(--serif);font-weight:700;font-size:16px;letter-spacing:-.01em;
  color:var(--deep);text-decoration:none;display:flex;align-items:center;gap:9px;
}
.a-mark{
  width:9px;height:9px;background:var(--gold);flex:none;
  transform:rotate(45deg);border-radius:1px;
}
.a-back{
  font-size:13.5px;color:var(--ink-soft);text-decoration:none;
  padding:6px 13px;border:1px solid var(--hair);border-radius:999px;
  white-space:nowrap;transition:.18s;
}
.a-back:hover{border-color:var(--gold);color:var(--deep);background:var(--gold-wash)}

/* ── 본문 ── */
.a-wrap{max-width:860px;margin:0 auto;padding:0 28px 110px}
article{max-width:100%}

.a-head{padding:56px 0 0;border-bottom:1px solid var(--hair);padding-bottom:30px}
.a-cat{
  font-size:12px;font-weight:700;letter-spacing:.14em;
  color:var(--gold);text-transform:none;
  display:inline-block;
}
.a-head h1{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(30px,5.2vw,42px);line-height:1.34;letter-spacing:-.022em;
  color:var(--deep);margin-top:14px;text-wrap:balance;
}
.a-lead{
  font-size:18px;line-height:1.8;color:var(--ink-soft);
  margin-top:18px;max-width:62ch;
}
.a-meta{
  margin-top:22px;display:flex;flex-wrap:wrap;gap:6px 18px;
  font-size:12.5px;color:var(--ink-faint);
}
.a-meta span{position:relative}
.a-meta span+span::before{
  content:"";position:absolute;left:-10px;top:50%;width:3px;height:3px;
  background:var(--hair);border-radius:50%;
}

/* ── 목차 ── */
.a-toc{
  margin-top:34px;padding:22px 26px;
  background:var(--paper-2);border:1px solid var(--hair-2);border-radius:4px;
}
.a-toc-h{
  font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--gold);margin-bottom:12px;
}
.a-toc ol{list-style:none;counter-reset:toc;display:flex;flex-direction:column;gap:7px}
.a-toc li{counter-increment:toc;position:relative;padding-left:26px}
.a-toc li::before{
  content:counter(toc,decimal-leading-zero);position:absolute;left:0;top:0;
  font-size:11.5px;font-weight:600;color:var(--gold);letter-spacing:.02em;line-height:2.1;
}
.a-toc a{
  font-size:15.5px;color:var(--ink-soft);text-decoration:none;
  border-bottom:1px solid transparent;transition:.15s;
}
.a-toc a:hover{color:var(--deep);border-bottom-color:var(--gold)}

/* ── 섹션 ── */
.a-sec{margin-top:52px;scroll-margin-top:80px}
.a-sec h2{
  font-family:var(--serif);font-weight:700;
  font-size:23px;line-height:1.45;letter-spacing:-.015em;
  color:var(--deep);text-wrap:balance;
  padding-top:14px;border-top:2px solid var(--deep);
}
.a-sec p{margin-top:17px;max-width:64ch}
.a-sec p+p{margin-top:15px}

.a-list{
  list-style:none;margin-top:18px;max-width:64ch;
  display:flex;flex-direction:column;gap:9px;
  background:var(--paper-2);border-left:2px solid var(--gold);
  padding:20px 24px;border-radius:0 4px 4px 0;
}
.a-list li{position:relative;padding-left:16px;font-size:16px;line-height:1.72}
.a-list li::before{
  content:"";position:absolute;left:0;top:.72em;
  width:5px;height:5px;background:var(--gold);border-radius:50%;
}

/* ── 상담 안내 ── */
.a-cta{
  margin-top:66px;padding:34px 34px 30px;
  background:var(--deep);color:var(--paper);border-radius:5px;
}
.a-cta h2{
  font-family:var(--serif);font-weight:700;font-size:21px;line-height:1.45;
  color:#fff;letter-spacing:-.015em;
}
.a-cta p{margin-top:13px;font-size:15.5px;line-height:1.8;color:rgba(247,245,240,.82);max-width:56ch}
.a-cta-btns{margin-top:24px;display:flex;flex-wrap:wrap;gap:11px}
.btn-p,.btn-s{
  display:inline-block;padding:12px 24px;border-radius:3px;
  font-size:15px;font-weight:600;text-decoration:none;transition:.18s;
}
.btn-p{background:var(--gold);color:var(--deep)}
.btn-p:hover{background:#d8b464}
.btn-s{border:1px solid rgba(247,245,240,.34);color:var(--paper)}
.btn-s:hover{border-color:var(--gold);color:var(--gold)}
.a-note{font-size:13px !important;color:rgba(247,245,240,.6) !important;margin-top:18px !important}

/* ── 원문 표기 ── */
.a-orig{
  margin-top:26px;font-size:13.5px;color:var(--ink-faint);
  padding-top:16px;border-top:1px solid var(--hair-2);
}
.a-orig a{color:var(--green);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}

/* ── 이전·다음 ── */
.a-pn{
  margin-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:14px;
}
.pn{
  display:block;padding:18px 20px;text-decoration:none;
  background:var(--paper-2);border:1px solid var(--hair-2);border-radius:4px;
  transition:.18s;
}
.pn:hover{border-color:var(--gold);background:var(--gold-wash)}
.pn span{display:block;font-size:11.5px;font-weight:700;letter-spacing:.1em;color:var(--gold)}
.pn b{display:block;margin-top:7px;font-size:15px;font-weight:600;line-height:1.55;color:var(--ink)}
.pn.nx{text-align:right}

/* ── 목록 페이지 ── */
.x-head{padding:60px 0 0}
.x-head h1{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(32px,6vw,46px);line-height:1.28;letter-spacing:-.025em;
  color:var(--deep);margin-top:14px;text-wrap:balance;
}
.x-count{
  margin-top:24px;padding-top:20px;border-top:2px solid var(--deep);
  font-size:13px;color:var(--ink-faint);
}
.x-count b{font-family:var(--serif);font-size:26px;color:var(--deep);margin-right:3px}

.x-cat{margin-top:50px}
.x-cat h2{
  font-family:var(--serif);font-size:19px;font-weight:700;color:var(--deep);
  letter-spacing:-.01em;display:flex;align-items:baseline;gap:10px;
  padding-bottom:11px;border-bottom:1px solid var(--hair);
}
.x-cat h2 i{font-style:normal;font-family:var(--sans);font-size:12px;font-weight:600;color:var(--gold)}
.x-list{list-style:none;margin-top:4px}
.x-list li{border-bottom:1px solid var(--hair-2)}
.x-list a{
  display:block;padding:17px 14px 17px 0;text-decoration:none;transition:.15s;
}
.x-list a:hover{padding-left:10px;padding-right:4px;background:var(--gold-wash)}
.x-list b{display:block;font-size:16.5px;font-weight:600;line-height:1.55;color:var(--ink)}
.x-list span{display:block;margin-top:5px;font-size:14px;line-height:1.6;color:var(--ink-faint)}

/* ── 푸터 ── */
.a-foot{border-top:1px solid var(--hair);background:var(--paper-3)}
.a-foot-in{
  max-width:860px;margin:0 auto;padding:26px 28px;
  display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:space-between;
  font-size:12.5px;color:var(--ink-faint);
}
.a-foot-in a{color:var(--ink-soft);text-decoration:none}
.a-foot-in a:hover{color:var(--green);text-decoration:underline;text-underline-offset:3px}

@media (max-width:620px){
  body.ins{font-size:16.5px}
  .a-wrap{padding:0 20px 80px}
  .a-top-in,.a-foot-in{padding-left:20px;padding-right:20px}
  .a-head{padding-top:38px}
  .a-sec{margin-top:42px}
  .a-cta{padding:26px 22px 24px}
  .a-pn{grid-template-columns:1fr}
  .pn.nx{text-align:left}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important}}