@font-face { font-family: altehaasgrotesk; font-weight: 400; font-style: normal; src: url("type/AlteHaasGroteskRegular.woff") format("woff"), url("type/AlteHaasGroteskRegular.ttf") format("ttf"); } @font-face { font-family: altehaasgrotesk; font-weight: 600; font-style: oblique; src: url("type/AlteHaasGroteskBold.woff") format("woff"), url("type/AlteHaasGroteskBold.ttf") format("ttf"); } :root { --base-type: altehaasgrotesk, helvetica, arial, sans-serif; --mono-type: "Lucida Console", monaco, monospace; } h1, h2, h3 { color: var(--secondary); } h1 { font-size: 2.5em; font-weight: 700; } h2 { font-size: 1.8em; font-weight: 600; } h3 { font-size: 1.2em; font-weight: 500; } main > article > h1 { color: var(--primary); }