[x-cloak] { display: none !important; }
.listing-section { background: #fff; }
.search-shell { position: relative; }
.search-shell svg { position: absolute; top: 50%; left: 1rem; z-index: 1; transform: translateY(-50%); color: #799093; }
.search-shell .form-control { padding: .85rem 1rem .85rem 3rem; border-color: rgba(23,52,61,.18); border-radius: 999px; }
.filter-pill { padding: .55rem 1rem; color: var(--ink); background: #fff; border: 1px solid rgba(23,52,61,.15); border-radius: 999px; font-size: .85rem; font-weight: 600; }
.filter-pill.is-active, .filter-pill:hover, .filter-pill:focus-visible { color: #fff; background: var(--ocean-dark); border-color: var(--ocean-dark); }
.tour-card { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid rgba(23,52,61,.1); border-radius: 8px; box-shadow: 0 12px 35px rgba(22,61,69,.08); }
.tour-image-wrap { position: relative; aspect-ratio: 1.6; overflow: hidden; }
.tour-image { width: 100%; height: 100%; object-fit: cover; }
.tour-category, .tour-duration { padding: .35rem .6rem; color: var(--ink); background: rgba(255,255,255,.92); border-radius: 999px; font-size: .72rem; font-weight: 700; }
.tour-category { position: absolute; top: .9rem; left: .9rem; }
.tour-coming-soon { margin-left: auto; padding: .55rem .55rem; font-size: 1rem; line-height: 1.1; white-space: nowrap; }
.tour-duration { min-width: 5rem; flex-shrink: 0; text-align: center; white-space: nowrap; }
.tour-body { position: relative; display: flex; flex: 1; flex-direction: column; padding: 1.4rem; }
.tour-body h3 { margin: 0; font-size: 1.5rem; }
.tour-body p { margin: 1rem 0; font-size: .9rem; line-height: 1.6; }
.tour-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: auto; }
.tour-footer small { display: block; color: #799093; }
.tour-footer strong { display: block; color: var(--ink); font-size: 1.2rem; }
.listing-skeleton { min-height: 340px; padding: 1.4rem; background: linear-gradient(110deg, #edf7f6 8%, #f8fbfb 18%, #edf7f6 33%); background-size: 200% 100%; animation: listing-shimmer 1.4s linear infinite; border-radius: 8px; }
.listing-skeleton span { display: block; height: 1rem; margin-top: 1rem; background: rgba(255,255,255,.65); border-radius: 999px; }
.listing-skeleton span:first-child { height: 10rem; margin: 0 0 1.5rem; }
.empty-state { padding: 3rem; border: 1px dashed rgba(23,52,61,.2); border-radius: 8px; }
.data-note { color: #799093; font-size: .85rem; }
@keyframes listing-shimmer { to { background-position-x: -200%; } }
@media (prefers-reduced-motion: reduce) { .listing-skeleton { animation: none; } }