/*
* ===========================================
* UTILS
* ===========================================
*/
.u-text-uppercase {
  text-transform: uppercase;
}

.u-text-reset {
  text-transform: unset;
}

.u-text-capitalize {
  text-transform: capitalize;
}

.u-text-lowercase {
  text-transform: lowercase;
}

.u-text-light {
  font-weight: 300;
}

.u-text-regular {
  font-weight: 400;
}

.u-text-medium {
  font-weight: 500;
}

.u-text-semibold {
  font-weight: 600;
}

.u-text-bold {
  font-weight: 700;
}

.u-fontsize-10 {
  font-size: 0.65rem;
}

.u-line-heigh-normal {
  line-height: normal;
}

.u-color-primary {
  color: var(--primary-color);
}

.u-color-secondary {
  color: var(--secondary-color);
}

.u-color-text {
  color: var(--text-color);
}

.u-bg-primary {
  background-color: var(--primary-color);
}

.u-bg-primary-02 {
  background-color: var(--primary-color-02);
}

.u-bg-secondary {
  background-color: var(--secondary-color);
}

.u-bg-gray {
  background-color: var(--gray-color);
}

.u-bg-white {
  background-color: var(--white-color);
}

.u-hover-bg-primary:hover {
  background-color: var(--primary-color);
}

.u-hover-bg-secondary:hover {
  background-color: var(--secondary-color);
}

.u-hover-text-primary:hover {
  color: var(--primary-color);
}

.u-hover-text-secondary:hover {
  color: var(--secondary-color);
}

.u-border-top {
  border-top: 0.5px solid var(--text-color);
}

.u-border-bottom {
  border-bottom: 0.5px solid var(--text-color);
}

@media (min-width: 992px) {
  .u-border-left {
    border-left: 0.5px solid var(--text-color);
  }
}

.u-rotate-315 {
  rotate: 315deg;
}

.u-rotate-135 {
  rotate: 135deg;
}

/*
* ===========================================
* LAYOUTS (NOT EDITABLE)
* ===========================================
*/
.l-grid {
  display: grid;
}
.l-grid--3-9 {
  grid-template-columns: 1fr;
  gap: 20px;
}
@media (min-width: 992px) {
  .l-grid--3-9 {
    grid-template-columns: 3fr 9fr;
  }
}
.l-grid--8-4 {
  grid-template-columns: 1fr;
  gap: 20px;
}
@media (min-width: 992px) {
  .l-grid--8-4 {
    grid-template-columns: 8fr 4fr;
  }
}

.l-flex-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.l-flex-space-between {
  display: flex;
  justify-content: space-between;
}

/*
* ===========================================
* COMPONENTS (REUSABLE)
* ===========================================
*/
.c-text-wrapper {
  color: var(--text-color);
  font-family: "OpenSans", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 27px;
}

.c-btn {
  position: relative;
  padding: 0;
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  align-content: center;
  color: var(--text-color);
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 27px;
  border: none;
  border-radius: 100px;
  background: linear-gradient(90deg, rgb(189, 220, 255) 0%, rgb(138, 191, 252) 30%);
  cursor: pointer;
}
.c-btn--inversed-colors {
  background: linear-gradient(90deg, rgb(255, 214, 243) 0%, rgb(255, 175, 233) 30%);
}
.c-btn__inner {
  height: 100%;
  width: 100%;
  border: 3px solid transparent;
  background-color: transparent;
}
.c-btn__icon {
  height: 27px;
  width: 27px;
  padding: 6px;
  border-radius: 100px;
  background-color: var(--secondary-color);
}
.c-btn__icon--inversed-colors {
  background-color: var(--primary-color);
}
.c-btn__text {
  padding-inline: 15px;
}

