/* ============================================================
   지엘행정사 사무소 — 디자인 토큰 (styles/tokens.css)
   전 페이지(index/services/cases/consult)가 style.css보다 먼저
   이 파일을 로드합니다. 색상·타이포·스페이싱의 단일 기준입니다.

   2026-09 업데이트: 퍼플/인디고 컬러 시스템으로 교체
   (기존 딥틸+코럴 → 인디고 퍼플, 모바일 앱 디자인 레퍼런스 기준)
   ============================================================ */
:root{
  /* ── 컬러 시스템 ── */
  --color-primary:#4B3D8F;        /* 딥 인디고 퍼플 — 헤더 포인트, 주요 버튼, 링크 */
  --color-primary-dark:#342A66;   /* 호버/다크 섹션, 히어로 그라데이션 어두운 쪽 */
  --color-primary-soft:#EFEBFA;   /* 연한 라벤더 배경 */
  --color-accent:#9B85D9;         /* 브라이트 바이올렛 — 강조 배지, 아이콘, 다크 배경 위 CTA */
  --color-accent-dark:#7C63BE;    /* 바이올렛 호버 */
  --color-accent-soft:#F1EDFB;    /* 연한 바이올렛 배경 */
  --color-ink:#241E3D;            /* 헤드라인/본문 최상단 톤, 다크 섹션(footer/CTA) 배경 */
  --color-ink-soft:#362C55;       /* 다크 섹션 위 hover */
  --color-surface-light:#FAF9FC;  /* 연회색(라벤더 틴트) 섹션 배경 */
  --color-surface-white:#FFFFFF;
  --color-text:#211C36;
  --color-muted:#6B6480;
  --color-muted-2:#9B93AC;
  --color-border:#E7E3F2;
  --color-danger:#C4553A;
  --color-danger-soft:#FBEAE5;
  --color-ok:#2F7D5A;
  --color-ok-soft:#E9F5EF;

  /* ── 레거시 별칭(기존 컴포넌트 CSS 호환용) ── */
  --ink:var(--color-ink);
  --ink-2:var(--color-ink-soft);
  --brand:var(--color-primary);
  --brand-dark:var(--color-primary-dark);
  --brand-soft:var(--color-primary-soft);
  --accent:var(--color-accent);
  --accent-soft:var(--color-accent-soft);
  --cream:var(--color-surface-light);
  --paper:var(--color-surface-white);
  --text:var(--color-text);
  --muted:var(--color-muted);
  --muted-2:var(--color-muted-2);
  --border:var(--color-border);
  --danger:var(--color-danger);
  --danger-soft:var(--color-danger-soft);
  --ok:var(--color-ok);
  --ok-soft:var(--color-ok-soft);

  /* ── 그라디언트 ── */
  --gradient-brand:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 140%);
  --gradient-dark:linear-gradient(135deg,var(--color-primary-dark) 0%,var(--color-ink) 100%);

  /* ── 스페이싱(8px 스케일) ── */
  --space-1:4px;
  --space-2:8px;
  --space-3:16px;
  --space-4:24px;
  --space-5:32px;
  --space-6:48px;
  --space-7:64px;
  --space-8:96px;

  /* ── 타이포 ── */
  --font-sans:'Noto Sans KR',-apple-system,'Malgun Gothic',sans-serif;
  --font-base:16px;
  --line-height-tight:1.3;
  --line-height-body:1.7;
  --line-height-heading:1.3;

  /* ── 반경/그림자/트랜지션 ── */
  --radius:16px;
  --radius-sm:10px;
  --radius-lg:26px;
  --radius-card:var(--radius);
  --radius-button:var(--radius-sm);
  --shadow-sm:0 4px 18px rgba(36,30,61,0.07);
  --shadow-md:0 14px 40px rgba(36,30,61,0.12);
  --shadow-lg:0 26px 64px rgba(36,30,61,0.20);
  --shadow-card:var(--shadow-sm);
  --tr:all .28s cubic-bezier(.4,0,.2,1);
  --tr-slow:all .5s cubic-bezier(.4,0,.2,1);

  --header-h:76px;
  /* 모바일 하단 고정바 실측 높이 — 상단패딩10 + 버튼48(모바일 .btn 고정 height) + 하단패딩10 */
  --bottom-bar-height:68px;
}

/* 모션 최소화 환경: 애니메이션/전환을 사실상 제거 */
@media (prefers-reduced-motion: reduce){
  :root{ --tr:none; --tr-slow:none; }
}