/* =========================================================
   SIGNAGE
   MAIN STYLE SHEET
========================================================= */


/* =========================================================
   RESET
========================================================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}


html{
    scroll-behavior:smooth;
}


body{
    background:#020a1d;
    color:#ffffff;

    font-family:'Poppins',sans-serif;

    overflow-x:hidden;
}


a{
    text-decoration:none;
    color:inherit;
}


button{
    font-family:inherit;
}


/* =========================================================
   MAIN PAGE
========================================================= */

.page{
    min-height:100vh;

    position:relative;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 5% 20%,
            rgba(90,255,70,.16),
            transparent 25%
        ),

        radial-gradient(
            circle at 95% 35%,
            rgba(145,255,60,.12),
            transparent 28%
        ),

        radial-gradient(
            circle at 10% 70%,
            rgba(55,190,65,.10),
            transparent 25%
        ),

        #020a1d;
}


/* =========================================================
   DECORATIVE CURVES
========================================================= */

.curves{
    position:absolute;

    width:330px;
    height:330px;

    pointer-events:none;

    opacity:.35;
}


.curves-left{
    left:-140px;
    top:760px;
}


.curves-right{
    right:-150px;
    top:1180px;
}


.curves-bottom{
    left:-130px;
    bottom:100px;
}


.curves::before,
.curves::after{

    content:"";

    position:absolute;

    border:
        1px solid
        rgba(105,255,70,.32);

    border-left:0;

    border-radius:50%;

    transform:rotate(28deg);
}


.curves::before{
    width:260px;
    height:160px;

    top:50px;
    left:20px;
}


.curves::after{
    width:210px;
    height:130px;

    top:80px;
    left:45px;
}


/* =========================================================
   HEADER
========================================================= */

.top-header{

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:75px;

    z-index:50;

    display:flex;

    align-items:center;

    justify-content:flex-end;

    padding:0 20px;
}


.menu{

    width:55px;
    height:55px;

    border-radius:50%;

    background:
        rgba(60,90,85,.65);

    border:
        1px solid
        rgba(255,255,255,.12);

    display:flex;

    align-items:center;
    justify-content:center;

    cursor:pointer;

    box-shadow:
        0 8px 25px
        rgba(0,0,0,.25);

    transition:.25s ease;
}


.menu:hover{

    background:
        rgba(85,150,85,.75);

    border-color:
        rgba(125,255,80,.45);
}


.menu-lines{
    width:100%;
}


.menu span{

    display:block;

    width:29px;
    height:3px;

    background:#ffffff;

    margin:5px auto;

    border-radius:5px;
}


/* =========================================================
   HERO
========================================================= */

.hero{

    position:relative;

    text-align:center;
}


.hero-image-space{

    width:100%;
    height:430px;

    position:relative;

    overflow:hidden;

    background:
        linear-gradient(
            135deg,
            rgba(75,110,105,.75),
            rgba(20,50,55,.90)
        );

    display:flex;

    align-items:center;
    justify-content:center;
}


.hero-image-space span{

    color:
        rgba(255,255,255,.35);

    font-size:18px;

    letter-spacing:.5px;
}


.hero-overlay{

    position:absolute;

    left:0;
    right:0;

    top:0;

    height:430px;

    background:
        linear-gradient(
            to bottom,
            rgba(0,0,0,.10),
            rgba(2,10,29,.08) 45%,
            #020a1d 100%
        );
}


.profile{

    position:relative;

    margin-top:-85px;

    z-index:5;

    text-align:center;
}


.profile-photo-space{

    width:175px;
    height:175px;

    margin:auto;

    border-radius:50%;

    border:
        8px solid
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #5d8061,
            #193e35
        );

    box-shadow:

        0 0 0 1px
        rgba(255,255,255,.15),

        0 20px 45px
        rgba(0,0,0,.35);

    display:flex;

    align-items:center;
    justify-content:center;

    color:
        rgba(255,255,255,.45);

    font-size:15px;
}


.profile-name{

    margin-top:35px;

    font-size:47px;

    font-weight:400;

    line-height:1.2;

    color:#ffffff;
}


.profile-company{

    margin-top:42px;

    font-size:21px;

    font-weight:400;

    color:#baff9e;
}


/* =========================================================
   MAIN CONTENT
========================================================= */

.content{

    position:relative;

    z-index:2;

    width:100%;

    max-width:1000px;

    margin:auto;

    padding:0 28px;

    text-align:center;
}


/* =========================================================
   SECTION TITLE
========================================================= */

.section-title{

    margin-top:45px;

    margin-bottom:35px;

    font-size:30px;

    font-weight:400;

    position:relative;

    display:inline-block;

    color:#ffffff;
}


.section-title::after{

    content:"";

    display:block;

    width:150px;

    height:2px;

    background:
        #8cff4d;

    margin:8px auto 0;

    border-radius:10px;

    box-shadow:
        0 0 10px
        rgba(120,255,70,.35);
}


/* =========================================================
   ABOUT
========================================================= */

.about-text{

    font-size:21px;

    line-height:1.9;

    font-weight:300;

    color:#f4f5fa;

    margin-bottom:35px;
}


.about-heading{

    font-size:21px;

    font-weight:400;

    color:#9cff63;
}


/* =========================================================
   CONTACT CARD
========================================================= */

.contact-card{

    width:100%;

    border-radius:34px;

    padding:35px 25px 42px;

    background:
        linear-gradient(
            135deg,
            rgba(49,91,82,.90),
            rgba(47,77,75,.70)
        );

    border:
        1px solid
        rgba(140,255,77,.14);

    box-shadow:

        inset 0 0 30px
        rgba(255,255,255,.025),

        0 15px 35px
        rgba(0,0,0,.20);
}


.contact-block{

    margin-bottom:30px;
}


.contact-block:last-child{

    margin-bottom:0;
}


