/* Fonts
--------------------------------------------- */

@font-face {
    font-display: swap;
    font-family: 'Playfair Display';
    src: url('../woff2/playfairdisplay-bold.woff2') format('woff2'),
        url('../woff/playfairdisplay-bold.woff') format('woff');
    font-style: normal;
    font-weight: bold;
}

/* Headings
--------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
    font-family: var(--wp--preset--font-family--secondary);
    font-weight: var(--wp--custom--font-weight--bold);
    line-height: var(--wp--custom--line-height--heading);
    margin-top: 0px;
    margin-bottom: 15px;
}

/* Custom Block Styles
--------------------------------------------- */

.wp-block-button .wp-block-button__link {
    box-shadow: none !important;
	color: var(--wp--preset--color--foreground);
    line-height: 1.2;
    padding: 10px 20px;
}

.wp-block-button__link:focus,
.wp-block-button__link:hover {
    box-shadow: none !important;
	color: var(--wp--preset--color--foreground);
}

a.wp-block-button__link.has-foreground-background-color:focus,
a.wp-block-button__link.has-foreground-background-color:hover {
    color: var(--wp--preset--color--secondary);
    opacity: 0.8;
}

.is-style-outline>.wp-block-button__link:not(.has-text-color),
.wp-block-button__link.is-style-outline:not(.has-text-color) {
	color: var(--wp--preset--color--foreground);
}

.is-style-outline>.wp-block-button__link:not(.has-text-color):focus,
.is-style-outline>.wp-block-button__link:not(.has-text-color):hover,
.wp-block-button__link.is-style-outline:not(.has-text-color):focus,
.wp-block-button__link.is-style-outline:not(.has-text-color):hover {
	color: var(--wp--preset--color--foreground);
}

.wp-block-post-title a {
    display: unset;
}

.wp-block-query .wp-block-post-title a:focus,
.wp-block-query .wp-block-post-title a:hover {
    box-shadow: inset 0 -24px 0 0 var(--wp--preset--color--primary);
    color: var(--wp--preset--color--foreground);
    text-decoration: none;
}

.home-featured.wp-block-group:where(.has-background.alignfull) {
    padding-top: 10px;
}

@media only screen and (min-width: 860px) {

    .home-featured.wp-block-group:where(.has-background.alignfull) {
        padding-top: 20px;
    }

}

.home-featured .wp-block-query .wp-block-post-title a:hover {
    box-shadow: inset 0 -28px 0 0 var(--wp--preset--color--primary);
}

.wp-block-query .wp-block-post-title.has-xx-large-font-size a:hover {
    box-shadow: inset 0 -41px 0 0 var(--wp--preset--color--primary);
}

.wp-block-quote {
    background-color: var(--wp--preset--color--background);
}

.wp-block-post-excerpt__more-link {
	box-shadow: none !important;
    text-decoration: underline;
}

.home-opt-in {
    padding: 20px;
}

.home-opt-in .wp-block-columns {
	gap: 0 !important;
}

/* Custom Call Out Block Styles
--------------------------------------------- */

div[class*=" is-style-call-out-"].wp-block-group:where(.has-background) {
	margin-bottom: 30px;
	margin-top: 50px;
    overflow: unset;
	padding: 45px 20px 20px;
	position: relative;
}

div[class*=" is-style-call-out-"].wp-block-group:where(.has-background-background-color) {
    box-shadow: 0 0 20px rgb(0 0 0 / 7%);
}

div[class*=" is-style-call-out-"].wp-block-group:where(.has-border-color) {
    box-shadow: none;
}

div[class*=" is-style-call-out-"]:before {
    outline: 2px solid #fff;
    border-radius: 50%;
    height: 50px;
	left: 12px;
	position: absolute;
	top: -25px;
}

.is-style-call-out-faq:before {
    content: url(../svg/icon-circle-faq.svg);
}

.is-style-call-out-note:before {
    content: url(../svg/icon-circle-note.svg);
}

.is-style-call-out-product:before {
    content: url(../svg/icon-circle-product.svg);
}

.is-style-call-out-serving:before {
    content: url(../svg/icon-circle-serving.svg);
}

.is-style-call-out-swap:before {
    content: url(../svg/icon-circle-swap.svg);
}

.is-style-call-out-tip:before {
    content: url(../svg/icon-circle-tip.svg);
}

@media only screen and (min-width: 768px) {
    
    div[class*=" is-style-call-out-"].wp-block-group:where(.has-background) {
        padding: 50px 30px 30px;
    }
    
    div[class*=" is-style-call-out-"]:before {
        left: 20px;
    }
    
}

@media only screen and (min-width: 1200px) {
    
    div[class*=" is-style-call-out-"].wp-block-group:where(.has-background) {
        margin-top: 30px;
        padding: 30px 30px 30px 50px;
    }
    
    div[class*=" is-style-call-out-"]:before {
        left: -25px;
        top: 17px;
    }
    
}