/* ============================================================
   monday9.com — 디자인 토큰 v2.0 (느와르 단일 룩)
   @designer / 2026-08-20

   v1(스위스 3안 + 팔레트 3종)은 폐기. 팔레트 토글 없음 — 확정 룩 하나.
   레퍼런스: midwest.asia 구조 + 느와르 재해석
   ============================================================ */

:root {
  /* ---------- 무대: 뉴트럴 다크 + 미세 청기 ----------
     느와르는 색이 아니라 명암의 예술이다. 네이비가 강하면 "밤하늘"이 되어
     코퍼레이트로 읽히므로, 청기는 흔적만 남기고(H220 / S8%) 나머지는 무채색. */
  --bg:          #0C0E12;   /* 기본 무대 */
  --bg-deep:     #07080B;   /* 더 깊은 단(섹션 교대·푸터) */
  --bg-raise:    #14171D;   /* 카드·패널 면 */
  --bg-veil:     rgba(12, 14, 18, 0.72);  /* 사진 위 딤 베일 */

  /* ---------- 활자 ---------- */
  --fg:          #F2F3F5;   /* 순백 대신 아주 살짝 낮춘 백 — 다크에서 순백은 눈을 찌른다 */
  --fg-mute:     #9AA0A8;   /* 보조 (다크 대비 6.4:1) */
  --fg-dim:      #5E646D;   /* 메타·비활성 (3.9:1 — 장식·라벨 전용, 본문 금지) */

  /* ---------- 액센트: 오렌지-레드 (v2.1 — 골드 폐기) ----------
     레퍼런스(Vignelli)의 선명한 주홍. 골드(#C9A227)보다 시각 자극이 훨씬 강해
     "면적 규칙"이 더 엄격해진다(§1 참조). 토큰명은 --gold 계열을 유지해
     구현 교체 비용을 0으로 둔다(값만 교체). */
  --gold:        #FF3B00;   /* 다크 대비 5.41:1 — 텍스트 가능 */
  --gold-bright: #FF5C2E;   /* 호버 (6.28:1) */
  --gold-dim:    rgba(255, 59, 0, 0.14);
  --on-gold:     #0C0E12;   /* 주홍 면 위 텍스트는 반드시 잉크색(5.41:1). 흰 텍스트는 3.57:1로 미달 */

  /* ---------- 룰(선) ---------- */
  --rule:        rgba(242, 243, 245, 0.14);  /* 기본 구분선 — 다크에서 실선은 너무 세다 */
  --rule-strong: rgba(242, 243, 245, 0.32);
  --rule-gold:   var(--gold);
  --container:   92vw;      /* §H-3 최종 — 비율형이라야 네 기준선이 전 폭에서 수렴한다 */
  --rule-hair:   1px;
  --rule-mark:   3px;       /* 라벨 앞 짧은 골드 룰(레퍼런스 시그니처) */

  /* ---------- 느와르 그림자·비네트 (v1의 "그림자 금지" 폐기) ----------
     느와르는 짙은 그림자가 문법이다. 단 UI 장식용 소프트 섀도는 여전히 금지 —
     아래 두 가지는 "빛의 부재"를 만드는 용도로만 쓴다. */
  --noir-shadow:  0 24px 60px rgba(0, 0, 0, 0.6);
  --noir-vignette: radial-gradient(ellipse 120% 90% at 50% 40%, transparent 40%, rgba(0,0,0,0.55) 100%);
  --scrim-hero:   linear-gradient(90deg, rgba(7,8,11,0.55) 0%, rgba(7,8,11,0.43) 55%, rgba(7,8,11,0.15) 100%);  /* v2.2g — @designer 확정: 0.55 유지(최저 5.68:1), 3-stop 비례 축소로 감쇠 방향 유지 */
  --scrim-bottom: linear-gradient(0deg, rgba(7,8,11,0.95) 0%, transparent 60%);

  /* ---------- 이미지 필터 (느와르 그레이딩) ---------- */
  --img-noir:     grayscale(100%) contrast(1.28) brightness(0.82);
  --img-noir-soft: grayscale(100%) contrast(1.12) brightness(0.9);  /* 인물 등 계조 보존 필요 시 */

  /* ---------- 타이포 ---------- */
  --font-display: "Playfair Display", "Bodoni Moda", Didot, "Times New Roman", serif;
  --font-sans:    "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --fw-display:   600;      /* 다크 광학 보정 (v1.6 계승) */

  --fs-hero:    clamp(2.75rem, 7.6vw, 9.3rem);   /* v2.2d 확정 — 1920까지 48~49% 유지, 2560+ 미달 허용 */
  --fs-section: clamp(2rem, 3.6vw, 3.5rem);      /* 섹션 대제목 */
  --fs-card:    clamp(1.125rem, 1.5vw, 1.4rem);  /* 카드 제목 */
  --fs-body:    clamp(0.95rem, 1.05vw, 1.0625rem);
  --fs-small:   0.875rem;
  --fs-label:   0.6875rem;  /* 대문자 라벨 */

  --lh-hero: 1.08;          /* 느와르 헤드라인은 v1(0.86)보다 약간 풀어 우아하게 */
  --lh-tight: 1.2;
  --lh-body: 1.65;
  --track-display: -0.015em;
  --track-label:   0.18em;

  /* ---------- 그리드·간격 ---------- */
  --grid-cols: 12;
  --gutter: 24px;
  --margin: clamp(20px, 4vw, 72px);
  --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 32px;
  --sp-5: 48px; --sp-6: 72px; --sp-7: 112px; --sp-8: 168px;
  --radius: 0px;            /* v2.1 — 전 요소 직각. 필형 버튼 폐기(레퍼런스가 직각 사각형) */

  /* ---------- 모션: 절제된 느와르 ---------- */
  --ease:      cubic-bezier(0.22, 1, 0.36, 1);
  --ease-veil: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast:  200ms;
  --dur:       450ms;       /* 순차 등장 */
  --dur-slow:  900ms;       /* 배경 페이드·베일 */
  --stagger:   80ms;        /* 순차 등장 간격 */
  --parallax:  0.18;        /* 배경 패럴랙스 계수 (JS에서 참조) */

  /* §N 히어로 배경 롤링 — 4컷 32초 주기(전환 간격 8s, 그 앞 2s가 크로스페이드와 겹친다).
     JS도 이 토큰을 읽어 타이머를 잡는다(값이 두 곳에 갈라지지 않게). */
  --hero-hold:      5s;     /* §Q — 전환 간격 단축(8s → 5s). 5컷이면 한 바퀴 25s */
  --hero-fade:      1.6s;   /* §Q — 노출 5s에 페이드 2s면 겹침이 40%라 "섞인 시간"이 더 길어진다. 1.6s = 32% */
  --hero-zoom:      1.08;   /* §Q — 1.06에서 상향. 패럴랙스 1.108과 곱해 총 배율 1.196 */
  --hero-zoom-dur: 6.6s;    /* §N-3 등식 유지: 줌 지속 = 노출 + 페이드. 깨지면 컷마다 도달 배율이 달라진다.
                               6.6s·1.08이면 1.21%/s라 페이드 1.6s 동안 1.94% 커져 등장 순간의 확대가 읽힌다 */
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; --stagger: 0ms; --parallax: 0; }
  /* 줌·롤링 정지 → 첫 컷 고정. JS도 같은 질의로 타이머를 걸지 않는다. */
  :root { --hero-fade: 0ms; --hero-zoom: 1; --hero-zoom-dur: 0ms; }
}