/* p08 — 기아 신차 상담 : L8 좌사이드바목차+우본문 / F8 Archivo+Noto Sans KR / HD4 / HR3(무차량) / CT1 / FT2 */
:root {
  --accent: #06414C;
  --accent-text: #06414C;
  --bg: #F2F9FA;
  --ink: #16232A;
  --font-display: "Archivo", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
  --footer-bg: #052A32;
  --footer-text: #C4D8DA;
}

/* HD4 : 좌 로고타입 + 우 CTA링크 1개(메뉴는 햄버거) */
.site-header { border-bottom: 1px solid #D8E7E9; background: #fff; }
.hd4-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: 12px; }
.logotype { font-family: var(--font-display); font-weight: 700; font-size: 17px; text-decoration: none; color: var(--accent); }
.hd4-right { display: flex; align-items: center; gap: 10px; position: relative; }
.btn-sm { padding: 9px 14px; font-size: 13.5px; border-radius: 8px; }
.hd4-menu summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 8px; color: var(--accent); }
.hd4-menu summary::-webkit-details-marker { display: none; }
.hd4-menu[open] summary { background: #EAF4F5; }
.hd4-menu nav { position: absolute; right: 0; top: 48px; background: #fff; border: 1px solid #D8E7E9; border-radius: 10px; padding: 10px 0; min-width: 190px; box-shadow: 0 8px 24px rgba(6,65,76,.12); z-index: 20; }
.hd4-menu nav ul { list-style: none; margin: 0; padding: 0; }
.hd4-menu nav a { display: block; padding: 9px 18px; text-decoration: none; font-size: 14.5px; }
.hd4-menu nav a:hover { background: #F2F9FA; }

/* HR3 : 차량 사진 슬라이드쇼 배경(.hero-slideshow는 base.css 공통 정의) + 중앙 텍스트, 프로필은 주 이미지로 승격 */
.hero.hr3--no-car {
  position: relative; overflow: hidden;
  background: var(--accent); color: #fff;
  padding-block: clamp(52px, 9vw, 100px);
  text-align: center;
}
.hr3--no-car .hero-inner { display: flex; flex-direction: column; align-items: center; gap: 22px; }
.hr3--no-car h1 { font-size: clamp(28px, 4.4vw, 44px); color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.5); }
.hr3--no-car .hero-lede { font-size: 16.5px; color: #D7EAEC; max-width: 54ch; margin: 0; text-shadow: 0 2px 10px rgba(0,0,0,.45); }
.hr3--no-car .hero-profile { width: 128px; height: 128px; border-radius: 50%; object-fit: cover; border: 3px solid rgba(255,255,255,.7); order: 3; }

/* L8 : 좌 사이드바 목차 + 우 본문 (모바일은 상단 접힘 details) */
.l8-layout { display: block; padding-block: clamp(36px, 6vw, 64px); }
.l8-toc { border: 1px solid #D8E7E9; border-radius: 10px; padding: 14px 18px; margin-bottom: 28px; background: #fff; }
.l8-toc summary { cursor: pointer; font-weight: 700; color: var(--accent); font-family: var(--font-display); font-size: 15px; }
.l8-toc nav ul { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 8px; }
.l8-toc nav a { text-decoration: none; font-size: 14.5px; }
.l8-toc nav a:hover { text-decoration: underline; }
@media (min-width: 900px) {
  .l8-layout { display: grid; grid-template-columns: 240px 1fr; gap: 40px; align-items: start; }
  .l8-toc { position: sticky; top: 20px; margin-bottom: 0; }
}

.l8-content { display: grid; gap: clamp(36px, 5vw, 56px); }
.l8-section h2 { font-size: clamp(21px, 2.6vw, 27px); margin-bottom: .6em; }
.l8-section p { color: #33454B; }
.l8-list { color: #33454B; padding-left: 1.3em; }
.l8-list li { margin-bottom: 6px; }

.faq-item { border-bottom: 1px solid #D8E7E9; padding: 14px 0; }
.faq-item summary { cursor: pointer; font-weight: 700; font-size: 15.5px; }
.faq-item p { margin-top: 10px; color: #33454B; }

/* 신차 상담 단계 도식 · 차량 사진 갤러리는 base.css의 .flow-row/.flow-graphic, .body-gallery 재사용 */
.flow-row p { color: #33454B; }

/* CT1 : 풀폭 컬러밴드 + 중앙 버튼 3개 */
.cta.ct1 { background: var(--accent); color: #fff; padding-block: clamp(40px, 6vw, 64px); text-align: center; }
.cta.ct1 h2 { color: #fff; font-size: clamp(20px, 2.6vw, 26px); }
.cta-buttons--center { justify-content: center; }
.ct1 .btn-outline { border-color: #fff; color: #fff; }
.ct1 .btn-solid { background: #fff; color: var(--accent); }

/* FT2 : 2단(좌 사업자정보+고지문 / 우 페이지링크) */
.footer-grid-2 { display: grid; gap: 28px; grid-template-columns: 1fr; }
@media (min-width: 760px) { .footer-grid-2 { grid-template-columns: 2fr 1fr; } }
.footer-left .footer-disclaimer { margin-top: 16px; }
.footer-links p { margin: 0 0 8px; }