/* ===== Portada: foto de fondo + cartel "nuevosiglo" ===== */
.hm-hero { background: #f4f1ec; }
.hm-hero-bg { background-image: url("../img/hero-living.webp"); background-position: right center; }
.hm-hero::before {
  background:
    linear-gradient(90deg, #f4f1ec 0%, rgba(244, 241, 236, .96) 30%, rgba(244, 241, 236, .6) 46%, rgba(244, 241, 236, 0) 62%),
    linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, .6) 12%, rgba(255, 255, 255, 0) 24%);
}

/* Columna derecha: cartel arriba, tarjetas abajo */
.hm-hero-side { align-self: stretch; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 28px; }

/* Cartel tipo letrero de la oficina */
.hm-sign {
  display: inline-grid; grid-template-columns: auto auto; align-items: end;
  margin: 0 22px 0 0; padding: 12px 22px 12px; border-radius: 20px;
  font-family: Outfit, system-ui, sans-serif; color: #3b3d3f;
  background: rgba(255, 255, 255, .55);
  -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%);
  box-shadow: 0 24px 50px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .9), inset 0 0 0 1px rgba(255, 255, 255, .45);
}
.hm-sign-a, .hm-sign-b { font-size: 54px; font-weight: 600; letter-spacing: -.03em; line-height: 1; white-space: nowrap; }
.hm-sign-a b, .hm-sign-b { color: #4cb52a; font-weight: 600; }
/* "PROPIEDADES" ocupa exactamente de la n a la i */
.hm-sign-sub { grid-column: 1; display: flex; justify-content: space-between; margin-top: -3px; font-size: 13px; font-weight: 500; line-height: 1; text-transform: uppercase; color: #46504b; }
.hm-sign-sub i { font-style: normal; }

/* Tarjetas en vidrio oscuro sobre la foto */
.hm-hero-chips { width: 350px; margin-bottom: 0; }
.hm-gchip {
  background: rgba(14, 34, 21, .55);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 0 0 1px rgba(255, 255, 255, .3), 0 18px 40px -20px rgba(0, 0, 0, .6);
}
.hm-gchip:nth-child(2) { margin-left: 24px; }
.hm-gchip b, .hm-gchip span { color: #fff; }
.hm-gchip b i { color: #ffcf6a; }

@media (max-width: 1100px) {
  .hm-sign { padding: 11px 20px 11px; margin-right: 0; }
  .hm-sign-a, .hm-sign-b { font-size: 46px; }
  .hm-sign-sub { font-size: 12px; margin-top: -3px; }
  .hm-hero-chips { width: 310px; }
}

/* Celular / tablet: texto arriba, foto abajo con cartel y tarjetas */
@media (max-width: 900px) {
  .hm-hero-bg { background-position: 70% center; }
  .hm-hero::before { background: linear-gradient(180deg, rgba(244, 241, 236, .97) 0%, rgba(244, 241, 236, .9) 46%, rgba(244, 241, 236, .2) 70%, rgba(244, 241, 236, 0) 82%, #fff 100%) !important; }
  .hm-hero-side { width: 100%; align-items: flex-start; gap: 18px; margin-top: 8px; }
  .hm-sign { padding: 9px 16px 9px; border-radius: 16px; }
  .hm-sign-a, .hm-sign-b { font-size: 34px; }
  .hm-sign-sub { font-size: 10px; margin-top: -2px; }
  .hm-hero-chips { width: auto; }
  .hm-gchip:nth-child(2) { margin-left: 0; }
}
@media (max-width: 640px) {
  .hm-sign-a, .hm-sign-b { font-size: 30px; }
  .hm-sign-sub { font-size: 9px; }
}