.area{border-right-width:1px;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(233 232 234/var(--tw-border-opacity,1));min-height:min(400px,25vw);min-height:clamp(270px,25vw,400px)}.area.large{min-height:min(700px,50vw);min-height:clamp(270px,50vw,700px)}@media (min-width:1024px){.area:nth-child(3n){border-right-width:0}.area:nth-child(3n+1):nth-last-child(-n+3),.area:nth-child(3n+1):nth-last-child(-n+3)~.area{border-bottom-width:0}}@media (min-width:640px){.area:nth-child(odd):nth-last-child(-n+2),.area:nth-child(odd):nth-last-child(-n+2)~.area{border-bottom-width:0}}.area:nth-child(2n){border-right-width:0}@media (min-width:1024px){.area:nth-child(2n){border-right-width:1px}}.area:last-child{border-bottom-width:0}.area,.area:last-child{border-right-width:0}@media (min-width:640px){.area{border-right-width:1px}}.preamble{height:0;overflow:hidden;transition:height .3s ease-in-out}.text{opacity:0;transition:opacity .3s ease-in-out}.area:focus .preamble,.area:hover .preamble{height:var(--height,100px)}.area:focus .text,.area:hover .text{opacity:1}.background-image{position:absolute;top:0;left:0;right:0;bottom:0;-o-object-fit:cover;object-fit:cover;height:100%;width:100%;opacity:0;animation:areas-image-exit .5s ease-in-out both}.background-image--active{opacity:1;animation:areas-image-enter .5s ease-in-out backwards}@keyframes areas-image-enter{0%{opacity:0}}@keyframes areas-image-exit{0%{opacity:1}to{opacity:0}}