/* p22 — 레이 딜러 : L2 좌이미지·우텍스트 반복 / F8 Archivo+Noto Sans KR / HD2 / HR2 / CT1 / FT1 */
:root {
  --accent: #1D4ED8;
  --accent-text: #1D4ED8;
  --bg: #F5F8FF;
  --ink: #131A2B;
  --font-display: "Archivo", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
  --footer-bg: #0E1730;
  --footer-text: #C7D0E8;
}

/* HD2 : 중앙 로고타입 + 하단 중앙메뉴 */
.site-header { border-bottom: 1px solid #DCE5FA; }
.hd2-inner { display: flex; flex-direction: column; align-items: center; gap: 10px; padding-block: 16px; }
.logotype { font-family: var(--font-display); font-weight: 700; font-size: 19px; text-decoration: none; color: var(--accent); }
.site-header nav ul { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; 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); }

/* HR2 : 좌텍스트/우차량, 프로필은 이미지 위 겹침배치 */
.hero { padding-block: clamp(40px, 8vw, 84px); background: linear-gradient(180deg, #EDF2FF, var(--bg)); }
.hero-inner { display: grid; gap: 32px; align-items: center; }
.hero-copy h1 { font-size: clamp(30px, 4.4vw, 46px); color: var(--ink); }
.hero-lede { font-size: 17px; color: #3A4258; max-width: 46ch; margin-bottom: 1.4em; }
.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: 28s; }
.hero-slideshow img:nth-child(1) { animation-delay: 0s; }
.hero-slideshow img:nth-child(2) { animation-delay: 7s; }
.hero-slideshow img:nth-child(3) { animation-delay: 14s; }
.hero-slideshow img:nth-child(4) { animation-delay: 21s; }
.hero-profile-badge {
  position: absolute; left: -14px; bottom: -14px; width: 76px; height: 76px;
  border-radius: 50%; object-fit: cover; border: 3px solid #fff; box-shadow: 0 4px 14px rgba(29,78,216,.3);
}
@media (min-width: 760px) {
  .hero-inner { grid-template-columns: 1.05fr 1fr; }
}

/* L2 : 좌이미지·우텍스트, 전 섹션 동일 방향 */
.section--muted { background: #ECF1FF; }
.l2-wrap { display: grid; gap: 28px; align-items: center; }
.l2-media picture img { border-radius: 10px; }
.l2-text h2 { font-size: clamp(20px, 2.6vw, 27px); margin-bottom: .5em; }
.l2-text p { color: #3A4258; font-size: 15px; }
@media (min-width: 760px) {
  .l2-wrap { grid-template-columns: 0.9fr 1.1fr; }
}

.l2-table-wrap { overflow-x: auto; margin-top: 28px; }
.l2-table { width: 100%; border-collapse: collapse; min-width: 420px; background: #fff; }
.l2-table th, .l2-table td { border: 1px solid #DCE5FA; padding: 12px 14px; text-align: center; font-size: 14.5px; }
.l2-table thead th { background: var(--accent); color: #fff; }
.l2-table tbody th { text-align: left; background: #F5F8FF; }

/* 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); }

/* 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; }