@import url(../fonts/stylesheet.css);
.container {width: 100%;max-width: 1280px;margin: auto;padding: 0;}

:root {
    --light: 'NotoLight';
    --regular : 'NotoRegular';
    --medium : 'NotoMedium';
    --semi : 'NotoSemiBold';
    --bold : 'NotoBold';
    --extrabold : 'NotoExtraBold';
    --green: #113820;
    --black: #050401;
    --white: #ffffff;
    --yellow: #FAC900;
}

/*Header*/
header {position: fixed;top: 0;left: 0;width: 100%;z-index: 10;}
header nav {padding: 15.5px 0 !important;background: var(--green);box-shadow: 0 0 5px 10px rgba(0, 0, 0, 0.50);backdrop-filter: blur(10px);}
header nav .navbar-nav li.nav-item, header nav .navbar-nav li.nav-item .nav-link {font: 16px/21px var(--bold);color: var(--white);padding: 0;}
header nav .navbar-nav li.nav-item:hover, header nav .navbar-nav li.nav-item .nav-link:hover {color: var(--yellow);}
header nav .navbar-nav li.nav-item {margin-right: 36px;}
header nav .navbar-nav {margin: 0;}
header nav a.btn.order-btn {display: flex;align-items: center;justify-content: center;gap: 10px;background: var(--yellow);font: 18px/21px var(--semi);color: var(--green);width: 160px;height: 48px;border: 1px solid var(--green);transition: 0.5s all ease-in-out;}
header nav a.btn.order-btn:hover {background: var(--white);}
.navbar-expand-lg .navbar-collapse {width: 100%;justify-content: space-between !important;}
a.navbar-brand {position: absolute;left: 50%;top: 0;transform: translateX(-50%);background: #FAC900;width: 225px;height: 123px;display: flex;align-items: flex-start;justify-content: center;border-radius: 0 0 100px 100px;margin: 0;}
a.navbar-brand img {width: 85%;object-fit: contain;margin-top: 15px;}
/*Header*/

/*Main*/
.hero_carosel .item {position: relative;}
.hero_carosel .item .hero-img {position: relative;}
.hero_carosel .item .hero-img img {width: 100%;object-fit: cover;max-height: 750px;min-height: 750px;}
.hero_carosel .item .hero-img::before {content: "";width: 100%;height: 100%;background: rgba(0, 0, 0, 0.68);position: absolute;left: 0;top: 0;}
.hero_carosel .desc {position: absolute;width: 100%;top: 50%;left: 0;transform: translateY(-50%);text-align: left;}
.hero_carosel .desc h2 {font: 60px/80px var(--extrabold);color: var(--white);}
.hero_carosel .desc p {font: 16px/24px var(--regular);color: var(--white);max-width: 869px;margin: 0 0 32px;}
.hero_carosel .desc a {background: var(--yellow);font: 18px/21px var(--semi);color: var(--green);width: 205px;height: 48px;border: 1px solid var(--yellow);transition: 0.5s all ease-in-out;text-decoration: none;display: flex;align-items: center;justify-content: center;border-radius: 8px;}
.hero_carosel .desc a:hover {background: var(--white);color: var(--yellow);}
 @keyframes fadeInUp{0%{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:translateZ(0)}}
.fadeInUp{animation-name:fadeInUp}
 .delay-1 {animation-delay: .2s;}
 .delay-2 {animation-delay: .4s;}
 .delay-3 {animation-delay: .6s;}
section.offer-sec {padding: 100px 0;}
section.features {padding: 0 !important;}
section.features .d-flex {gap: 15px;}
section.features .d-flex .box {padding: 15px;background: #FFF5F7;border-radius: 16px;box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.25);width: 25%;display: flex;flex-direction: column;align-items: center;justify-content: center;}   
section.features .d-flex .box .icon {min-height: 75px;display: flex;align-items: center;}
section.features .d-flex .box .txt h5 {font: 17px/26px var(--bold);color: #000;margin: 15px 0 0;text-align: center;}
section.features {position: relative;z-index: 1;margin-top: -86px;}
section.features .d-flex .box .txt p {margin: 0;font: 14px/21px var(--regular);color: var(--white);}
section.contact-cta {background: url(../images/inner-banner.png) no-repeat top center;background-size: cover;padding: 75px 0;position: relative;}
section.contact-cta h4 {font: 36px/45px var(--bold);color: var(--white);margin: 0 0 15px;}
section.contact-cta h5 {font: 30px/30px var(--regular);color: var(--white);}
section.contact-cta p {font: 16px/24px var(--regular);color: var(--white);max-width: 560px;margin: 0 auto 32px;}
section.contact-cta a {background: var(--yellow);border: 1px solid var(--yellow);border-radius: 8px;height: 48px;font: 18px/21px var(--semi);color: var(--green);display: flex;align-items: center;justify-content: center;gap: 10px;width: max-content;margin: auto;}
section.contact-cta a:hover {background: var(--white);color: var(--green);}
section.offer-sec .hd {text-align: left;margin-bottom: 50px;}
section.offer-sec .hd h2 {font: 30px/30px var(--bold);color: var(--black);margin:0;}
section.offer-sec .d-flex {gap: 30px;flex-wrap: wrap;}
section.offer-sec .d-flex .service-card {width: 31.77%;position: relative;border-radius: 16px;overflow: hidden;}
.service-card .txt {width: 100%;height: 100%;position: absolute;left: 0;top: 0;display: flex;flex-direction: column;align-items: flex-start;justify-content: flex-end;padding: 15px;}
section.offer-sec .d-flex .service-card img {width: 100%;object-fit:cover;border-radius: 8px;}
section.offer-sec .d-flex .service-card:first-child .txt {background: linear-gradient(to top, var(--green), rgba(0,0,0,0.1) 60%);}
section.offer-sec .d-flex .service-card:nth-child(2) .txt {background: linear-gradient(to top, #4712AE, rgba(0,0,0,0.1) 60%);}
section.offer-sec .d-flex .service-card:nth-child(3) .txt {background: linear-gradient(to top, #03276B, rgba(0,0,0,0.1) 60%);}
section.offer-sec .d-flex .service-card:nth-child(4) .txt {background: linear-gradient(to top, #785359, rgba(0,0,0,0.1) 60%);}
section.offer-sec .d-flex .service-card:nth-child(5) .txt {background: linear-gradient(to top, #373C43, rgba(0,0,0,0.1) 60%);}
section.offer-sec .d-flex .service-card:last-child .txt {background: linear-gradient(to top, #A6072E, rgba(0,0,0,0.1) 60%);}
section.offer-sec .d-flex .service-card h5 {font: 20px/24px var(--medium);color: var(--white);margin: 12px 0 !important;}
section.offer-sec .d-flex .service-card p {font: 16px/25px var(--regular);color: var(--white);width: 100%;margin-bottom: -85px;transition: 0.5s all ease-in-out;opacity: 0;visibility: hidden;}
section.offer-sec .d-flex .service-card:hover p {margin-bottom: 0;opacity: 1;visibility: visible;}
section.abt {padding: 100px 0;}
section.abt .txt {width: 68%;padding-left: 50px;}
section.abt .img {width: 32%;position: relative;}
section.abt .txt h3 {font: 30px/30px var(--bold);color: var(--black);margin: 15px 0 30px;}
section.abt .txt p {font: 20px/35px var(--regular);color: var(--black);margin: 0;}
section.abt .txt span {font: 30px/30px var(--light);color: #333333;}
section.contact-cta .row {margin: 0;}
section.products {padding-bottom: 40px;}
section.products a {background: var(--yellow);border: 1px solid var(--yellow);border-radius: 8px;height: 48px;font: 18px/21px var(--semi);color: var(--green);display: flex;align-items: center;justify-content: center;gap: 10px;width: max-content;margin: auto;}
section.products a:hover {background: var(--white);color: var(--green);border: 1px solid var(--yellow);border-radius: 8px;}
section.products .hd {text-align: center;margin-bottom: 50px;}
section.products .hd h2 {font: 30px/30px var(--bold);color: var(--black);margin:0;}
section.products .row .scard h5 {
    font: 20px / 24px var(--medium);
    color: var(--green);
    margin: 12px 0 !important;
}
.active>.page-link, .page-link.active {
    z-index: 3;
    color: #fff;
    background-color: var(--green);
    border-color: var(--green);
}
.ft-top .d-flex .ft-blk a:hover{color: var(--yellow);}
/*Main*/

/*Footer*/
footer {background: #113820;}
.ft-bt {border-top: 1px solid #3c3c3c;padding: 30px 0;}
.ft-bt ul {padding: 0;margin: 0;list-style: none;display: flex;align-items: center;justify-content: space-between;}
.ft-bt ul li {font: 16px/40px var(--regular);color: var(--white);}
.ft-top {padding: 50px 0 30px;}
.ft-top .d-flex {gap: 30px;}
.ft-top .d-flex .ft-blk:first-child {width: 30%;display: flex;align-items: flex-start;justify-content: space-between;flex-direction: column;}
.ft-top .d-flex .ft-blk:nth-child(2), .ft-top .d-flex .ft-blk:last-child {width: 17%;}
.ft-top .d-flex .ft-blk:nth-child(3) {width: 18%;}
.ft-top .d-flex .ft-blk h4 {font: 20px/30px var(--bold);color: var(--white);margin-bottom: 15px;}
.ft-top .d-flex .ft-blk p {font: 14px/25px var(--regular);color: var(--white);margin-bottom: 0;padding-left: 15px;}
.ft-top .d-flex .ft-blk ul {margin: 0;padding: 0;list-style: none;}
.ft-top .d-flex .ft-blk ul li a {font: 16px/24px var(--regular);color: var(--white);text-decoration: none;}
.ft-top .d-flex .ft-blk ul li:not(:last-child) {margin-bottom: 20px;}
.ft-top .d-flex .ft-blk ul li a:hover {color: var(--yellow);}
.ft-top .d-flex .ft-blk h5 {font: 16px/40px var(--regular);color: var(--white);}
.ft-top .d-flex .ft-blk:last-child ul {display: flex;align-items: center;justify-content: space-between;}
.ft-top .d-flex .ft-blk:last-child ul li {margin: 0 !important;}
.ft-top .d-flex .ft-blk:last-child ul li a svg {font-size: 25px;color: var(--yellow);transition: 0.5s all ease-in-out;}
.ft-top .d-flex .ft-blk:last-child ul li a {width: 35px;height: 35px;display: flex;align-items: center;justify-content: center;transition: 0.5s all ease-in-out;border: 1px dashed transparent;border-radius: 100%;padding: 10px;}
.ft-top .d-flex .ft-blk:last-child ul li a:hover {border-color: var(--yellow);}
.ft-top .d-flex .ft-blk:last-child ul li a:hover svg {transform: rotateX(360deg);}
.ft-bt ul li a {color: var(--white);text-decoration: none;}
.ft-bt ul li a:hover {color: var(--yellow);}
/*Footer*/

/*Contact form*/
 .contact-info {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 15px;
    transition: transform 0.3s ease;
}

.contact-item:hover {
    transform: translateX(10px);
}

.contact-icon {
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.form-section {
    padding: 60px 40px;
}

.form-section h3 {
    font-size: 2rem;
    color: #333;
    margin-bottom: 10px;
}

.form-section .subtitle {
    color: #666;
    margin-bottom: 30px;
    font-size: 1rem;
}

.form-group {
    margin-bottom: 25px;
}

label {
    display: block;
    margin-bottom: 8px;
    color: #333;
    font-weight: 600;
    font-size: 0.95rem;
}

input, textarea {
    width: 100%;
    padding: 15px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    font-size: 1rem;
    transition: all 0.3s ease;
    font-family: inherit;
}

input:focus, textarea:focus {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

textarea {
    resize: vertical;
    min-height: 120px;
}

.submit-btn {
    width: 150px;
    padding: 16px;
    /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
    background: #FAC900;
    color: black;
    border: none;
    border-radius: 10px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}

.submit-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}

.submit-btn:active {
    transform: translateY(0);
}

.captcha-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 20px;
}

.captcha-wrapper .g-recaptcha {
    transform: scale(0.95);
    transform-origin: 0 0;
}

/*Contact form*/

/*Responsive*/ 

@media (max-width: 1280px) {
    .container {padding: 0 15px;}
    section.offer-sec .d-flex .service-card {width: 31.6%;}
}

@media (max-width: 1200px) {
    .hero_carosel .desc {padding-top: 55px;}
    section.offer-sec .d-flex {gap: 25px;}
    .hero_carosel .desc h2 {font-size: 50px;line-height: 70px;}
    section.contact-cta h4 {font-size: 30px;}
}

@media (max-width: 1024px) {
    header nav {padding: 10px 0 !important;}
    .hero_carosel .desc h2 {font-size: 50px;line-height: 70px;}
    .ft-top .d-flex .ft-blk:nth-child(3) {width: 21%;}
}

@media (max-width: 991px) {
    button.navbar-toggler {background: var(--white);width: 40px;height: 40px;padding: 0;}
    .ft-top .d-flex .ft-blk:first-child {width: 26%;}
    .ft-top .d-flex .ft-blk:first-child img {width: auto;object-fit: contain;}
    .ft-top .d-flex {gap: 15px;}
    .ft-top .d-flex .ft-blk:nth-child(2), .ft-top .d-flex .ft-blk:last-child {width: 22%;}
    .ft-top .d-flex .ft-blk:nth-child(3) {width: 26%;}
    .img-overlay {padding: 30px 10px;}
    section.offer-sec .d-flex .service-card {width: 31%;}
    section.contact-cta h4 {font-size: 20px;line-height: 24px;}
    section.contact-cta h5 {font-size: 18px;}
    a.navbar-brand img {width: 185px;}
    .hero_carosel .desc h2 {font-size: 40px;line-height: 60px;}
    .hero_carosel .item .hero-img img {min-height: 550px;}
    section.features, section.offer-sec {padding: 80px 0;}
    .navbar-collapse {position: fixed;top: 0;padding: 30px;width: 300px !important;height: 100vh;background: #fff;display: block !important;left: -300px;transition: 0.5s all ease-in-out;}
    .navbar-collapse.show {left: 0;}
    header nav .navbar-nav li.nav-item, header nav .navbar-nav li.nav-item .nav-link {color: var(--black);}
    header nav .navbar-nav {margin: 0 !important;}
    header nav .navbar-nav li.nav-item {margin: 0 0 25px 0;}
    nav.navbar > div {justify-content: flex-end !important;}
    .ft-top .d-flex .ft-blk:first-child {flex-direction: column;}
    section.offer-sec .d-flex .service-card {width: 48%;}
    section.abt {padding: 70px 0;}
    section.abt .txt h3 {font-size: 24px;}
    section.abt .txt p {font-size: 16px;line-height: 28px;}
}

@media(max-width: 767px) {
    section.features, section.offer-sec, section.contact-cta {padding: 70px 0;}
    section.features .d-flex {flex-wrap: nowrap;white-space: nowrap;overflow: hidden;overflow-x: auto;padding-bottom: 20px;}
    section.features .d-flex .box .txt p {white-space: normal;}
    section.features .d-flex .box {min-width: 255px;}
    section.contact-cta .row {gap: 40px;}
    section.offer-sec .d-flex .service-card {width: 48%;}
    section.abt .txt {width: 100%;margin-top: 50px;padding: 0;text-align: center;}
    section.abt .img {width: max-content;text-align: center;margin: auto;}
    .img-overlay {left: 0;right: auto;}
    .ft-top .d-flex {flex-direction: column;gap: 0;}
    .ft-top .d-flex .ft-blk:first-child, .ft-top .d-flex .ft-blk:nth-child(2), .ft-top .d-flex .ft-blk:nth-child(3) {width: 100%;padding-bottom: 25px;margin-bottom: 25px;border-bottom: 1px solid #3c3c3c;}
    .ft-top .d-flex .ft-blk:first-child {text-align: center;}
    .ft-top .d-flex .ft-blk:first-child img {max-width: 200px;}
    .ft-top .d-flex .ft-blk:last-child {width: 100%;}
    .ft-top .d-flex .ft-blk:last-child ul {max-width: 300px;}
    section.offer-sec .d-flex {gap: 20px;}
    .hero_carosel .desc h2 {font-size: 36px;line-height: 50px;}
    a.navbar-brand {width: 185px;height: 100px;}
    a.navbar-brand img {width: 135px;}
    section.contact-cta .row > div {flex-direction: column;text-align: center;}
    section.contact-cta h4, section.offer-sec .hd h2 {font-size: 26px;}
    .ft-top .d-flex .ft-blk:first-child {align-items: center;}
}

@media (max-width: 575px) {
    section.abt .img {width: 100%;}
    .img-overlay {padding: 15px 10px;}
    .ft-bt {padding: 25px 0;}
    .ft-bt ul {flex-direction: column;}
    .hero_carosel .desc h2 {font-size: 32px;line-height: 45px;}
    .hero_carosel .item .hero-img img {min-height: 485px;}
    section.offer-sec .d-flex .service-card {width: 100%;}
    section.features, section.offer-sec, section.contact-cta {padding: 50px 0;}
    section.offer-sec .hd h2 {font-size: 26px;}
    section.offer-sec .d-flex {gap: 30px;}
    section.abt {padding-bottom: 50px;}
    .hero_carosel .desc h2 {font-size: 26px;line-height: 36px;}
    .hero_carosel .desc p {margin-bottom: 20px;}
    section.offer-sec .hd h2 {font-size: 24px;text-align: center;line-height: 32px;}
    .hero_carosel .desc {padding-top: 10px;}
    section.offer-sec .d-flex .service-card p {margin-bottom: -50px;}
}

@media (max-width: 480px) {
    header nav {padding: 5px 0 !important;}
    .hero_carosel .desc h2 {font-size: 26px;line-height: 38px;}
    section.abt .txt h3 {font-size: 26px;margin: 10px 0 20px;}
    section.abt .txt {margin-bottom: 30px;}
    section.abt .txt p {font-size: 16px;line-height: 30px;}
    .img-overlay img {width: 175px;}
    section.offer-sec .d-flex .service-card p {margin-bottom: -75px;}
}

/*Responsive*/ 