/*
Theme Name: Nomalab Child
Theme URI: https://nomalab.kr
Description: GeneratePress 기반 노마랩 차일드 테마. Wanted Design System(원티드 디자인 시스템) 토큰을 사이트 전역에 적용합니다.
Author: Nomalab
Author URI: https://nomalab.kr
Template: generatepress
Version: 1.0.2
Text Domain: nomalab-child
*/

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css');
@import url('https://cdn.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.3/packages/wanted-sans/fonts/webfonts/variable/split/WantedSansVariable.css');

/* ===== Design Tokens ===== */
:root {
  --nl-bg: #FFFFFF;
  --nl-bg-layer1: #F2F2F2;
  --nl-bg-tint: #EBF2FE;
  --nl-label: #1A1A1A;
  --nl-label-alt: #4D4D4D;
  --nl-label-assist: #8C8C8C;
  --nl-line: #E5E5E5;
  --nl-line-strong: #B3B3B3;
  --nl-primary: #2272E6;
  --nl-primary-strong: #1A5ACC;
  --nl-primary-light: #EBF2FE;

  --nl-font-body: 'Pretendard', 'Pretendard JP', -apple-system, BlinkMacSystemFont, sans-serif;
  --nl-font-brand: 'Wanted Sans Variable', 'Wanted Sans', 'Pretendard', sans-serif;
}

