:root{
    --bg: #F8F6F1;
    --bg-soft: #F3F0E9;
    --panel: #EFEBE2;
    --line: rgba(23,22,20,0.10);
    --line-strong: rgba(23,22,20,0.18);
    --ink: #171614;
    --ink-dim: #716D67;
    --ink-faint: rgba(113,109,103,0.75);
    --cinema: #7D2635;
    --cinema-bg: #F3E7E7;
    --accent: #7D2635;
    --accent-bg: #F3E7E7;
    --gold: #7D2635;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{ background:var(--bg); color:var(--ink); font-family:'Pretendard',sans-serif; -webkit-font-smoothing:antialiased; }
  .serif{ font-family:'Pretendard',sans-serif; }
  a{ color:inherit; }

  /* BREADCRUMB */
  .breadcrumb{
    padding:20px 5vw 16px; font-size:12.5px; color:var(--ink-faint);
  }
  .breadcrumb a{ text-decoration:none; color:var(--ink-faint); }
  .breadcrumb a:hover{ color:var(--cinema); }

  /* BOARD HEADER */
  .board-header{
    padding:36px 5vw 44px;
    display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px;
    position:relative;
  }
  .board-tag{
    display:inline-block; font-size:12px; letter-spacing:0.16em; font-weight:700;
    background:var(--cinema-bg); color:var(--cinema); padding:7px 16px; border-radius:999px; margin-bottom:14px;
  }
  .board-title{ font-family:'Pretendard',sans-serif; font-size:clamp(36px,4.4vw,58px); font-weight:700; }
  .board-desc{ color:var(--ink-dim); font-size:14.5px; margin-top:12px; max-width:480px; line-height:1.7; font-weight:400; }
  .board-count{ font-size:13px; color:var(--ink-faint); }
  .board-count b{ color:var(--cinema); }

  /* 사진 배경형 배너 (assets/img/hero-{section}.jpg 존재 시 자동 적용) */
  .board-header.has-bg-image{
    min-height:340px;
    padding:44px 5vw;
    align-items:flex-end;
    background-size:cover;
    background-position:center;
    border-radius:7px;
    overflow:hidden;
    margin:8px 5vw 36px;
    width:calc(100% - 10vw);
  }
  .board-header-overlay{
    position:absolute; inset:0; z-index:0;
  }
  .board-header-overlay-cinema, .board-header-overlay-culture, .board-header-overlay-beauty, .board-header-overlay-insight{
    background:linear-gradient(0deg, rgba(35,33,30,0.72) 0%, rgba(35,33,30,0.35) 55%, rgba(35,33,30,0.15) 100%);
  }
  .board-header-content{ position:relative; z-index:1; }
  .board-header.has-bg-image .board-title{ color:#fff; }
  .board-header.has-bg-image .board-desc{ color:rgba(255,255,255,0.85); }
  .board-header.has-bg-image .board-tag{ background:rgba(255,255,255,0.92); }
  .board-header.has-bg-image .board-count{ position:relative; z-index:1; color:#fff; }
  .board-header.has-bg-image .board-count b{ color:#fff; }

  /* SUB CATEGORY TABS — 둥근 버튼 대신 텍스트 탭 + 선택시 버건디 밑줄 */
  .tabs{
    display:flex; gap:28px; padding:0 5vw 0; flex-wrap:wrap;
    border-bottom:1px solid var(--line-strong);
  }
  .tab{
    padding:16px 0; font-size:14px; font-weight:500;
    background:none; text-decoration:none; color:var(--ink-faint);
    border:none; border-bottom:2px solid transparent; transition:.2s;
    margin-bottom:-1px;
  }
  .tab.active{ background:none; color:var(--accent); border-bottom-color:var(--accent); font-weight:700; }
  .tab:not(.active):hover{ color:var(--ink); }

  /* TOOLBAR: sort — 텍스트 메뉴로 (우측 배치) */
  .toolbar{
    display:flex; justify-content:space-between; align-items:center;
    padding:20px 5vw 0;
  }
  .sort-group{ display:flex; gap:18px; background:none; padding:0; border-radius:0; }
  .sort-btn{ font-size:12.5px; padding:0; background:none; border:none; color:var(--ink-faint); cursor:pointer; font-family:inherit;}
  .sort-btn.active{ background:none; color:var(--accent); box-shadow:none; font-weight:700;}

  /* AD SLOT — 점선박스 제거, 깔끔한 컨테이너 */
  .ad-slot{
    margin:24px 5vw 0; padding:0; text-align:center;
    min-height:90px; display:flex; align-items:center; justify-content:center;
    font-size:11px; color:var(--ink-faint); letter-spacing:0.06em;
  }

  /* 상단: 대표기사 65% + 보조기사 2개 35% (테두리 없이 여백으로만 구분) */
  .board-featured-grid{
    max-width:1480px; margin:0 auto; padding:40px 5vw 0;
    display:grid; grid-template-columns:1.86fr 1fr; gap:48px;
  }
  .bf-main, .bf-sub, .ls-item{ text-decoration:none; color:inherit; display:block; }
  .bf-main-img, .bf-sub-img, .ls-img{
    width:100%; overflow:hidden; position:relative;
    background:linear-gradient(135deg,#ECE7DC,#E2DCCE); border-radius:2px;
  }
  .bf-main-img img, .bf-sub-img img, .ls-img img{
    width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease;
  }
  .bf-main:hover img, .bf-sub:hover img, .ls-item:hover img{ transform:scale(1.04); }
  .bf-main-img{ aspect-ratio:16/10; }
  .bf-cat{ font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); font-weight:700; margin-top:18px; margin-bottom:8px; }
  .bf-main-title{
    font-family:'Pretendard',sans-serif; font-size:26px; font-weight:700; line-height:1.34; color:var(--ink);
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .bf-main-excerpt{
    margin-top:12px; font-size:14.5px; color:var(--ink-dim); line-height:1.75;
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  }
  .bf-meta{ margin-top:14px; font-size:12px; color:var(--ink-faint); display:flex; gap:8px; }

  .bf-sub-list{ display:flex; flex-direction:column; gap:32px; }
  .bf-sub-img{ aspect-ratio:16/10; }
  .bf-sub-title{
    font-family:'Pretendard',sans-serif; font-size:17px; font-weight:700; line-height:1.4; color:var(--ink);
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }

  /* LATEST STORIES: 좌측 2열 목록 + 우측 사이드바(MOST READ + 광고) */
  .latest-stories{ max-width:1480px; margin:0 auto; padding:80px 5vw 0; }
  .latest-stories-head{
    font-family:'Pretendard',sans-serif; font-size:20px; font-weight:700; letter-spacing:0.04em;
    padding-bottom:18px; margin-bottom:32px; border-bottom:1px solid var(--line-strong);
  }
  .latest-stories-layout{ display:grid; grid-template-columns:1fr 300px; gap:56px; align-items:start; }
  .latest-list{ display:grid; grid-template-columns:1fr 1fr; gap:36px 32px; }
  .ls-img{ aspect-ratio:4/2.7; margin-bottom:16px; }
  .ls-title{
    font-family:'Pretendard',sans-serif; font-size:17px; font-weight:700; line-height:1.4; color:var(--ink);
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }
  .ls-excerpt{
    margin-top:8px; font-size:13.5px; color:var(--ink-dim); line-height:1.65;
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  }

  /* 사이드바: MOST READ + 광고 */
  .latest-sidebar{ position:sticky; top:100px; }
  .sidebar-block{ margin-bottom:40px; }
  .sidebar-title{
    font-size:12px; letter-spacing:0.14em; font-weight:700; color:var(--ink);
    padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid var(--line-strong);
  }
  .mr-item{
    display:flex; gap:14px; padding:12px 0; text-decoration:none; color:inherit;
    border-bottom:1px solid var(--line);
  }
  .mr-item:last-child{ border-bottom:none; }
  .mr-num{ font-family:'Pretendard',sans-serif; font-size:15px; font-weight:700; color:var(--ink-faint); flex-shrink:0; }
  .mr-title{
    font-size:13.5px; font-weight:600; line-height:1.5; color:var(--ink);
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }

  /* PAGINATION */
  .pagination{ display:flex; justify-content:center; gap:8px; padding:70px 5vw 90px; }
  .page-btn{
    width:38px; height:38px; display:flex; align-items:center; justify-content:center;
    border-radius:50%; text-decoration:none; font-size:13.5px; color:var(--ink-dim);
    border:1px solid var(--line);
  }
  .page-btn.active{ background:var(--accent); color:#fff; border-color:var(--accent); font-weight:600; }
  .page-btn:hover:not(.active){ background:var(--accent-bg); color:var(--accent); }

  /* footer 스타일은 main.css 공통 정의(차콜 배경 4열)를 그대로 사용 */

  @media (max-width:980px){
    .board-featured-grid{ grid-template-columns:1fr; gap:32px; padding:28px 5vw 0; }
    .bf-sub-list{ flex-direction:column; }
    .latest-stories{ padding:56px 5vw 0; }
    .latest-stories-layout{ grid-template-columns:1fr; gap:36px; }
    .latest-list{ grid-template-columns:1fr; }
    .latest-sidebar{ position:static; }
    .board-header{ padding:28px 5vw 32px; }
    .board-header.has-bg-image{ min-height:220px; padding:24px 6vw; border-radius:7px; margin:6px 5vw 28px; width:calc(100% - 10vw); }
    .tabs{ overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; padding-bottom:0; gap:22px; }
    .tab{ flex-shrink:0; white-space:nowrap; }
  }