/* p40 — 쏘렌토 법인차 딜러 : L10 매거진 2단 컬럼(드롭캡) / F9 DM Sans+Pretendard / HD4 / HR5 / CT5 / FT1 */
:root {
  --accent: #1F2937;
  --accent-text: #1F2937;
  --bg: #F5F6F8;
  --ink: #14181D;
  --font-display: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
  --footer-bg: #0F1319;
  --footer-text: #C7CCD2;
}

/* HD4 : 좌 로고타입 + 우 CTA 링크 1개 + 햄버거 메뉴(details/summary, JS 불필요) */
.site-header.hd4 { border-bottom: 1px solid #E1E3E7; }
.hd4-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; }
.logotype { font-family: var(--font-display); font-weight: 700; font-size: 17px; text-decoration: none; color: var(--accent-text); }
.hd4-right { display: flex; align-items: center; gap: 16px; position: relative; }
.hd4-cta { font-size: 14px; font-weight: 700; text-decoration: none; color: var(--accent-text); border: 2px solid var(--accent); border-radius: 8px; padding: 8px 14px; }
.hd4-menu summary { list-style: none; cursor: pointer; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
.hd4-menu summary::-webkit-details-marker { display: none; }
.hamburger-icon, .hamburger-icon::before, .hamburger-icon::after {
  content: ""; display: block; width: 22px; height: 2px; background: var(--ink);
}
.hamburger-icon { position: relative; }
.hamburger-icon::before { position: absolute; top: -7px; }
.hamburger-icon::after { position: absolute; top: 7px; }
.hd4-menu nav { position: absolute; right: 0; top: 48px; background: #fff; border: 1px solid #E1E3E7; border-radius: 10px; padding: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.08); min-width: 180px; }
.hd4-menu nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.hd4-menu nav a { text-decoration: none; font-size: 14px; color: var(--ink); }
.hd4-menu nav a:hover { color: var(--accent); }

/* HR5 : 텍스트는 위, 아래 2열 그리드로 차량+프로필 나란히 */
.hero.hr5 { padding-block: clamp(40px, 7vw, 76px); }
.hero.hr5 .hero-copy { max-width: 62ch; margin-bottom: clamp(24px, 4vw, 40px); }
.hero.hr5 h1 { font-size: clamp(28px, 4vw, 42px); color: var(--ink); }
.hero-lede { font-size: 16.5px; color: #444B54; margin-bottom: 1.4em; }
.hero-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .hero-grid { grid-template-columns: 1.3fr 1fr; align-items: end; } }
.hero-grid picture img { border-radius: 12px; width: 100%; object-fit: cover; }
.hero-visual { position: relative; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 12px; }
.hero-visual .hero-slideshow img { border-radius: 12px; }
.hero-slideshow img { animation-duration: 14s; }
.hero-slideshow img:nth-child(1) { animation-delay: 0s; }
.hero-slideshow img:nth-child(2) { animation-delay: 7s; }
.hero-profile { border-radius: 12px; width: 100%; max-width: 260px; object-fit: cover; justify-self: start; }

/* L10 : 매거진 2단 컬럼 + 첫 문단 드롭캡 */
.section--alt { background: #ECEDF0; }
.mag-columns { columns: 1; column-gap: 36px; }
@media (min-width: 720px) { .mag-columns { columns: 2; } }
.mag-columns p { break-inside: avoid; color: #33383F; font-size: 15.5px; }
.mag-columns p:first-of-type::first-letter {
  float: left; font-family: var(--font-display); font-weight: 700; font-size: 3.1em;
  line-height: .82; padding-right: 8px; color: var(--accent);
}
.section-figure { margin: 0 0 20px; max-width: 260px; }
.section-figure img { border-radius: 12px; }
.section-gallery { display: flex; gap: 10px; max-width: 100%; }
.section-gallery picture { flex: 1; max-width: 260px; }
.l10-table-wrap { overflow-x: auto; margin: 8px 0 20px; }
.l10-table { width: 100%; border-collapse: collapse; min-width: 460px; background: #fff; }
.l10-table th, .l10-table td { border: 1px solid #E1E3E7; padding: 11px 13px; text-align: center; font-size: 14px; }
.l10-table thead th { background: var(--accent); color: #fff; }
.l10-table tbody th { text-align: left; background: #ECEDF0; }

.faq-list { display: grid; gap: 16px; margin-top: 20px; }
.faq-item { background: #fff; border: 1px solid #E1E3E7; border-radius: 12px; padding: 18px 20px; }
.faq-item h3 { font-size: 16px; margin-bottom: 6px; }
.faq-item p { font-size: 14.5px; color: #444B54; margin: 0; }

/* CT5 : 섹션 사이 얇은 인라인 CTA 라인(전화 1개) 반복 + 본문 하단 3버튼 */
.cta-line { text-align: center; padding-block: 14px; background: #fff; border-block: 1px solid #E1E3E7; }
.cta-line a { font-weight: 700; font-size: 14.5px; text-decoration: none; color: var(--accent-text); }
.cta-line a:hover { text-decoration: underline; }
.cta.ct5 { background: var(--accent); color: #fff; padding-block: clamp(40px, 6vw, 64px); text-align: center; }
.cta.ct5 h2 { color: #fff; font-size: clamp(20px, 2.6vw, 26px); }
.cta-buttons--center { justify-content: center; }
.ct5 .btn-outline { border-color: #fff; color: #fff; }
.ct5 .btn-solid { background: #fff; color: var(--accent); }

/* FT1 : 3단 그리드 */
.footer-grid { display: grid; gap: 28px; grid-template-columns: 1fr; }
@media (min-width: 800px) { .footer-grid { grid-template-columns: 1.2fr 1fr 1.4fr; } }
.footer-links p { margin: 0 0 8px; }