/* Debug Report Styling */
.sd-debug-report {
    background: #f8f9fa;
    border: 2px solid #0073aa;
    border-radius: 8px;
    padding: 15px;
    margin: 20px 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 14px;
    line-height: 1.5;
}

.sd-debug-report h3 {
    color: #0073aa;
    margin: 0 0 15px 0;
    font-size: 18px;
    font-weight: 600;
}

.sd-debug-success {
    color: #155724;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 4px;
    padding: 10px;
    margin: 0;
}

.sd-debug-warning {
    color: #856404;
    background: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 4px;
    padding: 10px;
    margin: 5px 0;
}

.sd-debug-info {
    background: #e7f3ff;
    border: 1px solid #b8daff;
    border-radius: 4px;
    padding: 10px;
    margin: 10px 0 0 0;
}

.sd-debug-info p {
    margin: 5px 0;
    color: #004085;
}

/* Fallback Message Styling - Mobile First */
.sd-fallback-message,
.sd-vehicle-fallback-notice {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
    border-radius: 12px;
    padding: 15px;
    margin-bottom: 20px;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.sd-fallback-message p,
.sd-vehicle-fallback-notice p {
    margin: 0;
    font-size: 14px;
    color: #495057;
    line-height: 1.6;
}

.sd-fallback-message strong,
.sd-vehicle-fallback-notice strong {
    color: #212529;
    font-weight: 600;
}

/* Tablet and up */
@media (min-width: 768px) {
    .sd-fallback-message,
    .sd-vehicle-fallback-notice {
        padding: 20px;
        margin-bottom: 30px;
    }
    
    .sd-fallback-message p,
    .sd-vehicle-fallback-notice p {
        font-size: 16px;
    }
}

/* Hero Title - Mobile First */
#hero-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: clamp(2.5rem, 4vw, 3rem); /* Mobile: 40px, Desktop: 48px */
    text-transform: uppercase;
    color: #FFFFFF;
    line-height: 1.1;
    margin-bottom: 0.75rem;
}

/* Tablet and up */
@media (min-width: 768px) {
    #hero-title {
        font-size: clamp(3rem, 5vw, 4rem); /* Tablet: 48px, Desktop: 64px */
        margin-bottom: 1rem;
    }
}

/* Hero Subtitle - Mobile First */
#hero-subtitle {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 1rem; /* Mobile: 16px */
    color: #FFFFFF;
    line-height: 1.4;
    margin-bottom: 1.5rem;
    opacity: 0.9;
}

/* Tablet and up */
@media (min-width: 768px) {
    #hero-subtitle {
        font-size: 1.25rem; /* Tablet: 20px */
        margin-bottom: 2rem;
    }
}

/* Desktop and up */
@media (min-width: 1024px) {
    #hero-subtitle {
        font-size: 1.5rem; /* Desktop: 24px */
    }
}
  
/* Headlines (H2, Section Titles) - Mobile First */
h2,
.section-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: clamp(1.5rem, 3vw, 2rem); /* Mobile: 24px, Desktop: 32px */
    text-transform: uppercase;
    color: #000000;
    margin-bottom: 15px;
    line-height: 1.2;
}

/* Tablet and up */
@media (min-width: 768px) {
    h2,
    .section-title {
        font-size: clamp(2rem, 4vw, 2.5rem); /* Tablet: 32px, Desktop: 40px */
        margin-bottom: 20px;
    }
}

/* Body Text - Mobile First */
body,
p,
.body-text {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 16px; /* Mobile: 16px */
    color: #333333;
    line-height: 1.6;
}

/* Tablet and up */
@media (min-width: 768px) {
    body,
    p,
    .body-text {
        font-size: 18px; /* Tablet/Desktop: 18px */
    }
}
  
  /* Smaller descriptions for "Why Buy" section */
  .small-description {
    font-size: 16px;
  }
  
  
  /* Red Button - Higher specificity to override Beaver Builder */
  .fl-builder-content .btn-red .fl-button,
  .fl-module.btn-red .fl-button {
    background-color: #cc0000 !important;
    color: #FFFFFF !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    padding: 15px 30px !important;
    border-radius: 5px !important;
    border: none !important;
    transition: background-color 0.3s ease !important;
    text-decoration: none !important;
  }
  
  .fl-builder-content .btn-red .fl-button:hover,
  .fl-module.btn-red .fl-button:hover {
    background-color: #a30000 !important;
  }
  
  /* White Button - Higher specificity to override Beaver Builder */
  .fl-builder-content .btn-white .fl-button,
  .fl-module.btn-white .fl-button {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 2px solid #000000 !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    padding: 15px 30px !important;
    border-radius: 5px !important;
    transition: background-color 0.3s ease !important;
    text-decoration: none !important;
  }
  
  .fl-builder-content .btn-white .fl-button:hover,
  .fl-module.btn-white .fl-button:hover {
    background-color: #f2f2f2 !important;
  }
  /* Icons for "Why Buy" Section */
  .why-buy-icon,
  .icon {
    font-size: 48px;
    color: #cc0000;
    margin-bottom: 15px;
    display: block;
  }
  
