/* ============================================================
   『초등 공부력』 소개 페이지 전용 스타일
   - sp-ele/index.html(Design Component 시안)의 인라인 스타일을 클래스로 이전
   - 색상·폰트는 아래 :root 토큰(시안 팔레트)만 참조
   - 공통 상단(gnb)·하단(footer/modal)은 theme.css / site-nav.css / site-footer.css 담당
   ============================================================ */

:root{
  --bk-paper:#F7F3EC;
  --bk-paper-2:#EFE9DC;
  --bk-ink:#1C2230;
  --bk-ink-soft:#38352C;
  --bk-green:#2C4A3B;
  --bk-navy:#16213A;
  --bk-navy-deep:#101827;
  --bk-muted:#8A8375;
  --bk-muted-2:#6B6255;
  --bk-muted-3:#4A4638;
  --bk-gold-soft:#B3AB98;
  --bk-gold-warm:#A79E88;
  --bk-teal-soft:#7A8C7E;
  --bk-line:#E7E0D2;
  --bk-line-2:#DCD5C4;
  --bk-line-3:#E1D9C7;
  --bk-max:1240px;
  --bk-font:'Noto Sans KR',-apple-system,BlinkMacSystemFont,sans-serif;
}

/* ---------- 레이아웃 기본 ---------- */
/* 시안(helmet)의 body 리셋을 대체 — 없으면 body 기본 마진이 sticky 내비 위에
   몇 px 흰 공간으로 보였다가 스크롤 시 사라짐 */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bk-paper);overflow-x:hidden}
.bk-wrap{font-family:var(--bk-font);background:var(--bk-paper);color:var(--bk-ink);line-height:1.6;-webkit-font-smoothing:antialiased}
.bk-wrap *{box-sizing:border-box}
.bk-container{max-width:var(--bk-max);margin:0 auto;padding-left:40px;padding-right:40px;width:100%}
.bk-section{padding-top:90px;padding-bottom:90px}
.bk-section--intro{padding-top:70px;padding-bottom:100px}

/* 섹션 헤더 (번호 + 제목) */
.bk-sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:34px}
.bk-sec-no{font-size:12.5px;font-weight:700;letter-spacing:.06em;color:var(--bk-gold-soft)}
.bk-sec-title{font-size:26px;font-weight:900;margin:0}
.bk-sec-head--wide{margin-bottom:40px}

/* 구매 버튼 (히어로·정보·CTA 공용) — 한 행 최대 3개, 동일 크기 */
.bk-buy-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
  max-width:540px;
}
.bk-buy-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  box-sizing:border-box;width:100%;min-height:46px;padding:12px 14px;
  background:#fff;border:1px solid var(--bk-line-2);color:var(--bk-muted-3);
  border-radius:3px;font-size:13.5px;font-weight:600;font-family:inherit;cursor:pointer;
  text-decoration:none;line-height:1;white-space:nowrap;
}
.bk-buy-btn img{
  width:auto;height:15px;max-height:15px;max-width:64px;
  object-fit:contain;display:block;flex-shrink:0;
}
.bk-buy-btn .bk-buy-kyobo{height:16px;max-height:16px}
.bk-buy-btn .bk-buy-yes24,
.bk-buy-btn .bk-buy-aladin,
.bk-buy-btn .bk-buy-ypbooks,
.bk-buy-btn .bk-buy-coupang{height:15px;max-height:15px}
.bk-buy-btn:hover{border-color:var(--bk-green);color:var(--bk-green)}