.contact-icon{

    width:74px;
    height:74px;

    margin:0 auto 17px;

    border-radius:50%;

    display:flex;

    align-items:center;
    justify-content:center;

    background:
        rgba(32,76,57,.78);

    border:
        1px solid
        rgba(140,255,77,.15);

    font-size:36px;

    color:#baff9e;
}


.contact-label{

    font-size:20px;

    font-weight:400;

    margin-bottom:7px;

    color:#ffffff;
}


.contact-value{

    font-size:21px;

    font-weight:300;

    line-height:1.6;

    color:#edfbe8;
}


/* =========================================================
   QR SECTION
========================================================= */

.qr-section{

    margin-top:70px;
}


.qr-box{

    width:90%;

    max-width:640px;

    margin:80px auto 0;

    background:#ffffff;

    padding:55px;

    border-radius:30px;

    position:relative;

    box-shadow:
        0 20px 50px
        rgba(0,0,0,.25);
}


.qr-image-space{

    width:280px;
    height:280px;

    margin:auto;

    background:#e8e8e8;

    display:flex;

    align-items:center;
    justify-content:center;

    color:#777777;

    border-radius:4px;
}


.qr-profile-space{

    position:absolute;

    width:100px;
    height:100px;

    left:50%;

    top:-52px;

    transform:translateX(-50%);

    border-radius:50%;

    border:
        6px solid
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #5d8061,
            #193e35
        );

    display:flex;

    align-items:center;
    justify-content:center;

    color:
        rgba(255,255,255,.50);

    font-size:11px;
}


/* =========================================================
   SERVICES
========================================================= */

.services-grid{

    margin-top:75px;

    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:35px;
}


.service-card{

    width:100%;

    text-align:left;
}


.service-image-space{

    width:100%;

    height:310px;

    border-radius:20px;

    background:
        linear-gradient(
            135deg,
            rgba(65,105,90,.90),
            rgba(24,52,48,.95)
        );

    border:
        1px solid
        rgba(140,255,77,.10);

    display:flex;

    align-items:center;
    justify-content:center;

    color:
        rgba(255,255,255,.35);

    overflow:hidden;
}


.service-title{

    margin-top:22px;

    font-size:23px;

    font-weight:400;

    color:#ffffff;
}


.service-description{

    margin-top:13px;

    font-size:18px;

    line-height:1.8;

    color:#9caeaa;
}


/* =========================================================
   GALLERY
========================================================= */

.gallery-section{

    margin-top:85px;
}


.gallery-box{

    position:relative;

    width:100%;

    background:
        linear-gradient(
            135deg,
            rgba(38,73,67,.85),
            rgba(20,48,47,.85)
        );

    border-radius:30px;

    padding:22px;

    border:
        1px solid
        rgba(140,255,77,.10);
}


.gallery-image-space{

    width:100%;

    height:420px;

    background:
        linear-gradient(
            135deg,
            rgba(66,105,93,.85),
            rgba(24,50,47,.95)
        );

    border-radius:2px;

    display:flex;

    align-items:center;
    justify-content:center;

    color:
        rgba(255,255,255,.35);
}


.gallery-controls{

    margin-top:32px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:0 75px;
}


.gallery-arrow{

    width:45px;
    height:45px;

    border:0;

    background:transparent;

    color:#baff9e;

    font-size:50px;

    font-weight:300;

    cursor:pointer;

    display:flex;

    align-items:center;
    justify-content:center;
}


.gallery-dots{

    display:flex;

    gap:18px;
}


.gallery-dot{

    width:13px;
    height:13px;

    border-radius:50%;

    background:#394a46;

}


.gallery-dot.active{

    background:#9cff63;

    box-shadow:
        0 0 10px
        rgba(140,255,77,.45);
}


.gallery-view-more{

    margin-top:25px;

    margin-bottom:65px;
}


/* =========================================================
   VIEW MORE BUTTON
========================================================= */

.view-more-section{

    width:100%;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-top:30px;

    margin-bottom:35px;
}


.view-more-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    min-width:210px;

    padding:14px 28px;

    border-radius:13px;

    background:
        linear-gradient(
            135deg,
            #75bd42,
            #4e9233
        );

    border:
        1px solid
        rgba(180,255,130,.30);

    color:#ffffff;

    font-size:16px;

    font-weight:500;

    box-shadow:
        0 9px 25px
        rgba(0,0,0,.25),

        0 0 18px
        rgba(100,220,55,.10);

    transition:.25s ease;
}


.view-more-btn:hover{

    transform:translateY(-3px);

    background:
        linear-gradient(
            135deg,
            #8bdb51,
            #5ba83b
        );

    box-shadow:
        0 15px 32px
        rgba(0,0,0,.35);
}


.view-more-arrow{

    font-size:20px;

    transition:.25s ease;
}


.view-more-btn:hover
.view-more-arrow{

    transform:translateX(5px);
}


/* =========================================================
   CLIENTS
========================================================= */

.clients-section{

    width:100%;

    max-width:900px;

    margin:70px auto 0;

    text-align:center;
}


.clients-grid{

    width:100%;
}


.client-card{

    width:100%;

    max-width:850px;

    margin:0 auto 30px;

    background:
        linear-gradient(
            135deg,
            rgba(43,82,72,.88),
            rgba(39,65,64,.75)
        );

    border-radius:30px;

    padding:22px;

    text-align:left;

    border:
        1px solid
        rgba(140,255,77,.10);

    box-shadow:
        0 15px 35px
        rgba(0,0,0,.18);
}


.client-image-space{

    width:100%;

    height:390px;

    border-radius:5px;

    background:
        linear-gradient(
            135deg,
            rgba(68,107,91,.85),
            rgba(25,54,49,.95)
        );

    display:flex;

    align-items:center;
    justify-content:center;

    color:
        rgba(255,255,255,.35);
}


.client-name{

    margin-top:24px;

    font-size:24px;

    font-weight:400;

    color:#ffffff;
}


.client-description{

    margin-top:10px;

    color:#a7b8b3;

    font-size:16px;

    line-height:1.7;
}


