/* =====================================================
   자신만만렌터카 — 한달렌트카 | style.css
   Editorial Edition — LCC Design Language
   ===================================================== */

/* === CSS 변수 === */
:root {
  --bg:          #FFFFFF;
  --bg-alt:      #F4F4F2;
  --ink-900:     #0B0B0B;
  --ink-700:     #282826;
  --ink-500:     #6A6A68;
  --ink-300:     #CACAC8;
  --ink-100:     #F0F0EE;
  --brand:       #0C5E3B;
  --brand-600:   #094E30;
  --brand-pale:  #EDF7F2;
  --brand-light: #CDEADB;
  --white:       #FFFFFF;

  --radius:        0px;
  --shadow:        0 1px 0 rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.08);
  --shadow-md:     0 4px 24px rgba(0,0,0,.12), 0 12px 48px rgba(0,0,0,.08);
  --shadow-brand:  0 4px 20px rgba(12,94,59,.30);
  --ease:          cubic-bezier(0.16,1,0.3,1);
  --ease-std:      cubic-bezier(0.4,0,0.2,1);
  --nav-h:         72px;
}

/* === 리셋 === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; word-break: keep-all; overflow-wrap: break-word; }
html  { scroll-behavior: auto; -webkit-text-size-adjust: 100%; }
body  {
  font-family: 'Pretendard Variable', 'Pretendard', -apple-system, sans-serif;
  font-size: 16px; line-height: 1.75;
  color: var(--ink-700); background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img  { max-width: 100%; height: auto; display: block; user-select: none; -webkit-user-drag: none; }
a    { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
::selection { background: var(--brand); color: #fff; }
::-webkit-scrollbar { width: 0; height: 0; }

/* === 폰트 === */
.font-en {
  font-family: 'Outfit', 'Pretendard Variable', sans-serif;
  letter-spacing: -0.01em;
}

/* === 타이포그래피 === */
h1, h2, h3, h4 {
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif;
  color: var(--ink-900); font-weight: 800; line-height: 1.1;
  letter-spacing: -0.03em;
}
h1 { font-size: clamp(2.5rem, 6vw, 5rem); }
h2 { font-size: clamp(1.8rem, 3.5vw, 3rem); }
h3 { font-size: clamp(1rem, 2vw, 1.25rem); }
p  { font-size: 16px; line-height: 1.78; color: var(--ink-700); }

/* === 레이아웃 === */
.container  { width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 48px; }
.section    { padding: clamp(80px, 10vw, 128px) 0; }
.section-sm { padding: clamp(48px, 6vw, 72px) 0; }
.bg-alt  { background: var(--bg-alt); }
.bg-dark { background: var(--ink-900); }

/* === 노이즈 텍스처 === */
.noise {
  position: fixed; inset: 0; z-index: 100; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: 0.022;
  mix-blend-mode: multiply;
}

/* === 글로우 === */
.glow {
  position: absolute; border-radius: 50%;
  filter: blur(120px); will-change: transform; pointer-events: none; z-index: 0;
}
.glow-1 { width: 560px; height: 560px; background: rgba(12,94,59,0.18); top:-15%; left:-8%; }
.glow-2 { width: 480px; height: 480px; background: rgba(12,94,59,0.10); bottom:-5%; right:-10%; }
.glow-3 { width: 360px; height: 360px; background: rgba(12,94,59,0.08); top:40%; left:40%; }

/* === 섹션 헤더 (editorial) === */
.sec-header { margin-bottom: 56px; }
.sec-header.centered { text-align: center; }
.sec-header.centered p { margin: 12px auto 0; }

.sec-label {
  display: inline-block;
  font-family: 'Outfit', sans-serif;
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--ink-500); margin-bottom: 16px;
}
.bg-dark .sec-label { color: rgba(255,255,255,0.45); }

.sec-header h2 { font-size: clamp(1.8rem, 3.5vw, 3rem); color: var(--ink-900); }
.bg-dark .sec-header h2 { color: var(--white); }
.sec-header p  { font-size: 15px; color: var(--ink-500); margin-top: 12px; max-width: 600px; }
.bg-dark .sec-header p { color: rgba(255,255,255,0.45); }

/* 에디토리얼 섹션 헤더 — LCC 스타일 */
.sec-editorial {
  display: flex; flex-direction: column; gap: 0;
  margin-bottom: 56px;
}
.sec-editorial .sec-border-top {
  display: flex; align-items: flex-end; justify-content: space-between;
  padding-bottom: 20px; border-bottom: 1px solid var(--ink-100);
  margin-bottom: 0;
}
.bg-dark .sec-editorial .sec-border-top { border-bottom-color: rgba(255,255,255,0.10); }

/* === 버튼 === */
.btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--ink-900); color: var(--white);
  font-size: 14px; font-weight: 700; padding: 0 32px; height: 52px;
  border: 2px solid var(--ink-900);
  transition: background .22s var(--ease-std), border-color .22s; white-space: nowrap; letter-spacing: .04em;
}
.btn-primary:hover { background: var(--brand); border-color: var(--brand); }

.btn-outline {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: transparent; color: var(--ink-900);
  font-size: 14px; font-weight: 700; padding: 0 32px; height: 52px;
  border: 1.5px solid var(--ink-300);
  transition: border-color .22s, background .22s; white-space: nowrap; letter-spacing: .04em;
}
.btn-outline:hover { border-color: var(--ink-900); }

.btn-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: transparent; color: var(--white);
  font-size: 14px; font-weight: 700; padding: 0 32px; height: 52px;
  border: 1.5px solid rgba(255,255,255,0.35);
  transition: border-color .22s, background .22s; white-space: nowrap; letter-spacing: .04em;
}
.btn-ghost:hover { border-color: rgba(255,255,255,0.80); background: rgba(255,255,255,0.06); }

.btn-brand {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--brand); color: var(--white);
  font-size: 14px; font-weight: 700; padding: 0 32px; height: 52px;
  border: 2px solid var(--brand);
  transition: background .22s, border-color .22s; white-space: nowrap; letter-spacing: .04em;
}
.btn-brand:hover { background: var(--brand-600); border-color: var(--brand-600); box-shadow: var(--shadow-brand); }

.btn-lg { height: 60px; font-size: 15px; padding: 0 42px; }
.btn-sm { height: 40px; font-size: 13px; padding: 0 24px; }

/* === 링크 언더라인 (LCC 스타일) === */
.link-underline { position: relative; display: inline-block; }
.link-underline::after {
  content: ''; position: absolute; left: 0; bottom: -2px;
  width: 100%; height: 1px; background: currentColor;
  transform: scaleX(0); transform-origin: right;
  transition: transform 0.5s cubic-bezier(0.77,0,0.175,1);
}
.link-underline:hover::after { transform: scaleX(1); transform-origin: left; }