/* ---------- HERO ---------- */
.bk-hero{max-width:var(--bk-max);margin:0 auto;padding:100px 40px 90px;display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.bk-hero-eyebrow{display:flex;align-items:center;gap:10px;font-size:12.5px;letter-spacing:.06em;color:var(--bk-muted);margin-bottom:22px;text-transform:uppercase}
.bk-eyebrow-line{width:22px;height:1px;background:var(--bk-gold-soft);display:inline-block}
.bk-hero-title{font-size:52px;font-weight:900;letter-spacing:-.03em;line-height:1.28;margin:0 0 18px}
.bk-hero-sub{font-size:20px;font-weight:700;color:var(--bk-green);margin:0 0 26px}
.bk-hero-desc{font-size:15px;color:var(--bk-muted-3);max-width:490px;margin:0 0 36px}
.bk-hero-cover-wrap{display:flex;justify-content:center}
.bk-hero-cover{width:100%;max-width:340px;box-shadow:0 30px 60px -25px rgba(22,33,58,.35);border-radius:2px}

/* ---------- 책 소개 ---------- */
.bk-intro-lead{border-left:3px solid var(--bk-green);padding:6px 0 6px 26px;margin-bottom:40px}
.bk-intro-lead-q{font-size:20px;font-weight:700;line-height:1.55;margin:0}
.bk-intro-lead-sub{font-size:14.5px;color:var(--bk-muted-2);margin:10px 0 0}
.bk-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.bk-intro-col{font-size:15.5px;color:var(--bk-ink-soft)}
.bk-intro-col p{margin:0 0 16px}
.bk-intro-emph{font-weight:700;color:var(--bk-navy)}

/* ---------- 작가 정보 ---------- */
.bk-author{background:var(--bk-paper-2)}
.bk-author .bk-sec-no{color:var(--bk-gold-warm)}
.bk-author-grid{display:grid;grid-template-columns:300px 1fr;gap:56px;align-items:start}
.bk-author-photo{border-radius:3px;height:380px;overflow:hidden}
.bk-author-photo img{width:100%;height:100%;object-fit:cover;display:block}
.bk-author-name{font-size:22px;font-weight:900;margin:0 0 4px}
.bk-author-role{font-size:13.5px;color:var(--bk-muted);margin-bottom:22px}
.bk-author-col p{font-size:15.5px;color:var(--bk-ink-soft);margin:0 0 16px}
.bk-author-col p:last-of-type{margin-bottom:26px}
.bk-author-stats{display:flex;gap:28px;flex-wrap:wrap;font-size:13.5px;color:var(--bk-muted-2);border-top:1px solid var(--bk-line-2);padding-top:20px}
.bk-author-stats strong{color:var(--bk-navy)}

/* ---------- 목차 ---------- */
.bk-toc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 60px}
.bk-toc-item{padding:22px 0;border-bottom:1px solid var(--bk-line)}
.bk-toc-label{font-size:12px;font-weight:700;letter-spacing:.05em;color:var(--bk-green);margin-bottom:6px}
.bk-toc-title{font-size:16px;font-weight:700;margin-bottom:8px}
.bk-toc-chapters{font-size:13.5px;color:var(--bk-muted);line-height:1.7}

