:root {
  /* =========================================================
     CORES PRINCIPAIS
  ========================================================== */

  --color-black: #050607;
  --color-page: #07090a;
  --color-header: #06080a;

  --color-surface: #0c0f12;
  --color-surface-2: #111519;
  --color-surface-3: #171b1f;

  --color-white: #f5f4ef;
  --color-text: #ecebe7;
  --color-text-soft: #c9c8c3;
  --color-text-muted: #92928f;

  --color-gold: #d5a248;
  --color-gold-light: #e5b861;
  --color-gold-dark: #9b6b29;
  --color-gold-deep: #70491c;

  --color-danger: #d9493f;
  --color-success: #54b783;

  /* =========================================================
     BORDAS
  ========================================================== */

  --border-dark: rgba(255, 255, 255, 0.08);
  --border-light: rgba(255, 255, 255, 0.14);
  --border-gold: rgba(213, 162, 72, 0.28);
  --border-gold-strong: rgba(213, 162, 72, 0.55);

  /* =========================================================
     SOMBRAS
  ========================================================== */

  --shadow-small:
    0 4px 12px rgba(0, 0, 0, 0.28);

  --shadow-medium:
    0 10px 30px rgba(0, 0, 0, 0.42);

  --shadow-large:
    0 18px 55px rgba(0, 0, 0, 0.58);

  --shadow-gold:
    0 8px 28px rgba(213, 162, 72, 0.18);

  /* =========================================================
     TIPOGRAFIA
  ========================================================== */

  --font-primary:
    "Inter",
    "Segoe UI",
    Arial,
    sans-serif;

  --font-display:
    "Barlow Condensed",
    "Arial Narrow",
    sans-serif;

  --font-size-xs: 0.72rem;
  --font-size-sm: 0.82rem;
  --font-size-md: 0.92rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.12rem;
  --font-size-xl: 1.4rem;
  --font-size-2xl: 1.8rem;
  --font-size-3xl: 2.6rem;
  --font-size-hero: clamp(3.5rem, 5vw, 5.8rem);

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-black: 800;

  /* =========================================================
     LAYOUT
  ========================================================== */

  --desktop-container-width: 1460px;
  --desktop-container-padding: 34px;

  --header-top-height: 88px;
  --header-navigation-height: 54px;

  --hero-min-height: 440px;
  --hero-sidebar-width: 320px;

  --content-sidebar-width: 320px;
  --content-gap: 24px;

  /* =========================================================
     ESPAÇAMENTOS
  ========================================================== */

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 30px;
  --space-8: 36px;
  --space-9: 44px;
  --space-10: 56px;

  /* =========================================================
     RAIO DAS BORDAS
  ========================================================== */

  --radius-small: 5px;
  --radius-medium: 8px;
  --radius-large: 12px;
  --radius-pill: 999px;

  /* =========================================================
     TRANSIÇÕES
  ========================================================== */

  --transition-fast: 160ms ease;
  --transition-normal: 260ms ease;
  --transition-slow: 420ms ease;

  /* =========================================================
     CAMADAS
  ========================================================== */

  --z-background: 0;
  --z-content: 2;
  --z-overlay: 3;
  --z-header: 100;
  --z-dropdown: 200;
  --z-modal: 500;
}