/*
Troop Design System - variables de marca
Colores: panel real de Impreza. Tipografia: Noto Sans (titulos) +
Open Sans (cuerpo y menu), confirmado en el panel de Typography.
Ambas son Google Fonts - requieren carga explicita, no son fuentes
de sistema. Ver la etiqueta sugerida al final de este archivo.
*/
:root {
--troop-primary: #00bf80;
--troop-secondary: #33bbff;
--troop-heading: #2f2e36;
--troop-text: #232749;
--troop-text-faded: #aab2bd;
--troop-bg: #ffffff;
--troop-bg-alt: #f2f3f5;
--troop-border: #e8e9eb;
--troop-dark-bg: #12141a;
--troop-dark-bg-alt: #1e212b;
--troop-dark-border: #2a2e3d;
--troop-dark-text: #aab2bd;
--troop-dark-link: #d7dde0;
--troop-font-heading: 'Noto Sans', sans-serif;
--troop-font-body: 'Open Sans', sans-serif;
}
body {
color: var(--troop-text);
background-color: var(--troop-bg);
font-family: var(--troop-font-body);
}
h1, h2, h3, h4, h5, h6 {
color: var(--troop-heading);
font-family: var(--troop-font-heading);
}
a {
color: var(--troop-primary);
transition: color 0.2s ease;
}
a:hover {
color: var(--troop-secondary);
}
.troop-section-alt {
background-color: var(--troop-bg-alt);
}
.troop-btn-primary {
background-color: var(--troop-primary);
color: #ffffff;
border: none;
padding: 0.75rem 1.5rem;
border-radius: 4px;
font-family: var(--troop-font-body);
transition: background-color 0.2s ease;
}
.troop-btn-primary:hover {
background-color: var(--troop-secondary);
}
footer, .troop-footer {
background-color: var(--troop-dark-bg);
color: var(--troop-dark-text);
border-color: var(--troop-dark-border);
}
.troop-footer a {
color: var(--troop-dark-link);
}
.troop-footer a:hover {
color: var(--troop-secondary);
}
/*
Carga de las fuentes - agregar en el del header compartido,
antes de este CSS:
*/