@import url(https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Manrope:wght@200..800&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap);


a,
span {
    display: inline-block
}

.page-load-modal-text h2 strong,
.top-heading h2 {
    font-weight: 600
}

body,
html {
    overflow-x: clip;
    overflow-y: visible;
    scroll-behavior: smooth;
    scroll-padding-top: 210px
}

:root {
    --monts: "Montserrat", sans-serif;
    --inter: "Inter", sans-serif;
    --text-black: #31271E;
    --red: #D64545;
    --cream: #FAF5ED;
    --gray: #65625E;
    --white: #fff;
    --orange: #EE8D4D;
    --default-trans: all 0.3s ease-in-out
}

.scrollToTopBtn {
    width: 40px;
    height: 40px;
    border-radius: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffff;
    background: #d64545;
    position: fixed;
    bottom: 2em;
    right: .8rem;
    opacity: 0;
    pointer-events: none;
    transition: .3s;
    font-size: 34px;
    cursor: pointer;
    z-index: 1000
}

.btnn,
.scrollToTopBtn iconify-icon {
    color: #fff
}

.btnn,
header nav .nav-mid>.menu>ul>li .sub-menu li a,
header nav .nav-mid>.menu>ul>li>a {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    text-align: left
}

.showBtn {
    opacity: 1;
    transform: translateY(-40px);
    pointer-events: all
}

a {
    text-decoration: none;
    transition: .3s ease-in-out
}

.top-heading h2 {
    font-size: 52px;
    line-height: 68px
}

.banner_text ol li:last-child::after,
.bars,
.close {
    display: none
}

.btnn {
    border: none;
    padding: 10px 24px;
    background: #d64545;
    border-radius: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 0 15px;
    font-family: Manrope;
    line-height: 26px;
    position: relative;
    text-align: center;
    overflow: hidden;
    transition: .7s cubic-bezier(.75, 0, .125, 1);
    z-index: 1
}

.banner_text ol li::after,
.page-load-modal-box {
    background-repeat: no-repeat;
    background-position: center
}

.btnn::after,
.btnn::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    bottom: 100%;
    left: 0;
    z-index: -1;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.75, 0, .125, 1);
    transition: transform .7s cubic-bezier(.75, 0, .125, 1)
}

.btnn::before {
    background: #ee8d4db2
}

.btnn::after {
    background: #ee8d4d
}

.btnn:hover {
    color: #fff;
    background: 0 0
}

.btnn:hover::after,
.btnn:hover::before {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0)
}

.btnn:hover::after {
    -webkit-transition-delay: 175ms;
    transition-delay: 175ms
}

.top-heading h2,
.top-heading h2 em {
    font-style: normal
}
.site-map-sec ul li svg {
	display: none;
}
.site-map-sec ul li a {
	font-family: Inter;
	color: #000;
}
.site-map-sec ul li a:hover {
	color: #d64545;
}
.site-map-sec ul li .sub-menu {
	padding-left: 15px;
	margin-top: 12px;
}
.site-map-sec ul li {
	margin-bottom: 12px;
}

.hero h1,
.top-heading h2 {
    font-family: Montserrat;
    margin-bottom: 0
}
.page-load-modal-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000dc;
    z-index: 999999;
    padding: 0 15px;
    display: none
}

a.page-load-modal-close {
    color: #26160f
}

.page-load-modal-wrapper-in {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 40px 0
}

.page-load-modal-box {
    max-width: 1010px;
    margin: 0 auto;
    height: 706px;
    width: 100%;
    background-size: cover;
    text-align: center;
    padding: 110px 30px 70px;
    position: relative
}

.page-load-modal-text {
    max-width: 710px;
    margin: 0 auto
}

.page-load-modal-text .top-heading h2 {
    font-family: Montserrat;
    font-weight: 400;
    font-size: 52px;
    line-height: 126%;
    color: #d64545;
    margin-bottom: 20px
}

.page-load-modal-text .top-heading h3 {
    font-family: Inter;
    font-weight: 300;
    font-size: 26px;
    line-height: 36px;
    max-width: 636px;
    margin-left: auto;
    margin-right: auto
}

