/*
Theme Name: Handlove
Theme URI: https://blog.naver.com/handlove
Author: handlove
Description: 나날로그 스타일의 포근한 개인 블로그 테마. 파스텔 히어로 배너와 손글씨 태그라인, 썸네일 리스트형 카드를 사용합니다. 홈은 히어로 이미지 → 최신글 → 투자 → 교육 → 프로그래머 순으로 구성되며 카테고리별 고유 파스텔 색을 지원합니다.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: handlove
*/

@font-face{
  font-family:'Nanum Pen Script';
  src:url('assets/fonts/NanumPenScript-Regular.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

:root{
  --paper:#FFFDFB;
  --paper-2:#F6F2EC;
  --ink:#3A3733;
  --ink-soft:#6B665F;
  --muted:#A9A49B;
  --line:#ECE7DF;
  --brand:#6FA79F;          /* 타이틀 배지 / 브랜드 (teal) */
  --brand-ink:#4E837B;
  --title:#8A90C8;          /* 글 제목 링크 (soft periwinkle) */
  --title-ink:#6B72B4;
  --c-invest:#7FA98C;       /* 투자 */
  --c-education:#7E9BC4;    /* 교육 */
  --c-programmer:#B592B0;   /* 프로그래머 */
  --maxw:1120px;
  --radius:14px;
  --font-hand:"Nanum Pen Script", cursive;
  --font-sans:"Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", system-ui, sans-serif;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;font-family:var(--font-sans);font-size:16px;line-height:1.75;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

/* ---------- header ---------- */
.site-header{border-bottom:1px solid var(--line);background:rgba(255,253,251,.92);backdrop-filter:blur(6px);position:sticky;top:0;z-index:50;}
.site-header .wrap{display:flex;align-items:center;justify-content:center;height:66px;gap:20px;position:relative;}
.brand{font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--brand-ink);display:inline-flex;align-items:center;gap:8px;}
.brand img{max-height:36px;width:auto;}
.nav-menu{display:flex;gap:24px;list-style:none;margin:0;padding:0;align-items:center;}
.nav-menu a{font-size:15px;color:var(--ink-soft);letter-spacing:-.01em;padding:6px 0;}
.nav-menu a:hover{color:var(--brand-ink);}
.nav-menu .current-menu-item>a{color:var(--brand-ink);font-weight:600;}
.menu-toggle{display:none;background:none;border:0;font-size:22px;line-height:1;color:var(--ink);cursor:pointer;padding:6px;}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#DCEEF0 0%,#EAF2E4 55%,#FBF6E9 100%);}
.hero.has-img{background:var(--paper-2);}
.hero-media{position:relative;min-height:clamp(190px,19vw,320px);display:flex;align-items:flex-start;justify-content:flex-start;text-align:left;}
.hero-img{object-position:center;}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero.has-img .hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.42) 0%,rgba(255,255,255,.12) 32%,rgba(255,255,255,0) 55%);}
.hero-inner{position:relative;z-index:2;width:100%;padding:20px 0;}
.hero-inner .wrap{padding-left:clamp(48px,11vw,170px);}
.hero-tagline{font-family:var(--font-hand);font-size:clamp(24px,3.6vw,40px);line-height:1.15;color:#3f6058;margin:0;font-weight:400;letter-spacing:.01em;}
.hero-subtitle{font-size:clamp(13px,1.5vw,16px);font-weight:600;color:#4E837B;margin:4px 0 0;letter-spacing:.01em;}
.hero.has-img .hero-subtitle{color:#3c6159;text-shadow:0 1px 12px rgba(255,255,255,.7);}
.hero.has-img .hero-tagline{color:#40625c;text-shadow:0 1px 16px rgba(255,255,255,.6);}

/* ---------- section frame ---------- */
.section{padding:56px 0;}
.section+.section{border-top:1px solid var(--line);}
.cat-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:28px;}
.cat-headline{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
.cat-label{font-size:21px;font-weight:800;letter-spacing:-.02em;display:inline-flex;align-items:center;gap:9px;}
.cat-label::before{content:"";width:20px;height:4px;border-radius:2px;background:currentColor;display:inline-block;}
.cat-sub{font-size:14px;color:var(--muted);}
.more-link{font-size:14px;color:var(--ink-soft);white-space:nowrap;display:inline-flex;align-items:center;gap:5px;border-bottom:1px solid transparent;padding-bottom:4px;transition:color .2s,border-color .2s;}
.more-link:hover{color:var(--ink);border-color:var(--ink);}

/* ---------- latest: 3-column grid, tall featured in col 1 ---------- */
.latest-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 26px;align-items:start;}
.latest-grid .fcard{grid-column:1;grid-row:1 / span 2;}
.fcard-link{display:block;}
.fthumb{aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius);background:var(--paper-2);border:1px solid var(--line);}
.fthumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.6,.2,1);}
.fcard-link:hover .fthumb img{transform:scale(1.04);}
.fcat{display:inline-block;margin:18px 0 8px;font-size:12.5px;font-weight:600;color:var(--brand-ink);letter-spacing:.04em;}
.ftitle{font-size:22px;font-weight:700;line-height:1.4;letter-spacing:-.015em;margin:0 0 10px;color:var(--title);}
.fcard-link:hover .ftitle{color:var(--title-ink);}
.fexcerpt{font-size:15px;color:var(--ink-soft);line-height:1.7;margin:0 0 12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.fdate{font-size:12.5px;color:var(--muted);}

/* ---------- compact card (thumb-left) ---------- */
.cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 26px;}
.ccard-link{display:flex;gap:15px;align-items:flex-start;}
.cthumb{width:104px;height:104px;flex:none;overflow:hidden;border-radius:12px;background:var(--paper-2);border:1px solid var(--line);}
.cthumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.6,.2,1);}
.ccard-link:hover .cthumb img{transform:scale(1.05);}
.cbody{min-width:0;}
.ccat{display:inline-block;margin:0 0 5px;font-size:11.5px;font-weight:600;letter-spacing:.04em;}
.ctitle{font-size:15.5px;font-weight:700;line-height:1.45;letter-spacing:-.01em;margin:0 0 6px;color:var(--title);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ccard-link:hover .ctitle{color:var(--title-ink);}
.cexcerpt{font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin:0 0 7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.cdate{font-size:12px;color:var(--muted);}

.ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;}
.ph span{font-family:var(--font-hand);font-size:2.4em;line-height:1;}
.empty-note{grid-column:1/-1;color:var(--muted);font-size:14.5px;padding:16px 0;}

/* ---------- content layout (single / archive) ---------- */
.content-wrap{display:grid;grid-template-columns:248px minmax(0,1fr);gap:48px;padding:44px 0 68px;align-items:start;}
.archive-head{margin-bottom:30px;}
.archive-title{font-size:26px;font-weight:800;margin:0 0 6px;letter-spacing:-.02em;}
.archive-desc{color:var(--muted);font-size:14.5px;margin:0;}
.arch-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 26px;}

