:root {
  /* Color - Surfaces */
  --bg-0: #0A0A0F;
  --bg-1: #0F0F16;
  --bg-2: #13131A;
  --bg-3: #1A1A23;
  --bg-card: rgba(255, 255, 255, 0.025);
  --bg-card-hover: rgba(255, 255, 255, 0.04);

  /* Color - Accent (logo-derived) */
  --accent: #FF6B1F;
  --accent-2: #FF9558;
  --accent-3: #FFB85B;
  --accent-4: #FFD8A8;
  --accent-deep: #FF4A1C;
  --accent-grad: linear-gradient(135deg, #FF4A1C 0%, #FF6B1F 45%, #FF9558 70%, #FFB85B 100%);

  /* Color - Cool */
  --cool: #7DD3FC;
  --violet: #A78BFA;
  --rose: #FB7185;
  --lime: #A3E635;

  /* Color - Text */
  --fg: #FAFAFA;
  --fg-2: #C9C9D1;
  --fg-3: #8B8B96;
  --fg-4: #5A5A65;

  /* Color - Lines */
  --line: rgba(255, 255, 255, 0.08);
  --line-2: rgba(255, 255, 255, 0.14);

  /* Typography */
  --font-display: "Bricolage Grotesque", "Noto Sans SC", system-ui, sans-serif;
  --font-body: "Bricolage Grotesque", "Noto Sans SC", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;
  --font-cn: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;

  /* Type scale (clamp-based) */
  --t-display-1: clamp(3.5rem, 9vw, 8.5rem);
  --t-display-2: clamp(2.6rem, 6vw, 5.4rem);
  --t-h1: clamp(2.2rem, 4.2vw, 3.6rem);
  --t-h2: clamp(1.8rem, 3vw, 2.6rem);
  --t-h3: clamp(1.4rem, 2vw, 1.8rem);
  --t-body: clamp(1rem, 1.1vw, 1.125rem);
  --t-sm: 0.875rem;
  --t-xs: 0.75rem;

  /* Spacing */
  --gutter: clamp(1.25rem, 3vw, 2.5rem);
  --section-pad: clamp(5rem, 10vw, 9rem);
  --container: 1280px;
  --container-wide: 1440px;

  /* Radius */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-full: 999px;

  /* Easing */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-1: 0.2s;
  --dur-2: 0.4s;
  --dur-3: 0.7s;
  --dur-4: 1.1s;

  /* Z-index */
  --z-base: 1;
  --z-elev: 10;
  --z-nav: 100;
  --z-overlay: 200;
  --z-modal: 300;
}

@media (max-width: 720px) {
  :root {
    --t-display-1: clamp(2.25rem, 11vw, 3.25rem);
    --t-display-2: clamp(1.8rem, 7vw, 2.4rem);
    --t-h1: clamp(1.6rem, 5.5vw, 2.1rem);
    --t-h2: clamp(1.35rem, 4.5vw, 1.7rem);
    --t-h3: clamp(1rem, 3.5vw, 1.15rem);
    --t-body: 0.95rem;
    --section-pad: clamp(3.5rem, 12vw, 5rem);
  }
}
