/*
Theme Name: Fuel6
Theme URI: https://fuelmedical.com
Author: Fuel Medical
Description: A Fuel Medical block theme (2024)
Requires at least: 6.5
Tested up to: 6.6.2
Requires PHP: 8.0
Version: 6.3.4
Text Domain: fuel6
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Custom Properties
# Fuel Normalize
# Helper Classes
# WordPress Blocks
# Forms - Moved to css/gravity-forms.css
# Header
# Content
# Footer
# Contact Section
# Map
# Animations
# Video Lightbox
# Print
# Safari 15.3 fallbacks
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Custom Properties
  Note: WordPress declares its variables in the body, so do the same to avoid scope issues.
--------------------------------------------------------------*/


body {
	 /* Structure - 1100px - for use outside of contain class */
	 --contain-padding: clamp(1rem, calc(50vw - 29.93rem), 19rem);

	/* Design - Change in theme.json */
	 --primary-color: var(--wp--preset--color--primary);
	 --accent-color: var(--wp--preset--color--accent);
	 --white: var(--wp--preset--color--white);
	 --grey: var(--wp--preset--color--grey);
	 --black: var(--wp--preset--color--black);

	/* Top Level Primary Menu Colors - now managed on the block level */
	 --wp--preset--color--menu-background: inherit;
	 --wp--preset--color--menu-color: currentColor;
	 --wp--preset--color--menu-hover-color: var(--white);
	 --wp--preset--color--menu-hover-bg: var(--primary-color);

	/* Sub Menu Colors */
	 --wp--preset--color--sub-menu-background: var(--forest-green);
	 --wp--preset--color--sub-menu-color: var(--primary-color);
	 --wp--preset--color--sub-menu-hover-color: var(--primary-color);
	 --wp--preset--color--sub-menu-hover-bg: var(--wp--preset--color--color-3);

	/* Text */
	 --title-font: var(--wp--preset--font-family--title);
	 --title-color: var(--primary-color);
	 --content-font: var(--wp--preset--font-family--content), sans-serif;
	 --content-color: var(--wp--preset--color--content);

	/* Custom Colors */
	 --red: var(--wp--preset--color--red);
	 --dk-blue: var(--wp--preset--color--dk-blue);
	 --lt-grey: var(--wp--preset--color--lt-grey);
	 --forest-green: var(--wp--preset--color--forest-green);
}