/* Super Dave's Auto Sales - Vehicle Scroller Styles */
/* Mobile-First Design */

/* ========================================
   PURE CSS RESPONSIVE GRID LAYOUT
   ======================================== */

/* Container for responsive grid */
.vehicle-scroller-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #ccc transparent;
}

.vehicle-scroller-container::-webkit-scrollbar {
    height: 6px;
}

.vehicle-scroller-container::-webkit-scrollbar-track {
    background: transparent;
}

.vehicle-scroller-container::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}

.vehicle-scroller-container::-webkit-scrollbar-thumb:hover {
    background: #999;
}

/* Grid layout for vehicle cards */
.vehicle-scroller-slider {
    display: grid;
    gap: 1rem;
    grid-auto-flow: column;
    grid-auto-columns: minmax(280px, 1fr);
    padding: 0.5rem 0;
}

/* Mobile: Single column with horizontal scroll */
@media (max-width: 479px) {
    .vehicle-scroller-slider {
        grid-auto-columns: minmax(260px, 1fr);
        gap: 0.75rem;
    }
}

/* Small mobile landscape: Slightly wider cards */
@media (min-width: 480px) and (max-width: 767px) {
    .vehicle-scroller-slider {
        grid-auto-columns: minmax(300px, 1fr);
        gap: 1rem;
    }
}

/* Tablet: Keep horizontal scroll */
@media (min-width: 768px) and (max-width: 1023px) {
    .sdas-vehicle-scroller .vehicle-scroller-slider {
        grid-auto-columns: minmax(300px, 1fr);
        gap: 1.5rem;
    }
    
    .sdas-vehicle-scroller .sd-vehicle-image {
        height: 200px;
    }
}

/* Desktop: Keep horizontal scroll */
@media (min-width: 1024px) and (max-width: 1199px) {
    .sdas-vehicle-scroller .vehicle-scroller-slider {
        grid-auto-columns: minmax(320px, 1fr);
        gap: 1.5rem;
    }
    
    .sdas-vehicle-scroller .sd-vehicle-image {
        height: 220px;
    }
}

/* Large desktop: Keep horizontal scroll */
@media (min-width: 1200px) {
    .sdas-vehicle-scroller .vehicle-scroller-slider {
        grid-auto-columns: minmax(320px, 1fr);
        gap: 2rem;
    }
    
    .sdas-vehicle-scroller .sd-vehicle-image {
        height: 240px;
    }
}

