/*
 Theme Name:   Beaver Builder Child
 Theme URI:    https://www.yoursite.com
 Description:  Child theme for the Beaver Builder Theme.
 Author:       Eduardo Baeza
 Author URI:   https://www.yoursite.com
 Template:     bb-theme
 Version:      1.0
 Text Domain:  bb-child
*/

html {
  scroll-behavior: smooth;
}

/* Your custom CSS here */
.slideshow-container {
	position: relative;
	height: 100vh;
	overflow: hidden;
    font-family: 'Manrope', sans-serif;
}

.slideshow-container .homepage-slide {
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 1s ease;
	/*display: none;*/
	pointer-events: none;
}

.slideshow-container .homepage-slide.active {
	opacity: 1;
	display: block;
	pointer-events: auto;
}

.slideshow-container .overlay {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.3);
	text-align: center;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.slideshow-container .overlay h3 {
	font-family: 'Manrope', sans-serif;
	font-weight: 800;
	font-size: 54px;
	text-align: center;
	margin: 0 0 5px 0;
	padding: 0;
	width: 100%;
	color: white;
}

.slideshow-container .overlay p {
	font-family: 'Manrope', sans-serif;
	font-weight: 400;
	font-size: 26px;
	text-align: center;
	margin: 0;
	padding: 0;
}

.slideshow-container .overlay a {
	font-family: 'Manrope', sans-serif;
	padding: 0.8rem 1.5rem;
	font-weight: 400;
	font-size: 16px;
	border: none;
	border-radius: 6px;
	background-color: white;
	color: #010101;
	cursor: pointer;
	transition: background 0.3s;
	margin-top: 32px;
}

.slideshow-container .overlay button:hover {
	font-family: 'Manrope', sans-serif;
	background-color: #eee;
}

.slideshow-container .dots {
	position: absolute;
	bottom: 20px;
	width: 100%;
	text-align: center;
}

.slideshow-container .homepage-dot {
	height: 12px;
	width: 12px;
	margin: 0 6px;
	background-color: rgba(255, 255, 255, 0.6);
	border-radius: 50%;
	display: inline-block;
	cursor: pointer;
	transition: background-color 0.3s;
}

.slideshow-container .homepage-dot.active {
	background-color: white;
}

@media only screen and (max-width: 500px) {
	.slideshow-container .overlay h3 {
		font-size: 32px;
	}
}

#menu-mainmenu li {
  position: relative;
}

#menu-mainmenu li::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 85%;
  height: 2px;
  background-color: #AAD092;
  opacity: 0;
  transition: opacity 0.3s ease;
}

#menu-mainmenu li:hover::after {
  opacity: 1;
}

#menu-mainmenu > li.current-menu-item {
  position: relative;
}

#menu-mainmenu > li.current-menu-item::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 85%;
  height: 2px;
  background-color: #AAD092;
  opacity: 1;
  transition: opacity 0.3s ease;
}

#menu-mainmenu li.current-menu-parent {
  position: relative;
}

#menu-mainmenu li.current-menu-parent::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 85%;
  height: 2px;
  background-color: #AAD092;
  opacity: 1;
  transition: opacity 0.3s ease;
}

.menu-tierra-capital .sub-menu {
	display: inline-block;
	white-space: nowrap;
	padding-top: 40px !important;
	border-radius: 28px !important;
}

.menu-tierra-capital .sub-menu li > a {
	padding: 20px 28px !important;
}

.menu-tierra-capital .sub-menu li:first-child {
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	overflow: hidden;
}

.menu-tierra-capital .sub-menu li:last-child {
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	overflow: hidden;
}

.menu-tierra-capital img {
	display: none;
}
@media only screen and (max-width: 992px){
	.menu-tierra-capital img {
		display: block;
	}
	.uabb-menu-overlay.uabb-overlay-fade li:not(:first-child) {
		padding: 12px 0;
	}
	.uabb-creative-menu .uabb-menu-overlay > ul.menu {
		width: 90% !important;
		top: 190px;
	}
	.uabb-creative-menu .uabb-menu-overlay > ul.menu img {
		height: 40px;
	}
	.uabb-creative-menu .uabb-menu-overlay > ul.menu span.uabb-menu-toggle {
		transform: rotate(-90deg);
		padding-left: 0 !important;
		transition: transform 0.5s;
	}
	.uabb-creative-menu .uabb-menu-overlay > ul.menu .uabb-active span.uabb-menu-toggle {
		transform: rotate(0);
		padding-left: 0 !important;
		transition: transform 0.5s;
	}
}

.col-item-footer > div > div p {
	margin-bottom: 18px !important;
}

.home-page-carousel .slick-list.draggable .uabb-image-carousel-content {
	height: 100px !important;
	display: flex;
	justify-content: center;
}