/*--------------------------------------------------------------
# Fuel Normalize
--------------------------------------------------------------*/
body { overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
html { font-size: clamp(125%, 1vw, 240%); line-height: 1.5; -webkit-text-size-adjust:100%; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; scrollbar-gutter: stable; position: relative; min-width: 18rem; }
iframe, img, svg, audio, canvas, video, object, embed { vertical-align: middle; max-width: 100%; }
img {object-fit: cover;}
img:not([src*=".png"], [src*=".gif"], [src*=".svg"]) {/* background: var(--grey); */}
a {text-decoration: none;color: var(--primary-color);transition: background-color 350ms, color 350ms;}
a[href^="tel:"] { white-space: nowrap; }
a:hover { color: var(--primary-color); }

@media only screen and (min-width: 68.5em) { 
	*[id] { scroll-margin-top: 3rem; }
}


/*--------------------------------------------------------------
# Helper Classes
--------------------------------------------------------------*/
.contain { --contain-padding: clamp(var(--mobile-padding, 1rem), calc(50vw - 29.93rem), var(--desktop-padding, 19rem)); display: block; position: relative; margin: auto; padding-right: var(--contain-padding); padding-left: var(--contain-padding); width: 100%; }
.icon-item { display: block; position: relative; margin: 1em 0; padding: 0 0 0 1.8em; }
.icon-item svg { position: absolute; top: 0.15em; left: 0; width: 1.2em; height: 1.2em; }
.list-col-2 { column-count: 2; }

@media (min-width: 68.5em) { 
	.mobile-only { display: none !important; }
}

@media (max-width: 68.49em) { 
	.desktop-only { display: none !important; }
}

.zebra >*:not(tbody):nth-child(odd) { background-color: var(--zebra, var(--grey)); }

/* Use on query loops to help change the order every other column */ 
.stagger > :nth-child(even) .wp-block-columns { flex-direction: row-reverse; }

/* Use to make link fill entire block - use when you can't wrap blocks with anchor tag */ 
.cover-link { position: absolute !important; inset: 0; width: 100%; z-index: 1; background: none !important; }
:has(> .cover-link) { position: relative; }


/*--------------------------------------------------------------
# WordPress Blocks
--------------------------------------------------------------*/
@media (min-width: 37.5em) {
	.alignleft, .alignright { max-width: 48%; }
}

@media (min-width: 68.5em) {
	.is-position-sticky { top: 4rem; }
}


/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.header-logo svg, .footer-logo svg { transition: transform 0.3s ease; }
.header-logo a:is(:hover, :focus-visible) svg, .footer-logo:is(:hover, :focus-visible) svg { transform: scale(1.05); }
.header-quicklinks.header-quicklinks a { padding: 0.25rem 2.1rem; border-radius: 0.25rem; border: 1px solid var(--forest-green); font-size: 1rem; color: var(--forest-green); }
.header-quicklinks a:is(:hover, :focus-visible) {background: var(--accent-color);border-color: var(--accent-color);color: var(--forest-green);font-weight: 700;}
.header-quicklinks svg { margin-right: 0.3rem; transform: translateY(-0.1rem); }

@media (max-width: 68.49em) {
	.header {position: relative;z-index: 998;border-bottom: 1px solid var(--content-color);}
	.header-logo {text-align: center;}
	.header-logo svg {height: clamp(4.26rem, 6vw, 5.5rem);}
}

@media (min-width: 68.5em) {
	.header:not(.block-editor-block-list__block) {position: sticky;top: -7.8rem;z-index: 9999;}
	.header > .wp-block-columns { padding-right: 1.5rem; padding-left: 1.5rem; }
	.header-number-text a { text-decoration: underline; }
}

@media (min-width: 75em) { /* 1200px */
	.header > .wp-block-columns { padding-right: 3rem; padding-left: 3rem; }
}

@media (min-width: 100em) { /* 1600px */
	.header > .wp-block-columns {padding-right: 6.5rem;padding-left: 6.5rem;}
}


/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
.wp-site-blocks { margin: auto; }
#main {margin: 0 0 4rem !important;font-size: var(--wp--preset--font-size--content);}
.entry-content .wp-block-list li { margin: 1em 0 0 0; }

/* Location card loop - Used in content, and menu */
.sub-menu .location-card { background: none !important; padding-top: 0 !important; }
.sub-menu .location-card .wp-block-post-title { border-bottom: 1px solid; padding-bottom: 0.5rem; font-size: 1.1rem; font-family: var(--content-font); font-weight: bold; }

@media (max-width: 68.49em) {
	#main {margin: 0 0 2rem !important; }
	.sub-menu .location-cta svg { color: var(--white); }
}

/* Bio grid custom loop */
.bio-list .bio-box { display: grid; grid-template-areas: "img label"; justify-content: start; }
.bio-list .bio-image {grid-area: img;width: 2rem;height: 3rem;margin-right: 0.5rem;overflow: hidden;}
.bio-list img { width: 100%; height: 100%; }
.bio-list .bio-label { grid-area: label; line-height: normal; display: flex; flex-wrap: wrap; align-content: center; }
.bio-list .bio-label span { flex: 1 1 100%; }
.bio-list .bio-cred { font-size: 0.8rem; }

@media (max-width: 68.49em) {
	#main .bio-list .bio-box { padding: 0.3rem 1rem; margin-left: -1rem; width: calc(100% + 2rem); }
	#main .bio-list .bio-box:nth-child(odd) { background: rgba(0,0,0,0.1); }
	#main .bio-box::after { content: ''; --link-svg: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" width="18" height="18"><path stroke="white" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M10.37 7.63a3.88 3.88 0 0 0-5.49 0l-2.74 2.74a3.88 3.88 0 0 0 5.49 5.5L9 14.48"></path><path stroke="white" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.63 10.37a3.88 3.88 0 0 0 5.49 0l2.74-2.74a3.88 3.88 0 1 0-5.49-5.5L9 3.52"></path></svg>'); background-color: currentColor; -webkit-mask: var(--link-svg); mask: var(--link-svg); position: absolute; inset: 0 8vw 0 auto; width: 0.9rem; height: 0.9rem; margin: auto; transition: background-color 0.3s ease; }
}

@media (min-width: 68.5em) {
	.bio-list { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-start; margin-top: 1rem; }

	/* Adjust min-width to prevent names from wrapping */ 
	.bio-list .bio-box { grid-template-areas: "img" "label"; flex: 0 1 calc(25% - 1rem); min-width: 7.5rem; text-align: center; }
	.bio-list.bio-list .bio-box:is(:hover, :focus-visible) { background: none; }
	.bio-list .bio-image {display: block;width: 100%;height: auto;aspect-ratio: 1 / 1.2;/* border-bottom: 0.4rem solid var(--primary-color); */margin-bottom: 0.8rem;}
	.bio-list .bio-image img { transition: transform 0.3s; }
	.bio-list .bio-box:is(:hover, :focus-visible) .bio-image img { transform: scale(1.1); }
	.bio-list .bio-cred { color: var(--content-color); }
}

/* Hero "Swoop" */
.swoop-1 { position: absolute;bottom: -0.25rem;left: 0;height:auto;max-width: unset;width: calc(100% + 24rem);margin: 0 !important;}

@media (prefers-reduced-motion:no-preference) and (min-width: 39em) {
	.swoop-1 > path{position:relative;display:block;animation-name: swoosh-slide-right;animation-delay: 0ms;animation-duration: 1s;animation-fill-mode: both;animation-timing-function: cubic-bezier(0.1, -0.5, 0.2, 0.8);}
	.swoop-1 > path:first-child{animation-duration: 2s;}
	.swoop-1 > path:nth-child(2){animation-duration: 2.5s;}
	.swoop-1 > path:nth-child(3){animation-duration: 800ms;}
	.swoop-1 > path:nth-child(4){animation-duration: 3s;}
}

@keyframes swoosh-slide-right {
  from {transform: translateX(-8rem);}
  to {transform: translateX(0rem);}
}

@media (min-width: 100em) { /* 1600px */
    /*.swoop-1 { min-height: 17.4rem; }*/
}

@media (prefers-reduced-motion:no-preference) and (min-width: 39em) { /* 624px 
    .swoop-1 path { animation: 1s linear calc(var(--scroll) * var(--multiplier, -3s)) 1 normal both paused moveTo; }
    .swoop-1-2 {--y: -9rem;}
    .swoop-1-4 {--y: -12rem;}*/
}

/* Four Steps & Contact Section "Swoop" */
.swoop-2 {z-index: 1;position: absolute;top: -0.7rem;right: 0;height: fit-content;min-height: clamp(9rem, 28vw, 11rem);max-width:unset; width: calc(100% + 50em);margin: 0 !important;pointer-events: none;}

@media (min-width: 26.25em) {
	.swoop-2 { top: -3px; }
}

@media (prefers-reduced-motion:no-preference) and (min-width: 39em) {
	.js-intersected.swoop-2 > path { position:relative;display:block;animation-name: swoosh-slide-left;animation-delay: 0ms;animation-duration: 1s;animation-fill-mode: both;animation-timing-function: cubic-bezier(0.1, -0.5, 0.2, 0.8);}
	.swoop-2 > path:first-child { animation-duration: 2s; }
	.swoop-2 > path:nth-child(2) { animation-duration: 2.5s; }
	.swoop-2 > path:nth-child(3) { animation-duration: 800ms; }
	.swoop-2 > path:nth-child(4) { animation-duration: 3s; }
}

@keyframes swoosh-slide-left {
  from {transform: translateX(8em);}
  to {transform: translateX(0rem);}
}

#fuel_lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: var(--black, #000);
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.7);
	max-width: 90dvw;
    max-height: 90dvh;
    padding: 0;
    overflow: visible;
}

