/*
Theme Name: Avada Child [2026-07-23]
Description: Mobile-friendly updates for HomePage
Author: Manny
Template: Avada
Version: 1.0.0
*/

/* HomePage styles */
.hero-mobile-col,
.hero-mobile-col > :first-child {
  padding-top: 0 !important;
}

.hero-text-wrapper > :first-child {
  margin: 0 !important;
}

.fusion-body .fusion-page-title-bar {
  display: none !important;
}

.fusion-video, 
div[class*="video"], 
.fusion-text iframe[src*="vimeo.com"] {
    width: 100% !important;
    max-width: 100% !important;
    clear: both;
}

iframe[src*="vimeo.com"] {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    aspect-ratio: 16 / 9 !important; /* Forces the correct video shape */
    display: block;
}

.fusion-social-networks-wrapper {
  white-space: nowrap;
}

@media (max-width: 768px) {
  .floral h2::after, .floral h1::after {
    margin-left: -15px !important;
    opacity: .3;
  }

  .floral h2::before, .floral h1::before {
    margin-left: -24px !important;
    opacity: .3;
  }

  .meet-founder h2 {
    font-size: 10vw !important;
  }

  .meet-founder h3 {
    font-size: 7vw !important
  }
  
  .meet-founder .fusion-title-13 {
    line-height: 1 !important;
    margin-top: -12px !important;
    padding-bottom: 10px;
  }
  
  .client-stories .awb-swiper-button {
    opacity: .3;
  }
  
  .mobile-drag h3 {
    font-size: 40px !important;
  }

  /* 1. Set up the parent container track */
  .mobile-carousel .fusion-builder-row {
    display: grid !important;
    grid-template-columns: repeat(4, 78vw) !important;
    column-gap: 16px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
    padding-bottom: 20px;
    
    /* ADD THIS: Adds a buffer on the sides so centered cards look natural */
    scroll-padding-inline: 11vw !important; 
    cursor: grab; /* Shows a hand cursor letting users know it's draggable */
  }

  .mobile-carousel .fusion-builder-row:active {
    cursor: grabbing;
  }

  /* 2. Fix the Title Column: Lock its width to the visible screen size */
  .mobile-carousel .fusion-builder-row > .fusion-layout-column:first-child {
    grid-column: 1 / -1 !important; 
    position: sticky !important;    
    left: 0 !important;
    
    width: 100vw !important;         
    max-width: 100% !important;     
    margin-bottom: 24px !important;
    box-sizing: border-box !important;
    padding: 20px 0 20px 40px;
  }

  /* 3. The 4 method cards */
  .mobile-carousel .fusion-builder-row > .fusion-layout-column:not(:first-child) {
    width: 100% !important;
    min-width: 340px !important;
    max-width: 100% !important;
    margin: 0 !important;
    
    /* CHANGED: Swapped 'start' to 'center' */
    scroll-snap-align: center !important; 
  }
  
  #mc4wp-form-1 {
    padding-top: 5px;
  }

  #mc4wp-form-1 .mc4wp-form-fields > :first-child {
    flex-wrap: wrap;
  }
  
  #mc4wp-form-1 .mc4wp-form-fields .button-small {
    width: 100%;
  }
}