@charset "utf-8";
/* ==========================================================================
   경기아트센터 아카이브 · 시스템 점검(CI 해시화) 안내 — 공통 (토큰 · 리셋 · 유틸)
   웹폰트: Pretendard (HTML <link> 로 CDN 로드)
   ========================================================================== */

/* ---------- 1. 디자인 토큰 (원시값은 여기서만 정의) ---------- */
:root {
  /* 원시 색 */
  --color-white: #ffffff;
  --color-brand-700: #2f1d7c;
  --color-brand-600: #3e26a3;
  --color-orange-700: #e94002;
  --color-gray-990: #1a1a1a;
  --color-gray-950: #232323;
  --color-gray-800: #353840;
  --color-gray-600: #55565f;
  --color-gray-500: #6b6b6b;
  --color-indigo-100: #f0f2f7;
  --color-black-a57: rgba(0, 0, 0, 0.57);
  --color-black-a25: rgba(0, 0, 0, 0.25);
  --color-white-a15: rgba(255, 255, 255, 0.15);

  /* 시맨틱 색 */
  --text-title: var(--color-gray-990);
  --text-strong: var(--color-gray-950);
  --text-body: var(--color-gray-600);
  --text-sub: var(--color-gray-500);
  --text-brand: var(--color-brand-600);
  --text-point: var(--color-orange-700);
  --text-inverse: var(--color-white);
  --bg-page: var(--color-white);
  --bg-soft: var(--color-indigo-100);
  --bg-chip: var(--color-brand-700);
  --bg-dim: var(--color-black-a57);
  --bg-button-dark: var(--color-gray-800);
  --line-on-dark: var(--color-white-a15);

  /* 타이포 */
  --font-base: "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --lh-tight: 1.25;
  --lh-date: 1.3;
  --lh-base: 1.4;
  --ls-title: -0.035em;
  --ls-body: -0.03em;
  --ls-tight: -0.02em;

  /* 반경 · 그림자 */
  --radius-pill: 100px;
  --radius-lg: 16px;
  --radius-md: 12px;
  --shadow-popup: 0 12px 40px 0 var(--color-black-a25);

  /* 간격 스케일 */
  --space-4: 4px;
  --space-5: 5px;
  --space-6: 6px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-32: 32px;
  --space-40: 40px;
}

/* ---------- 2. 리셋 ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-base);
  font-weight: var(--fw-regular);
  line-height: var(--lh-base);
  color: var(--text-strong);
  background: var(--bg-page);
  word-break: keep-all;
  overflow-wrap: break-word;
}

h1, h2, h3, p, dl, dt, dd { margin: 0; }
img { display: block; max-width: 100%; height: auto; border: 0; }
button { font: inherit; color: inherit; margin: 0; cursor: pointer; }
[hidden] { display: none !important; }

/* ---------- 3. 유틸 ---------- */
/* 화면에서 숨기고 스크린리더에는 읽힘 */
.blind {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* 구간 전용 줄바꿈 (기본 숨김 — 각 페이지 CSS의 @media 에서 켬) */
.br-mo,
.br-date { display: none; }

/* 브랜드 강조 글자 (아카이브: 단색 — 그라데이션 없음) */
.text-brand { color: var(--text-brand); }