/*!
 * Start Bootstrap - Freelancer v5.0.3 (https://startbootstrap.com/template-overviews/freelancer)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-freelancer/blob/master/LICENSE)
 


*/



body {
  font-family: 'Montserrat', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  font-family: Montserrat
}
hr.star-dark, hr.star-light {
  max-width: 15rem;
  padding: 0;
  text-align: center;
  border: none;
  border-top: solid .25rem;
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
  margin-left: auto;
  margin-right: auto
}
hr.star-dark:after, hr.star-light:after {
  position: relative;
  top: -.8em;
  display: inline-block;
  padding: 0 .25em;
  content: '\f005';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 2em
}
hr.star-light {
  border-color: #fff
}
hr.star-light:after {
  color: #fff;
  background-color: #470026
}
hr.star-dark {
  border-color: #8a1148
}
hr.star-dark:after {
  color: #8a1148;
  background-color: #fff
}
section {
  padding: 6rem 0
}
section h2 {
  font-size: 2.25rem;
  line-height: 2rem
}
@media (min-width:992px) {
  section h2 {
    font-size: 3rem;
    line-height: 2.5rem
  }
}
.btn-xl {
  padding: 1rem 1.75rem;
  font-size: 1.25rem
}
.btn-social {
  width: 3.25rem;
  height: 3.25rem;
  font-size: 1.25rem;
  line-height: 2rem
}
.scroll-to-top {
  z-index: 1042;
  right: 1rem;
  bottom: 1rem;
  display: none
}
.scroll-to-top a {
  width: 3.5rem;
  height: 3.5rem;
  background-color: rgba(33, 37, 41, .5);
  line-height: 3.1rem
}




#mainNav {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-weight: 700;
  font-family: Montserrat;
	  background-color: rgba(174, 15, 10, 0.3); /* rojo con transparencia */
  transition: background-color 0.3s ease;
  backdrop-filter: blur(6px); /* opcional: desenfoque para elegancia */
}
#mainNav .navbar-brand {
  color: #fff
}
#mainNav .navbar-nav {
  margin-top: 1rem;
  letter-spacing: .0625rem
}
#mainNav .navbar-nav li.nav-item a.nav-link {
  color: #fff
}
#mainNav .navbar-nav li.nav-item a.nav-link:hover {
  color: #790104
}
#mainNav .navbar-nav li.nav-item a.nav-link:active, #mainNav .navbar-nav li.nav-item a.nav-link:focus {
  color: #fff
}
#mainNav .navbar-nav li.nav-item a.nav-link.active {
  color: #5B0204
}
#mainNav .navbar-toggler {
  font-size: 80%;
  padding: .8rem
}
@media (min-width:992px) {
  #mainNav {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    -webkit-transition: padding-top .3s, padding-bottom .3s;
    transition: padding-top .3s, padding-bottom .3s
  }
  #mainNav .navbar-brand {
    font-size: 2em;
    -webkit-transition: font-size .3s;
    transition: font-size .3s
  }
  #mainNav .navbar-nav {
    margin-top: 0
  }
  #mainNav .navbar-nav > li.nav-item > a.nav-link.active {
    color: #fff;
    background: #5B0204
  }
  #mainNav .navbar-nav > li.nav-item > a.nav-link.active:active, #mainNav .navbar-nav > li.nav-item > a.nav-link.active:focus, #mainNav .navbar-nav > li.nav-item > a.nav-link.active:hover {
    color: #fff;
    background: #5B0204
  }
  #mainNav.navbar-shrink {
    padding-top: .2rem;
    padding-bottom: .2rem;
		background-color: #ae0f0a; /* rojo sólido */
  }
  #mainNav.navbar-shrink .navbar-brand {
    font-size: 1.5em
  }
}






