/* Cleaned and Modernized Media Queries */

@media only screen and (max-width: 768px) { 
   /* Fix headings to fit gracefully on mobile/tablet instead of 160% width overflow */
   h1 {
      font-weight: 800;
      color: #fff;
      line-height: 1.2;
      font-size: 2rem;
      margin: 20px 5%;
      width: 90%;
      text-align: center;
      padding-bottom: 20px;
   }

   h2 {
      font-weight: 700;
      color: #fff;
      font-size: 1.5rem;
      margin: 10px 5%;
      width: 90%;
      text-align: center;
   }

   h6 { 
      font-size: 0.9rem;
   }

   .legal {
      margin: 20px 0;
      text-align: center;
      display: block; /* Keep legal visible on mobile but smaller */
   }

   .legal a {
      font-size: 11px;
      text-decoration: underline;
      color: #fff;
   }

   /* Ensure the logo on the header scales */
   .large-4.columns img {
      max-width: 100%;
      height: auto;
      margin: 0 auto;
      display: block;
   }
   
   /* Fix the top certification image to not float right out of bounds */
   .large-6.columns img[src*="tuv"] {
      float: none !important;
      margin: 15px auto;
      display: block;
   }

   /* Slider heights should adapt on mobile to prevent squishing */
   .slider-home .row[style*="background"] {
      height: 300px !important; 
   }
}

@media only screen and (max-width: 490px) { 
   /* On very small phones, we might want to hide complex forms */
   .main-form {
      display: none;
   }
   
   h1 { font-size: 1.5rem; }
   h2 { font-size: 1.3rem; }
   
   /* Slider height smaller for phones */
   .slider-home .row[style*="background"] {
      height: 240px !important; 
   }
}

/* --- MOBILE MENU AND SLIDER CONTENT FIX --- */
@media only screen and (max-width: 768px) {
    /* Keep menu toggle aligned */
    .top-bar .toggle-topbar.menu-icon {
        margin-top: -10px;
    }

    /* Fix slider content layout on mobile */
    .slider-home div[style*="margin-top"] {
        margin-top: 40px !important;
        margin-bottom: 0 !important;
        text-align: center !important;
        width: 100% !important;
    }
    .slider-home h2 {
        font-size: 1.3rem !important;
        margin: 0 auto 5px !important;
        text-align: center !important;
        width: 100% !important;
    }
    .slider-home .button.large {
        font-size: 0.85rem !important;
        padding: 8px 16px !important;
        width: auto !important;
        margin-top: 10px !important;
        display: inline-block;
        box-shadow: 0 2px 4px rgba(0,0,0,0.2) !important;
    }
    .slider-home .large-6.columns.text-right {
        text-align: center !important;
        width: 100% !important;
    }
}

/* --- MOBILE SLIDER CAPTIONS OVERRIDE --- */
@media only screen and (max-width: 768px) {
    .slider-caption {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 10% !important;
        text-align: center !important;
        width: 100% !important;
        margin: 0 !important;
    }
    .slider-btn {
        font-size: 0.85rem !important;
        padding: 8px 16px !important;
    }
}

/* HEADER TOP-BAR & DROPDOWN STACKING */
.contain-to-grid {
    z-index: 9999 !important;
    position: relative;
}
.contain-to-grid > .row:first-child {
    position: relative;
    z-index: 10001;
}
.contain-to-grid > .row:first-child .top-bar {
    z-index: 10001 !important;
}
.top-bar {
    z-index: 9999 !important;
}

@media only screen and (min-width: 40.063em) {
    .contain-to-grid > .row:first-child .top-bar {
        box-shadow: none !important;
        margin-top: 15px;
    }
    .contain-to-grid > .row:first-child .top-bar-section > ul > li > a:not(.button) {
        padding: 0 8px;
        font-size: 13px;
    }
    .contain-to-grid > .row:first-child .top-bar-section > ul > .has-dropdown > a {
        padding-right: 22px !important;
    }
    .contain-to-grid > .row:first-child .top-bar-section > ul > .has-dropdown > a:after {
        margin-right: 7px;
    }
    .contain-to-grid > .row:first-child .top-bar-section ul.right li .dropdown {
        left: 0;
        right: auto;
    }
    /* Fit all 8 horizontal menu tabs cleanly on a single row */
    .row.text-center .top-bar-section > ul > li > a {
        padding: 0 14px !important;
        font-size: 13.5px;
    }
    .row.text-center .top-bar-section > ul > .has-dropdown > a {
        padding-right: 28px !important;
    }
    .row.text-center .top-bar-section > ul > .has-dropdown > a:after {
        margin-right: 10px;
    }
}

@media only screen and (min-width: 40.063em) and (max-width: 62.4375em) {
    .row.text-center .top-bar-section > ul > li > a {
        padding: 0 6px !important;
        font-size: 11.5px;
    }
    .row.text-center .top-bar-section > ul > .has-dropdown > a {
        padding-right: 18px !important;
    }
    .row.text-center .top-bar-section > ul > .has-dropdown > a:after {
        margin-right: 5px;
    }
}

@media only screen and (max-width: 768px) {
    /* Ensure the slider doesn't cover the menu */
    .slider-home {
        z-index: 1 !important;
        position: relative;
    }
}

/* ADJUST MENU SIZES FOR MOBILE RESPONSIVENESS */
@media only screen and (max-width: 640px) {
    .top-bar-section ul li > a {
        font-size: 1rem !important;
        padding: 10px 15px !important;
        line-height: 1.2 !important;
    }
    .top-bar-section .dropdown li > a {
        font-size: 0.95rem !important;
        padding: 10px 20px !important;
    }
}