/* ═══════════════════════════════════════════════════════════
   THEME (Phase 2) — theme-phase2.css
   배경 통일(흰색) + 섹션 교차 톤(흰↔연노랑) + 가독성 반전 + 정렬
   · index.html 전용 (공유 style/section CSS 미수정 — 타 페이지 영향 차단)
   · 모든 색은 CSS 변수로. 강조 골드(--gold)는 기존 변수 그대로 재사용.
   · 가장 마지막에 로드 → 동일 특이성에서 소스 순서로 override.
   ⚠️ Phase 2 범위 = 색·배경·정렬만. 구조/콘텐츠/순서 변경 없음.
═══════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────
   [1] 색 정의 (새 색 난립 금지 — 골드는 기존 변수 재사용)
───────────────────────────────────────── */
:root {
  --color-bg: #ffffff;               /* 사이트 베이스 */
  --color-bg-tint: #fff7e0;          /* fallback */
  --color-bg-tint: color-mix(in srgb, var(--gold) 8%, #ffffff); /* 골드에서 파생 */
  --color-accent: var(--gold);       /* 기존 골드 그대로 (변경 금지) */
  --color-text: #1a1a1a;             /* 흰배경용 진한 본문색 */
  --color-text-sub: #555555;         /* 보조 텍스트 */
  --color-line: #ececec;             /* 옅은 구분선 */
  --color-card: #ffffff;             /* 카드 surface */
}

/* ─────────────────────────────────────────
   [2] 베이스 + 섹션 교차 클래스
───────────────────────────────────────── */
body {
  background: var(--color-bg);
  color: var(--color-text);
}

/* 교차 톤: 연노랑 배경 (인라인 하드코딩 금지 — 이 클래스로만) */
.section--tint {
  background: var(--color-bg-tint);
}

/* ─────────────────────────────────────────
   [3] 전역 타이포(style.css) 가독성 반전
───────────────────────────────────────── */
.section-title {
  color: var(--color-text);
}
.section-sub {
  color: var(--color-text-sub);
}
/* btn-secondary: 흰 글씨 → 진한 글씨 */
.btn-secondary {
  color: var(--color-text);
  border-color: rgba(0, 0, 0, 0.25);
}
.btn-secondary:hover {
  border-color: var(--gold);
  color: var(--gold-dark);
}

/* ─────────────────────────────────────────
   [4] 상단 네비 정렬 (로고 좌 — 메뉴 우)
───────────────────────────────────────── */
.gnb__menu {
  margin: 0 0 0 auto; /* 중앙(auto auto) → 우측 정렬 */
}

/* ─────────────────────────────────────────
   [5] HERO — 어두운 배경/오버레이 제거 → 흰 배경 + 진한 글씨
───────────────────────────────────────── */
.hero {
  background: var(--color-bg);
}
.hero::before {
  content: none;
  display: none;
}
.hero__catch {
  color: var(--color-text-sub);
}
.hero__headline {
  color: var(--color-text);
}
.hero__lead {
  color: var(--color-text-sub);
}
.hero__btns {
  background: transparent;
  padding: 24px 0;
}

/* ─────────────────────────────────────────
   [6] PROMO (이벤트 배너) — 검정 제거
───────────────────────────────────────── */
.event-banner-section {
  background: transparent;
}
.event-banner__main {
  color: var(--color-text);
}

/* ─────────────────────────────────────────
   [7] ZONE #why 내부 — hero-secondary / stats / signature
       (#why 는 .section--tint 밴드, 내부는 투명 처리해 톤이 비치게)
───────────────────────────────────────── */
.hero-secondary {
  background: transparent;
}
.hero-secondary__bg,
.hero-secondary__overlay {
  display: none; /* 어두운 사진 + 오버레이 제거 */
}
.hero-secondary__headline {
  color: var(--color-text);
}
.hero-secondary__lead {
  color: var(--color-text-sub);
}

.stats {
  background: transparent;
}
.stats__label {
  color: var(--color-text-sub);
}

.signature {
  background: transparent;
}
.signature__region-name {
  color: var(--color-text);
}
.signature__region-label,
.signature__meta-label,
.signature__total-label {
  color: var(--color-text-sub);
}
.signature__total {
  background: var(--color-card);
  border-color: rgba(0, 0, 0, 0.08);
}

/* ─────────────────────────────────────────
   [8] ZONE #support 내부 — solution / problem / voice / feature / target
───────────────────────────────────────── */
.solution {
  background: transparent;
}
.solution__benefit {
  background: var(--color-card);
}
.solution__benefit:hover {
  background: #fafafa;
}
.solution__benefit h4 {
  color: var(--color-text);
}
.solution__benefit p {
  color: var(--color-text-sub);
}
.solution__card {
  background: var(--color-card);
  border: 1px solid var(--color-line);
}
.solution__card-value {
  color: var(--color-text);
}
.solution__card-desc {
  color: var(--color-text-sub);
}

.problem {
  background: transparent;
}

.voice {
  background: transparent;
}
.voice__title {
  color: var(--color-text);
}

.feature {
  background: transparent;
}
.feature__title {
  color: var(--color-text);
}
.feature__sub {
  color: var(--color-text-sub);
}
.feature__card {
  background: var(--color-card);
  border-color: var(--color-line);
}
.feature__card-title {
  color: var(--color-text);
}
.feature__card-desc {
  color: var(--color-text-sub);
}
.feature__visual {
  background: #faf6ea;
  border-color: #e8dec2;
}
.feature__visual-ph {
  color: #b3a06a;
}

.target {
  background: transparent;
}
.target__card {
  background: var(--color-card);
  border: 1px solid var(--color-line);
}
.target__card:hover {
  background: #fafafa;
}
.target__card h3 {
  color: var(--color-text);
}
.target__card p {
  color: var(--color-text-sub);
}
.target__number {
  color: rgba(240, 192, 0, 0.14); /* 흰 배경에서 살짝 보이게 (검정용 0.06 → 상향) */
}

/* ─────────────────────────────────────────
   [9] #cost (신규 빈 섹션) — tint 밴드에서 placeholder 톤만 정리
───────────────────────────────────────── */
.cost__placeholder {
  background: var(--color-card);
}

/* ─────────────────────────────────────────
   [10] #branches — 검정 제거
───────────────────────────────────────── */
.branches {
  background: transparent;
}
.branches__item__front {
  border-color: rgba(0, 0, 0, 0.08);
}

/* ─────────────────────────────────────────
   [11] ZONE #stores 내부 — store(사진) / company-history
───────────────────────────────────────── */
/* store: 어두운 사진 밴드 → 밝게 + 진한 글씨 (사진 자체는 유지) */
.store__bg {
  filter: blur(2px) brightness(1.02);
}
.store__item:hover .store__bg {
  filter: blur(1px) brightness(1.08);
}
.store__overlay {
  background: linear-gradient(
    to top,
    rgba(255, 255, 255, 0.92) 0%,
    rgba(255, 255, 255, 0.35) 55%,
    rgba(255, 255, 255, 0.1) 100%
  );
}
.store__sub {
  color: var(--gold-dark);
}
.store__title {
  color: var(--color-text);
}
.store__desc {
  color: var(--color-text-sub);
}

.company-history {
  background: transparent;
}
.company-history__tagline {
  color: var(--color-text-sub);
}
.company-history__brand {
  color: var(--color-text);
}
.company-history__event {
  color: var(--color-text);
}
.company-history__badge {
  background: var(--color-card); /* 검정 원 → 흰 원 (골드 테두리 유지) */
}
.company-history__timeline li::before {
  background: var(--color-card); /* 검정 점 → 흰 점 (골드 테두리 유지) */
}

/* ─────────────────────────────────────────
   [12] dapick-bridge — 보라/남색 그라디언트 → 흰 배경 + 진한 글씨
───────────────────────────────────────── */
.dapick-bridge {
  background: var(--color-bg);
}
.dapick-bridge::before {
  color: rgba(201, 168, 76, 0.08);
}
.dapick-bridge__title {
  color: var(--color-text);
}
.dapick-bridge__sub {
  color: var(--color-text-sub);
}

/* ─────────────────────────────────────────
   [13] #contact (tint 밴드) — 폼/카피 반전 (Formspree 동작은 그대로)
───────────────────────────────────────── */
.contact {
  background: transparent; /* 톤은 .section--tint 가 담당 */
}
.contact__info h2 {
  color: var(--color-text);
}
.contact__info p {
  color: var(--color-text-sub);
}
.guarantee__item {
  color: var(--color-text-sub);
}
.form {
  background: var(--color-card);
  border: 1px solid var(--color-line);
}
.form__title {
  color: var(--color-text);
  border-bottom-color: var(--color-line);
}
.form__label {
  color: var(--color-text-sub);
}
.form__input,
.form__select,
.form__textarea {
  background: #ffffff;
  border-color: #dddddd;
  color: var(--color-text);
}
.form__input::placeholder,
.form__textarea::placeholder {
  color: #999999;
}
.form__select option {
  background: #ffffff;
  color: var(--color-text);
}
.form__success h3 {
  color: var(--color-text);
}
.form__success p {
  color: var(--color-text-sub);
}

/* ─────────────────────────────────────────
   [14] FOOTER (법적 푸터) — 흰 배경에서 글씨 진하게
───────────────────────────────────────── */
.footer-extended__legal-info p,
.footer-meta p {
  color: var(--color-text-sub);
}
.footer-extended__legal-info strong,
.footer-meta strong {
  color: var(--color-text);
}
.footer-copy {
  color: var(--color-text-sub);
}
.cert-logo-main-label {
  color: var(--color-text-sub);
}
.footer-extended__legal {
  border-top-color: var(--color-line);
}

/* ─────────────────────────────────────────
   [15] 하단 고정 바 (BHC 톤 정리) — 연한 배경 바 + 골드 CTA
───────────────────────────────────────── */
.footer-bar {
  background: var(--color-bg);
  border-top-color: var(--color-line);
}
.footer-bar__sns-btn {
  border-color: var(--color-line);
  color: var(--color-text);
}
.footer-bar__cta {
  background: var(--color-accent);
  color: #1a1a1a;
}
.footer-bar__cta:hover {
  background: var(--gold-dark);
}