@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
    --fuente-titulos: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
    --fuente-cuerpo: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;

    --color-fondo: #0f1013;
    --color-superficie: #16181d;
    --color-superficie-elevada: #1f2229;
    --color-borde: rgba(255, 255, 255, 0.08);
    --color-borde-fuerte: rgba(255, 255, 255, 0.16);

    --color-texto: #f4f5f7;
    --color-texto-secundario: #9ba1ad;
    --color-texto-tenue: #646b7a;

    --color-acento: #d4af37;
    --color-acento-hover: #bfa035;
    --color-acento-tenue: rgba(212, 175, 55, 0.12);

    --color-whatsapp: #25d366;
    --color-whatsapp-hover: #20ba5a;

    --radio-pequeno: 4px;
    --radio-mediano: 8px;
    --radio-grande: 16px;
    --radio-redondo: 9999px;

    --sombra-sutil: 0 4px 20px rgba(0, 0, 0, 0.25);
    --sombra-elevada: 0 12px 40px rgba(0, 0, 0, 0.45);
    --sombra-acento: 0 4px 24px rgba(212, 175, 55, 0.25);

    --transicion-suave: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    --transicion-rapida: all 0.15s ease-out;

    --ancho-maximo-sitio: 1360px;
    --ancho-maximo-lectura: 780px;

    --color-cabecera-fondo: rgba(15, 16, 19, 0.85);
}

[data-tema="mineral_nordico"] {
    --color-fondo: #f4f6f9;
    --color-superficie: #ffffff;
    --color-superficie-elevada: #e8ecf2;
    --color-borde: rgba(15, 23, 42, 0.09);
    --color-borde-fuerte: rgba(15, 23, 42, 0.18);
    --color-texto: #0f172a;
    --color-texto-secundario: #475569;
    --color-texto-tenue: #8190a2;
    --color-acento: #2e5b70;
    --color-acento-hover: #1f4050;
    --color-acento-tenue: rgba(46, 91, 112, 0.12);
    --color-cabecera-fondo: rgba(244, 246, 249, 0.94);
    --sombra-sutil: 0 4px 20px rgba(15, 23, 42, 0.06);
    --sombra-elevada: 0 12px 35px rgba(15, 23, 42, 0.12);
    --sombra-acento: 0 4px 24px rgba(46, 91, 112, 0.22);
}

[data-tema="arena_travertino"] {
    --color-fondo: #fbf9f5;
    --color-superficie: #ffffff;
    --color-superficie-elevada: #f3ede2;
    --color-borde: rgba(145, 115, 80, 0.14);
    --color-borde-fuerte: rgba(145, 115, 80, 0.26);
    --color-texto: #1c1815;
    --color-texto-secundario: #5c534a;
    --color-texto-tenue: #94887d;
    --color-acento: #b87c3a;
    --color-acento-hover: #9c6529;
    --color-acento-tenue: rgba(184, 124, 58, 0.14);
    --color-cabecera-fondo: rgba(251, 249, 245, 0.94);
    --sombra-sutil: 0 4px 20px rgba(90, 70, 50, 0.06);
    --sombra-elevada: 0 12px 35px rgba(90, 70, 50, 0.12);
    --sombra-acento: 0 4px 24px rgba(184, 124, 58, 0.24);
}

[data-tema="calacatta_indigo"] {
    --color-fondo: #f6f8fc;
    --color-superficie: #ffffff;
    --color-superficie-elevada: #edf2f8;
    --color-borde: rgba(30, 58, 100, 0.10);
    --color-borde-fuerte: rgba(30, 58, 100, 0.22);
    --color-texto: #091224;
    --color-texto-secundario: #405169;
    --color-texto-tenue: #7a8ea8;
    --color-acento: #1b5edb;
    --color-acento-hover: #1345a3;
    --color-acento-tenue: rgba(27, 94, 219, 0.12);
    --color-cabecera-fondo: rgba(246, 248, 252, 0.94);
    --sombra-sutil: 0 4px 20px rgba(9, 18, 36, 0.06);
    --sombra-elevada: 0 12px 35px rgba(9, 18, 36, 0.12);
    --sombra-acento: 0 4px 24px rgba(27, 94, 219, 0.22);
}

[data-tema="terracota_siena"] {
    --color-fondo: #130f0e;
    --color-superficie: #1c1715;
    --color-superficie-elevada: #26201d;
    --color-borde: rgba(224, 122, 95, 0.12);
    --color-borde-fuerte: rgba(224, 122, 95, 0.25);
    --color-texto: #f9f6f5;
    --color-texto-secundario: #bfaea8;
    --color-texto-tenue: #7a6e6a;
    --color-acento: #e07a5f;
    --color-acento-hover: #cc674c;
    --color-acento-tenue: rgba(224, 122, 95, 0.15);
    --color-cabecera-fondo: rgba(19, 15, 14, 0.88);
}

[data-tema="oliva_contemporaneo"] {
    --color-fondo: #0f1210;
    --color-superficie: #161c18;
    --color-superficie-elevada: #1f2722;
    --color-borde: rgba(138, 154, 126, 0.12);
    --color-borde-fuerte: rgba(138, 154, 126, 0.25);
    --color-texto: #f4f6f4;
    --color-texto-secundario: #a3aba4;
    --color-texto-tenue: #687169;
    --color-acento: #8a9a7e;
    --color-acento-hover: #738268;
    --color-acento-tenue: rgba(138, 154, 126, 0.15);
    --color-cabecera-fondo: rgba(15, 18, 16, 0.88);
}