.card { display: grid; background-color: var(--Base-Surface-Primary-Normal); border: 1px solid var(--Base-Border-Subtle); border-radius: var(--Corner-radius-Small); min-height: 460px; } .image { height: auto; min-height: 160px; object-fit: cover; overflow: hidden; width: 100%; } .information { display: flex; flex-direction: column; gap: var(--Spacing-x2); padding: var(--Spacing-x2); } .title { display: flex; flex-direction: column; gap: var(--Spacing-x1); } .description { display: flex; flex-direction: column; gap: var(--Spacing-x1); font-family: var(--typography-Caption-Regular-fontFamily); font-size: var(--typography-Caption-Regular-fontSize); } .chips { display: flex; flex-wrap: wrap; gap: var(--Spacing-x1); } .booking { display: flex; flex-direction: column; align-items: center; gap: var(--Spacing-x1); } .button { width: 100%; justify-content: center; } @media screen and (min-width: 850px) { .card { grid-template-columns: 1fr min(480px); min-height: 270px; max-width: 850px; } .image { min-height: 270px; } .booking { justify-content: space-between; flex-direction: row-reverse; } .button { width: auto; } }