
/* Base spacing for fixed header/footer */
:root{
  --nav-h: 64px;
  --foot-h: 120px;
}
body{
  scroll-behavior:smooth;
  font-family: 'Poppins', sans-serif;
}

h1{
  font-size: 22px !important;
}


a {
    color: white;
    text-decoration: none;
}

.pt-nav{padding-top: calc(var(--nav-h) + 20px);}

/* Navbar height & toggler */
.navbar{ min-height: var(--nav-h); font-size: x-large; }
.nav-link.active{ color: #0d6efd !important; }

/* Hero slider (full width, full viewport height minus header) */
.hero-slide{
  height: calc(90vh);
  background-image: url('../img/hero.jpg');
  background-size: cover;
  background-position: center;
  position: relative;
}

.hero-slide2{
  height: calc(90vh);
  background-image: url('../img/hero2.jpg');
  background-size: cover;
  background-position: center;
  position: relative;
}

.hero-slide::after .hero-slide2::after{
  content:"";
  position:absolute; inset:0;
  /*background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.35));*/
}

/* Feature 4-column cards with background images */
.feat-card{
  height: 500px;
  background-image: url('../img/feat1.jpg');
  background-size: cover;
  background-position: center;
  border-radius: .75rem;
  position: relative;
  overflow: hidden;
  display:flex;
  padding: 1rem;
}
.feat-2{ background-image: url('../img/feat2.jpg'); }
.feat-3{ background-image: url('../img/feat3.jpg'); }
.feat-4{ background-image: url('../img/feat4.jpg'); }

.feat-card::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.55) 100%);
}
.feat-text{
  position: relative;
  z-index: 1;
  color: #fff;
  font-weight: 600;
  font-size: 1.125rem;
}

/* Footer */
.footer{ 
  border-top: 1px solid rgba(255,255,255,.1); 
  background-color: #ffab00 !important;
}

.copyright{ 
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
  background-color: #fff !important;
  width: 100% !important;
}

/* Utilities */
.bg-light{ background-color: #f6f8fa !important; }


.py-4-naranja {
    background-color: #ffab00 !important;
}

.py-5-azul {
    background-color: #0d6efd !important;
}

.py-4 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}

.py-5 {
    padding-top: 7rem !important;
    padding-bottom: 7rem !important;
}

.construimos_hogares { 
  max-width: 100% !important;
  padding-top: 7rem !important;
  padding-bottom: 7rem !important;
}

.construcciones_pa{
    max-width: 100% !important;
  padding-top: 7rem !important;
  padding-bottom: 7rem !important;
  color: white !important;
}

h3{
  font-size: 18px !important;
}
h2{
  font-size: 20px !important;
}

.logo-naranja{
  max-width: 100% !important;
  background-color: white;
  padding-top: 7rem !important;
  padding-bottom: 7rem !important;

}

.colum-footer-light{
  max-width: 100% !important;
  background-color: white;
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

.colum-footer{
  max-width: 100% !important;
  padding-top: 1rem !important;
  padding-bottom: 7rem !important;
}

.contacto {
  display: flex;
  flex-direction: column; /* apila en columna */
  align-items: center; /* alinea los h1 a la izquierda */
  justify-content: center; /* centra el conjunto dentro del div */
}

.centrar{
  text-align: center !important;
}

/* Responsive tweaks */
@media (max-width: 576px){
  :root{ --foot-h: 220px; }
  .hero-slide{ height: 50vh; }
}

@media (max-width: 800px){
  :root{ --foot-h: 220px; }
  .hero-slide{ height: 60vh; }

  h1 {
    font-size: 20px !important;
  }

  h3 {
    font-size: 16px !important;
  }

  .contacto{
    padding-bottom: 75px !important;
    padding-top: 75px !important;
  }
}