.discount-offer {
    background: url(images/ribbon.webp) center/contain no-repeat;
    font-family: Inter;
    font-weight: 300;
    font-size: 32px;
    line-height: 36px;
    max-width: 400px;
    height: 182px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center
}

.discount-offer strong {
    font-size: 42px;
    line-height: 36px;
    font-style: italic;
    font-weight: 700
}

.page-load-modal-close {
    position: absolute;
    right: 35px;
    top: 6px
}

header .top-header {
    background: #26160f;
    padding: 10px 0
}
header .logo img {
	width: 249px;
}
header .top-header .container-flex {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 0 60px
}

header .top-header .top-header-el a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0 20px;
    font-family: Manrope;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
    text-align: left;
    color: #fff
}

header .top-header .top-header-el a:hover,
header nav .nav-mid>.menu>ul>li>a:hover {
    color: #d64545
}

header.fixed nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999
}

header nav {
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1)
}

header nav .container-flex {
    display: flex;
    align-items: center;
    justify-content: space-between
}

header nav .nav-mid>.menu>ul {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0 20px;
    list-style: none;
    padding: 0;
    margin: 0
}

.arw-nav {
    position: absolute;
    right: 0px;
    width: 30px;
    height: 30px;
/*     background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="none" stroke="%23d6d6d6" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m6 9l6 6l6-6"/></svg>') no-repeat center; */
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 14.5a.74.74 0 0 1-.53-.22L8 10.78a.75.75 0 0 1 1-1.06l3 3l3-3a.75.75 0 0 1 1 1.06l-3.5 3.5a.74.74 0 0 1-.5.22'%3E%3C/path%3E%3C/svg%3E") no-repeat center;
    top: 23px;
    z-index: 99;
    cursor: pointer;
}

header nav .nav-mid>.menu>ul>li {
    position: relative;
    display: flex;
    align-items: center
}

header nav .nav-mid>.menu>ul>li svg {
    width: 30px
}

header nav .nav-mid>.menu>ul>li>a {
    font-family: Inter;
    color: #2d3748;
    padding: 25px 0;
    position: relative;
	padding-right: 25px;
}

header nav .nav-mid>.menu>ul>li:hover .sub-menu {
    opacity: 1;
    top: 100%;
    pointer-events: all;
    z-index: 99;
}

header nav .nav-mid>.menu>ul>li .sub-menu {
    position: absolute;
    top: 110%;
    width: 220px;
    background: #d64545;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    border-radius: 2px;
    opacity: 0;
    pointer-events: none;
    transition: .5s cubic-bezier(.175, .885, .32, 1.275);
    overflow: hidden;
    z-index: 99
}

header nav .nav-mid>.menu>ul>li .sub-menu li a {
    font-family: Inter;
    padding: 10px 20px;
    color: #fff;
    border-bottom: 1px solid #ffffff15;
    width: 100%
}

header nav .nav-mid>.menu>ul>li .sub-menu li a:hover {
    background: #fff;
    color: #26160f
}

.fixed-icon {
    position: fixed;
    right: 0;
    top: 220px;
    z-index: 9999
}

ul.sub-menu {
    padding: 0;
}

ul.sub-menu li {
    list-style-type: none;
}

.banner_text,
.hero,
.inner_banner {
    position: relative
}

.fixed-icon ul li a {
    width: 56px;
    height: 53px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #d64545;
    font-size: 24px;
    border: 1.56px solid #fffFFF33;
    background: #fff
}

.fixed-icon ul li a:hover {
    background: #e6e3df
}

.hero h1,
.hm-sec2-box .right p {
    text-align: left;
    font-style: normal
}

/* .hero {
    padding: 250px 0 60px;
    background-size: cover !important;
    background-position: center !important
} */
.swiper-pagination {
    top: 92% !important;
}

.swiper-pagination-bullet {
    width: 15px;
    height: 15px;
}

.swiper-pagination-bullet-active {
    background: #d64545;
    opacity: 1;
}

.hero-inner {
    padding: 250px 0 100px;
    background-size: cover !important;
    background-position: center !important;
}
/* .hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(199, 132, 79, .20000000298023224);
    z-index: 1;
    pointer-events: none
} */

.hero .container {
    max-width: 1440px
}