.clients-view-more{

    margin-top:30px;

    margin-bottom:70px;
}


/* =========================================================
   PRODUCTS
========================================================= */

.products-section{

    width:100%;

    max-width:900px;

    margin:0 auto;

    text-align:center;
}


.product-card{

    width:100%;

    max-width:850px;

    margin:0 auto 30px;

    background:
        linear-gradient(
            135deg,
            rgba(43,82,72,.88),
            rgba(39,65,64,.75)
        );

    border-radius:30px;

    padding:22px;

    text-align:left;

    border:
        1px solid
        rgba(140,255,77,.10);

    box-shadow:
        0 15px 35px
        rgba(0,0,0,.18);
}


.product-image-space{

    width:100%;

    height:390px;

    border-radius:5px;

    background:
        linear-gradient(
            135deg,
            rgba(68,107,91,.85),
            rgba(25,54,49,.95)
        );

    display:flex;

    align-items:center;
    justify-content:center;

    color:
        rgba(255,255,255,.35);
}


.product-name{

    margin-top:24px;

    font-size:24px;

    font-weight:400;

    color:#ffffff;
}


.product-description{

    margin-top:10px;

    color:#a7b8b3;

    font-size:16px;

    line-height:1.7;
}


.products-view-more{

    margin-top:30px;

    margin-bottom:70px;
}


/* =========================================================
   BUSINESS HOURS
========================================================= */

.business-hours{

    margin-top:70px;
}


.hours-card{

    width:100%;
}


.hour-row{

    width:100%;

    min-height:125px;

    margin-bottom:20px;

    padding:22px 25px;

    display:flex;

    align-items:center;

    border-radius:28px;

    background:
        linear-gradient(
            135deg,
            rgba(48,87,75,.95),
            rgba(40,70,65,.90)
        );

    border:
        1px solid
        rgba(140,255,77,.08);

    text-align:left;
}


.calendar-icon{

    width:72px;
    height:72px;

    flex-shrink:0;

    border-radius:22px;

    background:
        rgba(25,67,51,.75);

    display:flex;

    align-items:center;
    justify-content:center;

    font-size:34px;

    margin-right:22px;

    color:#baff9e;
}


.hour-day{

    font-size:21px;

    font-weight:400;
}


.hour-time{

    margin-top:9px;

    font-size:19px;

    font-weight:300;

    color:#b7c7c2;
}


/* =========================================================
   FINAL CONTACT
========================================================= */

.final-contact{

    margin-top:90px;

    padding-bottom:130px;
}


.final-card{

    width:100%;

    padding:35px 25px;

    border-radius:30px;

    background:
        linear-gradient(
            135deg,
            rgba(45,82,71,.90),
            rgba(44,68,64,.85)
        );

    text-align:center;

    border:
        1px solid
        rgba(140,255,77,.10);
}


.final-card h3{

    font-size:27px;

    font-weight:400;
}


.final-card p{

    margin-top:15px;

    color:#b4c4bf;

    line-height:1.8;
}


.call-buttons{

    margin-top:25px;

    display:flex;

    justify-content:center;

    gap:15px;

    flex-wrap:wrap;
}


.call-btn{

    padding:13px 24px;

    border-radius:14px;

    background:
        #527f42;

    border:
        1px solid
        rgba(180,255,130,.16);

    transition:.25s ease;
}


.call-btn:hover{

    background:#6ca94f;

    transform:translateY(-2px);
}


/* =========================================================
   FOOTER
========================================================= */

footer{

    padding:45px 25px 110px;

    text-align:center;

    color:#849b92;

    font-size:13px;
}


.footer-name{

    color:#ffffff;

    font-size:19px;

    margin-bottom:10px;
}


/* =========================================================
   ADD TO CONTACT
========================================================= */

.add-contact{

    position:fixed;

    left:50%;

    bottom:18px;

    transform:translateX(-50%);

    z-index:9999;

    width:365px;

    max-width:calc(100% - 40px);

    height:72px;

    border-radius:9px;

    background:
        #527f42;

    box-shadow:
        0 12px 35px
        rgba(0,0,0,.35),

        0 0 18px
        rgba(100,220,55,.12);

    display:flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    color:#ffffff;

    font-size:20px;

    cursor:pointer;

    border:0;

    transition:.25s ease;
}


.add-contact:hover{

    background:#6ba84d;

    transform:
        translateX(-50%)
        translateY(-2px);
}


.add-contact-icon{

    font-size:25px;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:600px){

    .content{

        padding:0 12px;
    }


    .top-header{

        height:60px;

        padding-right:12px;
    }


    .menu{

        width:45px;
        height:45px;
    }


    .menu span{

        width:22px;

        height:2px;

        margin:4px auto;
    }


    .hero-image-space{

        height:180px;
    }


    .hero-image-space span{

        font-size:13px;
    }


    .hero-overlay{

        height:180px;
    }


    .profile{

        margin-top:-45px;
    }


    .profile-photo-space{

        width:130px;

        height:130px;

        border-width:6px;
    }


    .profile-name{

        margin-top:22px;

        font-size:30px;
    }


    .profile-company{

        margin-top:22px;

        font-size:16px;
    }


    .section-title{

        margin-top:25px;

        margin-bottom:18px;

        font-size:21px;
    }


    .section-title::after{

        width:105px;

        margin-top:5px;
    }


    .about-text{

        font-size:14px;

        line-height:1.65;

        margin-bottom:30px;
    }


    .about-heading{

        font-size:16px;
    }


    /* CONTACT */

    .contact-card{

        padding:18px 12px 22px;

        border-radius:18px;
    }


    .contact-block{

        margin-bottom:20px;
    }


    .contact-icon{

        width:48px;

        height:48px;

        margin-bottom:9px;

        font-size:23px;
    }


    .contact-label{

        font-size:15px;

        margin-bottom:4px;
    }


    .contact-value{

        font-size:13px;

        line-height:1.5;
    }


    /* QR */

    .qr-section{

        margin-top:45px;
    }


    .qr-box{

        width:100%;

        margin:45px auto 0;

        padding:25px 10px;

        border-radius:18px;
    }


    .qr-image-space{

        width:165px;

        height:165px;
    }


    .qr-profile-space{

        width:62px;

        height:62px;

        top:-32px;

        border-width:4px;
    }


    /* SERVICES */

    .services-grid{

        grid-template-columns:1fr;

        gap:20px;

        margin-top:35px;
    }


    .service-image-space{

        height:155px;

        border-radius:12px;
    }


    .service-title{

        margin-top:9px;

        font-size:16px;
    }


    .service-description{

        margin-top:5px;

        font-size:12px;

        line-height:1.5;
    }


    /* GALLERY */

    .gallery-section{

        margin-top:50px;
    }


    .gallery-box{

        padding:10px;

        border-radius:17px;
    }


    .gallery-image-space{

        height:175px;
    }


    .gallery-controls{

        margin-top:13px;

        padding:0 20px;
    }


    .gallery-arrow{

        width:35px;

        height:35px;

        font-size:29px;
    }


    .gallery-dots{

        gap:7px;
    }


    .gallery-dot{

        width:7px;

        height:7px;
    }


    .gallery-view-more{

        margin-top:16px;

        margin-bottom:45px;
    }


    /* VIEW MORE */

    .view-more-section{

        margin-top:18px;

        margin-bottom:20px;
    }


    .view-more-btn{

        min-width:165px;

        padding:10px 17px;

        border-radius:10px;

        font-size:13px;
    }


    .view-more-arrow{

        font-size:16px;
    }


    /* CLIENTS */

    .clients-section{

        width:100%;

        max-width:100%;

        margin-top:45px;
    }


    .client-card{

        width:100%;

        max-width:100%;

        margin:0 auto 17px;

        padding:10px;

        border-radius:17px;
    }


    .client-image-space{

        height:175px;

        border-radius:4px;
    }


    .client-name{

        margin-top:9px;

        font-size:16px;
    }


    .client-description{

        margin-top:5px;

        font-size:12px;

        line-height:1.5;
    }


    .clients-view-more{

        margin-top:18px;

        margin-bottom:45px;
    }


    /* PRODUCTS */

    .products-section{

        width:100%;

        max-width:100%;

        margin:0 auto;
    }


    .product-card{

        width:100%;

        max-width:100%;

        padding:10px;

        border-radius:17px;

        margin:0 auto 17px;
    }


    .product-image-space{

        height:175px;

        border-radius:4px;
    }


    .product-name{

        margin-top:9px;

        font-size:16px;
    }


    .product-description{

        margin-top:5px;

        font-size:12px;

        line-height:1.5;
    }


    .products-view-more{

        margin-top:18px;

        margin-bottom:50px;
    }


    /* BUSINESS HOURS */

    .business-hours{

        margin-top:55px;
    }


    .hour-row{

        min-height:75px;

        padding:11px;

        margin-bottom:10px;

        border-radius:16px;
    }


    .calendar-icon{

        width:45px;

        height:45px;

        border-radius:13px;

        font-size:21px;

        margin-right:10px;
    }


    .hour-day{

        font-size:15px;
    }


    .hour-time{

        margin-top:3px;

        font-size:12px;
    }


    /* FINAL CONTACT */

    .final-contact{

        margin-top:55px;

        padding-bottom:100px;
    }


    .final-card{

        padding:22px 12px;

        border-radius:18px;
    }


    .final-card h3{

        font-size:20px;
    }


    .final-card p{

        margin-top:9px;

        font-size:13px;

        line-height:1.55;
    }


    .call-buttons{

        margin-top:16px;

        gap:8px;
    }


    .call-btn{

        padding:9px 15px;

        border-radius:10px;

        font-size:13px;
    }


    /* ADD CONTACT */

    .add-contact{

        left:50% !important;

        right:auto !important;

        transform:
            translateX(-50%) !important;

        width:190px;

        max-width:190px;

        height:42px;

        bottom:8px;

        font-size:12px;

        border-radius:8px;

        gap:6px;
    }


    .add-contact-icon{

        font-size:15px;
    }


    /* FOOTER */

    footer{

        padding:30px 15px 85px;

        font-size:11px;
    }


    .footer-name{

        font-size:16px;

        margin-bottom:7px;
    }

}


/* =========================================================
   SMALL PHONES
========================================================= */

@media(max-width:380px){

    .profile-name{

        font-size:27px;
    }


    .profile-company{

        font-size:15px;
    }


    .about-text{

        font-size:13px;
    }


    .service-image-space{

        height:140px;
    }


    .service-title{

        font-size:15px;
    }


    .service-description{

        font-size:11px;
    }


    .gallery-image-space{

        height:155px;
    }


    .client-name{

        font-size:16px;
    }


    .product-image-space{

        height:155px;
    }


    .section-title{

        font-size:20px;
    }

}


/* =========================================================
   PC SIZE
========================================================= */

