@media (max-width: 1400px) {
    .carousel-container-slider .text-sec .text-heading {
        font-size: 54px;
        line-height: 60.64px;
        margin-bottom: 40px;
    }

    .carousel-container-slider .text-sec button {
        font-size: 17px;
    }

    .carousel-container-slider .text-sec {
        width: 45%;
    }

    .carousel-container-slider .text-sec button {
        padding: 1rem 2rem;
        border-radius: 30px;
        font-size: 0.8rem;
        background-color: #FFFFFF;
        color: var(--secondary-color);
        border: none;
        cursor: pointer;
        transition: background-color 0.3s;
        font-size: 19px;
        font-weight: 700;
        line-height: 21.98px;
        text-align: center;
    }

    .about-us h3 {
        font-size: 45px;
        line-height: 50.49px;
    }

    .about-us h2 {
        margin-bottom: 0.5rem;
        font-size: 14px;
        line-height: 30.01px;
        letter-spacing: 0.22em;
    }

    .about-us p {
        margin-bottom: 1rem;
        font-size: 18px;
        font-weight: 400;
        line-height: 31.34px;
        text-align: justify;
    }

    .our-categories-sec h2 {
        font-size: 14px;
    }

    h3 {
        font-size: 45px;
        line-height: 50.49px;
    }

    p {
        margin-bottom: 1rem;
        font-size: 18px;
        line-height: 31.34px;
    }

    .feature-item p {
        font-size: 17px;
        line-height: 28px;
    }

    .sub-head {
        font-size: 14px;
    }

    .about-section-title {
        font-size: 14px;
    }

    .feature-list {
        padding: 5px;
    }

    .card-content h4 {
        margin: 0 0 5px;
        font-size: 32px;
        line-height: 49px;
        text-align: left;
    }

    .icon {
        display: inline-block;
        padding: 15px 40px;
        font-size: 16px;
        line-height: 16.98px;
    }

    .reach-us-container .reach-us-btn {
        width: 12em;
        font-family: 'NunitoSans';
        font-size: 18px;
    }

    .top-links a img {
        margin-right: 1em;
        width: 20px;
        margin-left: 1rem;
    }

    .social-icons img {
        width: 25px !important;
        height: 25px;
        padding: 0 !important;
    }

    .footer-btn {
        font-size: 17px;
        line-height: 33px;
    }

    .footer-logo {
        max-width: 155px;
        margin-bottom: 2rem;
    }

    footer p {
        margin-bottom: 0rem;
        font-size: 15px;
    }

    .feature-item {
        padding: 15px 0 0px 0px;
    }

    .footer-column p {
        font-size: 14px;
        line-height: 27px;
    }

    .footer-column a {
        color: #fff;
        text-decoration: none;
        font-size: 14px;
    }

    .footer-description {
        font-size: 14px;
        line-height: 26px;
    }

    .footer-bottom {
        margin-top: 1rem;
        padding-top: 1rem;
    }

    .footer {
        padding-bottom: 10px;
    }

    p {
        font-size: 18px;
        line-height: 31.34px;
    }

    h3 {
        font-size: 45px;
        line-height: 50.49px;
    }

    .overview-product-details ul li {
        margin-bottom: 0px;
        font-size: 16px;
        line-height: 30px;
    }

    .info-item h1 {
        font-size: 33px;
        line-height: 45.49px;
    }

    .info-item p {
        font-size: 18px;
        line-height: 33.34px;
    }

    .info-item h2 {
        font-size: 28px;
        line-height: 45.49px;
    }

    .contact-icon {
        font-size: 8em;
        margin-right: 20px;
        vertical-align: middle;
    }

    .contact-info img {
        width: 19px;
    }

    .map iframe {
        height: 140px;
    }

    .filter-options {
        margin-bottom: 5px;
    }

    .filter-sec-container {
        margin: 0 3em;
    }
.footer-column.tp {
        padding-top: 3rem;
}
    .card-content p {
        font-size: 18px;
        font-weight: 400;
        line-height: 28px;
    }

    ul.location-ftr li img {
        padding-top: 9px;
        padding-right: 20px;
        width: 38px;
    }

    .dropdown-content.show {
        display: block;
        margin-top: 23px;
    }

    nav ul li a {
        font-size: 16px;
    }

    .overview-product-details p {
        font-size: 16px;
        font-weight: 400;
        line-height: 25.34px;
    }

    .location-txt {
        padding-top: 0px;
    }

    .tel-num {
        padding-top: 0px;
    }

    .info-item h2 {
        line-height: 45.49px;
        text-align: left;
    }

    .footer-content p {
        line-height: 24px !important;
    }

}

