/**
* Fuel Theme
* Version 5.0.0
**/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Hero
# CTA Row Styles
# Getting Comprehensive ENT Care
# Needing Allergy Relief?
# Having Trouble Hearing?
# Discover Your Newest Look
# Reviews Row
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Hero
--------------------------------------------------------------*/
.home-hero {min-height: 28rem;padding: 3.6rem 1.5rem;overflow: hidden;}
.home-hero-container {max-width: 35rem;}
.home-hero .wp-block-cover__inner-container {
    position: static;
}
.home-hero-title {padding-bottom: clamp(0.7rem,1.6vw,0.85rem);margin-bottom: clamp(1.2rem,4.4vw,2.4rem);position: relative;font-size: clamp(1.6rem,5.2vw,2.8rem);line-height: 1;} 
.home-hero-title:after {content: '';height: 1px;width: 7rem;background: #fff;position: absolute;bottom: 0rem;left: 0;}
.home-hero-title strong {display: block;font-size: clamp(1.2rem,3.7vw,2rem);line-height: 1.25;font-weight: 300;font-style: italic;margin: 0 0 0;}
.home-hero-text {margin-bottom: clamp(1.6rem,5.8vw,3.2rem);}
.home-hero-container .home-hero-button { box-shadow: none; }
.home-hero-bg-icon {position: absolute;right: clamp(-1.3rem,14.5vw - 4rem,9.2rem);bottom: 0;width: clamp(9.6rem, 33vw, 31.25vw);z-index: -1;}
.home-hero-bg-icon svg {opacity: 0;transition: opacity .5s ease .5s;stroke-dasharray: 1400;stroke-dashoffset: 1400;stroke-width: 0;stroke-opacity: 1;fill-opacity: 0;stroke: #fff;animation: draw-svg 2s linear .5s both;animation-play-state: paused;}
.js-intersected .home-hero-bg-icon svg {opacity: 1;animation-play-state: running;}

/* Video Lightbox */
.wp-block-buttons.home-hero-button-container {display: flex;flex-wrap: wrap;gap: 1rem 2rem;}
.home-hero-button-container.wp-block-buttons>.wp-block-button:last-of-type {background: #787878;}
.fuel-lightbox.wp-block-button__link {color: #fff;}
.fuel-lightbox.wp-block-button__link svg {margin-left: 0.5rem;}

.video-controls .video-control.video-pause, .video-controls .video-control.video-play { background: rgba(45,45,45,0.6); } 
.video-controls .video-control.video-pause:hover, .video-controls .video-control.video-play:hover { background: rgba(45,45,45,1); } 
.video-controls .video-control.video-close { background: rgba(84,18,17,0.6); } 
.video-controls .video-control.video-close:hover { background: rgba(84,18,17,1); } 
.video-controls .video-control.video-pause:focus, .video-controls .video-control.video-play:focus, .video-controls .video-control.video-close:focus {outline-color: var(--sent-pink);} 

@media (min-width: 68.5em) { 
    .home-hero {padding-top: clamp(8rem,20.3vw,16.25rem);padding-right: var(--contain-padding);padding-bottom: clamp(4rem,11.2vw,8.95rem);padding-left: var(--contain-padding);height: calc(100vh - 7rem);min-height: 35rem;max-height: 54rem;}
    .home-hero-title strong {margin-left: -2.3rem;line-height: 1;}
}

@media (min-width: 100em) { 
    .home-hero-title strong { margin-left: -4.6rem; }
}

/*--------------------------------------------------------------
# CTA Row Styles
--------------------------------------------------------------*/
#main .cta-decorative-title {position: absolute;top: 1.5rem;right: 1.8rem;color: rgba(47, 51, 68, 0.20);font-size: clamp(1rem, 4vw, 4.4rem);line-height: 0.7;letter-spacing: clamp(0.2rem, 1vw, 0.4rem);}
#main .white-text-row .cta-decorative-title {color: rgba(255, 255, 255, 0.20);right: unset;left: clamp(0.4rem, 2vw, 2.4rem);}
.cta-row {height: calc(100vh - 3.3rem);padding: 2.8rem 1.5rem 3.8rem;position: sticky;top: 0;}
.cta-row-container {max-width: 29rem;}
.cta-row .wp-block-cover__inner-container{position: unset !important}
.left-img-row .cta-row-container { margin-right: 0; margin-left: auto; }
.cta-row-title-top {font-size: clamp(1.2rem,3.7vw,2rem);line-height: 1.25;font-weight: 300;font-style: italic;margin: 0 0 0;}
.cta-row-title {padding-bottom: clamp(0.7rem,1.6vw,0.85rem);margin-bottom: clamp(1.2rem,4.4vw,2.4rem);position: relative;font-size: clamp(1.6rem,5.2vw,2.8rem);line-height: 1;} 
.cta-row-title:after {content: '';height: 1px;width: 7rem;position: absolute;bottom: 0rem;left: 0;}
.cta-row-text {margin-bottom: clamp(1.6rem,5.8vw,3.2rem);}
.black-text-row .cta-row-title:after { background: #000; }
.white-text-row.wp-block-cover .cta-row-title-top, .white-text-row.wp-block-cover .cta-row-title, .white-text-row.wp-block-cover .cta-row-text { color: #fff; }
.white-text-row .cta-row-title:after { background: #fff; }
.white-text-row .cta-row-button {box-shadow: none;}

@media (min-width: 68.5em) { /* 1096px */
    .cta-row {position: sticky;top: 3.25rem;}
}

@media (min-width: 52.5em) { /* 840px */ 
    .left-img-row .cta-row-title-top {margin-left: -2.9rem;}
    .cta-row-container .wp-block-buttons { justify-content: flex-start; }
}

@media (min-width: 68.5em) { 
    .cta-row {padding-top: clamp(8rem,18vw,14.4rem);padding-right: var(--contain-padding);padding-bottom: clamp(3.7rem,22vw,17.6rem);padding-left: var(--contain-padding);height: 95.5vh;height: calc(100vh - 2.2rem);max-height: 60rem;}
    .cta-row-container {max-width: 35rem;}
    .cta-row-title-top {margin-left: -1.5rem;line-height: 1;}
    .cta-row-text {font-size: 1.2rem;}
}

@media (min-width: 100em) { 
    .cta-row-title-top {margin-left: -2.9rem;}
}

/* CAPS Text Animation */
@media (prefers-reduced-motion:no-preference) and (min-width: 27.5em) {
    .cta-row .cta-decorative-title {--move: -10vw;animation: linear slideText both;animation-timeline: view();animation-range: entry 25% cover 50%;}
    .white-text-row .cta-decorative-title {--move: 10vw;}
}

@keyframes slideText {
    to {transform:translateX(var(--move))}
}





/*--------------------------------------------------------------
# Getting Comprehensive ENT Care
--------------------------------------------------------------*/
.comp-ent-care-row:after { content: ''; background: linear-gradient(180deg, rgba(255, 255, 255, 0.60) 0%, #FFF 100%); position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

@media (min-width: 31.25em) { /* 500px */
    .comp-ent-care-row:after {background: linear-gradient(270deg, #FFF 36%, rgba(255, 255, 255, 0.20) 100%),linear-gradient(-50deg, #fff 36%, rgba(255, 255, 255, 0.20) 100%);}
}

@media (min-width: 68.5em) { 
    .comp-ent-care-row:after {background: linear-gradient(270deg, #FFF 36%, rgba(255, 255, 255, 0.20) 100%),linear-gradient(-50deg, #fff 36%, rgba(255, 255, 255, 0.20) 100%);
    background: linear-gradient(270deg, #FFF 36%, rgba(255, 255, 255, 0.20) 100%);}
}


/*--------------------------------------------------------------
# Needing Allergy Relief?
--------------------------------------------------------------*/
.allergy-relief-row:after {content: '';background: linear-gradient(180deg, rgba(47, 68, 67, 0.60) 0%, #2F4443 100%);position: absolute;top: 0;right: 0;bottom: 0;left: 0;}

@media (min-width: 29em) { /* 500px */
    .allergy-relief-row:after {background: linear-gradient(270deg, rgba(47, 68, 67, 0.60) 20%, #2F4443 60%);}
}

@media (min-width: 68.5em) { 
    .allergy-relief-row:after {background: linear-gradient(270deg, rgba(47, 68, 67, 0.60) -10%, #2F4443 65%);}
}


/*--------------------------------------------------------------
# Having Trouble Hearing?
--------------------------------------------------------------*/
.trouble-hearing-row:after { content: ''; background: linear-gradient(180deg, rgba(255, 255, 255, 0.60) 0%, #FFF 100%); position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

@media (min-width: 31.25em) { /* 500px */
    .trouble-hearing-row:after {background: linear-gradient(270deg, #FFF 36%, rgba(255, 255, 255, 0.20) 100%),linear-gradient(-50deg, #fff 36%, rgba(255, 255, 255, 0.20) 100%);}
}

@media (min-width: 68.5em) { 
    .trouble-hearing-row:after {background: linear-gradient(270deg, #FFF 36%, rgba(255, 255, 255, 0.20) 100%),linear-gradient(-50deg, #fff 36%, rgba(255, 255, 255, 0.20) 100%);
    background: linear-gradient(270deg, #FFF 36%, rgba(255, 255, 255, 0.20) 100%);}
}


/*--------------------------------------------------------------
# Discover Your Newest Look
--------------------------------------------------------------*/
.newest-look-row:after {content: '';background: linear-gradient(180deg, rgba(70, 49, 70, 0.20) 0%, #463146 100%);position: absolute;top: 0;right: 0;bottom: 0;left: 0;}

@media (min-width: 29em) { /* 500px */
    .newest-look-row:after {background: linear-gradient(270deg, rgba(70, 49, 70, 0.20) 20%, #463146 60%);}
}

@media (min-width: 68.5em) { 
    .newest-look-row:after {background: linear-gradient(270deg, rgba(70, 49, 70, 0.20) -10%, #463146 65%);}
}


/*--------------------------------------------------------------
# Reviews Row
--------------------------------------------------------------*/
.reviews-row { padding: 2.6rem 0.8rem 1.2rem; } 
.reviews-quotes-icon-container { position: relative; }
.reviews-quotes-icon { position: absolute; top: -1.4rem; right: 0; left: 0; margin: auto; width: 2.8rem; }
.reviews-quotes-icon:before {content: '';position: absolute;top: -1.2rem;right: 0;left: 0;margin: auto;width: 1px;height: 1.2rem;background-image: url(../images/reviews-quotes-line-icon.svg);background-size: contain;}
.reviews-row-container {border-radius: 0.2rem;background: linear-gradient(180deg, rgba(47, 51, 68, 0.00) 0%, rgba(47, 51, 68, 0.10) 100%);padding: 2rem 0.7rem 2.6rem;position: relative;} 
.reviews-row-title {position: relative;margin: 0 0 2rem;font-size: clamp(1.6rem, 3.7vw, 2rem);} 
.reviews-row-title:after {content: '';height: 1px;width: 7rem;position: absolute;right: 0;bottom: -0.8rem;left: 0;margin: auto;background: #000;} 
.reviews-row-stars {margin: 0 0 0.8rem;line-height: 1;}
.reviews-row-text { font-style: italic; margin: 0 0 1.6rem; }

@media (min-width: 38.5em) { 
    .reviews-row-container { padding: 2rem 3rem 2.6rem; }
}

@media (min-width: 68.5em) { 
    .reviews-row { padding: 7.6rem 0 6.4rem; }
    .reviews-row-container {max-width: 50rem;margin: auto;padding: 5.65rem 8.8rem 4rem;}
    .reviews-quotes-icon { width: 6.5rem; top: -3.25rem; }
    .reviews-quotes-icon:before {top: -4.35rem;height: 4.35rem;}
    .reviews-row-text { font-size: 1.2rem; margin: 0 0 2.4rem; }
    .reviews-row-container .wp-block-buttons { justify-content: center; }
}









/**
 * NOTE: If map and/or contact form styling appears on secondary pages, place styles in style.css
 */