/* === 헤더 === */
#site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 80;
  height: var(--nav-h);
  transition: background .35s, border-color .35s, backdrop-filter .35s;
}
#site-header.header-blur {
  background: rgba(255,255,255,0.78);
  backdrop-filter: blur(14px) saturate(180%);
  -webkit-backdrop-filter: blur(14px) saturate(180%);
  border-bottom: 1px solid var(--ink-100);
}
.header-inner {
  height: 100%; display: flex; align-items: center;
  justify-content: space-between; gap: 24px;
}
.logo-link {
  display: flex; align-items: center; gap: 12px;
  text-decoration: none; flex-shrink: 0;
}
.logo-img { width: 36px; height: 36px; object-fit: contain; }
.logo-wrap { display: flex; flex-direction: column; line-height: 1.25; }
.logo-keyword {
  font-family: 'Outfit', sans-serif;
  font-size: 11px; font-weight: 700; color: var(--ink-500);
  letter-spacing: 0.25em; text-transform: uppercase;
}
.logo-name { font-size: 14px; font-weight: 800; color: var(--ink-900); letter-spacing: -0.01em; }

.header-nav {
  display: flex; align-items: center; gap: 28px;
}
.header-nav a {
  font-size: 13px; font-weight: 600; color: var(--ink-700);
  transition: color .2s; white-space: nowrap;
}
.header-nav a:hover { color: var(--ink-900); }
.nav-cta {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--ink-900); color: var(--white) !important;
  font-weight: 700 !important; padding: 0 20px; height: 40px;
  font-size: 13px !important; letter-spacing: .04em;
  transition: background .2s !important;
}
.nav-cta:hover { background: var(--brand) !important; }
.nav-cta svg { flex-shrink: 0; }

/* === 햄버거 === */
.hamburger {
  display: none; flex-direction: column; justify-content: center;
  align-items: center; gap: 5px; width: 40px; height: 40px;
  padding: 6px; cursor: pointer; flex-shrink: 0;
  transition: background .2s;
}
.hamburger:hover { background: var(--ink-100); }
.hamburger span {
  display: block; width: 22px; height: 1.5px;
  background: var(--ink-900); transition: all .3s;
}

/* === 오버레이 메뉴 (위에서 슬라이드) === */
.overlay-menu {
  position: fixed; inset: 0; z-index: 120;
  background: var(--ink-900); color: var(--white);
  transform: translateY(-100%);
  transition: transform 0.8s cubic-bezier(0.77,0,0.175,1);
  display: flex; flex-direction: column; overflow-y: auto;
}
.overlay-menu.is-open { transform: translateY(0); }
.overlay-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 48px; height: var(--nav-h);
  border-bottom: 1px solid rgba(255,255,255,0.07); flex-shrink: 0;
}
.overlay-head .logo-keyword { color: rgba(255,255,255,0.4); }
.overlay-head .logo-name    { color: var(--white); }
.overlay-close {
  width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.06); color: var(--white);
  transition: background .2s;
}
.overlay-close:hover { background: rgba(255,255,255,0.12); }
.overlay-body {
  flex: 1; display: flex; flex-direction: column;
  padding: 56px 48px 48px; max-width: 1400px; width: 100%; margin: 0 auto;
}
.overlay-nav { display: flex; flex-direction: column; gap: 0; }
.overlay-nav a {
  font-size: clamp(1.6rem, 4vw, 2.8rem); font-weight: 800;
  color: rgba(255,255,255,0.6);
  padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: color .2s; letter-spacing: -0.03em;
}
.overlay-nav a:hover { color: var(--white); }
.overlay-cta-link {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 40px;
  background: var(--brand); color: var(--white) !important;
  font-size: 15px !important; font-weight: 700 !important;
  padding: 0 36px; height: 56px; letter-spacing: .04em;
  border-bottom: none !important; transition: background .2s !important;
  width: fit-content;
}
.overlay-cta-link:hover { background: var(--brand-600) !important; }

/* === 히어로 === */
@keyframes heroKenBurns {
  from { transform: scale(1) translateX(0); }
  to   { transform: scale(1.06) translateX(-1.5%); }
}
@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(32px); }
  to   { opacity: 1; transform: translateY(0); }
}

.hero {
  position: relative; min-height: 100svh;
  overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0; z-index: 0;
}
.hero-bg img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 40%;
  animation: heroKenBurns 18s ease-in-out infinite alternate;
  will-change: transform;
}
.hero-bg::after {
  content: '';
  position: absolute; inset: 0;
  background:
    linear-gradient(to right, rgba(11,11,11,.92) 0%, rgba(11,11,11,.65) 55%, rgba(11,11,11,.12) 100%),
    linear-gradient(to bottom, rgba(11,11,11,.22) 0%, transparent 42%, rgba(11,11,11,.70) 100%);
}

/* 히어로 배경 대형 텍스트 */
.hero-deco {
  position: absolute; z-index: 1;
  right: -2%; top: 50%; transform: translateY(-50%);
  font-family: 'Outfit', sans-serif;
  font-size: clamp(6rem, 18vw, 18rem);
  font-weight: 900; letter-spacing: -0.06em;
  color: rgba(255,255,255,0.022);
  line-height: 1; white-space: nowrap;
  pointer-events: none; user-select: none;
}

.hero-content {
  position: relative; z-index: 2;
  min-height: 100svh;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding-top: calc(var(--nav-h) + 40px);
  padding-bottom: 80px;
}

.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  margin-bottom: 24px;
}
.hero-eyebrow-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: var(--brand); animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%     { opacity: .6; transform: scale(.85); }
}
.hero-eyebrow-text {
  font-family: 'Outfit', sans-serif;
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.3em; text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}

.hero-h1 {
  color: var(--white);
  font-size: clamp(3rem, 8.5vw, 7.5rem);
  font-weight: 900; line-height: 1.0;
  letter-spacing: -0.04em;
  margin-bottom: 0;
}
.hero-h1 em { color: var(--brand-light); font-style: normal; }

.hero-bottom {
  margin-top: 40px; padding-top: 28px;
  border-top: 1px solid rgba(255,255,255,0.12);
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 24px;
}
.hero-sub-copy {
  max-width: 480px;
  color: rgba(255,255,255,0.6);
  font-size: clamp(0.95rem, 1.8vw, 1.05rem);
  line-height: 1.8;
}
.hero-ctas { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; flex-shrink: 0; }

/* hero stats strip */
.hero-stats {
  background: rgba(11,11,11,0.75);
  backdrop-filter: blur(12px) saturate(160%);
  border-top: 1px solid rgba(255,255,255,0.07);
}
.hs-inner { display: flex; align-items: stretch; }
.hs-item {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 4px;
  padding: 22px 16px;
  border-right: 1px solid rgba(255,255,255,0.07);
}
.hs-item:last-child { border-right: none; }
.hs-item strong {
  color: var(--white); font-size: clamp(1rem, 2.5vw, 1.4rem);
  font-weight: 800; line-height: 1; letter-spacing: -0.02em;
}
.hs-item span { color: rgba(255,255,255,0.4); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; font-family: 'Outfit', sans-serif; }

