/* ═══════════════════════════════════════════════════════════════
   B2 리디자인 (2026-09-05)
   서체(Noto Sans KR) 변경 없음 — 행간 · 여백 · 헤드라인 굵기 · 리빌 모션
   반드시 style.css 뒤에 로드할 것 (.section 은 style.css 596행에도
   정의돼 있어 앞에 두면 덮어써짐)
   ═══════════════════════════════════════════════════════════════ */

/* ── 여백 ─────────────────────────────────────────────────────── */
.section{padding:118px 0}
.stats-section{padding:140px 0}
.page-hero{padding:132px 0 56px}
.stats-grid{margin-top:76px}
.news-list{gap:32px}
.news-item{padding:36px 32px}
.quick-card{padding:38px 32px}
.inner-tabs{margin-bottom:44px}
.sec-eyebrow{margin-bottom:24px;font-size:.66rem}
.stats-title{margin-bottom:14px}

/* 태블릿 */
@media(max-width:1024px){
  .section{padding:84px 0}
  .stats-section{padding:96px 0}
  .page-hero{padding:118px 0 46px}
}
/* 모바일 — 확대한 여백을 되돌리지 않으면 스크롤만 길어진다 */
@media(max-width:768px){
  .section{padding:60px 0}
  .stats-section{padding:64px 0}
  .page-hero{padding:104px 0 40px}
  .stats-grid{margin-top:40px}
  .news-list{gap:18px}
  .news-item{padding:26px 22px}
  .quick-card{padding:28px 24px}
  .inner-tabs{margin-bottom:28px}
  .sec-eyebrow{margin-bottom:16px}
}

/* ── 헤드라인: 굵기 + 줄간격 (서체는 그대로) ───────────────────── */
/* ⚠ 굵기는 300/400/500/700/900 만 로드돼 있다. 600 을 쓰면 브라우저가
   임의 대체(합성)해 브라우저마다 다르게 보인다 — 반드시 이 목록 안에서만 */
.hero-h1{font-weight:700;letter-spacing:-.035em;line-height:1.26}
.page-hero-title{font-weight:700;letter-spacing:-.03em;line-height:1.26}
.sec-title{font-weight:700;letter-spacing:-.03em;line-height:1.35;margin-bottom:26px}
.stats-title{font-weight:700}
.news-item h3{font-weight:500;line-height:1.7}
.quick-card h3{font-weight:500}
@media(max-width:768px){.hero-h1{line-height:1.3}}

/* ── 본문 행간 + 색상 ─────────────────────────────────────────── */
/* opacity 대신 명시 색상 사용:
   1) opacity 는 자식(링크 등)까지 흐려진다
   2) 배경색이 다른 섹션에서 명암비가 기준 미달로 떨어질 수 있다
   #64686F = 흰 배경 5.6:1, --c-bg(#F5F5F3) 5.1:1 → WCAG AA 통과 */
.sec-desc{font-size:.88rem;line-height:2.15;color:#64686F;max-width:560px}
.quick-card p{font-size:.79rem;line-height:2.0;color:#6B7280}
.stats-subtitle{line-height:2.0;color:#64686F}
.hero-p{font-size:.88rem;line-height:2.1;color:rgba(255,255,255,.72);font-weight:300}
.page-hero-sub{line-height:1.9;color:rgba(255,255,255,.58)}
.rk-sec-head p{line-height:2.1}

/* ── 헤어라인 드로잉 ──────────────────────────────────────────── */
.sec-eyebrow::before{width:0;transition:width 1.1s cubic-bezier(.1,.51,.55,1) .15s}
.sec-eyebrow.on::before{width:64px}
.b2-vrule{position:relative}
.b2-vrule::before{content:'';position:absolute;left:-20px;top:3px;width:3px;height:0;
  background:var(--c-teal);transition:height 1.2s cubic-bezier(.1,.51,.55,1)}
.b2-vrule.on::before{height:calc(100% - 6px)}
/* 좁은 화면에선 .wrap(92%) 바깥으로 나가 잘리므로 숨김 */
@media(max-width:900px){.b2-vrule::before{display:none}}

/* ── 수평 슬라이드 리빌 ───────────────────────────────────────── */
.rv,.rv-l,.rv-r{transition-duration:.95s;transition-timing-function:cubic-bezier(.1,.59,.39,.94)}
.rv-l{transform:translate(-80px,0);filter:blur(3px)}
.rv-r{transform:translate(80px,0);filter:blur(3px)}
.b2-x{opacity:0;transform:translateX(64px);filter:blur(3px);
  transition:opacity .9s cubic-bezier(.1,.59,.39,.94),
             transform .9s cubic-bezier(.1,.59,.39,.94),
             filter .9s ease-out}
.b2-x.on{opacity:1;transform:none;filter:none}
/* 모바일: 이동폭이 크면 iOS 에서 가로 스크롤이 새는 경우가 있어 축소 */
@media(max-width:768px){
  .rv-l{transform:translate(-28px,0)}
  .rv-r{transform:translate(28px,0)}
  .b2-x{transform:translateX(24px)}
}

/* ── 접근성: 모션 최소화 설정 존중 ────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  .rv,.rv-l,.rv-r,.b2-x{opacity:1!important;transform:none!important;
    filter:none!important;transition:none!important}
  .sec-eyebrow::before{width:64px!important;transition:none!important}
  .b2-vrule::before{display:none!important}
  html{scroll-behavior:auto}
}

/* ── 인쇄 (개인정보처리방침 등 출력 대비) ─────────────────────── */
@media print{
  .section,.stats-section{padding:24px 0}
  .page-hero{padding:24px 0 16px}
  .rv,.rv-l,.rv-r,.b2-x{opacity:1!important;transform:none!important;filter:none!important}
  .b2-vrule::before{display:none!important}
}