header.masthead {
  padding-top: calc(6rem + 72px);
  padding-bottom: 6rem
}
header.masthead h1 {
  font-size: 3rem;
  line-height: 3rem
}
header.masthead h2 {
  font-size: 1.3rem;
  font-family: Lato
}
@media (min-width:992px) {
  header.masthead {
    padding-top: calc(6rem + 106px);
    padding-bottom: 6rem
  }
  header.masthead h1 {
    font-size: 4.75em;
    line-height: 4rem
  }
  header.masthead h2 {
    font-size: 1.75em
  }
}
.portfolio {
  margin-bottom: -15px
}
.portfolio .portfolio-item {
  position: relative;
  display: block;
  max-width: 25rem;
  margin-bottom: 15px
}
.portfolio .portfolio-item .portfolio-item-caption {
  -webkit-transition: all ease .5s;
  transition: all ease .5s;
  opacity: 0;
  background-color: #000000
} /** CUADROS NEGROS SOBRE FOTO **/
.portfolio .portfolio-item .portfolio-item-caption:hover {
  opacity: 1
}
.portfolio .portfolio-item .portfolio-item-caption .portfolio-item-caption-content {
  font-size: 1.5rem
}
@media (min-width:576px) {
  .portfolio {
    margin-bottom: -30px
  }
  .portfolio .portfolio-item {
    margin-bottom: 30px
  }
}
.portfolio-modal .portfolio-modal-dialog {
  padding: 3rem 1rem;
  min-height: calc(100vh - 2rem);
  margin: 1rem calc(1rem - 8px);
  position: relative;
  z-index: 2;
  -webkit-box-shadow: 0 0 3rem 1rem rgba(0, 0, 0, .5);
  box-shadow: 0 0 3rem 1rem rgba(0, 0, 0, .5)
}
.portfolio-modal .portfolio-modal-dialog .close-button {
  position: absolute;
  top: 2rem;
  right: 2rem
}
.portfolio-modal .portfolio-modal-dialog .close-button i {
  line-height: 38px
}
.portfolio-modal .portfolio-modal-dialog h2 {
  font-size: 2rem
}
@media (min-width:768px) {
  .portfolio-modal .portfolio-modal-dialog {
    min-height: 100vh;
    padding: 5rem;
    margin: 3rem calc(3rem - 8px)
  }
  .portfolio-modal .portfolio-modal-dialog h2 {
    font-size: 3rem
  }
}
.floating-label-form-group {
  position: relative;
  border-bottom: 1px solid #e9ecef
}
.floating-label-form-group input, .floating-label-form-group textarea {
  font-size: 1.5em;
  position: relative;
  z-index: 1;
  padding-right: 0;
  padding-left: 0;
  resize: none;
  border: none;
  border-radius: 0;
  background: 0 0;
  -webkit-box-shadow: none !important;
  box-shadow: none !important
}
.floating-label-form-group label {
  font-size: .85em;
  line-height: 1.764705882em;
  position: relative;
  z-index: 0;
  top: 2em;
  display: block;
  margin: 0;
  -webkit-transition: top .3s ease, opacity .3s ease;
  transition: top .3s ease, opacity .3s ease;
  vertical-align: middle;
  vertical-align: baseline;
  opacity: 0
}
.floating-label-form-group:not(:first-child) {
  padding-left: 14px;
  border-left: 1px solid #e9ecef
}
.floating-label-form-group-with-value label {
  top: 0;
  opacity: 1
}
.floating-label-form-group-with-focus label {
  color: #18bc9c
}
form .row:first-child .floating-label-form-group {
  border-top: 1px solid #e9ecef
}

.copyright {
  background-color: #000000;
  font-weight: 700;
  font-family: Montserrat
}
a {
  color: #470026
}
a:active, a:focus, a:hover {
  color: #128f76
}
.btn {
  border-width: 2px
}
.bg-primary {
  background-color: #D7D4D4 !important
}
.bg-primary2 {
  background-color: #470026 !important
}
.bg-primary3 {
  background-image: url("../img/portada1.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.bg-primary4 {
  background-color: #F0F0F0
}

.bg-secondary {
  background-color: #920D09 !important
}
.text-primary {
  color: #ae0f0a !important
}
.text-secondary {
  color: #ae0f0a !important
}
.btn-primary {
  background-color: #470026;
  border-color: #470026
}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
  background-color: #0D1525;
  border-color: #220b56
}
.btn-secondary {
  background-color: #8a1148;
  border-color: #8a1148
}
.btn-secondary:active, .btn-secondary:focus, .btn-secondary:hover {
  background-color: #8a1148;
  border-color: #8a1148
}
/*
.bg {
	  The image used 
  background-image: url("../img/FSR1.jpg");

  /* Half height 
  height: 100%;

  /* Center and scale the image nicely 
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
*/
.slick-slide {
  margin: 0px 20px;
}
.slick-slide img {
  width: 100%;
}
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-slider .slick-track, .slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
}
.slick-track:before, .slick-track:after {
  display: table;
  content: '';
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}
.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}
[dir='rtl'] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
  display: none;
}
/*---------------------------------------
       PRE LOADER              
  -----------------------------------------*/