/* ===== Base Typography ===== */
body {
  font-family: var(--nl-font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--nl-label);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title,
.main-title,
.widget-title {
  font-family: var(--nl-font-brand);
  color: var(--nl-label);
  font-weight: 700;
  letter-spacing: -0.01em;
}

h1 { font-size: 36px; line-height: 1.286; }
h2 { font-size: 28px; line-height: 1.357; }
h3 { font-size: 24px; line-height: 1.333; letter-spacing: -0.005em; }
h4 { font-size: 20px; line-height: 1.4; font-weight: 600; letter-spacing: 0; }
h5 { font-size: 18px; line-height: 1.4; font-weight: 600; letter-spacing: 0; }
h6 { font-size: 16px; line-height: 1.5; font-weight: 600; letter-spacing: 0; }

/* entry-title 컨텍스트별 분리: 단일 글/페이지는 크게, 카드·아카이브는 작게 */
.entry-title { font-size: 20px; line-height: 1.4; }

.single .entry-title,
.page .entry-title {
  font-size: 36px;
  line-height: 1.286;
}

.blog .entry-title,
.archive .entry-title,
.search .entry-title,
.generate-columns .entry-title,
.gb-loop-item .entry-title,
.gb-post-grid-template .entry-title,
.gb-grid-wrapper .entry-title {
  font-size: 19px;
  line-height: 1.4;
  margin-bottom: 4px;
}

/* GenerateBlocks 카드 제목 보강 (Loop·Grid 컨테이너 안 헤딩 일괄) */
.gb-loop-item h1,
.gb-loop-item h2,
.gb-loop-item h3,
.gb-loop-item .gb-headline,
.gb-loop-item .wp-block-post-title,
.gb-grid-wrapper h1,
.gb-grid-wrapper h2,
.gb-grid-wrapper h3,
.gb-grid-wrapper .gb-headline,
.gb-grid-wrapper .wp-block-post-title,
.gb-post-grid-template .gb-headline,
.wp-block-query .wp-block-post-title,
.wp-block-query .gb-headline {
  font-size: 18px !important;
  line-height: 1.4 !important;
}
/* 카드 제목 링크 색상 통일: 평소 검정 / 호버 시 파란색 */
.gb-headline a,
.gb-headline-text a,
.wp-block-post-title a,
h1.gb-headline a,
h2.gb-headline a,
h3.gb-headline a,
.gb-loop-item h1 a,
.gb-loop-item h2 a,
.gb-loop-item h3 a,
.gb-grid-wrapper h1 a,
.gb-grid-wrapper h2 a,
.gb-grid-wrapper h3 a,
.wp-block-query h1 a,
.wp-block-query h2 a,
.wp-block-query h3 a {
  color: var(--nl-label) !important;
  text-decoration: none !important;
}

.gb-headline a:hover,
.gb-headline-text a:hover,
.wp-block-post-title a:hover,
h1.gb-headline a:hover,
h2.gb-headline a:hover,
h3.gb-headline a:hover,
.gb-loop-item h1 a:hover,
.gb-loop-item h2 a:hover,
.gb-loop-item h3 a:hover,
.gb-grid-wrapper h1 a:hover,
.gb-grid-wrapper h2 a:hover,
.gb-grid-wrapper h3 a:hover,
.wp-block-query h1 a:hover,
.wp-block-query h2 a:hover,
.wp-block-query h3 a:hover {
  color: var(--nl-primary) !important;
}

a {
  color: var(--nl-primary);
  text-decoration: none;
  transition: color 0.15s ease;
}
a:hover {
  color: var(--nl-primary-strong);
  text-decoration: underline;
}

/* ===== Blog · Page Content (가시성 핵심) ===== */
.single .entry-content,
.page .entry-content,
.blog .entry-content,
.archive .entry-content {
  font-size: 17px;
  line-height: 1.8;
  color: var(--nl-label);
}

.entry-content p {
  margin: 0 0 1.4em;
}

.entry-content h2 {
  margin-top: 2em;
  margin-bottom: 0.6em;
  font-size: 28px;
}

.entry-content h3 {
  margin-top: 1.6em;
  margin-bottom: 0.5em;
  font-size: 22px;
}

.entry-content ul,
.entry-content ol {
  padding-left: 1.4em;
  margin: 0 0 1.4em;
}

.entry-content li {
  margin-bottom: 0.5em;
  line-height: 1.75;
}

.entry-content blockquote {
  border-left: 3px solid var(--nl-primary);
  background: var(--nl-bg-layer1);
  padding: 16px 20px;
  margin: 1.6em 0;
  color: var(--nl-label-alt);
  font-size: 16px;
}

.entry-content code {
  background: var(--nl-bg-layer1);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.92em;
  font-family: 'JetBrains Mono', Consolas, Monaco, monospace;
}

.entry-content pre {
  background: #1A1A1A;
  color: #F2F2F2;
  padding: 16px 20px;
  border-radius: 8px;
  overflow-x: auto;
  font-size: 14px;
  line-height: 1.6;
  margin: 1.5em 0;
}

.entry-content img {
  border-radius: 8px;
  margin: 1em 0;
}

/* 블로그 아카이브 카드 */
.blog .entry-title a,
.archive .entry-title a {
  color: var(--nl-label);
}
.blog .entry-title a:hover,
.archive .entry-title a:hover {
  color: var(--nl-primary);
  text-decoration: none;
}

.entry-meta,
.entry-meta a {
  color: var(--nl-label-assist);
  font-size: 13px;
}
.entry-meta a:hover {
  color: var(--nl-label-alt);
}

/* ===== Header · Navigation ===== */
.site-title a {
  font-family: var(--nl-font-brand);
  font-weight: 700;
  color: var(--nl-label);
}

.main-navigation .menu-item > a {
  font-family: var(--nl-font-body);
  font-size: 15px;
  font-weight: 500;
  color: var(--nl-label);
}
.main-navigation .menu-item > a:hover,
.main-navigation .current-menu-item > a {
  color: var(--nl-primary);
}

/* ===== Footer (크기 다운 · 톤 차분하게) ===== */
.site-footer,
.footer-widgets,
.footer-bar,
.site-info {
  font-family: var(--nl-font-body);
  font-size: 13px;
  line-height: 1.6;
  color: var(--nl-label-alt);
}

.footer-widgets {
  padding: 48px 0 32px;
  background: var(--nl-bg-layer1);
  border-top: 1px solid var(--nl-line);
}

.footer-widgets .widget-title {
  font-family: var(--nl-font-brand);
  font-size: 14px;
  font-weight: 600;
  color: var(--nl-label);
  margin-bottom: 12px;
  letter-spacing: 0;
}

.footer-widgets .widget {
  font-size: 13px;
  line-height: 1.7;
}

.footer-widgets a {
  color: var(--nl-label-alt);
}
.footer-widgets a:hover {
  color: var(--nl-primary);
  text-decoration: none;
}

.site-info,
.site-info a {
  font-size: 12px;
  color: var(--nl-label-assist);
}
.site-info a:hover {
  color: var(--nl-label-alt);
  text-decoration: underline;
}

/* ===== Buttons (Gutenberg + 기본) ===== */
.wp-block-button__link,
.button,
input[type="submit"],
button[type="submit"] {
  font-family: var(--nl-font-body) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  background: var(--nl-primary) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  padding: 14px 24px !important;
  border: none !important;
  text-decoration: none !important;
  transition: background 0.15s ease;
  cursor: pointer;
}
.wp-block-button__link:hover,
.button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background: var(--nl-primary-strong) !important;
  color: #ffffff !important;
}

/* ===== Forms ===== */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
textarea,
select {
  font-family: var(--nl-font-body);
  font-size: 15px;
  padding: 12px 16px;
  border: 1px solid #999999;
  border-radius: 6px;
  background: #ffffff;
  color: var(--nl-label);
  box-sizing: border-box;
}
input:focus,
textarea:focus,
select:focus {
  border-color: var(--nl-primary);
  outline: none;
}

::placeholder {
  color: var(--nl-label-assist);
}

/* ===== 모바일 보정 ===== */
@media (max-width: 768px) {
  body { font-size: 15px; }
  .single .entry-content,
  .page .entry-content,
  .blog .entry-content {
    font-size: 16px;
    line-height: 1.75;
  }
  h1 { font-size: 28px; }
  .single .entry-title,
  .page .entry-title { font-size: 26px; }
  .blog .entry-title,
  .archive .entry-title,
  .search .entry-title,
  .generate-columns .entry-title,
  .gb-loop-item .entry-title,
  .gb-grid-wrapper .entry-title { font-size: 17px; }
  h2 { font-size: 24px; }
  .entry-content h2 { font-size: 22px; }
  .entry-content h3 { font-size: 19px; }
}