/* === 마키 (텍스트) === */
@keyframes marquee-left {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.marquee-wrap {
  border-top: 1px solid var(--ink-100);
  border-bottom: 1px solid var(--ink-100);
  overflow: hidden; padding: 16px 0; background: var(--bg-alt);
}
.marquee-track {
  display: inline-flex; gap: 3rem; white-space: nowrap;
  animation: marquee-left 32s linear infinite;
  will-change: transform;
}
.marquee-track:hover { animation-play-state: paused; }
.m-item {
  font-family: 'Outfit', sans-serif;
  color: var(--ink-500); font-size: 13px;
  letter-spacing: 0.12em; text-transform: uppercase;
}
.m-sep { color: var(--brand); margin: 0 16px; opacity: .7; }

/* === WHY 섹션 — editorial 컬럼 === */
.why-cols {
  display: grid; grid-template-columns: repeat(3,1fr);
  border-top: 1px solid var(--ink-900);
  margin-top: 48px;
}
.why-col {
  padding: 40px 40px 36px 0;
  border-right: 1px solid rgba(255,255,255,0.07);
}
.why-col:last-child { border-right: none; }
.why-col-num {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(3rem, 6vw, 5rem);
  font-weight: 900; color: var(--brand);
  line-height: 1; letter-spacing: -0.04em;
  margin-bottom: 20px;
}
.why-col-num .unit { font-size: clamp(1.2rem,2.5vw,2rem); font-weight: 700; color: var(--white); }
.why-col h3 { color: var(--white); font-size: clamp(0.95rem,1.5vw,1.1rem); font-weight: 700; margin-bottom: 12px; }
.why-col p  { color: rgba(255,255,255,0.42); font-size: 14px; line-height: 1.75; }

/* === 서비스 카드 그리드 === */
.sv-grid {
  display: grid; grid-template-columns: repeat(2,1fr);
  border: 1px solid var(--ink-100);
}
.sv-card {
  background: var(--white);
  border-right: 1px solid var(--ink-100);
  border-bottom: 1px solid var(--ink-100);
  padding: 48px 44px 40px;
  display: flex; flex-direction: column;
  transition: background .25s var(--ease-std);
  text-decoration: none; color: inherit;
  position: relative; overflow: hidden;
}
.sv-card:nth-child(2n)        { border-right: none; }
.sv-card:nth-last-child(-n+2) { border-bottom: none; }
.sv-card:nth-child(5) { border-right: 1px solid var(--ink-100); }
.sv-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--brand); transform: scaleX(0); transform-origin: left;
  transition: transform .35s var(--ease);
}
.sv-card:hover { background: var(--brand-pale); }
.sv-card:hover::before { transform: scaleX(1); }
.sv-num {
  font-family: 'Outfit', sans-serif;
  font-size: 72px; font-weight: 900;
  color: rgba(12,94,59,.07); line-height: 1;
  letter-spacing: -0.05em; margin-bottom: 24px;
}
.sv-title  { font-size: clamp(1rem,1.8vw,1.2rem); font-weight: 800; color: var(--ink-900); margin-bottom: 14px; letter-spacing: -0.02em; }
.sv-desc   { color: var(--ink-500); font-size: 15px; flex-grow: 1; line-height: 1.82; }
.sv-link   {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--brand); font-weight: 700; font-size: 12px;
  margin-top: 32px; letter-spacing: 0.10em; text-transform: uppercase;
  transition: gap .2s;
}
.sv-card:hover .sv-link { gap: 14px; }

/* === 비교 섹션 === */
.compare-intro {
  display: grid; grid-template-columns: 1fr 2fr; gap: 80px;
  align-items: start; margin-bottom: 56px;
}
.compare-table-wrap { overflow-x: auto; }
.compare-table {
  width: 100%; border-collapse: collapse;
  border: 1px solid var(--ink-100);
}
.compare-table thead th {
  background: var(--ink-900); color: var(--white);
  font-family: 'Outfit', sans-serif;
  font-size: 12px; font-weight: 700; letter-spacing: 0.08em;
  padding: 18px 24px; text-align: left; border: none;
}
.compare-table thead th:first-child {
  background: var(--ink-700); color: rgba(255,255,255,0.5);
  font-weight: 600;
}
.compare-table thead th.col-highlight {
  background: var(--brand); color: var(--white); position: relative;
}
.compare-table thead th.col-highlight::after {
  content: '추천';
  position: absolute; top: -10px; right: 12px;
  background: var(--brand-light); color: var(--ink-900);
  font-size: 10px; font-weight: 800; padding: 3px 8px;
}
.compare-table tbody tr { border-bottom: 1px solid var(--ink-100); }
.compare-table tbody tr:last-child { border-bottom: none; }
.compare-table tbody td {
  padding: 16px 24px; font-size: 14px; color: var(--ink-700);
  border-right: 1px solid var(--ink-100);
}
.compare-table tbody td:last-child { border-right: none; }
.compare-table tbody td:first-child {
  font-weight: 700; font-size: 13px; color: var(--ink-500);
  background: var(--bg-alt);
}
.compare-table tbody td.col-highlight {
  background: var(--brand-pale); color: var(--brand); font-weight: 700;
}
.ct-good { color: var(--brand); font-weight: 700; }
.ct-bad  { color: var(--ink-500); }
.ct-mid  { color: var(--ink-700); }

/* === 프로세스 === */
.proc-grid {
  display: grid; grid-template-columns: repeat(4,1fr);
  border: 1px solid rgba(255,255,255,0.07);
}
.proc-card {
  background: rgba(255,255,255,0.025);
  border-right: 1px solid rgba(255,255,255,0.07);
  padding: 52px 36px 44px;
  position: relative; overflow: hidden; transition: background .25s;
}
.proc-card:last-child { border-right: none; }
.proc-card:hover { background: rgba(255,255,255,0.055); }
.proc-card::after {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--brand); opacity: 0; transition: opacity .3s;
}
.proc-card:hover::after { opacity: 1; }
.proc-num {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(52px, 8vw, 80px); font-weight: 900;
  color: rgba(255,255,255,0.04); line-height: 1;
  letter-spacing: -0.05em; margin-bottom: 28px;
}
.proc-card h3 { color: rgba(255,255,255,0.9); font-size: clamp(0.95rem,1.4vw,1.1rem); font-weight: 700; margin-bottom: 14px; }
.proc-card p  { color: rgba(255,255,255,0.42); font-size: 14px; line-height: 1.78; }

