/* p27 — 니로 영업사원 : L7 지그재그 알터네이팅 / F3 Poppins+Noto Sans KR / HD3 / HR2(무차량) / CT6 / FT3 */
:root {
  --accent: #0E7490;
  --accent-text: #0B5A70;
  --bg: #F1FAFC;
  --ink: #10262C;
  --font-display: "Poppins", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
  --footer-bg: #0B242B;
  --footer-text: #C7E2E7;
}

/* HD3 : 상단 얇은 안내바 + 아래 메뉴바(2단) */
.hd3-topbar { background: var(--accent); color: #fff; font-size: 12.5px; padding-block: 6px; text-align: center; }
.hd3-mainbar { border-bottom: 1px solid #D7EEF3; background: var(--bg); }
.hd3-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; flex-wrap: wrap; gap: 10px; }
.logotype { font-family: var(--font-display); font-weight: 700; font-size: 18px; text-decoration: none; color: var(--accent-text); }
.site-header nav ul { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.site-header nav a { text-decoration: none; font-size: 14px; font-weight: 600; color: var(--ink); }
.site-header nav a:hover { color: var(--accent-text); }

/* HR2(무차량) : 프로필 승격, 1열 붕괴 */
.hero { padding-block: clamp(48px, 9vw, 92px); }
.hero-inner { display: grid; gap: 30px; justify-items: center; text-align: center; }
.hero-copy h1 { font-size: clamp(30px, 4.4vw, 46px); color: var(--ink); }
.hero-lede { font-size: 17px; color: #35545C; max-width: 58ch; margin: 0 auto 1.4em; }
.hero-visual { position: relative; padding: 10px; }
.hero-visual::before { content: ""; position: absolute; inset: 0; margin: auto; width: 190px; height: 190px; border: 3px solid var(--accent); border-radius: 24px; transform: rotate(8deg); }
.hero-visual img { position: relative; width: 176px; height: 176px; border-radius: 20px; object-fit: cover; margin: 0 auto; }

/* L7 : 지그재그 알터네이팅 */
.section--muted { background: #E4F4F7; }
.zigzag-row { display: flex; flex-direction: column; align-items: center; gap: 28px; text-align: center; }
.zigzag-visual { color: var(--accent); }
.zigzag-copy h2 { font-size: clamp(21px, 2.8vw, 28px); }
.zigzag-copy p { color: #33525A; font-size: 15px; }
@media (min-width: 760px) {
  .zigzag-row { flex-direction: row; align-items: center; text-align: left; gap: 48px; }
  .zigzag--reverse .zigzag-row { flex-direction: row-reverse; }
  .zigzag-visual { flex: 0 0 140px; }
  .zigzag-copy { flex: 1; }
}

.plain-list { margin: 0 0 1em; padding-left: 1.3em; }
.plain-list li { margin-bottom: .6em; color: #33525A; }

/* CT6 : 대각선 클리핑 배경 + 버튼 3개 세로 */
.cta.ct6 { position: relative; overflow: hidden; padding-block: clamp(56px, 9vw, 96px); color: #fff; text-align: center; }
.ct6-bg { position: absolute; inset: 0; background: var(--accent); clip-path: polygon(0 18%, 100% 0, 100% 100%, 0 100%); z-index: -1; }
.ct6-inner h2 { color: #fff; font-size: clamp(20px, 2.6vw, 27px); }
.cta-buttons--column { flex-direction: column; align-items: center; max-width: 320px; margin: 0 auto; }
.cta-buttons--column .btn { width: 100%; }
.ct6 .btn-outline { border-color: #fff; color: #fff; }
.ct6 .btn-solid { background: #fff; color: var(--accent-text); }

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