@media(min-width:601px){

    .content{

        max-width:850px;

        padding:0 20px;
    }


    .hero-image-space{

        height:350px;
    }


    .hero-overlay{

        height:350px;
    }


    .profile{

        margin-top:-65px;
    }


    .profile-photo-space{

        width:140px;

        height:140px;

        border-width:6px;
    }


    .profile-name{

        margin-top:25px;

        font-size:36px;
    }


    .profile-company{

        margin-top:25px;

        font-size:17px;
    }


    .section-title{

        margin-top:35px;

        margin-bottom:25px;

        font-size:24px;
    }


    .section-title::after{

        width:120px;

        margin-top:6px;
    }


    .about-text{

        font-size:16px;

        line-height:1.7;

        margin-bottom:35px;
    }


    .about-heading{

        font-size:18px;
    }


    /* CONTACT */

    .contact-card{

        border-radius:25px;

        padding:25px 20px 30px;
    }


    .contact-block{

        margin-bottom:22px;
    }


    .contact-icon{

        width:58px;

        height:58px;

        margin-bottom:12px;

        font-size:28px;
    }


    .contact-label{

        font-size:17px;

        margin-bottom:5px;
    }


    .contact-value{

        font-size:16px;

        line-height:1.5;
    }


    /* QR */

    .qr-section{

        margin-top:50px;
    }


    .qr-box{

        width:75%;

        max-width:500px;

        margin:55px auto 0;

        padding:35px;

        border-radius:25px;
    }


    .qr-image-space{

        width:220px;

        height:220px;
    }


    .qr-profile-space{

        width:80px;

        height:80px;

        top:-42px;

        border-width:5px;
    }


    /* SERVICES */

    .services-grid{

        margin-top:50px;

        gap:25px;
    }


    .service-image-space{

        height:230px;

        border-radius:16px;
    }


    .service-title{

        margin-top:15px;

        font-size:19px;
    }


    .service-description{

        margin-top:8px;

        font-size:14px;

        line-height:1.6;
    }


    /* GALLERY */

    .gallery-section{

        margin-top:60px;
    }


    .gallery-box{

        border-radius:24px;

        padding:16px;
    }


    .gallery-image-space{

        height:320px;
    }


    .gallery-controls{

        margin-top:20px;

        padding:0 50px;
    }


    .gallery-arrow{

        font-size:38px;
    }


    .gallery-dots{

        gap:12px;
    }


    .gallery-dot{

        width:9px;

        height:9px;
    }


    /* CLIENTS */

    .clients-section{

        max-width:750px;

        margin:55px auto 0;
    }


    .client-card{

        max-width:750px;

        margin:0 auto 22px;

        padding:16px;

        border-radius:24px;
    }


    .client-image-space{

        height:320px;
    }


    .client-name{

        margin-top:17px;

        font-size:20px;
    }


    .client-description{

        margin-top:7px;

        font-size:14px;

        line-height:1.6;
    }


    /* PRODUCTS */

    .products-section{

        max-width:750px;
    }


    .product-card{

        max-width:750px;

        margin:0 auto 22px;

        padding:16px;

        border-radius:24px;
    }


    .product-image-space{

        height:320px;
    }


    .product-name{

        margin-top:17px;

        font-size:20px;
    }


    .product-description{

        margin-top:7px;

        font-size:14px;

        line-height:1.6;
    }


    /* BUSINESS HOURS */

    .business-hours{

        margin-top:55px;
    }


    .hour-row{

        min-height:95px;

        padding:16px 20px;

        margin-bottom:15px;

        border-radius:22px;
    }


    .calendar-icon{

        width:58px;

        height:58px;

        border-radius:17px;

        font-size:27px;

        margin-right:16px;
    }


    .hour-day{

        font-size:18px;
    }


    .hour-time{

        margin-top:6px;

        font-size:16px;
    }


    /* FINAL CONTACT */

    .final-contact{

        margin-top:65px;

        padding-bottom:100px;
    }


    .final-card{

        padding:28px 20px;

        border-radius:25px;
    }


    .final-card h3{

        font-size:23px;
    }


    .final-card p{

        margin-top:10px;

        line-height:1.6;

        font-size:14px;
    }


    .call-buttons{

        margin-top:20px;

        gap:10px;
    }


    .call-btn{

        padding:11px 20px;

        border-radius:11px;

        font-size:14px;
    }


    /* FOOTER */

    footer{

        padding:35px 20px 95px;

        font-size:12px;
    }


    .footer-name{

        font-size:17px;

        margin-bottom:8px;
    }


    /* ADD CONTACT */

    .add-contact{

        width:300px;

        height:58px;

        bottom:15px;

        font-size:16px;
    }


    .add-contact-icon{

        font-size:21px;
    }

}
/* =========================================
   PROFILE IMAGE - CIRCLE
   ========================================= */

.profile-image-space {
    width: 220px !important;
    height: 220px !important;
    min-width: 220px !important;
    min-height: 220px !important;

    border-radius: 50% !important;
    overflow: hidden !important;

    margin: 0 auto !important;

    position: relative !important;

    border: 4px solid #ffffff !important;

    background: #4b6fa5 !important;
}


.profile-image-space img {
    width: 100% !important;
    height: 100% !important;

    display: block !important;

    object-fit: cover !important;

    object-position: 73% 32% !important;

    border-radius: 50% !important;
      transform: scale(1.25);
}


/* MOBILE */

@media (max-width: 600px) {

    .profile-image-space {
        width: 160px !important;
        height: 160px !important;
        min-width: 160px !important;
        min-height: 160px !important;
    }

}
/* =========================================
   CONTACT CARD - MOBILE SIZE
   ========================================= */

@media (max-width: 600px) {

    .contact-card {
        width: 92% !important;
        max-width: 92% !important;
        margin-left: auto !important;
        margin-right: auto !important;

        padding: 28px 18px !important;
        border-radius: 24px !important;
    }

}
/* =========================================
   MOBILE HERO IMAGE FIX
   ========================================= */



@media (max-width: 600px) {

    .hero {
        position: relative;
        overflow: visible;
    }

    .hero-image-space {
        width: 100% !important;
        height: 180px !important;
        overflow: hidden !important;
        position: relative !important;
    }

    .hero-image-space img {
        width: 100% !important;
        height: 100% !important;
        display: block !important;

        object-fit: cover !important;
        object-position: center center !important;
    }

}
/* =========================================
   PC HERO - NO EMPTY SPACE
   ========================================= */

@media (min-width: 601px) {

    .hero {
        position: relative;
        overflow: visible;
    }

    .hero-image-space {
        width: 100% !important;
        height: 350px !important;
        overflow: hidden !important;
        position: relative !important;
    }

    .hero-image-space img {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        object-fit: cover !important;
        object-position: center center !important;
    }

}
/* =========================================
   GALLERY SLIDER
========================================= */

