/* ============================================================
   디자인 토큰 — 견적서·제안서 디자인표준 v2 웹 이식
   브랜드 액센트 교체: --accent 한 곳 + body.theme-* 클래스
   ============================================================ */
:root {
  /* 모노크롬 */
  --ink-dark: #111827;
  --ink: #1F2937;
  /* 보조 텍스트 색. #6B7280 은 순백에서 4.83:1(여유 7%)이라 옅은 틴트(#F3F4F6·#E9F9F0)만
     깔려도 곧바로 AA 를 놓친다 — 2026-08-19에 한 단계 어둡게 내렸다(백색 5.38:1, 틴트 4.9:1). */
  --mid: #636B78;
  --light: #9CA3AF;
  --border: #E5E7EB;
  --bg-header: #F9FAFB;
  --bg-section: #F3F4F6;
  --bg-card: #F8F9FA;
  --white: #FFFFFF;

  /* 플랫폼 액센트 */
  --naver: #03C75A;   --naver-tint: #E9F9F0;
  --google: #1A73E8;  --google-tint: #F0F6FF;
  --insta: #E4405F;   --insta-tint: #FDEEF1;
  --xhs: #FF2442;     --xhs-tint: #FFECEF;
  --daangn: #FF6F0F;  --daangn-tint: #FFF3E9;
  --sns: #7C3AED;     --sns-tint: #F3EEFF;

  /* 브랜드 기본 액센트 (홈·가격·문의) */
  --accent: #111827;
  --accent-tint: #F3F4F6;

  /* 타이포 스케일 */
  --fs-h1: clamp(1.7rem, 4.5vw, 2.6rem);
  --fs-h2: clamp(1.3rem, 3vw, 1.75rem);
  --fs-h3: 1.125rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-tiny: 0.78rem;

  /* 간격·형태 */
  --sp-section: clamp(56px, 9vw, 96px);
  --radius-card: 20px;
  --radius-pill: 999px;
  --maxw: 1080px;

  /* 그림자 — 값은 2026-08-03 증거 이미지에 하드코딩돼 있던 것을 승격한 것.
     새 값을 발명하지 말고 이 4단 안에서 고를 것. */
  --shadow-s: 0 1px 3px rgba(17, 24, 39, .06);
  --shadow-m: 0 6px 20px rgba(17, 24, 39, .07);
  --shadow-l: 0 8px 28px rgba(17, 24, 39, .08);
  --shadow-hover: 0 10px 30px rgba(17, 24, 39, .12);

  /* 모션 — --ease 는 2026-07 스크롤 리빌이 쓰던 곡선을 승격한 하우스 이징이다.
     새 모션은 전부 이 곡선 계열을 써야 "한 사람이 만든 사이트"로 읽힌다. */
  --ease: cubic-bezier(.2, .6, .2, 1);
  --ease-pop: cubic-bezier(.34, 1.56, .64, 1);   /* 종점 강조용 오버슛 */
  --dur-xs: .18s;
  --dur-s: .3s;
  --dur-m: .5s;
  --dur-l: .7s;
}

/* 페이지별 플랫폼 테마 — 컴포넌트는 var(--accent)만 참조 */
body.theme-naver  { --accent: var(--naver);  --accent-tint: var(--naver-tint); }
body.theme-google { --accent: var(--google); --accent-tint: var(--google-tint); }
body.theme-insta  { --accent: var(--insta);  --accent-tint: var(--insta-tint); }
body.theme-china  { --accent: var(--xhs);    --accent-tint: var(--xhs-tint); }
body.theme-daangn { --accent: var(--daangn); --accent-tint: var(--daangn-tint); }
body.theme-sns    { --accent: var(--sns);    --accent-tint: var(--sns-tint); }