#fuel_lightbox .lightbox-close {
  	text-transform: uppercase;
  	position: absolute;
	inset: 0 0 auto auto;
	padding: 0.3rem 0.5rem;
	cursor: pointer;
	transition: opacity 0.3s;
}

#fuel_lightbox iframe,
#fuel_lightbox img {
	max-width: -webkit-fill-available;
	max-height: inherit;
}

#fuel_lightbox img {
	width: 100%;
	height: 100%;
}

/* Fullscreen styling */
#fuel_lightbox.fullscreen {
	max-width: 100vw;
    max-height: 100vh;
}

/* Needed for iPhone/iPad */
#fuel_lightbox[open],
#fuel_lightbox[open] iframe {
    width: 100%;
    height: 100%;
}

#fuel_lightbox.fullscreen .lightbox-close {
	inset: 1.2rem 0 auto;
	width: 5rem;
	margin: auto;
}

#fuel_lightbox.fullscreen iframe,
#fuel_lightbox.fullscreen img {
	width: 100vw;
    height: 100vh;
    object-fit: contain;
}

/* Lightbox Animation */
#fuel_lightbox[open] {
    animation: lightBoxIn var(--s, 0.5s) var(--e, ease);
}

#fuel_lightbox.close{
    animation: lightBoxOut var(--s, 0.5s) var(--e, ease);
}

