/*
Theme Name: ColorMag Child (YeoyuFit)
Template: colormag
Description: 여유핏 홈 화면(최신 글 홈) 교체용 차일드 테마. 홈 외 화면은 부모 ColorMag 그대로.
Version: 1.0.0
Text Domain: colormag-child
*/

/* 홈(.yf-home) 전용. 색은 사이트 커스터마이저 값: 주색 #2a5839, 메뉴 호버 #1d3b26 */
.yf-home{--yf-navy:#2a5839;--yf-navy-d:#1d3b26;--yf-ink:#1f2933;--yf-sub:#6b7280;--yf-line:#e5e7eb;--yf-bg:#f6f4ec;
  padding:0 0 10px;color:var(--yf-ink);font-size:16px;line-height:1.6}
.yf-home *,.yf-home *::before,.yf-home *::after{box-sizing:border-box}
.yf-home a{color:inherit;text-decoration:none}
.yf-home .yf-title a:hover{color:var(--yf-navy)}
.yf-home h2,.yf-home h3{margin:0;padding:0;border:0;background:none;letter-spacing:-.2px}
.yf-home p{margin:0}

/* 공통 썸네일: 16:9, 가운데 기준 */
.yf-thumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#f6f4ec;border-radius:6px}
.yf-thumb img,.yf-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;display:block;margin:0;max-width:none}
.yf-noimg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--yf-navy);font-weight:800;font-size:15px;background:linear-gradient(135deg,#f6f4ec,#e3eddc)}

/* 섹션 제목: 굵은 글씨 + 남색 밑줄 바 (전부 동일) */
.yf-sec{margin:44px 0 0}
.yf-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;border-bottom:1px solid var(--yf-line);margin:0 0 18px}
.yf-home .yf-sec-title{display:inline-block;margin:0 0 -1px;padding:0 2px 10px;font-size:22px;font-weight:800;line-height:1.3;color:var(--yf-ink);border-bottom:3px solid var(--yf-navy)}
.yf-more{font-size:14px;color:var(--yf-sub);padding-bottom:10px;white-space:nowrap}
.yf-more:hover{color:var(--yf-navy)}

.yf-cat{display:inline-block;background:var(--yf-navy);color:#fff!important;font-size:13px;font-weight:700;line-height:1;padding:5px 9px;border-radius:4px}
.yf-meta{font-size:13px;color:var(--yf-sub);line-height:1.5}
.yf-title{font-weight:800;line-height:1.45;color:var(--yf-ink);word-break:keep-all;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.yf-excerpt{font-size:15px;line-height:1.65;color:#4b5563;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}

/* 슬라이더: 큰 1 + 우측 2 */
.yf-hero{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);grid-template-rows:auto auto;gap:14px}
.yf-hero-item{position:relative;display:block;overflow:hidden;border-radius:8px;background:#0f172a;color:#fff!important;aspect-ratio:16/9}
.yf-hero-item.is-main{grid-row:1/span 2;grid-column:1}
.yf-hero-item.is-side{grid-column:2;aspect-ratio:auto;min-height:0}
.yf-hero-item::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,12,30,.82) 0%,rgba(6,12,30,.35) 45%,rgba(6,12,30,0) 75%);pointer-events:none}
.yf-hero-text{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 20px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.yf-hero-item .yf-title{color:#fff;font-size:28px;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.yf-hero-item.is-side .yf-title{font-size:17px}
.yf-hero-item.is-side .yf-hero-text{padding:12px 14px;gap:6px}
.yf-hero-item .yf-meta{color:#e5e7eb}
.yf-hero-item:hover .yf-title{color:#fff}

/* 카드 3열 */
.yf-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.yf-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--yf-line);border-radius:8px;overflow:hidden}
.yf-card .yf-thumb{border-radius:0}
.yf-card-body{display:flex;flex-direction:column;gap:8px;padding:14px 16px 16px;align-items:flex-start}
.yf-card .yf-title{font-size:18px}

/* 목록(작은 썸네일 + 제목 + 날짜) */
.yf-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 22px}
.yf-row{display:flex;gap:14px;align-items:flex-start;padding:12px;background:#fff;border:1px solid var(--yf-line);border-radius:8px}
.yf-row .yf-thumb{flex:0 0 38%;max-width:160px}
.yf-row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.yf-row .yf-title{font-size:16px}

/* 카테고리 2열 */
.yf-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px}
.yf-cols.is-one{grid-template-columns:minmax(0,1fr)}
.yf-stack{display:flex;flex-direction:column;gap:12px}
.yf-cols.is-one .yf-stack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}

