/* p14 — 기아 할부 상담 : L4 세로 타임라인 / F7 Cormorant Garamond+Nanum Myeongjo / HD2 / HR4(무차량) / CT7 / FT2 */
:root {
  --accent: #0B5563;
  --accent-text: #0B5563;
  --bg: #F1FAFB;
  --ink: #16262A;
  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-body: "Nanum Myeongjo", "Noto Serif KR", Georgia, serif;
  --footer-bg: #0A2126;
  --footer-text: #C4D7DA;
}

/* HD2 : 중앙 로고타입 + 하단 중앙 메뉴 */
.site-header { border-bottom: 1px solid #D7E9EB; }
.hd2-inner { display: flex; flex-direction: column; align-items: center; gap: 6px; padding-block: 16px; }
.logotype { font-family: var(--font-display); font-weight: 700; font-size: 21px; text-decoration: none; color: var(--accent); }
.hd2-inner nav ul { display: flex; gap: 22px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; justify-content: center; }
.hd2-inner nav a { text-decoration: none; font-size: 14px; font-weight: 700; }
.hd2-inner nav a:hover { color: var(--accent); }

/* HR4 : 차량 사진 슬라이드쇼 배경(.hero-slideshow는 base.css 공통 정의) + 상단 텍스트 + 하단 와이드 밴드 */
.hero { position: relative; overflow: hidden; background: var(--ink); }
.hero-top { position: relative; z-index: 1; padding-block: clamp(40px, 7vw, 72px) 24px; text-align: center; }
.hero-top h1 { font-size: clamp(30px, 4.4vw, 46px); color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.55); }
.hero-lede { font-size: 17px; color: #E7EAEE; max-width: 58ch; margin: 0 auto 1.4em; text-shadow: 0 2px 10px rgba(0,0,0,.5); }
.hero-band { position: relative; z-index: 1; background: var(--accent); padding-block: 24px; }
.hero-band-inner { display: flex; justify-content: flex-start; }
.hero-band-inner img { width: 110px; height: 110px; border-radius: 50%; object-fit: cover; border: 3px solid #fff; }

/* L4 : 세로 타임라인 (좌 축 + 우 콘텐츠) */
.timeline-item { display: grid; grid-template-columns: 20px 1fr; gap: 20px; position: relative; }
.timeline-marker { width: 20px; display: flex; justify-content: center; }
.timeline-marker::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: var(--accent); margin-top: 6px; }
.timeline-marker::after { content: ""; position: absolute; left: 9px; top: 26px; bottom: -48px; width: 2px; background: #C9E1E5; }
.section:last-of-type .timeline-marker::after { display: none; }
.timeline-body h2 { font-size: clamp(21px, 2.6vw, 27px); margin-bottom: .6em; }
.timeline-body p { font-size: 15.5px; color: #33474C; }
.section--muted { background: #E7F4F5; }

/* CT7 : 아웃라인 보더박스 + 버튼 3개, 배경 투명 */
.cta.ct7 { padding-block: clamp(40px, 6vw, 64px); }
.ct7-box { border: 2px solid var(--accent); border-radius: 16px; padding: clamp(28px, 5vw, 48px); text-align: center; }
.ct7-box h2 { font-size: clamp(20px, 2.6vw, 26px); margin-bottom: .8em; }
.cta-buttons--center { justify-content: center; }