@keyframes lightBoxIn {
	0% { opacity: var(--o1, 0); transform: translate(var(--x1, 0), var(--y1, 0)); }
	100% { opacity: var(--o2, 1); transform: translate(var(--x2, 0), var(--y2, 0)); }
}

@keyframes lightBoxOut {
	0% { opacity: var(--o2, 1); transform: translate(var(--x2, 0), var(--y2, 0)); }
	100% { opacity: var(--o1, 0); transform: translate(var(--x1, 0), var(--y1, 0)); }
}



/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer { margin: 0; }
.footer a {display: block;width: fit-content;background: linear-gradient(0deg, var(--white), var(--white)) no-repeat 0 bottom / 0 2px;transition: 300ms ease;}
.footer a.icon-item { background-position-x: 1.6rem; }
.footer a:not(.footer-logo, .wp-element-button):is(:hover, :focus-visible) { background-size: 100% 2px; color: var(--white); }
.footer-socials a {transition: transform 0.3s ease;}
.footer-socials a:is(:hover, :focus) { background: none; transform: scale(1.2); }
#footer-socials {padding: 0 2rem 2rem;border-bottom: 1px solid var(--white);}
.footer-logo {width: 100%;max-width: 8.5rem;margin: auto !important;}
.footer-socials {margin: 0 !important;}
.footer-socials .wp-block-fuel-menu-wrapper { justify-content: center; }
.footer-socials .menu-label-svg { vertical-align: 0.2rem; }
.footer-socials .menu-label-text { font-size: 0.9rem; }
.footer-search {padding: 0;min-width: 0;max-width: 20rem;margin: 1.3rem auto 0 !important;}
.footer-search .wp-block-search__inside-wrapper {border-radius: 0;outline: none;}
.footer-search .wp-block-search__input {order: 2;border: none;background: var(--lt-grey);padding: 0.4rem;font-style: italic;}
.footer-search .wp-block-search__button { padding: 0 0.75rem; border: none; margin: 0; background-color: var(--primary-color); background-repeat: no-repeat; background-position: center; background-image: url('data:image/svg+xml,<svg aria-label="Search" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M8.33303 1.66699C7.29017 1.66755 6.26198 1.91276 5.33111 2.3829C4.40024 2.85304 3.59264 3.53502 2.97324 4.374C2.35383 5.21298 1.93989 6.18558 1.76468 7.21362C1.58948 8.24166 1.65789 9.29646 1.96443 10.2933C2.27096 11.29 2.80707 12.201 3.52967 12.953C4.25226 13.7049 5.14118 14.2768 6.12499 14.6228C7.10879 14.9688 8.16004 15.0791 9.19423 14.9449C10.2284 14.8108 11.2167 14.4359 12.0797 13.8503L16.1997 17.967C16.3141 18.0898 16.4521 18.1883 16.6055 18.2566C16.7588 18.3249 16.9243 18.3617 17.0922 18.3646C17.26 18.3676 17.4267 18.3367 17.5824 18.2739C17.738 18.211 17.8794 18.1174 17.9981 17.9987C18.1168 17.88 18.2104 17.7386 18.2732 17.583C18.3361 17.4273 18.367 17.2606 18.364 17.0928C18.361 16.925 18.3243 16.7594 18.256 16.6061C18.1877 16.4528 18.0892 16.3148 17.9664 16.2003L13.8497 12.0803C14.5308 11.078 14.9257 9.90892 14.9921 8.69889C15.0585 7.48886 14.7938 6.28362 14.2265 5.21276C13.6592 4.1419 12.8107 3.24593 11.7723 2.62119C10.7339 1.99644 9.54487 1.66655 8.33303 1.66699ZM4.16636 8.33366C4.16636 7.22859 4.60535 6.16878 5.38675 5.38738C6.16815 4.60598 7.22796 4.16699 8.33303 4.16699C9.43809 4.16699 10.4979 4.60598 11.2793 5.38738C12.0607 6.16878 12.4997 7.22859 12.4997 8.33366C12.4997 9.43873 12.0607 10.4985 11.2793 11.2799C10.4979 12.0613 9.43809 12.5003 8.33303 12.5003C7.22796 12.5003 6.16815 12.0613 5.38675 11.2799C4.60535 10.4985 4.16636 9.43873 4.16636 8.33366Z" fill="white"/> </svg>'); }
.footer-search .wp-block-search__button:is(:hover, :focus-visible) { background-color: var(--accent-color); }
.footer-search ::placeholder { color: var(--content-color); opacity: 1; }
#footer-locations {padding: 0 2rem 2rem;border-bottom: 1px solid var(--white);}
.footer-locations-title {color: var(--primary-color);font-size: clamp(1.2rem, 3vw, 1.6rem);font-weight: bold;text-align: center;padding: 0 1rem;}
.footer-locations-hours { text-align: center; }
.footer-locations-hours strong { display: block; }
.footer-locations-text { text-align: center; padding: 0 1rem; }
.footer-locations-btn { justify-content: center; }

