/* Preserve the supplied photographs exactly within their gallery frames. */
.gallery-item img { object-fit: contain; background: #201619; transition: transform .7s; }
.gallery-item:hover img { transform: scale(1.02); }

/* Numbered discovery cards: the message appears only once a card is tapped. */
.reason-card { min-height: 230px; padding: 25px; border: 0; text-align: center; cursor: pointer; display: grid; place-items: center; position: relative; overflow: hidden; color: #fff; transition: .35s; }
.reason-card:nth-child(3n + 1) { background: linear-gradient(145deg, #b55c78, #6c273e); }
.reason-card:nth-child(3n + 2) { background: linear-gradient(145deg, #d6967d, #9a4f4c); }
.reason-card:nth-child(3n) { background: linear-gradient(145deg, #82709a, #46375f); }
.reason-card::before, .reason-card::after { content: '♥'; position: absolute; color: #fff; opacity: .24; font-size: 38px; }
.reason-card::before { top: 14px; left: 18px; }.reason-card::after { right: 17px; bottom: 12px; font-size: 26px; }
.reason-card:hover, .reason-card.open { transform: translateY(-5px); filter: saturate(1.2) brightness(1.05); }
.reason-card .reason-number { font: clamp(58px, 7vw, 88px)/1 var(--serif); position: relative; z-index: 1; transition: .35s; }
.reason-card p { position: absolute; inset: 22px; display: grid; place-items: center; margin: 0; max-height: none; overflow: hidden; opacity: 0; transform: scale(.92); transition: .35s; font: 22px/1.25 var(--serif); z-index: 2; }
.reason-card.open .reason-number { opacity: 0; transform: scale(.8); }
.reason-card.open p { max-height: none; margin: 0; opacity: 1; transform: none; }
@media (max-width: 720px) { .reason-card { min-height: 175px; padding: 14px; } .reason-card .reason-number { font-size: 62px; } .reason-card p { inset: 14px; font-size: 18px; } .reason-card::before { font-size: 28px; } .reason-card::after { font-size: 20px; } }

/* Let each photograph keep its natural aspect ratio: no cropped subjects or empty letterboxing. */
.gallery { display: block; columns: 3 260px; column-gap: 18px; }
.gallery-item, .gallery-item.wide, .gallery-item.tall, .gallery-item.portrait { display: block; width: 100%; height: auto; min-height: 0; break-inside: avoid; margin: 0 0 18px; grid-column: auto; grid-row: auto; }
.gallery-item img { width: 100%; height: auto; object-fit: initial; background: none; }
.gallery-item::after { opacity: .66; }
.gallery-item span { opacity: 1; transform: none; }
.confetti-piece { position: fixed; z-index: 40; left: var(--x); top: var(--y); width: 8px; height: 12px; border-radius: 2px; pointer-events: none; background: #f2b8bd; animation: confetti-fall .9s cubic-bezier(.12,.8,.25,1) forwards; }
@keyframes confetti-fall { to { transform: translate(var(--dx), var(--dy)) rotate(var(--r)); opacity: 0; } }
@media (max-width: 720px) { .gallery { columns: 2 135px; column-gap: 10px; } .gallery-item, .gallery-item.wide, .gallery-item.tall, .gallery-item.portrait { margin-bottom: 10px; } .gallery-item span { font-size: 16px; left: 12px; bottom: 10px; } }
@media (prefers-reduced-motion: reduce) { .confetti-piece { display: none; } }