:root{--zero: 0;--xxs: 375px;--xs: 450px;--sm: 769px;--md: 980px;--lg: 1025px;--xl: 1100px;--2xl: 1280px;--3xl: 1440px;--4xl: 1920px}@media screen and (min-width: 980px){.md-max{display:none}}.residence{--valueY: 10px;--color: var(--white);position:relative;width:100%;height:calc(100% + 10px);height:calc(100% + var(--valueY));border-radius:8px;overflow:hidden;aspect-ratio:684/244;clip-path:inset(10px 0 0 0 round 8px);clip-path:inset(var(--valueY) 0 0 0 round 8px);transition:clip-path .3s var(--ease-out-quad)}.residence:hover{clip-path:inset(0% 0 0 0 round 8px)}.residence:hover .icon{background:var(--pink);color:var(--white);transform:translateY(calc(-1 * var(--valueY)))}.residence:hover .residence-content{transform:translateY(calc(-1 * var(--valueY)));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.residence-media{width:100%;height:100%}.residence-media img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.residence-content{--color: var(--white);position:absolute;top:0;bottom:0;left:0;right:0;height:calc(100% + var(--valueY));display:flex;align-items:flex-start;padding:24px;padding-top:calc(16px + var(--valueY));background:rgba(0,0,0,.31373);transition:transform .3s var(--ease-out-quad),backdrop-filter .3s var(--ease-out-quad)}.residence .icon{position:absolute;top:calc(16px + var(--valueY));right:16px;display:flex;justify-content:center;align-items:center;width:48px;height:48px;background:var(--white);border-radius:50%;color:var(--pink);cursor:pointer;transition:background .3s var(--ease-out-quad),color .3s var(--ease-out-quad),transform .3s var(--ease-out-quad)}.residence .icon svg{width:19px;height:19px}