/* Copyright Section */
#copyright_section {padding: 1.2rem 1.5rem 5rem;border-top: 1px solid var(--white);margin-top: 2.6rem;}
.policy-menu li:nth-child(n+1):not(:last-child)::before { content: '|'; position: absolute; right: -0.6rem; }

/* 850px - Mobile breakpoint for copyright section */
@media only screen and (max-width: 53.125em) {
	.copyright-wrapper { flex-direction: column; text-align: center; }
	.policy-menu { justify-content: center; }
}

@media (min-width: 48.875em) { /* 782px */
	#foot_content { padding: 0 2rem; } 
	#footer-socials { border: none;padding: 0 0;} 
	.footer-logo { margin: 0 !important; }
	.footer-socials .wp-block-fuel-menu-wrapper { justify-content: flex-start; }
	#footer-locations { border: none;padding: 0;}
}

@media (min-width: 68.5em) {
	#foot_content { gap: 0 2.5rem; padding: 0 1.5rem; }
	#footer-socials {position:relative;padding-right: 2.5rem;}
	#footer-socials:after, #footer-locations:after {content: '';width: 1px;height: 268px;background: var(--white);position: absolute;top: 0;right: 0;bottom: 0;}
	#footer-socials .wp-block-group { margin-top: -0.5rem; }
	.footer-logo {min-width: 12.7rem;max-width: none;}
	.footer-socials {margin: 1.75rem  0 !important;}
	#footer-locations { flex-basis: 60%; position:relative;padding-right: 2.5rem;}
	.footer-locations-title {padding: 0;text-align: left;max-width: none;margin: 0 0 0.4rem;}
	.footer-locations-hours {text-align: left;margin: 0 0 1.8rem;}
	.footer-locations-hours strong { display: inline-block; }
	.footer-locations-text {padding: 0;text-align: left;margin: 0 0 0;}
	.footer-locations-btn { margin: 1rem 0 0; }
	.footer-locations-btn { justify-content: flex-start; }
	#copyright_section { padding: 0.4rem 1rem; }
}

