:root {
  /* ===== Colors ===== */
  --c-black:      #0A0A0A;
  --c-white:      #F5F5F0;
  --c-gold:       #C8A96E;
  --c-gray-mid:   #6B6B6B;
  --c-gray-light: #E0DED8;
  --c-bg:         #F5F5F0;

  --c-text:       var(--c-black);
  --c-text-sub:   var(--c-gray-mid);
  --c-border:     var(--c-gray-light);
  --c-accent:     var(--c-gold);

  /* ===== Typography ===== */
  --f-serif:  'Cormorant Garamond', 'Noto Serif JP', serif;
  --f-sans:   'DM Sans', 'Noto Sans JP', sans-serif;

  --fs-hero:   clamp(3rem, 8vw, 7rem);
  --fs-h1:     clamp(2rem, 4vw, 3.5rem);
  --fs-h2:     clamp(1.25rem, 2vw, 1.75rem);
  --fs-body:   1rem;
  --fs-small:  0.875rem;
  --fs-label:  0.75rem;

  --lh-tight:  1.1;
  --lh-base:   1.7;
  --lh-loose:  2.0;

  --ls-tight:  -0.02em;
  --ls-normal:  0.05em;
  --ls-wide:    0.15em;
  --ls-wider:   0.25em;

  /* ===== Spacing ===== */
  --sp-4:   4px;
  --sp-8:   8px;
  --sp-16:  16px;
  --sp-24:  24px;
  --sp-40:  40px;
  --sp-64:  64px;
  --sp-96:  96px;
  --sp-128: 128px;
  --sp-160: 160px;

  /* ===== Animation ===== */
  --ease-out:   cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-inout: cubic-bezier(0.45, 0, 0.55, 1);

  --dur-fast:   0.3s;
  --dur-base:   0.6s;
  --dur-slow:   0.9s;
}