/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 2.0.2
*/





@media (min-width: 320px) and (max-width: 768px) {
    .blog_slider_header .slider_navigation .button {
        width: 50px !important;
        height: 50px !important;
        line-height: 50px !important;
        padding: 0 !important;
        font-size: 18px !important;
        margin-left: 4px !important;
    }

    .blog_slider_header .slider_navigation {
        display: flex;
        gap: 4px;
        align-items: center;
    }

    .blog_slider_header .title {
        font-size: 24px;
        line-height: 1.2;
    }
}



@media (min-width: 320px) and (max-width: 767px) {

    /* Main section */
    .elementor-element-5480bcb {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    /* Text section */
    .elementor-element-5480bcb > .elementor-element-9d9dfdb {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        padding: 45px 30px 40px !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }

    /* Image section */
    .elementor-element-5480bcb > .elementor-element-33f50f1 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        height: 300px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    /* Image */
    .elementor-element-5480bcb > .elementor-element-33f50f1 img {
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
        display: block !important;
    }

    /* Top small text */
    .elementor-element-c68aa68 p {
        font-size: 16px !important;
        line-height: 1.5 !important;
        margin: 0 0 25px !important;
    }

    /* Main heading */
    .elementor-element-4eda84c {
        margin: 0 0 22px !important;
    }

    .elementor-element-4eda84c,
    .elementor-element-4eda84c h4,
    .e-4eda84c-6f508d8 {
        font-size: 28px !important;
        line-height: 1.08 !important;
    }

    /* Description */
    .elementor-element-be5ce1c p {
        font-size: 17px !important;
        line-height: 1.5 !important;
        margin: 0 0 22px !important;
    }

    /* Button */
    .elementor-element-9d9dfdb .e-f43a240-1ddb17d {
        width: 100px !important;
        min-height: 82px !important;
        padding: 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .elementor-element-9d9dfdb .e-f43a240-1ddb17d strong {
        font-size: 16px !important;
        line-height: 1.15 !important;
    }
}





/* ==========================================
   POPULAR COLLECTIONS
   MOBILE: 320px - 767px
========================================== */
@media (min-width: 320px) and (max-width: 767px) {

    /* First row + second row containers */
    .elementor-element-2cde9f9,
    .elementor-element-a28f530 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 35px 24px !important;

        padding: 0 20px !important;
        margin: 0 !important;

        box-sizing: border-box !important;
        align-items: start !important;
    }


    /* Each collection box */
    .elementor-element-2fea53e,
    .elementor-element-1f70ebd,
    .elementor-element-4d44d7e,
    .elementor-element-2cde9f9 > .elementor-element-fa21f82 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        display: block !important;
        box-sizing: border-box !important;
    }


    /* Inner content */
    .elementor-element-2fea53e .e-con-inner,
    .elementor-element-1f70ebd .e-con-inner,
    .elementor-element-4d44d7e .e-con-inner,
    .elementor-element-fa21f82 .e-con-inner {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        padding: 0 !important;
        margin: 0 !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;

        gap: 0 !important;
        box-sizing: border-box !important;
    }


    /* Image link */
    .elementor-element-2fea53e .e-image-link-base,
    .elementor-element-1f70ebd .e-image-link-base,
    .elementor-element-4d44d7e .e-image-link-base,
    .elementor-element-fa21f82 .e-image-link-base {
        display: block !important;

        width: 100% !important;
        max-width: 135px !important;

        margin: 0 auto !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }


    /* Images */
    .elementor-element-2fea53e img,
    .elementor-element-1f70ebd img,
    .elementor-element-4d44d7e img,
    .elementor-element-fa21f82 img {
        display: block !important;

        width: 100% !important;
        height: auto !important;

        aspect-ratio: 1.5 / 1 !important;
        object-fit: cover !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }


    /* Collection headings */
    .elementor-element-2fea53e h5,
    .elementor-element-1f70ebd h5,
    .elementor-element-4d44d7e h5,
    .elementor-element-fa21f82 h5 {
        width: 100% !important;

        margin: 12px 0 0 !important;
        padding: 0 !important;

        text-align: center !important;

        font-size: 20px !important;
        line-height: 1.15 !important;
        font-weight: 700 !important;

        box-sizing: border-box !important;
    }


    /* Heading links */
    .elementor-element-2fea53e h5 a,
    .elementor-element-1f70ebd h5 a,
    .elementor-element-4d44d7e h5 a,
    .elementor-element-fa21f82 h5 a {
        display: block !important;
        width: 100% !important;

        text-decoration: none !important;

        text-align: center !important;
        line-height: 1.15 !important;
    }


    /* Strong text */
    .elementor-element-4d44d7e h5 strong,
    .elementor-element-1f70ebd h5 strong {
        display: block !important;
    }


    /* Fix empty h5 spacing */
    .elementor-element-4d44d7e h5:empty {
        display: none !important;
    }


    /* Second row starts properly */
    .elementor-element-a28f530 {
        margin-top: 35px !important;
    }
}


