/* FONTS.CSS */


/* @FONT-FACE */


/* @font-face {
    font-family: 'Jost';
    src: url('/wp-content/themes/fyrestarter-theme/assets/fonts/Jost/Jost-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('/wp-content/themes/fyrestarter-theme/assets/fonts/Inter/Inter-VariableFont_slnt,wght.ttf') format('truetype-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('/wp-content/themes/fyrestarter-theme/assets/fonts/Montserrat/Montserrat-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work Sans';
    src: url('/wp-content/themes/fyrestarter-theme/assets/fonts/Work_Sans/WorkSans-VariableFont_wght.ttf') format('truetype-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
} */


.work-sans-<uniquifier> {
  font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.jost-<uniquifier> {
  font-family: "Jost", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.montserrat-<uniquifier> {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.inter-<uniquifier> {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

/* FONT FAMILIES */

.body-font {
	font-family: var(--font-family-body);
}
.alt-font,
.cta-font {
	font-family: var(--font-family-alt);
}
.mont-font,
.header-font,
.display-font {
	font-family: var(--font-family-header);
}
.inter-font,
.accent-font {
	font-family: var(--font-family-accent);
}


/* BODY */

body#fyre {
    color: var(--wht-color);
    font-family: var(--font-family-body);
    font-size: var(--body);
    font-weight: var(--font-body-weight);
    line-height: var(--body-line-height);
    font-style: normal;
    word-wrap: break-word;
}

/* COLORS */

.wht-txt,
.wht-txt p,
.wht-txt *:not(a) {
    color: var(--wht-color);
}
.ylw-txt {
    color: var(--ylw-color) !important;
}
.blk-txt {
    color: var(--blk-color) !important;
}
.lt-gry-txt {
    color: #cdcdcd;
}
main a.wht-txt:hover, 
main a:not(.btn):hover {
    color: var(--ylw-color);
}
main p a:not(.btn):not(.wht-txt) {
    color: var(--ylw-color);
}
main a.ylw-txt:not(.btn):hover {
    opacity: 0.7;
}

/* FONT SIZES */

.small>*,
p.small,
.small p {
    font-size: var(--small);
}

@media(max-width: 767px) {
    .lrg-p>p,
    .lrg-p {
        font-size: 20px;
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: var(--heading-line-height) !important;
    font-weight: var(--font-header-weight) !important;
}
h1,
h2 {
    font-family: var(--font-family-header);
    margin-top: 0;
}
h1,
.h1 {
    font-size: var(--h1);
}
h2,
.h2 {
    font-size: var(--h2);
    font-family: var(--font-family-header);
}
h3,
.h3 {
    font-size: var(--h3);
	font-family: var(--font-family-header);
}
h4,
.h4 {
    font-size: var(--h4);
	font-family: var(--font-family-header);
    font-weight: 400;
}
h5,
.h5 {
    font-size: var(--h5);
	font-family: var(--font-family-body);
}
h6,
.h6 {
    font-size: var(--h6);
}
.section-header {
    font-size: var(--section-header);
}
.section-subheader {
    font-size: var(--section-subheader);
}
.sm-h1,
.lrg-h2 {
    font-size: var(--sm-h1);
}
.header {
    font-family: var(--font-family-header);
}
.header > a {
  color: inherit;
  text-decoration: none;
}

/* FONT STYLES */

.uppercase {
    text-transform: uppercase;
}
.capitalize {
    text-transform: capitalize;
}
.underlined {
    text-decoration: underline !important;
}
.unstyled-link {
    text-decoration: none !important;
}
a {
    cursor: pointer;
}
.text-center {
    text-align: center;
}
.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}
.bold {
    font-weight: 700 !important;
}
.italic {
    font-style: italic;
}

@media (max-width: 1199px) {}

@media (max-width: 991px) {}

@media (max-width: 767px) {}

@media (max-width: 575px) {}

@media (max-width: 500px) {}