/* ============================================================
   Design Tokens — 全LPページ共通デザイントークン
   .dev/common/design-tokens.css と同一内容を維持すること
   ============================================================ */

:root {

  /* ── Layout ── */
  --um-section-max-width: 1100px;
  --um-section-padding: 80px 0;
  --um-section-inner-padding: 0 40px;

  /* ── Typography ── */
  --um-hero-title: 3.2rem;
  --um-hero-title-lh: 1.45;
  --um-hero-desc: 1.15rem;
  --um-section-title: 2rem;
  --um-section-title-ja: 1.15rem;
  --um-section-num: 0.88rem;
  --um-section-lead: 1.05rem;
  --um-h3: 1.15rem;
  --um-body: 0.95rem;
  --um-small: 0.88rem;

  /* ── Buttons ── */
  --um-btn-padding: 18px 56px;
  --um-btn-font: 1.05rem;
  --um-btn-radius: 60px;

  /* ── Cards ── */
  --um-card-padding: 32px 28px;
  --um-card-radius: 12px;

  /* ── Colors ── */
  --um-text: #1a1a1a;
  --um-text-secondary: #444;
  --um-text-tertiary: #666;
  --um-bg: #fff;
  --um-bg-alt: #f5f5f5;
  --um-bg-dark: #1a1a1a;

  /* ── Hero ── */
  --um-hero-padding: 120px 0 100px;
  --um-hero-min-height: 50vh;
}

/* ── Tablet ── */
@media (max-width: 768px) {
  :root {
    --um-hero-title: 2.2rem;
    --um-section-title: 1.6rem;
    --um-hero-padding: 80px 0 60px;
    --um-hero-min-height: auto;
    --um-section-padding: 60px 0;
    --um-section-inner-padding: 0 20px;
    --um-card-padding: 24px 20px;
    --um-btn-padding: 16px 40px;
  }
}

/* ── Mobile ── */
@media (max-width: 480px) {
  :root {
    --um-hero-title: 1.8rem;
    --um-section-title: 1.4rem;
    --um-section-inner-padding: 0 16px;
  }
}