/* ==========================================================================
   오버톤 사운드랩 — 디자인 토큰 (2026-10-06 재작업)
   컨셉 한 문장: 전시 기획자가 파형·설치 사진·측정 수치 조각이 겹친 첫 화면에서
   "이 연구소는 잔향을 재고 스피커를 놓는 곳"임을 읽고 작업 네 건을 확인한다.
   레퍼런스: R1 boxoftoysaudio.com(실측 1440: 상단 내비 없음, 하단 도크만. 푸터 워드마크
            1400×270px 전폭, 그 위 20px 열 행 + 1px 괘선) — 내비 없음·워드마크 푸터
            R2 davidrudnick.org(실측 1440: 검정 바탕, 452×452 큰 조각 2 + 287px 폭 작은 조각
            여러 장이 격자에서 벗어나 크기 차를 두고 놓임) — 어두운 콜라주의 조각 크기 차
            R3 carstennicolai.de(기존: 아카이브 역연도 목록) — 작업 목록의 순서
   하지 않은 것: 스크롤 리빌, 모노 서체, 앰버, 상단 바, 재질 필터, 사진 반복.
   ========================================================================== */

:root {
  /* 서체 — 표제 Black Han Sans(OFL, Google Fonts), 본문 Gothic A1(OFL, Google Fonts).
     숫자는 모노 대신 본문 서체 + tabular-nums 로 정렬한다(typography §6-5). */
  --font-display: "Black Han Sans", "Gothic A1", sans-serif;
  --font-body: "Gothic A1", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --weight-body: 400;
  --weight-strong: 700;

  /* 타입 스케일 — 본문 16px, 보조 13px 하한(한글 조판 정본) */
  --step--1: 0.8125rem;
  --step-0: 1rem;
  --step-1: 1.125rem;
  --step-2: 1.375rem;
  --step-3: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem);                /* 섹션 제목 */
  --step-hero: clamp(1.6rem, 0.9rem + 4.9vw, 5.75rem);            /* 두 줄 문장 표제: 320=26px, 390=33px, 1440=85px */
  --step-manifesto: clamp(2.25rem, 1.25rem + 4.4vw, 5.5rem);      /* 작업 방식 한 문장 */
  --step-wordmark: clamp(2.5rem, 14.2vw, 13.5rem);                /* 푸터 워드마크(폭 6.05em): 390=55px, 1440=204px, 1920 이상 216px */
  --step-figure: clamp(1.75rem, 1.2rem + 1.8vw, 2.75rem);          /* 콜라주 수치 조각 */

  --leading-tight: 1.15;
  --leading-heading: 1.3;
  --leading-body: 1.7;
  --measure: 36em;

  /* 색 — 어두운 스튜디오 바닥(#12100e 유지)과 345° 로즈 신호 */
  --surface: #12100e;
  --surface-rgb: 18 16 14;
  --surface-raised: #1c1816;
  --surface-sunken: #0c0b0a;
  --ink: #f4eee7;              /* 대비 17.6:1 */
  --ink-muted: #bcb1a5;        /* 대비 9.0:1 */
  --ink-faint: #93897c;        /* 대비 5.5:1 — 13px 보조 글자의 하한 */
  --line: #3a332d;
  --line-strong: #55493f;
  --accent: #ef587e;           /* 345° 로즈(LCH 10°). #12100e 위 5.8:1 — 연도·선·파형·수치 면 */
  --accent-rgb: 239 88 126;
  --accent-deep: #8f2a47;      /* 듀오톤 중간 톤 */
  --accent-on: #12100e;        /* 로즈 면 위 글자 */

  /* 간격 */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.5rem;
  --space-6: 4rem;
  --space-7: 6rem;
  --space-8: clamp(4.5rem, 3rem + 6vw, 8.5rem);

  --radius: 0;                 /* 조각은 종이처럼 각지다 — 모서리 없음 */
  --border: 1px;

  --container: 84rem;
  --pad-inline: clamp(1.25rem, 0.75rem + 2.4vw, 3.5rem);

  /* 모션 — 캔버스(요청 애니메이션)와 마퀴만. 등장 리빌은 없다 */
  --dur-quick: 160ms;
  --ease-soft: cubic-bezier(0.25, 1, 0.35, 1);
  --marquee-duration: 48s;
}