body {font-family: "Clash Display"; font-size: 1.7rem; font-weight: 500; color: var(--brand-color-beige-d-2); letter-spacing: 0.7px} h1, h2, h3, h4, h5, h6 {font-family: "Playfair Display"; color: var(--brand-color-navy)} h1 {font-size: 5.4rem} h2 {font-size: 3.2rem} h3 {font-size: 3rem} h4 {font-size: 3rem; font-family: "Clash Display"; font-weight: 500} h5 {font-family: "Clash Display"; font-weight: 500}:where(:root) .bricks-color-primary {color: var(--brand-color-beige)}:where(:root) .bricks-background-primary {background-color: var(--brand-color-beige)}:where(:root) .bricks-color-secondary {color: var(--brand-color-navy)}:where(:root) .bricks-background-secondary {background-color: var(--brand-color-navy)}:where(:root) .bricks-color-warning {color: var(--brand-color-burgundy)}:where(:root) .bricks-background-warning {background-color: var(--brand-color-burgundy)}:where(:root) .bricks-color-success {color: var(--brand-color-green)}:where(:root) .bricks-background-success {background-color: var(--brand-color-green)}:where(:root) * {border-color: var(--bricks-color-grey-300)} .bricks-button:not([class*="bricks-background-"]):not([class*="bricks-color-"]):not(.outline) {background-color: var(--brand-color-navy)} .bricks-button {border-radius: 100px} .bricks-button.outline {border-color: var(--brand-color-beige); border-radius: 100px} :root .bricks-button[class*="secondary"]:not(.outline) {background-color: var(--brand-color-lightblue)} :root .bricks-button[class*="secondary"].outline {border-color: var(--brand-color-lightblue)}@media (max-width: 991px) { h1 {font-size: 4rem} h2 {font-size: 2.8rem} h3 {font-size: 3rem; font-family: "Playfair Display"} h4 {font-family: "Playfair Display"; font-size: 2.6rem}}@media (max-width: 767px) { h4 {font-size: 2rem}}@media (max-width: 478px) { h1 {font-size: 3rem} h2 {font-size: 2.8rem}}