/*
Theme Name:  이슈랩
Version:     6.0
Description: 이슈랩 프리미엄 타이포그래피 매거진
*/

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Serif+Display:ital@0;1&family=Noto+Serif+KR:wght@300;400;700&family=DM+Sans:wght@300;400;500&display=swap');

/* ═══════════════════════════════════════
   DESIGN TOKENS — 가독성 최적화
═══════════════════════════════════════ */
:root {
  /* 밝은 영역 (카드, 본문) */
  --ink:       #111111;
  --paper:     #f3f0ea;
  --rule:      #d8d4cc;
  --surface:   #e8e5de;
  --muted:     #666260;   /* 기존보다 진하게 */
  --faint:     #999693;   /* 기존보다 진하게 */
  --red:       #c8000a;

  /* 어두운 영역 (헤더, 푸터) */
  --dark:      #0d0d0d;
  --dark-rule: #2a2a2a;   /* 기존보다 밝게 */

  /* 어두운 배경 위 텍스트 */
  --on-dark-primary:   #f3f0ea;   /* 주요 텍스트 */
  --on-dark-secondary: #aaa8a4;   /* 보조 텍스트 */
  --on-dark-muted:     #666462;   /* 힌트 텍스트 */

  --f-display: 'Bebas Neue', Impact, sans-serif;
  --f-serif:   'DM Serif Display', 'Noto Serif KR', Georgia, serif;
  --f-kor:     'Noto Serif KR', Georgia, serif;
  --f-body:    'DM Sans', 'Apple SD Gothic Neo', sans-serif;

  --t-fast: 0.15s ease;
  --t-mid:  0.25s ease;
  --t-slow: 0.4s ease;
}

/* ═══════════════════════════════════════
   RESET
═══════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  background:  var(--paper);
  color:       var(--ink);
  font-family: var(--f-body);
  font-size:   15px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}
img  { display: block; width: 100%; height: auto; }
a    { color: inherit; text-decoration: none; transition: color var(--t-fast); }
ul, ol { list-style: none; }
::selection { background: var(--ink); color: var(--paper); }
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--paper); }
::-webkit-scrollbar-thumb { background: var(--ink); }
::-webkit-scrollbar-thumb:hover { background: var(--red); }

/* ═══════════════════════════════════════
   HEADER
═══════════════════════════════════════ */
.il-header {
  background:  var(--dark);
  border-top:  3px solid var(--red);
  position:    sticky;
  top:         0;
  z-index:     200;
  width:       100%;
}
.admin-bar .il-header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .il-header { top: 46px; } }

.il-header__inner {
  max-width:   1280px;
  margin:      0 auto;
  padding:     0 40px;
  display:     flex;
  align-items: center;
  height:      64px;
  gap:         0;
}
.il-logo-link {
  display:         flex;
  flex-direction:  column;
  text-decoration: none;
  flex-shrink:     0;
  margin-right:    auto;
}
.il-logo-text {
  font-family:    var(--f-display);
  font-size:      34px;
  font-weight:    400;
  color:          var(--on-dark-primary);
  letter-spacing: 0.06em;
  line-height:    1;
}
.il-logo-sub {
  font-size:      9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color:          var(--on-dark-secondary); /* 밝게 */
  margin-top:     4px;
}
.il-nav { height: 64px; display: flex; }
.il-nav__list {
  display:     flex;
  align-items: stretch;
  height:      100%;
}
.il-nav__list li { display: flex; align-items: stretch; }
.il-nav__list li a {
  display:        flex;
  align-items:    center;
  font-size:      11px;
  font-weight:    500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color:          var(--on-dark-secondary); /* 밝게 */
  padding:        0 20px;
  border-left:    1px solid var(--dark-rule);
  transition:     color var(--t-fast), background var(--t-fast);
}
.il-nav__list li a:hover,
.il-nav__list .current-menu-item > a {
  color:      var(--on-dark-primary);
  background: #1a1a1a;
}
.il-header__search {
  border-left:  1px solid var(--dark-rule);
  margin-left:  8px;
  padding-left: 20px;
  display:      flex;
  align-items:  center;
}
.il-search-btn {
  color:       var(--on-dark-secondary); /* 밝게 */
  display:     flex;
  align-items: center;
  padding:     6px;
  transition:  color var(--t-fast);
}
.il-search-btn:hover { color: var(--on-dark-primary); }

