body{

  font-family:'Newsreader';

  background: var(--off-white);

}



/* Logo Based Colors */

:root {

  --logo-red: #8B0000;

  --logo-blue: #1F3A4D;

  --logo-gold: #C9A24D;

  --white: #ffffff;

  --black: #000000;

  --off-white:#f8f9fa;

  --dark-gray: #555555;

  --light-gray: #dddddd;

}



/* Button */

.all-btn{

  background:var(--logo-red); /* red */

  color: var(--white);

  font-weight:600;

  border:none;

  padding:12px;

  transition:.3s;

}



.all-btn:hover{

  background: var(--logo-blue); /* blue */

  color: var(--white);

}







/* ============== INDEX PAGE ================ */

/*Navbar section*/

/* Main Navbar */

.main-nav {

  background: var(--logo-blue);

  padding: 10px 0;

}



/* Brand Text */

.brand-text {

  color: var(--white);

}



.brand-text:hover {

  color: var(--logo-gold);

}



/* Nav Links */

.main-nav .nav-link {

  color: var(--white);

  font-weight: 500;

  margin-left: 18px;

  position: relative;

}



/* Hover Effect */

.main-nav .nav-link:hover {

  color: var(--logo-gold);

}



/* Active Link */

.main-nav .nav-link.active {

  color: var(--logo-gold);

}



/* Underline Hover Animation */

.main-nav .nav-link::after {

  content: "";

  position: absolute;

  width: 0;

  height: 2px;

  background: var(--logo-red);

  left: 0;

  bottom: -5px;

  transition: 0.3s;

}



.main-nav .nav-link:hover::after {

  width: 100%;

}



/* Mobile Toggle Color */

.navbar-toggler {

  border-color: var(--logo-gold);

}



.navbar-toggler-icon {

  filter: invert(1);

}



/* Logo Image */

.logo-img {

  background: var(--white);

  padding: 3px;

  border-radius: 6px;

}



/* Info Section */

/* Info Bar Background */

.info-bar {

  border-bottom: 3px solid var(--logo-gold);

}



/* Info Box Card */

.info-box {

  background: var(--white);

  border-radius: 8px;

  transition: 0.3s;

  border-left: 4px solid var(--logo-red);

  box-shadow: 0 2px 8px rgba(0,0,0,0.06);

}



.info-box:hover {

  transform: translateY(-4px);

  box-shadow: 0 6px 18px rgba(0,0,0,0.12);

  border-left-color: var(--logo-blue);

}



/* Icons */

.info-icon {

  color: var(--logo-red);

  min-width: 40px;

}



/* Headings */

.info-box h6 {

  color: var(--logo-blue);

}



/* Links */

.info-link {

  text-decoration: none;

  color: var(--dark-gray);

  font-weight: 500;

}



.info-link:hover {

  color: var(--logo-red);

}



/* Address Text */

.info-text {

  color: var(--dark-gray);

  font-size: 14px;

}





/* ===== Carousel ===== */

/* Carousel Image */

.carousel-img{

  height:90vh;

  object-fit:cover;

}



/* Overlay */

.carousel-overlay{

  position:absolute;

  top:0;

  left:0;

  width:100%;

  height:100%;

  background:rgba(0,0,0,0.55);

}



/* Caption Center */

.carousel-caption-center{

  position:absolute;

  top:50%;

  left:50%;

  transform:translate(-50%,-50%);

  text-align:center;

  color: var(--white);

  z-index:2;

  width:80%;

}



/* Title */

.carousel-title{

font-size:50px;

font-weight:700;

margin-bottom:15px;

}



/* Subtitle */

.carousel-subtitle{

color: var(--white);

letter-spacing:1px;

}





/* ===== About Section ===== */

/* Subtitle */

.section-subtitle {

  color: var(--logo-red);

  font-weight: 700;

  letter-spacing: 1px;

  text-transform: uppercase;

  margin-bottom: 10px;

}



/* Title */

.section-title {

  color: var(--logo-blue);

  font-weight: 800;

  margin-bottom: 18px;

}



/* Text */

.about-text {

  color: #555;

  line-height: 1.7;

  margin-bottom: 12px;

}



/* Gallery Images */

.gallery-big img,

.gallery-small img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 10px;

  transition: 0.3s;

}



/* Fixed Heights */

.gallery-big {

  height: 320px;

  overflow: hidden;

}



