.module-hero-house[data-type="garden"] {
    --row-1-background: var(--base-color-light-green);
  }
  
  .module-hero-house[data-type="icon"] {
    --row-1-background: #918381;
  }
  
  .module-hero-house[data-type="passagen"] {
    --row-1-background: #B67973;
    --shape-opacity: 0.7;
  }
  
  .module-hero-house[data-type="light"] {
    --row-1-background: #C2BA9E;
  }
  
  .module-hero-house[data-type="urban"] {
    --row-1-background: #CCCCCC;
  }

  .module-hero-house .row-1 {
    position: relative;
    background: var(--row-1-background, #87998f);
    height: max(230px, calc(660 * var(--px)));
  }
  
  .module-hero-house h1 {
    position: absolute;
    left: -100000em;
  }
  
  .module-hero-house .background-shape {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    opacity: var(--shape-opacity, .2);
    pointer-events: none;
    overflow: hidden;
  }
  
  .module-hero-house .background-shape svg {
    display: block;
    position: absolute;
    top: calc(232 * var(--px));
    left: calc(-197 * var(--px));
    width: calc(1772 * var(--px));
    rotate: -45deg;
    height: auto;
  }
  
  .module-hero-house .background-shape svg path {
    fill: #DFDFD8;
  }
  
  .module-hero-house .house-logo {
    position: absolute;
    z-index: 2;
    left: calc(322 * var(--px));
    bottom: max(40px, calc(60 * var(--px)));
    height: max(70px, calc(208 * var(--px)));
  }
  
  .module-hero-house .house-logo img {
    display: block;
    width: auto;
    max-width: none;
    height: 100%;
  }
  
  
  
  
  
  
  
  
  .module-hero-house .row-2 {
    height: calc(221 * var(--px));
    position: relative;
    z-index: 3;
    padding-inline: var(--page-padding-left);
  }
  
  .module-hero-house .row-2 figure {
    position: absolute;
    right: calc(190 * var(--px));
    bottom: 0;
    width: calc(890 * var(--px));
  }
  
  .module-hero-house .row-2 figure img {
    display: block;
    width: 100%;
    height: auto;
  }
  
  
  
  
  
  
  
  @media (max-width: 700px) {
    
    .module-hero-house .house-logo {
      left: var(--page-padding-left);
    }
    
  }
  
  
  
  @media (max-width: 500px) {
    
    .module-hero-house .row-2 {
      height: calc(32 * var(--px-mobile));
    }
    
    .module-hero-house .row-2 figure {
      right: var(--page-padding-right);
      width: calc(260 * var(--px-mobile));
    }
    
    .module-hero-house .row-2 figure img {
      aspect-ratio: 272 / 153 !important;
      object-fit: cover;
    }
    
  }