:root {
    --color-obsidiana: #16191B;
  --color-obsidiana-profunda: #0E1011;
  --color-superficie: #22262A;
  --color-superficie-2: #2E3338;
  --color-cantera: #E3D6C4;
  --color-cantera-clara: #F3EEE6;
  --color-laton: #B08D57;
  --color-laton-profundo: #8A6A36;
  --color-piedra: #9A9286;
  --color-texto-papel: #6E675D; 
    --bg: var(--color-obsidiana);
  --surface: var(--color-superficie);
  --text: var(--color-cantera);
  --text-muted: var(--color-piedra);
  --accent: var(--color-laton);
  --on-accent: var(--color-obsidiana);

    --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 40px;
  --space-5: 64px;
  --space-6: 120px;
  --radius: 0;

    --font-serif: "Libre Baskerville", "Libre Baskerville respaldo", Georgia, serif;
  --font-sans: "Montserrat", "Montserrat respaldo", Arial, sans-serif;

    --text-16: 1rem;
  --text-18: 1.125rem;
  --text-20: 1.25rem;
  --text-22: 1.375rem;
  --text-24: 1.5rem;
  --text-28: 1.75rem;
  --text-34: 2.125rem;
  --text-40: 2.5rem;
  --text-48: 3rem;
  --text-56: 3.5rem;
  --text-64: 4rem;
  --text-72: 4.5rem;
  --text-96: 6rem;
  --text-120: 7.5rem;
  --espaciado-mayusculas: 0.2em;

    --motion-fast: 200ms;
  --motion-base: 300ms;
  --motion-slow: 500ms;
  --ease-out: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-in: cubic-bezier(0.5, 0, 0.75, 0);

    --relieve-cara: #1C2023;
  --relieve-luz: #2F353A;
  --relieve-sombra: #0A0C0D;
  --luz-central: #262B30;
  --linea-sobre-cantera: #CDBFA9;

    --lampara-piedra: 18 20 24;
    --lampara-papel: 255 255 255;
  --lampara-radio: 420px;

    --velo: rgb(22 25 27 / 0.6);

    --margen: var(--space-6);
  --encabezado-alto: 88px;
}

@media (max-width: 767px) {
  :root {
    --margen: var(--space-3);
    --encabezado-alto: 80px;
  }
}