/* ── 디자인 토큰 ─────────────────────────────────────────────
   위시켓 158308 이사 서비스 리뉴얼 제안 시안
   값의 출처: agy 직원 A·B·C·D 네 안을 의장이 종합 (2026-09-10)
   색은 두 벌이다. data-palette 속성 하나로 통째로 갈린다.        */

:root {
  /* ── 팔레트 1 · 신뢰형 (기본) ── C안 딥 인디고 + 코랄 강조 ── */
  --c-primary:        #1B3B6F;   /* 딥 인디고 — 레퍼런스의 밝은 파랑을 피한 값 */
  --c-primary-dark:   #12294E;
  --c-primary-soft:   #E8EDF6;
  --c-accent:         #FF5A36;   /* 코랄 오렌지 — 전환 행동 전용 */
  --c-accent-dark:    #E64420;
  --c-verify:         #0D9488;   /* 틸 — 인증·보장 표시 (A안) */
  --c-info:           #1B3B6F;   /* 법적·안내 문구 자리 */
  --c-bg:             #F8FAFC;
  --c-surface:        #FFFFFF;
  --c-text:           #0F172A;
  --c-text-sub:       #475569;
  --c-text-mute:      #94A3B8;
  --c-line:           #E2E8F0;
  --shadow-1: 0 2px 8px rgba(15,23,42,.06);
  --shadow-2: 0 12px 24px rgba(15,23,42,.12);
  --shadow-cta: 0 8px 20px rgba(255,90,54,.22);

  /* ── 글자 ── 넷이 모두 Pretendard 로 모였다 ── */
  --font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
          "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
  --fs-display: 36px;   /* 모바일 28px — 아래 미디어쿼리에서 갈린다 */
  --fs-title:   24px;
  --fs-sub:     20px;
  --fs-body:    16px;   /* 🔴 16px 아래로 내리지 않는다 — 모바일 입력창에서
                              브라우저가 화면을 강제로 확대한다 (B안 근거) */
  --fs-caption: 14px;
  --fs-btn:     17px;
  --lh-tight: 1.3;
  --lh-body:  1.6;

  /* ── 모서리 ── 레퍼런스가 4px 과 50px 을 섞어 쓰던 자리를 체계로 ── */
  --r-input: 8px;
  --r-card: 12px;
  --r-modal: 16px;
  --r-chip: 999px;

  /* ── 간격 ── 8px 배수 ── */
  --s1: 8px;  --s2: 16px; --s3: 24px; --s4: 32px; --s5: 48px; --s6: 64px; --s7: 80px;
  --maxw: 1200px;
  --ease: cubic-bezier(.4,0,.2,1);
}

/* ── 팔레트 2 · 설렘형 ── D안 웜 코랄 + 크림 바탕 ── */
[data-palette="warm"] {
  --c-primary:        #FF6B4A;
  --c-primary-dark:   #E5502F;
  --c-primary-soft:   #FFF0EB;
  /* 🔴 전환 단추는 두 팔레트 모두 따뜻한 색이다.
     여기를 네이비로 뒤집었더니 「견적 알아보기」가 파랗게 죽었다 (실측 2026-09-10).
     설렘형의 네이비는 브랜드색이 아니라 인증·법적 안내 자리에만 쓴다 → --c-info */
  --c-accent:         #E5502F;   /* 주색보다 한 단계 진한 코랄 — 눌러야 할 곳 */
  --c-accent-dark:    #C93E1F;
  --c-info:           #1E3A8A;
  --c-verify:         #0F766E;
  --c-bg:             #FAF9F6;   /* 웜 크림 — 순백의 눈부심을 던다 */
  --c-surface:        #FFFFFF;
  --c-text:           #1F2937;
  --c-text-sub:       #6B7280;
  --c-text-mute:      #9CA3AF;
  --c-line:           #EAE7E1;
  --shadow-cta: 0 8px 24px rgba(255,107,74,.20);
}

@media (max-width: 767px) {
  :root { --fs-display: 28px; --fs-title: 20px; --fs-sub: 18px; --fs-btn: 16px; }
}

/* 색이 갈릴 때 화면 전체가 부드럽게 넘어간다 */
* { transition: background-color .35s var(--ease), border-color .35s var(--ease),
                color .35s var(--ease), box-shadow .35s var(--ease); }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }