/* =========================================================
   Booking.com-style theme Ã¢â‚¬â€ global tokens & components
   ========================================================= */
:root {
    /* Premium Kashmir tourism palette */
    --bk-primary: #1F4D3A;          /* Deep Forest Green */
    --bk-primary-dark: #143427;
    --bk-accent: #D4A85A;            /* Golden Sand */
    --bk-accent-border: #D4A85A;
    --bk-cta: #1F4D3A;
    --bk-cta-hover: #143427;
    --bk-sage: #5E8B7E;              /* Optional sage accent */
    --bk-text: #222222;
    --bk-text-muted: #5E5E5E;
    --bk-border: #E5E0D5;
    --bk-border-strong: #B8B0A0;
    --bk-bg: #F8F5EF;                /* Warm Cream */
    --bk-bg-soft: #EFEBE2;
    --bk-bg-tint: #E8F0EC;
    --bk-shadow-sm: 0 1px 2px rgba(0,0,0,0.06);
    --bk-shadow-md: 0 2px 8px rgba(31,77,58,0.10);
    --bk-shadow-lg: 0 4px 16px rgba(31,77,58,0.14);
    --bk-radius-sm: 4px;
    --bk-radius: 8px;
    --bk-radius-lg: 12px;
    --bk-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --bk-container: 1140px;
}

html, body { margin: 0 !important; padding: 0 !important; }
body.td_theme_2, body {
    font-family: var(--bk-font);
    color: var(--bk-text);
    background: #FFFFFF;
    margin: 0 !important;
}
.bk-header { margin: 0 !important; padding-bottom: 0 !important; }
.bk-hero { margin: 0 !important; }
.bk-header + .bk-hero, .bk-header + script + .bk-hero { margin-top: -1px !important; }

.bk-container { max-width: var(--bk-container); margin: 0 auto; padding: 0 16px; }
.bk-section { padding: 56px 0; }
@media (max-width: 767px) { .bk-section { padding: 40px 0; } }
.bk-section-title { font-size: 24px; font-weight: 700; color: var(--bk-text); margin: 0 0 8px; letter-spacing: -0.3px; }
.bk-section-sub { font-size: 14px; color: var(--bk-cta); margin: 0 0 28px; }

