/* ============================================================
   PROOF. Design Tokens — Single Source of Truth
   ============================================================ */

:root {

  /* ----------------------------------------------------------
     COLOR
     ---------------------------------------------------------- */
  --c-bg:       #0a0a0a;
  --c-ink:      #f4f4f0;
  --c-mute:     #888884;   /* 修正: #6a6a66 → #888884（コントラスト改善）*/
  --c-line:     #1d1d1b;
  --c-line2:    #2a2a26;
  --c-accent:   #e8ff00;

  --c-surface-1: #0d0d0d;
  --c-surface-2: #080808;
  --c-surface-3: #050505;
  --c-nav-bg:    rgba(10, 10, 10, 0.85);

  --c-manifesto-bg:   #f4f4f0;
  --c-manifesto-text: #0a0a0a;
  --c-manifesto-mute: #444444;   /* 修正: #333333 → #444444 */
  --c-manifesto-line: #dadad6;

  /* ----------------------------------------------------------
     TYPOGRAPHY — フォントファミリー
     ---------------------------------------------------------- */
  --font-display: 'Archivo Black', sans-serif;
  --font-mono:    'IBM Plex Mono', monospace;
  --font-body:    'Noto Sans JP', sans-serif;

  /* ----------------------------------------------------------
     TYPOGRAPHY — フォントサイズ
     ---------------------------------------------------------- */
  --text-2xs:  11px;   /* 修正: 10px → 11px */
  --text-xs:   12px;   /* 修正: 11px → 12px */
  --text-sm:   14px;   /* 修正: 13px → 14px */
  --text-base: 16px;
  --text-md:   18px;   /* 修正: 17px → 18px */
  --text-lg:   19px;   /* 修正: 18px → 19px */
  --text-xl:   24px;

  --text-h3:      clamp(18px, 2.5vw, 24px);
  --text-h2:      clamp(28px, 4vw, 48px);
  --text-h2-lg:   clamp(32px, 5vw, 56px);
  --text-h1:      clamp(48px, 9vw, 120px);
  --text-h1-sm:   clamp(36px, 6vw, 72px);
  --text-video:   clamp(48px, 8vw, 96px);
  --text-origin:  clamp(28px, 4vw, 48px);
  --text-hero-sub: clamp(16px, 2vw, 20px);   /* 修正: 15px → 16px */

  /* ----------------------------------------------------------
     TYPOGRAPHY — ウェイト・行間・カーニング
     ---------------------------------------------------------- */
  --weight-normal:  400;
  --weight-medium:  500;
  --weight-bold:    700;
  --weight-heavy:   800;
  --weight-black:   900;

  --leading-tight:   1.0;
  --leading-snug:    1.2;    /* 修正: 1.1 → 1.2 */
  --leading-normal:  1.6;    /* 修正: 1.5 → 1.6 */
  --leading-relaxed: 1.8;    /* 修正: 1.7 → 1.8 */
  --leading-loose:   2.0;    /* 修正: 1.9 → 2.0 */

  --tracking-tight:  -0.05em;
  --tracking-snug:   -0.03em;
  --tracking-normal:  0;
  --tracking-wide:    0.1em;
  --tracking-wider:   0.15em;
  --tracking-widest:  0.2em;

  /* ----------------------------------------------------------
     SPACING
     ---------------------------------------------------------- */
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:   12px;
  --sp-4:   16px;
  --sp-5:   20px;
  --sp-6:   24px;
  --sp-7:   28px;
  --sp-8:   32px;
  --sp-10:  40px;
  --sp-12:  48px;
  --sp-14:  56px;
  --sp-16:  64px;
  --sp-20:  80px;
  --sp-24:  96px;
  --sp-30: 120px;
  --sp-40: 160px;

  /* ----------------------------------------------------------
     LAYOUT
     ---------------------------------------------------------- */
  --max-w:       1280px;
  --pad-x:       32px;
  --section-py:  120px;
  --hero-py:     160px;
  --nav-h:       72px;

  --gap-sm:   var(--sp-4);
  --gap-md:   var(--sp-6);
  --gap-lg:   var(--sp-8);
  --gap-xl:   var(--sp-12);
  --gap-2xl:  var(--sp-20);
  --grid-gap: 1px;

  /* ----------------------------------------------------------
     TRANSITIONS / Z-INDEX / BORDERS / GLOWS
     ---------------------------------------------------------- */
  --ease:        0.2s ease;
  --ease-slow:   0.4s ease;
  --ease-out:    0.3s cubic-bezier(0.16, 1, 0.3, 1);

  --z-base:   1;
  --z-card:   5;
  --z-filter: 50;
  --z-nav:    100;
  --z-modal:  200;

  --border:        1px solid var(--c-line);
  --border2:       1px solid var(--c-line2);
  --border-accent: 1px solid var(--c-accent);

  --glow-hero:   radial-gradient(circle at 80% 50%, rgba(232,255,0,0.04), transparent 70%);
  --glow-center: radial-gradient(ellipse at 50% 50%, rgba(232,255,0,0.05), transparent 60%);
  --glow-left:   radial-gradient(ellipse at 30% 50%, rgba(232,255,0,0.04), transparent 70%);
  --glow-card:   radial-gradient(ellipse at center, rgba(232,255,0,0.05), transparent 70%);
}

/* モバイル専用上書き */
@media (max-width: 719px) {
  :root {
    --pad-x:      20px;
    --section-py: 80px;
    --hero-py:    120px;
    --gap-2xl:    var(--sp-12);
  }
}
