:root {
  
  --ce2-container: 1232px;
  --ce2-gutter: 344px;
  --ce2-hero-inset: 240px;
  --ce2-bar-inset: 56px;

  /* ── 색 ─────────────────────────────────────────────────────
   * 뿌리색은 #0a1e30 하나다 — 제목·다크 배경·푸터 글자·상담바 배경이 전부
   * 이 색의 알파 변형이라 단일 토큰 + 알파로 접힌다. */
  --ce2-ink: #0a1e30;          /* 제목·다크면 바탕 */
  --ce2-ink-rgb: 10, 30, 48;   /* 알파 변형용 */
  --ce2-ink-strong: #010f1c;   /* 대제목(h2) */
  --ce2-body: #4a6680;         /* 본문 */
  --ce2-muted: #7c8fa3;        /* 캡션 */

  
  --ce2-accent: #134879;       /* 강조·eyebrow·구분 */
  --ce2-accent-cta: #1f5d97;   /* 상담·예약 주버튼 */
  --ce2-accent-light: #328fd6; /* 불릿·탭 인디케이터 */

  --ce2-line: #e8ebee;         /* 카드 테두리 */
  --ce2-line-strong: #c7d0d9;  /* 구분선·비활성 */

  --ce2-paper: #ffffff;
  --ce2-paper-tint: #f4f8fc;   /* 섹션 교대 배경 */
  --ce2-paper-warm: #f7f8f8;   /* FAQ 카드 */
  --ce2-footer-bg: #bbc8d4;

  
  --ce2-font: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont,
    system-ui, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --ce2-w-light: 300;
  --ce2-w-regular: 400;
  --ce2-w-medium: 500;
  --ce2-w-semibold: 600;
  --ce2-w-bold: 700;

  
  --ce2-hero: 51px;      /* 히어로 제목 — 시안 유일값 */
  
  --ce2-hero-lh: 72px;
  --ce2-hero-ls: -1.8px;


  --ce2-h2: 34px;
  --ce2-h2-lh: 48px;      
  --ce2-h2-ls: -1px;

  --ce2-h3: 21px;
  --ce2-h3-lh: 31px;
  --ce2-h3-ls: -0.2px;

  --ce2-lead: 18px;      /* 리드문 — 시안 16.3·18.1·19.1 의 중앙값 */
  --ce2-lead-lh: 31px;

  --ce2-text: 16px;      /* 본문 — 시안 최다값 */
  --ce2-text-lh: 27px;

  --ce2-small: 14px;     /* 캡션·푸터 소글씨 */
  --ce2-small-lh: 24px;

  
  --ce2-eyebrow: 13px;
  --ce2-eyebrow-lh: 16px;
  --ce2-eyebrow-ls: 1.5px;

  /* ── 간격 ───────────────────────────────────────────────────
   * 시안 간격은 4의 배수로 떨어진다(4·8·12·16·20·24·30·36·46).
   * 20 이 압도적으로 많아 기본 리듬으로 둔다. */
  --ce2-s1: 4px;
  --ce2-s2: 8px;
  --ce2-s3: 12px;
  --ce2-s4: 16px;
  --ce2-s5: 20px;   /* 기본 리듬 — 카드 간격·요소 간격 */
  --ce2-s6: 24px;
  --ce2-s7: 32px;
  --ce2-s8: 48px;
  --ce2-s9: 64px;

  
  --ce2-section-pad: 130px;

  
  --ce2-radius: 0;
  --ce2-radius-img: 8px;
  --ce2-radius-chip: 4px;
  --ce2-radius-pill: 999px;

  
  --ce2-btn-h: 52px;
  --ce2-btn-text: 16px;
  --ce2-btn-ls: 0.3px;
  --ce2-btn-pad-x: 28px;

  /* ── 테두리 ─────────────────────────────────────────────────*/
  --ce2-border: 1px solid var(--ce2-line);
  --ce2-border-strong: 1px solid var(--ce2-line-strong);
}


@media (max-width: 1320px) {
  :root {
    --ce2-gutter: 40px;
    --ce2-hero-inset: 40px;
    --ce2-bar-inset: 20px;
  }
}
@media (max-width: 768px) {
  :root {
    --ce2-hero: 32px;
    --ce2-hero-lh: 42px;
    --ce2-h2: 26px;
    --ce2-h2-lh: 35px;
    --ce2-h3: 19px;
    --ce2-h3-lh: 28px;
    --ce2-lead: 16px;
    --ce2-lead-lh: 27px;
    --ce2-section-pad: 72px;
    --ce2-gutter: 20px;
    --ce2-hero-inset: 20px;
  }
}