.gallery-box {
    overflow: hidden;
    position: relative;
}


.gallery-slider {
    width: 100%;
    overflow: hidden;
    border-radius: 18px;
}


.gallery-track {
    display: flex;
    width: 100%;
    transform: translateX(-12.5%);
    transition: transform 0.6s ease;
    touch-action: pan-y;
    user-select: none;
}


.gallery-slide {
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;
}


.gallery-slide img {
    width: 100%;
    height: 400px;
    display: block;

    object-fit: cover;
    object-position: center;

    pointer-events: none;
    user-select: none;
}


/* =========================================
   GALLERY CONTROLS
========================================= */

.gallery-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;
    padding: 22px 70px 0;

    box-sizing: border-box;
}


.gallery-arrow {
    width: 45px;
    height: 45px;

    border: none;
    background: transparent;

    color: #8cff4f;

    font-size: 38px;
    line-height: 1;

    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;

    transition: transform 0.2s ease,
                opacity 0.2s ease;
}


.gallery-arrow:hover {
    transform: scale(1.2);
}


.gallery-arrow:active {
    transform: scale(0.95);
}


/* =========================================
   DOTS
========================================= */

.gallery-dots {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;
}


.gallery-dot {
    width: 12px;
    height: 12px;

    padding: 0;

    border: none;
    border-radius: 50%;

    background: rgba(255,255,255,0.18);

    cursor: pointer;

    transition:
        background 0.3s ease,
        transform 0.3s ease;
}


.gallery-dot.active {
    background: #8cff4f;
    transform: scale(1.15);

    box-shadow:
        0 0 12px rgba(140,255,79,0.7);
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 600px) {

    .gallery-slider {
        border-radius: 12px;
    }


    .gallery-slide img {
        height: 175px;

        object-fit: cover;
        object-position: center;
    }


    .gallery-controls {
        padding: 15px 12px 0;
    }


    .gallery-arrow {
        width: 38px;
        height: 38px;

        font-size: 32px;
    }


    .gallery-dots {
        gap: 8px;
    }


    .gallery-dot {
        width: 9px;
        height: 9px;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 380px) {

    .gallery-slide img {
        height: 160px;
    }


    .gallery-controls {
        padding-left: 8px;
        padding-right: 8px;
    }

}
.gallery-full-grid {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 12px;

}


.gallery-full-card {

    width: 100%;

    padding: 0;

    margin: 0;

    overflow: hidden;

    border-radius: 10px;

    background: transparent;

    border: none;

    box-shadow: none;

    transition: transform 0.25s ease;

}


.gallery-full-card:hover {

    transform: scale(1.02);

}


.gallery-full-card img {

    width: 100%;

    height: 230px;

    display: block;

    object-fit: cover;

    border-radius: 10px;

}
@media (max-width: 600px) {

    .gallery-full-section {
        padding: 25px 8px 60px;
    }

    .gallery-full-grid {

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

        gap: 7px;

    }

    .gallery-full-card {
        border-radius: 7px;
    }

    .gallery-full-card img {

        height: 150px;

        border-radius: 7px;

    }

}
/* =====================================================
   FULL GALLERY PAGE
===================================================== */


/* =====================================================
   PAGE
===================================================== */

.gallery-page {

    min-height: 100vh;

    background:
        radial-gradient(
            circle at top,
            rgba(140, 255, 79, 0.08),
            transparent 35%
        ),
        #020a1d;

    color: #ffffff;

}


/* =====================================================
   HEADER
===================================================== */

.gallery-page .top-header {

    position: relative;

    width: 100%;

    min-height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    box-sizing: border-box;

}


.gallery-page .header-brand {

    color: #ffffff;

    font-size: 24px;

    font-weight: 600;

    letter-spacing: 1px;

}


.gallery-back {

    position: absolute;

    left: 20px;

    top: 50%;

    transform: translateY(-50%);

    width: 44px;

    height: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    text-decoration: none;

    color: #8cff4f;

    background: rgba(75, 111, 165, 0.35);

    border: 1px solid rgba(140, 255, 79, 0.25);

    font-size: 27px;

    transition: 0.25s ease;

}


.gallery-back:hover {

    transform:
        translateY(-50%)
        scale(1.08);

}


/* =====================================================
   GALLERY SECTION
===================================================== */

.gallery-full-section {

    width: 100%;

    max-width: 1100px;

    margin: 0 auto;

    padding: 35px 20px 70px;

    box-sizing: border-box;

}


.gallery-full-section .section-title {

    text-align: center;

    margin-bottom: 35px;

}


/* =====================================================
   IMAGE GRID
===================================================== */

.gallery-full-grid {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 12px;

    width: 100%;

}


/* =====================================================
   IMAGE ITEM
===================================================== */

.gallery-full-card {

    width: 100%;

    padding: 0;

    margin: 0;

    overflow: hidden;

    background: transparent;

    border: none;

    box-shadow: none;

    border-radius: 0;

    transition: transform 0.25s ease;

}


/* Slight hover effect on PC */

.gallery-full-card:hover {

    transform: scale(1.02);

}


/* =====================================================
   ACTUAL IMAGE
===================================================== */

.gallery-full-card img {

    width: 100%;

    height: auto;

    display: block;

    object-fit: contain;

    border-radius: 0;

    margin: 0;

    padding: 0;

}


/* =====================================================
   FOOTER
===================================================== */

.gallery-footer {

    width: 100%;

    text-align: center;

    padding: 25px 15px 40px;

    box-sizing: border-box;

    color: rgba(255, 255, 255, 0.6);

    font-size: 13px;

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 600px) {


    /* Section */

    .gallery-full-section {

        width: 100%;

        padding:
            25px 8px 60px;

        box-sizing: border-box;

    }


    /* Heading */

    .gallery-full-section .section-title {

        margin-bottom: 25px;

    }


    /* Two images per row */

    .gallery-full-grid {

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

        gap: 6px;

    }


    /* Image item */

    .gallery-full-card {

        width: 100%;

        padding: 0;

        margin: 0;

        border-radius: 0;

    }


    /* Original image ratio */

    .gallery-full-card img {

        width: 100%;

        height: auto;

        display: block;

        object-fit: contain;

        border-radius: 0;

    }


    /* Header */

    .gallery-page .top-header {

        min-height: 60px;

    }


    .gallery-page .header-brand {

        font-size: 20px;

    }


    .gallery-back {

        left: 12px;

        width: 40px;

        height: 40px;

        font-size: 24px;

    }


}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {


    .gallery-full-section {

        padding-left: 5px;

        padding-right: 5px;

    }


    .gallery-full-grid {

        gap: 5px;

    }


}
/* Gallery heading center */
.gallery-full-section .section-title {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}/* ==========================================
   SIGNAGE MENU POPUP
   COMPACT SIZE - MOBILE FRIENDLY
========================================== */

/* Menu button */
.top-header .menu#menuToggle {
    position: relative;
    z-index: 2003;
    flex-shrink: 0;
    border: 1px solid rgba(255, 255, 255, 0.12);
    padding: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

/* Background overlay */
#menuOverlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: rgba(0, 0, 0, 0.10);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.22s ease;
}

