/* p54 — 기아 카마스터 인수 점검 : L6 비교 테이블 중앙+상하 설명 / F6 Bebas Neue+Pretendard / HD2 / HR4 / CT6 / FT3 */
:root {
  --accent: #7B241C;
  --accent-text: #7B241C;
  --bg: #FBF2F0;
  --ink: #2E1512;
  --font-display: "Bebas Neue", "Pretendard Variable", "Pretendard", -apple-system, sans-serif;
  --font-body: "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
  --footer-bg: #200D0B;
  --footer-text: #E3C7C2;
}

/* HD2 : 중앙 로고타입 + 하단 중앙 메뉴(2단) */
.site-header { border-bottom: 1px solid #F1DEDA; }
.hd2-inner { display: flex; flex-direction: column; align-items: center; gap: 10px; padding-block: 18px; }
.logotype { font-family: var(--font-display); font-weight: 400; letter-spacing: .04em; font-size: 22px; text-decoration: none; color: var(--accent); }
.site-header nav ul { display: flex; gap: 20px; list-style: none; margin: 0; padding: 10px 0 0; border-top: 1px solid #F5E6E3; flex-wrap: wrap; justify-content: center; }
.site-header nav a { text-decoration: none; font-size: 14px; font-weight: 600; color: var(--ink); }
.site-header 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-family: var(--font-display); font-weight: 400; letter-spacing: .02em; font-size: clamp(30px, 4.4vw, 46px); color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.55); }
.hero-lede { font-size: 16.5px; color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.5); max-width: 56ch; margin: 0 auto 1.2em; }
.hero-band { position: relative; z-index: 1; background: var(--accent); padding-block: 24px; }
.hero-band-inner { display: flex; justify-content: center; }
.hero-band-inner img { width: 110px; height: 110px; border-radius: 8px; object-fit: cover; border: 3px solid #fff; }

/* L6 : 비교 테이블 중앙 + 상하 설명 */
.section--muted { background: #F6E6E3; }
.table-wrap { overflow-x: auto; margin-top: 8px; }
table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 12px; overflow: hidden; min-width: 520px; }
th, td { padding: 14px 16px; text-align: left; font-size: 14.5px; border-bottom: 1px solid #F1DEDA; }
thead th { background: var(--accent); color: #fff; font-weight: 700; }
tbody tr:last-child td { border-bottom: none; }
tbody tr:nth-child(even) { background: #FBF0EE; }
.table-note { margin-top: 14px; color: #4A2B26; font-size: 14.5px; }

/* CT6 : 대각선 클리핑 배경 + 버튼 3개 세로 */
.cta.ct6 { position: relative; padding-block: clamp(56px, 9vw, 96px); overflow: hidden; text-align: center; color: #fff; }
.ct6-clip {
  position: absolute; inset: 0; background: linear-gradient(135deg, var(--accent), #200D0B);
  clip-path: polygon(0 12%, 100% 0, 100% 100%, 0 88%);
}
.ct6-inner { position: relative; z-index: 1; }
.ct6-inner h2 { color: #fff; font-size: clamp(20px, 2.8vw, 28px); margin-bottom: 20px; }
.ct6-buttons { flex-direction: column; align-items: center; }
.ct6-buttons .btn { min-width: 220px; }
.ct6 .btn-outline { border-color: #fff; color: #fff; }
.ct6 .btn-solid { background: #fff; color: var(--accent); }

/* FT3 : 중앙정렬 1단 세로스택 */
.ft3-stack { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
.ft3-stack .footer-links { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; }
.ft3-stack .footer-links p { margin: 0; }
.ft3-stack .footer-disclaimer { max-width: 62ch; }