.home-page-carousel .slick-list.draggable img {
	height: inherit !important;
	object-fit: contain;
}

/* General */
.bttn-no-link {
	pointer-events: none;
}

.image-div-rounded .fl-col-content {
	border-radius: 20px;
	min-height: 473px !important;
}

.container-relative {
	position: relative;
}

@media only screen and (max-width: 500px) {
	.image-div-rounded .fl-col-content {
		min-height: 342px !important;
	}
}

/* Carousels styles */
.blog-post-card {
	font-family: 'Manrope', sans-serif;
	overflow: hidden;
	background: #fff;
}

.blog-post-card .image-container {
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	height: 200px;
}

.blog-post-card .main-image {
	width: 100%;
	display: block;
	border-radius: 8px;
}

.blog-post-card .tag {
	background-color: white;
	position: absolute;
	top: 16px;
	left: 16px;
	color: #010101;
	padding: 6px 12px;
	font-weight: 400;
	font-size: 14px;
	border-radius: 9999px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.blog-post-card .content {
	text-align: left;
}

.blog-post-card h2.title {
	font-family: 'Manrope', sans-serif;
	margin-bottom: 8px !important;
	margin-top: 12px !important;
	line-height: 23px !important;
}

.blog-post-card h2.title a {
	font-family: 'Manrope', sans-serif;
	font-weight: 700 !important;
	font-size: 18px;
	color: #010101;
}

.blog-post-card .title a:hover {
	color: #010101;
}

.blog-post-card .content p:nth-child(3){
	font-family: 'Manrope', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #5a666c;
	margin: 0;
	padding: 0;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3; 
	-webkit-box-orient: vertical;
}

/* Blog Post */
.blog-post-container {
    display: flex;
}

.blog-post-container .item {
    margin-right: 40px;
    font-family: Manrope;
}

.blog-post-container .item p.title {
    font-weight: 400;
    font-size: 16px;
    color: #5A666C;
    margin: 0;
}

.blog-post-container .item p.content {
    font-weight: 700;
    font-size: 16px;
    color: #010101;
    margin: 0;
}

.blog-post-inner-photo {
	height: 340px;
	margin-bottom: 44px;
}

/* Contact Form */
.contact-form {
	display: flex;
	justify-content: center;
}

.contact-form .uabb-gf-style.uabb-gf-form-style1 {
	margin: 0 !important;
	padding: 0 !important;
	width: 340px;
}

@media only screen and (max-width: 500px) {
	.contact-form .uabb-gf-style.uabb-gf-form-style1 {
		width: 90%;
	}

	.contact-form .fl-module-content.fl-node-content {
		display: flex;
		justify-content: center;
	}
}

.field-phone input {
	padding-top: 0 !important;
}

.field-name input {
	padding-top: 0 !important;
}

.field-email input {
	padding-top: 0 !important;
}

.field-text textarea.small{
	height: 60px !important;
	padding-top: 0 !important;
}

.field-email .gform_wrapper form .gform_body input:not([type='radio']):not([type='checkbox']):not([type='submit']):not([type='button']):not([type='image']):not([type='file']) {
	padding-bottom: 8px !important;
}

/* Counter container */
.counter-container {
  display: flex;
  justify-content: space-between;
}

@media only screen and (max-width: 500px) {
	.counter-container {
		flex-direction: column;
	}
}

.counter-container  .counter-item {
  padding: 20px;
  text-align: center;
  font-family: 'Helvetica Neue', sans-serif;
}

.counter-container  .number {
  font-size: 48px;
  color: #7d9a6b;
  font-weight: bold;
  font-family: 'Manrope', sans-serif;
  font-weight: 800;
  font-size: 56px;
  text-align: center;
}

.counter-container  .label {
  font-weight: 700;
  font-size: 14px;
  text-align: center;
  color: #010101;
  margin-top: 4px;
}

/* Flip cards */
.staff-card {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 20px;
  font-family: 'Manrope', sans-serif;
}

.staff-card .main-card {
  width: 100%;
  aspect-ratio: 1 / 1; /* Ensures square shape */
  perspective: 1000px;
}

.staff-card .card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.staff-card .main-card.flipped .card-inner {
  transform: rotateY(180deg);
}

.staff-card .card-front,
.staff-card .card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  overflow: hidden;
  backface-visibility: hidden;
  top: 0;
  left: 0;
  background-position: center;
  background-size: cover;
}

.staff-card .card-front {
  background-color: #111;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.staff-card .card-front img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
}

.staff-card .card-front .card-info {
  position: relative;
  z-index: 2;
  padding: 16px;
}

.staff-card .card-front .card-info h5 {
  font-weight: 700;
  font-size: 18px;
  color: #ffffff;
  margin: 0;
}

.staff-card .card-front .card-info p {
  font-weight: 400;
  font-size: 14px;
  color: #ffffff;
  margin: 0;
}

.staff-card .card-back {
  background: #f4f1ec;
  color: black;
  transform: rotateY(180deg);
  padding: 24px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.staff-card .card-back h5 {
  font-weight: 700;
  font-size: 18px;
  color: #010101;
  margin: 0;
}

.staff-card .card-back p {
  font-weight: 400;
  font-size: 14px;
  color: #010101;
  margin: 6px 0 0 0;
}

/* Grid de servicios */
.grid-last-centered .uabb-blog-posts-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.grid-last-centered .uabb-blog-posts-grid .uabb-blog-posts-col-3 {
  margin-bottom: 20px;
}

.grid-last-centered .uabb-blog-posts-grid .uabb-blog-posts-col-3:last-child {
  width: 32%;
	left: 48% !important;
	transform: translate(-50%, 0) !important;
}

@media (max-width: 850px) {
.grid-last-centered .uabb-blog-posts-grid {
  flex-wrap: no-wrap;
	flex-direction: column
}
	.grid-last-centered .uabb-blog-posts-grid .uabb-blog-posts-col-3 {
  width: 100%;
	}
	.grid-last-centered .uabb-blog-posts-grid .uabb-blog-posts-col-3:last-child {
		width: 100%;
		left: 0% !important;
	transform: translate(0, 0) !important;
	}
}

/* Last banner in services page  */
.hero-services-overlay {
	overflow: hidden !important;
}
.hero-services-overlay:first-child {
	border-bottom-left-radius: 8px !important;
	border-bottom-right-radius: 0 !important;
	border-top-left-radius: 8px !important;
	border-top-right-radius: 0 !important;
}

.hero-services-overlay:last-child {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 8px !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 8px !important;
}

.hero-services-content .fl-row-content.fl-row-fixed-width.fl-node-content {
	backdrop-filter: blur(3px);
}

@media (max-width: 850px) {
	.hero-services-overlay:first-child {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-top-left-radius: 8px !important;
	border-top-right-radius: 8px !important;
}

.hero-services-overlay:last-child {
	border-bottom-left-radius: 8px !important;
	border-bottom-right-radius: 8px !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
}
}

.testimonials button {
	padding: 5px 10px !important;
	background-color: #AAD092 !important;
}

/* Project slide show */
.project-section {
	font-family: 'manrope', sans-serif;
	display: flex;
	gap: 5rem;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}

.project-section .project-image {
	position: relative;
	width: 50%;
	height: 420px;
	border-radius: 8px;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	opacity: 1;
	transition: opacity 0.4s ease;
}

.project-section .project-info {
	max-width: 400px;
	opacity: 1;
	transition: opacity 0.4s ease;
}

.project-section .fade-out {
	opacity: 0;
}

.project-section .fade-in {
	opacity: 1;
}

.project-section .badge {
	position: absolute;
	top: 24px;
	left: 24px;
	background: white;
	color: #010101;
	padding: 6px 12px;
	border-radius: 20px;
	font-weight: 400;
	font-size: 14px;
}

.project-section .project-name {
	position: absolute;
	bottom: 24px;
	left: 24px;
	color: #ffffff;
	font-weight: 800;
	font-size: 26px;
}

.project-section .project-icon {
	width: 48px;
	margin-bottom: 1rem;
}

.project-section .project-title {
	font-size: 32px;
	font-weight: 800;
	height: 83px;
	color: #010101;
	margin-bottom: 26px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	width: 100%;
}

.project-section .project-description {
	font-size: 18px;
	color: #000000;
	height: 60px;
	font-weight: 400;
	margin: 10px 0 34px 0;
	width: 100%;
}

.project-section .controls {
	display: flex;
	gap: 1rem;
	margin-top: 20px;
}

.project-section .controls button {
	background: #000;
	color: white;
	border: none;
	padding: 0.8rem;
	font-size: 1.2rem;
	border-radius: 10px;
	cursor: pointer;
	transition: background 0.3s;
	width: 42px;
	height: 42px;
}

.project-section .controls button:hover {
	background: #444;
}

@media (max-width: 850px) {
	.project-section .project-image {
		width: 100%;
	}
	.project-section .project-content {
		width: 100%;
	}
	.project-section .project-description {
		height: 110px;
	}
}

/* Whatsapp button floating */
#floating-button {
  position: fixed;
  bottom: 50px;
  right: 15px;
  color: white;
  padding: 10px 20px;
  text-decoration: none;
  border-radius: 5px;
  z-index: 9999;
}

/* proyect details template */
.proyect-details {
	background-color: rgba(255, 255, 255, 0.9); 
	width: 100%; 
	height: 110px; 
	position: absolute; 
	bottom:0; 
	right: 0; 
	display: flex; 
	flex-direction: row;
	justify-content: space-between;
}

