.card-building {
  display: block;
  width: 100%;
  height: 100%;
  min-height: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  height: 747px;
}

@media screen and (max-width: 991px) {
  .card-building {
    height: 400px;
    min-height: 0px;
  }
}

.card-building::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    350deg,
    rgba(56, 55, 72, 0.16) 57.2%,
    rgba(24, 24, 32, 0.54) 84.88%
  );
  border-radius: 2px;
  z-index: 1;
}
.card-building a {
  text-decoration: none;
}

.card-building .text-wrapper {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 34px;
  z-index: 2;
  position: absolute;
}

.text-wrapper .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.text-wrapper .tags .tag {
  border-radius: 3px;
  border: 1px solid var(--Bianco, #fff);
  background: rgba(255, 255, 255, 0.5);
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 8px;
  white-space: nowrap;
}

.card-building .text-wrapper .badge {
  padding: 8px;
  border-radius: 3px;
  font-size: 10px;
  line-height: 100%;
  font-weight: 600;
  text-transform: uppercase;
  gap: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  height: 100%;
  letter-spacing: 1px;
}

.card-building .text-wrapper .badge.premium {
  background: #CDE2F3;
  border: 1px solid #0D4F82;
  color: #0D4F82;
}

.card-building .text-wrapper .badge.top-level {
  background: #FBECCA;
  border: 1px solid #AA8024;
  color: #AA8024;
}

.card-building .text-wrapper .badge img {
  width: 11px;
  height: 14px;
  object-fit: contain;
}

.card-building .card-title {
  font-size: 52px;
  line-height: 48px;
  color: #fff;
  font-family: "IvyPresto Disp Lt", serif;
  margin: 8px 0 30px;
}

@media screen and (max-width: 991px) {
  .card-building .card-title {
    margin: 8px 0 10px;
  }
}

.card-building .building-type {
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.14px;
}

/* .card-building .card-cta {
  padding: 10px 24px;
  border-radius: 2px;
  background: var(--Bianco, #fff);
  color: var(--Nero, #000);
  font-family: Bicyclette, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  width: fit-content;
} */

.card-building .card-img {
  width: 100%;
  height: 100%;
  border-radius: 2px;
  object-fit: cover;
}
.card-logo {
  position: absolute;
  bottom: 34px;
  left: 34px;
  z-index: 2;
  height: 44px;
  width: auto;
}

/* CARD SOLO TESTO */

.card-building-text {
  flex: 1 0 0;
  align-self: stretch;
  grid-row: 2 / span 1;
  grid-column: 2 / span 1;
  border-radius: 4px;
  background: var(--Grigio4, #f6f6f6);
  background: url(/assets/img/homepage/card-text-bg.png), no-repeat;
  position: relative;
  background-size: cover;
  height: 747px;
}
.card-building-text a {
  text-decoration: none;
}
.card-building-text .text-wrapper {
  display: flex;
  flex-direction: column;
  gap: 30px;
  align-items: flex-start;
}

.card-building-text .card-title {
  color: var(--Nero, #000);
  font-family: "IvyPresto Disp Lt", serif;
  font-size: 44px;
  font-style: normal;
  font-weight: 100;
  line-height: 52px;
  letter-spacing: 0.44px;
  /* background: var(--Grigio4, #f6f6f6); */
  /* border-bottom: 20px solid #fff; */
  padding: 60px 45px 15px 45px;
  margin-bottom: 53px;
}

.card-building-text .card-text {
  color: var(--Grigio1, #828282);
  padding: 0 45px 0 45px;

  /* Paragraph */
  font-family: Bicyclette, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 133.333% */
}

.card-building-text .text-wrapper .card-cta {
  margin: 30px 0 0 45px;
  /* border-radius: 2px;
  background: var(--uptown, #c7cf21);
  padding: 10px 24px;
  color: var(--Nero, #000);
  font-family: Bicyclette, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal; */
}

.card-building-text .card-img {
  position: absolute;
}

@media screen and (max-width: 992px) {
  .card-building-text {
    display: none;
  }
}

/* CARD LOCALE */

.card-locale {
  padding: 18px;
  border-radius: 4px;
  background: var(--Bianco, #fff);
}

@media (max-width: 992px) {
  .card-locale {
    min-width: 33%;
    flex-shrink: 0;
  }
}

@media screen and (max-width: 468px) {
  .card-locale {
    min-width: 54%;
  }
}

.card-locale a {
  text-decoration: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  flex: 1 0 0;
  gap: 40px;
  border-radius: 4px;
  color: #000;
}

.card-locale .text-wrapper {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  width: 100%;
}
.card-locale .text-wrapper .card-icon {
  height: auto;
  width: 18px;
}
.card-locale .card-title {
  color: var(--Nero, #000);
  font-family: 'Bicyclette', sans-serif !important;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px; /* 157.143% */
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.card-available {
  color: var(--Grigio1, #828282);
  font-family: 'Bicyclette', sans-serif;
  font-size: 14px;
  font-style: italic;
  font-weight: 400;
  line-height: 16px; /* 114.286% */
  letter-spacing: 0.14px;
}

.card-locale .tags {
  display: flex;
  align-items: flex-start;
  gap: 5px;
}

.card-locale .tags .tag {
  border-radius: 3px;
  background: var(--Grigio3, #e3e3e3);
  padding: 5px 7px 4px 7px;
  color: var(--Grigio1, #828282);
  font-family: Bicyclette, sans-serif;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.9px;
  text-transform: uppercase;
}

/* CARD QUARTIERE Small*/

.card-quartiere-s {
  padding: 28px;
  background: linear-gradient(45deg, #000 37.32%, #383838 90.87%);
  display: flex;
  flex-direction: column;
  height: 666px;
  /* height: 100%; */
}

@media screen and (min-width: 1200px) {
  .card-quartiere-s {
    height: 762px;
  }
}

@media screen and (max-width: 991px) {
  .card-quartiere-s {
    height: fit-content;
  }
}

.card-quartiere-s.light {
  background: var(--Grigio4, #f6f6f6);
}

.card-quartiere-s .card-category {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  margin-bottom: 32px;
}

.card-quartiere-s .card-category .card-num {
  color: var(--Grigio2, #c4c4c4);
  font-family: Bicyclette, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 12px; /* 120% */
  letter-spacing: 1px;
  text-transform: uppercase;
}

.card-quartiere-s .card-category .card-tag {
  color: var(--Grigio2, #c4c4c4);
  text-align: right;
  font-family: Bicyclette, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 12px; /* 120% */
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 40px;
  border: 1px solid var(--Grigio2, #c4c4c4);
  padding: 4px 10px;
}

.card-quartiere-s .card-title {
  color: var(--Bianco, #fff);
  font-family: "IvyPresto Disp Lt", serif;
  font-size: 34px;
  font-style: normal;
  font-weight: 300;
  line-height: 40px; /* 117.647% */
  letter-spacing: 0.34px;
}

.card-quartiere-s.light .card-title {
  color: var(--Nero, #000);
}

.card-quartiere-s .card-cta {
  /* color: var(--Green-Dark, #abb222); */
  font-family: Bicyclette, sans-serif;
  /* font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal; */
  /* border-bottom: 1px solid var(--Green-Dark, #abb222); */
  margin: 25px 0 50px;
  /* display: block; */
  /* width: fit-content;
  text-decoration: none;
  padding: 0 0 5px 0; */
}
.card-quartiere-s .card-img {
  margin-top: auto;
  height: 377px;
  width: 100%;
  flex-shrink: 0;
  object-fit: cover;
  border-radius: 0;
}

/* CARD QUARTIERE Large*/

.card-quartiere-l {
  position: relative;
  /* height: 100%; */
  height: 666px;
  width: 100%;
}

@media screen and (min-width: 1200px) {
  .card-quartiere-l {
    height: 762px;
  }
}

@media screen and (max-width: 991px) {
  .card-quartiere-l {
    height: 395px;
  }
}

.card-quartiere-l::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    326deg,
    rgba(0, 0, 0, 0) 49.32%,
    rgba(0, 0, 0, 0.55) 79.32%
  );
  z-index: 1;
}

.card-quartiere-l .text-wrapper {
  z-index: 2;
  position: absolute;
  top: 28px;
  left: 40px;
  right: 40px;
}
.card-quartiere-l .card-category {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  margin-bottom: 32px;
}

.card-quartiere-l .card-category .card-num {
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 12px; /* 120% */
  letter-spacing: 1px;
  text-transform: uppercase;
}

.card-quartiere-l .card-category .card-tag {
  color: var(--Bianco, #fff);
  text-align: right;
  font-family: Bicyclette, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 12px; /* 120% */
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 40px;
  border: 1px solid var(--Bianco, #fff);
  padding: 4px 10px;
}

.card-quartiere-l .card-title {
  color: var(--Bianco, #fff);
  font-family: "IvyPresto Disp Lt", serif;
  font-size: 34px;
  font-style: normal;
  font-weight: 300;
  line-height: 40px; /* 117.647% */
  letter-spacing: 0.34px;
}

.card-quartiere-l .card-cta {
  /* color: var(--Green-Dark, #abb222);
  font-family: Bicyclette, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  border-bottom: 1px solid var(--Green-Dark, #abb222); */
  margin: 25px 0 50px;
  /* display: block;
  width: fit-content;
  text-decoration: none;
  padding: 0 0 5px 0; */
}

.card-quartiere-l .card-img {
  object-fit: cover;
  z-index: 0;
}

/* CARD QUARTIERE */
.card-quartiere {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
  border-radius: 4px;
  background: var(--Bianco, #fff);
  width: 354px;
  height: inherit;
}

@media screen and (min-width: 768px) {
  .card-quartiere {
    width: 366px;
  }
}

.card-quartiere .img-wrapper {
  position: relative;
  width: 100%;
  height: fit-content;
}

.card-quartiere .card-img {
  width: 100%;
  height: 100%;
  border-radius: 0px !important;
  object-fit: cover;
}

@media screen and (min-width: 468px) {
  .card-quartiere .card-img {
    height: 418px;
  }
}

.card-quartiere .card-category-wrapper {
  position: absolute;
  bottom: 15px;
  left: 20px;
  right: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.card-quartiere .card-category {
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 17px; /* 141.667% */
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.card-quartiere .card-num {
  color: var(--Bianco, #fff);
  text-align: right;
  font-family: Bicyclette, sans-serif;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 12px; /* 120% */
  letter-spacing: 1px;
  text-transform: uppercase;
}

.card-quartiere .card-tag {
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 12px; /* 120% */
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 40px;
  border: 1px solid var(--Bianco, #fff);
  padding: 4px 10px;
}

.card-quartiere .text-wrapper {
  display: flex;
  padding: 20px;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  flex-grow: 1;
  width: 100%;
}

.card-quartiere .card-title {
  color: var(--Nero, #000);
  text-align: center;
  font-family: 'Bicyclette', sans-serif !important;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px; /* 137.5% */
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.card-quartiere .card-description {
  color: var(--Grigio1, #828282);
  text-align: center;
  font-family: Bicyclette, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px; /* 114.286% */
  letter-spacing: 0.14px;
}

/* .card-quartiere .card-cta {
  color: var(--Green-Dark, #abb222);
  font-family: Bicyclette, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--Green-Dark, #abb222);
  text-decoration: none;
} */

/* CARD STORIE */

.card-storie {
  height: 620px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
  background: var(--Bianco, #fff);
  position: relative;
  border-radius: 4px;
  width: 500px;
  background: linear-gradient(
      193deg,
      rgba(0, 0, 0, 0) 66.08%,
      rgba(0, 0, 0, 0.25) 90.44%
    ),
    lightgray 50% / cover no-repeat;
}

.card-storie::before {
  display: block;
  content: "";
  border-radius: 4px;
  background: linear-gradient(193deg, rgb(0 0 0 / 0%) 66.08%, rgba(0, 0, 0, 0.25) 90.44%);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.card-storie .text-wrapper {
  position: absolute;
  top: 40px;
  left: 40px;
}

.card-storie .intro {
  color: var(--Nero, #000);
  font-family: Bicyclette, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px; /* 157.143% */
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.card-storie .name {
  color: var(--Nero, #000);
  font-family: "IvyPresto Disp Lt", serif;
  font-size: 33px;
  font-style: italic;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 0.66px;
}

.card-storie .card-img, .card-storie video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.card-storie .play-button.card-cta,
.card-storie .stop-button.card-cta {
  background: unset;
  width: fit-content;
  height: fit-content;
  backdrop-filter: none;
  opacity: 1 !important;
  width: fit-content;
  height: fit-content;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.3px;
}

.card-storie .card-cta span {
  display: flex;
  width: 38px;
  height: 38px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  aspect-ratio: 1/1;
  border-radius: 2px;
  border: 1px solid var(--Bianco, #fff);
}

.card-storie .card-cta span img {
  width: 10px;
  height: auto;
}

.card-storie .custom-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  width: fit-content;
  position: absolute;
  bottom: 40px;
  left: 40px;
  top: unset;
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.3px;
  text-decoration: none;
  transform: none;
  z-index: 3;
}

/* CARD STORIE FULL */

.card-storie-full {
  width: 100%;
  height: 100%;
  position: relative !important;
  flex-shrink: 0;
}
.card-storie-full::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    310deg,
    rgba(0, 0, 0, 0) 54.01%,
    rgba(7, 7, 28, 0.5) 81.74%
  );
  z-index: 1;
}

.card-storie-full .text-wrapper {
  position: absolute;
  top: 40px;
  left: 40px;
  z-index: 2;
}

.card-storie-full .card-title {
  color: var(--Bianco, #fff);
  font-family: "IvyPresto Disp Lt", serif;
  font-size: 34px;
  font-style: normal;
  font-weight: 300;
  line-height: 40px; /* 117.647% */
  letter-spacing: 0.34px;
}

.card-storie-full .card-text {
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 133.333% */
  margin: 30px 0;
}

/* .card-storie-full .card-cta {
  display: block;
  border-radius: 2px;
  background: var(--uptown, #c7cf21);
  padding: 10px 24px;
  width: fit-content;
  color: var(--Nero, #000);
  font-family: Bicyclette, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-decoration: none;
} */

.card-storie-full .card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

/* CARD STORIE SMALL */

.card-storie-small {
  width: 100%;
  height: inherit;
  position: relative;
  border-radius: 4px;
  flex-shrink: 0;
  padding: 40px;
  min-height: 390px;
  overflow: hidden;
  display: flex;
}
.card-storie-small::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(
    325deg,
    rgba(0, 0, 0, 0) 43.88%,
    rgba(5, 46, 46, 0.29) 75.05%
  );
  z-index: 1;
}
.card-storie-small .text-wrapper {
  position: relative;
  z-index: 2;
}
.card-storie-small .card-title {
  color: var(--Bianco, #fff);
  font-family: "IvyPresto Disp Lt", serif;
  font-size: 34px;
  font-style: normal;
  font-weight: 300;
  line-height: 40px; /* 117.647% */
  letter-spacing: 0.34px;
}
.card-storie-small > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
}

@media (max-width: 991px) {
  .card-storie-small {
    padding: 32px;
  }
  .card-storie-small .card-title {
    font-size: 30px;
  }
  .card-storie-small::after {
    background: linear-gradient(
        0deg,
        rgba(0, 0, 0, 0) 40.85%,
        rgba(0, 0, 0, 0.4) 86.08%
      ),
      linear-gradient(
        193deg,
        rgba(0, 0, 0, 0) 66.08%,
        rgba(0, 0, 0, 0.25) 90.44%
      );
  }
}

.card-storie-small .card-cta {
  /* display: block;
  color: var(--Bianco, #fff);
  font-family: Bicyclette, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--Bianco, #fff);
  text-decoration: none;
  width: fit-content; */
  margin-top: 28px;
}

/* CARD EVENTO */

.card-evento {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  border-radius: 4px;
  background: var(--Bianco, #fff);
  /* width: 100%; */
}

.card-evento .img-wrapper {
  width: 100%;
  height: 200px;
  overflow: hidden;
  border-radius: 4px 4px 0 0;
}

.card-evento .card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.card-evento .card-body {
  align-items: flex-start;
  padding: 25px;
  flex: 1 0 0;
  align-self: stretch;
  align-content: flex-start;
  display: flex;
  flex-direction: column;
}
.card-evento .card-date {
  color: var(--Green-Dark, #abb222);
  font-family: Bicyclette, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px; /* 157.143% */
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.card-evento .card-title {
  color: var(--Nero, #000);
  font-family: 'Bicyclette', sans-serif !important;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 21px; /* 105% */
  margin: 12px 0;
}

.card-evento .card-text {
  color: var(--Grigio1, #828282);
  font-family: Bicyclette, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.14px;
  margin-bottom: 40px;
}

.card-evento .card-cta {
  margin-top: 20px;
  color: var(--Green-Dark, #abb222);
  font-family: Bicyclette, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  border-bottom: 1px solid var(--Green-Dark, #abb222);
  text-decoration: none;
  padding-bottom: 5px;
  margin-top: auto;
}