.c-card-feature {
  position: relative;
  min-width: 120px;
  height: 190px;
  padding: 1px;
  background-color: var(--text-color);
  overflow: hidden;
  flex: 1;
}
@media (min-width: 992px) {
  .c-card-feature {
    min-width: 240px;
  }
}
.c-card-feature__inner {
  position: relative;
  padding: 20px;
  display: flex;
  height: 100%;
  width: 100%;
  flex-direction: column;
  justify-content: space-between;
  background-color: white;
  transition: background 0.4s ease-out 0.75s;
  z-index: 1;
}
.c-card-feature__icon {
  width: -moz-min-content;
  width: min-content;
  font-size: 16px;
  height: 32px;
}
.c-card-feature__text {
  width: 100px;
  color: var(--text-color);
  font-family: "Open Sans", sans-serif;
  font-size: 1rem;
  font-weight: 600;
}
.c-card-feature::before {
  content: "";
  position: absolute;
  top: -100%;
  left: -100%;
  width: 100%;
  height: 100%;
  background-color: var(--secondary-color);
  transition: top 0.5s ease-in-out, left 0.3s ease-in-out 0.3s;
  pointer-events: none;
}
.c-card-feature::after {
  content: "";
  position: absolute;
  bottom: -100%;
  right: -100%;
  width: 100%;
  height: 100%;
  background-color: var(--secondary-color);
  transition: bottom 0.5s ease-in-out, right 0.3s ease-in-out 0.3s;
  pointer-events: none;
}
.c-card-feature:hover .c-card-feature__inner {
  background-color: var(--primary-color);
}
.c-card-feature:hover::before {
  top: -1%;
  left: -1%;
}
.c-card-feature:hover::after {
  bottom: 0;
  right: 0;
}

/*
* ===========================================
* SWIPER (CAROUSELS
* ===========================================
*/
.swiper {
  min-width: 0;
}

.project-carousel {
  height: 390px;
}
@media (min-width: 992px) {
  .project-carousel {
    height: 550px;
  }
}

.swiper-slide {
  height: 100%;
}
.swiper-slide > img {
  height: 80%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.swiper-slide__footer {
  color: var(--text-color);
  display: flex;
  justify-content: space-between;
  padding-block: 20px;
}
.swiper-slide__number {
  font-family: "JacquestFrancoisShadow", sans-serif;
  font-weight: 400;
  font-size: 1.125rem;
}
.swiper-slide__text {
  width: 130px;
  font-family: "OpenSans", sans-serif;
  font-weight: 700;
  font-size: 0.875rem;
  text-align: right;
}

/*
* ===========================================
* SPECIFICS
* ===========================================
*/
#main-header {
  position: relative;
  height: -moz-fit-content;
  height: fit-content;
}

#main-header .profesionales-btn {
  position: absolute;
  top: 5%;
  right: 5%;
}
#main-header .header-content {
  position: relative;
  height: 100dvh;
  background-image: url("../assets/images/renders/home-bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media (min-width: 992px) {
  #main-header .header-content {
    min-height: 900px;
  }
}
#main-header .header-content .header-logo {
  position: absolute;
  left: 5%;
  padding: 15px;
  padding-top: 25px;
  width: 140px;
  background-color: var(--white-color-09);
  border-radius: 0 0 10px 10px;
}
@media (min-width: 992px) {
  #main-header .header-content .header-logo {
    width: 160px;
  }
}
#main-header .header-content .header-title {
  position: absolute;
  left: 5%;
  right: 5%;
  bottom: 5%;
  width: calc(100vw - 600px);
  max-width: 750px;
  color: var(--white-color);
  font-family: "OpenSans", sans-serif;
  font-weight: 600;
  font-size: 3rem;
}
#main-header .header-content .header-title span {
  font-weight: 200;
}
@media (max-width: 992px) {
  #main-header .header-content .header-title {
    font-size: 32px;
  width: calc(100vw - 10%);
    max-width: 100%;
  }
}
#main-header .header-form {
  width: 100%;
  padding: 20px;
  background-color: var(--primary-color-02);
}
@media (min-width: 786px) {
  #main-header .header-form {
    padding-inline: 60px;
  }
}
@media (min-width: 1180px) {
  #main-header .header-form {
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
    width: 400px;
    padding: 30px;
    border-radius: 10px;
    background-color: var(--white-color-09);
  }
}
#main-header .header-form__desc {
  font-family: "Montserrat", sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: normal;
}
#main-header .header-form .form__inputs-wrapper {
  grid-template-columns: 1fr;
}
#main-header .header-form .form__input {
  grid-column: 1/2;
}

.project-title {
  color: var(--gray-color);
  font-family: "OpenSans", sans-serif;
  font-weight: 400;
  font-size: 1.563rem;
  line-height: 32px;
}

.gallery-wrapper {
  position: relative;
  height: 500px;
  max-height: 90dvh;
  background-image: url("../assets/images/renders/gallery.jpg");
  background-size: cover;
}
@media (min-width: 992px) {
  .gallery-wrapper {
    height: 700px;
  }
}
.gallery-wrapper__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 54.99%);
  pointer-events: none;
}
.gallery-wrapper__content {
  position: absolute;
  bottom: 2%;
  left: 0;
  right: 0;
  margin-inline: 20px;
  padding-block: 25px;
  bottom: 2%;
}
@media (min-width: 992px) {
  .gallery-wrapper__content {
    margin-inline: 100px;
    border-top: 0.5px solid white;
  }
}
.gallery-wrapper__title {
  color: var(--white-color);
  font-family: "Open Sans";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}