.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  background: none repeat scroll 0 0 #ffffff;
  opacity: 0.97;
}
.hecho {
  background-color: #E30613;
}
.img-header-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
}
p {
  font-weight: 700;
  font-family: Montserrat
}
a {
  font-weight: 500;
  font-family: Montserrat
}
.collapse a {
  font-weight: 700;
  font-family: Montserrat
}
.navbar-brand {
  font-weight: 700;
  font-family: Montserrat
}
.portfolio-modal-dialog {
  max-width: 100vw;
  height: 100vh;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.portfolio-modal .container {
  width: 100% !important;
  max-height: 90vh;
  overflow-y: auto;
  padding: 30px 15px;
}
.portfolio-modal .row {
  margin: 0;
}
.portfolio-modal .col-lg-8 {
  width: 100%;
}
.portfolio-modal img {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}
.portfolio-modal .btn {
  margin-top: 20px;
}
@media (max-width: 767px) {
  .portfolio-modal-dialog {
    height: 100vh;
    align-items: flex-start;
  }
  .portfolio-modal .container {
    max-height: 100vh;
    padding-top: 60px;
  }
}
header.masthead {
  position: relative;
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 100px;
  padding-bottom: 100px;
  background-color: #1a1a1a;
  overflow: hidden;
}
.img-header-bg2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
header .container {
  position: relative;
  z-index: 2;
}




/* SLIDER PRINCIPAL */
/* Fondo general */
.slider-tuberias-full {
  background-color: #f4f1ec;
  padding: 25px 0 10px;
}

/* Título centrado */
.slider-tuberias-full h3 {
  font-weight: 700;
  font-size: 1.8rem;
  margin-bottom: 40px;
}

/* Swiper general */
.mySwiperTop,
.mySwiperBottom {
  width: 100%;
  padding: 0 10px;
  margin-bottom: 30px;
}

/* Slides */
.mySwiperTop .swiper-slide,
.mySwiperBottom .swiper-slide {
  border-radius: 12px;
  overflow: hidden;
  background-color: #fff;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Imágenes */
.mySwiperTop .swiper-slide img,
.mySwiperBottom .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
}

/* Responsive (ajusta las imágenes a diferentes tamaños) */
@media (max-width: 768px) {
  .slider-tuberias-full h3 {
    font-size: 1.4rem;
  }

  .mySwiperTop .swiper-slide img,
  .mySwiperBottom .swiper-slide img {
    border-radius: 6px;
  }
}







.masthead {
  position: relative;
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 100px;
  padding-bottom: 50px;
  overflow: hidden;
  background-color: #000; /* fallback */
}
.masthead::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background-image: 
    linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.9)),
    url("https://www.transparenttextures.com/patterns/back-pattern.png");
  background-repeat: no-repeat, repeat;
  background-size: cover, 52px 52px;
  background-position: center, center;
  pointer-events: none;
}

.masthead .container {
  position: relative;
  z-index: 2;
}


.footer {
  padding-top: 5rem;
  padding-bottom: 5rem;
  background-color: #ae0f0a;
  color: #fff;
}

.footer p,
.footer a,
.footer span {
  font-family: 'Montserrat', sans-serif;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.6;
}

/* Separadores entre columnas */
.footer .row > div {
  position: relative;
  padding: 0 100px 0 100px;
}

/* Verticales en escritorio */
@media (min-width: 992px) {
  .footer .row > div:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 10%;
    right: 0;
    height: 80%;
    width: 1px;
    background-color: rgba(255, 255, 255, 0.4); /* rojo claro semitransparente */
  }
}

/* Horizontales en móvil */
@media (max-width: 991.98px) {
  .footer .row > div:not(:last-child)::after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 10%;
    width: 80%;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.4);
  }
}




.header-content {
  z-index: 2;
  position: relative;
}

.separator-line {
  width: 6px;
  height: 200px;
  margin: 0 auto;
  background-image: linear-gradient(to bottom, red 25%, transparent 25%, transparent 50%, red 50%, red 75%, transparent 75%);
  background-size: 100% 40px;
  background-repeat: repeat-y;
  border-radius: 2px;
}

