.card { display: grid; background-color: var(--Base-Surface-Primary-light-Normal); border: 1px solid var(--Base-Border-Subtle); border-radius: var(--Corner-radius-Small); overflow: hidden; height: 460px; width: 480px; } .image { height: auto; max-height: 180px; object-fit: cover; 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: 1367px) { .card { grid-template-columns: 1fr min(480px); height: 285px; width: 850px; } .image { min-height: 285px; } .booking { justify-content: space-between; flex-direction: row-reverse; } .button { width: auto; } }