/* === FAQ (details/summary) === */
.faq-list { max-width: 820px; }
.faq-item { border-bottom: 1px solid rgba(255,255,255,0.10); }
.faq-item:first-child { border-top: 1px solid rgba(255,255,255,0.10); }
.faq-item summary {
  display: flex; align-items: flex-start; gap: 20px;
  padding: 24px 0; cursor: pointer; list-style: none;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-num {
  font-family: 'Outfit', sans-serif;
  font-size: 12px; color: rgba(255,255,255,0.4);
  font-weight: 600; margin-top: 2px; flex-shrink: 0; width: 28px;
}
.faq-q-text {
  flex: 1; font-size: 15px; font-weight: 600;
  color: rgba(255,255,255,0.75); line-height: 1.55;
  transition: color .2s;
}
.faq-item:hover .faq-q-text,
.faq-item[open] .faq-q-text { color: var(--white); }
.faq-icon {
  flex-shrink: 0; width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.5);
  transition: transform 0.4s cubic-bezier(0.77,0,0.175,1);
}
.faq-item[open] .faq-icon { transform: rotate(45deg); color: var(--brand-light); }
.faq-answer {
  padding: 0 0 24px 48px;
  font-size: 15px; color: rgba(255,255,255,0.45); line-height: 1.78;
}

/* Light variant FAQ */
.faq-list-light .faq-item {
  border-bottom-color: var(--ink-100);
}
.faq-list-light .faq-item:first-child {
  border-top-color: var(--ink-100);
}
.faq-list-light .faq-num { color: var(--ink-500); }
.faq-list-light .faq-q-text { color: var(--ink-700); }
.faq-list-light .faq-item:hover .faq-q-text,
.faq-list-light .faq-item[open] .faq-q-text { color: var(--brand); }
.faq-list-light .faq-icon { color: var(--ink-500); }
.faq-list-light .faq-item[open] .faq-icon { color: var(--brand); }
.faq-list-light .faq-answer { color: var(--ink-500); }

/* Legacy accordion (서브페이지) */
.faq-row       { border-bottom: 1px solid rgba(255,255,255,0.08); }
.faq-row:first-child { border-top: 1px solid rgba(255,255,255,0.08); }
.faq-q-btn {
  width: 100%; text-align: left; padding: 22px 0; font-weight: 600;
  color: rgba(255,255,255,0.75); font-size: 15px;
  display: flex; justify-content: space-between; align-items: center;
  gap: 16px; cursor: pointer; transition: color .2s;
}
.faq-q-btn:hover { color: var(--white); }
.faq-row.open .faq-q-btn { color: var(--brand-light); }
.faq-icon-wrap { flex-shrink: 0; }
.faq-icon-sym { display: block; font-size: 20px; font-weight: 300; color: var(--brand-light); transition: transform .25s; }
.faq-row.open .faq-icon-sym { transform: rotate(45deg); }
.faq-body { height: 0; overflow: hidden; transition: height .3s; }
.faq-row.open .faq-body { height: auto; }
.faq-body-inner { padding-bottom: 22px; color: rgba(255,255,255,0.45); font-size: 15px; line-height: 1.78; }

/* === 지역 그리드 === */
.region-grid {
  display: grid; grid-template-columns: repeat(5,1fr);
  border: 1px solid var(--ink-100);
}
.region-card {
  background: var(--white);
  border-right: 1px solid var(--ink-100);
  border-bottom: 1px solid var(--ink-100);
  padding: 20px 22px;
  display: flex; flex-direction: column; gap: 3px;
  transition: all .25s; text-decoration: none; color: inherit;
}
.region-card:hover { background: var(--brand-pale); }
.rc-num  { font-family: 'Outfit', sans-serif; font-size: 10px; color: var(--ink-500); font-weight: 700; letter-spacing: 0.10em; }
.rc-name { font-size: 14px; font-weight: 800; color: var(--ink-900); letter-spacing: -0.01em; }
.rc-svc  { font-size: 12px; color: var(--ink-500); }
.rc-arrow { font-size: 12px; color: var(--brand); margin-top: 6px; font-weight: 700; }

/* === CTA 밴드 === */
.cta-band {
  background: var(--ink-900); padding: 100px 0;
  text-align: center; position: relative; overflow: hidden;
}
.cta-band::before {
  content: 'MONTHLY'; position: absolute; right: -2%; top: 50%; transform: translateY(-50%);
  font-family: 'Outfit', sans-serif;
  font-size: clamp(5rem, 18vw, 15rem); font-weight: 900; letter-spacing: -0.06em;
  color: rgba(255,255,255,0.03); pointer-events: none; line-height: 1;
}
.cta-band h2 {
  font-size: clamp(1.8rem, 4vw, 3.2rem); color: var(--white);
  margin-bottom: 16px; letter-spacing: -0.03em;
}
.cta-band p { color: rgba(255,255,255,0.55); font-size: 16px; margin-bottom: 44px; }
.cta-btns { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }

/* === 푸터 === */
#site-footer { background: var(--ink-900); overflow: hidden; position: relative; }

.footer-cta-top {
  position: relative; z-index: 10;
  max-width: 1400px; margin: 0 auto;
  padding: 88px 48px 64px;
}
.footer-cta-label {
  font-family: 'Outfit', sans-serif;
  font-size: 11px; font-weight: 700; letter-spacing: 0.3em;
  text-transform: uppercase; color: rgba(255,255,255,0.4); margin-bottom: 20px;
}
.footer-cta-heading {
  font-size: clamp(2.4rem, 5vw, 5rem);
  color: var(--white); line-height: 1.1; letter-spacing: -0.03em; margin-bottom: 20px;
  max-width: 800px;
}
.footer-cta-desc { color: rgba(255,255,255,0.55); font-size: 16px; margin-bottom: 36px; line-height: 1.75; max-width: 520px; }
.hl-green { color: var(--brand-light); }

.footer-main {
  position: relative; z-index: 10;
  max-width: 1400px; margin: 0 auto;
  padding: 40px 48px 24px;
  border-top: 1px solid rgba(255,255,255,0.10);
}
.footer-grid {
  display: grid; grid-template-columns: 2fr 1fr 1fr;
  gap: 60px; margin-bottom: 40px;
}
.footer-brand-en {
  font-family: 'Outfit', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 0.20em;
  text-transform: uppercase; color: rgba(255,255,255,0.3); margin-bottom: 6px;
}
.footer-brand-name { font-size: 16px; font-weight: 800; color: var(--white); margin-bottom: 14px; letter-spacing: -0.01em; }
.footer-brand p { color: rgba(255,255,255,0.4); font-size: 14px; line-height: 1.78; }
.footer-col h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 0.20em;
  text-transform: uppercase; color: rgba(255,255,255,0.35); margin-bottom: 20px;
}
.footer-col ul { display: flex; flex-direction: column; gap: 12px; }
.footer-col ul li a {
  font-size: 14px; color: rgba(255,255,255,0.55); transition: color .2s; font-weight: 500;
}
.footer-col ul li a:hover { color: var(--white); }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.07);
  padding: 24px 0 20px;
}
.footer-biz-info {
  display: flex; flex-wrap: wrap; gap: 4px 20px;
  font-size: 12px; color: rgba(255,255,255,0.25); margin-bottom: 10px;
}
.footer-copy { font-size: 12px; color: rgba(255,255,255,0.22); }
.footer-legal { margin-top: 12px; }
.footer-legal p { font-size: 11px; color: rgba(255,255,255,0.18); line-height: 1.7; margin-bottom: 4px; }