.gallery-small {

  height: 150px;

  overflow: hidden;

}



/* Hover Zoom */

.gallery-big img:hover,

.gallery-small img:hover {

  transform: scale(1.05);

}



/* List */

.about-list {

  list-style: none;

  padding: 0;

  margin-top: 15px;

}



.about-list li {

  margin-bottom: 10px;

  font-weight: 600;

  color: var(--logo-blue);

}



.about-list i {

  color: var(--logo-gold);

  margin-right: 8px;

}





/* ===== Services Section ===== */

/* Title */

.service-subtitle {

  color: var(--logo-red);

  font-weight: 700;

  letter-spacing: 1px;

  text-transform: uppercase;

}



.service-title-main {

  color: var(--logo-blue);

  font-weight: 800;

  margin-top: 10px;

}



.service-line {

  width: 80px;

  height: 3px;

  background: var(--logo-red);

  margin: 15px auto 0;

}



/* Card */

.services-section .row{

  display:flex;

  flex-wrap:wrap;

}



.service-card{

  height:100%;

  display:flex;

  flex-direction:column;

  background: var(--white);

  border-radius:8px;

  overflow:hidden;

}



.service-card:hover {

  transform: translateY(-8px);

  box-shadow: 0 10px 30px rgba(0,0,0,0.25);

}



/* Image */

.service-img img {

  width: 100%;

  height: 200px;

  object-fit: cover;

}



/* Content */

.service-content {

  flex-grow: 1;

  padding: 20px;

  text-align: center;

}



.service-content h5 {

  color: var(--logo-blue);

  font-weight: 700;

}



.service-content p {

  color:  var(--dark-gray);

  font-size: 14px;

}



/* Icon */

.service-icon {

  font-size: 32px;

  color: var(--logo-red);

  margin-bottom: 10px;

}





/* ===== Why Section ===== */

/* Image */

.why-img {

  border-radius: 12px;

  box-shadow: 0 10px 30px rgba(0,0,0,0.15);

}



/* Subtitle */

.why-subtitle {

  color: var(--logo-red);

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 1px;

}



/* Title */

.why-title {

  color: var(--logo-blue);

  font-weight: 800;

  margin: 10px 0 15px;

}



/* Text */

.why-text {

  color:  var(--dark-gray);

  line-height: 1.7;

  margin-bottom: 20px;

}



/* Feature Card */

.why-feature {

  display: flex;

  gap: 14px;

  padding: 18px;

  border-radius: 10px;

  background: var(--white);

  transition: 0.3s;

  border-left: 4px solid var(--logo-gold);

  box-shadow: 0 4px 14px rgba(0,0,0,0.08);

}



.why-feature:hover {

  transform: translateY(-5px);

  border-left-color: var(--logo-red);

  box-shadow: 0 8px 24px rgba(0,0,0,0.15);

}



/* Icon */

.why-feature i {

  font-size: 28px;

  color: var(--logo-red);

  min-width: 34px;

  margin-top: 4px;

}



/* Feature Text */

.why-feature h5 {

  color: var(--logo-blue);

  font-weight: 700;

  margin-bottom: 4px;

}



.why-feature p {

  color:  var(--dark-gray);

  font-size: 14px;

  margin: 0;

}



/* Modal Width Control */

.modal-title{

  color: var(--logo-gold);

}

.custom-modal-width {

  max-width: 800px;

}



.brochure-left {

  background: var(--logo-blue);

  color: var(--white);

  padding: 35px;

}



.highlight-title {

  color: var(--logo-gold);

  font-weight: 600;

  margin-bottom: 20px;

}



.feature-list {

  list-style: none;

  padding: 0;

  font-size: 14.5px;

  line-height: 1.8;

}



.feature-list li {

  margin-bottom: 10px;

}



.brochure-left hr {

  border-color: var(--logo-gold);

  margin: 20px 0;

}



.contact-title {

  font-weight: 600;

  margin-bottom: 10px;

  color: var(--logo-gold);

}



.contact-information p {

  margin-bottom: 6px;

  font-size: 14px;

}



.submitting{

  font-size: 14px;

  text-align: center;

}





/* Form Scroll Area */

.form-scroll {

  max-height: 500px;

  overflow-y: auto;

}



/* Smooth Scroll Look */

.form-scroll::-webkit-scrollbar {

  width: 6px;

}



.form-scroll::-webkit-scrollbar-thumb {

  background: var(--logo-gold);

  border-radius: 10px;

}





