/* ============================================================================
   MOBILE & TABLET RESPONSIVE STYLES
   IMPORTANT: All rules are inside media queries - NO desktop changes
   ============================================================================ */

/* ============================================================================
   MOBILE ONLY (max-width: 575px) - Smartphone devices
   ============================================================================ */
@media (max-width: 575px) {
  /* Hero Images - fully visible on mobile */
  .hero-foreground-img {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 220px !important;
    object-fit: cover !important;
    object-position: top center !important;
    opacity: 1 !important;
    z-index: 1 !important;
    animation: none !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Adjust hero height for mobile with image */
  .swiper.full-screen {
    min-height: auto !important;
    height: auto !important;
  }

  /* Make hero text visible and accommodate image */
  .swiper-slide {
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  /* Ensure container has proper height */
  .swiper-slide .container {
    padding-top: 20px !important;
    padding-bottom: 30px !important;
  }

  /* Reduce padding on mobile — exclude hero p-0 section */
  section:not(.p-0) {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  /* Ensure text is readable on mobile */
  body {
    font-size: 14px !important;
  }

  /* Button typography — readable sizes on small screens */
  .btn-extra-large {
    font-size: 15px !important;
    padding: 14px 24px !important;
  }

  .btn-large {
    font-size: 14px !important;
    padding: 13px 20px !important;
  }

  .btn-medium {
    font-size: 13px !important;
    padding: 12px 18px !important;
  }

  .btn-small {
    font-size: 13px !important;
    padding: 10px 16px !important;
  }

  /* Ensure touch targets are 44px minimum */
  .btn {
    min-height: 44px !important;
  }

  /* Form inputs must be 16px to prevent iOS zoom */
  input,
  textarea,
  select {
    font-size: 16px !important;
  }

  /* Form controls responsive */
  .form-control,
  .form-select {
    font-size: 16px !important;
    padding: 12px !important;
  }

  /* Images don't overflow */
  img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Modal fits on mobile screen */
  .modal-dialog {
    max-width: 95vw !important;
    margin: 10px auto !important;
  }

  .modal-content {
    max-height: 90vh !important;
    overflow-y: auto !important;
  }

  .modal-body {
    max-height: 70vh !important;
    overflow-y: auto !important;
  }

  /* Prevent horizontal scroll */
  body,
  html {
    overflow-x: hidden !important;
  }

  /* Chat widget adjustments */
  .chat-window {
    width: 95vw !important;
    max-width: 100vw !important;
  }

  /* Fix overflow issues */
  .container {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  /* Text wrapping */
  p, li, span {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Scale fs-* utilities for mobile — keep icons prominent, reduce only large decorative text */
  .fs-50 { font-size: 2.5rem !important; }   /* 40px — aligns with icon-extra-large (50px) */
  .fs-45 { font-size: 2.25rem !important; }  /* 36px */
  .fs-40 { font-size: 2rem !important; }     /* 32px — aligns with icon-medium (34px) */
  .fs-35 { font-size: 1.75rem !important; }  /* 28px */
  .fs-30 { font-size: 1.4rem !important; }   /* 22px */

  /* Hero heading size for mobile */
  .hero-heading {
    font-size: 2rem !important;
    line-height: 2.5rem !important;
  }
}

/* ============================================================================
   IPAD / LARGE TABLET (768px - 991px) — Hero image only, no mobile/desktop side-effects
   ============================================================================ */
@media (min-width: 768px) and (max-width: 991px) {
  /* Desktop uses right: 100px which causes ~250px overlap with col-md-7 text at tablet widths.
     Flush image to right edge and tighten max-width to give text column breathing room. */
  .hero-foreground-img {
    right: 0 !important;
    max-width: 46% !important;
    object-position: bottom right !important;
  }

  /* Constrain text column to 6/12 so image has clear space on the right */
  .swiper-slide .col-md-7 {
    max-width: 54% !important;
  }

  /* Hide 01/02/03 number pagination on tablet (already hidden on ≤767px) */
  .swiper-number,
  .swiper-number-pagination-style-01 .swiper-number {
    display: none !important;
  }
}

/* ============================================================================
   TABLET (576px - 767px)
   ============================================================================ */
@media (min-width: 576px) and (max-width: 767px) {
  /* Adjust swiper height for tablet */
  .swiper.full-screen {
    min-height: 500px !important;
  }

  /* Optimize section padding for tablet */
  section {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  /* Tablet button sizing */
  .btn-extra-large {
    font-size: 15px !important;
    padding: 15px 28px !important;
  }

  .btn-large {
    font-size: 14px !important;
    padding: 14px 24px !important;
  }

  .btn-medium {
    font-size: 13px !important;
    padding: 13px 20px !important;
  }

  /* Modal adjustments for tablet */
  .modal-dialog {
    max-width: 90vw !important;
  }

  /* Form inputs still need 16px on tablet for safety */
  input,
  textarea,
  select {
    font-size: 16px !important;
  }

  /* Ensure images responsive on tablet */
  img {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* ============================================================================
   SMALL DEVICES (max-width: 767px) - Shared mobile and tablet fixes
   ============================================================================ */
@media (max-width: 767px) {
  /* Remove blank gap above hero — ipad-top-space-margin adds 76px on ≤991px
     but navbar is transparent and overlays the hero, so no offset needed */
  .ipad-top-space-margin {
    margin-top: 0 !important;
  }
  .full-screen.ipad-top-space-margin {
    height: auto !important;
  }

  /* Hide 01/02/03 slider number pagination on mobile */
  .swiper-number,
  .swiper-number-pagination-style-01 .swiper-number {
    display: none !important;
  }

  /* Full-width buttons site-wide — except navbar hamburger */
  .btn:not(.navbar-toggler) {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Navbar toggler stays auto-width */
  .navbar-toggler {
    width: auto !important;
    display: inline-flex !important;
  }

  /* Stack button groups vertically with breathing room */
  .d-flex.align-items-center:has(.btn:not(.navbar-toggler)) {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  /* Remove excessive bottom margin on headings/columns on mobile */
  .mb-55px,
  .md-mb-40px {
    margin-bottom: 0 !important;
  }

  /* Hero image — override desktop absolute positioning for all mobile/tablet */
  .hero-foreground-img {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    object-position: top center !important;
    opacity: 1 !important;
    z-index: 1 !important;
    animation: none !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Hero swiper — collapse to content height */
  .swiper.full-screen {
    min-height: auto !important;
    height: auto !important;
  }

  /* Slides stack image above text */
  .swiper-slide {
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
  }

  .swiper-slide .container {
    padding-top: 25px !important;
    padding-bottom: 40px !important;
  }

  /* Remove nav link hover/active underline indicator on mobile */
  .navbar-nav .nav-link:after,
  .navbar-nav .nav-link:hover:after,
  .navbar-nav .nav-link.active:after {
    display: none !important;
    width: 0 !important;
  }

  /* Remove tap highlight on mobile */
  * {
    -webkit-tap-highlight-color: transparent !important;
  }

  /* Ensure proper stacking */
  .row {
    flex-direction: column !important;
  }

  /* Gallery and grid on mobile */
  .row-cols-sm-2 {
    --bs-columns: 1 !important;
  }

  .col {
    width: 100% !important;
  }

  /* Video/iframe responsiveness */
  iframe {
    max-width: 100% !important;
  }

  .ratio iframe {
    width: 100% !important;
    height: 100% !important;
  }

  /* SVG responsiveness */
  svg {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Hide large decorative elements */
  .outside-box-right-25,
  .outside-box-left-25 {
    display: none !important;
  }

  /* Slider content buttons — center aligned and single row on mobile */
  .slider-1-center .d-flex.align-items-center.justify-content-center {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 20px !important;
    width: 100% !important;
  }

  .slider-1-center .d-flex.align-items-center.justify-content-center a {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  /* Accordion fixes */
  .accordion-button {
    padding: 15px !important;
    font-size: 14px !important;
  }

  /* List styling */
  ul, ol {
    padding-left: 20px !important;
  }

  /* Table overflow fix */
  table {
    font-size: 13px !important;
  }

  /* Badge sizing */
  .badge {
    font-size: 11px !important;
    padding: 4px 8px !important;
  }

  /* Dropdown menu fit */
  .dropdown-menu {
    max-width: 90vw !important;
  }

  /* Video section height */
  .ratio {
    min-height: 250px !important;
  }

  /* Card padding */
  .glass-card {
    padding: 15px !important;
  }

  .card-body {
    padding: 15px !important;
  }
}

/* ============================================================================
   LANDSCAPE MOBILE (max-height: 500px)
   ============================================================================ */
@media (max-height: 500px) {
  /* Reduce padding in landscape mode */
  section {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  /* Compact buttons in landscape — reduce padding but keep readable type */
  .btn:not(.navbar-toggler) {
    padding: 10px 18px !important;
    font-size: 14px !important;
  }
}

/* ============================================================================
   ACCESSIBILITY - Respect user preferences (all screen sizes)
   ============================================================================ */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================================
   RETINA DISPLAYS - Antialiased text
   ============================================================================ */
@media (-webkit-min-device-pixel-ratio: 2),
       (min-resolution: 192dpi) {
  body {
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
  }
}

/* ============================================================================
   PRINT MEDIA - Print-friendly styles
   ============================================================================ */
@media print {
  .navbar,
  .footer,
  .chat-widget,
  .modal {
    display: none !important;
  }

  img {
    max-width: 100% !important;
    page-break-inside: avoid !important;
  }
}

/* ============================================================================
   FRONT PAGE RESPONSIVE FIXES (ADDED FOR WP-MIGRATION)
   ============================================================================ */
@media (max-width: 991px) {
  /* Tablet adjustments */
  .alt-font.hero-heading {
    font-size: 3.5rem !important; /* Increased from 3rem */
    line-height: 4rem !important;
  }
}

@media (max-width: 767px) {
  /* Mobile general adjustments */
  .alt-font.hero-heading {
    font-size: 2.8rem !important; /* Increased from 2.2rem */
    line-height: 3.2rem !important; /* Fixed overlapping */
  }
  /* Fix huge outline text overlapping page bounds */
  .fs-170, .lg-fs-140, .md-fs-130, .sm-fs-100 {
    font-size: 80px !important;
    line-height: 80px !important;
    white-space: normal !important;
    word-break: break-word !important;
  }
  /* Adjust the 30+ service year absolute box */
  .position-absolute.z-index-1.w-180px {
    width: 140px !important;
    padding: 15px !important;
  }
  .position-absolute.z-index-1.w-180px .fs-90 {
    font-size: 60px !important;
    line-height: 50px !important;
  }
  /* Video section title min-height removal */
  h2.alt-font[style*="min-height: 200px"] {
    min-height: auto !important;
    margin-bottom: 15px !important;
  }
}

@media (max-width: 575px) {
  /* Extra small mobile fixes */
  .alt-font.hero-heading {
    font-size: 2.2rem !important; /* Increased from 1.8rem */
    line-height: 2.6rem !important;
  }
  .fs-170, .lg-fs-140, .md-fs-130, .sm-fs-100 {
    font-size: 60px !important;
    line-height: 60px !important;
  }
  /* Adjust pie chart size and padding */
  .chart-text.fs-18 {
    font-size: 15px !important;
    margin-left: 10px !important;
  }
  .pe-8, .ps-8 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}

/* ============================================================================
   INNER PAGES RESPONSIVE FIXES (ADDED FOR WP-MIGRATION)
   ============================================================================ */
@media (max-width: 991px) {
  /* Tablet adjustments for inner headers */
  .inner-hero-header h1.alt-font {
    font-size: 3rem !important; /* Increased from 2.8rem */
    line-height: 3.5rem !important;
  }
  .inner-hero-header {
    padding-top: 100px !important; /* More breathing room */
    padding-bottom: 80px !important;
  }
}

@media (max-width: 767px) {
  /* Mobile general adjustments */
  body .inner-hero-header h1.alt-font {
    font-size: 2.5rem !important;
    line-height: 1.2 !important; /* Fixed overlap */
  }
  .inner-hero-header {
    padding-top: 80px !important;
    padding-bottom: 60px !important;
  }
  /* Global heading line-height safety for Senior UI/UX standard */
  h1, h2, h3, .hero-title, .section-title {
    line-height: 1.2 !important; /* Prevents text overlap */
    margin-bottom: 15px !important;
  }
  /* Darken body text for accessibility */
  p, .text-medium-gray {
    color: #4a4a4a !important; /* Darker grey */
  }
  /* Timeline Journey Fixes */
  .journey-timeline-row .journey-column {
    margin-bottom: 40px !important;
  }
  .journey-timeline-row .journey-column::after {
    display: none !important; /* Hide connecting lines if any on mobile */
  }
  /* Card Depth Polish */
  .premium-value-card, .bg-white.box-shadow-quadruple-large {
    box-shadow: 0 15px 50px rgba(0,0,0,0.06) !important;
    border: 1px solid #f0f0f0 !important;
  }
}

@media (max-width: 575px) {
  /* Extra small mobile fixes */
  .inner-hero-header h1.alt-font {
    font-size: 2rem !important; /* Increased from 1.8rem */
    line-height: 2.5rem !important;
  }
  .premium-value-card p {
    font-size: 15px !important;
  }
  .journey-description {
    font-size: 15px !important;
  }
}

/* ============================================================================
   TRUST & FORMS RESPONSIVE FIXES (PHASE 3 & 4)
   ============================================================================ */
@media (max-width: 991px) {
  .fs-80 {
    font-size: 60px !important;
  }
  .lh-40 {
    line-height: 32px !important;
  }

  /* Mobile Header Bar: Logo left padding + Hamburger right padding */
  body header nav.navbar .navbar-brand {
    padding-left: 20px !important;
  }
  body header nav.navbar .navbar-toggler {
    margin-right: 30px !important;
  }
  /* Premium Mobile Menu Expansion Redesign - EXTREME SPECIFICITY BOOST */
  html body header nav.navbar .navbar-collapse.show, 
  html body header nav.navbar .navbar-collapse.collapsing {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    background-color: #ffffff !important;
    padding: 30px 20px !important;
    border-radius: 0 0 20px 20px !important;
    box-shadow: 0px 15px 50px rgba(0,0,0,0.12) !important;
    margin-top: 0 !important;
    border-top: 1px solid rgba(244, 115, 14, 0.1) !important;
  }
  
  html body header nav.navbar .navbar-collapse .navbar-nav {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    padding-top: 10px !important;
    text-align: left !important;
    width: 100% !important;
  }

  /* MOBILE ACCORDION FIX: Nav-item uses grid so link+chevron row 1, dropdown row 2 */
  body .navbar-nav .nav-item {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    margin-bottom: 5px !important;
    width: 100% !important;
    position: relative !important;
  }

  /* Row 1, Col 1: The main link text */
  body .navbar-nav .nav-item > .nav-link {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  /* Row 1, Col 2: The chevron toggle icon */
  body .navbar-nav .nav-item > .dropdown-toggle {
    grid-column: 2 !important;
    grid-row: 1 !important;
    padding: 12px 15px !important;
    cursor: pointer !important;
    color: #f4730e !important;
    font-size: 14px !important;
    position: static !important;
  }

  /* Row 2, Col 1+2: The expanded dropdown spans full width below */
  body .navbar-nav .nav-item > .dropdown-menu {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }

  html body header nav.navbar .navbar-collapse .navbar-nav .nav-link {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    letter-spacing: -0.5px !important;
    padding: 12px 15px !important;
    color: var(--deep-charcoal) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important; /* Force left */
    transition: all 0.3s ease !important;
    position: relative !important; /* Required for indicator */
    width: 100% !important;
    text-align: left !important;
  }

  /* Active/Hover Highlight with Saffron indicator */
  body .navbar-nav .nav-link:hover,
  body .navbar-nav .nav-link.active {
    color: #f4730e !important;
    padding-left: 30px !important;
    background: transparent !important;
  }

  body .navbar-nav .nav-link::before {
    content: '';
    position: absolute;
    left: 0;
    width: 6px;
    height: 0;
    background: var(--saffron-gradient);
    transition: all 0.3s ease;
    border-radius: 0 4px 4px 0;
  }

  body .navbar-nav .nav-link:hover::before,
  body .navbar-nav .nav-link.active::before {
    height: 40px;
  }

  /* Dropdown Styling for Mobile */
  body .navbar-nav .dropdown-toggle {
    position: absolute !important;
    right: 15px !important;
    top: 15px !important;
    font-size: 16px !important;
    color: var(--saffron) !important;
  }

  /* Dropdown Styling for Mobile - FINAL ACCORDION STRUCTURAL FIX */
  html body header nav.navbar .navbar-collapse .navbar-nav .dropdown .dropdown-menu {
    border: none !important;
    background: #fff8f0 !important; /* Solid Brand Amber Tint */
    margin: 10px 0 15px 0 !important; 
    padding: 5px 0 10px 20px !important; /* Internal indent for sub-items */
    border-left: 4px solid #f4730e !important;
    border-radius: 0 !important;
    display: none !important;
    width: 100% !important;
    max-width: 100% !important;
    visibility: visible !important; 
    opacity: 1 !important;
    position: static !important; /* Force into vertical accordion flow */
    top: auto !important;
    left: auto !important;
    transform: none !important; /* CRITICAL: Remove any theme-based floating offset */
    float: none !important;
    box-shadow: none !important;
    text-align: left !important;
    transition: none !important;
  }
  
  html body header nav.navbar .navbar-collapse .navbar-nav .dropdown .dropdown-menu.show {
    display: block !important;
  }

  /* Sub-menu Link Legibility - ULTIMATE SPECIFICITY */
  html body header .navbar-nav .dropdown-menu li a,
  html body header .navbar-nav .simple-dropdown .dropdown-menu li a,
  html body header .navbar .navbar-nav .simple-dropdown .dropdown-menu li a {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    padding: 12px 25px !important;
    color: #212121 !important; /* Forced Deep Charcoal */
    display: block !important;
    text-align: left !important;
    width: 100% !important;
    background: transparent !important;
  }
  
  html body header .navbar-nav .dropdown-menu li a:hover {
    color: #f4730e !important;
    padding-left: 30px !important;
  }

  
  /* Firmly remove Join the Vision button from mobile menu bar */
  body header .header-push-button,
  body header .header-push-button * {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
  }

  /* Button groups stack vertically — covers section, entry-content, main, footer */
  body section .d-flex:has(.btn:not(.navbar-toggler)),
  body section .d-inline-block:has(.btn:not(.navbar-toggler)),
  body .entry-content .d-flex:has(.btn:not(.navbar-toggler)),
  body .entry-content .d-inline-block:has(.btn:not(.navbar-toggler)),
  body main .d-flex:has(.btn:not(.navbar-toggler)),
  body main .d-inline-block:has(.btn:not(.navbar-toggler)),
  body footer .d-flex:has(.btn:not(.navbar-toggler)) {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    width: 100% !important;
    gap: 16px !important;
  }

  /* All sized buttons: full-width, centred, readable type */
  body .btn.btn-extra-large,
  body .btn.btn-large,
  body .btn.btn-medium,
  body .btn.btn-small {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body .btn:first-child {
    margin-top: 0 !important;
  }
}

@media (max-width: 767px) {
  /* Scale down massive icons and quotes */
  .bi-quote.fs-80 {
    font-size: 50px !important;
    margin-bottom: 10px !important;
  }
  .lh-40 {
    line-height: 28px !important;
  }
  h4.lh-40 {
    font-size: 1.2rem !important; /* Force smaller size on mobile for quotes */
  }
  
  /* Generic form container safety bounds */
  form input[type="text"],
  form input[type="email"],
  form textarea {
    font-size: 16px !important; /* Prevents auto zoom on iOS */
    padding: 10px !important;
  }

  /* Hero Button Stacking and Sizing */
  .swiper-slide .d-flex.align-items-center {
    flex-direction: column !important;
    align-items: flex-start !important; /* Left alignment */
    width: 100% !important;
  }
}

@media (max-width: 575px) {
  .bi-quote.fs-80 {
    font-size: 40px !important;
  }
  h4.lh-40 {
    font-size: 1.1rem !important;
    line-height: 24px !important;
  }
}

/* ============================================================================
   FOOTER NAVBAR — Stack links vertically on mobile
   ============================================================================ */
@media (max-width: 767px) {
  .footer-navbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .footer-navbar .nav-item {
    display: block !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
  }

  .footer-navbar .nav-link {
    font-size: 14px !important;
    padding: 4px 0 !important;
  }
}

/* ============================================================================
   SLIDE 1 — Responsive stacked layout
   ============================================================================ */
@media (max-width: 767px) {
  .swiper.ipad-top-space-margin {
    height: auto !important;
  }
  .slider-1-layout {
    flex-direction: column !important;
    align-items: center !important;
    height: auto !important;
    padding-bottom: 60px;
  }
  .slider-1-left {
    order: 1;
    width: 100% !important;
    padding-left: 0 !important;
    justify-content: center;
  }
  .slider-1-center {
    order: 2;
    width: 100% !important;
    padding: 16px !important;
  }
  .slider-1-right {
    order: 3;
    width: 100% !important;
    padding-right: 0 !important;
    justify-content: center;
  }
  .slider-1-left img,
  .slider-1-right img {
    height: auto !important;
    max-height: 220px !important;
    width: auto !important;
    max-width: 85% !important;
  }
  .slider-1-center .hero-heading {
    font-size: 2.4rem !important;
    line-height: 2.5rem !important;
  }
  .slider-1-center .d-flex img {
    max-width: 70px !important;
    height: 70px !important;
  }
}