/* Buttons */
.bk-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-family: var(--bk-font); font-weight: 700; font-size: 14px; line-height: 1; padding: 12px 16px; border-radius: var(--bk-radius-sm); border: 1px solid transparent; cursor: pointer; text-decoration: none; transition: background 0.15s, color 0.15s, border-color 0.15s; white-space: nowrap; }
.bk-btn-primary { background: var(--bk-cta); color: #FFFFFF; border-color: var(--bk-cta); }
.bk-btn-primary:hover { background: var(--bk-cta-hover); color: #FFFFFF; border-color: var(--bk-cta-hover); }
.bk-btn-search { background: var(--bk-cta); color: #FFFFFF; font-size: 16px; padding: 0 24px; height: 56px; }
.bk-btn-search:hover { background: var(--bk-cta-hover); color: #FFFFFF; }
.bk-btn-ghost { background: #FFFFFF; color: var(--bk-cta); border-color: #FFFFFF; }
.bk-btn-ghost:hover { background: var(--bk-bg-tint); color: var(--bk-cta); }
.bk-btn-outline-light { background: transparent; color: #FFFFFF; border-color: #FFFFFF; }
.bk-btn-outline-light:hover { background: rgba(255,255,255,0.1); color: #FFFFFF; }

/* ============================================================ HEADER ============================================================ */
.bk-signin-btn { background: #FFFFFF; color: var(--bk-text) !important; padding: 10px 18px; border-radius: 999px; font-weight: 700; font-size: 14px; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; border: 0; transition: background 0.15s; }
.bk-signin-btn:hover { background: #F2EFE7; }
.bk-wa-btn { background: linear-gradient(180deg, #25D366 0%, #128C7E 100%); color: #FFFFFF !important; padding: 10px 18px; border-radius: 999px; font-weight: 700; font-size: 14px; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; box-shadow: 0 4px 12px rgba(18,140,126,0.35); transition: filter 0.15s, transform 0.15s; }
.bk-wa-btn:hover { filter: brightness(1.06); transform: translateY(-1px); color: #FFFFFF; }
.bk-wa-icon { width: 24px; height: 24px; border-radius: 50%; background: rgba(255,255,255,0.18); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }

.bk-header { background: var(--bk-primary); color: #FFFFFF; position: relative; z-index: 100; }
.bk-header a { color: #FFFFFF; text-decoration: none; }
.bk-header-top { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; gap: 12px; }
.bk-logo { display: inline-flex; align-items: center; gap: 8px; }
.bk-logo img {
    height: 48px; max-height: 48px;       /* fits the new Shateeta logo (green wordmark) */
    width: auto; max-width: 200px;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode: bicubic;
    transform: translateZ(0);             /* triggers GPU pixel snapping */
    backface-visibility: hidden;
}
.bk-logo-text { font-size: 24px; font-weight: 800; color: #FFFFFF; letter-spacing: -0.5px; line-height: 1; }
.bk-header-actions { display: flex; align-items: center; gap: 12px; }

.bk-tabs { display: flex; gap: 18px; overflow-x: auto; padding: 6px 0 18px; scrollbar-width: none; }
.bk-tabs::-webkit-scrollbar { display: none; }
.bk-tab { display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px; border-radius: 999px; color: #FFFFFF; font-size: 15px; font-weight: 600; white-space: nowrap; border: 1.5px solid transparent; transition: border-color 0.15s, background 0.15s; }
.bk-tab:hover { background: rgba(255,255,255,0.08); color: #FFFFFF; }
.bk-tab.is-active { border-color: #FFFFFF; background: transparent; }
.bk-tab i { font-size: 17px; }

/* ============================================================ HERO ============================================================ */
.bk-hero { background: var(--bk-primary); padding: 16px 0 64px; color: #FFFFFF; }
.bk-hero--curve { padding-bottom: 200px; -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 140px), 50% 100%, 0 calc(100% - 140px)); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 140px), 50% 100%, 0 calc(100% - 140px)); }
@media (max-width: 575px) { .bk-hero--curve { padding-bottom: 110px; -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 50px), 50% 100%, 0 calc(100% - 50px)); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 50px), 50% 100%, 0 calc(100% - 50px)); } }
.bk-hero-inner { padding-top: 8px; }
.bk-hero-title { font-size: 40px; font-weight: 800; line-height: 1.1; margin: 0 0 8px; letter-spacing: -1px; color: #FFFFFF; }
.bk-hero-sub { font-size: 20px; font-weight: 500; color: rgba(255,255,255,0.92); margin: 0 0 24px; }

.bk-search { background: transparent; border: 0; border-radius: 0; padding: 0; display: grid; grid-template-columns: 2fr 1.3fr 1.3fr auto; gap: 12px; margin-top: 24px; position: relative; }
.bk-search-field { background: #FFFFFF; border: 1px solid transparent; border-radius: 6px; padding: 0 16px; display: flex; align-items: center; gap: 12px; min-height: 64px; cursor: pointer; position: relative; box-shadow: 0 2px 8px rgba(0,0,0,0.10); }
.bk-search-field i.bk-icon { color: var(--bk-text-muted); font-size: 18px; flex-shrink: 0; }
.bk-search-field input, .bk-search-field select { border: 0; outline: 0; width: 100%; height: 100%; font-size: 15px; font-weight: 600; color: var(--bk-text); background: transparent; padding: 0; box-shadow: none; appearance: none; -webkit-appearance: none; }
.bk-search-field input::placeholder { color: var(--bk-text-muted); font-weight: 500; }
.bk-search-field .bk-field-label { font-size: 11px; font-weight: 700; color: var(--bk-text-muted); text-transform: uppercase; letter-spacing: 0.3px; display: block; line-height: 1; margin-bottom: 2px; }
.bk-search-field .bk-field-body { flex: 1; min-width: 0; }
.bk-search .bk-btn-search { width: 100%; min-width: 130px; height: 64px; align-self: stretch; font-size: 16px; font-weight: 700; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.10); }
.bk-dropdown-panel { position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: #FFFFFF; border-radius: var(--bk-radius); box-shadow: var(--bk-shadow-lg); z-index: 50; max-height: 260px; overflow-y: auto; padding: 4px 0; display: none; }
.bk-dropdown-panel.is-open { display: block; }
.bk-dropdown-panel ul { list-style: none; margin: 0; padding: 0; }
.bk-dropdown-panel li { padding: 10px 16px; cursor: pointer; font-size: 14px; color: var(--bk-text); }
.bk-dropdown-panel li:hover { background: var(--bk-bg-tint); }

@media (max-width: 991px) {
    .bk-search { grid-template-columns: 1fr 1fr; }
    .bk-search .bk-btn-search { grid-column: 1 / -1; height: 48px; }
    .bk-hero-title { font-size: 30px; }
    .bk-hero-sub { font-size: 16px; }
}
@media (max-width: 575px) { .bk-search { grid-template-columns: 1fr; } }

/* ============================================================ FEATURED TOURS slider ============================================================ */
.bk-fts { padding: 0 0 48px; margin-top: -160px; position: relative; z-index: 6; }
.bk-fts-card { position: relative; background: #FFFFFF; border: 3px solid var(--bk-primary); border-radius: 18px; padding: 14px; padding-right: 64px; box-shadow: 0 18px 40px rgba(31, 77, 58,0.12); display: flex; align-items: stretch; gap: 14px; min-height: 180px; }
.bk-fts-stage { flex: 1 1 auto; display: flex; min-width: 0; }
.bk-fts-slide { display: none; flex: 1 1 auto; gap: 18px; align-items: stretch; min-width: 0; animation: bkFtsFade 0.35s ease; }
.bk-fts-slide.is-active { display: flex; }
@keyframes bkFtsFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.bk-fts-slide-img { flex: 0 0 200px; aspect-ratio: 4/3; border-radius: 12px; overflow: hidden; background: var(--bk-bg-soft); align-self: center; }
.bk-fts-slide-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-fts-slide-info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.bk-fts-tags { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.bk-fts-tag { display: inline-block; background: var(--bk-cta); color: #FFFFFF; padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 700; letter-spacing: 0.4px; }
.bk-fts-tag.--price { background: var(--bk-primary); }
.bk-fts-excerpt { margin: 0; font-size: 15px; line-height: 1.45; color: var(--bk-text); font-weight: 600; max-width: 360px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bk-fts-link { color: var(--bk-cta); font-size: 13px; font-weight: 700; text-decoration: none; }
.bk-fts-thumbs { flex: 0 0 auto; display: flex; gap: 10px; align-items: center; overflow: hidden; max-width: 50%; }
.bk-fts-thumb { width: 110px; height: 110px; border-radius: 12px; overflow: hidden; background: var(--bk-bg-soft); border: 3px solid transparent; cursor: pointer; padding: 0; flex-shrink: 0; transition: border-color 0.15s; }
.bk-fts-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-fts-thumb.is-active, .bk-fts-thumb:hover { border-color: var(--bk-cta); }
.bk-fts-arrows { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 10px; z-index: 2; }
.bk-fts-arrow { width: 36px; height: 36px; border-radius: 50%; background: #FFFFFF; border: 2px solid var(--bk-primary); color: var(--bk-primary); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-size: 14px; transition: background 0.15s, color 0.15s; }
.bk-fts-arrow:hover { background: var(--bk-primary); color: #FFFFFF; }
@media (max-width: 1199px) { .bk-fts-thumb { width: 88px; height: 88px; } }
@media (max-width: 991px) { .bk-fts-thumbs { display: none; } .bk-fts { margin-top: -90px; } }
@media (max-width: 575px) { .bk-fts-card { flex-direction: column; padding-right: 14px; min-height: 0; } .bk-fts-slide { flex-direction: column; } .bk-fts-slide-img { flex-basis: auto; width: 100%; aspect-ratio: 16/9; } .bk-fts-arrows { position: static; transform: none; flex-direction: row; justify-content: flex-end; margin-top: 8px; } .bk-fts { margin-top: -50px; } }

/* ============================================================ WHY BOOKING ============================================================ */
.bk-why { padding: 56px 0; }
@media (max-width: 767px) { .bk-why { padding: 40px 0; } }
.bk-why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
@media (max-width: 991px) { .bk-why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .bk-why-grid { grid-template-columns: 1fr; } }
.bk-why-card { background: #F2EFE7; border-radius: var(--bk-radius); padding: 14px 14px 16px; display: flex; gap: 12px; align-items: flex-start; }
.bk-why-card-illus { flex-shrink: 0; width: 40px; height: 40px; border-radius: 8px; background: #FFFFFF; display: inline-flex; align-items: center; justify-content: center; font-size: 20px; }
.bk-why-card-illus.--blue { color: var(--bk-cta); }
.bk-why-card-illus.--yellow { color: #D4A85A; background: #F5EAD0; }
.bk-why-card-illus.--green { color: #1F4D3A; background: #E8F0EC; }
.bk-why-card-illus.--orange { color: #A05A2C; background: #F5EAD0; }
.bk-why-card h5 { font-size: 14px; font-weight: 700; margin: 0 0 4px; color: var(--bk-text); }
.bk-why-card p { font-size: 12px; color: var(--bk-text-muted); margin: 0; line-height: 1.4; }

/* ============================================================ POPULAR DESTINATIONS ============================================================ */
.bk-popdest { padding: 64px 0; background: #F5F1E8; }
@media (max-width: 767px) { .bk-popdest { padding: 40px 0; } }
.bk-popdest-row { display: grid; grid-template-columns: 280px 1fr; gap: 32px; align-items: center; }
.bk-popdest-intro { padding-right: 12px; }
.bk-popdest-eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 2px; color: var(--bk-cta); text-transform: uppercase; margin: 0 0 12px; }
.bk-popdest-title { font-family: Georgia, "Times New Roman", serif; font-size: 44px; line-height: 1.1; font-weight: 400; color: var(--bk-text); margin: 0 0 16px; }
.bk-popdest-text { font-size: 14px; color: var(--bk-text-muted); margin: 0 0 22px; line-height: 1.55; max-width: 280px; }
.bk-popdest-btn { display: inline-flex; align-items: center; gap: 10px; border: 1px solid var(--bk-border-strong); background: transparent; color: var(--bk-text); font-size: 11px; font-weight: 700; letter-spacing: 2px; padding: 12px 22px; border-radius: 2px; text-decoration: none; text-transform: uppercase; transition: background 0.15s, color 0.15s; }
.bk-popdest-btn:hover { background: var(--bk-text); color: #FFFFFF; }
.bk-popdest-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.bk-popdest-card { position: relative; aspect-ratio: 3/4; border-radius: var(--bk-radius); overflow: hidden; display: block; text-decoration: none; color: #FFFFFF; }
.bk-popdest-card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
.bk-popdest-card:hover img { transform: scale(1.05); }
.bk-popdest-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 50%, rgba(0,0,0,0.78) 100%); pointer-events: none; }
.bk-popdest-card-body { position: absolute; bottom: 16px; left: 16px; right: 16px; z-index: 1; color: #FFFFFF; }
.bk-popdest-card-title { font-size: 18px; font-weight: 700; margin: 0 0 4px; color: #FFFFFF; text-shadow: 0 2px 6px rgba(0,0,0,0.4); }
.bk-popdest-card-price { font-size: 13px; color: rgba(255,255,255,0.92); margin: 0; text-shadow: 0 1px 4px rgba(0,0,0,0.4); }
@media (max-width: 991px) { .bk-popdest-row { grid-template-columns: 1fr; } .bk-popdest-text { max-width: none; } .bk-popdest-title { font-size: 36px; } }
@media (max-width: 575px) { .bk-popdest-cards { grid-template-columns: 1fr 1fr; } .bk-popdest-card:nth-child(3) { grid-column: 1 / -1; aspect-ratio: 16 / 9; } }

/* ============================================================ HOME GRIDS / TILES / CARDS ============================================================ */
.bk-grid { display: grid; gap: 12px; }
.bk-grid-4 { grid-template-columns: repeat(4, 1fr); }
.bk-grid-3 { grid-template-columns: repeat(3, 1fr); }
.bk-grid-2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 991px) { .bk-grid-4 { grid-template-columns: repeat(2, 1fr); } .bk-grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .bk-grid-4, .bk-grid-3, .bk-grid-2 { grid-template-columns: 1fr; } }

.bk-tile { display: block; background: #FFFFFF; border-radius: var(--bk-radius); overflow: hidden; text-decoration: none; color: var(--bk-text); transition: box-shadow 0.15s; border: 1px solid var(--bk-border); }
.bk-tile:hover { box-shadow: var(--bk-shadow-md); color: var(--bk-text); }
.bk-tile-media { aspect-ratio: 1/1; width: 100%; background: var(--bk-bg-soft); overflow: hidden; }
.bk-tile-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-tile-body { padding: 10px 12px 14px; }
.bk-tile-title { font-size: 16px; font-weight: 700; margin: 0; color: var(--bk-text); }

.bk-card { background: #FFFFFF; border-radius: var(--bk-radius); overflow: hidden; border: 1px solid var(--bk-border); display: flex; flex-direction: column; transition: box-shadow 0.15s; height: 100%; text-decoration: none; color: var(--bk-text); }
.bk-card:hover { box-shadow: var(--bk-shadow-md); color: var(--bk-text); }
.bk-card-media { aspect-ratio: 4/3; background: var(--bk-bg-soft); overflow: hidden; position: relative; }
.bk-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-card-fav { position: absolute; top: 8px; right: 8px; width: 30px; height: 30px; background: rgba(255,255,255,0.92); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--bk-text); border: 0; cursor: pointer; box-shadow: var(--bk-shadow-sm); }
.bk-card-body { padding: 12px 14px 14px; flex: 1; display: flex; flex-direction: column; gap: 6px; }
.bk-card-title { font-size: 16px; font-weight: 700; color: var(--bk-text); margin: 0; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bk-card-location { font-size: 13px; color: var(--bk-cta); margin: 0; }
.bk-card-foot { margin-top: auto; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.bk-card-price { font-size: 18px; font-weight: 800; color: var(--bk-text); }
.bk-card-price small { font-size: 12px; color: var(--bk-text-muted); font-weight: 500; }
.bk-card-price-strike { color: #C00; text-decoration: line-through; font-weight: 500; font-size: 13px; margin-right: 6px; }
.bk-card-stars { color: #D4A85A; font-size: 12px; letter-spacing: 1px; }
.bk-card-badge { position: absolute; top: 8px; left: 8px; background: var(--bk-primary); color: #FFFFFF; font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 4px; }

/* Destination overlay tiles */
.bk-dest { position: relative; aspect-ratio: 16/9; border-radius: var(--bk-radius); overflow: hidden; display: block; text-decoration: none; }
.bk-dest img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.3s; }
.bk-dest:hover img { transform: scale(1.04); }
.bk-dest-label { position: absolute; top: 12px; left: 12px; color: #FFFFFF; font-weight: 800; font-size: 22px; text-shadow: 0 2px 8px rgba(0,0,0,0.5); display: inline-flex; align-items: center; gap: 8px; }
.bk-trending { padding: 56px 0; }
@media (max-width: 767px) { .bk-trending { padding: 40px 0; } }
.bk-trending-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bk-trending-grid.--row2 { grid-template-columns: 1fr 1fr 1fr; margin-top: 12px; }
@media (max-width: 767px) { .bk-trending-grid, .bk-trending-grid.--row2 { grid-template-columns: 1fr; } }
.bk-dest-tall { aspect-ratio: 16/8; }
.bk-dest-short { aspect-ratio: 16/9; }

/* Stays view-all + hotel rating */
.bk-stays-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
.bk-stays-title { margin: 0 0 14px; }
.bk-stays-sub { margin: 0; }
.bk-view-all-link { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--bk-border); background: #FFFFFF; color: var(--bk-text); font-size: 13px; font-weight: 700; text-decoration: none; transition: background 0.15s, color 0.15s, border-color 0.15s; flex-shrink: 0; line-height: 1; }
.bk-view-all-link i { font-size: 11px; transition: transform 0.15s; }
.bk-view-all-link:hover { background: var(--bk-cta); border-color: var(--bk-cta); color: #FFFFFF; }
.bk-view-all-link:hover i { transform: translateX(3px); }
.bk-view-all-center { margin-top: 16px; }

.bk-hotel-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 4px; }
.bk-hotel-name { font-size: 16px; font-weight: 800; color: var(--bk-text); margin: 0; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 42px; }
.bk-hotel-loc { font-size: 14px; color: var(--bk-text-muted); margin: 0 0 4px; }
.bk-hotel-rate { margin: 0 0 6px; font-size: 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; line-height: 1.3; }
.bk-hotel-rate-score { color: #7A4B27; font-weight: 700; }
.bk-hotel-rate-sep { color: var(--bk-text-muted); font-weight: 700; }
.bk-hotel-rate-count { color: var(--bk-text-muted); }
.bk-hotel-price { margin: 0; font-size: 16px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.bk-hotel-price-from { color: var(--bk-text); font-weight: 500; }
.bk-hotel-price-strike { color: #C00; text-decoration: line-through; font-weight: 500; font-size: 14px; }
.bk-hotel-price-value { color: var(--bk-text); font-weight: 800; font-size: 18px; }
.bk-hotel-price-unit { color: var(--bk-text-muted); font-weight: 500; font-size: 14px; }

/* ============================================================ KASHMIR TOUR PACKAGES ============================================================ */
.bk-ktp-section { padding: 64px 0; background: #FFFFFF; }
@media (max-width: 767px) { .bk-ktp-section { padding: 40px 0; } }
.bk-ktp-head { text-align: center; margin-bottom: 32px; }
.bk-ktp-head h1 { font-size: 36px; font-weight: 800; color: var(--bk-text); margin: 0 0 6px; letter-spacing: -0.6px; }
.bk-ktp-head p { font-size: 15px; color: var(--bk-text-muted); margin: 0; }
.bk-ktp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 1199px) { .bk-ktp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .bk-ktp-grid { grid-template-columns: 1fr; } }

/* Horizontal slider (replaces .bk-ktp-grid where present) */
.bk-ktp-stage { position: relative; }
.bk-ktp-track {
    display: flex;
    flex-wrap: nowrap;
    gap: 22px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 4px 4px 12px;
    margin: 0 -4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.bk-ktp-track::-webkit-scrollbar { display: none; }
.bk-ktp-track > .bk-ktp-card {
    flex: 0 0 calc((100% - 44px) / 3);
    min-width: 0;
    scroll-snap-align: start;
}
@media (max-width: 1199px) {
    .bk-ktp-track > .bk-ktp-card { flex-basis: calc((100% - 22px) / 2); }
}
@media (max-width: 767px) {
    .bk-ktp-track { gap: 14px; padding: 4px 12px 14px; margin: 0 -12px; }
    .bk-ktp-track > .bk-ktp-card { flex-basis: 82%; max-width: 320px; }
}

/* Slider arrows */
.bk-ktp-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(31,77,58,0.18);
    background: #FFFFFF;
    color: var(--bk-text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(31,77,58,0.18);
    z-index: 5;
    transition: background 0.15s, color 0.15s, transform 0.15s;
}
.bk-ktp-arrow:hover { background: #1F4D3A; color: #FFFFFF; transform: translateY(-50%) scale(1.05); }
.bk-ktp-arrow--prev { left: -18px; }
.bk-ktp-arrow--next { right: -18px; }
@media (max-width: 991px) {
    .bk-ktp-arrow { width: 38px; height: 38px; box-shadow: 0 4px 12px rgba(31,77,58,0.16); }
    .bk-ktp-arrow--prev { left: 0; }
    .bk-ktp-arrow--next { right: 0; }
}
@media (max-width: 575px) {
    .bk-ktp-arrow { display: none; }
}

/* ============================================================
   RESPONSIVE POLISH — recent additions (mobile + tablet)
   Applied to Kashmir package cards, vehicles slider, trip planner,
   and other home sections so admin-driven content stays readable.
   ============================================================ */

/* Kashmir package card internals on smaller screens */
@media (max-width: 991px) {
    .bk-ktp-head h1 { font-size: 28px; }
    .bk-ktp-head p { font-size: 13px; }
    .bk-ktp-media { aspect-ratio: 16/10; }
    .bk-ktp-chip { font-size: 11px; padding: 4px 9px; }
    .bk-ktp-inc-list li { font-size: 12.5px; }
}
@media (max-width: 575px) {
    .bk-ktp-head h1 { font-size: 22px; }
    .bk-ktp-head p { font-size: 12.5px; }
    .bk-ktp-title { font-size: 16px; }
    .bk-ktp-chips { gap: 5px; }
    .bk-ktp-chip { font-size: 10.5px; padding: 4px 8px; }
    .bk-ktp-starting-value { font-size: 18px; }
    .bk-ktp-body { padding: 14px 14px 16px; gap: 8px; }
}

/* Vehicles slider — make arrows easier to tap on tablets */
@media (max-width: 991px) {
    .bk-vehicles-head h2 { font-size: 22px; }
    .bk-vehicle-title { font-size: 15px; }
    .bk-arrow-btn { width: 38px; height: 38px; }
}
@media (max-width: 575px) {
    .bk-vehicles-head { flex-direction: column; align-items: flex-start; gap: 6px; }
    .bk-vehicles-arrows { display: none; } /* swipe to scroll on phones */
}

/* Trip planner — tighter spacing on small screens */
@media (max-width: 767px) {
    .bk-planner-card h6 { font-size: 13px; }
    .bk-planner-card span { font-size: 11px; }
    .bk-chips { gap: 6px; }
    .bk-chip { padding: 7px 12px; font-size: 12px; }
}

/* Trending destinations — full-width image tiles on phones */
@media (max-width: 575px) {
    .bk-dest-label { font-size: 18px; }
    .bk-dest-tall, .bk-dest-short { aspect-ratio: 16/10; }
}

/* Featured Stays grid (homepage "Beautiful Stays...") — match Kashmir card sizing on tablet/mobile */
@media (max-width: 991px) {
    .bk-stays-title { font-size: 22px; }
    .bk-stays-sub { font-size: 13px; }
    .bk-stays-head { flex-direction: column; align-items: flex-start; gap: 6px; }
    .bk-stays-head .bk-view-all-link { align-self: flex-end; }
}

/* Header tab nav scrolls horizontally instead of wrapping on phones */
@media (max-width: 575px) {
    .bk-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 8px; }
    .bk-tabs::-webkit-scrollbar { display: none; }
    .bk-tab { white-space: nowrap; flex-shrink: 0; font-size: 12px; padding: 8px 12px; }
    .bk-header-actions { gap: 4px; }
    .bk-header-actions .bk-link { padding: 6px 8px; font-size: 12px; }
    .bk-header-actions .bk-btn { padding: 6px 10px; font-size: 12px; }
}

/* WhatsApp floating button — keep clear of mobile chrome */
@media (max-width: 575px) {
    .whatsapp-icon { bottom: 14px; right: 14px; width: 48px; height: 48px; }
}

.bk-ktp-card { background: linear-gradient(180deg, #F8F5EF 0%, #F8F5EF 100%); border: 1px solid #E5E0D5; border-radius: 18px; box-shadow: 0 4px 14px rgba(31, 77, 58,0.05); overflow: hidden; display: flex; flex-direction: column; position: relative; text-decoration: none; color: var(--bk-text); transition: box-shadow 0.18s, transform 0.18s; }
.bk-ktp-card:hover { color: var(--bk-text); box-shadow: 0 10px 28px rgba(31, 77, 58,0.10); transform: translateY(-2px); }
.bk-ktp-media { position: relative; aspect-ratio: 16/10; overflow: hidden; background: var(--bk-bg-soft); margin: 14px 14px 0; border-radius: 16px; }
.bk-ktp-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-ktp-trend { position: absolute; top: 14px; left: 14px; background: #222222; color: #FFFFFF; padding: 7px 14px; border-radius: 999px; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px; }
.bk-ktp-trend i { color: #D4A85A; }
.bk-ktp-nights { position: absolute; top: 14px; right: 14px; background: #FFFFFF; color: var(--bk-text); padding: 7px 12px; border-radius: 10px; font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; gap: 8px; }
.bk-ktp-nights i { color: var(--bk-cta); }
.bk-ktp-body { padding: 16px 18px 20px; display: flex; flex-direction: column; gap: 12px; }
.bk-ktp-title { font-size: 16px; font-weight: 800; color: var(--bk-text); margin: 0; line-height: 1.3; }
.bk-ktp-locs { font-size: 13px; color: var(--bk-cta); margin: 0; display: inline-flex; align-items: center; gap: 5px; font-weight: 500; }
.bk-ktp-locs i { color: var(--bk-cta); font-size: 12px; }
.bk-ktp-block-title { font-size: 14px; font-weight: 800; color: var(--bk-text); margin: 4px 0 8px; }
.bk-ktp-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 4px 0 8px;
}
.bk-ktp-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    background: #FFFFFF;
    border: 1px solid #D6D2C4;
    border-radius: 999px;
    color: #1F4D3A;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}
.bk-ktp-chip i {
    color: #1F4D3A;
    font-size: 10px;
}
.bk-ktp-inc-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.bk-ktp-inc-list li { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--bk-text); }
.bk-ktp-inc-list li i { color: rgba(31, 77, 58,0.55); font-size: 16px; flex-shrink: 0; }
.bk-ktp-inc-list li.bk-ktp-more { color: var(--bk-cta); font-weight: 600; font-size: 12px; }
.bk-ktp-inc-list li.bk-ktp-more i { color: var(--bk-cta); font-size: 11px; }
.bk-ktp-price-block { margin-top: 4px; padding-top: 12px; border-top: 1px solid #E5E0D5; }
.bk-ktp-starting-label { font-size: 12px; color: var(--bk-text-muted); margin: 0 0 4px; }
.bk-ktp-starting-value { display: inline-flex; align-items: baseline; gap: 6px; font-size: 22px; font-weight: 800; color: var(--bk-cta); line-height: 1.1; }
.bk-ktp-starting-value small { color: var(--bk-text-muted); font-weight: 600; font-size: 12px; }

/* ============================================================ TRIP PLANNER ============================================================ */
.bk-planner { padding: 56px 0; }
@media (max-width: 767px) { .bk-planner { padding: 40px 0; } }
.bk-planner-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.bk-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.bk-chip { border: 1px solid var(--bk-border-strong); background: #FFFFFF; color: var(--bk-cta); font-size: 13px; font-weight: 600; padding: 8px 14px; border-radius: 999px; cursor: pointer; text-decoration: none; transition: background 0.15s, border-color 0.15s; }
.bk-chip:hover, .bk-chip.is-active { background: var(--bk-bg-tint); border-color: var(--bk-cta); color: var(--bk-cta); }
.bk-planner-panel { display: none; }
.bk-planner-panel.is-active { display: block; }
.bk-planner-track { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding-bottom: 6px; scrollbar-width: none; }
.bk-planner-track::-webkit-scrollbar { display: none; }
.bk-planner-card { flex: 0 0 calc((100% - 70px) / 6); min-width: 0; scroll-snap-align: start; display: block; text-decoration: none; color: var(--bk-text); }
@media (max-width: 991px) { .bk-planner-card { flex-basis: calc((100% - 28px) / 3); } }
@media (max-width: 575px) { .bk-planner-card { flex-basis: calc((100% - 14px) / 2); } }
.bk-planner-thumb { width: 100%; aspect-ratio: 1/1; border-radius: var(--bk-radius); overflow: hidden; background: var(--bk-bg-soft); }
.bk-planner-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.3s; }
.bk-planner-card:hover .bk-planner-thumb img { transform: scale(1.04); }
.bk-planner-card h6 { font-size: 14px; font-weight: 700; margin: 8px 0 2px; color: var(--bk-text); }
.bk-planner-card span { font-size: 12px; color: var(--bk-text-muted); }

/* ============================================================ VEHICLES ============================================================ */
.bk-vehicles { padding: 56px 0; }
@media (max-width: 767px) { .bk-vehicles { padding: 40px 0; } }
.bk-vehicles-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 6px; }
.bk-vehicles-head h2 { font-size: 28px; font-weight: 800; color: var(--bk-text); margin: 0; letter-spacing: -0.4px; }
.bk-view-all { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--bk-text); text-decoration: none; padding: 4px 6px; }
.bk-view-all:hover { color: var(--bk-cta); }
.bk-vehicles-stage { position: relative; }
.bk-vehicles-track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding-bottom: 8px; scrollbar-width: none; }
.bk-vehicles-track::-webkit-scrollbar { display: none; }
.bk-vehicle-card { flex: 0 0 calc((100% - 48px) / 4); min-width: 0; scroll-snap-align: start; background: #FFFFFF; border: 1px solid var(--bk-border); border-radius: 14px; display: flex; flex-direction: column; text-decoration: none; color: var(--bk-text); transition: box-shadow 0.15s, transform 0.15s; position: relative; }
.bk-vehicle-card:hover { box-shadow: var(--bk-shadow-md); color: var(--bk-text); }
.bk-vehicle-media { aspect-ratio: 16/11; background: var(--bk-bg-soft); position: relative; border-radius: 14px 14px 0 0; }
.bk-vehicle-media > img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 14px 14px 0 0; }
.bk-vehicle-badge { position: absolute; top: 10px; left: 10px; background: #5E8B7E; color: #FFFFFF; font-size: 11px; font-weight: 700; padding: 5px 10px; border-radius: 4px; }
.bk-vehicle-badge.--blue { background: var(--bk-cta); }
.bk-vehicle-off { position: absolute; bottom: -22px; right: 18px; background: var(--bk-cta); color: #FFFFFF; border-radius: 50%; width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; box-shadow: 0 4px 12px rgba(31, 77, 58,0.35); letter-spacing: -0.3px; border: 3px solid #FFFFFF; z-index: 2; }
.bk-vehicle-save { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; background: rgba(255,255,255,0.92); border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; border: 0; color: var(--bk-text); cursor: pointer; box-shadow: var(--bk-shadow-sm); }
.bk-vehicle-body { padding: 14px 16px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.bk-vehicle-title { font-size: 16px; font-weight: 700; margin: 0; color: var(--bk-text); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.bk-vehicle-sub { font-size: 12px; color: var(--bk-text-muted); margin: 0; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.bk-vehicle-specs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; background: transparent; padding: 8px 4px 0; margin-top: 2px; }
.bk-vehicle-spec { background: transparent; border: 0; padding: 2px 2px; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; transition: background 0.15s; border-radius: 8px; position: relative; }
.bk-vehicle-spec:hover { background: rgba(31, 77, 58,0.04); }
.bk-vehicle-spec i { font-size: 26px; color: var(--bk-text); line-height: 1; }
.bk-vsvg { width: 28px; height: 28px; color: var(--bk-text); flex-shrink: 0; }
.bk-vehicle-spec-val { font-weight: 700; font-size: 14px; color: #7A4B27; letter-spacing: -0.1px; }
.bk-vehicle-spec-label { display: none; font-size: 11px; color: var(--bk-cta); font-weight: 700; letter-spacing: 0.3px; text-transform: uppercase; }
.bk-vehicle-spec.is-active .bk-vehicle-spec-val { display: none; }
.bk-vehicle-spec.is-active .bk-vehicle-spec-label { display: inline; }
.bk-vehicle-sep { border: 0; border-top: 1px solid var(--bk-border); margin: 4px 0 4px; }
.bk-vehicle-price-row { margin: 2px 0 0; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.bk-vehicle-from { color: var(--bk-text); font-weight: 500; font-size: 14px; }
.bk-vehicle-strike { color: #C00; text-decoration: line-through; font-size: 14px; font-weight: 500; }
.bk-vehicle-now { color: var(--bk-text); font-weight: 800; font-size: 18px; }
.bk-vehicle-unit { color: var(--bk-text-muted); font-size: 13px; font-weight: 500; }
.bk-vehicles-arrows { display: flex; gap: 10px; margin-top: 14px; }
.bk-arrow-btn { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--bk-border-strong); background: #FFFFFF; color: var(--bk-text); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.15s, border-color 0.15s, color 0.15s; }
.bk-arrow-btn:hover { background: var(--bk-cta); border-color: var(--bk-cta); color: #FFFFFF; }
@media (max-width: 1199px) { .bk-vehicle-card { flex-basis: calc((100% - 32px) / 3); } }
@media (max-width: 767px) { .bk-vehicle-card { flex-basis: calc((100% - 16px) / 2); } }
@media (max-width: 480px) { .bk-vehicle-card { flex-basis: 80%; } }

/* ============================================================ STORIES ============================================================ */
.bk-stories { padding: 48px 24px; background: #F2EFE7; border-radius: var(--bk-radius-lg); margin: 32px 0; }
@media (max-width: 767px) { .bk-stories { padding: 32px 16px; margin: 24px 0; } }
.bk-stories-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; padding: 0 8px; }
.bk-stories-head h2 { font-size: 26px; font-weight: 800; color: var(--bk-text); margin: 0; }
.bk-stories-sub { color: var(--bk-text-muted); font-size: 14px; margin: 4px 0 0; }
.bk-read-more { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--bk-border-strong); background: #FFFFFF; color: var(--bk-text); padding: 8px 16px; border-radius: 999px; font-size: 13px; font-weight: 600; text-decoration: none; }
.bk-read-more:hover { background: var(--bk-text); color: #FFFFFF; border-color: var(--bk-text); }
.bk-stories-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 28px; padding: 0 8px; }
@media (max-width: 991px) { .bk-stories-grid { grid-template-columns: 1fr; } }
.bk-story-feat { display: block; text-decoration: none; color: var(--bk-text); }
.bk-story-feat-media { width: 100%; aspect-ratio: 4/3; border-radius: var(--bk-radius); overflow: hidden; background: var(--bk-bg-soft); }
.bk-story-feat-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-story-cat { display: inline-block; font-size: 11px; color: var(--bk-text-muted); margin: 14px 0 6px; }
.bk-story-title { font-size: 22px; font-weight: 700; color: var(--bk-text); margin: 0 0 8px; line-height: 1.3; }
.bk-story-meta { font-size: 12px; color: var(--bk-text-muted); margin: 0 0 8px; }
.bk-story-excerpt { font-size: 14px; color: var(--bk-text-muted); line-height: 1.55; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bk-story-list { display: flex; flex-direction: column; gap: 18px; }
.bk-story-item { display: grid; grid-template-columns: 120px 1fr; gap: 14px; align-items: center; text-decoration: none; color: var(--bk-text); }
.bk-story-item-media { width: 100%; aspect-ratio: 4/3; border-radius: var(--bk-radius); overflow: hidden; background: var(--bk-bg-soft); }
.bk-story-item-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-story-item-body { display: flex; flex-direction: column; gap: 4px; }
.bk-story-item-cat { font-size: 11px; color: var(--bk-text-muted); font-weight: 500; }
.bk-story-item-title { font-size: 15px; font-weight: 700; color: var(--bk-text); margin: 0; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bk-story-item-meta { font-size: 11px; color: var(--bk-text-muted); }

/* ============================================================ REVIEWS ============================================================ */
.bk-reviews { padding: 56px 0; text-align: left; }
@media (max-width: 767px) { .bk-reviews { padding: 40px 0; } }
.bk-reviews-head { text-align: center; margin-bottom: 36px; }
.bk-reviews-head h2 { font-size: 44px; font-weight: 700; color: var(--bk-text); margin: 0 0 6px; letter-spacing: -0.5px; }
.bk-reviews-head p { font-size: 16px; color: var(--bk-text-muted); margin: 0; }
.bk-reviews-row { display: grid; grid-template-columns: 220px 1fr; gap: 24px; align-items: stretch; }
@media (max-width: 767px) { .bk-reviews-row { grid-template-columns: 1fr; } }
.bk-reviews-brand { background: #FFFFFF; border: 1px solid var(--bk-border); border-radius: var(--bk-radius); padding: 22px 18px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; }
.bk-reviews-brand-logo { max-width: 180px; min-height: 70px; padding: 10px 16px; background: #1F4D3A; border: 1px solid #1F4D3A; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 6px 14px rgba(31,77,58,0.18); }
.bk-reviews-brand-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.bk-reviews-brand-name { font-size: 13px; font-weight: 700; color: var(--bk-text); margin: 0; }
.bk-reviews-brand-badge { display: flex; flex-direction: column; align-items: center; gap: 4px; padding-top: 4px; width: 100%; border-top: 1px solid var(--bk-border); }
.bk-reviews-brand-badge .--gtitle { font-size: 22px; font-weight: 700; background: linear-gradient(90deg, #4285F4 0%, #4285F4 25%, #DB4437 25% 50%, #F4B400 50% 75%, #0F9D58 75% 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.bk-reviews-brand-stars { color: #D4A85A; font-size: 12px; letter-spacing: 2px; }
.bk-reviews-brand-tag { font-size: 10px; font-weight: 700; letter-spacing: 2px; color: var(--bk-text-muted); text-transform: uppercase; }
.bk-reviews-stage { position: relative; min-width: 0; }
.bk-reviews-track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding-bottom: 8px; scrollbar-width: none; }
.bk-reviews-track::-webkit-scrollbar { display: none; }
.bk-review-card { position: relative; flex: 0 0 calc((100% - 32px) / 3); min-width: 0; scroll-snap-align: start; background: #FFFFFF; border: 1px solid var(--bk-border); border-radius: var(--bk-radius); box-shadow: var(--bk-shadow-sm); padding: 18px 20px 20px 22px; display: flex; flex-direction: column; gap: 8px; }
.bk-review-card::before { content: ""; position: absolute; top: 18px; bottom: 18px; right: 10px; width: 3px; background: var(--bk-cta); border-radius: 2px; }
.bk-review-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.bk-review-name { font-size: 16px; font-weight: 700; color: var(--bk-cta); margin: 0; }
.bk-review-google { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; background: #FFFFFF; border-radius: 50%; box-shadow: 0 0 0 1px var(--bk-border) inset; flex-shrink: 0; }
.bk-review-google svg { width: 18px; height: 18px; display: block; }
.bk-review-role { font-size: 13px; color: var(--bk-text-muted); margin: 0; }
.bk-review-stars { color: #D4A85A; font-size: 14px; letter-spacing: 2px; margin: 2px 0 4px; }
.bk-review-text { font-size: 13.5px; color: var(--bk-text); margin: 0; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 1199px) { .bk-review-card { flex-basis: calc((100% - 16px) / 2); } }
@media (max-width: 575px) { .bk-review-card { flex-basis: 88%; } }

/* ============================================================ GALLERY ============================================================ */
.bk-gal { padding: 56px 0 0; background: #FFFFFF; }
.bk-gal-head { text-align: center; margin-bottom: 36px; }
.bk-gal-head h2 { font-family: Georgia, "Times New Roman", serif; font-size: 36px; font-weight: 700; color: var(--bk-primary); margin: 0 0 8px; letter-spacing: -0.5px; }
.bk-gal-orn { display: inline-flex; align-items: center; gap: 8px; margin: 4px 0 12px; color: #D4A85A; }
.bk-gal-orn span { width: 70px; height: 1px; background: #D4A85A; display: inline-block; }
.bk-gal-orn i { font-size: 14px; }
.bk-gal-head p { color: var(--bk-text-muted); font-size: 15px; margin: 0 auto; max-width: 640px; }
.bk-gal-stage { position: relative; display: flex; align-items: flex-start; justify-content: center; gap: 16px; padding: 0 70px; }
@media (max-width: 575px) { .bk-gal-stage { padding: 0; flex-wrap: wrap; gap: 8px; } }
.bk-gal-row { display: flex; align-items: flex-start; gap: 18px; flex: 1; justify-content: center; }
@media (max-width: 991px) { .bk-gal-row { flex-wrap: wrap; } }
.bk-gal-tile { position: relative; background: transparent; border: 0; padding: 0; cursor: pointer; width: 180px; flex-shrink: 0; text-align: center; transition: transform 0.3s ease; z-index: 1; }
.bk-gal-img { position: relative; width: 180px; height: 180px; border-radius: 16px; overflow: hidden; background: var(--bk-bg-soft); box-shadow: 0 4px 14px rgba(31, 77, 58,0.08); transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.3s ease; margin: 0 auto; border: 1.5px solid transparent; }
.bk-gal-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-gal-tile:hover .bk-gal-img { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(31, 77, 58,0.14); }
.bk-gal-tile.is-active { z-index: 5; }
.bk-gal-tile.is-active .bk-gal-img { border-color: var(--bk-primary); box-shadow: 0 14px 32px rgba(31, 77, 58,0.20); }
.bk-gal-meta { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center; justify-content: center; padding: 18px 14px; background: rgba(255,255,255,0.96); text-align: center; z-index: 2; }
.bk-gal-tile.is-active .bk-gal-meta { display: flex; animation: bkGalFade 0.3s ease; }
@keyframes bkGalFade { from { opacity: 0; } to { opacity: 1; } }
.bk-gal-meta h6 { margin: 0 0 6px; font-size: 15px; font-weight: 800; color: var(--bk-text); }
.bk-gal-quote { color: #D4A85A; font-size: 14px; margin: 0 0 8px; display: inline-block; }
.bk-gal-meta p { margin: 0; font-size: 11px; line-height: 1.45; color: var(--bk-text); display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.bk-gal-arrow { width: 44px; height: 44px; border-radius: 50%; background: transparent; border: 0; color: #D4A85A; font-size: 18px; cursor: pointer; flex-shrink: 0; align-self: center; transition: transform 0.15s ease, color 0.15s ease; display: inline-flex; align-items: center; justify-content: center; }
.bk-gal-arrow:hover { color: var(--bk-cta); transform: scale(1.1); }
@media (max-width: 991px) { .bk-gal-stage { padding: 0 50px; } }

/* ============================================================ FOOTER V2 ============================================================ */
.bk-fv2 { position: relative; margin-top: 0; padding: 0; overflow: hidden; min-height: 620px; display: flex; align-items: center; }
.bk-fv2-bg { position: absolute; inset: 0; z-index: 0; }
.bk-fv2-bg img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; display: block; }
.bk-fv2-overlay { display: none; }
.bk-fv2-inner { position: relative; z-index: 2; padding: 40px 0; width: 100%; }
.bk-fv2 li::before, .bk-fv2 a::before, .bk-fv2 a::after { content: none !important; display: none !important; }

.bk-fv2-card { background: #FFFFFF; border-radius: 32px; border: 1.5px solid rgba(31, 77, 58,0.55); box-shadow: 0 24px 50px rgba(20, 52, 39,0.18); padding: 48px 56px 28px; }
@media (max-width: 991px) { .bk-fv2-card { padding: 32px 24px 20px; border-radius: 24px; } }

.bk-fv2-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 40px; padding-bottom: 0; border-bottom: 0; align-items: start; }
@media (max-width: 1199px) { .bk-fv2-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; } }
@media (max-width: 575px) {
    .bk-fv2-grid { grid-template-columns: 1fr; gap: 0; }

    /* Collapsible Top Destinations / Support on mobile only.
       Tap the heading to expand or collapse the link list. */
    .bk-fv2-col {
        border-top: 1px solid rgba(31,77,58,0.12);
        padding: 16px 0 8px;
    }
    /* Extra breathing room above the first collapsible (sits below social icons) */
    .bk-fv2-brand { padding-bottom: 8px; }
    .bk-fv2-brand .bk-fv2-social { margin-bottom: 24px; }
    .bk-fv2-col:first-of-type { margin-top: 28px; }
    .bk-fv2-col h4 {
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
        margin: 0;
        font-size: 13px;
        letter-spacing: 0.8px;
        user-select: none;
    }
    /* Unicode triangle — no font dependency, always renders */
    .bk-fv2-col h4::after {
        content: "\25BE"; /* ▾ */
        font-size: 16px;
        line-height: 1;
        color: var(--bk-primary);
        transition: transform 0.25s ease;
        margin-left: 12px;
        display: inline-block;
    }
    .bk-fv2-col.is-open h4::after { transform: rotate(180deg); }

    .bk-fv2-col ul {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease, margin-top 0.25s ease;
        margin-top: 0;
    }
    .bk-fv2-col.is-open ul {
        max-height: 400px;
        margin-top: 12px;
    }
    .bk-fv2-col li { margin-bottom: 10px; }

    /* Contact section stays fully visible (not an accordion) */
    .bk-fv2-contact { border-top: 1px solid rgba(31,77,58,0.10); padding-top: 16px; margin-top: 4px; }
}

.bk-fv2-brand .bk-fv2-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; margin-bottom: 6px; }
.bk-fv2-brand .bk-fv2-logo img {
    height: 56px; max-height: 56px;       /* fits the new Shateeta white footer logo */
    width: auto; max-width: 220px;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode: bicubic;
    transform: translateZ(0);
    backface-visibility: hidden;
}
.bk-fv2-brand .bk-fv2-logo i { font-size: 28px; color: var(--bk-primary); }
.bk-fv2-brand .bk-fv2-logo span { font-size: 19px; font-weight: 800; color: var(--bk-text); letter-spacing: -0.4px; }
.bk-fv2-tagline { color: var(--bk-text-muted); font-size: 13px; margin: 0 0 14px; }

/* ===========================================================
   Brand-theme overrides for legacy framework styles
   (loaded from booking.css so the new theme picks them up)
   =========================================================== */

/* Blog tags — legacy framework had coral orange. Force forest green. */
html body .tg-blog-sidebar-tag-list ul li a,
html body .tg-blog-sidebar-tag-list ul li a:visited,
html body .tg-blog-sidebar-tag-list ul li a:link,
html body .tg-blog-tag,
html body .tg-blog-tag a,
html body .tg-blog-2-item .tg-blog-tag,
html body .tg-blog-su-wrapper .tg-blog-tag,
html body .tg-blog-details-tag a,
html body .tg-blog-details-tag li a {
    color: #1F4D3A !important;
    background-color: rgba(31, 77, 58, 0.08) !important;
    background-image: none !important;
    border: 1px solid rgba(31, 77, 58, 0.14) !important;
    border-radius: 8px !important;
    transition: background-color 0.18s, color 0.18s !important;
}
html body .tg-blog-sidebar-tag-list ul li a:hover,
html body .tg-blog-tag:hover,
html body .tg-blog-tag a:hover,
html body .tg-blog-details-tag a:hover {
    background-color: #1F4D3A !important;
    color: #FFFFFF !important;
}

/* Contact form submit button — forest-green default, GOLD #D4A85A hover */
html body button.btn-modern-submit,
html body .btn-modern-submit {
    background: linear-gradient(135deg, #1F4D3A 0%, #143427 100%) !important;
    background-color: #1F4D3A !important;
    color: #FFFFFF !important;
    border: 0 !important;
    transition: background 0.18s, transform 0.18s, box-shadow 0.18s, filter 0.18s !important;
}
html body button.btn-modern-submit:hover,
html body .btn-modern-submit:hover {
    background: linear-gradient(135deg, #D4A85A 0%, #B5893F 100%) !important;
    background-color: #D4A85A !important;
    color: #FFFFFF !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 24px rgba(212, 168, 90, 0.36) !important;
    filter: none !important;
}

/* Auth (login / register) page — strip the dark-green gradient + photo
   overlay so the bg no longer clashes with the green header. Cream surface
   only, dark text on the left side. */
html body .au-bg {
    background: #F8F5EF !important;
    background-image: none !important;
}
html body .au-bg::before,
html body .au-bg::after,
html body .au-bg-img {
    display: none !important;
    background: none !important;
    opacity: 0 !important;
}
html body .au-side h1 { color: #1F4D3A !important; text-shadow: none !important; }
html body .au-side p,
html body .au-feat,
html body .au-feat * { color: #4A4A4A !important; }
html body .au-feat .au-feat-ic,
html body .au-feat i {
    background: rgba(31, 77, 58, 0.10) !important;
    color: #1F4D3A !important;
}
.bk-fv2-desc { color: var(--bk-text-muted); font-size: 14px; line-height: 1.6; margin: 0 0 18px; max-width: 280px; }

.bk-fv2-social { display: flex; gap: 12px; }
.bk-fv2-social a { position: relative; width: 40px; height: 40px; border-radius: 12px; color: var(--bk-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 16px; text-decoration: none; border: 1px solid rgba(31, 77, 58,0.35); background: linear-gradient(180deg, rgba(255,255,255,0.65) 0%, rgba(255,255,255,0.15) 60%, rgba(31, 77, 58,0.06) 100%), rgba(255,255,255,0.45); -webkit-backdrop-filter: blur(12px) saturate(160%); backdrop-filter: blur(12px) saturate(160%); box-shadow: 0 1px 0 rgba(255,255,255,0.7) inset, 0 -1px 2px rgba(31, 77, 58,0.08) inset, 0 6px 14px -4px rgba(31, 77, 58,0.18); overflow: hidden; isolation: isolate; transition: transform 0.18s ease, box-shadow 0.22s ease, color 0.18s ease; }
.bk-fv2-social a::before { content: ""; position: absolute; left: 8%; right: 8%; top: 2px; height: 42%; border-radius: 999px; background: linear-gradient(180deg, rgba(255,255,255,0.65) 0%, rgba(255,255,255,0) 100%); pointer-events: none; z-index: 1; }
.bk-fv2-social a > i { position: relative; z-index: 2; }
.bk-fv2-social a:hover { color: var(--bk-cta); transform: translateY(-2px); box-shadow: 0 1px 0 rgba(255,255,255,0.85) inset, 0 -1px 2px rgba(31, 77, 58,0.12) inset, 0 10px 18px -4px rgba(31, 77, 58,0.28); }

.bk-fv2-col h4, .bk-fv2-contact h4 { color: var(--bk-primary); font-size: 13px; font-weight: 800; letter-spacing: 1px; margin: 0 0 22px; text-transform: uppercase; }
.bk-fv2-col ul { list-style: none; margin: 0; padding: 0; }
.bk-fv2-col li { margin-bottom: 14px; }
.bk-fv2-col a { display: inline-flex; align-items: center; gap: 8px; color: var(--bk-text); font-size: 14px; text-decoration: none; transition: color 0.15s, transform 0.15s; }
.bk-fv2-col a i { font-size: 11px; color: var(--bk-primary); }
.bk-fv2-col a:hover { color: var(--bk-cta); transform: translateX(2px); }

.bk-fv2-contact ul { list-style: none; margin: 0; padding: 0; }
.bk-fv2-contact li { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 18px; }
.bk-fv2-icon { flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; background: rgba(31, 77, 58,0.08); color: var(--bk-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
.bk-fv2-contact li > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bk-fv2-contact li > div > a, .bk-fv2-contact li > div > span:first-child { color: var(--bk-text); font-weight: 700; font-size: 14px; text-decoration: none; line-height: 1.3; }
.bk-fv2-contact li > div > a:hover { color: var(--bk-cta); }
.bk-fv2-contact li small { color: var(--bk-text-muted); font-size: 12px; line-height: 1.3; }

.bk-fv2-copy { margin: 28px 0 0; padding-top: 18px; border-top: 1px solid rgba(31, 77, 58,0.10); color: var(--bk-text); font-size: 13px; text-align: left; }
.bk-fv2-copy a { color: var(--bk-primary); text-decoration: underline; font-weight: 500; }
.bk-fv2-copy a:hover { color: var(--bk-cta); }
.bk-fv2-bottom { display: none !important; }

/* WhatsApp floating button */
.whatsapp-icon { position: fixed; bottom: 20px; right: 20px; z-index: 999; width: 56px; height: 56px; box-shadow: var(--bk-shadow-md); border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; background: #25D366; }
.whatsapp-icon img { width: 100%; height: 100%; object-fit: cover; }

/* Hide legacy footer rules */
.bk-footer-dark, .bk-footer { display: none; }

/* ===========================================================================
 * RESPONSIVE LAYER — applies ONLY at ≤1024px. Desktop (≥1025px) is untouched.
 * Targets the real issues seen on mobile/tablet:
 *   – header brand + login/whatsapp wrap into multiple lines
 *   – navbar tabs overflow
 *   – long brand name breaks page width
 *   – various grids/cards crowd on small screens
 *   – horizontal page scroll
 * =========================================================================== */

/* ===== TABLET & MOBILE (≤1024px) ===== */
@media (max-width: 1024px) {
    /* Prevent any element from forcing horizontal page scroll */
    html, body { overflow-x: hidden; max-width: 100%; }
    img, video, iframe { max-width: 100%; height: auto; }

    /* Header — stack rows so brand / actions / nav don't compete for width */
    .bk-header-top { flex-wrap: wrap; gap: 10px; row-gap: 12px; padding: 10px 0; }
    .bk-header-actions { gap: 8px; flex-wrap: wrap; }

    /* Hero copy — soft-wrap long brand names so they never overflow */
    .bk-hero-title, .gt-hero-title-v2 {
        font-size: clamp(26px, 5.6vw, 36px) !important;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .bk-hero-sub, .gt-hero-sub-v2 { font-size: 15px !important; }
    .bk-hero-inner { padding-top: 4px; }

    /* Hero "service tabs" on theme4 hero — let them scroll horizontally
       instead of squishing into a multi-row pile. */
    .gt-hero-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 4px;
    }
    .gt-hero-tabs::-webkit-scrollbar { display: none; }
    .gt-hero-tab { flex-shrink: 0; }
}

/* ===== MOBILE (≤768px) ===== */
@media (max-width: 768px) {
    /* Sign up / Login button — keep on one line, smaller padding */
    .bk-header-actions .bk-btn,
    .bk-header-actions a.bk-btn,
    .bk-header-actions button.bk-btn,
    .bk-header-actions .bk-login-btn,
    .bk-header-actions .bk-signup-btn {
        white-space: nowrap;
        padding: 8px 14px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    /* WhatsApp pill — same: nowrap + slightly tighter */
    .bk-header-actions .bk-wa,
    .bk-header-actions .bk-wa-btn {
        white-space: nowrap;
        padding: 8px 14px !important;
        font-size: 13px !important;
    }

    /* Hero search bar — already stacked at this breakpoint elsewhere; ensure
       the date input has comfortable touch height */
    .bk-search-field { min-height: 60px; }
    .bk-search-field input,
    .bk-search-field select { font-size: 16px; } /* prevents iOS auto-zoom */

    /* Convert all multi-col grids to single column at mobile */
    .bk-grid-4, .bk-grid-3, .bk-grid-2 { grid-template-columns: 1fr !important; }

    /* Container side-padding (slightly tighter for usable width) */
    .bk-container { padding: 0 14px; }

    /* Make all touch targets minimum 40px tall */
    .bk-btn, .bk-cta, button, .ht-chip, .td-chip { min-height: 40px; }

    /* ============================================================
       MOBILE HEADER — single row: logo left, actions right
       ============================================================ */
    .bk-header-top {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        padding: 8px 0 !important;
    }
    .bk-logo img { max-height: 36px !important; max-width: 130px !important; }
    .bk-header-actions {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 6px !important;
        width: auto !important;
        margin: 0 !important;
    }
    /* Compact "Sign up / Login" pill */
    .bk-header-actions .bk-signin-btn {
        padding: 7px 12px !important;
        font-size: 12px !important;
        white-space: nowrap;
        line-height: 1.2;
    }
    /* WhatsApp becomes an icon-only round button — text node is fully hidden */
    .bk-header-actions .bk-wa-btn {
        padding: 0 !important;
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        border-radius: 50% !important;
        justify-content: center !important;
        align-items: center !important;
        flex-shrink: 0 !important;
        gap: 0 !important;
        overflow: hidden !important;
        font-size: 0 !important;
        line-height: 0 !important;
        color: transparent !important;
        text-indent: -9999px !important;
        white-space: nowrap !important;
        background: linear-gradient(180deg, #25D366 0%, #128C7E 100%) !important;
        box-shadow: 0 4px 10px rgba(18,140,126,0.35) !important;
        position: relative !important;
    }
    .bk-header-actions .bk-wa-btn::before {
        content: "\f232"; /* fa-whatsapp */
        font-family: "Font Awesome 6 Brands", "Font Awesome 6 Free", "FontAwesome";
        font-weight: 400;
        font-size: 20px;
        color: #FFFFFF;
        line-height: 1;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-indent: 0;
    }
    /* Hide the original inline icon span so we only show the ::before icon */
    .bk-header-actions .bk-wa-btn .bk-wa-icon {
        display: none !important;
    }

    /* ============================================================
       MOBILE: hide Trending badge on Kashmir package cards
       (it overlaps the "X Nights / Y Days" pill on small screens)
       ============================================================ */
    .bk-ktp-trend { display: none !important; }

    /* Featured tours — full width on mobile, slider stacks */
    .bk-fts-card { padding: 12px; }
    .bk-fts-slide-img { aspect-ratio: 16 / 10; }

    /* Hotels page card — stack image above content */
    .ht-card { grid-template-columns: 1fr !important; }
    .ht-card-aside { border-left: 0 !important; border-top: 1px dashed rgba(31,77,58,0.16); }

    /* Packages page card grid */
    .pkg-grid, .ds-grid, .td-feat-grid, .td-spots-grid,
    .ht-list, .sr-list { grid-template-columns: 1fr !important; }

    /* Hide bulky decorative bits that crowd small screens */
    .gt-hero-stats { display: none; }
    .td-cluster-path { display: none; }

    /* Sidebar filter on listings — collapse below results instead of squashing */
    .pkg-layout, .ht-layout, .sr-layout, .dd-layout { grid-template-columns: 1fr !important; }
    .pkg-side, .ht-side, .sr-side {
        position: static !important;
        margin-bottom: 16px;
    }

    /* Forms — full-width inputs */
    .bk-form-row, .bk-form-grid { grid-template-columns: 1fr !important; }
    input, select, textarea { font-size: 16px; } /* prevents iOS zoom */

    /* Footer — single column */
    .bk-fv2-inner { grid-template-columns: 1fr !important; gap: 28px !important; }

    /* Pagination — wrap pills */
    .pagination { flex-wrap: wrap; justify-content: center; }
}

/* ===== SMALL MOBILE (≤480px) ===== */
/* Mobile-only polish — desktop layout untouched */
@media (max-width: 767px) {
    /* (1) Subtle light-white border around the Search button so it stands
       out against the green hero background */
    .bk-search .bk-btn-search,
    .bk-btn-search {
        border: 1px solid rgba(255, 255, 255, 0.45) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 255, 255, 0.15) inset !important;
    }

    /* (2) Add breathing room between the curved hero and the first
       .bk-container section that follows (currently sits flush against it) */
    .bk-hero { margin-bottom: 18px; }
    .bk-hero + section,
    .bk-hero + .bk-container,
    .bk-hero + section .bk-container:first-child {
        margin-top: 12px;
    }
    /* Featured-tours card sits just under the hero — give it the same gap */
    .bk-fts { margin-top: 18px !important; }

    /* (3) Remove the V/curve clip-path at the bottom of the hero on mobile.
       Renders a clean straight edge instead. */
    .bk-hero--curve {
        -webkit-clip-path: none !important;
                clip-path: none !important;
        padding-bottom: 32px !important;
    }
    /* If the ::after pseudo curve was ever rendered (older builds), hide it too. */
    .bk-hero--curve::after { display: none !important; }

    /* (4) "View All" pill — keep "View All" on a single line and tuck the
       icon on the right (was wrapping into "View" / "All" on small screens) */
    .bk-view-all-link {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        align-self: flex-start;
        padding: 8px 14px !important;
        font-size: 12.5px !important;
    }
    .bk-view-all-link i {
        flex-shrink: 0;
        margin-left: 4px;
    }

    /* (5b) "View All" minimal link (Travel With Comfort & Freedom etc.) — keep
       "View All" on a single line; was wrapping into View / All on mobile */
    .bk-view-all {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        align-self: flex-start;
        font-size: 12.5px !important;
        padding: 4px 6px !important;
        line-height: 1.2 !important;
    }
    .bk-view-all i { flex-shrink: 0; margin-left: 4px; font-size: 11px; }

    /* (5) Latest Travel Articles "Read more articles" pill — shorten to "View All"
       on mobile only (via text replacement so desktop blade is untouched), and
       force single-line + tight padding so it sits cleanly next to the heading */
    .bk-read-more {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        align-self: flex-start;
        font-size: 0 !important;             /* hide original "Read more articles" text */
        padding: 9px 16px !important;
        border-radius: 999px !important;
    }
    .bk-read-more::before {
        content: "View All";
        font-size: 12.5px !important;
        font-weight: 700;
    }
    /* Also keep the stories-head row aligned cleanly at top, not stretched */
    .bk-stories-head {
        align-items: flex-start !important;
        gap: 12px !important;
        flex-wrap: wrap;
    }
}

/* Kashmir Tour Packages → horizontal scroll-snap slider on mobile only.
   Desktop layout (3-col grid) is completely untouched. */
@media (max-width: 767px) {
    .bk-ktp-grid {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 16px;
        -webkit-overflow-scrolling: touch;
        gap: 14px !important;
        padding: 6px 16px 14px !important;
        margin: 0 -16px !important; /* break out of bk-container so slider can edge-scroll */
        scrollbar-width: none;
    }
    .bk-ktp-grid::-webkit-scrollbar { display: none; }
    .bk-ktp-card {
        scroll-snap-align: start;
        flex: 0 0 82% !important;       /* ~one card per screen, with a peek of the next */
        max-width: 320px;
    }
}

/* Gallery → horizontal scroll-snap slider on mobile only.
   Desktop / tablet layout untouched (uses .bk-gal-row flex above 768px). */
@media (max-width: 768px) {
    /* Add breathing room between the gallery and whatever sits below (footer / Why-us card) */
    .bk-gal { padding: 32px 0 48px !important; margin-bottom: 16px; }
    .bk-gal-head { margin-bottom: 22px; }

    .bk-gal-stage {
        flex-wrap: nowrap !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 16px; /* first tile aligns to the visible left edge */
        -webkit-overflow-scrolling: touch;
        gap: 12px !important;
        padding: 6px 16px 14px !important;
        scrollbar-width: none;
        align-items: center !important;
        justify-content: flex-start !important;
    }
    .bk-gal-stage::-webkit-scrollbar { display: none; }
    .bk-gal-row {
        flex-wrap: nowrap !important;
        flex-direction: row !important;
        flex: 0 0 auto !important;
        gap: 12px !important;
        justify-content: flex-start !important;
    }
    .bk-gal-tile {
        scroll-snap-align: start;
        flex: 0 0 auto !important;
        width: 200px !important;
    }
    .bk-gal-img { width: 200px !important; height: 200px !important; }

    /* On mobile, never auto-show the meta overlay (it covers the image with
       a white panel, causing the "half-visible image" issue the user reported).
       Tiles always show their full photo. */
    .bk-gal-tile.is-active .bk-gal-meta { display: none !important; }
    .bk-gal-tile.is-active .bk-gal-img { border-color: transparent !important; box-shadow: 0 4px 14px rgba(31,77,58,0.10) !important; }

    /* Hide the desktop arrow buttons in slider mode */
    .bk-gal-arrow { display: none !important; }
}

@media (max-width: 480px) {
    .bk-hero-title, .gt-hero-title-v2 { font-size: clamp(22px, 7vw, 28px) !important; }
    .bk-hero-sub, .gt-hero-sub-v2 { font-size: 14px !important; }

    /* Header logo cap so it doesn't push other items out */
    .bk-logo img, .bk-header-brand img { max-height: 32px !important; max-width: 130px !important; }

    /* Section heads */
    .bk-section-title, h2.bk-section-title { font-size: 22px !important; }

    /* Card paddings tighter */
    .bk-card-body, .ht-card-body, .pkg-card-body { padding: 14px 16px !important; }

    /* Footer logos / contact */
    .bk-fv2-brand .bk-fv2-logo img { max-height: 36px !important; }
}

/* ===== EXTRA SMALL (≤375px) ===== */
@media (max-width: 375px) {
    .bk-container { padding: 0 12px; }
    .bk-header-actions { gap: 6px; }
    .bk-header-actions .bk-btn,
    .bk-header-actions .bk-wa,
    .bk-header-actions .bk-wa-btn { padding: 7px 12px !important; font-size: 12.5px !important; }
}