/* ═══════════════════════════════════════
   MAIN WRAPPER
═══════════════════════════════════════ */
.il-archive-main,
.il-search-main {
  max-width: 1280px;
  margin:    0 auto;
  padding:   0 40px 80px;
}

/* ═══════════════════════════════════════
   SECTION BAR
═══════════════════════════════════════ */
.il-section-bar {
  display:       flex;
  align-items:   center;
  gap:           14px;
  border-top:    3px solid var(--ink);
  border-bottom: 1px solid var(--rule);
  padding:       13px 0;
  margin:        40px 0 0;
}
.il-section-bar--archive { margin-top: 0; }
.il-section-bar__title {
  font-family:    var(--f-display);
  font-size:      14px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color:          var(--ink); /* 진하게 */
}
.il-section-bar__line { flex: 1; height: 1px; background: var(--rule); }
.il-section-bar__sub  {
  font-size:      11px;
  letter-spacing: 0.1em;
  color:          var(--muted); /* 진하게 */
}

/* ═══════════════════════════════════════
   ARCHIVE HEADER (다크 배경)
═══════════════════════════════════════ */
.il-archive-header {
  background: var(--dark);
  margin:     0 -40px;
  padding:    60px 40px 52px;
}
.il-archive-eyebrow { margin-bottom: 14px; }
.il-archive-type {
  font-size:      9px;
  font-weight:    600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color:          var(--red);
}
.il-archive-title {
  font-family:    var(--f-serif);
  font-size:      48px;
  font-weight:    400;
  color:          var(--on-dark-primary);
  line-height:    1.1;
  letter-spacing: -0.02em;
  margin-bottom:  14px;
}
.il-archive-desc {
  font-size:   15px;
  color:       var(--on-dark-secondary); /* 더 밝게 */
  line-height: 1.7;
  margin-bottom: 12px;
}
.il-archive-count {
  font-size:      11px;
  letter-spacing: 0.1em;
  color:          var(--on-dark-muted);
  text-transform: uppercase;
}

