/* Motion restored in phase 5: the subset of animate.css, FlexSlider and the theme's JS-driven effects
 * that this site actually uses. Everything here is CSS plus the small triggers in site.js. */

/* --- Column entrance (WPBakery css_animation="slideInUp") --- */
.animated { animation-duration: 1s; animation-fill-mode: both; }
@keyframes slideInUp { from { transform: translate3d(0, 100%, 0); visibility: visible; } to { transform: translateZ(0); } }
.slideInUp { animation-name: slideInUp; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.fadeIn { animation-name: fadeIn; }
@media (prefers-reduced-motion: reduce) {
  .animated { animation: none !important; }
  .wpb_animate_when_almost_visible { opacity: 1 !important; }
}

/* --- Slider: slow zoom into the top-left corner while a slide is active (theme did this with JS) --- */
@keyframes hmm-zoom-top-left { from { transform: scale(1); } to { transform: scale(1.25); } }
.carousel-inner .item.active.animate_image.zoom_top_left .image { transform-origin: 0 0; animation: hmm-zoom-top-left 32s linear forwards; }
@keyframes hmm-zoom-center { from { transform: scale(1); } to { transform: scale(1.2); } }
.carousel-inner .item.active.animate_image.zoom_center .image { transform-origin: 50% 50%; animation: hmm-zoom-center 32s linear forwards; }
/* Scroll-linked fade and parallax of the slide content are applied inline by site.js. */
.carousel .slider_content { will-change: opacity; }
.carousel-inner { will-change: transform; }

/* --- Testimonials: FlexSlider crossfade and arrows --- */
.testimonials .slides { position: relative; }
.testimonials .slides > li { display: block; position: absolute; top: 0; left: 0; width: 100%; opacity: 0; transition: opacity .6s ease-in-out; pointer-events: none; }
.testimonials .slides > li.active { position: relative; opacity: 1; pointer-events: auto; }
.testimonials_holder .flex-direction-nav { list-style: none; margin: 0; padding: 0; text-align: center; }
.flex-direction-nav a { display: inline-block; cursor: pointer; }
.flex-direction-nav a:before { font-family: FontAwesome, sans-serif; text-indent: 0; }
.flex-direction-nav .flex-prev:before { content: "\f104"; }
.flex-direction-nav .flex-next:before { content: "\f105"; }

/* --- Lightbox with gallery navigation --- */
.rebuild-lb { position: fixed; inset: 0; background: rgba(0,0,0,.92); z-index: 10000; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .25s; }
.rebuild-lb.on { opacity: 1; }
.rebuild-lb img { max-width: 90vw; max-height: 86vh; box-shadow: 0 0 40px rgba(0,0,0,.6); transition: opacity .25s; }
.rebuild-lb .rebuild-lb-close, .rebuild-lb .rebuild-lb-prev, .rebuild-lb .rebuild-lb-next { position: absolute; color: #fff; font: 36px/1 sans-serif; cursor: pointer; user-select: none; opacity: .8; }
.rebuild-lb .rebuild-lb-close { top: 16px; right: 24px; }
.rebuild-lb .rebuild-lb-prev { left: 20px; top: 50%; transform: translateY(-50%); padding: 20px; }
.rebuild-lb .rebuild-lb-next { right: 20px; top: 50%; transform: translateY(-50%); padding: 20px; }
.rebuild-lb .rebuild-lb-caption { position: absolute; bottom: 18px; left: 0; right: 0; text-align: center; color: #ddd; font: 13px/1.4 Raleway, sans-serif; }

/* --- Mobile menu slide --- */
nav.mobile_menu > ul { overflow: hidden; transition: max-height .35s ease; }

/* --- Counters: fade in (theme transition), then count up --- */
.q_counter_holder { opacity: 0; }
.q_counter_holder.hmm-in { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .q_counter_holder { opacity: 1; } }

/* --- Header search bar: the theme faded it in over the header --- */
.qode_search_form_3.hmm-open { display: block; opacity: 0; transition: opacity .45s ease; }
.qode_search_form_3.hmm-open.hmm-shown { opacity: 1; }
/* --- Search results page --- */
.hmm-search-status { margin: 0 0 30px; color: #cecece; font-style: italic; }
#hmm-search-results article { margin-bottom: 40px; }
#hmm-search-results .post_image { margin-bottom: 15px; }
#hmm-search-results .post_image img { max-height: 320px; width: auto; }
#hmm-search-results .hmm-search-cats { font-style: italic; color: #8a8a8a; }
#hmm-search-results .hmm-search-excerpt { margin: 18px 0 24px; font-size: 16px; line-height: 28px; }
