/*
Theme Name: LeadClient
Template: ollie
Author: Empirical LLC
Description: Custom theme based on Ollie, developed especially for LeadClient.
License: Proprietary
Text Domain: leadclient
*/

footer .footer-connect-section
{
	z-index: 2
}
footer .footer-logo-section
{
	z-index: 0;
	position: absolute;
    bottom: -12px;
	overflow: hidden!important;
}
.footer-logo-section svg {
    position: absolute;
width: 100vw;
    bottom: 0;
}
footer div#frm_form_2_container {
    margin: 0;
}
.footer-svg-group {
    position: relative;
    bottom: calc(-1rem + 3vw);
    height: 130px;
}
form[id="form_newsletter-signup"] .frm_fields_container {
    display: flex!important;
    justify-content: flex-start!important;
    gap: 14px!important;
}
.frm_field_8_container
{
	display: flex!important;
	flex-grow: 1!important;
	gap: 14px!important
}
.frm_field_8_container, input[name="item_meta[8]"] { flex-grow: 1 }

.button-arrow > a
{
	display: flex;
    flex-wrap: nowrap;
}

.aboutus-subscribe-section
{
    display: flex;
    flex-direction: column;
}
.aboutus-subscribe-section form[id="form_newsletter-signup"] .frm_fields_container
{
    display: flex !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    flex-direction: column;
    align-items: flex-start;
}
.aboutus-subscribe-section form[id="form_newsletter-signup"] .frm_button_submit { padding-top: 10px; padding-bottom: 10px; }
footer
{
	z-index: -1;
}

.button-arrow > a::after,
.aboutus-subscribe-section .frm_button_submit::after{
	content: "";
    width: 0.875em;
    height: 1em;
    margin-left: 0.25em;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48IS0tIUZvbnQgQXdlc29tZSBGcmVlIDYuNy4yIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlL2ZyZWUgQ29weXJpZ2h0IDIwMjUgRm9udGljb25zLCBJbmMuLS0+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTQzOC42IDI3OC42YzEyLjUtMTIuNSAxMi41LTMyLjggMC00NS4zbC0xNjAtMTYwYy0xMi41LTEyLjUtMzIuOC0xMi41LTQ1LjMgMHMtMTIuNSAzMi44IDAgNDUuM0wzMzguOCAyMjQgMzIgMjI0Yy0xNy43IDAtMzIgMTQuMy0zMiAzMnMxNC4zIDMyIDMyIDMybDMwNi43IDBMMjMzLjQgMzkzLjRjLTEyLjUgMTIuNS0xMi41IDMyLjggMCA0NS4zczMyLjggMTIuNSA0NS4zIDBsMTYwLTE2MHoiLz48L3N2Zz4=);
    background-repeat: no-repeat;
    background-size: contain;
    align-self: anchor-center;
}
.aboutus-subscribe-section form[id="form_newsletter-signup"] .frm_button_submit {
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex
;
}

.site-menu 
{
	z-index:99999999
}
.site-menu > .menu-stack {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.site-menu > .menu-stack > .logo-menu-area{
    margin: auto;
}
.site-menu > .wp-block-group > nav {
    display: flex;
    justify-content: end
}
.mobile-hamburger-menu { flex-grow: 0 }

@media (max-width: 1160px)
{
    .mobile-hamburger-menu > button.wp-block-navigation__responsive-container-open  { position: absolute; right: -6px }
}
@media (max-width: 1160px) {
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
        width: 100%;
        font-size: var(--wp--preset--font-size--base);
        padding: 15px 60px 15px 15px;
        border-radius: 5px;
    }
}
@media (width < 1160px)
{
    .mobile-hamburger-menu button[aria-haspopup="dialog"]
    {
        display: flex;
        background: none;
        color: white;
    }
}

@media (max-width: 276px)
{
    .mobile-hamburger-menu > button.wp-block-navigation__responsive-container-open  { position: absolute; right: -18px }
}


.site-menu ul.wp-block-navigation__submenu-container.wp-block-navigation-submenu
{
    background-color: #FFFAE5!important;
}
.site-menu ul.wp-block-navigation__submenu-container.wp-block-navigation-submenu > li > ul
{
    background-color: #FFFAE5!important;
    margin-top: 0px !important;
}

@media (width < 1160px) {
    .wp-block-navigation__responsive-container-open[data-wp-on-async--click="actions.openMenuOnClick"] button {
        position:absolute;
        top:-110px
    }
    div > ul.wp-block-navigation__container {
        display: none;    
    }
    [aria-modal=true] > div > ul.wp-block-navigation__container {
        display: block!important
    }
}
@media(max-width: 1160px)
{
	header div.wp-block-buttons:has(.button-arrow)
	{
		display: none!important;
	}
	header .wp-block-navigation-item__content { color: var(--wp--preset--color--main)!important }
}
@media only screen and (max-width: 1160px) {
    .wp-block-navigation__responsive-container-close {
        background: var(--wp--preset--color--tertiary);
        color: var(--wp--preset--color--main);
    }
}
@media only screen and (max-width: 1160px) {
    .wp-block-navigation__responsive-container-close, .wp-block-navigation__responsive-container-open {
        padding: 4px;
        border-radius: 3px;
        background: var(--wp--preset--color--tertiary);
        color: var(--wp--preset--color--main);
    }
}
form[id="form_newsletter-signup"] .frm_fields_container
{
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-gap: unset;
}
form[id="form_newsletter-signup"] fieldset
{
    border: none;
    padding-left: 0;
}
form[id="form_newsletter-signup"] .frm_button_submit
{
    padding-top: var(--wp--preset--spacing--small);
    padding-right: var(--wp--preset--spacing--medium);
    padding-bottom: var(--wp--preset--spacing--small);
    padding-left: var(--wp--preset--spacing--medium);
    font-style: normal;
    font-weight: 700;
    font-family: var(--wp--preset--font-family--default) !important;
    font-size: var(--wp--preset--font-size--x-small) !important;
    background-color: var(--wp--preset--color--primary-accent) !important;
    border-radius: 45px;
    cursor: pointer;
    border: none;
    color: white;
}
form#form_newsletter-signup div.frm_error { color: white!important }
form[id="form_newsletter-signup"] .frm_button_submit:hover
{
    text-decoration: underline
}
.hero-2
{
	z-index: -1
}
.forinvestors-background-section { background-size: 100% clamp(25vh, 50vw, 86%) !important; }
header nav li.current-menu-item.wp-block-navigation-link a,
footer nav li.current-menu-item.wp-block-navigation-link a{
    text-decoration: none!important;
    color: #D7EFA7!important;
}
header nav li.wp-block-navigation-item.wp-block-navigation-link a:hover,
footer nav li.wp-block-navigation-item.wp-block-navigation-link a:hover{
    text-decoration: none!important;
    color: #edf8d7!important;
}