@media (min-width: 82.5em) {
	#foot_content { padding: 0; }
	#footer-locations { flex-basis: calc(100% - 29.4rem); }
	#copyright_section {padding: 0.4rem 0;}
	.copyright-wrapper { max-width: 60rem; }
}


/*--------------------------------------------------------------
# Contact Section
--------------------------------------------------------------*/
#contact_section { padding-bottom: 2rem !important; }
.contact-us-container { max-width: 41.6rem; }
.contact-us-container .wp-block-group {max-width: none;}
.contact-section-title:after {content: '';height: 1px;width: 14.2rem;background: var(--white);position: absolute;right: 0;bottom: -2.65rem;left: 0;margin: auto;}
.contact-section-title { position: relative; margin-bottom: 5rem; }
.contact-section-columns {max-width: none;gap: 3rem 0;}
.contact-section-col-left, .contact-section-col-right {font-size: clamp(0.9rem, 1.9vw, 1rem);padding: 0 1.2rem;}
.contact-svcs-title { text-align: center; }
.contact-svcs-text, .contact-form-top-text {text-align: center;padding: 0 1rem;}
.contact-svcs-text a:is(:hover, :focus) {text-decoration: underline;}
.contact-form-top-text .phone { color: var(--primary-color); font-weight: bold; }
.contact-form-top-text .phone:is(:hover, :focus) {color: var(--accent-color);text-decoration: underline;}
.contact-section-col-right .gform_wrapper.gravity-theme .gform_footer button { background-color: var(--white); color: var(--forest-green); }
.contact-section-col-right .gform_wrapper.gravity-theme .gform_footer button:is(:hover, :focus-visible) {background-color: var(--accent-color);color: var(--forest-green);}

@media (min-width: 48.875em) { /* 782px */
	#contact_section { padding-bottom: 6.6rem !important; }
	.contact-section-title:after { bottom: -1.6rem; }
	.contact-section-columns { gap: 0 2.8rem; }
	.contact-svcs-title, .contact-svcs-text { text-align: left; padding: 0; }
	.contact-form-top-text {text-align: left;padding: 0.8rem 0 0;max-width: 15.5rem;}
	.contact-section-col-right #gform_wrapper_1 { margin-top: 1.8rem; }
	.contact-section-col-right .gform_wrapper.gravity-theme .gform_footer {padding: 1.6rem 0 0;margin: 0;}
	.contact-section-col-right .gform_wrapper.gravity-theme .gform_footer button { margin: 0; }
}

@media (min-width: 68.5em) {
	.contact-section-columns { gap: 0 5.6rem;}
	.contact-section-col-left, .contact-section-col-right { padding: 0; }
}


/*--------------------------------------------------------------
# Map
--------------------------------------------------------------*/
.fm-map { position: relative; width: 100%; height: 30rem; max-height: calc(90vh - 3.2rem); background: var(--grey); margin-bottom: 2rem; }
.map-list-button { font-size: 1rem; }
.map-list-button, .map-show-list, .map-show-map { background: none; }
.map-show-map, .map-show-list { font-size: 0.8rem; }
[hidden] { display: none; }