.hero h1 {
    margin-left: 20px;
    font-weight: 600;
    font-size: 76px;
    line-height: 1.3;
    color: #fff;
    max-width: 813px;
	text-shadow: 0 0 5px #000;
}

.hero .btnn {
    margin-left: 270px;
    transform: translateY(-10px)
}

.inner_banner img,
.inner_banner::after {
    top: 0;
    width: 100%;
    position: absolute;
    height: 100%;
    left: 0
}

.banner_text h1,
.banner_text ol li {
    font-weight: 600;
    color: var(--white)
}

.banner_text ol li,
.banner_text ol li a {
    vertical-align: middle;
    color: var(--white)
}

.inner_banner {
    z-index: 1;
    margin-bottom: 100px
}

.inner_banner::after {
    content: "";
    background: linear-gradient(90deg, rgba(0, 0, 0, .43) 0, rgba(0, 0, 0, 0) 100%)
}

.inner_banner img {
    object-fit: cover
}

.banner_text {
    padding: 135px 0;
    z-index: 1
}

.banner_text h1 {
    font-family: var(--monts);
    font-size: clamp(35px, 6vw, 76px);
    line-height: 110%;
    margin-bottom: 18px
}

.banner_text ol {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 0;
    padding: 0;
    gap: 5px 16px;
    flex-wrap: wrap
}

.banner_text ol li {
    position: relative;
    font-family: var(--monts) !important;
    font-size: 22px;
    line-height: 30px
}

.banner_text ol li a {
    display: inline-block;
    font-weight: 400;
    transition: var(--default-trans)
}

.banner_text ol li a:hover {
    color: var(--red)
}

.banner_text ol li::after {
    position: absolute;
    right: -19px;
    top: 50%;
    transform: translate(0, -50%);
    content: " ";
    width: 21px;
    height: 23px;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='10' height='21' viewBox='0 0 10 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.000156224 20.7244L7.26016 0.000412583H9.72416L2.46416 20.7244H0.000156224Z' fill='white'/%3E%3C/svg%3E%0A");
    background-size: contain
}
header nav .nav-mid>.menu>ul>li svg {
	display: none;
}

@media(max-width:1440px) {
    header nav .nav-mid>.menu>ul {
        gap: 0 15px
    }

    .container {
        max-width: 1140px !important
    }
	header nav .container-flex, header .top-header .container-flex {
		max-width: 1320px!important;
	}
    .hero .btnn {
        margin-left: 0;
        transform: translateY(-10px)
    }

    .hero-btn {
        text-align: right
    }

    .hero h1 {
        font-size: 50px
    }
}

@media(max-width:1280px) {
    .hero h1 {
        font-size: 40px
    }
}

@media(max-width:1199px) {
    /* header nav .nav-mid>.menu>ul {
        gap: 0 10px
    } */

    header nav .btnn {
        padding: 8px 15px !important;
        font-size: 14px
    }

    .page-load-modal-box {
        max-width: 785px;
        height: auto;
        background-size: contain;
        padding: 75px 30px 70px
    }

    .page-load-modal-text .top-heading h2 {
        font-size: 36px
    }

    .page-load-modal-text .top-heading h3 {
        font-size: 20px;
        line-height: 30px;
        max-width: 550px
    }

    .discount-offer {
        font-size: 20px;
        max-width: 305px;
        height: 138px
    }

    .discount-offer strong,
    .hero h1 {
        font-size: 30px
    }

    .hero .btnn {
        font-size: 14px;
        padding: 8px 10px
    }
	header nav .nav-mid>.menu>ul {
		gap:0 3px;
	}
	header nav .nav-mid>.menu>ul li a {
		font-size: 14px;
	}
}

@media(max-width:1024px) {
    .hero h1 {
        font-size: 35px
    }
}

