/*
 * These styles are outputted both of the frontend and backend of the site
 * Please note any changes you do make may also make changes to the WP backend default styles.
 * Edit with caution
 */

/* Root Variables */
:root {--border-radius: 3rem; --button-border-radius: 3rem; --grid-gap: 4rem;}

/* Presets */
* {box-sizing: border-box;}
img {max-width: 100%; vertical-align: middle; height: auto;}

.responsive-iframe{position:relative;padding-top:62.5%;width:100%;}
.responsive-iframe iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none !important;}


/* Grid */
.grid {display: grid; grid-gap: 6rem;}
@media screen and (max-width: 768px) {
	.grid {grid-template-columns: 1fr !important;}
}

/* Sections */
section {background-size: cover; background-position: center;}
section.full-width .container, .container.full-width {max-width: 100%; width: 100%; padding-left: 8rem; padding-right: 8rem;}
.container .container {padding: 0;}
section.toast-block{position: relative;}

/* Container */
section.narrow .container .grid { width: 75%; max-width: 75%; margin: 0 auto;}
.container {width: 85%; max-width: 150rem; margin: 0 auto; padding: 0rem; position: relative;}
.container .container {padding: 0; margin: 0;}

@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 1440px){
	.container{max-width: 85%; width: 85%;}
}

/* Section Titles */
.section-title-area {margin-bottom: 5rem;}
.section-title-area.tac{max-width: 60%; margin: 0 auto; margin-bottom: 5rem;}
.section-title-area .section-title {margin-bottom: 5rem;}
.section-title-area .section-title p {margin-bottom: 0;}