/*--------------------------------------------------------------
# Animations
--------------------------------------------------------------*/
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(var(--spin-rotation, 360deg)); }
}

@keyframes fadein {
	0% { opacity: var(--o1, 0); transform: translate(var(--x1, 0), var(--y1, 5rem)); }
	100% { opacity: var(--o2, 1); transform: translate(var(--x2, 0), var(--y2, 0)); }
}

@keyframes fadeout {
	0% { opacity: var(--o2, 1); transform: translate(var(--x2, 0), var(--y2, 0)); }
	100% { opacity: var(--o1, 0); transform: translate(var(--x1, 0), var(--y1, 5rem)); }
}

@keyframes point {
	0% { transform: translate(0, 0); }
	50% { transform: translate(var(--x, 1rem), var(--y, 0)); }
	100% { transform: translate(0, 0); }
}

@keyframes moveTo {
	to {transform: translate(var(--x, 0), var(--y, 0))}
}

/* popAnimation Example: https://jsfiddle.net/KTC_88/8xkLv520/ */
@keyframes popAnimation {
    0% {transform: scale(0.5); opacity: 0;}
    80% {transform: scale(1.1)}
    100% {transform: scale(1); opacity: 1}
}


/**
* Animation helper classes.
*/
@media (prefers-reduced-motion:no-preference) {
	.delay-200 { --delay: 200ms; }
	.delay-300 { --delay: 300ms; }
	.delay-400 { --delay: 400ms; }
	.delay-500 {--delay: 500ms;}
	.delay-600 { --delay: 600ms; }
	.delay-750 { --delay: 750ms; }
	.delay-800 { --delay: 800ms; }
	.delay-900 { --delay: 900ms; }
	.delay-1000 { --delay: 1000ms; }
	.delay-1500 { --delay: 1500ms; }

	.time-300 { --time: 300ms; }
	.time-500 {--time: 750ms;}
	.time-750 { --time: 750ms; }
	.time-1000 { --time: 1000ms; }

	/* Add to wrappers to animate children */ 
	.popin > * { transform: scale(0.5); opacity: 0; }
	.popin.js-intersected > * { --delay:calc(var(--i, 0) * 200ms); animation: popAnimation 400ms ease var(--delay) forwards; }
	.fadein-items > * { opacity: 0; transform: translateY(0); }
	.fadein-items.js-intersected > * { --delay:calc(var(--i, 0) * 200ms); animation: fadein var(--time, 400ms) ease var(--delay) forwards; }

	/* Add directly to element that will be affected */ 
	.fadein { opacity: 0; transform: translateY(0); --y1: 0; }
	.fadeup { opacity: 0; transform: translateY(5rem); }
	.fadedown { opacity: 0; transform: translateY(-5rem); --y1: -5rem; }
	.fadeleft { opacity: 0; transform: translateX(-5rem); --x1: -5rem; --y1: 0; }
	.faderight { opacity: 0; transform: translateX(5rem); --x1: 5rem; --y1: 0; }

	.js-intersected:is(.fadein, .fadeup, .fadedown, .fadeleft, .faderight) { animation: fadein var(--time, 300ms) ease var(--delay, 0s) forwards;}
}


/* Used to make images in links grow when link is hovered - simply add .hover-img-grow to link or image block */
figure.hover-img-grow, .hover-img-grow figure { overflow: hidden; }

.hover-img-grow img { transition: transform var(--time, 0.3s); }

a:has(+ .hover-img-grow):is(:hover, :focus-visible) + figure img,
a:has(.hover-img-grow):is(:hover, :focus-visible) img,
a.hover-img-grow:is(:hover, :focus-visible) img { transform: scale(var(--scale, 1.1)); }