/* ==========================================
   SMALL PHONES: 320px - 400px
========================================== */
@media (min-width: 320px) and (max-width: 400px) {

    .elementor-element-2cde9f9,
    .elementor-element-a28f530 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 30px 18px !important;
        padding: 0 20px !important;
    }

    .elementor-element-2fea53e .e-image-link-base,
    .elementor-element-1f70ebd .e-image-link-base,
    .elementor-element-4d44d7e .e-image-link-base,
    .elementor-element-fa21f82 .e-image-link-base {
        max-width: 120px !important;
    }

    .elementor-element-2fea53e h5,
    .elementor-element-1f70ebd h5,
    .elementor-element-4d44d7e h5,
    .elementor-element-fa21f82 h5 {
        font-size: 18px !important;
        line-height: 1.15 !important;
        margin-top: 10px !important;
    }
}

@media (min-width: 600px) and (max-width: 767px) {

    .elementor-element-2fea53e .e-image-link-base,
    .elementor-element-1f70ebd .e-image-link-base,
    .elementor-element-4d44d7e .e-image-link-base,
    .elementor-element-fa21f82 .e-image-link-base {
        max-width: 190px !important;
    }

    .elementor-element-2cde9f9,
    .elementor-element-a28f530 {
        gap: 40px 30px !important;
        padding: 0 25px !important;
    }

    .elementor-element-2fea53e h5,
    .elementor-element-1f70ebd h5,
    .elementor-element-4d44d7e h5,
    .elementor-element-fa21f82 h5 {
        font-size: 23px !important;
        margin-top: 14px !important;
    }
}




/* ======================================================
   Testimonials Slider Mobile Fix (320px to 767px)
   ====================================================== */

@media screen and (max-width: 767px) {

  /* 1. Container & Section Adjustments */
  .elementor-element-21c0714,
  .elementor-widget-mfn_testimonials {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
  }

  /* 2. Main Heading Centering & Font Size */
  .elementor-element-21c0714 .e-heading-base {
    text-align: center !important;
    font-size: 22px !important;
    line-height: 1.3 !important;
    margin-bottom: 20px !important;
  }

  /* 3. Slider Container & Dynamic Height Fix */
  .testimonials_slider {
    width: 100% !important;
    margin: 0 auto !important;
  }

  /* Slick List & Track Overrides (Text ko squeeze hone se bachaega) */
  .testimonials_slider .slick-list {
    width: 100% !important;
    height: auto !important; /* Inline fixed height ko override karega */
    overflow: hidden !important;
  }

  .testimonials_slider .slick-track {
    display: flex !important;
    align-items: center !important;
  }

  /* Full Width Slide Override */
  .testimonials_slider .slick-slide {
    width: 100% !important; /* Inline width: 204px ko cancel karega */
    float: none !important;
    display: block !important;
    height: auto !important;
  }

  .testimonials_slider_li {
    width: 100% !important;
    max-width: 100% !important;
    padding: 10px 15px !important;
    box-sizing: border-box !important;
    text-align: center !important;
  }

  /* 4. Blockquote & Content Centering */
  .testimonials_slider .bq_wrapper,
  .testimonials_slider .blockquote {
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: none !important;
    text-align: center !important;
  }

  /* Background Quote Icon ko hide karna (clean layout ke liye) */
  .testimonials_slider .mfn-blockquote-icon {
    display: none !important;
  }

  /* Star Rating Icons */
  .testimonials_slider blockquote .icon-star {
    font-size: 16px !important;
    color: #f39c12 !important;
    margin: 0 2px 10px 2px !important;
    display: inline-block !important;
  }

  /* Testimonial Review Text Styling */
  .testimonials_slider blockquote h5 {
    font-size: 15px !important;
    line-height: 1.6 !important;
    font-weight: 500 !important;
    font-style: italic !important;
    color: #333333 !important;
    margin: 10px 0 !important;
    padding: 0 5px !important;
    white-space: normal !important;
    word-break: break-word !important;
  }

  /* 5. Center Dots Divider */
  .testimonials_slider .hr_dots {
    text-align: center !important;
    margin: 15px 0 !important;
  }

  .testimonials_slider .hr_dots span {
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    margin: 0 3px !important;
    background-color: #ddd !important;
    border-radius: 50% !important;
  }

  /* 6. Author Name Styling */
  .testimonials_slider .author {
    text-align: center !important;
    margin-top: 10px !important;
  }

  .testimonials_slider .author .title {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #222222 !important;
    margin: 0 !important;
  }

  /* 7. Next/Prev Arrows on Mobile (Optional: Hide arrows for clean look) */
  .testimonials_slider .slick-arrow {
    display: none !important;
  }
}


