/* =====================================================================
   디자인 기본값 (TOKENS)
   색 · 글꼴 · 폭을 여기서 바꾸면 페이지 전체에 반영됩니다.
   예) 브랜드 파랑을 바꾸려면 --color-blue 값만 고치세요.
   ===================================================================== */

/* 학교 글꼴 (Pretendard 가변 글꼴, 쓰는 글자만 남긴 파일) */
@font-face {
  font-family: SchoolPretendard;
  src: url("../fonts/SchoolPretendard.woff2") format("woff2");
  font-weight: 45 920;
  font-display: swap;
}

:root {
  /* ---- 글꼴 ---- */
  --font-sans: SchoolPretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  --font-heading: var(--font-sans);  /* 큰 제목 글꼴. 제목만 다른 글꼴로 바꾸고 싶으면 여기 */

  /* ---- 폭 · 좌우 여백 ---- */
  --content-width: 1104px;  /* 본문 기준선: 모든 섹션 글·카드가 이 폭 안에 맞춰짐 */
  --gutter-desktop: 48px;   /* 섹션 안쪽 좌우 여백 (PC) */
  --gutter-tablet: 32px;    /* 태블릿 (폭 1050px 이하) */
  --gutter-mobile: 24px;    /* 모바일 (폭 760px 이하) */

  /* ---- 섹션 위아래 간격 (style.css 에서 섹션마다 골라 씀) ---- */
  --space-40: 40px;
  --space-48: 48px;
  --space-56: 56px;
  --space-64: 64px;
  --space-72: 72px;
  --space-80: 80px;
  --space-88: 88px;
  --space-95: 95px;
  --space-96: 96px;
  --space-104: 104px;
  --space-112: 112px;
  --space-128: 128px;

  /* ---- 색 ---- */
  --color-ink: #111827;  /* 기본 글자색 (거의 검정) */
  --color-navy: #122940;  /* 남색 글자 (새 섹션 제목) */
  --color-blue: #2563eb;  /* 브랜드 파랑 (버튼 · 강조) */
  --color-blue-dark: #1d4ed8;  /* 진한 파랑 */
  --color-blue-soft: #e8eefb;  /* 사진 자리 연한 파랑 */
  --color-gray-900: #1f2937;
  --color-gray-700: #374151;
  --color-gray-600: #4b5563;
  --color-gray-500: #6b7280;  /* 보조 글자 */
  --color-gray-400: #9ca3af;
  --color-gray-300: #d1d5db;
  --color-gray-200: #e5e7eb;  /* 옅은 선 */
  --color-gray-100: #f3f4f6;
  --color-gray-50: #f9fafb;
  --color-line-soft: #dde3ea;  /* 카드 테두리 */
  --color-text-soft: #5b6b7c;  /* 카드 본문 글자 */
  --color-text-muted: #7a8896;  /* 작은 안내 글자 */
  --color-text-body: #4a5a6c;  /* 섹션 소개 글자 */
  --color-bg-soft: #f5f7fa;  /* 연회색 배경 */
  --color-dark: #0a1224;  /* 히어로 · 성과 섹션 어두운 배경 */
  --color-white: #ffffff;

  /* ---- 원래 디자인에서 쓰던 이름 (여러 곳에서 var(--ink) 처럼 씀) ---- */
  --ink: var(--color-ink);
  --navy: var(--color-ink);
  --blue: var(--color-blue);
  --line: var(--color-gray-200);
  --muted: var(--color-gray-600);
  --surface: #f8fafc;
  --white: var(--color-white);
  --subtle: var(--color-gray-500);
}