/* Popup box */
#menuPopup {
    position: fixed;
    top: 132px;
    left: 30px;

    width: 300px;
    max-width: calc(100vw - 60px);

    padding: 8px;
    box-sizing: border-box;

    background: rgba(28, 37, 59, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 20px;

    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);

    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);

    z-index: 2004;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translateY(-7px);

    transition:
        opacity 0.22s ease,
        transform 0.22s ease,
        visibility 0.22s ease;
}

/* Open popup */
#menuPopup.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

/* Overlay visible */
#menuOverlay.active {
    opacity: 1;
    visibility: visible;
}

/* Menu options */
#menuPopup .menu-item {
    display: flex;
    align-items: center;
    gap: 14px;

    width: 100%;
    min-height: 68px;
    padding: 6px 8px;

    box-sizing: border-box;
    border: 0;
    border-radius: 12px;
    background: transparent;

    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: 17px;
    font-weight: 300;
    line-height: 1.3;
    text-align: left;
    text-decoration: none;

    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

/* Hover effect */
#menuPopup .menu-item:hover {
    background: rgba(255, 255, 255, 0.07);
}

/* Circular icons */
#menuPopup .menu-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 52px;
    width: 52px;
    height: 52px;

    border-radius: 50%;
    box-sizing: border-box;
}

/* SVG icons */
#menuPopup .menu-icon svg {
    width: 27px;
    height: 27px;
}

/* WhatsApp icon */
#menuPopup .whatsapp-icon {
    background: #16bd24;
    color: #ffffff;
}

/* Share and Login icons */
#menuPopup .share-icon,
#menuPopup .login-icon {
    background: #ffffff;
    color: #355477;
}

/* ==========================================
   MOBILE SCREENS
========================================== */

@media (max-width: 600px) {

    #menuPopup {
        top: 132px;
        left: 30px;
        width: 300px;
        max-width: calc(100vw - 60px);
        padding: 8px;
        border-radius: 20px;
    }

    #menuPopup .menu-item {
        min-height: 68px;
        gap: 14px;
        padding: 6px 8px;
        font-size: 17px;
    }

    #menuPopup .menu-icon {
        flex: 0 0 52px;
        width: 52px;
        height: 52px;
    }
}

/* ==========================================
   SMALL MOBILE SCREENS
========================================== */

@media (max-width: 380px) {

    #menuPopup {
        left: 15px;
        width: 280px;
        max-width: calc(100vw - 30px);
        padding: 7px;
    }

    #menuPopup .menu-item {
        min-height: 62px;
        gap: 11px;
        padding: 5px 7px;
        font-size: 16px;
    }

    #menuPopup .menu-icon {
        flex: 0 0 48px;
        width: 48px;
        height: 48px;
    }

    #menuPopup .menu-icon svg {
        width: 25px;
        height: 25px;
    }
}
/* 3-LINE MENU LEFT SIDE */
.top-header {
    justify-content: flex-start !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* Mobile screen */
@media (max-width: 600px) {
    .top-header {
        justify-content: flex-start !important;
        padding-left: 20px !important;
        padding-right: 12px !important;
    }
}
/* MENU POPUP - SPACE REDUCE */

@media (max-width: 600px) {
    #menuPopup {
        width: 280px !important;
        max-width: calc(100vw - 40px) !important;
        padding: 6px !important;
    }

    #menuPopup .menu-item {
        min-height: 58px !important;
        padding: 5px 7px !important;
        gap: 10px !important;
        font-size: 15px !important;
    }

    #menuPopup .menu-icon {
        flex: 0 0 44px !important;
        width: 44px !important;
        height: 44px !important;
    }

    #menuPopup .menu-icon svg {
        width: 24px !important;
        height: 24px !important;
    }
}
/* MENU POPUP - REFERENCE SCREENSHOT SIZE */

@media (max-width: 600px) {
    #menuPopup {
        top: 327px;
        left: 30px;
        width: 382px;
        max-width: calc(100vw - 60px);
        padding: 8px;
        border-radius: 25px;
    }

    #menuPopup .menu-item {
        min-height: 78px;
        padding: 8px;
        gap: 14px;
        font-size: 19px;
        line-height: 1.3;
    }

    #menuPopup .menu-icon {
        flex: 0 0 60px;
        width: 60px;
        height: 60px;
    }

    #menuPopup .menu-icon svg {
        width: 30px;
        height: 30px;
    }
}

@media (max-width: 380px) {
    #menuPopup {
        left: 15px;
        width: calc(100vw - 30px);
        max-width: calc(100vw - 30px);
    }

    #menuPopup .menu-item {
        min-height: 78px;
        gap: 12px;
        font-size: 18px;
    }
}@media (max-width: 600px) {
    #menuPopup {
        top: 60px !important;
    }
}
/* ==========================================
   PC MENU POPUP - SPACE REDUCE
========================================== */