/* ========================================
   MAIN VEHICLE SCROLLER STYLES
   ======================================== */
  
  /* Base styles for mobile (320px+) */
  #sd-filtered-vehicle-scroller {
      margin: 1rem 0;
      position: relative;
      padding: 0 10px;
  }
  
  /* Hide scrollbar for infinite scroll */
  #sd-filtered-vehicle-scroller .vehicle-scroller-container {
      overflow-x: hidden; /* Hide scrollbar */
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none; /* Firefox */
      -ms-overflow-style: none; /* IE and Edge */
      scroll-behavior: smooth;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-scroller-container::-webkit-scrollbar {
      display: none; /* Chrome, Safari, Opera */
  }
  
  /* Ensure horizontal scrolling */
  #sd-filtered-vehicle-scroller .vehicle-scroller-slider {
      display: grid;
      gap: 0.75rem;
      grid-auto-flow: column;
      grid-auto-columns: minmax(240px, 1fr);
      padding: 0.5rem 0;
      /* Remove any conflicting grid-template-columns */
      grid-template-columns: none !important;
  }
  
  /* Vehicle item styling */
  #sd-filtered-vehicle-scroller .sd-vehicle-item {
      background: #fff;
      border-radius: 8px;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
      overflow: hidden;
      transition: all 0.2s ease;
      min-height: 220px;
      display: flex;
      flex-direction: column;
  }
  
  #sd-filtered-vehicle-scroller .sd-vehicle-image {
      position: relative;
      height: 120px;
      overflow: hidden;
  }
  
  #sd-filtered-vehicle-scroller .sd-vehicle-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.2s ease;
  }
  
  #sd-filtered-vehicle-scroller .sd-vehicle-details {
      padding: 12px;
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
  }
  
  #sd-filtered-vehicle-scroller .sd-vehicle-title {
      margin: 0 0 6px 0;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.2;
      color: #333;
  }
  
  #sd-filtered-vehicle-scroller .sd-vehicle-price {
      font-size: 16px;
      font-weight: 700;
      color: #007cba;
      margin-bottom: 8px;
  }
  
  #sd-filtered-vehicle-scroller .sd-vehicle-link {
      display: inline-block;
      background: linear-gradient(135deg, #007cba, #005a8b);
      color: #fff;
      padding: 8px 16px;
      border-radius: 16px;
      text-decoration: none;
      font-weight: 600;
      font-size: 12px;
      transition: all 0.2s ease;
      box-shadow: 0 2px 8px rgba(0, 124, 186, 0.3);
      text-align: center;
  }
  
  #sd-filtered-vehicle-scroller .sd-vehicle-link:hover {
      background: linear-gradient(135deg, #005a8b, #007cba);
      transform: translateY(-1px);
      box-shadow: 0 4px 16px rgba(0, 124, 186, 0.4);
      color: #fff;
  }
  
  #sd-filtered-vehicle-scroller .scroller-title {
      text-align: center;
      margin-bottom: 1.5rem;
      font-size: 1.5rem;
      font-weight: 600;
      color: #333;
      line-height: 1.2;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-scroller-container {
      position: relative;
      padding: 10px 0;
      /* Grid layout handled above */
  }
  
  #sd-filtered-vehicle-scroller .vehicle-card {
      padding: 8px;
      /* Reduced perspective for mobile performance */
      transform: perspective(800px);
  }
  
  #sd-filtered-vehicle-scroller .vehicle-card-inner {
      background: #fff;
      border-radius: 12px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      overflow: hidden;
      transition: all 0.2s ease;
      transform: translateY(0);
      position: relative;
      /* Touch-friendly tap targets */
      min-height: 300px;
  }
  
  /* Subtle hover for mobile (touch devices) */
  #sd-filtered-vehicle-scroller .vehicle-card-inner:active {
      transform: translateY(-2px);
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
  }
  
  #sd-filtered-vehicle-scroller .vehicle-image {
      position: relative;
      height: 160px;
      overflow: hidden;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.2s ease;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-card-inner:active .vehicle-image img {
      transform: scale(1.02);
  }
  
  #sd-filtered-vehicle-scroller .price-badge {
      position: absolute;
      top: 12px;
      right: 12px;
      background: rgba(0, 0, 0, 0.85);
      color: #fff;
      padding: 6px 10px;
      border-radius: 16px;
      font-weight: 600;
      font-size: 12px;
      /* Remove backdrop-filter for better mobile performance */
  }
  
  #sd-filtered-vehicle-scroller .vehicle-details {
      padding: 16px;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-title {
      margin: 0 0 8px 0;
      font-size: 16px;
      font-weight: 600;
      line-height: 1.3;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-title a {
      color: #333;
      text-decoration: none;
      transition: color 0.2s ease;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-title a:active {
      color: #007cba;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-specs {
      margin-bottom: 12px;
      color: #666;
      font-size: 13px;
      line-height: 1.4;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-trim {
      margin-bottom: 12px;
      color: #888;
      font-size: 12px;
      line-height: 1.3;
      font-style: italic;
  }
  
  #sd-filtered-vehicle-scroller .vehicle-actions {
      text-align: center;
  }
  
  #sd-filtered-vehicle-scroller .btn-view-details {
      display: inline-block;
      background: linear-gradient(135deg, #007cba, #005a8b);
      color: #fff;
      padding: 12px 24px;
      border-radius: 24px;
      text-decoration: none;
      font-weight: 600;
      font-size: 14px;
      transition: all 0.2s ease;
      box-shadow: 0 3px 12px rgba(0, 124, 186, 0.3);
      /* Touch-friendly button size */
      min-height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  #sd-filtered-vehicle-scroller .btn-view-details:active {
      background: linear-gradient(135deg, #005a8b, #007cba);
      transform: translateY(-1px);
      box-shadow: 0 4px 16px rgba(0, 124, 186, 0.4);
      color: #fff;
  }
  
  /* Small mobile landscape (480px+) */
  @media (min-width: 480px) {
      #sd-filtered-vehicle-scroller {
          margin: 1.5rem 0;
          padding: 0 15px;
      }
      
      #sd-filtered-vehicle-scroller .scroller-title {
          font-size: 1.75rem;
          margin-bottom: 2rem;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-scroller-slider {
          grid-auto-columns: minmax(260px, 1fr);
          gap: 0.75rem;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-image {
          height: 140px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-details {
          padding: 14px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-title {
          font-size: 15px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-link {
          padding: 9px 18px;
          font-size: 13px;
      }
  }
  
  /* Tablet styles for sd-filtered-vehicle-scroller */
  @media (min-width: 768px) {
      #sd-filtered-vehicle-scroller .vehicle-scroller-slider {
          grid-auto-columns: minmax(280px, 1fr);
          gap: 1rem;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-item {
          border-radius: 10px;
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          transition: all 0.3s ease;
          transform: translateY(0);
          min-height: 240px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-item:hover {
          transform: translateY(-4px);
          box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-image {
          height: 160px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-image img {
          transition: transform 0.3s ease;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-item:hover .sd-vehicle-image img {
          transform: scale(1.05);
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-details {
          padding: 16px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-title {
          font-size: 16px;
          margin-bottom: 8px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-price {
          font-size: 18px;
          margin-bottom: 10px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-link {
          padding: 10px 20px;
          font-size: 13px;
          transition: all 0.3s ease;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-link:hover {
          transform: translateY(-2px);
          box-shadow: 0 4px 15px rgba(0, 124, 186, 0.4);
      }
  }
  
  /* Desktop styles for sd-filtered-vehicle-scroller */
  @media (min-width: 1024px) {
      #sd-filtered-vehicle-scroller .vehicle-scroller-slider {
          grid-auto-columns: minmax(300px, 1fr);
          gap: 1.25rem;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-image {
          height: 180px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-details {
          padding: 18px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-title {
          font-size: 17px;
          margin-bottom: 9px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-price {
          font-size: 19px;
          margin-bottom: 11px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-link {
          padding: 11px 22px;
          font-size: 14px;
      }
  }
  
  /* Large desktop styles for sd-filtered-vehicle-scroller */
  @media (min-width: 1200px) {
      #sd-filtered-vehicle-scroller .vehicle-scroller-slider {
          grid-auto-columns: minmax(320px, 1fr);
          gap: 1.5rem;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-image {
          height: 200px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-details {
          padding: 20px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-title {
          font-size: 18px;
          margin-bottom: 10px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-price {
          font-size: 20px;
          margin-bottom: 12px;
      }
      
      #sd-filtered-vehicle-scroller .sd-vehicle-link {
          padding: 12px 24px;
          font-size: 14px;
      }
  }
  
  /* Tablet portrait (768px+) */
  @media (min-width: 768px) {
      #sd-filtered-vehicle-scroller {
          margin: 2rem 0;
          padding: 0 20px;
      }
      
      #sd-filtered-vehicle-scroller .scroller-title {
          font-size: 2rem;
          margin-bottom: 2.5rem;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-scroller-container {
          padding: 15px 0;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-card {
          padding: 12px;
          transform: perspective(1000px);
      }
      
      #sd-filtered-vehicle-scroller .vehicle-card-inner {
          border-radius: 15px;
          box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
          transition: all 0.3s ease;
          transform: translateY(0) rotateX(0deg);
      }
      
      #sd-filtered-vehicle-scroller .vehicle-card-inner:hover {
          transform: translateY(-8px) rotateX(3deg);
          box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
      }
      
      #sd-filtered-vehicle-scroller .vehicle-image {
          height: 200px;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-image img {
          transition: transform 0.3s ease;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-card:hover .vehicle-image img {
          transform: scale(1.05);
      }
      
      #sd-filtered-vehicle-scroller .price-badge {
          padding: 8px 12px;
          font-size: 14px;
          backdrop-filter: blur(10px);
      }
      
      #sd-filtered-vehicle-scroller .vehicle-details {
          padding: 20px;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-title {
          font-size: 18px;
          margin-bottom: 10px;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-title a:hover {
          color: #007cba;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-specs {
          font-size: 14px;
          margin-bottom: 15px;
      }
      
      #sd-filtered-vehicle-scroller .btn-view-details {
          padding: 10px 20px;
          font-size: 14px;
          transition: all 0.3s ease;
      }
      
      #sd-filtered-vehicle-scroller .btn-view-details:hover {
          transform: translateY(-2px);
          box-shadow: 0 6px 20px rgba(0, 124, 186, 0.4);
      }
  }
  
  /* Desktop (1024px+) */
  @media (min-width: 1024px) {
      #sd-filtered-vehicle-scroller .vehicle-card-inner:hover {
          transform: translateY(-10px) rotateX(5deg);
          box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
      }
      
      #sd-filtered-vehicle-scroller .vehicle-card:hover .vehicle-image img {
          transform: scale(1.08);
      }
  }
  
  /* Large desktop (1200px+) */
  @media (min-width: 1200px) {
      #sd-filtered-vehicle-scroller {
          padding: 0;
      }
      
      #sd-filtered-vehicle-scroller .vehicle-scroller-container {
          padding: 20px 0;
      }
  }
  
  /* ========================================
     FEATURED VEHICLE SCROLLER STYLES
     ======================================== */
  
  /* Base mobile styles */
  #sd-featured-vehicle-scroller {
      margin: 1rem 0;
      position: relative;
      padding: 0 10px;
  }
  
  #sd-featured-vehicle-scroller .scroller-title {
      text-align: center;
      margin-bottom: 1.5rem;
      font-size: 1.5rem;
      font-weight: 600;
      color: #333;
      line-height: 1.2;
  }
  
  #sd-featured-vehicle-scroller .vehicle-scroller-container {
      position: relative;
      padding: 10px 0;
      /* Grid layout handled above */
  }
  
  #sd-featured-vehicle-scroller .vehicle-card {
      padding: 8px;
      transform: perspective(800px);
  }
  
  #sd-featured-vehicle-scroller .vehicle-card-inner {
      background: #fff;
      border-radius: 12px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      overflow: hidden;
      transition: all 0.2s ease;
      transform: translateY(0);
      position: relative;
      min-height: 300px;
  }
  
  #sd-featured-vehicle-scroller .featured-badge {
      position: absolute;
      top: 12px;
      left: 12px;
      background: linear-gradient(135deg, #ff6b35, #f7931e);
      color: #fff;
      padding: 5px 10px;
      border-radius: 12px;
      font-weight: 700;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 0.3px;
      box-shadow: 0 2px 8px rgba(255, 107, 53, 0.3);
      z-index: 2;
  }
  
  #sd-featured-vehicle-scroller .price-badge {
      position: absolute;
      top: 12px;
      right: 12px;
      background: rgba(0, 0, 0, 0.9);
      color: #fff;
      padding: 6px 10px;
      border-radius: 16px;
      font-weight: 600;
      font-size: 12px;
  }
  
  /* Mobile touch interaction */
  #sd-featured-vehicle-scroller .vehicle-card-inner:active {
      transform: translateY(-3px);
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
  }
  
  #sd-featured-vehicle-scroller .vehicle-image {
      position: relative;
      height: 160px;
      overflow: hidden;
  }
  
  #sd-featured-vehicle-scroller .vehicle-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.2s ease;
  }
  
  #sd-featured-vehicle-scroller .vehicle-card-inner:active .vehicle-image img {
      transform: scale(1.02);
  }
  
  #sd-featured-vehicle-scroller .vehicle-details {
      padding: 16px;
  }
  
  #sd-featured-vehicle-scroller .vehicle-title {
      margin: 0 0 8px 0;
      font-size: 16px;
      font-weight: 600;
      line-height: 1.3;
  }
  
  #sd-featured-vehicle-scroller .vehicle-title a {
      color: #333;
      text-decoration: none;
      transition: color 0.2s ease;
  }
  
  #sd-featured-vehicle-scroller .vehicle-title a:active {
      color: #007cba;
  }
  
  #sd-featured-vehicle-scroller .vehicle-specs {
      margin-bottom: 12px;
      color: #666;
      font-size: 13px;
      line-height: 1.4;
  }
  
  #sd-featured-vehicle-scroller .vehicle-trim {
      margin-bottom: 12px;
      color: #888;
      font-size: 12px;
      line-height: 1.3;
      font-style: italic;
  }
  
  #sd-featured-vehicle-scroller .vehicle-actions {
      text-align: center;
  }
  
  #sd-featured-vehicle-scroller .btn-view-details {
      display: inline-block;
      background: linear-gradient(135deg, #007cba, #005a8b);
      color: #fff;
      padding: 12px 24px;
      border-radius: 24px;
      text-decoration: none;
      font-weight: 600;
      font-size: 14px;
      transition: all 0.2s ease;
      box-shadow: 0 3px 12px rgba(0, 124, 186, 0.3);
      min-height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  #sd-featured-vehicle-scroller .btn-view-details:active {
      background: linear-gradient(135deg, #005a8b, #007cba);
      transform: translateY(-1px);
      box-shadow: 0 4px 16px rgba(0, 124, 186, 0.4);
      color: #fff;
  }
  
  /* Small mobile landscape (480px+) */
  @media (min-width: 480px) {
      #sd-featured-vehicle-scroller {
          margin: 1.5rem 0;
          padding: 0 15px;
      }
      
      #sd-featured-vehicle-scroller .scroller-title {
          font-size: 1.75rem;
          margin-bottom: 2rem;
      }
      
      #sd-featured-vehicle-scroller .vehicle-card {
          padding: 10px;
      }
      
      #sd-featured-vehicle-scroller .vehicle-image {
          height: 180px;
      }
      
      #sd-featured-vehicle-scroller .vehicle-details {
          padding: 18px;
      }
      
      #sd-featured-vehicle-scroller .vehicle-title {
          font-size: 17px;
      }
      
      #sd-featured-vehicle-scroller .btn-view-details {
          padding: 10px 20px;
      }
  }
  
  /* Tablet and up */
  @media (min-width: 768px) {
      #sd-featured-vehicle-scroller {
          margin: 2rem 0;
          padding: 0 20px;
      }
      
      #sd-featured-vehicle-scroller .scroller-title {
          font-size: 2rem;
          margin-bottom: 2.5rem;
      }
      
      #sd-featured-vehicle-scroller .vehicle-scroller-container {
          padding: 15px 0;
      }
      
      #sd-featured-vehicle-scroller .vehicle-card {
          padding: 12px;
          transform: perspective(1000px);
      }
      
      #sd-featured-vehicle-scroller .vehicle-card-inner {
          border-radius: 15px;
          box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
          transition: all 0.3s ease;
          transform: translateY(0) rotateX(0deg);
      }
      
      #sd-featured-vehicle-scroller .featured-badge {
          top: 15px;
          left: 15px;
          padding: 6px 12px;
          border-radius: 15px;
          font-size: 12px;
          letter-spacing: 0.5px;
          box-shadow: 0 4px 15px rgba(255, 107, 53, 0.4);
      }
      
      #sd-featured-vehicle-scroller .price-badge {
          right: 15px;
          padding: 8px 12px;
          font-size: 14px;
          backdrop-filter: blur(10px);
      }
      
      #sd-featured-vehicle-scroller .vehicle-card-inner:hover {
          transform: translateY(-12px) rotateX(6deg);
          box-shadow: 0 20px 45px rgba(0, 0, 0, 0.25);
      }
      
      #sd-featured-vehicle-scroller .vehicle-image {
          height: 200px;
      }
      
      #sd-featured-vehicle-scroller .vehicle-image img {
          transition: transform 0.3s ease;
      }
      
      #sd-featured-vehicle-scroller .vehicle-card:hover .vehicle-image img {
          transform: scale(1.05);
      }
      
      #sd-featured-vehicle-scroller .vehicle-details {
          padding: 20px;
      }
      
      #sd-featured-vehicle-scroller .vehicle-title {
          font-size: 18px;
          margin-bottom: 10px;
      }
      
      #sd-featured-vehicle-scroller .vehicle-title a:hover {
          color: #007cba;
      }
      
      #sd-featured-vehicle-scroller .vehicle-specs {
          font-size: 14px;
          margin-bottom: 15px;
      }
      
      #sd-featured-vehicle-scroller .btn-view-details {
          padding: 10px 20px;
          font-size: 14px;
          transition: all 0.3s ease;
      }
      
      #sd-featured-vehicle-scroller .btn-view-details:hover {
          transform: translateY(-2px);
          box-shadow: 0 6px 20px rgba(0, 124, 186, 0.4);
      }
  }
  
  /* Desktop */
  @media (min-width: 1024px) {
      #sd-featured-vehicle-scroller .vehicle-card-inner:hover {
          transform: translateY(-15px) rotateX(8deg);
          box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);
      }
      
      #sd-featured-vehicle-scroller .vehicle-card:hover .vehicle-image img {
          transform: scale(1.08);
      }
  }
  
  /* Large desktop (1200px+) */
  @media (min-width: 1200px) {
      #sd-featured-vehicle-scroller {
          padding: 0;
      }
      
      #sd-featured-vehicle-scroller .vehicle-scroller-container {
          padding: 20px 0;
      }
  }
  
  /* ========================================
     NO VEHICLES MESSAGE STYLES
     ======================================== */
  
  #sd-filtered-vehicle-scroller .no-vehicles-message,
  #sd-featured-vehicle-scroller .no-vehicles-message {
      text-align: center;
      padding: 2rem 1rem;
      background: #f8f9fa;
      border-radius: 12px;
      margin: 2rem 0;
  }
  
  #sd-filtered-vehicle-scroller .no-vehicles-message p,
  #sd-featured-vehicle-scroller .no-vehicles-message p {
      margin: 0;
      color: #666;
      font-size: 16px;
      line-height: 1.5;
  }
  
  #sd-filtered-vehicle-scroller .no-vehicles-message a,
  #sd-featured-vehicle-scroller .no-vehicles-message a {
      color: #007cba;
      text-decoration: none;
      font-weight: 600;
  }
  
  #sd-filtered-vehicle-scroller .no-vehicles-message a:hover,
  #sd-featured-vehicle-scroller .no-vehicles-message a:hover {
      text-decoration: underline;
  }
  
  /* ========================================
     CAROUSEL NAVIGATION STYLES
     ======================================== */
  