.post{max-width:760px;}
.post-header{margin-bottom:24px;}
.post-cat{font-size:13px;color:var(--brand-ink);font-weight:600;letter-spacing:.04em;}
.post-title{font-size:clamp(25px,3.5vw,36px);font-weight:800;line-height:1.35;letter-spacing:-.02em;margin:12px 0 12px;}
.post-meta{font-size:13px;color:var(--muted);}
.post-feat{margin:6px 0 30px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);}
.post-body{font-size:16.5px;line-height:1.9;color:var(--ink);}
.post-body p{margin:0 0 1.4em;}
.post-body h2{font-size:24px;font-weight:800;margin:1.8em 0 .6em;letter-spacing:-.01em;}
.post-body h3{font-size:20px;font-weight:700;margin:1.6em 0 .5em;}
.post-body img{border-radius:10px;margin:1.4em 0;}
.post-body a{color:var(--title-ink);text-decoration:underline;text-underline-offset:3px;}
.post-body blockquote{margin:1.5em 0;padding:6px 22px;border-left:3px solid var(--brand);color:var(--ink-soft);}
.post-tags{margin-top:34px;display:flex;flex-wrap:wrap;gap:9px;}
.post-tags a{font-size:12.5px;color:var(--ink-soft);background:var(--paper-2);border:1px solid var(--line);padding:5px 12px;border-radius:999px;}
.post-tags a:hover{border-color:var(--ink-soft);color:var(--ink);}
.ad-slot{margin:32px 0;padding:12px;text-align:center;}
.ad-slot .ad-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}