@media (max-width: 850px) {
	.proyect-details {
		flex-direction: column;
		bottom: 0;
		height: auto;
	}
	.proyect-details .detail {
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: flex-start;
		padding: 8px;
	}
	.proyect-details .title {
		display: none;
	}
	.proyect-details .description{
		font-weight: 300;
	}
	.proyect-details .detail .icon {
		margin-right: 12px;
	}
}

.proyect-details .detail {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: 20px;
	font-family: 'Manrope', sans-serif;
	color: #010101;
	font-size: 14px;
	font-weight: 400;
	min-width: 19%;
}


.proyect-details .detail .icon {
	height: 24px;
	margin-bottom: 5px
}

.proyect-details .description {
	font-size: 16px;
	font-weight: 700;
	text-transform: capitalize;
}

.proyectos-catalogo > div > div > ul li.uabb-masonary-current {
	color: #FFF !important;
	background-color: #010101 !important;
	
}

.proyectos-catalogo > div > div > ul li {
	font-family: 'Manrope', sans-serif;
	font-weight: 300;
	font-size: 18px;
	color: #36444B !important;
	border-radius: 6px !important;
	text-transform: capitalize;
	background-color: #F9F6F0 !important;
}

/* ================= */
.list-with-icon .fl-list-item .fl-list-item-wrapper .fl-list-item-heading {
	margin: 10px 0 0 0;
}

.list-with-icon .fl-list-item-content {
	font-family: Manrope;
	font-weight: 400;
	font-size: 14px;
}

.list-with-icon .fl-list-item .fl-list-item-wrapper .fl-list-item-heading-icon i {
	font-size: 20px !important;
	margin-right: 10px;
}

.list-with-icon .fl-list-item .fl-list-item-wrapper .fl-list-item-heading-text {
	font-family: Manrope;
	font-weight: 700;
	font-size: 16px;
}

.breadcrumb-position {
  position: relative;
}

.breadcrumb-white {
	position: absolute;
	top: -260px;
	left: 0;
}

.breadcrumb-white-project {
	position: absolute;
	top: 25px;
	left: 0;
}

.contacto-detalles {
	display: flex; 
	margin-bottom: 16px;
}

.contacto-detalles .icon {
	min-width: 32px
}

.contacto-detalles .info{
	font-family: Manrope;
	font-weight: 700;
	font-size: 16px; 
	color: #010101;
}

/* Proyectos paginación, filtros, galeria */
.project-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 851px) {
    .project-grid {
        grid-template-columns: 1fr 1fr;
    }
}

.porto-proy-card {
    aspect-ratio: 1 / 1; 
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    padding: 24px;
    font-family: 'Manrope', sans-serif;
    cursor: pointer;
    
    background-size: 150%; 
    background-position: center;
    transition: all 1s ease; /* This adds the smooth transition effect */
}

.porto-proy-card:hover {
  background-size: 200% auto; /* Grow the background by 10% on hover */
}

.proto-proy-card-badge {
    background-color: white;
    padding: 6px 12px;
    border-radius: 100px;
    color: #010101;
    font-size: 14px;
    font-weight: 400;
    text-transform: capitalize;
	display: inline-block;
}

.proto-proy-card-title {
    color: #FFF !important;
    font-size: 26px;
    font-weight: 800;
}

.project-filter-buttons {
	display: flex;
	justify-content: center;
}

.project-filter-buttons .filter-btn {
	font-family: 'Manrope', sans-serif;
	font-weight: 300;
	font-size: 18px;
	color: #36444B !important;
	border-radius: 6px !important;
	text-transform: capitalize;
	background-color: #F9F6F0 !important;
	margin: 10px 0.3em 50px;
	border: none;
	padding: 14px 12px;
}

.project-filter-buttons .filter-btn:hover {
  background-color: #333;
}

.project-filter-buttons .filter-btn.active {
	color: #FFF !important;
	background-color: #010101 !important;
}

@media (max-width: 850px) {
	.project-filter-buttons {
		align-items: center;
		margin-bottom: 40px;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}

	.project-filter-buttons .filter-btn  {
		margin: 10px 0.3em 10px;
		text-align: center;
		font-size: 14px;
		padding: 8px 12px;
	}
}

.spinner {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: white;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
    vertical-align: middle;
    margin-right: 8px;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.project-load-more-wrapper {
  text-align: center;
  margin-top: 2rem;
  width: 100%;
}

#load-more-projects {
	border-radius: 6px !important;
	color: #FFF;
	background-color: #010101;
  border: none;
  padding: 12px 24px;
  font-size: 18px; 
  font-weight: 300;
  cursor: pointer;
  border-radius: 6px;
  transition: background-color 0.3s ease;
  margin: 40px auto 0;
  display: block;
  text-align: center;
}

#load-more-projects:hover {
  background-color: #383838;
}