/* ═══════════════════════════════════════
   POST GRID
═══════════════════════════════════════ */
.il-archive-grid {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
  border-left:           1px solid var(--rule);
  border-top:            1px solid var(--rule);
}
@media (max-width: 1100px) { .il-archive-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .il-archive-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .il-archive-grid { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════
   CARD
═══════════════════════════════════════ */
.il-card {
  background:     var(--paper);
  border-right:   1px solid var(--rule);
  border-bottom:  1px solid var(--rule);
  display:        flex;
  flex-direction: column;
  transition:     background var(--t-fast);
}
.il-card:hover { background: var(--surface); }
.il-card--featured { grid-column: span 2; }
.il-card--featured .il-card__img { height: 280px; }
.il-card--featured .il-card__title { font-size: 22px !important; line-height: 1.3 !important; }

.il-card__link { display: flex; flex-direction: column; flex: 1; }

/* 카드 이미지 */
.il-card__img {
  position:    relative;
  height:      190px;
  overflow:    hidden;
  background:  #1c1c1c; /* 완전 검은색 대신 약간 밝게 */
  flex-shrink: 0;
}
.il-card__thumb {
  width:      100% !important;
  height:     100% !important;
  object-fit: cover !important;
  transition: transform var(--t-slow), filter var(--t-slow);
}
.il-card:hover .il-card__thumb { transform: scale(1.04); }
/* 이미지 없을 때 - 패턴으로 구분 */
.il-card__noimg {
  width:       100%;
  height:      100%;
  background:  linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 50%, #1a1a1a 100%);
  display:     flex;
  align-items: center;
  justify-content: center;
}
.il-card__noimg::after {
  content:        'NO IMAGE';
  font-family:    var(--f-display);
  font-size:      11px;
  letter-spacing: 0.2em;
  color:          #3a3a3a;
}
.il-card__overlay {
  position:   absolute;
  inset:      0;
  background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, transparent 50%);
  pointer-events: none;
}

/* 카드 배지 */
.il-card__badge {
  position:       absolute;
  top:            0;
  left:           0;
  z-index:        3;
  background:     var(--red);
  color:          #fff;
  font-size:      9px;
  font-weight:    700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding:        5px 10px;
}

/* 카드 번호 */
.il-card__no {
  position:       absolute;
  bottom:         10px;
  right:          12px;
  z-index:        2;
  font-family:    var(--f-display);
  font-size:      44px;
  color:          rgba(255,255,255,0.15); /* 약간 더 보이게 */
  line-height:    1;
  pointer-events: none;
}

/* 카드 텍스트 */
.il-card__body { padding: 18px 20px 10px; flex: 1; }
.il-card__title {
  font-family: var(--f-kor);
  font-size:   15px; /* 키움 */
  font-weight: 700;
  line-height: 1.5;
  color:       var(--ink);
  margin:      0 0 8px;
  transition:  color var(--t-fast);
}
.il-card:hover .il-card__title { color: var(--red); }
.il-card__excerpt {
  font-size:          13px; /* 키움 */
  color:              var(--muted);
  line-height:        1.65;
  display:            -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:           hidden;
}

/* 카드 푸터 */
.il-card__foot {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  border-top:      1px solid var(--rule);
  padding:         10px 20px 14px;
  margin-top:      12px;
}
.il-card__date {
  font-size:      11px; /* 키움 */
  color:          var(--muted); /* 더 진하게 */
  letter-spacing: 0.06em;
}
.il-card__arr {
  font-size:  14px;
  color:      var(--muted);
  transition: color var(--t-fast), transform var(--t-fast);
}
.il-card:hover .il-card__arr { color: var(--red); transform: translateX(3px); }

/* ═══════════════════════════════════════
   PAGINATION
═══════════════════════════════════════ */
.il-pagination {
  display:         flex;
  justify-content: center;
  border-top:      1px solid var(--rule);
  border-bottom:   1px solid var(--rule);
  margin-top:      48px;
}
.il-pagination .page-numbers {
  background:     transparent;
  border-right:   1px solid var(--rule);
  color:          var(--muted);
  padding:        14px 24px;
  font-family:    var(--f-display);
  font-size:      13px;
  letter-spacing: 0.1em;
  transition:     all var(--t-fast);
}
.il-pagination .page-numbers:hover,
.il-pagination .page-numbers.current { background: var(--ink); color: var(--paper); }

/* ═══════════════════════════════════════
   NO POSTS
═══════════════════════════════════════ */
.il-no-posts { padding: 80px 0; text-align: center; }
.il-no-posts__text { font-size: 16px; color: var(--muted); margin-bottom: 24px; }
.il-no-posts__btn {
  display: inline-block; background: var(--ink); color: var(--paper);
  padding: 11px 32px; font-size: 11px; letter-spacing: 0.14em;
  text-transform: uppercase; transition: background var(--t-fast);
}
.il-no-posts__btn:hover { background: var(--red); }

/* ═══════════════════════════════════════
   SINGLE POST
═══════════════════════════════════════ */
.il-single-main { background: var(--paper); min-height: 100vh; }
.il-article-header { background: var(--dark); }
.il-article-header__inner { max-width: 860px; margin: 0 auto; padding: 56px 40px 48px; }
.il-article-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; }
.il-article-cat {
  font-size: 9px; font-weight: 700; letter-spacing: 0.2em;
  text-transform: uppercase; background: var(--red); color: #fff; padding: 5px 11px;
}
.il-article-issue {
  font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--on-dark-secondary); /* 밝게 */
}
.il-article-title {
  font-family: var(--f-serif);
  font-size: 48px; font-weight: 400;
  color: var(--on-dark-primary);
  line-height: 1.1; letter-spacing: -0.02em; margin-bottom: 28px;
}
.il-article-meta {
  display: flex; align-items: center; justify-content: space-between;
  border-top: 1px solid var(--dark-rule); padding-top: 18px;
}
.il-article-meta__left { display: flex; align-items: center; gap: 16px; }
.il-article-author { font-size: 12px; color: var(--on-dark-secondary); letter-spacing: 0.08em; }
.il-article-date   { font-size: 11px; color: var(--on-dark-muted); letter-spacing: 0.06em; }
.il-back-btn {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--on-dark-secondary); transition: color var(--t-fast);
}
.il-back-btn:hover { color: var(--on-dark-primary); }

