/* ChurchOS 랜딩 — 디자인 토큰
   원본: Second Pass 디자인 시스템(핸드오프 _ds/tokens). 프로젝트 폰트 오버라이드 적용:
   제목·UI = Pretendard Variable, 본문 = Gowun Batang, 숫자·라벨 = IBM Plex Mono (핸드오프 README §Typography) */

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");
@import url("https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root {
  /* — base ramps — */
  --ds-ink-1: #171a18; --ds-ink-2: #3a423d; --ds-ink-3: #6b756e; --ds-ink-4: #9aa39c; --ds-ink-5: #c2c9bf;
  --ds-paper-1: #fbfcfa; --ds-paper-2: #edefeb; --ds-paper-3: #e3e7e0; --ds-paper-4: #d3d8ce;
  --ds-pine-1: #dce8e1; --ds-pine-2: #8dbaa3; --ds-pine-3: #2f7d5e; --ds-pine-4: #1f5d46; --ds-pine-5: #123a2b;
  --ds-sand-1: #f7ebcd; --ds-sand-2: #e4b95c; --ds-sand-3: #a97f1c;
  --ds-clay-1: #f6dcd7; --ds-clay-2: #c0342b; --ds-clay-3: #8a231d;
  --ds-slate-1: #dde5f0; --ds-slate-2: #2a5fa8;
  --ds-amber-1: #f6e4cc; --ds-amber-2: #b4630f;
  --ds-ink-a08: rgba(23,26,24,.08); --ds-ink-a12: rgba(23,26,24,.12); --ds-ink-a20: rgba(23,26,24,.2); --ds-ink-a56: rgba(23,26,24,.56);

  /* — semantic aliases — */
  --ds-text-strong: var(--ds-ink-1); --ds-text-body: var(--ds-ink-2); --ds-text-muted: var(--ds-ink-3);
  --ds-text-faint: var(--ds-ink-4); --ds-text-inverse: var(--ds-paper-1); --ds-text-accent: var(--ds-pine-4);
  --ds-text-link: var(--ds-pine-4); --ds-text-link-hover: var(--ds-pine-5);
  --ds-surface-page: var(--ds-paper-2); --ds-surface-card: var(--ds-paper-1); --ds-surface-sunken: var(--ds-paper-3);
  --ds-surface-inverse: var(--ds-ink-1); --ds-surface-accent: var(--ds-pine-4); --ds-surface-accent-tint: var(--ds-pine-1);
  --ds-surface-hover: rgba(23,26,24,.04); --ds-surface-press: rgba(23,26,24,.08);
  --ds-border-hair: var(--ds-paper-4); --ds-border-strong: var(--ds-ink-5); --ds-border-accent: var(--ds-pine-4);
  --ds-focus-ring: var(--ds-pine-4);
  --ds-success-fg: var(--ds-pine-3); --ds-success-bg: var(--ds-pine-1);
  --ds-warning-fg: var(--ds-amber-2); --ds-warning-bg: var(--ds-amber-1);
  --ds-danger-fg: var(--ds-clay-2); --ds-danger-bg: var(--ds-clay-1); --ds-danger-press: var(--ds-clay-3);
  --ds-info-fg: var(--ds-slate-2); --ds-info-bg: var(--ds-slate-1);

  /* — typography (프로젝트 오버라이드) — */
  --ds-font-ui: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --ds-font-prose: "Gowun Batang", "Nanum Myeongjo", serif;
  --ds-font-utility: "IBM Plex Mono", ui-monospace, monospace;
  --ds-size-11: 11px; --ds-size-12: 12px; --ds-size-13: 13px; --ds-size-15: 15px; --ds-size-17: 17px;
  --ds-size-21: 21px; --ds-size-26: 26px; --ds-size-33: 33px; --ds-size-42: 42px; --ds-size-54: 54px;
  --ds-weight-regular: 400; --ds-weight-medium: 500; --ds-weight-semibold: 600; --ds-weight-bold: 700;
  --ds-leading-tight: 1.02; --ds-leading-snug: 1.18; --ds-leading-normal: 1.45; --ds-leading-loose: 1.62;
  --ds-track-display: -0.025em; --ds-track-normal: 0em; --ds-track-eyebrow: 0.14em;
  --ds-type-title: var(--ds-weight-semibold) var(--ds-size-33)/var(--ds-leading-snug) var(--ds-font-ui);
  --ds-type-heading: var(--ds-weight-semibold) var(--ds-size-21)/1.3 var(--ds-font-ui);
  --ds-type-subheading: var(--ds-weight-semibold) var(--ds-size-17)/var(--ds-leading-snug) var(--ds-font-ui);
  --ds-type-ui: var(--ds-weight-medium) var(--ds-size-15)/var(--ds-leading-normal) var(--ds-font-ui);
  --ds-type-ui-sm: var(--ds-weight-medium) var(--ds-size-13)/var(--ds-leading-normal) var(--ds-font-ui);
  --ds-type-prose: var(--ds-weight-regular) var(--ds-size-15)/1.6 var(--ds-font-prose);
  --ds-type-eyebrow: var(--ds-weight-medium) var(--ds-size-11)/1 var(--ds-font-utility);

  /* — spacing / radius / control — */
  --ds-space-1: 2px; --ds-space-2: 4px; --ds-space-3: 6px; --ds-space-4: 8px; --ds-space-5: 12px; --ds-space-6: 16px;
  --ds-space-7: 20px; --ds-space-8: 24px; --ds-space-9: 32px; --ds-space-10: 40px; --ds-space-11: 56px;
  --ds-radius-xs: 4px; --ds-radius-sm: 8px; --ds-radius-md: 10px; --ds-radius-lg: 14px; --ds-radius-pill: 999px;
  --ds-control-h-sm: 28px; --ds-control-h-md: 36px; --ds-control-h-lg: 44px;
  --ds-page-max: 1180px;

  /* — elevation — */
  --ds-shadow-offset: 2px 2px 0 var(--ds-ink-a12);
  --ds-shadow-offset-sm: 1px 1px 0 var(--ds-ink-a12);
  --ds-shadow-raised: 0 1px 1px rgba(23,26,24,.05), 0 4px 12px -6px rgba(23,26,24,.16);
  --ds-shadow-overlay: 0 2px 2px rgba(23,26,24,.04), 0 18px 40px -16px rgba(23,26,24,.28);
  --ds-focus-shadow: 0 0 0 2px var(--ds-paper-1), 0 0 0 4px var(--ds-pine-4);

  /* — motion — */
  --ds-dur-fast: 120ms;
  --ds-dur-base: 180ms;
  --ds-ease-out: cubic-bezier(.2,.7,.3,1);
}

@media (prefers-reduced-motion: reduce) {
  :root { --ds-dur-fast: 0ms; --ds-dur-base: 0ms; }
}