/* === 플로팅 CTA (LCC 스타일) === */
.floating-cta {
  position: fixed; right: 16px; bottom: 16px; z-index: 90;
  opacity: 0; transform: translateY(16px);
  pointer-events: none;
  transition: opacity .45s, transform .45s;
  display: flex; flex-direction: column; gap: 8px;
}
@media (min-width: 768px) { .floating-cta { right: 24px; bottom: 24px; } }
.floating-cta.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
.float-btn {
  width: 52px; height: 52px;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  transition: transform .25s, background .25s;
  border: 1px solid rgba(15,23,42,0.08);
  background: rgba(255,255,255,0.88);
  color: var(--ink-900);
}
.float-btn:hover { transform: translateY(-3px); background: #fff; }
.float-btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; }
.float-btn.primary:hover { background: var(--brand-600); }

/* === GSAP 애니메이션 클래스 === */
.gs_reveal { opacity: 0; will-change: transform, opacity; }
.gs_reveal.is-visible { opacity: 1; }

.gs_stagger_item { opacity: 0; will-change: transform, opacity; }
.gs_stagger_item.is-visible { opacity: 1; }

/* CSS fallback for prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .gs_reveal, .gs_stagger_item { opacity: 1; transform: none; }
  .hero-bg img { animation: none; }
  .marquee-track { animation: none; }
}

/* Legacy CSS reveals (서브페이지) */
.reveal {
  opacity: 0; transform: translateY(20px);
  transition: opacity .55s ease, transform .55s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }
.stagger > * { opacity: 0; transform: translateY(16px); transition: opacity .5s ease, transform .5s ease; }
.stagger.visible > * { opacity: 1; transform: translateY(0); }
.stagger.visible > *:nth-child(1)  { transition-delay: .04s; }
.stagger.visible > *:nth-child(2)  { transition-delay: .08s; }
.stagger.visible > *:nth-child(3)  { transition-delay: .12s; }
.stagger.visible > *:nth-child(4)  { transition-delay: .16s; }
.stagger.visible > *:nth-child(5)  { transition-delay: .20s; }
.stagger.visible > *:nth-child(6)  { transition-delay: .24s; }
.stagger.visible > *:nth-child(7)  { transition-delay: .28s; }
.stagger.visible > *:nth-child(8)  { transition-delay: .32s; }
.stagger.visible > *:nth-child(9)  { transition-delay: .36s; }
.stagger.visible > *:nth-child(10) { transition-delay: .40s; }
.reveal-d1 { transition-delay: .08s; }
.reveal-d2 { transition-delay: .16s; }
.reveal-d3 { transition-delay: .24s; }
.reveal-d4 { transition-delay: .32s; }

/* === 서브페이지 히어로 === */
@keyframes pageHeroFadeUp {
  from { opacity:0; transform:translateY(18px); }
  to   { opacity:1; transform:translateY(0); }
}
.page-hero {
  position: relative; background: var(--ink-900);
  background-size: cover; background-position: center;
  padding-top: calc(var(--nav-h) + 72px); padding-bottom: 0;
  overflow: hidden;
}
.page-hero::before {
  content:''; position:absolute; inset:0;
  background: linear-gradient(to right, rgba(11,11,11,.92) 0%, rgba(11,11,11,.65) 52%, rgba(11,11,11,.15) 100%);
}
.page-hero-inner { position:relative; z-index:1; padding-bottom:56px; }
.breadcrumb {
  display:flex; align-items:center; gap:8px;
  font-size:12px; color:rgba(255,255,255,.35); margin-bottom:18px;
}
.breadcrumb a { color:rgba(255,255,255,.35); transition:color .2s; }
.breadcrumb a:hover { color:rgba(255,255,255,.8); }
.breadcrumb span { color:rgba(255,255,255,.18); }
.kicker {
  display:inline-block; font-family: 'Outfit', sans-serif;
  font-size:11px; font-weight:700; letter-spacing:0.22em;
  text-transform:uppercase; color:var(--brand-light); margin-bottom:14px;
}
.page-hero h1 {
  color:var(--white); font-size:clamp(2rem,4.5vw,3.2rem); font-weight:900;
  letter-spacing:-0.03em; margin-bottom:14px;
}
.page-hero .hero-sub {
  color:rgba(255,255,255,.6); font-size:clamp(.95rem,1.8vw,1.05rem);
  line-height:1.78; max-width:560px;
}
.hero-anim-0 { animation:pageHeroFadeUp .6s var(--ease) .05s both; }
.hero-anim-1 { animation:pageHeroFadeUp .6s var(--ease) .15s both; }
.hero-anim-2 { animation:pageHeroFadeUp .7s var(--ease) .28s both; }
.hero-anim-3 { animation:pageHeroFadeUp .7s var(--ease) .40s both; }
.hero-anim-4 { animation:pageHeroFadeUp .7s var(--ease) .52s both; }

.spec-strip {
  position:relative; z-index:1;
  background:rgba(11,11,11,.75); backdrop-filter:blur(12px);
  border-top:1px solid rgba(255,255,255,.07);
  display:flex; align-items:stretch;
}
.spec-item {
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:4px; padding:18px 12px;
  border-right:1px solid rgba(255,255,255,.06);
}
.spec-item:last-child { border-right:none; }
.spec-label { font-family: 'Outfit', sans-serif; font-size:10px; color:rgba(255,255,255,.35); letter-spacing:.10em; text-transform:uppercase; }
.spec-val   { font-size:1rem; font-weight:800; color:var(--white); letter-spacing:-0.01em; }

/* 서브페이지 feat/symp/proc/method/gallery/faq/related */
.feat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:40px; border:1px solid var(--ink-100); }
.feat-card {
  background:var(--white); border-right:1px solid var(--ink-100); border-bottom:1px solid var(--ink-100);
  border-top:2px solid var(--brand); padding:28px 24px;
}
.feat-card:last-child { border-right:none; }
.feat-num { font-family:'Outfit',sans-serif; font-size:36px; font-weight:900; color:rgba(12,94,59,.08); letter-spacing:-0.05em; line-height:1; margin-bottom:14px; }
.feat-card h3 { font-size:.95rem; color:var(--ink-900); margin-bottom:8px; font-weight:700; }
.feat-card p  { font-size:14px; color:var(--ink-500); line-height:1.7; }

.symp-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--ink-100); }
.symp-card { background:var(--white); padding:24px; transition:background .25s; }
.symp-card:hover { background:var(--brand-pale); }
.symp-num { font-family:'Outfit',sans-serif; font-size:10px; font-weight:700; color:var(--brand); letter-spacing:.12em; text-transform:uppercase; display:block; margin-bottom:10px; }
.symp-card h3 { font-size:.95rem; color:var(--ink-900); margin-bottom:8px; font-weight:700; }
.symp-card p  { font-size:13px; color:var(--ink-500); line-height:1.65; }