/* ===== Meet Designer Section ===== */

/* Left Text */

.designer-title{

  font-weight:800;

  font-size:42px;

  line-height:1.3;

}



.designer-subtext{

  margin-top:15px;

  color: var(--light-gray);

}



/* Form Card */

.designer-card{

  background: var(--white);

  padding:30px;

  border-radius:14px;

  box-shadow:0 12px 30px rgba(0,0,0,0.25);

}



.designer-card-title{

  color: var(--logo-blue); /* blue */

  font-weight:700;

  margin-bottom:20px;

}



/* Inputs focus */

.form-control:focus,

.form-select:focus{

  border-color: var(--logo-red);

  box-shadow:0 0 0 0.2rem rgba(155,10,18,0.15);

}



/* Switch color */

.form-check-input:checked{

  background-color: var(--logo-red);

  border-color: var(--logo-red);

}



/* Note */

.form-note{

  color: var(--dark-gray);

  font-size:13px;

}





/* ===== Project Section ===== */

.projects-section{

  color: var(--logo-red);

}

/* Circle Image */

.project-img{

  width:300px;

  height:240px;

  margin:auto;

  border-radius:50%;

  overflow:hidden;

  cursor:pointer;

  border:5px solid  var(--logo-gold);

  transition:0.3s;

}



.project-img img{

  width:100%;

  height:100%;

  object-fit:cover;

}



.project-img:hover{

  transform:scale(1.05);

}



/* Popup */

.gallery-modal{

  position:fixed;

  inset:0;

  background:rgba(0,0,0,0.9);

  display:none;

  justify-content:center;

  align-items:center;

  z-index:9999;

}



.gallery-modal img{

  max-width:80%;

  max-height:60vh;

}



.close-btn{

  position:absolute;

  top:30px;

  right:40px;

  font-size:35px;

  color: var(--white);

  cursor:pointer;

}



.gallery-box{

  position:relative;

  max-width:90%;

}



/* Popup Image Fixed Size */

.img-wrapper{

  width:800px;        /* Aap size change kar sakte ho */

  height:500px;

  position:relative;

  display:flex;

  align-items:center;

  justify-content:center;

  background: var(--black);

  border-radius:10px;

  overflow:hidden;

}



.img-wrapper img{

  width:100%;

  height:100%;

  object-fit:cover;   /* Important line */

}



/* Close Button Image ke upar corner me */

.close-btn{

  position:absolute;

  top:10px;

  right:10px;

  background: var(--logo-gold);

  color:#fff;

  font-size:18px;

  width:35px;

  height:35px;

  display:flex;

  align-items:center;

  justify-content:center;

  border-radius:50%;

  cursor:pointer;

}



/* Prev Next same rahega */

.prev-btn, .next-btn{

  position:absolute;

  top:50%;

  transform:translateY(-50%);

  background: var(--logo-gold);

  border:none;

  color: var(--white);

  font-size:25px;

  padding:8px 15px;

  cursor:pointer;

}



.prev-btn{ left:-60px; }

.next-btn{ right:-60px; }



/* Mobile Fix */

@media (max-width: 576px) {

  .project-img img {

    height: 200px;

  }

}





/* Construction Quote Section */

/* Left text */

.quote-title{

  font-size:40px;

  font-weight:800;

  line-height:1.3;

}



.quote-subtext{

  color: var(--light-gray);

  margin-top:15px;

}



/* Card */

.quote-card{

  background: var(--white);

  padding:28px;

  border-radius:14px;

  box-shadow:0 14px 30px rgba(0,0,0,0.25);

}



.quote-card-title{

  color: var(--logo-blue); /* blue */

  font-weight:700;

}



/* Step badge */

.step-text{

  font-size:13px;

  font-weight:600;

  color: var(--dark-gray);

}



.step-text span{

  color: var(--logo-red);

  font-weight:800;

}



/* Option buttons */

.option-group{

  display:flex;

  flex-wrap:wrap;

  gap:10px;

}



.opt-btn{

  border:2px solid  var(--logo-gold); /* gold */

  background: var(--white);

  padding:6px 14px;

  border-radius:30px;

  font-size:14px;

  font-weight:600;

  transition:.3s;

}



.opt-btn:hover{

  background: var(--logo-red);

  color: var(--white);

  border-color: var(--logo-red);

}

