/* Greywood Advisory: brand tokens
Drop this into the site and reference the variables instead of typing
hex codes by hand. Keeps colors consistent everywhere.
Fonts are free on Google Fonts. Add this line inside your HTML :
*/
:root {
/* Colors */
--steel-blue: #2E6DA4; /* action: buttons, links, prices, hover */
--forest-green: #5A8A3C; /* trust: eyebrows, checkmarks, accents */
--steel-grey: #8A9299; /* restraint: secondary text, borders */
--near-black: #0D0D0F; /* main dark background */
--warm-white: #F0F2F4; /* soft light background */
--white: #FFFFFF;
--black: #000000;
/* Fonts */
--font-heading: "Barlow Condensed", sans-serif;
--font-ui: "Barlow Semi Condensed", sans-serif;
--font-body: "Barlow", sans-serif;
}
/* Example usage:
.hero-title {
font-family: var(--font-heading);
font-weight: 800;
text-transform: uppercase;
font-size: clamp(52px, 8vw, 86px);
}
body {
font-family: var(--font-body);
font-weight: 300;
line-height: 1.75;
font-size: 16px;
background: var(--near-black);
}
.button-primary {
background: var(--steel-blue);
color: var(--white);
}
*/