.proc-steps { display:grid; grid-template-columns:repeat(5,1fr); border:1px solid rgba(255,255,255,.06); }
.proc-step {
  background:rgba(255,255,255,.025); border-right:1px solid rgba(255,255,255,.06);
  padding:36px 24px; transition:background .25s;
}
.proc-step:last-child { border-right:none; }
.proc-step:hover { background:rgba(255,255,255,.06); }
.ps-num { font-family:'Outfit',sans-serif; font-size:52px; font-weight:900; color:rgba(255,255,255,.04); letter-spacing:-0.04em; line-height:1; margin-bottom:18px; display:block; }
.proc-step h3 { color:rgba(255,255,255,.9); font-size:.95rem; font-weight:700; margin-bottom:10px; }
.proc-step p  { color:rgba(255,255,255,.42); font-size:13px; line-height:1.7; }

.method-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--ink-100); }
.method-card { background:var(--white); border-right:1px solid var(--ink-100); padding:28px 24px; }
.method-card:last-child { border-right:none; }
.method-card h3 { font-size:1rem; font-weight:800; color:var(--ink-900); margin-bottom:16px; padding-bottom:12px; border-bottom:2px solid var(--brand); }
.method-pros { margin-bottom:12px; display:flex; flex-direction:column; gap:6px; }
.method-pros li::before { content:'✓ '; color:var(--brand); font-weight:700; }
.method-pros li { font-size:14px; color:var(--ink-700); line-height:1.6; }
.method-cons-label { font-family:'Outfit',sans-serif; font-size:11px; font-weight:700; color:var(--ink-500); text-transform:uppercase; letter-spacing:.10em; margin-bottom:6px; }
.method-cons { display:flex; flex-direction:column; gap:6px; }
.method-cons li::before { content:'· '; color:var(--ink-500); }
.method-cons li { font-size:13px; color:var(--ink-500); line-height:1.6; }

.svc-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.svc-gallery-item { overflow:hidden; position:relative; }
.svc-gallery-item img { width:100%; height:220px; object-fit:cover; display:block; transition:transform .4s; }
.svc-gallery-item:hover img { transform:scale(1.04); }
.svc-gallery-caption { font-size:13px; color:var(--ink-500); padding:10px 4px 0; }
.svc-gallery-more { text-align:center; margin-top:32px; }

/* subpage faq-list (accordion) */
.faq-list { max-width:820px; }
.faq-item-sub { border-bottom:1px solid var(--ink-100); }
.faq-item-sub:first-child { border-top:1px solid var(--ink-100); }
.faq-btn {
  width:100%; text-align:left; padding:18px 0;
  font-weight:700; color:var(--ink-900); font-size:15px;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  cursor:pointer; transition:color .2s;
}
.faq-btn:hover { color:var(--brand); }
.faq-item-sub.open .faq-btn { color:var(--brand); }
.faq-icon { font-size:20px; font-weight:300; color:var(--brand); flex-shrink:0; transition:transform .25s; }
.faq-item-sub.open .faq-icon { transform:rotate(45deg); }
.faq-a { height:0; overflow:hidden; transition:height .3s; }
.faq-item-sub.open .faq-a { height:auto; }
.faq-a p { padding-bottom:18px; font-size:15px; color:var(--ink-500); line-height:1.78; }

.related-row { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--ink-100); }
.related-link-card {
  background:var(--white); border-right:1px solid var(--ink-100);
  padding:22px 28px; font-size:15px; font-weight:700; color:var(--ink-900);
  display:flex; justify-content:space-between; align-items:center; transition:all .25s;
}
.related-link-card:last-child { border-right:none; }
.related-link-card:hover { background:var(--brand-pale); color:var(--brand); }
.rl-arrow { color:var(--brand); transition:transform .2s; }
.related-link-card:hover .rl-arrow { transform:translateX(5px); }

/* 서브페이지 CTA 밴드 */
.cta-band-inner {
  display:flex; align-items:center; justify-content:space-between; gap:40px;
  flex-wrap:wrap;
}
.cta-band-text .cta-band-en {
  font-family:'Outfit',sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:rgba(255,255,255,.4); margin-bottom:10px;
}
.cta-band-h2 {
  font-size:clamp(1.6rem,3vw,2.4rem); color:var(--white); line-height:1.2;
  letter-spacing:-0.03em; margin-bottom:10px;
}
.cta-band-sub { color:rgba(255,255,255,.45); font-size:14px; }
.cta-btns { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }

/* === AEO/GEO 페이지 === */
.aeo-definition { background:var(--brand-pale); border-left:3px solid var(--brand); padding:24px 28px; margin-bottom:40px; }
.aeo-definition p { font-size:16px; line-height:1.88; color:var(--ink-700); margin:0; }
.aeo-compare-table { width:100%; border-collapse:collapse; margin:32px 0; }
.aeo-compare-table th { background:var(--ink-900); color:var(--white); font-size:13px; font-weight:700; padding:14px 16px; text-align:left; }
.aeo-compare-table td { border-bottom:1px solid var(--ink-100); padding:13px 16px; font-size:14px; color:var(--ink-700); }
.info-list { display:flex; flex-direction:column; gap:12px; margin:24px 0; }
.info-list li { display:flex; gap:12px; align-items:flex-start; font-size:15px; line-height:1.7; color:var(--ink-700); }
.info-list li::before { content:''; flex-shrink:0; width:4px; height:4px; background:var(--brand); margin-top:8px; }

.geo-article { max-width:820px; }
.geo-article h2 { font-size:clamp(1.3rem,2.5vw,1.7rem); color:var(--ink-900); margin:48px 0 16px; padding-bottom:10px; border-bottom:2px solid var(--ink-100); }
.geo-article h3 { font-size:1.1rem; color:var(--brand); margin:28px 0 10px; font-weight:700; }
.geo-article p  { font-size:15px; line-height:1.88; color:var(--ink-700); margin-bottom:16px; }
.geo-article ul { margin:0 0 20px 4px; display:flex; flex-direction:column; gap:8px; }
.geo-article ul li { font-size:15px; color:var(--ink-700); line-height:1.7; padding-left:16px; position:relative; }
.geo-article ul li::before { content:''; position:absolute; left:0; top:10px; width:5px; height:1px; background:var(--brand); }
.geo-data-box { background:var(--bg-alt); border:1px solid var(--ink-100); border-left:3px solid var(--brand); padding:24px 28px; margin:24px 0; }
.geo-data-box table { width:100%; border-collapse:collapse; }
.geo-data-box th { font-size:12px; font-weight:700; color:var(--brand); text-align:left; padding:8px 12px; border-bottom:2px solid var(--ink-100); letter-spacing:.06em; text-transform:uppercase; }
.geo-data-box td { font-size:14px; color:var(--ink-700); padding:10px 12px; border-bottom:1px solid var(--ink-100); }
.geo-data-box tr:last-child td { border-bottom:none; }
.geo-cite { font-size:12px; color:var(--ink-500); margin-top:8px; }