/* ---------- 책 속으로 ---------- */
.bk-excerpt{background:var(--bk-navy);color:#EDE7DA}
.bk-excerpt .bk-sec-no{color:var(--bk-teal-soft)}
.bk-excerpt .bk-sec-title{color:#FAF7F0}
.bk-excerpt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.bk-excerpt-item{border-left:2px solid #4A6353;padding-left:22px}
.bk-excerpt-text{font-size:16px;line-height:1.75;color:#EDE7DA;margin:0}

/* ---------- 출판사 서평 ---------- */
.bk-review-list{display:grid;gap:46px}
.bk-review-title{font-size:19px;font-weight:800;margin:0 0 14px;color:var(--bk-navy)}
.bk-review-body{font-size:15.5px;color:var(--bk-ink-soft);line-height:1.8;margin:0;white-space:pre-line}

/* ---------- 기본 정보 ---------- */
.bk-info{background:var(--bk-paper-2)}
.bk-info .bk-sec-no{color:var(--bk-gold-warm)}
.bk-info-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:60px;align-items:start}
.bk-info-card{background:#fff;border:1px solid var(--bk-line-3);border-radius:3px;overflow:hidden}
.bk-info-row{display:flex;padding:16px 24px;border-bottom:1px solid var(--bk-paper-2);font-size:14.5px}
.bk-info-row:last-child{border-bottom:none}
.bk-info-label{width:100px;color:var(--bk-muted);font-weight:600}
.bk-info-value{color:var(--bk-ink);font-weight:500}
.bk-info-side-lead{font-size:15.5px;color:var(--bk-ink-soft);margin:0 0 28px}

/* ---------- 독자 Q&A (아코디언) ---------- */
.bk-qna-list{display:grid;gap:1px;background:var(--bk-line);border:1px solid var(--bk-line);border-radius:3px;overflow:hidden}
.bk-qna-item{background:#fff}
.bk-qna-head{background:none;border:none;width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;padding:24px 28px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.bk-qna-q{display:block;font-size:15.5px;font-weight:700;color:var(--bk-navy)}
.bk-qna-meta{display:block;font-size:12.5px;font-weight:500;color:var(--bk-muted);margin-top:4px}
.bk-qna-new{display:inline-block;margin-left:8px;background:var(--bk-green);color:#fff;font-size:10px;font-weight:700;letter-spacing:.08em;padding:2px 7px;border-radius:2px;vertical-align:middle}
.bk-qna-sym{font-size:18px;color:var(--bk-gold-soft);font-weight:300;flex-shrink:0}
.bk-qna-a{font-size:14.5px;color:var(--bk-muted-3);line-height:1.75;display:none;padding:0 28px 24px}
.bk-qna-item[aria-expanded="true"] .bk-qna-a{display:block}
.bk-qna-a-more{display:inline-block;margin-top:12px;font-size:13px;font-weight:600;color:var(--bk-green)}
.bk-qna-empty{background:#fff;padding:24px 28px;font-size:14.5px;color:var(--bk-muted-3)}
.bk-qna-empty a{color:var(--bk-green);font-weight:600}
.bk-qna-foot{margin-top:24px;text-align:right}
.bk-qna-foot a{font-size:13.5px;font-weight:600;color:var(--bk-green)}

/* ---------- CLOSING CTA ---------- */
.bk-cta{max-width:var(--bk-max);margin:0 auto;background:var(--bk-navy);padding:80px 40px;text-align:center}
.bk-cta-eyebrow{font-size:12.5px;letter-spacing:.06em;color:var(--bk-teal-soft);margin-bottom:16px;text-transform:uppercase}
.bk-cta-title{font-size:30px;font-weight:900;color:#FAF7F0;margin:0 0 30px;letter-spacing:-.02em}
.bk-cta .bk-buy-row{margin:0 auto}
.bk-cta .bk-buy-btn{background:#fff;border:none;color:var(--bk-navy);padding:14px 14px;font-size:14.5px;min-height:50px}
.bk-cta .bk-buy-btn img{height:16px;max-height:16px;max-width:64px}
.bk-cta .bk-buy-kyobo{height:17px;max-height:17px}

/* ---------- 반응형 (시안 @media 860px 유지) ---------- */
@media (max-width:860px){
  .bk-hero{grid-template-columns:1fr;padding:56px 20px 50px;gap:32px}
  .bk-hero-cover-wrap{order:1}
  .bk-hero-text{order:2}
  .bk-hero-title{font-size:34px}
  .bk-hero-sub{font-size:17px}
  .bk-hero-desc{width:auto;max-width:100%;font-size:14px}
  .bk-container{padding-left:20px;padding-right:20px}
  .bk-section{padding-top:56px;padding-bottom:56px}
  .bk-section--intro{padding-top:56px;padding-bottom:56px}
  .bk-intro-grid{grid-template-columns:1fr;gap:28px}
  .bk-author-grid{grid-template-columns:1fr;gap:26px}
  .bk-author-photo{height:300px}
  .bk-toc-grid{grid-template-columns:1fr;gap:0}
  .bk-excerpt-grid{grid-template-columns:1fr}
  .bk-info-grid{grid-template-columns:1fr;gap:26px}
  .bk-cta{padding:56px 20px}
  .bk-cta-title{font-size:21px}
  .bk-buy-row{max-width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
  .bk-buy-btn{font-size:12.5px;padding:11px 10px;gap:6px}
  .bk-buy-btn img{max-width:56px}
}