.il-article-thumb { max-height: 520px; overflow: hidden; }
.il-article-thumb__img { width: 100%; height: 520px; object-fit: cover; }

.il-article-content { background: var(--paper); }
.il-article-content__inner { max-width: 760px; margin: 0 auto; padding: 52px 40px 64px; }
.il-article-content__inner > p:first-of-type {
  font-family: var(--f-serif); font-size: 20px; font-weight: 300;
  color: #444; line-height: 1.8; margin-bottom: 36px;
}
.il-article-content__inner p { font-size: 16px; line-height: 1.9; color: #333; margin-bottom: 20px; }
.il-article-content__inner h2 {
  font-family: var(--f-kor); font-size: 22px; font-weight: 700; color: var(--ink);
  border-top: 2px solid var(--ink); padding-top: 24px; margin: 56px 0 18px;
}
.il-article-content__inner h3 { font-family: var(--f-kor); font-size: 18px; font-weight: 700; color: var(--ink); margin: 40px 0 12px; }
.il-article-content__inner blockquote {
  border-left: 3px solid var(--red); padding: 4px 0 4px 24px; margin: 36px 0;
  font-family: var(--f-serif); font-size: 22px; font-weight: 400;
  color: #555; font-style: italic; line-height: 1.5;
}
.il-article-content__inner hr { border: none; border-top: 1px solid var(--rule); margin: 48px 0; }
.il-article-content__inner img { margin: 32px 0; }
.il-article-content__inner figcaption { font-size: 12px; color: var(--muted); padding-top: 8px; letter-spacing: 0.06em; }

/* 태그 */
.il-article-tags { border-top: 1px solid var(--rule); }
.il-article-tags__inner { max-width: 760px; margin: 0 auto; padding: 24px 40px; display: flex; gap: 8px; flex-wrap: wrap; }
.il-tag {
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  border: 1px solid var(--rule); color: var(--muted); padding: 6px 14px;
  transition: all var(--t-fast);
}
.il-tag:hover { border-color: var(--ink); color: var(--ink); }

/* 이전/다음 */
.il-post-nav { border-top: 1px solid var(--rule); background: var(--surface); }
.il-post-nav__inner { max-width: 760px; margin: 0 auto; padding: 32px 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.il-post-nav__label { display: block; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.il-post-nav__title { font-size: 14px; font-weight: 700; color: var(--ink); transition: color var(--t-fast); line-height: 1.4; }
.il-post-nav__title:hover { color: var(--red); }
.il-post-nav__next { text-align: right; }

/* 관련 글 */
.il-related { border-top: 2px solid var(--ink); }
.il-related__inner { max-width: 1280px; margin: 0 auto; padding: 48px 40px 64px; }
.il-related__grid { display: grid; grid-template-columns: repeat(3, 1fr); border-left: 1px solid var(--rule); border-top: 1px solid var(--rule); }
.il-related-card { border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); transition: background var(--t-fast); }
.il-related-card:hover { background: var(--surface); }
.il-related-card__link { display: flex; flex-direction: column; }
.il-related-card__img { position: relative; height: 160px; overflow: hidden; background: #1c1c1c; }
.il-related-card__thumb { width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform var(--t-slow); }
.il-related-card:hover .il-related-card__thumb { transform: scale(1.05); }
.il-related-card__noimg { width: 100%; height: 100%; background: linear-gradient(135deg, #1a1a1a, #2a2a2a); }
.il-related-card__badge {
  position: absolute; top: 0; left: 0; z-index: 3;
  background: var(--red); color: #fff; font-size: 8px;
  font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; padding: 4px 9px;
}
.il-related-card__body { padding: 16px 18px 18px; }
.il-related-card__title { font-family: var(--f-kor); font-size: 14px; font-weight: 700; line-height: 1.45; color: var(--ink); margin-bottom: 8px; transition: color var(--t-fast); }
.il-related-card:hover .il-related-card__title { color: var(--red); }
.il-related-card__date { font-size: 11px; color: var(--muted); letter-spacing: 0.06em; }

/* 댓글 */
.il-comments { border-top: 1px solid var(--rule); }
.il-comments__inner { max-width: 760px; margin: 0 auto; padding: 48px 40px 64px; }

/* ═══════════════════════════════════════
   SEARCH
═══════════════════════════════════════ */
.il-search-header { background: var(--dark); margin: 0 -40px; padding: 60px 40px 52px; }
.il-search-header__inner { max-width: 800px; }

/* ═══════════════════════════════════════
   FOOTER — 다크 배경 가독성 개선
═══════════════════════════════════════ */
.il-footer {
  background:  var(--dark);
  border-top:  2px solid var(--red);
  margin-top:  80px;
}
.il-footer__inner {
  max-width:   1280px;
  margin:      0 auto;
  padding:     52px 40px 44px;
  display:     flex;
  gap:         64px;
  align-items: flex-start;
}
.il-footer__logo {
  font-family:     var(--f-display);
  font-size:       36px;
  color:           var(--on-dark-primary); /* 밝게 */
  letter-spacing:  0.06em;
  line-height:     1;
  display:         block;
  margin-bottom:   14px;
}
.il-footer__desc {
  font-size:   13px;
  color:       var(--on-dark-secondary); /* 밝게 */
  line-height: 1.7;
  max-width:   260px;
}
.il-footer__nav { margin-left: auto; }
.il-footer__nav-list { display: flex; flex-wrap: wrap; gap: 12px 44px; }
.il-footer__nav-list li a {
  font-size:       11px;
  letter-spacing:  0.12em;
  text-transform:  uppercase;
  color:           var(--on-dark-secondary); /* 밝게 */
  transition:      color var(--t-fast);
}
.il-footer__nav-list li a:hover { color: var(--on-dark-primary); }
.il-footer__copy { border-top: 1px solid var(--dark-rule); }
.il-footer__copy-inner {
  max-width:       1280px;
  margin:          0 auto;
  padding:         16px 40px;
  display:         flex;
  justify-content: space-between;
  font-size:       11px;
  color:           var(--on-dark-muted); /* 밝게 */
  letter-spacing:  0.08em;
  text-transform:  uppercase;
}

/* ═══════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════ */
@media (max-width: 768px) {
  .il-header__inner { padding: 0 20px; height: 56px; }
  .il-logo-text { font-size: 28px; }
  .il-archive-main, .il-search-main { padding: 0 20px 60px; }
  .il-archive-header, .il-search-header { margin: 0 -20px; padding: 40px 20px 36px; }
  .il-archive-title { font-size: 32px; }
  .il-article-title { font-size: 32px; }
  .il-article-header__inner { padding: 40px 20px 36px; }
  .il-article-content__inner { padding: 40px 20px 48px; }
  .il-related__grid { grid-template-columns: 1fr; }
  .il-post-nav__inner { grid-template-columns: 1fr; }
  .il-footer__inner { flex-direction: column; gap: 32px; padding: 40px 20px 32px; }
  .il-footer__nav { margin-left: 0; }
  .il-footer__copy-inner { padding: 14px 20px; flex-direction: column; gap: 6px; }
}

/* ═══════════════════════════════════════
   SINGLE POST — 제목 임팩트 강화
═══════════════════════════════════════ */
.il-article-title {
  font-family:    var(--f-serif) !important;
  font-size:      56px !important;
  font-weight:    400 !important;
  color:          var(--on-dark-primary) !important;
  line-height:    1.08 !important;
  letter-spacing: -0.03em !important;
  margin-bottom:  32px !important;
}
@media (max-width: 768px) {
  .il-article-title { font-size: 36px !important; }
}

/* ═══════════════════════════════════════
   댓글 영역 스타일 개선
═══════════════════════════════════════ */
.il-comments__inner h2,
.il-comments__inner .comments-title {
  font-family:    var(--f-display);
  font-size:      14px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color:          var(--ink);
  border-top:     3px solid var(--ink);
  border-bottom:  1px solid var(--rule);
  padding:        13px 0;
  margin-bottom:  32px;
}
.il-comments__inner .comment-list {
  list-style: none;
  padding:    0;
  margin:     0 0 40px;
}
.il-comments__inner .comment {
  border-bottom: 1px solid var(--rule);
  padding:       24px 0;
}
.il-comments__inner .comment-author {
  font-size:   13px;
  font-weight: 700;
  color:       var(--ink);
  margin-bottom: 6px;
}
.il-comments__inner .comment-content p {
  font-size:   14px;
  color:       #444;
  line-height: 1.75;
}
.il-comments__inner .comment-meta {
  font-size:   11px;
  color:       var(--muted);
  margin-bottom: 10px;
}
/* 댓글 폼 */
.il-comments__inner .comment-respond {
  margin-top: 40px;
  border-top: 2px solid var(--ink);
  padding-top: 32px;
}
.il-comments__inner .comment-reply-title {
  font-family:    var(--f-display);
  font-size:      14px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color:          var(--ink);
  margin-bottom:  24px;
  display:        block;
}
.il-comments__inner .comment-form label {
  display:        block;
  font-size:      11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color:          var(--muted);
  margin-bottom:  6px;
  margin-top:     16px;
}
.il-comments__inner .comment-form input[type="text"],
.il-comments__inner .comment-form input[type="email"],
.il-comments__inner .comment-form input[type="url"],
.il-comments__inner .comment-form textarea {
  width:          100%;
  background:     var(--surface);
  border:         1px solid var(--rule);
  border-radius:  0;
  padding:        10px 14px;
  font-size:      14px;
  color:          var(--ink);
  font-family:    var(--f-body);
  outline:        none;
  transition:     border-color var(--t-fast);
}
.il-comments__inner .comment-form input:focus,
.il-comments__inner .comment-form textarea:focus {
  border-color: var(--ink);
}
.il-comments__inner .comment-form textarea {
  min-height: 140px;
  resize:     vertical;
}
.il-comments__inner .form-submit .submit {
  background:     var(--ink);
  color:          var(--paper);
  border:         none;
  padding:        12px 32px;
  font-family:    var(--f-display);
  font-size:      13px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor:         pointer;
  margin-top:     16px;
  transition:     background var(--t-fast);
}
.il-comments__inner .form-submit .submit:hover {
  background: var(--red);
}

/* ═══════════════════════════════════════
   모바일 최적화 강화
═══════════════════════════════════════ */
@media (max-width: 768px) {
  /* 헤더 */
  .il-header__inner,
  header > div { padding: 0 16px !important; height: 56px !important; }

  /* 카드 폰트 */
  .il-card__title  { font-size: 14px !important; }
  .il-card__excerpt { font-size: 12px !important; }
  .il-card__date   { font-size: 10px !important; }
  .il-card__img    { height: 150px !important; }
  .il-card--featured .il-card__img { height: 200px !important; }
  .il-card--featured .il-card__title { font-size: 17px !important; }
  .il-card--featured { grid-column: span 2; }

  /* 단일 포스트 */
  .il-article-header__inner { padding: 32px 20px 28px !important; }
  .il-article-content__inner { padding: 32px 20px 48px !important; }
  .il-article-content__inner > p:first-of-type { font-size: 17px !important; }
  .il-article-content__inner p { font-size: 15px !important; }
  .il-related__inner { padding: 32px 20px 48px !important; }
  .il-related__grid { grid-template-columns: 1fr !important; }
  .il-post-nav__inner { grid-template-columns: 1fr !important; gap: 24px !important; padding: 24px 20px !important; }
  .il-post-nav__next { text-align: left !important; }
  .il-comments__inner { padding: 32px 20px 48px !important; }

  /* 섹션바 */
  .il-archive-main,
  .il-search-main { padding: 0 16px 60px !important; }
  .il-section-bar { margin: 28px 0 0 !important; }

  /* 푸터 */
  .il-footer__inner { padding: 36px 16px 28px !important; flex-direction: column !important; gap: 28px !important; }
  .il-footer__copy-inner { padding: 14px 16px !important; flex-direction: column !important; gap: 4px !important; font-size: 10px !important; }
}

@media (max-width: 480px) {
  .il-archive-grid { grid-template-columns: 1fr !important; }
  .il-card--featured { grid-column: span 1 !important; }
}

/* ═══════════════════════════════════════
   헤더 관리자바 보정
═══════════════════════════════════════ */
.admin-bar .il-header,
.admin-bar header { top: 32px !important; }
@media screen and (max-width: 782px) {
  .admin-bar .il-header,
  .admin-bar header { top: 46px !important; }
}