/* === 상담 폼 === */
.consultation-section { padding: 80px 0; }
.form-card {
  background: var(--white); border: 1px solid var(--ink-100);
  padding: 48px; max-width: 680px; margin: 0 auto;
  box-shadow: var(--shadow-md);
}
.form-group { margin-bottom: 24px; }
.form-group label { display: block; font-size: 13px; font-weight: 700; color: var(--ink-900); margin-bottom: 8px; letter-spacing: .02em; }
.form-group input,
.form-group select,
.form-group textarea {
  width: 100%; padding: 12px 16px;
  border: 1px solid var(--ink-100);
  font-family: inherit; font-size: 15px; color: var(--ink-900);
  background: var(--bg); transition: border-color .2s, box-shadow .2s; outline: none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(12,94,59,.10);
}
.form-group textarea { resize: vertical; min-height: 120px; }
.form-submit {
  width: 100%; padding: 17px;
  background: var(--brand); color: var(--white);
  font-size: 15px; font-weight: 700;
  border: none; cursor: pointer; transition: background .2s;
  font-family: inherit; letter-spacing: .04em;
}
.form-submit:hover { background: var(--brand-600); }

/* === 갤러리 === */
.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
.gallery-card {
  background: var(--white); border: 1px solid var(--ink-100);
  overflow: hidden; transition: border-color .25s, box-shadow .25s;
  text-decoration: none; color: inherit;
}
.gallery-card:hover { border-color: var(--brand); box-shadow: var(--shadow-md); }
.gallery-thumb { height: 200px; overflow: hidden; }
.gallery-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.gallery-card:hover .gallery-thumb img { transform: scale(1.04); }
.gallery-body { padding: 20px 24px; }
.gallery-cat  { font-family: 'Outfit', sans-serif; font-size: 10px; text-transform: uppercase; letter-spacing: .14em; color: var(--brand); font-weight: 700; }
.gallery-name { font-size: 15px; font-weight: 800; color: var(--ink-900); margin-top: 4px; letter-spacing: -0.01em; }
.gallery-type { font-size: 13px; color: var(--ink-500); margin-top: 2px; }

/* === 차량 스크롤 === */
.car-scroll-outer { overflow-x: auto; scrollbar-width: none; }
.car-scroll-outer::-webkit-scrollbar { display: none; }
.car-scroll-track { display: flex; gap: 2px; width: max-content; }
.car-scroll-card {
  background: var(--white); border: 1px solid var(--ink-100);
  overflow: hidden; width: 260px; flex-shrink: 0;
  transition: border-color .25s, box-shadow .25s;
  text-decoration: none; color: inherit; display: block;
}
.car-scroll-card:hover { border-color: var(--brand); box-shadow: var(--shadow-md); }
.c-thumb { height: 160px; overflow: hidden; }
.c-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.car-scroll-card:hover .c-thumb img { transform: scale(1.05); }
.c-body { padding: 16px 20px 20px; }
.c-cat  { font-family: 'Outfit', sans-serif; font-size: 10px; text-transform: uppercase; letter-spacing: .14em; color: var(--brand); font-weight: 700; }
.c-name { font-size: 15px; font-weight: 800; color: var(--ink-900); margin-top: 4px; margin-bottom: 2px; letter-spacing: -0.01em; }
.c-type { font-size: 13px; color: var(--ink-500); }
.c-more { font-family: 'Outfit', sans-serif; font-size: 12px; color: var(--brand); font-weight: 700; margin-top: 12px; display: block; letter-spacing: .06em; text-transform: uppercase; }
.car-cta-full { text-align: center; margin-top: 48px; }
.car-scroll-wrap { padding: 32px 48px 0; }

/* === 사이트맵 === */
.sitemap-section { padding: 64px 0; }
.sitemap-filters { display: flex; gap: 2px; flex-wrap: wrap; margin-bottom: 32px; }
.filter-btn {
  padding: 8px 20px; font-size: 12px; font-weight: 700;
  border: 1px solid var(--ink-100); background: var(--white); color: var(--ink-500);
  cursor: pointer; transition: all .22s; letter-spacing: .04em;
}
.filter-btn:hover, .filter-btn.active { background: var(--brand); color: var(--white); border-color: var(--brand); }
.sitemap-search-wrap { margin-bottom: 28px; }
.sitemap-search {
  width: 100%; max-width: 400px; padding: 12px 20px;
  border: 1px solid var(--ink-100); font-family: inherit; font-size: 14px; color: var(--ink-900);
  background: var(--white); outline: none; transition: border-color .2s;
}
.sitemap-search:focus { border-color: var(--brand); }
.sitemap-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; }
.sitemap-card {
  background: var(--white); border: 1px solid var(--ink-100); padding: 16px 20px;
  transition: all .22s; text-decoration: none; color: inherit;
  display: flex; flex-direction: column; gap: 4px;
}
.sitemap-card:hover { border-color: var(--brand); background: var(--brand-pale); }
.sitemap-card-cat   { font-family: 'Outfit', sans-serif; font-size: 10px; color: var(--brand); font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.sitemap-card-title { font-size: 13px; font-weight: 700; color: var(--ink-900); }
.sitemap-icon       { color: var(--brand); display: flex; align-items: center; margin-bottom: 4px; }
.sitemap-no-result  { text-align: center; padding: 48px 0; color: var(--ink-500); font-size: 14px; }

/* === 차량 상세 === */
.car-detail-section { padding: 64px 0; }
.car-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.car-detail-img { overflow: hidden; }
.car-detail-cat  { font-family: 'Outfit', sans-serif; font-size: 11px; color: var(--brand); font-weight: 700; text-transform: uppercase; letter-spacing: .14em; margin-bottom: 8px; }
.car-detail-name { font-size: clamp(1.6rem,3vw,2.4rem); font-weight: 900; color: var(--ink-900); margin-bottom: 16px; letter-spacing: -0.03em; }
.car-detail-summary { font-size: 15px; color: var(--ink-500); line-height: 1.82; margin-bottom: 28px; }
.car-detail-steps { display: flex; flex-direction: column; gap: 16px; margin-bottom: 32px; }
.car-detail-step { display: flex; gap: 16px; align-items: flex-start; }
.cds-num {
  flex-shrink: 0; width: 28px; height: 28px;
  background: var(--brand); color: var(--white);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800;
}
.cds-body h4 { font-size: 15px; color: var(--ink-900); margin-bottom: 4px; font-weight: 700; }
.cds-body p  { font-size: 14px; color: var(--ink-500); }

/* === 404 === */
.not-found-section { padding: 120px 0; text-align: center; }
.not-found-code { font-family: 'Outfit', sans-serif; font-size: clamp(5rem,15vw,9rem); font-weight: 900; color: var(--ink-100); line-height: 1; letter-spacing: -0.05em; }
.not-found-msg  { font-size: clamp(1.2rem,3vw,1.8rem); color: var(--ink-900); margin: 16px 0 12px; }
.not-found-sub  { color: var(--ink-500); font-size: 15px; margin-bottom: 36px; }
#no-result { padding: 40px; text-align: center; color: var(--ink-500); }

/* === 반응형 === */
@media (max-width: 1024px) {
  .container { padding: 0 36px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .footer-brand { grid-column: 1 / -1; }
  .proc-grid { grid-template-columns: repeat(2, 1fr); }
  .region-grid { grid-template-columns: repeat(4, 1fr); }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .sitemap-grid { grid-template-columns: repeat(3, 1fr); }
  .compare-intro { grid-template-columns: 1fr; gap: 32px; }
  .why-cols { grid-template-columns: 1fr 1fr 1fr; }
  .footer-cta-top { padding: 72px 36px 48px; }
  .footer-main { padding: 32px 36px 20px; }
}

@media (max-width: 900px) {
  .car-detail-grid { grid-template-columns: 1fr; }
  .sv-grid { grid-template-columns: 1fr; }
  .sv-card { border-right: none; }
}

@media (max-width: 768px) {
  .container { padding: 0 20px; }
  .section    { padding: 72px 0; }
  .section-sm { padding: 40px 0; }

  .header-nav { display: none; }
  .hamburger  { display: flex; }
  .overlay-head { padding: 0 20px; }
  .overlay-body { padding: 40px 20px 48px; }

  .hero-h1 { font-size: clamp(2.6rem, 10vw, 4.5rem); }
  .hero-deco { font-size: clamp(5rem, 28vw, 10rem); right: -5%; }
  .hero-bottom { flex-direction: column; align-items: flex-start; }
  .hero-stats { position: static; }
  .hs-inner { flex-wrap: wrap; }
  .hs-item { min-width: 50%; border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); }
  .hs-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.07); }

  .why-cols { grid-template-columns: 1fr; border-top: 1px solid rgba(255,255,255,.10); }
  .why-col  { border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); padding: 32px 0; }

  .proc-grid { grid-template-columns: 1fr 1fr; }
  .proc-card { padding: 32px 24px; }

  .region-grid { grid-template-columns: repeat(3, 1fr); }
  .gallery-grid { grid-template-columns: 1fr; }
  .sitemap-grid { grid-template-columns: repeat(2, 1fr); }

  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-cta-top  { padding: 56px 20px 40px; }
  .footer-main     { padding: 24px 20px 16px; }
  .footer-cta-heading { font-size: clamp(2rem, 8vw, 3rem); }

  .cta-band  { padding: 72px 0; }
  .cta-btns  { flex-direction: column; }
  .cta-btns a { width: 100%; justify-content: center; }
  .cta-band-inner { flex-direction: column; }

  .feat-grid  { grid-template-columns: 1fr; }
  .symp-grid  { grid-template-columns: 1fr 1fr; }
  .proc-steps { grid-template-columns: repeat(3, 1fr); }
  .method-grid { grid-template-columns: 1fr 1fr; }
  .svc-gallery { grid-template-columns: 1fr 1fr; }
  .related-row { grid-template-columns: 1fr; }
  .related-link-card { border-right: none; border-bottom: 1px solid var(--ink-100); }
  .car-scroll-wrap { padding: 24px 20px 0; }
}