@media(width<782px)
{
    footer #form_newsletter-signup .frm_fields_container
    {
        flex-direction: column;
        align-items: flex-start;
    }
	.ready-to-start-section
	{
		text-align:center;
		margin-bottom: -5.75em!important;
	}
	.aboutus-subscribe-section form[id="form_newsletter-signup"] .frm_fields_container
	{
		align-items: center;
	}
	.ready-to-start-section #frm_field_8_container,
	.ready-to-start-section #frm_field_6_container
	{
		display: inline-flex !important;
        justify-content: space-between;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
	}
	.ready-to-start-section #frm_field_8_container input
	{
		text-align: center
	}
	.ready-to-start-section form[id="form_newsletter-signup"] .frm_button_submit { padding-top: 10px; padding-bottom: 10px; display: flex ; width: 100%; justify-content: center; }
}
@media(min-width: 1040px)
{
  .how-it-works-card-row {            /* ← adjust selector to your actual wrapper */
    display: flex;
    flex-wrap: wrap;               /* if you want them to wrap on smaller screens */
    align-items: stretch;          /* ensure children stretch to match height */
    gap: 20px;                      /* optional spacing between cards */
  }
  
  .how-it-works-card-row .how-it-works-card {
    display: flex;
    flex-direction: column;
    flex: 1;                        /* all cards share available width equally */
    min-width: 200px;               /* optionally prevent them from getting too narrow */
  }
  
  .how-it-works-card-row  .how-it-works-card > div {
    flex: 1;                        /* grow to fill the card’s height */
  }
}
@media (min-width: 780px) and (max-width: 1039px) {
  /* make the row a flex container again */
  .how-it-works-card-row {
    display: flex!important;
    flex-wrap: wrap!important;
    align-items: stretch!important;   /* equal‑height per row */
    gap: 20px!important;
  }

  /* force exactly two cards per line */
  .how-it-works-card-row .how-it-works-card {
    display: flex!important;
    flex-direction: column!important;
    /* 50% minus half the gap (so two items + one gap fit perfectly) */
    flex: 0 0 calc(50% - 10px)!important;
  }

  /* same inner‑div stretch you already have */
  .how-it-works-card-row .how-it-works-card > div {
    flex: 1!important;
  }
}

.flip-card {
  perspective: 1000px;
  display: inline-block;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.6s ease-in;
  transform-origin: center center;
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front,
.flip-card-back {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  backface-visibility: hidden;
}

.flip-card-back {
	transform: rotateY(180deg);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 30px;
}
	.flip-card-back a.wp-block-button__link {
    max-width: fit-content;
    min-height: fit-content;
    height: unset;
}
	/* 1) define the wiggle keyframes */
@keyframes wiggle {
  0%, 100% { transform: rotateY(0deg); }
  33%      { transform: rotateY(16deg); }
  66%      { transform: rotateY(-16deg); }
}

/* 2) only run the wiggle when we add the .wiggle class */
.flip-card-inner.wiggle {
  animation: wiggle 0.8s ease-in-out forwards;
}

/* 3) while hovering (i.e. flipping), suspend the wiggle */
.flip-card:hover .flip-card-inner {
  animation: none;
  transform: rotateY(180deg);
}
.flip-card-front {
  /* your existing Gutenberg BG */
  background-size: cover;
  background-position: 61%;
  
  /* add a dark-green color on top */
  background-color: rgba(0, 31, 30, 0.61);
  border-radius: 30px;
  /* multiply blend the color into the image */
  background-blend-mode: multiply;
}
@media (max-width: 782px) {
  /* 1) Make the outer Columns block stack vertically */
  .wp-block-columns {
    display: flex !important;
    flex-direction: column !important;
  }
  .wp-block-columns .wp-block-column {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* If you’re using a CSS-grid‐based “Grid” block instead, uncomment: */
  
  .flip-card-group {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: var(--wp--style--block-gap) !important;
  }
  

  /* 2) Force each card to be full-width and add spacing */
  .flip-card {
    display: block !important;
    width: 100% !important;
    margin-bottom: 1.5rem;
  }
}
.lazyload {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}

/* when the image has loaded, this class will be toggled */
.lazyloaded {
  opacity: 1;
}

.buttons-selector-inline {
   overflow: hidden !important;
}
.swiper-container {
   width: 100%;
}