.elementor-34 .elementor-element.elementor-element-627f59a{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-34 .elementor-element.elementor-element-627f59a:not(.elementor-motion-effects-element-type-background), .elementor-34 .elementor-element.elementor-element-627f59a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;background-image:url("https://fitandflourishofficial.com/wp-content/uploads/2025/12/homescreen-1.webp");background-position:center center;background-size:cover;}.elementor-34 .elementor-element.elementor-element-627f59a.e-con{--align-self:center;}@media(max-width:767px){.elementor-34 .elementor-element.elementor-element-627f59a:not(.elementor-motion-effects-element-type-background), .elementor-34 .elementor-element.elementor-element-627f59a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-size:cover;}}/* Start custom CSS for container, class: .elementor-element-627f59a */svg path {
  fill: transparent;
  stroke: #fff;
  stroke-width: 1;
  stroke-dasharray: 500;
  stroke-dashoffset: 500; /* Start fully hidden */
  animation: drawStroke 4s ease-in-out forwards, fillColor 1s ease-in-out 4s forwards;
}

@keyframes drawStroke {
  from {
    stroke-dashoffset: 500; /* Fully hidden */
  }
  to {
    stroke-dashoffset: 0; /* Fully drawn */
  }
}

@keyframes fillColor {
  from {
    fill: transparent; /* No fill initially */
  }
  to {
    fill: #ffce06; /* Fully filled after stroke completes */
  }
}
@keyframes bgZoom {
    0% { background-size: 100%; }
    100% { background-size: 200%; }
}

.banner {
    
    background-size: 100%;
    background-position: center;
    animation: bgZoom 4s ease-out forwards;
}
@keyframes bgScaleDown {
    0% { background-size: 110%; }
    100% { background-size: 100%; }
}

.banner2 {
    background-size: 110%;
    background-position: center;
    animation: bgScaleDown 4s ease-out forwards;

    
}

.elementor-34 .elementor-element.elementor-element-627f59a svg {
  display: block;
  margin: 0 auto;
  transform: translateX(6%);
}

/* Mobile: recenter perfectly */
@media (max-width: 768px) {
  .elementor-34 .elementor-element.elementor-element-627f59a svg {
    transform: translateX(11%) !important;
  }
}/* End custom CSS */