/* Navigation container - Mobile First */
.vehicle-scroller-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding: 0 1rem;
}

/* Tablet and up */
@media (min-width: 768px) {
    .vehicle-scroller-nav {
        gap: 1rem;
        margin-bottom: 1.5rem;
    }
}
  
/* Navigation buttons - Mobile First */
.scroller-prev,
.scroller-next {
    background: #007cba;
    color: white;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 124, 186, 0.3);
    font-size: 16px;
}

/* Tablet and up */
@media (min-width: 768px) {
    .scroller-prev,
    .scroller-next {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }
}
  
  .scroller-prev:hover,
  .scroller-next:hover {
      background: #005a8b;
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(0, 124, 186, 0.4);
  }
  
  .scroller-prev:disabled,
  .scroller-next:disabled {
      background: #ccc;
      cursor: not-allowed;
      transform: none;
      box-shadow: none;
  }
  
  .scroller-prev svg,
  .scroller-next svg {
      width: 20px;
      height: 20px;
  }
  
  /* Dot navigation */
  .scroller-dots {
      display: flex;
      gap: 0.5rem;
      align-items: center;
  }
  
  .scroller-dot {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      border: 2px solid #007cba;
      background: transparent;
      cursor: pointer;
      transition: all 0.3s ease;
      position: relative;
  }
  
  .scroller-dot:hover {
      background: rgba(0, 124, 186, 0.3);
      transform: scale(1.2);
  }
  
  .scroller-dot.active {
      background: #007cba;
      transform: scale(1.3);
  }
  
  .scroller-dot.active::after {
      content: '';
      position: absolute;
      top: -4px;
      left: -4px;
      right: -4px;
      bottom: -4px;
      border: 2px solid rgba(0, 124, 186, 0.3);
      border-radius: 50%;
      animation: pulse 2s infinite;
  }
  
  @keyframes pulse {
      0% {
          transform: scale(1);
          opacity: 1;
      }
      100% {
          transform: scale(1.5);
          opacity: 0;
      }
  }
  
