/* ANNLETRAVEL - DESTINATION SYSTEM */

.nav-dropdown { position: relative; }
.nav-dropdown .dropdown-menu { min-width: 260px; padding: 10px; }
.destination-menu-group { list-style: none; padding: 8px 10px; border-bottom: 1px solid var(--border); }
.destination-menu-group:last-child { border-bottom: 0; }
.destination-menu-group strong { display: block; margin-bottom: 5px; font-size: 12px; color: var(--text); text-transform: uppercase; letter-spacing: .5px; }
.destination-menu-group a { display: block; padding: 6px 4px; font-size: 13px; color: var(--text); }
.destination-menu-group a:hover { color: var(--primary); }
.destination-menu-group .destination-menu-all { font-weight: 700; color: var(--primary); }

/* Listing */
.destination-grid-v2 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.destination-card-v2 { display: block; position: relative; min-height: 320px; border-radius: 20px; overflow: hidden; background: #dcebf1; text-decoration: none; box-shadow: 0 10px 30px rgba(8,45,65,.08); transition: transform .3s ease, box-shadow .3s ease; isolation: isolate; }
.destination-card-v2:hover { transform: translateY(-7px); box-shadow: 0 20px 45px rgba(8,45,65,.15); }
.destination-card-v2 .destination-placeholder { position: absolute; inset: 0; min-height: 320px; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; color: #7b858c; font-weight: 800; }
.destination-card-v2 .destination-placeholder::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3,28,43,.02) 20%, rgba(3,28,43,.18) 52%, rgba(3,28,43,.9) 100%); z-index: 1; }
.destination-card-v2 .destination-placeholder::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(0,119,182,.14), transparent 48%); z-index: 1; pointer-events: none; }
.destination-card-v2:hover .destination-placeholder { transform: scale(1.025); transition: transform .55s ease; }
.destination-card-content { position: absolute; z-index: 2; left: 24px; right: 24px; bottom: 22px; color: #fff; }
.destination-card-content small { display: inline-flex; margin-bottom: 6px; padding: 5px 9px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(8px); opacity: .98; font-size: 10px; letter-spacing: 1.2px; text-transform: uppercase; font-weight: 800; }
.destination-card-content .destination-name { font-size: 28px; line-height: 1.12; font-weight: 800; margin: 0 0 9px; letter-spacing: -.4px; text-shadow: 0 2px 12px rgba(0,0,0,.25); }
.destination-card-content span { font-size: 13px; font-weight: 700; opacity: .94; }

.destination-tabs { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 25px; }
.destination-tabs a { display: inline-flex; padding: 9px 15px; border-radius: 999px; background: rgba(255,255,255,.12); color: inherit; border: 1px solid rgba(255,255,255,.3); text-decoration: none; font-weight: 700; font-size: 13px; }
.destination-tabs a:hover { background: #fff; color: var(--primary-dark); }

/* Detail */
.destination-detail-hero { min-height: 540px; position: relative; background: linear-gradient(135deg, #0b789f, #004c72); background-size: cover; background-position: center; display: flex; align-items: end; overflow: hidden; }
.destination-detail-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,25,40,.84), rgba(0,25,40,.06) 72%); }
.destination-detail-content { position: relative; z-index: 2; color: #fff; padding-top: 165px; padding-bottom: 76px; }
.destination-detail-content .section-label { color: #fff; opacity: .85; }
.destination-detail-content h1 { font-size: clamp(42px,6vw,60px); line-height: 1.05; margin: 8px 0 15px; letter-spacing: -1px; }
.destination-detail-content p { max-width: 700px; font-size: 18px; line-height: 1.7; margin: 0; color: rgba(255,255,255,.9); }
.empty-result { padding: 42px 30px; background: var(--bg-light); border: 1px dashed #cbdce4; border-radius: 18px; text-align: center; }

@media (max-width: 900px) {
    .destination-grid-v2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .destination-card-v2, .destination-card-v2 .destination-placeholder { min-height: 290px; }
    .destination-detail-content h1 { font-size: 44px; }
}
@media (max-width: 600px) {
    .destination-grid-v2 { grid-template-columns: 1fr; }
    .destination-card-v2, .destination-card-v2 .destination-placeholder { min-height: 270px; }
    .destination-detail-hero { min-height: 430px; }
    .destination-detail-content { padding-top: 125px; padding-bottom: 48px; }
    .destination-detail-content h1 { font-size: 38px; }
}