.opt-btn.active {

  background: var(--logo-red);

  color: var(--white);

  border-color: var(--logo-red);

}



/* Input focus */

.form-control:focus{

  border-color: var(--logo-red);

  box-shadow:0 0 0 .2rem rgba(155,10,18,.15);

}



/* Note */

.form-note{

  color: var(--dark-gray);

  font-size:13px;

}





/* ===== Footer ===== */

/* ===== Footer Background ===== */

.footer-section{

  background: var(--logo-blue);

  color: var(--logo-gold);

}



/*Headings*/

.footer-heading{

  color: var(--logo-gold);

  letter-spacing:.5px;

}



/*Text*/

.footer-text{

  color: var(--white);

  line-height:1.6;

}



/*Links*/

.footer-links li{

  margin-bottom:8px;

}



.footer-links a{

  color: var(--white);

  text-decoration:none;

  transition:.3s;

}



.footer-links a:hover{

  color: var(--logo-gold);

  padding-left:6px;

}



/*Contact*/

.footer-contact{

  color: var(--white);

}



.footer-contact a{

  color: var(--white);

  text-decoration:none;

}



.footer-contact i{

  color: var(--logo-gold);

}



/*Social Icons*/

.footer-social a{

  color: var(--white);

  background: var(--logo-red);

  width:36px;

  height:36px;

  display:flex;

  align-items:center;

  justify-content:center;

  border-radius:50%;

  transition:.3s;

}



.footer-social a:hover{

  background: var(--logo-gold);

  color:#000;

  transform: translateY(-3px);

}



/* ===== Bottom Line ===== */

.footer-hr{

  border-color: var(--logo-gold);

}



.footer-copy{

  color: var(--white);

}



.footer-brand-link{

  color: var(--logo-gold);

  text-decoration:none;

  font-weight:600;

}



/* ===== WhatsApp Button ===== */

.whatsapp-float{

position: fixed;

bottom: 20px; 

right: 20px; 

z-index: 9999; 

width: 55px; 

height: 55px; 

display: flex; 

align-items: center; 

justify-content: center; 

font-size: 24px;

}





/* ----------------------------------

   Projects Img Page

---------------------------------- */

  .gallery-subtitle{

    color: var(--logo-red);

    font-weight:700;

    letter-spacing:1px;

  }



  .gallery-card{

    overflow:hidden;

    border-radius:10px;

  }



  .gallery-card img{

    width:100%;

    height:220px;

    object-fit:cover;

    transition:.4s;

  }



  .gallery-card:hover img{

    transform:scale(1.08);

  }





/*All Page*/

/* HERO */

.about-hero{

  height:350px;

  background:linear-gradient(rgba(39,71,96,0.6),rgba(39,71,96,0.6)),

  url("assets/images/img-42.jpg");

  background-size:cover;

  background-position:center;

}





/* CONTACT PAGE */

/* SUBTITLE */

.section-subtitle{

color: var(--logo-red);

font-weight:600;

}



.section-sub{

  color: var(--logo-blue);

}



/* CONTACT INFO */

.contact-info{

background: var(--white);

padding:30px;

border-radius:10px;

box-shadow:0 10px 25px rgba(0,0,0,0.08);

}



.contact-box{

margin-bottom:20px;

}



.contact-box h5{

color: var(--logo-blue);

font-weight:600;

}



/* CONTACT FORM */

.contact-form{

background: var(--white);

border-radius:10px;

}



.contact-form .form-control{

padding:12px;

border-radius:6px;

}



.contact-form .form-control:focus{

box-shadow:none;

border-color: var(--logo-gold);

}



/* MAP */

.map-section iframe{

width:100%;

height:400px;

border:none;

}





/* TERMS & PRIVACY PAGE */

/* Subtitle */

.section-subtitle{

color: var(--logo-red);

font-weight:600;

}



.section-title{

  color: var(--logo-blue);

}



/* Accordion */

.accordion-item{

border:none;

margin-bottom:15px;

border-radius:8px;

overflow:hidden;

box-shadow:0 5px 20px rgba(0,0,0,0.08);

}



/* Accordion Header */

.accordion-button{

background: var(--logo-blue);

color: var(--white);

font-weight:600;

}

.accordion-button:not(.collapsed){

background: var(--logo-red);

color: var(--white);

}



/* Accordion Body */

.accordion-body{

background: var(--white);

color: var(--dark-gray);

line-height:1.7;

}