:root {
  --primary-100: #000000; /* Negro profundo, predominante en Farfetch */
  --primary-200: #1a1a1a; /* Gris oscuro, para elementos secundarios */
  --primary-300: #333333; /* Gris más claro, usado en algunos textos y detalles */
  --accent-100: #d0a85c; /* Dorado suave, que a veces aparece en detalles */
  --accent-200: #b88b4a; /* Versión más oscura del dorado */
  --text-100: #000000; /* Blanco puro, para contraste con fondos oscuros */
  --text-200: #474e50;
  --text-300: #7c898d; /* Gris claro, para textos secundarios */
  --bg-100: #ffffff; /* Fondo blanco predominante */
  --bg-200: #f5f5f5; /* Gris muy claro, para secciones diferenciadas */
  --bg-300: #e0e0e0; /* Gris medio, usado en bordes o detalles */
  --border-100: #d9d9d9;
  --border-200: #b7b7b7;
  --success-100: #1f7a4d;
  --danger-100: #a83232;
  --font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Oswald', var(--font-sans);
  --font-brand: 'Anton', var(--font-display);
  --font-ui: 'Expletus Sans', var(--font-sans);
  --space-page: clamp(1rem, 4vw, 3rem);
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --shadow-soft: 0 14px 40px rgba(0, 0, 0, .08);
}
@font-face {
    font-family: "Font Awesome 6 Free";
    font-display: swap;
    src: local("Font Awesome 6 Free");
}

@font-face {
    font-family: "Font Awesome 6 Brands";
    font-display: swap;
    src: local("Font Awesome 6 Brands");
}

@font-face {
    font-family: "Font Awesome 6 Pro";
    font-display: swap;
    src: local("Font Awesome 6 Pro");
}