@media (min-width: 601px) {
    #menuPopup {
        width: 300px !important;
        padding: 8px !important;
        left: 30px;
    }

    #menuPopup .menu-item {
        min-height: 65px !important;
        padding: 6px 8px !important;
        gap: 12px !important;
        font-size: 17px !important;
    }

    #menuPopup .menu-icon {
        flex: 0 0 50px !important;
        width: 50px !important;
        height: 50px !important;
    }

    #menuPopup .menu-icon svg {
        width: 26px !important;
        height: 26px !important;
    }
}/* PC MENU POPUP - MOVE UP */

@media (min-width: 601px) {
    #menuPopup {
        top: 80px !important;
    }
}

/* MATCH MACHINERY CARDS WITH CLIENTS / PRODUCTS */

.machinery-page {
    padding: 35px 20px 70px;
}

.machinery-header,
.machinery-grid {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

.machinery-back {
    min-width: 210px;
    min-height: 48px;
    padding: 14px 28px;
    border-radius: 13px;
    font-size: 16px;
    justify-content: center;
}

.machinery-heading {
    color: #ffffff;
    font-size: 30px;
    font-weight: 400;
    margin-top: 35px;
    margin-bottom: 35px;
}

.machinery-heading::after {
    width: 150px;
    height: 2px;
    margin-top: 8px;
}

.machinery-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
}

.machinery-card {
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    padding: 16px;
    border-radius: 24px;
    box-sizing: border-box;
    background: linear-gradient(
        135deg,
        rgba(43, 82, 72, 0.88),
        rgba(39, 65, 64, 0.75)
    );
    border: 1px solid rgba(140, 255, 77, 0.10);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.18);
}

.machinery-card img {
    width: 100%;
    height: 320px;
    display: block;
    object-fit: cover;
    border-radius: 5px;
}

.machinery-card-content {
    padding: 0;
}

.machinery-card h2 {
    margin: 17px 0 7px;
    font-size: 20px;
    font-weight: 400;
    color: #ffffff;
}

.machinery-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #a7b8b3;
}

@media (max-width: 600px) {
    .machinery-page {
        padding: 22px 12px 45px;
    }

    .machinery-header,
    .machinery-grid {
        max-width: 100%;
    }

    .machinery-back {
        min-width: 165px;
        min-height: 0;
        padding: 10px 17px;
        border-radius: 10px;
        font-size: 13px;
    }

    .machinery-heading {
        font-size: 21px;
        margin-top: 25px;
        margin-bottom: 18px;
    }

    .machinery-heading::after {
        width: 105px;
        margin-top: 5px;
    }

    .machinery-grid {
        grid-template-columns: 1fr;
        gap: 17px;
    }

    .machinery-card {
        max-width: 100%;
        padding: 10px;
        margin: 0 auto;
        border-radius: 17px;
    }

    .machinery-card img {
        height: 175px;
        border-radius: 4px;
    }

    .machinery-card h2 {
        margin-top: 9px;
        font-size: 16px;
    }

    .machinery-card p {
        margin-top: 5px;
        font-size: 12px;
        line-height: 1.5;
    }
}

@media (min-width: 601px) {
    .machinery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 22px;
        max-width: 1100px;
    }

    .machinery-card {
        max-width: 100%;
    }
}


.hero-image-space img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
}

.client-image-space img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}



/* Sirf image badi karo, card nahi */
.client-image-space img {
    width: 140%;
    height: 100%;
    max-width: none;
    object-fit: contain;
    object-position: center;
    display: block;
    padding: 0;
    box-sizing: border-box;
}

/* Mobile */
@media (max-width: 768px) {
    .client-image-space img {
        width: 140%;
        height: 100%;
        object-fit: contain;
        padding: 0;
    }
}

/* CLIENT IMAGE: FILL THE IMAGE AREA */
.client-image-space {
    width: 100%;
    overflow: hidden;
}

.client-image-space img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    padding: 0 !important;
    display: block;
    object-fit: cover;
    object-position: center;
}

/* MOBILE */
@media (max-width: 600px) {
    .client-image-space img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
    }
}

/* FIX SERVICES LAYOUT: PC + MOBILE */

.services-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    width: 100%;
    max-width: 1100px;
    margin: 25px auto;
    align-items: start;
}

.service-card {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.service-image-space {
    width: 100%;
    height: 260px;
    overflow: hidden;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.service-image-space img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
    padding: 8px;
    box-sizing: border-box;
}

.service-title,
.service-description {
    overflow-wrap: break-word;
    word-break: normal;
}

/* MOBILE */
@media (max-width: 768px) {
    .services-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        width: 100%;
    }

    .service-image-space {
        height: 220px;
    }
}

/* SMALL MOBILE */
@media (max-width: 400px) {
    .service-image-space {
        height: 180px;
    }
}


/* Image ko card ke andar full size karo */
.service-card .service-image-space {
    padding: 0 !important;
    overflow: hidden;
}

.service-card .service-image-space img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block;
    object-fit: cover !important;
    object-position: center;
}

/* Mobile */

@media (max-width: 600px) {
    .call-buttons {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .call-buttons a[href*="maps.app.goo.gl"] {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 10px auto 0 !important;
        flex: 0 0 auto !important;
    }
}

/* Card ka existing size aur design same rakho */
.product-card {
    padding: 20px;
    box-sizing: border-box;
}

/* Image existing area mein fit hogi */
.product-image-space {
    width: 100%;
    height: 220px;
    overflow: hidden;
    border-radius: 8px;
}

.product-image-space img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}/* Product image ki height badhao */
.product-image-space {
    height: 350px !important;
    overflow: hidden;
}

.product-image-space img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Mobile par image ki height */
@media (max-width: 600px) {
    .product-image-space {
        height: 200px !important;
    }
}