:root {
    --primary: #d1a840;
    --white: #FFF;
    --black: #000;
    --text: #303030;
    --sec-space: 100px 0;
    --head-font: 'Lobster Two';
}
html{
    scroll-behavior: smooth;
}
img {
    max-width: 100%;
    display: block;
}
a{
    text-decoration: none;
}

/* ============= Heading ============= */
header{
    box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
}
.heading {
    text-align: center;
    padding-bottom: 70px;
}

.heading h2 {
    font-size: 60px;
    text-transform: capitalize;
    font-weight: 600;
    letter-spacing: 0.58px;
    position: relative;
    font-family: var(--head-font);
}

.heading h2::after {
    position: absolute;
    content: "";
    bottom: -20px;
    left: 50%;
    width: 150px;
    height: 5px;
    background-color: var(--primary);
    transform: translateX(-50%);
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
}
/* ============= Banner ============== */
.banner{
    margin-top: 100px;
}
.banner .swiper {
    height: 80vh;
}

.banner .swiper-slide {
    position: relative;
}

.banner-data {
    position: absolute;
    top: 40%;
    left: 50%;
    z-index: 1;
    color: #FFF;
    text-align: center;
    display: inline-block;
    transform: translate(-50%, -40%);
}

.banner-data span {
    text-transform: uppercase;
    font-size: 25px;
    letter-spacing: 2px;
    margin-bottom: 20px;
    display: inline-block;
}

.banner-data h2 {
    text-transform: capitalize;
    font-size: 70px;
    margin-bottom: 20px;
}

.banner .swiper-slide::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.banner .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.banner .swiper-scrollbar-drag {
    background: rgba(255, 255, 255, 0.5);
}

/* ============== About ================ */
.about {
    padding: var(--sec-space);
}

.about img {
    box-shadow: rgba(0, 0, 0, 0.2) 0px 12px 28px 0px,
        rgba(0, 0, 0, 0.1) 0px 2px 4px 0px,
        rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;
}

.about-data {
    padding-left: 50px;
}

.about-data h3 {
    margin-bottom: 20px;
    font-size: 30px;
}

.about-data p {
    font-size: 18px;
    line-height: 34px;
}

/* =================== Craft ================= */
.craft {
    padding: var(--sec-space);
}

.craft .row {
    align-items: center;
}

.craft .row .col-lg-6 {
    margin-bottom: 100px;
}

.craft .row .col-lg-6:last-child {
    margin-bottom: 0;
}

.craft-image {
    height: 355px;
    border-radius: 50px;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 12px 28px 0px,
        rgba(0, 0, 0, 0.1) 0px 2px 4px 0px,
        rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;
    background: #d0d2d1;
}

.craft-image img {
    object-fit: cover;
    margin: 0 auto;
}

.craft-data card-body {
    font-size: 40px;
    margin-bottom: 30px;
}

.craft-data p {
    font-size: 18px;
    text-transform: capitalize;
    line-height: 30px;
}

/* =================== card-view ==================== */

.card-view .card img{
    max-width: 100%;
}
.card .product-img{
    max-width: 100%;
}
.card .product-img img{
    object-fit: cover;
    aspect-ratio: 1/1;
}
.card-view .card .coustom-product{
    font-size: 50px;
}
.card-view .card .coustom-price{
  font-size: 20px !important;
}
.card-view .swiper .swiper-slide img{
    height: 350px;
    width: 400px;
    object-fit: cover;
    object-position: center;
}
/* ============== Choose ============== */
.choose {
    padding: var(--sec-space);
}

.choose .card {
    box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px;
}

.card-icon {
    margin-bottom: 10px;
}

.card-icon i {
    height: 100px;
    width: 100px;
    line-height: 100px;
    border-radius: 50%;
    background-color: #F6F6F6;
    font-size: 40px;
    color: var(--primary);
}

.card-body h3 {
    font-size: 30px;
    margin-bottom: 15px;
}

.card-body p {
    font-size: 18px;
    line-height: 28px;
}


/* ====================== Inquire ===================== */
.inquire {
    padding: var(--sec-space);
}

.inquire .heading h2 {
    font-size: 40px;
    margin-bottom: 50px;
}

.inquire .heading p {
    font-size: 18px;
    line-height: 28px;
    max-width: 900px;
    margin: 0 auto;
}

.inquire .row .col-12:nth-child(2) {
    margin-bottom: 50px;
}
.inquire form textarea{
    resize: vertical;
}

.inquire .accordion-button:focus{
    box-shadow: none;
}

/* =================== Diff ======================== */
.diff {
    padding: var(--sec-space);
}

.diff .heading h2 {
    font-size: 40px;
    margin-bottom: 50px;
}

.diff .heading p {
    font-size: 18px;
    line-height: 28px;
    margin: 0 auto;
}

/* ================= testimonial ==================== */
.testimonial {
    padding: var(--sec-space);
}

.testimonial .card {
    height: 300px;
}

