:root {
  /* Colors */
  --oco-bg-1: #090706;
  --oco-bg-2: #140E0B;
  --oco-bg-3: #2A1B13;

  --oco-card: #15100D;
  --oco-card-alpha: rgba(21, 16, 13, 0.86);

  --oco-text: #C9BEB4;
  --oco-text-strong: #F6F1EA;
  --oco-muted: #9F8F82;

  --oco-border: #8A7F77;
  --oco-accent: #FFBA0A;
  --oco-accent-dark: #D89E04;
  --oco-accent-soft: rgba(255, 186, 10, 0.05);

  /* Typography */
  --oco-font-heading: "JetBrains Mono", monospace;
  --oco-font-body: "Raleway", system-ui, sans-serif;

  --font-size-h1: clamp(1.875rem, 2.45vw, 2.75rem);
  --font-size-h2: clamp(1.625rem, 2.15vw, 2.375rem);
  --font-size-h3: clamp(1.25rem, 1.45vw, 1.75rem);
  --font-size-h4: clamp(1.0625rem, 1.15vw, 1.375rem);
  --font-size-p: clamp(0.875rem, 0.9vw, 1rem);

  --line-height-heading: 1.08;
  --line-height-tight: 1;
  --line-height-body: 1.45;

  /* Layout */
  --oco-container: 1400px;
  --oco-section-x: clamp(24px, 5vw, 100px);
  --oco-section-y: clamp(64px, 6vw, 100px);
  --oco-header-h: 74px;
  --oco-header-h-mobile: 66px;

  /* Radius */
  --oco-radius-card: 15px;
  --oco-radius-sm: 0.375rem;

  /* Shadows */
  --oco-shadow-plan:
    0 0 0 1px rgba(255, 186, 10, 0.42),
    0 0 28px rgba(255, 186, 10, 0.16),
    inset 0 0 18px rgba(255, 186, 10, 0.04);
}