@media (min-width: 992px) {
  .gallery-wrapper__title {
    font-size: 1.875rem;
    line-height: 43px;
  }
}

.typologie-list {
  display: flex;
  gap: 15px;
}
@media (min-width: 992px) {
  .typologie-list {
    flex-direction: column;
    gap: 30px;
  }
}
.typologie-list .c-btn {
  width: 120px;
  background: #d9d9d9;
}
.typologie-list .c-btn.active {
  background: linear-gradient(90deg, rgb(189, 220, 255) 0%, rgb(138, 191, 252) 30%);
}
@media (min-width: 992px) {
  .typologie-list .c-btn {
    width: 100%;
  }
}
@media (max-width: 992px) {
  .typologie-list {
    gap: 5px;
  }
}
@media (max-width: 420px) {
  .typologie-list {
    flex-direction: column;
  }
  .typologie-list .c-btn {
    width: 100%;
  }
}

.typologie-item__img {
  height: 300px;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 992px) {
  .typologie-item__img {
    height: 450px;
  }
}
.typologie-item__name {
  margin-block: 20px;
}
@media (min-width: 992px) {
  .typologie-item__name {
    margin-block: 40px;
  }
}

.typologie-features {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  row-gap: 15px;
  height: 140px;
}
@media (min-width: 992px) {
  .typologie-features {
    height: 200px;
    row-gap: 30px;
  }
}
.typologie-features__item {
  display: flex;
  align-items: center;
}
.typologie-features__icon {
  width: -moz-fit-content;
  width: fit-content;
  font-size: 1rem;
  height: 24px;
}
@media (min-width: 992px) {
  .typologie-features__icon {
    height: 32px;
  }
}
.typologie-features__text {
  margin-left: 10px;
  text-align: left;
  color: var(--gray-color);
  font-family: "OpenSans", sans-serif;
  font-size: 0.85rem;
  font-style: normal;
  font-weight: 400;
  line-height: 27px;
}
@media (min-width: 992px) {
  .typologie-features__text {
    margin-left: 30px;
    font-size: 1rem;
  }
}

.typologie-price {
  color: var(--text-color);
  font-family: "JacquestFrancoisShadow";
  font-size: 2.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.typologie-price > span {
  color: var(--gray-color);
  font-family: "OpenSans", sans-serif;
  font-size: 0.6rem;
  font-style: italic;
  font-weight: 400;
  line-height: 19.801px;
}

.amenities-collage {
  display: grid;
  gap: 20px;
}
@media (min-width: 992px) {
  .amenities-collage {
    max-height: unset;
    height: 700px;
    max-height: 90dvh;
    grid-template-columns: 4.5fr 4.5fr 3fr;
    grid-template-rows: 55% 45%;
  }
}
@media (min-width: 1180px) {
  .amenities-collage {
    height: 800px;
  }
}
.amenities-collage__item {
  position: relative;
}
@media (min-width: 992px) {
  .amenities-collage__item:first-child {
    grid-column: 1/3;
  }
  .amenities-collage__item:last-child {
    grid-column: 3/4;
    grid-row: 1/3;
  }
}
.amenities-collage__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 78.04%), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 71.36%);
  z-index: 5;
}
.amenities-collage__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.amenities-collage__text {
  position: absolute;
  bottom: 15px;
  left: 30px;
  color: var(--white-color);
  font-family: "OpenSans", sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 600;
  line-height: 31.245px;
  z-index: 10;
}
@media (min-width: 992px) {
  .amenities-collage__text {
    bottom: 20px;
  }
}

.location-map {
  position: relative;
  margin-top: 30px;
  height: 300px;
  z-index: 5;
}
@media (min-width: 992px) {
  .location-map {
    height: 550px;
  }
}
.location-map > iframe {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

#contact {
  position: relative;
}
#contact::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 100%;
  height: 40%;
  width: 100%;
  background-color: var(--primary-color-02);
}

.profesionales-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.profesionales-header > img {
  height: 100px;
}
.profesionales-header > h3 {
  color: #12211d;
  font-family: "Montserrat", sans-serif;
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 500;
  line-height: 33px;
}

#profesionales {
  min-height: 100dvh;
}
#profesionales .profesionales-text {
  color: var(--text-color);
  font-family: "OpenSans", sans-serif;
  font-size: 1.5rem;
  font-style: italic;
  font-weight: 300;
  line-height: 32px;
}