/* Animaciones */
@keyframes fadeLeft {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeRight {
  from {
    opacity: 0;
    transform: translateX(30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.animate-fade-left {
  animation: fadeLeft 1.2s ease-out forwards;
}

.animate-fade-right {
  animation: fadeRight 1.2s ease-out forwards;
}

/* Asegura responsividad */
@media (max-width: 768px) {
  .separator-line {
    display: none;
  }
  .text-start {
    text-align: center !important;
  }
}







/* Contenedor general con distribución en 2 columnas */
.about .container {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
	padding: 100px 0
}

/* Título alineado a la izquierda */
.about h2 {
  flex: 0 0 30%;
  font-size: 2rem;
  position: relative;
  text-align: left;
  padding-right: 30px;
  margin-bottom: 30px;
}

/* Línea punteada roja al lado derecho del título */
.about h2::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 3px;
  border-left: 3px dotted red;
}

/* Textos alineados en columna derecha */
.about .content {
  flex: 0 0 65%;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.about .content p {
  flex: 1 1 45%;
  font-size: 1.3rem;
	font-weight: 500;
}

/* Botón centrado al final */
.about .text-center.mt-4 {
  width: 100%;
  margin-top: 40px;
}

/* Imagen de fondo fija con degradado oscuro encima */
.bg-primary5 {
  background: 
    linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.8)),
    url("../img/2025/servicios- obra_civil_2.jpg") no-repeat center center;
  background-size: cover;
  background-attachment: fixed; /* Este es el efecto parallax */
  color: white;
  position: relative;
  padding: 100px 0;
}

@media (max-width: 768px) {
  .about .container {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
  }

  .about h2 {
    flex: 0 0 100%;
    padding-right: 0;
    margin-bottom: 20px;
    text-align: center;
  }

  .about h2::after {
    display: none;
  }

  .about .content {
    flex: 0 0 100%;
    flex-direction: column;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
    gap: 20px;
  }

  .about .content p {
    text-align:center;
    text-align-last: center;
    font-size: 1.5rem;
    width: 100%;
	  font-weight: 500;
  }

  .about .content a {
    margin-top: 10px;
  }
}









/* Fondo sección servicios 


background: linear-gradient(to bottom, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.9)),
              url('../img/fondo-textura-industrial.jpg') no-repeat center center;
  background-size: cover;
*/
.bg-primary4 {
  background-color: #f4f1ec;
  color: white;
  padding: 100px 0;
}

/* Título con línea punteada */

/* Título alineado a la izquierda */
.portfolio .container h2 {
	color: #000000;
}

/* Responsivo: para pantallas pequeñas */
@media (max-width: 768px) {
	
  .servicios-header {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .section-title {
    flex: 0 0 100%;
    padding-right: 0;
    margin-bottom: 20px;
  }

  .section-title h2 {
    text-align: center;
    padding-right: 0;
  }

  .section-title h2::after {
    display: none;
  }

  .section-desc {
    flex: 0 0 100%;
    padding-left: 0;
    justify-content: center;
  }

  .section-desc p {
    text-align: justify;
    text-align-last: center;
  }
}







/* Línea punteada estilo general */
.section-title {
  flex: 0 0 30%;
  position: relative;
  padding-right: 30px;
  display: flex;
  align-items: flex-start;
}

.section-title h2 {
  font-size: 2rem;
  color: #000;
  margin: 0;
  position: relative;
  padding-right: 20px;
}

.section-title h2::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 3px;
  border-left: 3px dotted red;
}

.section-desc {
  flex: 1;
  display: flex;
  align-items: flex-start;
  padding-left: 30px;
}

.section-desc p {
  margin: 0;
  font-size: 1.1rem;
  color: #000;
  line-height: 1.6;
}



/* Cards del slider */
.swiper-slide .card {
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.3s ease;
  
}

.swiper-slide .card:hover {
  transform: scale(1.03);
}

/* Swiper personalizado */
.swiperServicios {
  padding: 20px 0;
}

.swiperServicios .swiper-slide {
  width: 300px; /* Ancho fijo para mostrar 4 a la vez aprox */
}






/* Mejora visual de flechas Swiper */
.custom-swiper-arrow {
  color: #fff !important;
  font-size: 2rem !important;
  width: 50px;
  height: 50px;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 10%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 1.5rem;
  color: #fff;
}









.btn-servicio {
  border: 1px solid #C1C1C1;
  color: #C1C1C1;
  font-weight: bold;
  text-transform: uppercase;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding: 6px 50px 3px;
  font-size: 0.5rem;
font-family: Montserrat;
}

.btn-servicio:hover {
	border: 1px solid #dc3545;
  background-color: #dc3545;
  color: white;
}

.card-title {
	color: #620507;
	font-size: 0.7rem;
}


@media (max-width: 768px) {
	.card-title {
	color: #620507;
	font-size: 0.6rem;
}
}



/* Contenedor general con distribución en 2 columnas */
.otros .container {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  padding: 100px 0;
}

/* Título alineado a la izquierda */
.otros h2 {
  flex: 0 0 30%;
  font-size: 2rem;
  position: relative;
  text-align: left;
  padding-right: 30px;
  margin-bottom: 30px;
}

/* Línea punteada roja al lado derecho del título */
.otros h2::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 3px;
  border-left: 3px dotted red;
}

/* Imagen alineada a la derecha */
.otros .content {
  flex: 0 0 65%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.otros .content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

/* Fondo con efecto parallax */
.bg-primary6 {
  background: 
    linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.8)),
    url("../img/servicios/Fomento-al-deporte-y-actividad-social.jpg") no-repeat center center;
  background-size: cover;
  background-attachment: fixed;
  color: white;
  position: relative;
}