h4::after { background-color: #222; content: ""; display: block; height: 0.8rem; margin: 1rem 0 2rem 0; width: 4rem; }
.has-bg h4::after { background-color: white;}

.section-title-area.feature-title:last-child {font-style: bold;}
.has-bg .section-title-area.feature-title .section-title::before {background-color: #fff;}
.has-bg .feature-title h3::after, .has-bg h3.feature-title::after { background-color: #fff; }
.section-title-area .toast-secondary-button{position: absolute; bottom: 0; right: 0;}

.section-title-area.black-header .section-title {color: #222 !important;}
.section-title-area.black-header .section-title::before {background-color: #222 !important;}
.feature-title h3 strong, h3.feature-title strong { font-weight: 300; font-size: font-size: calc(var(--base-heading-size) / 1); }
.feature-title h3::after, h3.feature-title::after { background-color: #222; content: ""; display: block; height: 0.8rem; margin: 2rem 0 6rem; width: 8rem; }
.has-bg .feature-title h3::after, .section-break-content h3.feature-title strong::after { background-color:white; }
.section-title-area.feature-title{max-width: unset; width: unset;}
.section-title-area.feature-title::before{display: none;}
.feature-title .section-title::before {display: none!important;}

@media(max-width: 768px){
	.section-title-area.feature-title .section-title::before, h3.feature-title::before{width: 100%; max-width: 500px;}
	.section-title-area.tac{max-width: 100%;}
}

@media(max-width: 550px){
	.section-title-area.feature-title h3.section-title, h3.feature-title{font-size: 3.5rem; max-width: 100%;}
	.section-title-area.feature-title h3.section-title strong, h3.feature-title strong{font-size: 7.5rem; max-width: 100%;}
	.section-title-area .toast-secondary-button{position: static;}
}

/* Buttons */
.button-block.bottom { position: absolute; bottom: 6rem; }
p + .button-block, img + .button-block { margin-top: 2rem; }

a.button,
a.toast-primary-button,
a.toast-secondary-button,
a.toast-tertiary-button {letter-spacing: 1px; text-transform: uppercase; padding: .75rem 2rem; color: var(--brand-1); display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; text-decoration: none; position: relative; border-radius: 5px; font-weight: 300; font-family: var( --ywf--family-playfair-display); border: 1px solid var(--brand-1); margin-top: 2rem;}


/*a.toast-primary-button::after,
a.toast-secondary-button::after,
a.toast-tertiary-button::after{content: ''; width: 12px; height: 20px; display: block; background-position: center center; background-size: contain; background-repeat: no-repeat;}*/

a.display-block {padding: 0.75rem 2rem; color: #ffffff; display: block;}

p + a.toast-primary-button, p + a.toast-secondary-button, p + a.toast-tertiary-button { margin-top: 2rem; }

/* Buttons with Backgrounds */
.bg1 a.toast-primary-button { background: var(--brand-2); }
.bg2 a.toast-primary-button,
.bg3 a.toast-primary-button,
.bg4 a.toast-primary-button,
.bg5 a.toast-primary-button,
.bg6 a.toast-primary-button,
.bg7 a.toast-primary-button,
.bg8 a.toast-primary-button { background: var(--brand-1); }

.bg1 a.toast-primary-button:hover,
.bg2 a.toast-primary-button:hover,
.bg3 a.toast-primary-button:hover,
.bg4 a.toast-primary-button:hover,
.bg5 a.toast-primary-button:hover,
.bg6 a.toast-primary-button:hover,
.bg7 a.toast-primary-button:hover,
.bg8 a.toast-primary-button:hover {
	background: rgba(0, 0, 0, 0.4);
}

/* Toast Secondary Button */
.bg1 a.toast-secondary-button { background: var(--brand-3); }
.bg2 a.toast-secondary-button,
.bg3 a.toast-secondary-button,
.bg4 a.toast-secondary-button,
.bg5 a.toast-secondary-button,
.bg6 a.toast-secondary-button,
.bg7 a.toast-secondary-button,
.bg8 a.toast-secondary-button { background: var(--brand-4); }

.bg1 a.toast-secondary-button:hover,
.bg2 a.toast-secondary-button:hover,
.bg3 a.toast-secondary-button:hover,
.bg4 a.toast-secondary-button:hover,
.bg5 a.toast-secondary-button:hover,
.bg6 a.toast-secondary-button:hover,
.bg7 a.toast-secondary-button:hover,
.bg8 a.toast-secondary-button:hover {
	background: rgba(0, 0, 0, 0.4);
}

/* Toast Tertiary Button */
.bg1 a.toast-tertiary-button { background: var(--brand-5); }
.bg2 a.toast-tertiary-button,
.bg3 a.toast-tertiary-button,
.bg4 a.toast-tertiary-button,
.bg5 a.toast-tertiary-button,
.bg6 a.toast-tertiary-button,
.bg7 a.toast-tertiary-button,
.bg8 a.toast-tertiary-button { background: var(--brand-6); }

.bg1 a.toast-tertiary-button:hover,
.bg2 a.toast-tertiary-button:hover,
.bg3 a.toast-tertiary-button:hover,
.bg4 a.toast-tertiary-button:hover,
.bg5 a.toast-tertiary-button:hover,
.bg6 a.toast-tertiary-button:hover,
.bg7 a.toast-tertiary-button:hover,
.bg8 a.toast-tertiary-button:hover {
	background: rgba(0, 0, 0, 0.4);
}

/* Button Options */
a.toast-primary-button{background: #fff; }
a.toast-primary-button:hover{background-color: var(--brand-1); color: #fff;}
a.toast-primary-button::after{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-prm.svg');}
a.toast-primary-button:hover::after{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-trt.svg');}

a.toast-secondary-button{background: #fff; }
a.toast-secondary-button:hover{background-color: var(--brand-1); color: #fff;}
a.toast-secondary-button::after{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-sec.svg');}
a.toast-secondary-button:hover::after{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-trt.svg');}

a.toast-tertiary-button{background: var(--brand-1); color: #fff;}
a.toast-tertiary-button:hover{background-color: #fff; color: var(--brand-1)}
a.toast-tertiary-button::after{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-trt.svg');}
a.toast-tertiary-button:hover::after{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-prm.svg');}

/* Slider Arrows */
.slider-arrows{display: inline-flex; gap: 1rem;}
.slider-arrows .slick-arrow{background-color: transparent; width: 30px; height: 50px; border-radius: 0; background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-prm.svg'); background-size: contain; background-position: center; background-repeat: no-repeat; cursor: pointer;}
.slider-arrows .slider-prev.slick-arrow{rotate: 180deg;}
.slider-arrows .slick-arrow:hover{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-sec.svg');}

/* Formatting */
img.toast-round-image { border-radius: 100%; }
img.toast-image-shadow { box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px; }

/* Post Listings */
.post-listings {grid-template-columns: 1fr 1fr 1fr;}
.post-listing {position: relative; box-shadow: 0 0 10px var(--shadow); overflow: hidden; background-color: var(--brand-1); z-index: 1;}
.post-listing .post-listing-link {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.post-listing .post-listing-image img{width: 100%; height: 400px;}
.post-listing .post-listing-content {padding: 4rem 2rem 6rem; color: #fff; font-size: 1.8rem;}
.post-listing .post-listing-content h3{font-size: 2.45rem;}
.post-listing .post-listing-content h3 a{color: #fff; font-family: var(--body-font); font-weight: bold;}

.post-listing:nth-of-type(2n) {background-color: #fff;color: var(--brand-1);}
.post-listing:nth-of-type(2n) .post-listing-content h3 a{color: var(--brand-1);}
.post-listing:nth-of-type(2n) .post-listing-content {color: var(--brand-1);}

/* Geometric Accent */
section.geometric-accent{margin-bottom: 180px;}
section.geometric-accent::after{content: ''; position: absolute; z-index: -1; width: 100%; height: 600px; background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-geometric-accent.svg'); background-size: contain; background-repeat: repeat-x; background-position: center; bottom: -200px; left: 0; right: 0;}

/* Form Submit */
.gform_wrapper.gravity-theme .gform-footer .wrap-gform-submit{position: relative;}
.gform_wrapper.gravity-theme .gform-footer input[type=submit]{padding: 1rem 5.75rem 1rem 3rem; color: #222222; display: inline-block; text-decoration: none; border-radius: .5rem; font-weight: 400; position: relative; margin-bottom: 0; background-color: #fff; border: 1px solid #222;}
.gform_wrapper.gravity-theme .gform-footer input[type=submit]:hover{background-color: var(--brand-1); color: #fff;}
.has-bg .gform_wrapper.gravity-theme .gform-footer input[type=submit]:hover{border: 1px solid #fff;}
.gform_wrapper.gravity-theme .gform-footer .wrap-gform-submit::after{content: '';  display: inline-block; position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); pointer-events: none; background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-prm.svg'); width: 1.5rem; height: 2.5rem; background-size: contain; background-position: center; background-repeat: no-repeat;}
.gform_wrapper.gravity-theme .gform-footer .wrap-gform-submit:hover::after{background-image: url('/wp-content/themes/toast/assets/images/icons/dcr-chevron-trt.svg');}


.gform_wrapper.gravity-theme .gform-footer .wrap-gform-submit::after { display:none;}


/* Pagination */
.page-navigation { margin-top: 2rem; text-align: center; }

/* WYSIWYG Formats */
ul.toast-boxed-list { background: var(--brand-8); padding: 2rem 2rem 1rem 2rem; list-style: inside; }
p.toast-alert-paragraph { display: flex; align-items: center; background: var(--brand-1); color: #fff; padding: 2rem; margin: 4rem 0; position: relative; }
p.toast-alert-paragraph:before { content: ""; display: block; background: transparent url('/wp-content/themes/toast/assets/images/warning.svg') center center no-repeat; background-size: contain; height: 5rem; width: 5rem; margin-right: 2rem; }

/* Captions */
p.wp-caption-text { background: var(--brand-2); padding: 1rem 2rem;	box-sizing: border-box; display: inline-block; color: #fff; width: 100%; border-radius: 0 0 2rem 2rem; }
div[id^="attachment_"] { max-width: 100% !important; width: 100% !important; }
div[id^="attachment_"] img { width: 100%; }
.alignleft .wp-caption-text, .alignright .wp-caption-text { margin-bottom: 0 !important; }

/* Never Remove */
.wp-block { font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif; }

.anchors .col .column-content{display: flex; gap: 4rem;}
.anchors .col .column-content p{flex-basis: calc(25% - 4rem);}
.anchors .col .column-content p a{width: 100%;}
.anchors .col .column-content p a::after{rotate: 90deg;}

@media(max-width: 1024px){
	.anchors .col .column-content{flex-wrap: wrap;}
	.anchors .col .column-content p{flex-basis: calc(50% - 2rem); margin-bottom: 0;}
}

@media(max-width: 480px){
	.anchors .col .column-content{flex-wrap: wrap;}
	.anchors .col .column-content p{flex-basis: 100%;}
}