.testimonial .swiper-slide {
    width: 380px !important;
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.testimonial .swiper-slide .card .text-image {
    margin-bottom: 20px;
}


/* ============= Footer ============ */
footer {
    background-color: #F6F6F6;
}
footer .footer-top{
    padding: var(--sec-space);
}
footer .row{
    align-items: center;
}
footer .newsletter .heading{
    padding-bottom: 40px;
}
footer .newsletter .heading h2{
    font-size: 30px;
}
footer .newsletter .heading h2::after{
    width: 70px;
    bottom: -10px;
}
footer .footer-bottom{
    padding: 10px 0;
    border-top: 1px solid var(--primary);
}
footer .footer-bottom .row{
    align-items: center;
}
footer .footer-social li{
    padding: 0 15px;
}
footer .footer-social a{
    color: var(--black);
    font-size: 25px;
}
.img-2{
    background: #bfc3c6;
}
.img-2 img {
    transform: scale(0.6) translate(0px, -210px);
    overflow: visible;
}
.img-3 img{
    transform: scale(0.6);
    object-position: 0px -255px;
    overflow: visible;
}

.img-4 img{
    object-position: 0px -120px;
}

@media (max-width: 576px) {
    .img-4 img {
        object-position: 0px 0px;
    }
    .img-3 img {
        object-position: 0px 0px;
    }
    .img-2 img {
        transform: scale(0.6) translate(0px, 0px);
    }
}
.foot-logo img {
    width: 200px;
    margin: 0 auto;
}

.whatsapp{
    position: fixed;
    text-align: center;
    font-size: 26px;
    right: 2%;
    bottom: -25%;
    z-index: 99999;
    height: 60px;
    width: 60px;
    border-radius: 50%;
    line-height: 60px;
    background-color: #F4F4F4;
    box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    transition: all 0.5s;
}
.bring{
    bottom: 5%;
    opacity: 1;
    visibility: visible;
}

/* ===== Remix Icon ===== */


@font-face {
    font-family: "remixicon";
    src: url('../fonts/remixicon.eot?t=1692894176567'); /* IE9*/
    src: url('../fonts/remixicon.eot?t=1692894176567#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url("../fonts/remixicon.woff2?t=1692894176567") format("woff2"),
    url("../fonts/remixicon.woff?t=1692894176567") format("woff"),
    url('../fonts/remixicon.ttf?t=1692894176567') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
    url('../fonts/remixicon.svg?t=1692894176567#remixicon') format('svg'); /* iOS 4.1- */
    font-display: swap;
}

[class^="ri-"], [class*="ri-"] {
    font-family: 'remixicon' !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.ri-lg { font-size: 1.3333em; line-height: 0.75em; vertical-align: -.0667em; }
.ri-xl { font-size: 1.5em; line-height: 0.6666em; vertical-align: -.075em; }
.ri-xxs { font-size: .5em; }
.ri-xs { font-size: .75em; }
.ri-sm { font-size: .875em }
.ri-1x { font-size: 1em; }
.ri-2x { font-size: 2em; }
.ri-3x { font-size: 3em; }
.ri-4x { font-size: 4em; }
.ri-5x { font-size: 5em; }
.ri-6x { font-size: 6em; }
.ri-7x { font-size: 7em; }
.ri-8x { font-size: 8em; }
.ri-9x { font-size: 9em; }
.ri-10x { font-size: 10em; }
.ri-fw { text-align: center; width: 1.25em; }

.ri-youtube-line:before { content: "\f2d5"; color: #ff0000; }
.ri-facebook-box-line:before { content: "\ecb9"; color: #0866ff; }
.ri-whatsapp-line:before { content: "\f2bc"; color: #25d366; }
.ri-instagram-line:before { content: "\ee66"; color: #e600d3; }



@media (max-width: 768px){
    .about-data {
        padding-left: 20px;
        padding-right: 20px;
        margin-top: 50px;
    }
    .card-view .card{
        margin-bottom: 20px;
    }
    .craft .row .col-lg-6 {
        margin-bottom: 50px;
    }

    .craft .row .col-lg-6:nth-child(1){order: -4;}
    .craft .row .col-lg-6:nth-child(2){order: -3;}
    .craft .row .col-lg-6:nth-child(3){order: -1;}
    .craft .row .col-lg-6:nth-child(4){order: -2;}
    .craft .row .col-lg-6:nth-child(5){order: 1;}
    .craft .row .col-lg-6:nth-child(6){order: 2;}
    .craft .row .col-lg-6:nth-child(7){order: 4;}
    .craft .row .col-lg-6:nth-child(8){order: 3;}


    .craft .col-lg-6 .craft-data.ps-5{
        padding-left: 0px !important;
    }
    .craft .row .col-lg-6:nth-child(7) .craft-data{
        margin-top: 50px;
    }
    .craft .row .col-lg-6:nth-child(2),
    .craft .row .col-lg-6:nth-child(3),
    .craft .row .col-lg-6:nth-child(6){
        margin-bottom: 100px;
    }
    .craft .row .col-lg-6:nth-child(4) .img-2 img{
        transform: scale(0.6) translate(0px, -110px);
    }
    .craft .row .col-lg-6:nth-child(5) .img-3 img{
        transform: scale(0.8);
        object-position: 0px -115px;
    }


    footer .col-lg-6{
        text-align: center;
    }


}