/* ---------- sidebar ---------- */
.sidebar{position:sticky;top:90px;}
.widget{margin-bottom:32px;}
.widget-title{font-size:15.5px;font-weight:800;margin:0 0 12px;padding-bottom:9px;border-bottom:1px solid var(--line);letter-spacing:-.01em;}
.widget ul{list-style:none;margin:0;padding:0;}
.widget li{padding:7px 0;font-size:14px;border-bottom:1px solid var(--line);}
.widget li:last-child{border-bottom:0;}
.widget a{color:var(--ink-soft);}
.widget a:hover{color:var(--brand-ink);}
.widget .children{margin:6px 0 2px 12px;border-left:1px solid var(--line);padding-left:12px;}
.widget .children li{border-bottom:0;padding:4px 0;font-size:13px;color:var(--muted);}
.cat-tree > li{font-size:15px;}
.cat-tree > li > a{font-weight:600;color:var(--ink);}
.cat-tree a:hover{color:var(--brand-ink);}
.cat-tree .children a{font-weight:400;}
.cat-widget .widget-title{color:var(--brand-ink);}
.profile-widget{text-align:center;padding:24px 18px;background:var(--paper-2);border-radius:var(--radius);}
.profile-widget .avatar{width:76px;height:76px;border-radius:50%;margin:0 auto 12px;object-fit:cover;background:var(--paper);}
.profile-widget .pname{font-size:17px;font-weight:800;margin:0 0 6px;}
.profile-widget .pbio{font-size:13px;color:var(--ink-soft);line-height:1.6;margin:0;}
.search-form{display:flex;gap:8px;}
.search-form input[type=search]{flex:1;font:inherit;font-size:14px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);}
.search-form input[type=search]:focus{outline:2px solid var(--brand);outline-offset:1px;border-color:transparent;}
.search-form button{font:inherit;font-size:14px;padding:9px 14px;border:0;background:var(--brand);color:#fff;border-radius:10px;cursor:pointer;}
.search-form button:hover{background:var(--brand-ink);}

/* ---------- pagination ---------- */
.pagination{margin-top:40px;display:flex;gap:8px;flex-wrap:wrap;}
.pagination .page-numbers{min-width:38px;text-align:center;padding:9px 12px;border:1px solid var(--line);border-radius:10px;font-size:14px;color:var(--ink-soft);}
.pagination .page-numbers.current{background:var(--brand);color:#fff;border-color:var(--brand);}
.pagination a.page-numbers:hover{border-color:var(--brand-ink);color:var(--brand-ink);}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);padding:36px 0;margin-top:12px;background:var(--paper-2);}
.site-footer .wrap{display:flex;flex-direction:column;gap:14px;}
.foot-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.footer-menu{display:flex;gap:20px;list-style:none;margin:0;padding:0;flex-wrap:wrap;}
.footer-menu a{font-size:13.5px;color:var(--ink-soft);}
.footer-menu a:hover{color:var(--brand-ink);}
.foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:14px;}
.foot-brand{font-size:16px;font-weight:800;color:var(--brand-ink);}
.foot-note{font-size:13px;color:var(--muted);}
.to-top{font-size:13px;color:var(--ink-soft);}
.to-top:hover{color:var(--brand-ink);}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .content-wrap{grid-template-columns:1fr;gap:36px;}
  .sidebar{position:static;}
}
@media (max-width:640px){
  .nav-menu{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:6px 24px 14px;}
  .nav-menu.open{display:flex;}
  .nav-menu li{border-bottom:1px solid var(--line);}
  .nav-menu a{display:block;padding:12px 0;}
  .menu-toggle{display:block;position:absolute;right:20px;top:16px;}
  .section{padding:44px 0;}
  .latest-grid{grid-template-columns:1fr;}
  .latest-grid .fcard{grid-column:auto;grid-row:auto;}
  .cat-grid{grid-template-columns:1fr;}
  .arch-grid{grid-template-columns:1fr;}
  .cat-head{flex-wrap:wrap;}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}