body {font-family: "Oswald", sans-serif;font-weight: 400;margin: 0;padding: 0;color: #000034;}
.container{max-width: 2000px;width: 90%;}

/* Header section*/
header {background: #fff;}
header .container-fluid {padding: 0;}
header .row {margin: 0;}
/* left Header */
header .hleft{padding: 30px 20px 0px 5%;position: relative;}
header .hleft::after {content: "";position: absolute;top: 100%;left: 0;width: 100%;height: 30px;background-color: #fff;z-index: 9;}
header .hleft::before {content: "";position: absolute;right: 0;top: 0px;width: 1px;height: 70%;box-shadow: 3px 0 8px rgb(0 0 0 / 25%);border-radius: 10px;z-index: 9;}
header .logo img {height: 140px;width: auto;}
/* Right Header */
header .hright{background: #ececec;padding: 25px 5% 10px 20px;position: relative;}
header .contact-box {background: #00144c;color: #fff;padding: 15px 25px 15PX;text-align: center;position: absolute;bottom: 0px;left: -100px;border: 4px solid #fff;}
header .contact-box small {display: block;font-size: 20px;text-transform: uppercase;letter-spacing: 1px;font-weight: 300;}
header .contact-box strong {font-size: 35px;font-weight: 800;line-height: 1;font-family: "Montserrat", sans-serif;}
header .contact-box strong a{color: #fff;text-decoration: none;}
header .right-info {text-align: right;}
header .right-info .address {font-size: 14px;color: #000034;margin-bottom: 5px;text-transform: uppercase;font-weight: 500;}
header .right-info .address span{border-bottom: 1.5px solid #bf1e2e;display: inline-block;padding-bottom: 5px;}
header .right-info .address img {width: 12px;margin-top: 5px;margin-right: 7px;}
header .right-info .hours {font-size: 14px;color: #000034;font-weight: 500;text-transform: uppercase;letter-spacing: .5px;}
header nav {margin-top: 38px;}
header nav ul {list-style: none;display: flex;justify-content: flex-end;gap: 25px;}
header nav ul li {font-weight: 700;}
header nav ul li a {text-decoration: none;color: #c10000;transition: color 0.3s ease;font-family: "Montserrat", sans-serif;font-size: 18px;}
header nav ul li a.active,header nav ul li a:hover {border-bottom: 2px solid #00144c;padding-bottom: 2px;}


/* Hero Section*/
.hero-section {position: relative;background: url("../images/hero-banner.webp") center/cover no-repeat;padding: 150px 0px; display: flex;align-items: center;}
.hero-section small {font-size: 18px;text-transform: uppercase;color: #fff;}
.hero-section h1 {font-size: 70px;line-height: 1.2;font-weight: 400;margin: 10px 0 25px;color: #fff;}
.hero-section .btn-dmore {display: inline-block;background: #bf1e2e;color: #fff;padding: 20px 25px;text-transform: uppercase;text-decoration: none;font-weight: 400;transition: background 0.3s ease;border: none;font-size: 24px;}
.hero-section .btn-dmore:hover {background: #fff;color: #bf1e2e;}
.hero-section .btn-dmore i{margin-left: 5px;}


/* Info Section */
.infobox{position: relative;}
.infobox .container{position: relative;}
.info-banner {padding: 0px; display: flex;width: 100%;text-align: center;border-radius: 8px;overflow: hidden;border: 6px solid #fff;box-shadow: 0 0 10px rgba(0,0,0,0.1);position: absolute;z-index: 9;top: 50%;transform: translateY(-50%);}
.info-box {flex: 1;padding: 40px 30px;color: #fff;}
.info-box.grey {background-color: #bdbdbd;color: #fff;}
.info-box.navy {background-color: #000034;}
.info-box.red {background-color: #bf1e2e;}
.info-box h3 {font-size: 26px;font-weight: 700;margin-bottom: 0px;text-transform: uppercase;}
.info-box p {font-size: 18px;font-weight: 400;margin: 0;}


/* We Make Section */
.we-make-section {position: relative;padding: 0;overflow: hidden;}
.we-make-section .container-fluid {padding: 0;}
.we-make-section .row {margin: 0;}
/* Left Section - Special Offer */
.we-make-section .wemake-left {position: relative;padding: 0;}
.we-make-section .wemake-image {position: relative;height: 100%;}
.we-make-section .wemake-image img{width: 100%;height: 100%;object-fit: cover;}
/* Right Section - Brand Messaging */
.we-make-section .service-right {background-color: #ececec;padding: 130px 5% 40px 50px;display: flex;position: relative;}
.we-make-section .service-right h2 {font-size: 42px;font-weight: 700;color: #000034;margin: 0 0 20px 0;line-height: 1.2;font-family: "Montserrat", sans-serif;}
.we-make-section .services-content h4 {font-weight: 400;font-size: 20px;margin: 0px 0 12px 0;color: #000034;letter-spacing: 0.5px;}
.we-make-section .services-content img{max-width: 300px;margin-bottom: 15px;}
.we-make-section .services-content h5{color:#bf1e2e;margin-bottom: 15px;}
.we-make-section .services-content p {margin: 0 0 0px 0;font-size: 20px;line-height: 1.3;color: #000034;font-weight: 300;}


/* Why Section */
.why-section {position: relative;padding: 0;overflow: hidden;}
.why-section .container-fluid {padding: 0;}
.why-section .row {margin: 0;}
/* Left Section - Special Offer */
.why-section .why-left {display: flex;align-items: center;justify-content: space-between;background: url('../images/why-c.webp') center/cover;background-color: #1a1a2e;position: relative;padding: 30px  30px 30px 5%;}
.why-section .why-content {position: relative;z-index: 2;}
.why-section .why-content h2 {font-size: 42px;font-weight: 700;color: #fff;margin: 0 0 20px 0;font-family: "Montserrat", sans-serif;}
.why-section .why-content .features-list {list-style: none;margin: 0;padding: 0;padding-left: 20px;}
.why-section .why-content .features-list li {position: relative;margin: 18px 0;padding-left: 40px;font-size: 24px;line-height: 1.5;color: #fff;font-weight: 300;}
.why-section .why-content .features-list li:last-child{margin-bottom: 5px;}
.why-section .why-content .features-list li:nth-child(odd) {font-weight: 600;font-size: 22px;}
.why-section .why-content .features-list li img{width: 30px;position: absolute;left: 0;}
/* Right Section - Brand Messaging */
.why-section .service-right {background-color: #bf1e2e;padding: 30px 5% 30px 50px;display: flex;align-items: center;position: relative;text-align: center;justify-content: center;}
.why-section .service-right h2 {font-size: 42px;font-weight: 700;color: #ffffff;margin: 0 0 20px 0;line-height: 1.3;font-family: "Montserrat", sans-serif;text-align: center;text-decoration: underline;text-decoration-color: #fff;text-decoration-thickness: 3px;text-underline-offset: 10px;}
.why-section .services-content h4 {font-weight: 600;font-size: 16px;margin: 7px 0 5px 0;color: #fff;}
.why-section .services-content p {margin: 0 0 0px 0;font-size: 18px;line-height: 1;color: #fff;font-weight: 300;}
.why-section .note-box {background-color: #000034;border-radius: 50px;padding: 10px 25px;margin-top: 20px;display: inline-block;border: 2px solid #fff;}
.why-section .note-box p {font-size: 8;color: #fff;margin: 0;font-style: italic;}


/* Offer Section */
.offer-section {background: #353545;position: relative;padding: 0;overflow: hidden;}
.offer-section .container-fluid {padding: 0;}
.offer-section .row {margin: 0;}
/* Left Section - Special Offer */
.offer-section .offer-left {background: url('../images/special-offer-bg.webp') center/cover;background-color: #1a1a2e;position: relative;padding: 30px  30px 30px 5%;}
.offer-section .offer-content {display: flex;align-items: center;justify-content: space-between;position: relative;z-index: 2;}
.offer-section .offer-text {flex: 1;max-width: 60%;z-index: 3;}
.offer-section .special-offer-label {font-size: 3rem;font-weight: 700;color: #bf1e2e;margin: 0 0 20px 0;-webkit-text-stroke: 0.5px #fff;position: relative;display: inline-block;}
.offer-section .special-offer-label::after {content: "";position: absolute;left: 0;bottom:-7px;width: 100%;height: 5px;background-color: #bf1e2e;border: 0.5px solid #fff;}
.offer-section .offer-heading {font-size: 28px;font-weight: 700;color: #ffffff;margin: 0 0 0px 0;line-height: 1.2;}
.offer-section .offer-price {font-size: 40px;font-weight: 300;color: #ffffff;margin: 0 0 0px 0;line-height: 1.2;}
.offer-section .offer-price span{font-weight: 700;font-size: 40px;}
.offer-section .offer-original {font-size: 35px;color: #ffffff;margin: 0;font-weight: 300;}
.offer-section .offer-image {width: 220px;height: 220px;border-radius: 50%;object-fit: cover;box-shadow: 0 0px 30px rgba(0, 0, 0, 0.3);}
/* Right Section - Brand Messaging */
.offer-section .offer-right {background-color: #2d2d3a;padding: 30px 5% 30px 50px;display: flex;align-items: center;position: relative;}
.offer-section .offer-right::before {content: "";position: absolute;left: -1px;top: 15%;width: 2px;height: 70%;background-color: #fff;}
.offer-section .brand-heading {font-size: 26px;font-weight: 700;color: #ffffff;margin: 0 0 20px 0;line-height: 1.3;font-family: "Montserrat", sans-serif;}
.offer-section .brand-text {font-size: 1.1rem;color: #ffffff;line-height: 1.8;margin: 0;}


/* === Footer Section === */
footer {background-color: #3a3a3a;color: #fff;padding: 40px 0 0;font-size: 16px;line-height: 1.8;}
footer h5 {font-size: 1rem;font-family: "Montserrat", sans-serif;font-weight: 600;text-transform: uppercase;letter-spacing: 1px;margin-bottom: 20px;color: #fff;}
footer p, footer a, footer li {color: #fff;text-decoration: none;font-family: 'Arial', sans-serif;}
footer a:hover {color: #fff;}
footer .footer-contact p{margin-bottom: 10px;}
footer .footer-contact i {color: #fff;margin-right: 10px;}
footer .footer-phone {font-size: 1.7rem;font-weight: 700;color: #fff;margin-left: 3px;}
footer .footer-bottom-wrapper {border-top: 1px solid rgba(255, 255, 255, 0.2);margin-top: 0px;padding-top: 10px;width: 100%;}
footer .footer-bottom {text-align: center;font-size: 15px;color: #d6d6d6;padding-bottom: 15px;font-family: 'Arial', sans-serif;}
footer .footer-bottom a {color: #fff;font-weight: 600;text-decoration: none;}
footer .footer-bottom a:hover {text-decoration: underline;}

/* === Back to Top Button === */
.back-to-top {position: fixed;  right: 25px;  bottom: 25px;  z-index: 999;  display: none;  transition: all 0.4s ease-in-out;  bottom: 100px;}
.back-to-top img {width:50px;  height: 50px;cursor: pointer;  transition: transform 0.3s ease, box-shadow 0.3s ease;}
.back-to-top img:hover {  transform: translateY(-5px);  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.4);}


@media (max-width: 1024px) {
    header .logo img {height: 110px;}
    header .contact-box strong {font-size: 25px;}
    header nav {margin-top: 15px;}
}

@media (max-width: 992px) {
    .offer-section .offer-content{flex-direction: column-reverse;}
    .offer-section .offer-text{max-width: 100%;}
    .offer-section .special-offer-label {font-size: 2rem;}
    .offer-section .offer-image{width: 180px;height: 180px;}
    .offer-section .offer-image{margin-bottom: 30px;}
    .why-section .why-content h2 {font-size: 35px;}
    .why-section .service-right h2{font-size: 35px;}
    .we-make-section .service-right h2 {font-size: 35px;}
    .we-make-section .services-content img {max-width: 200px;}
    .info-box h3 {font-size: 20px;margin-bottom: 5px;}
    .info-box p {font-size: 16px;line-height: 1;}
    .info-box {padding: 25px 15px;}
    .we-make-section .service-right {padding: 100px 5% 40px 50px;}
    .hero-section h1{font-size: 50px;}
    .hero-section {padding: 100px 0px;}
    .hero-section .btn-dmore {padding: 15px 20px;font-size: 18px;}
    .hero-section small {font-size: 13px;}
    header .contact-box{position: initial !important;margin-bottom: 3px;background: transparent;color: #00144c;padding: 0;text-align: center;position: absolute;border:0;text-align: right;}
    header .contact-box small{display: none;}
    header .contact-box strong a {color: #000034;}
    header nav ul{margin-bottom: 10px;    gap: 18px;}
    header .logo img {height: inherit;max-width: 400px;width: 100%;}
}

@media (max-width: 767.98px) {
    .offer-section .offer-right {padding: 30px 5% 30px 5%;}
    .offer-section .offer-right::before{display: none;}
    .offer-section .offer-text {text-align: center;}
    .why-section .why-content h2 {font-size: 32px;}
    .why-section .why-content .features-list li:nth-child(odd) {font-size: 18px;}
    .why-section .why-content .features-list li {font-size: 18px;margin: 15px 0;}
    .why-section .why-content .features-list{padding-left: 15px;}
    .why-section .service-right h2{font-size: 32px;}
    .we-make-section .service-right h2 {font-size: 32px;line-height: 1;}
    .we-make-section .service-right {padding: 40px 5% 40px 5%;}
    .we-make-section .services-content img {max-width: 200px;}
    .info-banner{position: relative;transform: inherit;flex-direction: column;border:none;box-shadow: none;border-radius: 0px;}
    .infobox .container {width: 100%;}
    .info-box {padding: 15px 10px;}
   .hero-section {padding: 70px 0px;}
    header .logo img {width: 200px;}
    header .hleft {padding: 20px 5% 20px 5%;}
    header .hleft::after,header .hleft::before{display: none;}
    header .logo{text-align: center;}
    header .contact-box{text-align: center;}
    header .right-info{text-align: center !important;}
    header nav ul{justify-content: center;padding: 0px;}
    header .hright {padding: 15px 5% 10px 20px;}
    header nav {margin-top: 10px;}
    header .right-info .hours{padding-left:18px;}
}