:root {
    /*font Variable*/
    --ff-inter: 'Inter';
    --ff-Pontano: 'Pontano Sans';
    --ff-Poppins: 'Poppins';
    /*Color Variable*/
    --color-primary: #000000;
    --color-accent: #D32E55;
    --color-white: #ffffff;
}


/*Common CSS*/
html { font-size: 62.5%;}
* { outline: none; box-sizing: border-box;}
*::-moz-selection { background: #3079ed; color: #fff; text-shadow: none;}
body { margin: 0; padding: 0; width: 100%; font-size: 14px; font-weight: 400; font-family: var(--ff-Poppins);}
label { display: block; font-family: var(--ff-Poppins); font-weight: 400;}
select { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none;}
select::-ms-expand { display: none;}
select option { color: #282828;}
option { font-family: var(--ff-Poppins); font-weight: 400;}
h1, h2, h3, h4, h5, h6, p { margin: 0; padding: 0; font-family: var(--ff-Poppins); line-height: normal;}
ul, li { list-style: none; margin: 0; padding: 0; font-family: var(--ff-Poppins);}
img { vertical-align: middle; border: none}
a, input, select, textarea, .btn { transition: all 0.35s ease-in 0s; outline: none; font-family: var(--ff-Poppins); text-decoration: none;}
a { color: #666; cursor: pointer;}
a:hover { outline: none; cursor: pointer; color: #212121; text-decoration: none;}
a:focus { outline: none; text-decoration: none}
video { width: 100%;}
button { transition: all 0.25s ease-in 0s; border: none; padding: 0;background-color: transparent;}
textarea:focus, input:focus { outline: none; transition-duration: 0.1s; box-shadow: none;}
.form-control::-moz-placeholder { opacity: 1; color: #120E3450;}
.form-control::-webkit-input-placeholder { opacity: 1; color: #120E3450;}
.form-control, .form-control:focus { box-shadow: none;}

.container { width: 100%; max-width: 1290px; padding: 0 15px; position: relative; margin: auto;}
.img_block>img { width: 100%; }
picture>img { width: 100%;}
.swiper{ overflow: hidden;}

/* Header */
header{ background-color: var(--color-white); box-shadow: 0 2px 2px rgba(0,0,0,.12); width: 100%;}
header .inner_header{ display: flex; justify-content: space-between; align-items: center; padding: 17px 0;}
header .logo{ display: inline-block;}
header .right_header{ display: flex; align-items: center; column-gap: 12px;}
.navigation ul{ display: flex; column-gap: 20px; align-items: baseline;}
.navigation ul > li > a{ font-size: 16px; font-family: var(--ff-Poppins); color: var(--color-primary); display: inline-block; line-height: 44px;}
.navigation ul > li > a:hover{ color: #D32E55;}
.navigation ul > li.nav_btn{ background-color: #D32E55; color: var(--color-white); border-radius: 8px; padding: 0; border: 1px solid #D32E55; transition: all 0.35s ease-in 0s;}
.navigation ul > li.nav_btn a{ transform: scale(1); color: var(--color-white); padding: 0 30px;}
.navigation ul > li.nav_btn:hover{ border-color: var(--color-primary); background-color: var(--color-white); }
.navigation ul > li.nav_btn:hover a{ transform: scale(1.12); color: #D32E55;}
header .right_header .email{ border-left: 1px solid #000; padding-left: 12px;}
header .right_header .email a{ font-size: 16px; font-family: var(--ff-Poppins); color: var(--color-primary);}
header  .nav_btn_mobile{ display: none;}
.close_nav{ display: none;}

.categries_section{ padding: 20px 0 30px;}
.categries_section ul{ display: grid; grid-template-columns: repeat(6, 1fr);}
.categries_section ul li{ text-align: center;}
.categries_section ul li a{ width: 100%; display: flex; flex-wrap: wrap; justify-content: center;}
.categries_section ul li a .pic{ background-color: #FDF4F6; width: 60px; height: 60px; border-radius: 12px; display: flex; align-items: center; justify-content: center;}
.categries_section ul li a .pic img{ width: 44px;}
.categries_section ul li a p{ width: 100%; font-size: 14px; font-family: var(--ff-inter); color: var(--color-primary); padding-top: 15px;}
.banner_section{ padding-bottom: 30px;}
.banner_swiper .img_block img{ border-radius: 20px;}
.swiper-pagination-bullet{ width: 10px; height: 10px; opacity: .4;}
.swiper-pagination-bullet-active{ background: #000; opacity: 1;}
.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{ bottom: 15px;}

.heading{ text-align: center; padding-bottom: 20px;}
.heading h2{ font-size: 28px; font-weight: 500; font-family: var(--ff-Poppins); color: var(--color-primary); text-transform: uppercase;}

.partner_section{ padding-bottom: 40px;}
.partner_swiper .swiper-wrapper { transition-timing-function: linear !important; position: relative;}
.partner_swiper .img_block{ width: 100%; padding: 15px 40px; border: 1px solid #dddddd90; border-radius: 5px;}

.support_section{ background-color: #FDF4F6; padding: 20px 0;}
.support_section ul{ display: grid; grid-template-columns: repeat(4, 1fr);}
.support_section ul li{ display: flex; column-gap: 10px; border-left: 1px solid #77777770; padding: 10px 0 10px 15px;}
.support_section ul li:first-child{ padding-left: 0; border-left: none;}
.support_section ul li img{width: 32px;}
.support_section ul li p{ line-height: 32px;font-size: 20px; color: var(--color-primary);}

.categories_section{ padding: 40px 0;}
.category_wrapper{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px 20px; padding-bottom: 30px;}
.category_block{ text-align: center;}
.category_block .img_block{ border-radius: 10px; overflow: hidden;}
.category_block .img_block > img{ transition: all .5s;}
.category_block .img_block > img{ transition: all .5s;}
.category_block:hover .img_block > img{ transform: scale(1.05);}
.category_block h3{ font-size: 16px; color: var(--color-primary); padding-top: 10px;}

.festive_offer{ overflow: hidden; border-radius: 10px; display: inline-block; width: 100%;}
.festive_offer > img{ width: 100%;}

.our_differentiators{ padding-bottom: 40px;}
.our_differentiators ul{ display: grid; grid-template-columns: repeat(6, 1fr); column-gap: 10px;}
.our_differentiators ul li{ text-align: center;}
.our_differentiators ul li .icon{ padding-bottom: 20px;}
.our_differentiators ul li .icon img{width: 130px;}
.our_differentiators ul li h3{ font-size: 16px; color: var(--color-primary); font-weight: 400;}

.moments_section{ padding-bottom: 40px;} 
.moment_block a{ display: inline-block; width: 100%; text-align: center;}
.moment_block a .img_block{ border-radius: 100%; overflow: hidden; border: 1px solid #DDDDDD; margin-bottom: 20px;}
.moment_block a .img_block img{ transition: all .5s;}
.moment_block a:hover .img_block img{ transform: scale(1.03);}
.moment_block a h3{ font-size: 16px; color: var(--color-primary); font-weight: 400;}

.decor_section{ padding-bottom: 40px;} 
.decor_swiper a{ display: inline-block; width: 100%; text-align: center;}
.decor_swiper a .img_block{ border-radius: 10px; overflow: hidden; border: 1px solid #DDDDDD; margin-bottom: 15px;}
.decor_swiper a img{ transition: all .5s;}
.decor_swiper a:hover img{ transform: scale(1.03);}
.decor_swiper a h3{ font-size: 16px; color: var(--color-primary); font-weight: 400;}

.hiw_section{ padding-bottom: 40px;}
.hiw_block{ background-color: #D32E5520; border-radius: 5px; justify-content: center; align-items: center; display: flex; flex-wrap: wrap; min-height: 290px; padding: 10px; align-content: center;}
.hiw_block span{ display: flex; width: 70px; height: 70px; border-radius: 6px; color: var(--color-white); background-color: #9C81EA; font-size: 42px; align-items: center; justify-content: center;}
.hiw_block.two span{ background-color: #4CDFFC;}
.hiw_block.three span{ background-color: #F0B8EB}
.hiw_block.four span{ background-color: #F3E282;}
.hiw_block h3{ width: 100%; text-align: center;  font-size: 24px; font-weight: 500; padding-top: 35px;}

.opw_section{ background-color: #EEEEEE90; padding: 30px 0; margin-bottom: 20px;}
.opw_section .container{ max-width: 780px;}
.opw_section .heading p{ font-size: 16px; font-weight: 300;}
.opw_section ul{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 12px;}
.opw_section ul li a.img_block{ display: inline-block; width: 100%; border: 1px solid #DDDDDD;}
.opw_section ul li a.img_block img{ border-radius: 5px;}

.testimonials_section{ background-color: #EEEEEE90; padding: 50px 0; margin-bottom: 20px;}
.testimonials_section .container{ max-width: 1370px;}
.testimonial_block{ padding: 20px 10px; border-radius: 7px; border: 1px solid #ddd; height: 100%;} 
.testimonial_block .pic{ padding-bottom: 5px;}
.testimonial_block .pic > img{ width: 60px; height: 60px; border-radius: 100%;}
.testimonial_block h3{ font-size: 16px; font-weight: 500; font-size: 16px; color: var(--color-primary); padding-bottom: 10px;}
.testimonial_block .rating{ display: flex; justify-content: center; column-gap: 5px; padding-bottom: 10px;}
.testimonial_block .rating li{ color: #f29d38; font-size: 14px;}
.testimonial_block p{ font-size: 12px; color: var(--color-primary); font-weight: 400;}
.testimonial_swiper .swiper-slide{ height: auto;}
.testimonial_swiper{ margin: 0 50px;}
.swiper-button-next, .swiper-button-prev{ background-color: transparent; background-size: 40px 40px;}
.swiper-button-prev{ left: 0; background-image: url(../images/chevron-left.png); }
.swiper-button-next{ right: 0; background-image: url(../images/chevron-right.png);}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{ opacity: .7;}

.git_section{ padding-bottom: 20px;}
.git_section .container{ max-width: 1370px;}
.git_section .inner{ border: 1px solid #ddd; padding: 25px;}
.form_block{ display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 25px;}
.form_block label{ font-size: 17px; color: #333;}
.form_block .form-control{ border-radius: 5px; background-color: #ECF0F2; border: 1px solid #ddd; height: 50px; padding: 0 20px;}

.form_block .full-group { grid-column: 1 / -1; text-align: center; padding-top: 10px;}
.form_block .btn{ background-color: #D32E55; color: var(--color-white); border-radius: 5px; padding: 0; border: 1px solid #D32E55; transition: all 0.35s ease-in 0s; font-size: 20px; width: 50%; text-transform: uppercase;}
.form_block .btn span{ font-weight: normal; transition: all .35s; display: inline-block; line-height: 50px;}
.form_block .btn:hover span{ transform: scale(1.12);}
.form_block .btn:hover{ border-color: var(--color-primary); background-color: var(--color-white); color: var(--color-accent);}

.counter{width: 100%; max-width: 900px; margin: 40px auto 0;}
.counter ul{ display: grid; grid-template-columns: repeat(3, 1fr);}
.counter ul li{ text-align: center; border-left: 1px solid var(--color-primary); font-size: 20px; font-weight: 600;}
.counter ul li:first-child{ border-left: none;}

footer{ background-color: #FDF5F7; padding: 40px 0;}
.top_footer{ display: flex; flex-wrap: wrap;}
.top_footer .col{ width: 33.33%;}
.top_footer .col01{ display: flex; flex-wrap: wrap; column-gap: 15px;}
.top_footer .inner_col{ width: 48%;}
.top_footer h3{ font-size: 18px; font-family: var(--ff-Pontano); color: var(--color-primary); font-weight: 500; padding-bottom: 10px;}
.footer_list li{ padding-bottom: 5px;}
.footer_list li a{ font-size: 14px; color: var(--color-primary);}
.footer_list li a:hover{ color: var(--color-accent);}

.top_footer .col02{ padding: 50px 80px 0 40px;}
.top_footer .form-control{ border-radius: 5px; background-color: #DDDDDD; border: 1px solid #ddd; height: 50px; padding: 0 20px;}
.gplay_download{ padding-bottom: 20px;}
.gplay_download .gplay{ display: inline-block;}

.connect_with_us ul{ display: flex; column-gap: 10px;}
.connect_with_us ul li a{ display: inline-block;}
.connect_with_us ul li a img{ transition: all .35s;}
.connect_with_us ul li a:hover img{ transform: translateY(-5px);}

.bottom_footer{ padding-top: 30px;}
.bottom_footer ul{ display: flex; justify-content: center; column-gap: 7px;}
.bottom_footer ul li a{ color: var(--color-primary); font-size: 14px; font-family: var(--ff-Pontano); border-bottom: 1px solid transparent;}
.bottom_footer ul li a:hover{ border-bottom-color: var(--color-primary);}

.git_btn{ position: fixed; z-index: 98; bottom: 30px; right: 30px;}

.toggle{ display: none; width: 18px; height: 30px;}
.hamburger{ margin: 0; padding: 0; transform: rotate(0deg); transition: .5s ease-in-out; cursor: pointer; position: relative; border-radius: 8px;}
.hamburger > span{ position: absolute; left: 0; top: 50%; width: 18px; height: 20px; transform: translateY(-50%);}
.hamburger > span >  span{ display: block; position: absolute; height: 3px; width: 100%; background-color: var(--color-primary); border-radius: 0; opacity: 1;  left: 0;  transform: rotate(0deg); transition: .25s ease-in-out;}
.hamburger > span > span:nth-child(1) { top: 1px;}
.hamburger > span > span:nth-child(2) { top: 9px; left: 0;}
.hamburger > span > span:nth-child(3) { top: 17px;}
.hamburger.open > span > span{ height: 3px;}
.hamburger.open > span > span:nth-child(1) { top: 10px; transform: rotate(135deg);}
.hamburger.open > span > span:nth-child(2) {opacity: 0; left: -22px;}
.hamburger.open > span > span:nth-child(3) { top: 10px; transform: rotate(-135deg);}

.enquire_modal .modal-dialog{ width: 94%; max-width: 470px; margin: 0; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) !important;}
.enquire_modal .close{ opacity: 1; position: absolute; right: 10px; top: 10px; z-index: 2;}
.enquire_modal .modal-body{ padding: 50px 20px 20px;}
.custom_scroll { max-height: 80vh; overflow-y: auto; }
.image_list { column-count: 4; column-gap: 15px; } 
.image_list > li { break-inside: avoid; margin-bottom: 15px; } 
.image_list > li img { width: 100%; height: auto; display: block; border-radius: 10px; } 
.enquire_modal .form_block{ grid-template-columns: repeat(1, 1fr);}
.enquire_modal .form_block .btn{ width: 100%;}
.enquire_modal .counter{ margin-top: 20px;}
.enquire_modal .counter ul li{ font-size: 14px;}
.enquire_modal .form_block .form-control{ height: 44px;}
.enquire_modal .form_block .btn{ font-size: 16px;}
.enquire_modal .form_block .btn span{ line-height: 44px;}




@media only screen and (max-width:1440px){
    .container{ max-width: 1200px;}
    .navigation ul > li > a{ font-size: 14px; line-height: 38px;}
    .navigation ul > li.nav_btn a{ padding: 0 20px;}
    .support_section ul li p{ font-size: 16px;}
    .our_differentiators ul li .icon img{ width: 100px;}
    .testimonials_section .container, .git_section .container{ max-width: 1280px;}
    header .right_header .email a{ font-size: 14px;}
    header .inner_header{ padding: 12px 0;}
}

@media only screen and (max-width:1279px){
    .categries_section ul li a p{ font-size: 12px;}
    .heading h2{ font-size: 24px;}
    .support_section ul li p{ font-size: 14px;}
    .our_differentiators ul li .icon img{ width: 70px;}
    .our_differentiators ul li h3{ font-size: 12px;}
    .moment_block a h3, .decor_swiper a h3{ font-size: 14px;}
    .hiw_block{ min-height: 220px;}
    .hiw_block h3{ font-size: 16px; padding-top: 20px;}
    .hiw_block span{ width: 54px; height: 54px; font-size: 30px;}
    .opw_section .heading p{ font-size: 12px;}
    .top_footer .inner_col{ width: 47%;}
    .footer_list li a, .bottom_footer ul li a{ font-size: 12px;}
    .git_btn img{ width: 80px;}
    .top_footer h3{ font-size: 18px;}
    
}

@media only screen and (max-width:1023px){
    .toggle{ display: inline-block;}
    .left_header{ display: flex; align-items: center; column-gap: 15px;}
    header .right_header .email, .navigation ul > li.nav_btn.sm{ display: none;}
    header .nav_btn_mobile{ display: inline-block;}
    header .nav_btn_mobile a{ font-size: 14px; font-family: var(--ff-Poppins); color: var(--color-white); background-color: var(--color-accent); display: inline-block; line-height: 38px; border-radius: 8px; padding: 0 20px;}

    .navigation{ position: fixed; top: 0; left: 0; background-color: var(--color-white); z-index: 100; width: 100%; height: 100%; padding: 60px 0 20px; transition: all .5s; transform: translateX(-100%);}
    .navigation.open{ transform: translateX(0);}
    .navigation ul{ flex-wrap: wrap; align-content: baseline;}
    .navigation ul > li{ width: 100%; border-bottom: 1px solid #ddd;}
     .navigation ul > li > a{ line-height: normal; padding: 10px 20px; width: 100%;}
    .close_nav{ display: block; position: absolute; right: 20px; top: 20px;} 
    .navigation ul > li.nav_btn{ background-color: transparent; border: none; border-bottom: 1px solid #ddd; border-radius: 0;}
    .navigation ul > li.nav_btn:hover{ border-bottom-color: #ddd;}
    .navigation ul > li.nav_btn a{ color: var(--color-primary); padding: 10px 20px;}
    .navigation ul > li.nav_btn:hover a{ transform: none;}
    .banner_swiper .img_block{ border-radius: 12px; border: 1px solid #ddd;}
    .banner_swiper .img_block img{ border-radius: 12px;}
    .partner_swiper .img_block{ padding: 10px 15px;}
    .support_section ul{ grid-template-columns: repeat(2, 1fr); gap: 15px 30px;}
    .support_section ul li{ border-left: none; padding: 0;}
    .category_wrapper{ gap: 30px 10px;}
    .testimonial_swiper{ margin: 0 30px;}
    .form_block .btn{ font-size: 16px;}
    .form_block .btn span{ line-height: 40px;}

    .top_footer .col{ width: 100%;}
    .top_footer .col02{ padding: 20px 0;}
    .top_footer .col03{ text-align: center;}
    .gplay_download{ text-align: center; width: 100%; padding-bottom: 30px;}
    .connect_with_us ul{ justify-content: center;}
}

@media only screen and (max-width:767px){
    .partner_section, .decor_section, .hiw_section{ padding-bottom: 20px;}
    .categories_section{ padding: 20px 0;}
    header .logo img{ width: 70px;}
    header .nav_btn_mobile a{ font-size: 12px; line-height: 36px; padding: 0 15px;}
    .categries_section ul{ grid-template-columns: repeat(3, 1fr); gap: 20px 15px;}
    .partner_swiper .img_block{ padding: 10px 5px;}
    .heading h2{ font-size: 20px;}
    .support_section ul{ gap: 15px 10px;}
    .support_section ul li img{ width: 20px; height: 20px;}
    .support_section ul li{ align-items: center; column-gap: 5px;}
    .support_section ul li p{ line-height: normal; font-size: 12px;}
    .category_wrapper{ grid-template-columns: repeat(2, 1fr);}
    .category_block h3{ font-size: 14px;}
    .our_differentiators ul{ grid-template-columns: repeat(3, 1fr); gap: 20px 10px;}
    .our_differentiators ul li .icon{ padding-bottom: 10px;}
    .hiw_block{ min-height: 180px; background-color: #C2E5FF50;}
    .hiw_block h3{ font-size: 14px; padding-top: 10px;}
    .opw_section ul{ gap: 7px;}
    .testimonial_swiper{ margin: 0 20px;}
    .swiper-button-next, .swiper-button-prev{ background-size: 20px 20px;}
    .testimonials_section{ padding: 20px 0;}
    .git_section .inner{ padding: 15px;}
    .form_block{ grid-template-columns: repeat(1, 1fr);}
    .form_block label{ font-size: 14px;}
    .form_block .form-control{ padding: 0 15px; height: 44px;}
    .form_block .btn{ width: 100%;}
    .counter ul li{ font-size: 14px;}
    .counter{ margin-top: 20px;}
    footer{ padding: 20px 0;}
    .top_footer h3{ font-size: 16px;}
    .git_btn{ right: 10px; bottom: 40px;}
    .git_btn img{ width: 60px;}
    .bottom_footer ul li a{ font-size: 9px;}
    .bottom_footer{ padding-top: 20px;}
} 

@media only screen and (max-width:479px){
    .counter ul li{ font-size: 11px;}
    .enquire_modal .counter ul li{ font-size: 11px;}

}