@media (max-width: 480px) {
  .proc-grid  { grid-template-columns: 1fr; }
  .region-grid { grid-template-columns: repeat(2, 1fr); }
  .sitemap-grid { grid-template-columns: 1fr; }
  .hero-ctas { flex-direction: column; }
  .hero-ctas .btn-primary, .hero-ctas .btn-ghost { width: 100%; text-align: center; }
  .form-card { padding: 28px 16px; }
  .symp-grid  { grid-template-columns: 1fr; }
  .proc-steps { grid-template-columns: 1fr 1fr; }
  .svc-gallery { grid-template-columns: 1fr; }
  .spec-strip { flex-wrap: wrap; }
  .spec-item { min-width: 50%; border-bottom: 1px solid rgba(255,255,255,.07); }
  .spec-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.07); }
  .feat-grid { grid-template-columns: 1fr; }
}

/* === 상담 페이지 === */
.page-hero-sm {
  position: relative; background: var(--ink-900);
  padding: calc(var(--nav-h) + 56px) 0 56px; overflow: hidden;
}
.page-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(12,94,59,0.25) 0%, transparent 60%);
}
.page-hero-content {
  position: relative; z-index: 1;
  max-width: 1400px; margin: 0 auto; padding: 0 48px;
}
.page-hero-title {
  font-size: clamp(2rem, 4vw, 3.2rem); color: var(--white);
  letter-spacing: -0.03em; margin-bottom: 12px;
}
.page-hero-sub { color: rgba(255,255,255,0.55); font-size: 16px; }

.consult-cards {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 24px; margin-bottom: 48px;
}
.consult-card {
  background: var(--white); border: 1px solid var(--ink-100);
  padding: 40px; transition: border-color .25s;
}
.consult-card:hover { border-color: var(--brand); }
.consult-card-icon {
  width: 56px; height: 56px;
  background: var(--brand-pale); color: var(--brand);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 20px;
}
.consult-card-title {
  font-size: 1.2rem; font-weight: 800; color: var(--ink-900);
  margin-bottom: 12px; letter-spacing: -0.02em;
}
.consult-phone-link {
  display: inline-block; font-size: 1.5rem; font-weight: 900;
  color: var(--brand); letter-spacing: -0.02em;
  margin-bottom: 12px; transition: color .2s;
}
.consult-phone-link:hover { color: var(--brand-600); }
.consult-sms-link {
  display: inline-flex; align-items: center;
  background: var(--brand); color: var(--white);
  font-size: 14px; font-weight: 700; padding: 10px 24px;
  margin-bottom: 16px; transition: background .2s;
}
.consult-sms-link:hover { background: var(--brand-600); }
.consult-card-desc { font-size: 14px; color: var(--ink-500); line-height: 1.72; }
.consult-sms-template { margin-top: 16px; background: var(--bg-alt); padding: 16px 20px; }
.sms-template-label {
  font-family: 'Outfit', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--brand); margin-bottom: 10px;
}
.sms-template-pre {
  font-family: 'Pretendard Variable', monospace;
  font-size: 13px; color: var(--ink-700); line-height: 1.72;
  white-space: pre-wrap; margin: 0;
}
.consult-notice {
  font-size: 13px; color: var(--ink-500); line-height: 1.75;
  border-top: 1px solid var(--ink-100); padding-top: 24px; margin-bottom: 40px;
}
.biz-info-list { display: flex; flex-direction: column; border: 1px solid var(--ink-100); }
.biz-info-row {
  display: flex; border-bottom: 1px solid var(--ink-100);
}
.biz-info-row:last-child { border-bottom: none; }
.biz-info-row dt {
  flex-shrink: 0; width: 140px; padding: 14px 20px;
  font-size: 13px; font-weight: 700; color: var(--ink-500);
  background: var(--bg-alt);
}
.biz-info-row dd { padding: 14px 20px; font-size: 14px; color: var(--ink-700); line-height: 1.6; }

@media (max-width: 768px) {
  .page-hero-content { padding: 0 20px; }
  .consult-cards { grid-template-columns: 1fr; }
  .consult-card { padding: 28px 24px; }
  .biz-info-row dt { width: 100px; }
}