/* Mobile navigation adjustments - Now handled by mobile-first approach above */
  
  /* Carousel-specific scroller adjustments */
  .sd-vehicle-scroller-carousel .vehicle-scroller-slider {
      /* Override grid layout for carousel mode */
      display: flex;
      flex-wrap: nowrap;
      overflow: hidden;
      transition: opacity 0.3s ease;
  }
  
  .sd-vehicle-scroller-carousel .vehicle-card {
      /* Ensure consistent sizing in carousel mode */
      min-width: 0;
      flex-shrink: 0;
  }
  
  /* Hide navigation if only one page */
  .vehicle-scroller-nav[data-single-page="true"] {
      display: none;
  }
  
  /* Loading state */
  .vehicle-scroller-slider.loading {
      opacity: 0.6;
      pointer-events: none;
  }
  
  /* Accessibility improvements */
  .scroller-prev:focus,
  .scroller-next:focus,
  .scroller-dot:focus {
      outline: 2px solid #007cba;
      outline-offset: 2px;
  }
  
  /* Screen reader only text */
  .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
  }
  
  /* Hide Beaver Builder post header on landing pages */
  header.fl-post-header {
      display: none !important;
  }
  
  /* Dynamic Landing Page Content Styling */
  .sdas-dynamic-headline {
      font-size: 2.5rem;
      font-weight: 700;
      color: #2c3e50;
      margin: 0 0 1.5rem 0;
      line-height: 1.2;
      text-align: center;
  }
  
  .sdas-dynamic-content {
      font-size: 1.1rem;
      line-height: 1.6;
      color: #34495e;
      margin: 0 0 2rem 0;
      padding: 1.5rem;
      background: #f8f9fa;
      border-radius: 8px;
      border-left: 4px solid #0073aa;
  }
  
  .sdas-vehicle-scroller {
      margin: 2rem 0;
      padding: 1.5rem 0;
      border-top: 2px solid #e9ecef;
  }
  
  /* Vehicle Scroller Styles - Match actual HTML structure */
  .sdas-vehicle-scroller #sd-filtered-vehicle-scroller {
      margin: 0;
      padding: 0;
  }
  
  .sdas-vehicle-scroller .vehicle-scroller-container {
      overflow-x: hidden;
      -webkit-overflow-scrolling: touch;
      scroll-behavior: smooth;
  }
  
  /* Hide scrollbar completely */
  .sdas-vehicle-scroller .vehicle-scroller-container::-webkit-scrollbar {
      display: none;
  }
  
  .sdas-vehicle-scroller .vehicle-scroller-container {
      -ms-overflow-style: none;
      scrollbar-width: none;
  }
  
  .sdas-vehicle-scroller .vehicle-scroller-slider {
      display: grid;
      gap: 1rem;
      grid-auto-flow: column;
      grid-auto-columns: minmax(280px, 1fr);
      padding: 0.5rem 0;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-item {
      background: #fff;
      border-radius: 12px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      overflow: hidden;
      transition: all 0.3s ease;
      display: flex;
      flex-direction: column;
      height: auto;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-item:hover {
      transform: translateY(-4px);
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  }
  
  .sdas-vehicle-scroller .sd-vehicle-image {
      position: relative;
      height: 180px;
      overflow: hidden;
      flex-shrink: 0;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.3s ease;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-item:hover .sd-vehicle-image img {
      transform: scale(1.05);
  }
  
  .sdas-vehicle-scroller .sd-vehicle-details {
      padding: 1rem;
      display: flex;
      flex-direction: column;
      flex-grow: 1;
      justify-content: space-between;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-title {
      margin: 0 0 0.5rem 0;
      font-size: 1.1rem;
      font-weight: 600;
      color: #333;
      line-height: 1.3;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-price {
      font-size: 1.25rem;
      font-weight: 700;
      color: #007cba;
      margin-bottom: 1rem;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-link {
      margin-top: auto;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-link {
      display: inline-block;
      background: linear-gradient(135deg, #007cba, #005a8b);
      color: #fff;
      padding: 0.75rem 1.5rem;
      border-radius: 24px;
      text-decoration: none;
      font-weight: 600;
      font-size: 0.9rem;
      transition: all 0.3s ease;
      text-align: center;
      width: 100%;
      box-sizing: border-box;
  }
  
  .sdas-vehicle-scroller .sd-vehicle-link:hover {
      background: linear-gradient(135deg, #005a8b, #007cba);
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(0, 124, 186, 0.4);
      color: #fff;
  }
  
  /* Responsive adjustments - Keep horizontal scroll on all screen sizes */
  @media (min-width: 768px) {
      .sdas-vehicle-scroller .vehicle-scroller-slider {
          grid-auto-columns: minmax(300px, 1fr);
          gap: 1.5rem;
      }
      
      .sdas-vehicle-scroller .sd-vehicle-image {
          height: 200px;
      }
  }
  
  @media (min-width: 1024px) {
      .sdas-vehicle-scroller .vehicle-scroller-slider {
          grid-auto-columns: minmax(320px, 1fr);
          gap: 2rem;
      }
      
      .sdas-vehicle-scroller .sd-vehicle-image {
          height: 240px;
      }
  }
  
  @media (max-width: 767px) {
      .sdas-vehicle-scroller .vehicle-scroller-slider {
          grid-auto-columns: minmax(260px, 1fr);
          gap: 0.75rem;
      }
      
      .sdas-vehicle-scroller .sd-vehicle-image {
          height: 160px;
      }
  }
  
  @media (max-width: 768px) {
      .sdas-dynamic-headline {
          font-size: 2rem;
      }
      
      .sdas-dynamic-content {
          font-size: 1rem;
          padding: 1rem;
      }
  }