/* ======================================================
   Secret Stash About Section Responsive Fix (320px to 1023px)
   ====================================================== */

@media screen and (max-width: 1023px) {

  /* 1. Main Parent Container (Stack Image & Text Vertically) */
  .elementor-element-13ff1dd {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 30px 20px !important;
    box-sizing: border-box !important;
  }

  /* 2. Image Outer Container */
  .elementor-element-329c709 {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 25px !important;
  }

  .elementor-element-329c709 .e-con-inner {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }

  /* Image Resizing & Centering */
  .elementor-element-329c709 img {
    width: 100% !important;
    max-width: 380px !important; /* Image ko limit mein rakhega */
    height: auto !important;
    object-fit: contain !important;
  }

  /* 3. Text Outer Container Fix */
  .elementor-element-0148415 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
  }

  .elementor-element-0148415 .e-con-inner {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important; /* Mobile/Tablet par centered text best lagta hai */
  }

  /* 4. Heading Styling */
  .elementor-element-0148415 h6 {
    font-size: 22px !important;
    line-height: 1.3 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
    color: #222222 !important;
  }

  /* 5. Paragraph Text Fix (Squeeze hone se bachayega) */
  .elementor-element-0148415 p {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    margin-bottom: 15px !important;
    display: block !important;
    word-break: normal !important;
    white-space: normal !important;
  }

}

/* Specific adjustment for smaller mobiles (320px to 480px) */
@media screen and (max-width: 480px) {
  .elementor-element-13ff1dd {
    padding: 20px 15px !important;
  }

  .elementor-element-329c709 img {
    max-width: 280px !important;
  }

  .elementor-element-0148415 h6 {
    font-size: 20px !important;
  }

  .elementor-element-0148415 p {
    font-size: 14px !important;
  }
	
	.elementor-element.elementor-element-329c709.e-flex.e-con-boxed.e-con.e-parent.e-lazyloaded {
    padding-left: 0px !important;
}
	
	.elementor-element-329c709 img {
        max-width: 100% !important;
    }
}


/* ======================================================
   Supported By Logos Section Responsive Fix (320px to 767px)
   ====================================================== */

@media screen and (max-width: 767px) {

  /* 1. Main Outer Section Container */
  .elementor-element-2657ef8 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 30px 15px !important;
    box-sizing: border-box !important;
  }

  /* 2. Heading "Supported By:" Centering & Size */
  .elementor-element-2657ef8 h5,
  .elementor-element-2657ef8 .e-heading-base {
    text-align: center !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin-bottom: 25px !important;
    letter-spacing: 1px !important;
    text-transform: lowercase !important;
  }

  /* 3. Logos Container (Transform to 2x2 Grid Layout) */
  .elementor-element-4fde783 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }

  .elementor-element-4fde783 .e-con-inner {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* 2 Columns side-by-side */
    gap: 25px 15px !important; /* Spacing between logos */
    align-items: center !important;
    justify-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 4. Logos Image Sizing & Alignment */
  .elementor-element-4fde783 img {
    width: 100% !important;
    max-width: 130px !important; /* Maximum logo width */
    height: 45px !important;     /* Uniform height constraint */
    object-fit: contain !important; /* Keeps aspect ratio intact */
    margin: 0 auto !important;
    display: block !important;
  }

}

/* Ultra Small Mobile Screens Adjustment (320px to 380px) */
@media screen and (max-width: 380px) {
  .elementor-element-4fde783 img {
    max-width: 110px !important;
    height: 40px !important;
  }
}

/* ======================================================
   iOS Safari Background Zooming Fix (320px to 767px)
   ====================================================== */

@media screen and (max-width: 767px) {

  /* Target Container + Pseudo Elements + Overlays */
  html body .elementor .elementor-element.e-9611a24,
  html body .elementor .elementor-element.e-9611a24::before,
  html body .elementor .elementor-element.e-9611a24 .elementor-background-overlay {
    background-attachment: scroll !important;
    background-size: cover !important;
    -webkit-background-size: cover !important;
    background-position: center center !important;
  }

  /* Force container padding & height reset on Mobile */
  html body .elementor .elementor-element.e-9611a24 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    min-height: auto !important;
    height: auto !important;
  }

  /* Trending Content Card Centering */
  html body .elementor .elementor-element.e-9611a24 > div {
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 auto !important;
  }
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
    .elementor a.e-f43a240-1ddb17d.e-button-base {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        white-space: nowrap !important; /* Text ek hi line mein rahega */
        width: auto !important;          /* Text ke hisab se exact width */
        min-height: 44px !important;
        
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        
        text-align: center !important;
        font-size: 13px !important;
        letter-spacing: 0.5px !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    img#custom-img {
    object-fit: cover !IMPORTANT;
}
}