/*--------------------------------------------------------------
# Video Lightbox
--------------------------------------------------------------*/
#fuel_lightbox { position: fixed; inset: 0; z-index: 99999; background: var(--black, #000); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.7); max-width: 90dvw; max-height: 90dvh; padding: 0; overflow: visible; }
#fuel_lightbox .lightbox-close { text-transform: uppercase; position: absolute; inset: 0 0 auto auto; padding: 0.3rem 0.5rem; cursor: pointer; transition: opacity 0.3s; }
#fuel_lightbox iframe, #fuel_lightbox img { max-width: -webkit-fill-available; max-height: inherit; }
#fuel_lightbox img { width: 100%; height: 100%; }
#fuel_lightbox .lightbox-close {text-transform: uppercase;position: absolute;inset: 0.25rem 0.25rem auto auto;padding: 1rem 1rem;cursor: pointer;opacity: 1;background: red;color: var(--white);z-index: 99;border-radius: 0.5rem;} 
#fuel_lightbox .lightbox-close:is(:hover, :focus-visible) { background: var(--white); color: red; }

/* Fullscreen styling */
#fuel_lightbox.fullscreen { max-width: 100vw; max-height: 100vh; }

/* Needed for iPhone/iPad */
#fuel_lightbox[open], #fuel_lightbox[open] iframe { width: 100%; height: 100%; }
#fuel_lightbox.fullscreen .lightbox-close { inset: 1.2rem 0 auto; width: 5rem; margin: auto; }
#fuel_lightbox.fullscreen iframe, #fuel_lightbox.fullscreen img { width: 100vw; height: 100vh; object-fit: contain; }

/* Lightbox Animation */
#fuel_lightbox[open] { animation: lightBoxIn var(--s, 0.5s) var(--e, ease); }
#fuel_lightbox.close{ animation: lightBoxOut var(--s, 0.5s) var(--e, ease); }

@keyframes lightBoxIn { 
	0% { opacity: var(--o1, 0); transform: translate(var(--x1, 0), var(--y1, 0)); }
	100% { opacity: var(--o2, 1); transform: translate(var(--x2, 0), var(--y2, 0)); }
}

@keyframes lightBoxOut { 
	0% { opacity: var(--o2, 1); transform: translate(var(--x2, 0), var(--y2, 0)); }
	100% { opacity: var(--o1, 0); transform: translate(var(--x1, 0), var(--y1, 0)); }
}


/*--------------------------------------------------------------
# Print
--------------------------------------------------------------*/
@media print {
	@page { margin: 0.5cm; }
	* { background: transparent !important; color: black !important; text-shadow: none !important; -webkit-filter: none !important; filter: none !important; -ms-filter: none !important; }
	a, a:visited { color: #444 !important; text-decoration: underline; }
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
	tr, img { page-break-inside: avoid; }
	img { max-width: 100% !important; }
	p, h1, h2, h3 { orphans: 3; widows: 3; }
	h1, h2, h3 { page-break-after: avoid; }
	.main-header { padding-top: 0 !important; padding-bottom: 0 !important; }
	.main-title { margin: 0; padding-bottom: 1rem; border-bottom: 2px solid #000; }
	.primary-menu, #sidebar, .header, .footer, .page-navigation, .pagination, .wp-prev-next, .respond-form { display: none !important; }
}


/*--------------------------------------------------------------
# Safari 15.3 fallbacks
  Safari 15.3 and under bug fixes - welcome to the new IE
--------------------------------------------------------------*/
@media not all and (min-resolution: 0.001dpcm) {
	@supports (-webkit-appearance: none) { 
		/* Hide Dialog (not supported) */ 
		dialog { display: none; background-color: var(--white); z-index: 9999; }
		dialog[open] { display: block; }
		/* menu fixes */ 
		.js-active .sub-menu-trigger[aria-expanded=true] + .sub-menu .sub-animate > * { background: var(--white); }
		.primary-menu .menu-label:hover { color: var(--white); }
	}
}