@media(max-width:991px) {

    .menu,
    .menu::before {
        height: 100vh;
        position: fixed;
        top: 0
    }

    .bars,
    .menu {
        background: #d64545
    }

    nav {
        padding: 18px 0
    }

    header.show .menu {
        right: 0
    }

    header.show .menu::before {
        opacity: 1
    }

    .menu {
        right: -100%;
        width: 300px;
        overflow-y: auto;
        transition: .5s ease-in-out;
        z-index: 9999
    }

    .menu::before {
        content: '';
        left: 0;
        width: 100%;
        background: rgba(0, 0, 0, .7);
        z-index: -1;
        opacity: 0;
        pointer-events: none;
        transition: .3s ease-in-out
    }

    .menu>ul {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        margin-top: 70px !important
    }

    .menu>ul>li {
        text-align: left;
        width: 100%;
        border-bottom: 1px solid #bb2b2b52;
        flex-direction: column
    }

    .bars,
    .nav-right {
        align-items: center;
        display: flex
    }

    .menu>ul>li:last-child {
        border-bottom: 0
    }

    header nav .menu>ul>li>a {
        padding: 10px 20px !important;
        position: relative;
        width: 100%;
        color: #fff !important
    }

    header nav .menu>ul>li svg {
        position: absolute;
        top: .45em;
        right: 1.2em;
        border-radius: 2px
    }

    header nav .menu>ul>li svg path {
        fill: #fff
    }

    header nav .nav-mid>.menu>ul>li .sub-menu {
        position: initial;
        width: 100%;
        opacity: 1;
        pointer-events: all;
        max-height: 0;
        overflow: hidden;
        transition: .3s ease-in-out
    }

    header nav .menu>ul>li.activee .sub-menu {
        max-height: 20em
    }

    header nav .menu>ul>li.activee svg {
        transform: rotate(180deg)
    }

    header nav .menu>ul>li .sub-menu li {
        position: initial
    }

    .arw-nav {
        right: 10px;
        top: 14px;
    }

    .nav-right {
        justify-content: flex-end;
        gap: 0 10px
    }

    .bars {
        justify-content: center;
        min-width: 42px;
        height: 42px;
        border-radius: 2px
    }

    .bars iconify-icon {
        font-size: 30px;
        color: #fff
    }

    .close {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        width: 40px;
        height: 40px;
        top: 0;
        left: 0;
        background: #bb2b2b;
        cursor: pointer
    }

    .close iconify-icon {
        font-size: 25px;
        color: #fff
    }

    .banner_text h1 {
        margin-bottom: 10px
    }

    .banner_text {
        padding: 100px 0
    }

    .inner_banner {
        margin-bottom: 70px
    }
	.arw-nav {
		display: none;
	}
	header nav .nav-mid>.menu>ul>li svg {
		display: block;
	}
}

@media(max-width:767px) {
	#menu-header-menu.menu::before {
		display: none;
	}
    .banner_text,
    .hero h1,
    .hero-btn {
        text-align: center
    }

    .page-load-modal-box {
        max-width: 688px
    }

    .page-load-modal-text .top-heading h2 {
        font-size: 20px
    }

    .page-load-modal-text .top-heading h3 {
        font-size: 17px;
        line-height: 27px;
        max-width: 450px
    }

    header .top-header .container-flex {
        gap: 0 15px
    }

    header .top-header .top-header-el a {
        gap: 0 10px;
        font-size: 12px
    }

    header .top-header .top-header-el a svg {
        width: 14px
    }

    .fixed-icon {
        display: none
    }

/*     .hero {
        padding: 70px 0 40px
    } */
	 .hero-inner {
        padding: 70px 0 70px;
    }

    .swiper-pagination {
        top: 90% !important;
    }
    .hero h1 {
        font-size: 30px;
        margin-bottom: 30px
    }

    .banner_text {
        padding: 80px 0
    }

    .banner_text ol {
        justify-content: center
    }

    .inner_banner {
        margin-bottom: 40px
    }
}

@media(max-width:680px) {
    .page-load-modal-box {
        background: url(images/modal-bg-mobile.webp) center no-repeat #fff !important;
        padding: 50px 30px
    }

    .page-load-modal-close {
        position: absolute;
        right: 10px;
        top: 10px
    }
}

@media(max-width:575px) {
    header .btnn {
        display: none
    }

    .banner_text ol li {
        font-size: 17px;
        line-height: 25px
    }

    .banner_text ol li::after {
        height: 18px
    }

    .banner_text {
        padding: 65px 0
    }

    .bars {
        min-width: 35px;
        height: 35px
    }
}