@media (max-width: 768px) {
  .otros .container {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .otros h2 {
    flex: 0 0 100%;
    padding-right: 0;
    margin-bottom: 20px;
    text-align: center;
  }

  .otros h2::after {
    display: none;
  }

  .otros .content {
    flex: 0 0 100%;
    padding-left: 0;
    justify-content: center;
  }

  .otros .content img {
    width: 90%;
    max-width: 400px;
    margin-top: 20px;
  }
}





.bg-logo {
	
  background: 
    linear-gradient(to bottom, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.9)),
    url("../img/servicios/obra-civil2.jpg") no-repeat center center;
  background-size: cover;
  background-attachment: fixed;
  color: white;
  position: relative;

}


.bg-logo .container {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 60px 0;
}

.bg-logo .content {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.bg-logo .content img {
  max-width: 100%;
  height: auto;
  display: block;
}




/* ==================================== */
/* 🌐 ESTILOS BASE (ESCRITORIO)         */
/* ==================================== */

/* ----------------------------- */
/* NOSOTROS - Página "About"     */
/* ----------------------------- */
.nosotros_pagina {
  padding: 60px 0;
  background-color: #e6e6e6;
}

.nosotros_pagina h3 {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 20px;
  color: #343a40;
  text-align: center;
}

.nosotros_pagina p.lead {
  font-size: 1.1rem;
  color: #333;
  line-height: 1.7;
  text-align: justify;
}

.nosotros_pagina ul.lead {
  padding-left: 20px;
  color: #333;
  line-height: 1.7;
  font-size: 1.1rem;
}

.nosotros_pagina .btn-outline-dark {
  border-color: #343a40;
  color: #343a40;
  transition: all 0.3s ease;
}

.nosotros_pagina .btn-outline-dark:hover {
  background-color: #343a40;
  color: white;
}

.nosotros_pagina hr {
  border-top: 1px solid #ccc;
  margin: 40px 0;
}


/* ==================================== */
/* 📱 ESTILOS PARA DISPOSITIVOS MÓVILES */
/* ==================================== */

@media (max-width: 768px) {
  .nosotros_pagina {
    padding: 30px 0;
  }

  .nosotros_pagina h3 {
    font-size: 1.3rem;
    margin-bottom: 15px;
  }

  .nosotros_pagina p.lead,
  .nosotros_pagina ul.lead {
    font-size: 1.3rem;
    text-align: left;
	  font-weight: 500;
	  line-height: 1.7rem;
  }

  .nosotros_pagina .btn-outline-dark {
    width: 100%;
  }

  .nosotros_pagina .col-lg-2,
  .nosotros_pagina .col-lg-8,
  .nosotros_pagina .col-lg-6,
  .nosotros_pagina .col-lg-12 {
    margin-bottom: 20px;
  }
}