/* 여행후기 2열 카드 */
.yf-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.yf-grid2 .yf-row{padding:14px}
.yf-grid2 .yf-row .yf-thumb{flex-basis:42%;max-width:240px}
.yf-grid2 .yf-row .yf-title{font-size:18px}

@media (max-width:1024px){
  .yf-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .yf-hero-item .yf-title{font-size:24px}
}
@media (max-width:768px){
  .yf-home{padding-top:14px}
  .yf-sec{margin-top:34px}
  .yf-hero{grid-template-columns:1fr;grid-template-rows:none}
  .yf-hero-item.is-main,.yf-hero-item.is-side{grid-row:auto;grid-column:1;aspect-ratio:16/9}
  .yf-hero-item .yf-title{font-size:21px}
  .yf-hero-item.is-side .yf-title{font-size:17px}
  .yf-grid3,.yf-list,.yf-cols,.yf-cols.is-one .yf-stack,.yf-grid2{grid-template-columns:1fr}
  .yf-cols{gap:34px}
  .yf-cols>.yf-sec{margin-top:0}
  .yf-home .yf-sec-title{font-size:20px}
}

.cm-content:has(.yf-home){padding-top:26px}

/* ===== yf polish 20261026: 시안 보정 ===== */
/* 헤더: 좌 로고 / 우 검색창, 메뉴 바 남색 + 우측 티커 */
.cm-main-header .cm-header-top-row .cm-top-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0}
.cm-main-header .cm-header-top-row .cm-header-left-col{display:none}
.cm-main-header .cm-header-top-row .cm-header-center-col{flex:0 0 auto;width:auto;display:flex;align-items:center;justify-content:flex-start}
.cm-main-header .cm-header-top-row .cm-header-right-col{flex:1 1 auto;width:auto;display:flex;align-items:center;justify-content:flex-end}
.cm-main-header .cm-site-info,.cm-main-header .cm-site-description{display:none}
.cm-main-header .cm-site-branding{margin:0}
.cm-main-header .cm-site-branding .custom-logo{width:auto;max-width:none;height:58px}
.yf-search{display:flex;align-items:center;width:320px;max-width:100%;height:42px;margin:0;border:1px solid #ddd6bf;border-radius:999px;background:#fff;overflow:hidden}
.yf-search input[type=search]{flex:1;min-width:0;height:100%;border:0!important;background:transparent!important;box-shadow:none!important;padding:0 6px 0 18px;font-size:15px;color:#1f2933;outline:0}
.yf-search button{flex:0 0 44px;height:100%;border:0;background:transparent;color:#6b7280;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}
.yf-search:focus-within{border-color:#1d3b26;box-shadow:0 0 0 3px rgba(59,122,55,.18)}
.cm-main-header .cm-header-bottom-row{background:#1d3b26;border-top:0!important}
.cm-main-header .cm-bottom-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 0}
.cm-main-header .cm-bottom-row .cm-header-left-col{display:none}
.cm-main-header .cm-bottom-row .cm-header-center-col{flex:0 0 auto;width:auto;display:flex;justify-content:flex-start}
.cm-main-header .cm-bottom-row .cm-header-right-col{flex:1 1 0;min-width:0;width:auto;display:flex;justify-content:flex-end}
.cm-main-header .cm-primary-menu{display:flex;flex-wrap:nowrap;gap:4px;margin:0;padding:0}
.cm-main-header .cm-primary-menu>li{background:transparent!important;margin:0}
.cm-main-header .cm-primary-menu>li>a{display:block;color:#fff!important;font-size:15px;font-weight:700;line-height:1.2;padding:9px 16px;border-radius:8px;background:transparent}
.cm-main-header .cm-primary-menu>li>a:hover{background:rgba(255,255,255,.14)!important}
.cm-main-header .cm-primary-menu>li.current-menu-item>a,.cm-main-header .cm-primary-menu>li.current_page_item>a{background:#efe7d0!important;color:#1d3b26!important}
.yf-ticker{display:flex;align-items:center;gap:8px;max-width:100%;min-width:0;color:#fff!important;font-size:14px;text-decoration:none}
.yf-ticker i{flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:#f5c542}
.yf-ticker span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.yf-ticker:hover span{text-decoration:underline}
@media (max-width:1100px){.yf-ticker{display:none}.cm-main-header .cm-primary-menu>li>a{padding:9px 12px}}
@media (max-width:768px){.yf-search,.yf-ticker{display:none}}

/* 섹션 제목 줄: 제목 / 회색 보조 문구 / 더 보기 */
.yf-sub{margin-left:auto;padding-bottom:10px;font-size:14px;color:var(--yf-sub);min-width:0}
.yf-sub+.yf-more{margin-left:4px}
.yf-more{padding-left:10px;position:relative}
.yf-sub+.yf-more::before{content:"";position:absolute;left:0;top:4px;height:14px;width:1px;background:var(--yf-line)}
.yf-sec-head{margin-bottom:20px}

/* 히어로 */
.yf-hero{gap:16px}
.yf-hero-text{padding:20px 28px 22px;gap:9px}
.yf-hero-item.is-main .yf-title{font-size:30px;-webkit-line-clamp:2}
.yf-hero-sum{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:15px;line-height:1.6;color:#e5e7eb;max-width:92%}
.yf-hero-item.is-side .yf-hero-text{padding:14px 18px;gap:6px}
.yf-meta .yf-by::before{content:"·";margin:0 7px}
.yf-hero-item::after{background:linear-gradient(to top,rgba(6,12,30,.88) 0%,rgba(6,12,30,.45) 42%,rgba(6,12,30,0) 78%)}
.yf-hero-item,.yf-card,.yf-list,.yf-hcard{box-shadow:0 2px 10px rgba(15,23,42,.08)}

/* 카드: 이미지 좌상단 배지, 하단 링크 */
.yf-thumb .yf-cat{position:absolute;left:10px;top:10px;z-index:2}
.yf-card{height:100%}
.yf-card-body{flex:1 1 auto;gap:8px;padding:16px 18px 0}
.yf-card .yf-title{font-size:19px}
.yf-card .yf-excerpt{margin-top:2px}
.yf-go{margin:auto -18px 0;padding:14px 18px;width:calc(100% + 36px);display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--yf-line);font-size:14px;font-weight:700;color:var(--yf-navy)!important}
.yf-card-body .yf-excerpt{margin-bottom:14px}
.yf-go:hover{background:#f6f4ec}

/* 이전 글: 흰 박스 안 3열 x 2행 */
.yf-list{background:#fff;border:1px solid var(--yf-line);border-radius:8px;padding:18px 20px;gap:18px 24px}
.yf-list .yf-row{border:0;padding:0;background:transparent;border-radius:0;gap:14px;align-items:center}
.yf-list .yf-row .yf-thumb{flex:0 0 104px;max-width:104px;border-radius:6px}
.yf-list .yf-row .yf-title{font-size:15px}

/* 가로 카드(카테고리 2열·여행후기): 좌 이미지 / 우 텍스트 */
.yf-hcard{padding:14px;gap:18px;align-items:center;background:#fff;border:1px solid var(--yf-line);border-radius:8px}
.yf-hcard .yf-thumb{flex:0 0 36%;max-width:230px;border-radius:6px}
.yf-hcard .yf-title{font-size:18px;-webkit-line-clamp:1}
.yf-hcard .yf-excerpt{font-size:14px;-webkit-line-clamp:2}
.yf-hcard .yf-row-body{gap:6px}
.yf-grid2{gap:18px 22px}
.yf-grid2 .yf-hcard .yf-title{font-size:18px}
.yf-stack{gap:16px}

@media (max-width:1024px){
  .yf-hero-item.is-main .yf-title{font-size:26px}
}
@media (max-width:768px){
  .yf-hero-text,.yf-hero-item.is-side .yf-hero-text{padding:14px 16px}
  .yf-hero-item.is-main .yf-title{font-size:21px}
  .yf-hero-sum{font-size:14px;-webkit-line-clamp:2}
  .yf-list{padding:14px}
  .yf-hcard .yf-thumb{flex-basis:38%}
  .yf-sub{display:none}
  .yf-more{margin-left:auto}
}
