:root{--gp-black:#000;--gp-gray:#e5e9ee}
html,body{font-family:'Lato',sans-serif}
body{background:#fff;color:#1b1e21}
p,a{font-size:1.1rem;}
a{text-decoration:none;color:gray}
a:hover{color:#000}
.btn{min-width:100px;border-radius:4px}
.btn-danger{
  --bs-btn-color:#fff;
  --bs-btn-bg:#ff0000;
  --bs-btn-border-color:#ff0000;
  --bs-btn-hover-bg:#cc0000;
  --bs-btn-hover-border-color:#cc0000;
  --bs-btn-active-bg:#b30000;
  --bs-btn-active-border-color:#b30000;
  background-color:var(--bs-btn-bg);
  border-color:var(--bs-btn-border-color);
  color:var(--bs-btn-color);
}
.btn-dark{
  background-color: black;
}

b, strong{
  font-weight: 800!important;
}
 
.square{
  object-fit:contain;height:15.1rem!important
}

.banner-inicio{
  width: 100%;
  height: auto;
}

.navbar .nav-link{color:#000 !important;font-weight:600}
.navbar .nav-link:hover{color:#555 !important}
.nav-item .fa-house{
  background:#000;color:#fff;border-radius:50%;padding:7px;font-size:18px;display:inline-block;width:36px;height:36px;text-align:center;line-height:20px
}

.navbar{box-shadow:0 2px 12px rgba(0,0,0,.06)}
.gp-card{border:1px solid #b0b0b0ff;border-radius:0;overflow:hidden;box-shadow:none;background:#fff}
.titlebar{background:#000;color:#fff;padding:.75rem 1rem;font-weight:700;font-size:21px;text-align:center;border-bottom:3px solid #fff}
.list-divided li{padding:.50rem 0;border-top:1px solid #e5e9ee;font-size:1.1rem;font-weight:100}
.list-divided li:first-child{border-top:0}
.section-sub,.card-text{font-weight:bold;font-size:1.2rem}

    .gp-card .card-body { padding-left: 1rem; padding-right: 1rem; }
    #productos .card { margin-bottom: 0 !important; }
    #productos .row { --bs-gutter-y: 1rem; }

    .gp-grid-3 { --bs-gutter-x: .75rem; --bs-gutter-y: .75rem; }
    .gp-grid-3 .card { margin-bottom: 0 !important; }
    .card-image-full { display:block; }
    .card-image-full img { display:block; width:100%; height:100%; object-fit:cover; }

.hero.hero-img-only{
  background:#000000;
  padding:0;
  line-height:0;
}

.hero.hero-img-only img{
  display:block;
  width:100%;
  max-width:1180px;   
  height:auto;
  margin:0 auto;   
}


/* Desktop en adelante */
@media (min-width: 992px){
  /* 1) La columna que contiene el menú lateral se vuelve un stack vertical */
  [class*="col-lg-"]:has(.side-menu){
    display: flex;
    flex-direction: column;
  }
  /* 2) Empuja el último hijo (tu contacto_banner.php) hacia abajo */
  [class*="col-lg-"]:has(.side-menu) > :last-child{
    margin-top: auto;
  }
  /* 3) Asegura columnas a igual altura para que realmente quede “sobre el pie” */
  .row:has(.side-menu){
    align-items: stretch !important;
  }
}



.ratio-3x2 {
  position: relative;
  width: 100%;
}

.ratio-3x2::before {
  display: block;
  padding-top: calc(2 / 3 * 96%);  
  content: "";
}

.ratio-3x2 > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.footer-top a{
  font-size: .95em;    
}
.footer-columns .fcol{
  padding-left: 1.15rem;
  padding-right: 1.15rem;
}
span{
  font-size: .9em;
}
  
.hero .content,.hero .hero-copy{display:none !important}

.hero h1{font-size:clamp(2.2rem,3.2vw+1rem,4rem);font-weight:800;line-height:1.05;margin-bottom:1rem}

.banner-productos .ratio{--bs-aspect-ratio:40%}
.banner-productos .caption{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.75);color:#fff;padding:.6rem 1rem;font-weight:700;display:flex;justify-content:space-between;align-items:center}


.banner-obra .ratio{--bs-aspect-ratio:45%}
.banner-obra .caption{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.75);color:#fff;padding:.6rem 1rem;font-weight:700;display:flex;justify-content:space-between;align-items:center}
.clients-wrap{border-bottom:1px solid #eee;background:#fff}
.clients-title{font-weight:800}

.form-control::placeholder{color:#bbb;opacity:1}

.fcol li{
  margin-bottom: 10px;
}

sup {
  top: -.4em!important;
  font-size: .65em!important;
}
 
footer{color:#fff}
.footer-top{background:#000}
.footer-top a{color:#dddddd; font-weight: 100;}
.footer-top a:hover{color:#ff0000; }
.footer-columns{row-gap:2rem} 

.clients-swiper .swiper-wrapper{transition-timing-function:linear !important}
.clients-wrap{border-bottom:1px solid #eee;background:#fff}
.clients-title{font-weight:700}
.clients-swiper .swiper-slide{width:auto}
.clients-swiper img{height:85px;width:auto;display:block;filter:grayscale(100%);opacity:.9;transition:opacity .2s}
.clients-swiper img:hover{opacity:1}

.footer-legal{
  font-size: .85em!important;
}
.footer-legal a{
  position:relative;color:inherit;text-decoration:none;padding-left:0;padding-right:2px
}
.footer-legal a:not(:last-child)::after{
  content:"";position:absolute;right:0;top:50%;transform:translate(7px,-50%);height:14px;width:1px;background-color:#ffffff
}

.social a{
  display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background-color:#000;color:#fff;text-decoration:none;transition:background-color .3s ease,color .3s ease
}
.social a:hover{background-color:#444;color:#fff}
.social a i{color:#fff}
.social a:hover i{color:#fff}

.doc-card{border:1px solid #b7b5b5!important}

.breadcrumb-bar{background:#000;color:#fff;padding:.8rem 0;margin-top:5px}
.breadcrumb-bar__text{font-weight:500;font-size: 1.1em;}
.breadcrumb-bar__text span{opacity:.9}

.page-title{font-weight:900}

.lateral { padding-right: 32px; }

.fw-bold{ font-weight: 800!important; }

.side-menu .list-divided li{padding:.6rem 0;border-top:1px solid #b0b0b0ff}
.side-menu .list-divided li:first-child{border-top:0}
.side-menu a{color:#1b1e21;text-decoration:none;display:block}
.side-menu a:hover{color:#000}
a.active{color:red!important;}

.content-text p{margin-bottom:1rem}
.links-list li{border-top:1px solid #e5e9ee;padding:.55rem 0}
.links-list li:first-child{border-top:0}
.links-list a{text-decoration:none;color:#1b1e21}
.links-list a:hover{color:#000}

@media (min-width:768px){.footer-columns .fcol + .fcol{border-left:1px solid rgba(255,255,255,.25)}  }
.footer-actions-line{background:#000;border-top:4px solid rgb(255, 255, 255)}
.footer-actions-line .action{color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:.6rem 1rem;display:flex;align-items:center;gap:.5rem;white-space:nowrap;font-weight: 700;}
.app-badges img{height:44px}
.footer-newsletter{background:#fff;color:#000}
.footer-newsletter .form-control,.footer-newsletter .btn{border-radius:5px}
.footer-bottom{background:#000}
.footer-legal a{color:#fff}
.footer-legal a:hover{color:#fff}
.container-edge{padding-left:0;padding-right:0}
.sidebar-stack{display:flex;flex-direction:column;height:100%}
.sidebar-stack .fill-space{margin-top:auto}
.card-image-full .ratio>img{object-fit:cover}
.row.g-5.align-items-start{--bs-gutter-x:1.1rem}
 
@media (min-width: 1400px) {
  .list-divided li { 
      font-size: 1.15rem; 
      padding: 0.637rem 0;
  }
  .square{
    object-fit:contain;height:18rem!important
  }
 
  .footer-top a{
    font-size: 1.1em;
  }

  .hero.hero-img-only img{
    display:block;
    width:100%;
    max-width:1400px;   
    height:auto;
    margin:0 auto;   
  }
}










  .contact-card{border:1px solid #b0b0b0;background:#fff;display:flex;flex-direction:column; }
  .contact-card .titlebar{background:#000;color:#fff;font-weight:800;padding:.6rem 1rem;border-bottom:3px solid #fff}
  .contact-card .box{padding:1rem;flex:1 1 auto}
 
  small{font-size:1em;}
  .card-hero{
    width:100%;
    background:#000 center/cover no-repeat; 
    min-height:200px;
  }
  @media (min-width:992px){ .card-hero{ min-height:200px } }
  @media (min-width:1400px){ .card-hero{ min-height:240px } }
 
  .equal-row{align-items:stretch}
  .contact-info li{display:flex;gap:.6rem;align-items:center;margin:.35rem 0}
  .contact-info i{width:22px;text-align:center}
  .branch h6{font-weight:800;margin:0 0 .25rem}
  .branch small{display:block;opacity:.95}
  .form-note{font-size:.8rem;opacity:.85}
 
.mt-4.contact-card{
  border: 0 !important;        
  background: #fff;
}
.mt-4.contact-card .titlebar{
  background: transparent;         
  color: #000;
  padding-left: 0;
  padding-right: 0;
  border: 0;
  font-weight: 900;
  text-align:left;
}
.mt-4.contact-card .box{
  padding-left: 0;
  padding-right: 0;
  border-top: 2px solid #000;    
}
  
.mt-4.contact-card .form-label{
  color: #000;
  margin-bottom: .35rem;
}
.mt-4.contact-card p,
.mt-4.contact-card .form-note{
  color: #000;
}
 
.mt-4.contact-card .form-check-input{
  border-radius: 0;
  border: 1px solid #aaa;
  box-shadow: none;
}
.mt-4.contact-card .form-check-input:checked{
  background-color: #000;
  border-color: #000;
}
 
.mt-4.contact-card .btn.btn-dark{
  border-radius: 0;
  padding: .5rem 1.25rem;
}
 
.mt-4.contact-card + .form-note{
  border-top: 3px solid #000;
}