@media (max-width: 768px) {
    .product-slider .product-card {
        width: 100% !important;
    }

    .product-slider h3 {
        font-size: 36px;
        line-height: 38.49px;
    }

    .product-slider {
        width: 100%;
        margin: 0 auto;
        padding: 30px 0px 0px 20px;
    }

    .about-content,
    .about-section {
        gap: 2em;
        padding: 1.5rem 1.5rem 0;
    }

    .lg-none {
        display: block;
    }

    main.about-container p {
        margin-bottom: 0px;
    }

    .about-section {
        padding-top: 0px;
    }

    .overview-product-image img {
        border-radius: unset;
    }

    .about-section {
        margin: 25px 0;
    }

    .about-content {
        margin: 0;
        flex-wrap: wrap-reverse;
    }

    .about-p {
        margin-top: 0;
    }

    .sub-head,
    .about-section-title,
    .about-h2 {
        text-align: center;
        font-weight: 600;
    }

    .about-image-content,
    .about-section-image {
        width: 100%;
        order: 0;
        padding-top: 15px;
    }

    .faucet-banner {
        height: 100px;
    }

    .faucet-banner h1 {
        font-size: 28px;
    }

    .product-grid {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        margin: 1em 2em;
    }

    .filter-options {
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 10px;
        gap: 1em;
    }

    .filter-option {
        flex-shrink: 0;
    }

    .category-header h3 {
        font-size: 17px;
    }

    .carousel-container-slider .text-sec .text-heading {
        font-size: 29px;
        line-height: 40.64px;
        margin-bottom: 35px;
    }

    .about-us h3 {
        font-size: 27px;
        line-height: 32.49px;
    }

    h3 {
        font-size: 45px;
        line-height: 35.49px;
    }

    .feature-list {
        padding: 5px 0px;
    }

    .carousel-container-slider .carousel-slide img {
        height: 50vh;
    }

    .container-section {
        padding: 2rem 1.5rem;
    }

    .menu {
        top: 65px;
    }

    .text-sec a {
        font-size: 16px;
    }

    .overview-faq-answer {
        padding-left: 0;
    }

    .about-text-content {
        width: 100%;
    }

    .about-text-content h3 {
        width: 100%;
        margin-bottom: 20px;
        font-size: 28px;
        line-height: 30px;
    }

    .our-categories-sec h2 {
        font-weight: 600;
    }

    .about-image-content.lg-none {
        display: block;
    }

    .sm-none {
        display: none;
    }

    h3.about-h2 {
        font-size: 28px;
        line-height: 30px;
    }

    .overview-header {
        flex-wrap: wrap;
    }

    .overview-header nav {
        display: flex;
        gap: 20px;
        width: 95%;
        justify-content: space-between;
        padding-top: 20px;
    }

    .overview-product-details {
        padding-top: 0px;
    }

    .overview-product-image {
        padding: 20px 20px 0px 20px;
    }

    .product-count {
        color: #181818;
        font-weight: 600;
    }

    .product-grid {
        display: flex !important;

    }

    .product-card {
        width: 50%;
    }

    .faucet-banner {
        height: auto !important;
        min-height: 270px !important;
    }

    .faucet-banner h1 {
        font-size: 48px !important;
        line-height: 60px !important;
    }

    .feature-list {
        border-radius: 0px;
    }

    .feature-item div {
        padding: 0px 30px;
    }

    .feature-item img {
        width: 80px !important;
        padding-left: 20px;
        height: auto;
    }

    #category-list li a {
        text-transform: uppercase;
    }

    .menu.open {
        height: 100vh;
    }

    .card-content p {
        margin: 0 0 30px;
        font-size: 17px;
        line-height: 28px;
    }

    .reach-us-container .reach-us-card {
        padding: 40px;
        width: 100%;
        height: 20em;
    }

    .reach-us-container h2 {
        margin: 0 0 0px;
        font-size: 33px;
        font-weight: 600;
        line-height: 44.49px;
        text-align: center;
    }

    .reach-us-container .reach-us-btn {
        width: 12em;
        font-size: 18px;
        padding: 6px 25px;
    }

    .reach-us-icon.pb img {
        padding-bottom: 0px;
        width: 30px !important;
    }

    .menu-item {
        font-weight: 700;
    }

    .menu-categories {
        margin: 0em 0 0;
    }

    .footer-column h3 {
        display: flex;
        justify-content: space-between;
    }

    .footer-column ul {
        padding-top: 8px;
    }

    /* input[type="radio"] {
    display: none;
  }
  input[type="radio"]:checked+.carousel-card {
    flex: 0 0 50%; 
  }
  .carousel-card:hover .card-image {
    transform: scale(1.1);
  }
  
  
  input[type="radio"]:checked+.carousel-card .card-content {
    transform: translateY(0);
  }
  
  input:not(:checked)+.carousel-card:hover .card-content :is(p, .icon) {
    display: none;
  }
  
  input[type="radio"]:not(:checked)+.carousel-card:hover .card-content h4 {
    writing-mode: vertical-rl;
    text-orientation: upright;
    font-size: 1em;
    transform: translateY(0);
  } */

    /* Container styling */
    .carousel-container {
        display: flex;
        overflow: hidden;
        /* Prevents overflow issues */
        position: relative;
    }

    /* Adjust the size of the card when hovered */
    .carousel-card {

        transition: flex 0.3s ease-in-out;
        position: relative;
        z-index: 1;
        /* Ensure proper stacking of cards */
    }

    /* On hover, card expands to take 50% of the container */
    .carousel-card:hover {
        flex: 0 0 50%;
        z-index: 2;
        /* Bring hovered card to front */
    }

    /* Image scaling effect on hover */
    .carousel-card:hover .card-image {
        transform: scale(1.1);
        transition: transform 0.3s ease-in-out;
    }

    .carousel-card:not(:hover):not(:first-child) {
        flex: unset;
    }

    /* Content starts hidden, becomes visible on hover */
    .carousel-card .card-content {
        transform: translateY(100%);
        transition: transform 0.3s ease-in-out;
        opacity: 0;
    }

    .carousel-card:hover .card-content {
        transform: translateY(0);
        opacity: 1;
    }

    /* Hide text content (p and icon) on hover of non-expanded cards */
    .carousel-card:not(:hover) .card-content p,
    .carousel-card:not(:hover) .card-content .icon {
        display: none;
    }

    /* Adjust the heading on non-hovered cards to be vertical */
    .carousel-card:not(:hover) .card-content h4 {
        writing-mode: vertical-rl;
        text-orientation: upright;
        font-size: 1em;
    }

    /* Adjust content when hovered */
    .carousel-card:hover .card-content h4 {
        writing-mode: horizontal-tb;
        font-size: 1.5em;
    }

    /* Prevent the first card from being cut off */
    .carousel-container:hover .carousel-card:first-child:hover {
        margin-left: 0;
        /* Ensures full visibility */
        transform-origin: left;
        /* Expands to the right instead of the center */
    }

    .card-content {
        position: relative;

    }

    .card-content a {
        color: #000000fa;
    }

    .carousel-card:hover .card-image {
        display: none;
    }

    .card-image h4 {
        font-size: 18px;
        color: #fff;
        text-align: center;
        padding-top: 26px;
    }

    .product-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        padding-left: 10px;
    }

    .product-card {
        width: 45% !important;
    }

    label {
        margin-top: 10px;
    }

    .logo img {
        height: 85px;
        margin-right: 0px;
        width: 100%;
        margin-left: 0px;
    }

    .footer-logo {
        max-width: 200px;
        margin-bottom: 2rem;
        width: 85%;
    }

    .carousel-container-slider .prev img,
    .carousel-container-slider .next img {
        vertical-align: middle;
        width: 11px;
    }

    .carousel-container-slider .text-sec {
        width: 70%;
    }

    .menu {
        top: 110px;
    }

    .hamburger {
        cursor: pointer;
        width: 25%;
    }

    .nav-icons {
        width: 25%;
        justify-content: flex-end;
    }

    .about-hero-text {
        line-height: 60.64px;
        font-size: 46px;
        width: 90%;
    }

    .faq-count {
        font-size: 1.5em !important;
    }

    .footer-column.tp {
        display: none;
    }

    .menu-footer img.whtap {
        width: 20px;
    }
    span.toggle-icona {
      font-size: 16px;
}
}

@media (max-width: 480px) {
    .faucet-banner h1 {
        font-size: 48px;
    }

    .menu {
        top: 110px;
    }

    .product-grid {
        grid-template-columns: 1fr;
    }

    .container-section {
        padding: 2rem 1.5rem;
    }

    .filter-sec-container {
        margin: 2em 1.5em;
    }

    .faucet-banner h1 {
        font-size: 48px !important;
        line-height: 60px !important;
    }

    .product-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        padding-left: 10px;
    }

    .product-card {
        width: 45% !important;
    }
}

/* Mobile: hide second column, show all in first */
@media (max-width: 768px) {
    .mobile-only {
        display: block;
    }
    .desktop-only {
        display: none;
    }
}
/* Desktop: hide mobile items, show second column */
@media (min-width: 769px) {
    .mobile-only {
        display: none;
    }
    .desktop-only {
        display: block;
    }
}