/* ==========================================================================
   Tripo Tours — color scheme taken from the Tripo.pk logo
   Blue (wordmark) / Green (wing) / Gold (dot accent)
   ========================================================================== */
:root{
	--tripo-blue: #1E4FA0;
	--tripo-blue-dark: #143b7d;
	--tripo-blue-light: #E8EFFA;
	--tripo-green: #3FA84A;
	--tripo-green-light: #7CC576;
	--tripo-gold: #F4B93C;
	--tripo-red: #E14545;
	--tripo-text: #1F2430;
	--tripo-gray: #6B7280;
	--tripo-border: #E5E9F0;
	--tripo-bg: #F6F8FC;
	--tripo-radius: 12px;
}

/* ==========================================================================
   HARD RESET — everything the plugin renders is wrapped in .tripo-scope.
   Themes and page builders (Elementor etc.) ship global button/img/list
   styles that otherwise leak in and break this layout, so every rule in
   here is scoped + !important on purpose. This is intentional, not sloppy.
   ========================================================================== */
   
   /* Single trip callback sidebar */
.tripo-scope .tripo-trip-callback-sidebar {
    min-width: 0;
    align-self: start;
}

.tripo-scope .tripo-trip-sidebar-callback {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    position: sticky;
    top: 24px;
}

.tripo-scope .tripo-trip-sidebar-callback input {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

@media (max-width: 900px) {
    .tripo-scope .tripo-trip-sidebar-callback {
        position: static;
    }
}
/* TEMPORARY: Hide the filters sidebar on the trip listing */
.tripo-scope .tripo-filters {
    display: none !important;
}

/* Let the date bar and trip cards use the full available width */
.tripo-scope .tripo-listing {
    grid-template-columns: minmax(0, 1fr) !important;
}

/* Prevent the main listing from overflowing its container */
.tripo-scope .tripo-listing-main {
    min-width: 0 !important;
    width: 100% !important;
}


/* TRIPO DATE BAR: responsive layout */
.tripo-scope #tripo-datebar {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-scroll {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.tripo-scope #tripo-datebar .tripo-datebar-scroll::-webkit-scrollbar {
    display: none !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-track {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: max-content !important;
    min-width: max-content !important;
    white-space: nowrap !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-arrow {
    flex: 0 0 36px !important;
    width: 36px !important;
    height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-month-active,
.tripo-scope #tripo-datebar .tripo-datebar-day,
.tripo-scope #tripo-datebar .tripo-datebar-month {
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
}

@media (max-width: 768px) {
    .tripo-scope .tripo-listing {
        padding: 20px 12px !important;
        gap: 16px !important;
    }

    .tripo-scope #tripo-datebar {
        gap: 5px !important;
        margin-bottom: 14px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-arrow {
        flex-basis: 30px !important;
        width: 30px !important;
        height: 30px !important;
        font-size: 17px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-track {
        gap: 6px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-month-active,
    .tripo-scope #tripo-datebar .tripo-datebar-day,
    .tripo-scope #tripo-datebar .tripo-datebar-month {
        height: 44px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-day {
        width: 44px !important;
    }

    .tripo-scope .tripo-listing-title {
        font-size: 20px !important;
        margin-top: 10px !important;
    }
}

@media (max-width: 480px) {
    .tripo-scope .tripo-listing {
        padding: 16px 8px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-arrow {
        flex-basis: 26px !important;
        width: 26px !important;
        height: 30px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-day {
        width: 40px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-month-active,
    .tripo-scope #tripo-datebar .tripo-datebar-day,
    .tripo-scope #tripo-datebar .tripo-datebar-month {
        height: 40px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-track {
        gap: 5px !important;
    }
}


.tripo-scope{ overflow-x:hidden; }
.tripo-scope, .tripo-scope *{ box-sizing:border-box !important; }
.tripo-scope button{
	all:unset;
	box-sizing:border-box !important;
	cursor:pointer !important;
	font-family:inherit !important;
	appearance:none !important;
	-webkit-appearance:none !important;
}
.tripo-scope ul, .tripo-scope ol{ list-style:none !important; margin:0 !important; padding:0 !important; }
.tripo-scope img{ max-width:100% !important; height:auto; border:none !important; box-shadow:none !important; }
.tripo-scope a{ text-decoration:none !important; box-shadow:none !important;}
.tripo-scope h1, .tripo-scope h2, .tripo-scope h3, .tripo-scope h4, .tripo-scope p{ box-shadow:none !important; }

/* ---------- Buttons ---------- */
.tripo-btn{
	display:inline-block !important;
	padding:12px 22px !important;
	border-radius:8px !important;
	font-weight:600 !important;
	font-size:14px !important;
	cursor:pointer !important;
	border:none !important;
	text-decoration:none !important;
	transition:.15s ease;
}
.tripo-btn-primary{ background:linear-gradient(90deg,var(--tripo-blue),var(--tripo-green)) !important; color:#fff !important; }
.tripo-btn-primary:hover{ opacity:.92; }
.tripo-btn-outline{ background:#fff !important; color:var(--tripo-blue) !important; border:1px solid var(--tripo-blue) !important; }
.tripo-btn-block{ display:block !important; width:100% !important; text-align:center !important; }

/* ---------- Section headers ---------- */
.tripo-section{ max-width:1280px; margin:0 auto; padding:32px 20px; }
.tripo-section-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.tripo-section-head h2{ font-size:24px; color:var(--tripo-text); margin:0; }
.tripo-view-all{ color:var(--tripo-blue); font-weight:600; text-decoration:none; font-size:14px; }

/* ---------- Card grid ---------- */
.tripo-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:20px;
}
@media(max-width:1100px){ .tripo-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .tripo-grid{ grid-template-columns:1fr; } }

.tripo-card{
	display:block;
	background:#fff;
	border-radius:var(--tripo-radius);
	overflow:hidden;
	box-shadow:0 2px 10px rgba(20,40,90,.08);
	text-decoration:none;
	color:inherit;
	transition:transform .15s ease, box-shadow .15s ease;
	border:1px solid var(--tripo-border);
}
.tripo-card:hover{ transform:translateY(-4px); box-shadow:0 10px 24px rgba(20,40,90,.14); }
.tripo-card-img{
	height:190px;
	background-size:cover;
	background-position:center;
	position:relative;
}
.tripo-badge{
	position:absolute;
	top:10px;
	font-size:11px;
	font-weight:700;
	padding:4px 10px;
	border-radius:20px;
	color:#fff;
}
.tripo-badge-cat{ left:10px; background:var(--tripo-gold); color:#231a00; }
.tripo-badge-duration{ right:10px; background:rgba(20,25,40,.65); }
.tripo-card-body{ padding:14px 16px 18px; }
.tripo-card-title{ font-size:16px; margin:0 0 6px; line-height:1.35; color:var(--tripo-text); }
.tripo-card-rating{ font-size:13px; color:var(--tripo-gold); margin-bottom:8px; }
.tripo-card-rating span{ color:var(--tripo-gray); }
.tripo-card-price{ font-size:15px; }
.tripo-price-original{ text-decoration:line-through; color:var(--tripo-gray); font-size:13px; margin-right:6px; }
.tripo-price-current{ color:var(--tripo-green); font-weight:700; }
.tripo-price-suffix{ color:var(--tripo-gray); font-size:12px; }
.tripo-no-results{ grid-column:1/-1; text-align:center; color:var(--tripo-gray); padding:40px 0; }

/* ---------- Category landing hero ---------- */
.tripo-category-hero{
	background:linear-gradient(120deg,var(--tripo-blue),var(--tripo-blue-dark) 60%,var(--tripo-green));
	color:#fff;
	padding:60px 20px;
	text-align:center;
}
.tripo-category-hero h1{ font-size:32px; margin:0 0 8px; }
.tripo-category-hero p{ opacity:.9; max-width:640px; margin:0 auto; }
.tripo-category-body{ background:var(--tripo-bg); padding-bottom:20px; }

/* ---------- Filter listing page ---------- */
.tripo-listing{ max-width:1280px; margin:0 auto; padding:30px 20px; display:grid; grid-template-columns:270px 1fr; gap:26px; align-items:start; }
@media(max-width:900px){ .tripo-listing{ grid-template-columns:1fr; } }

.tripo-filters{ background:#fff; border:1px solid var(--tripo-border); border-radius:var(--tripo-radius); padding:20px; position:sticky; top:20px; }
.tripo-filters h3{ margin-top:0; }
.tripo-filter-group{ padding:16px 0; border-top:1px solid var(--tripo-border); }
.tripo-filter-group:first-of-type{ border-top:none; }
.tripo-filter-group h4{ margin:0 0 10px; font-size:14px; color:var(--tripo-text); }
.tripo-radio{ display:block; font-size:14px; margin-bottom:8px; color:var(--tripo-gray); cursor:pointer; }
.tripo-radio input{ margin-right:8px; accent-color:var(--tripo-blue); }
.tripo-range{ position:relative; height:26px; }
.tripo-range input[type=range]{ position:absolute; width:100%; top:8px; accent-color:var(--tripo-green); background:transparent; }
.tripo-range-labels{ display:flex; justify-content:space-between; font-size:12px; color:var(--tripo-gray); margin-top:4px; }
.tripo-filters .tripo-btn{ width:100%; margin-top:10px; }

.tripo-listing-title{ font-size:20px; margin:0 0 18px; }

/* ---------- Date-bar (Upcoming Trips top filter) ---------- */
.tripo-datebar{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.tripo-datebar-scroll{ flex:1; min-width:0; overflow:hidden; }
.tripo-datebar-track{
	display:flex !important; align-items:center; gap:8px;
	overflow-x:auto; scroll-behavior:smooth; padding:2px 2px 8px;
	scrollbar-width:none;
}
.tripo-datebar-track::-webkit-scrollbar{ display:none; }
.tripo-datebar-arrow{
	flex-shrink:0 !important; width:34px !important; height:34px !important; border-radius:50% !important;
	background:#fff !important; border:1px solid var(--tripo-border) !important; cursor:pointer !important;
	display:flex !important; align-items:center !important; justify-content:center !important;
	font-size:17px !important; color:var(--tripo-text) !important;
}
.tripo-datebar-arrow-solid{ background:var(--tripo-blue) !important; border-color:var(--tripo-blue) !important; color:#fff !important; }
.tripo-datebar-month-active{
	flex-shrink:0; display:inline-flex; align-items:center; justify-content:center;
	height:52px; padding:0 16px; border-radius:10px; font-size:13px; font-weight:700;
	background:var(--tripo-blue-dark); color:#fff; white-space:nowrap;
}
.tripo-datebar-day{
	flex-shrink:0 !important; width:52px !important; height:52px !important; border-radius:10px !important;
	background:#fff !important; border:1px solid var(--tripo-border) !important; cursor:pointer !important;
	display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:2px;
}
.tripo-datebar-day-num{ font-size:15px !important; font-weight:700 !important; color:var(--tripo-text) !important; line-height:1; }
.tripo-datebar-day-name{ font-size:11px !important; color:var(--tripo-gray) !important; line-height:1; }
.tripo-datebar-day:hover{ border-color:var(--tripo-blue) !important; }
.tripo-datebar-day-active{ background:var(--tripo-blue) !important; border-color:var(--tripo-blue) !important; }
.tripo-datebar-day-active .tripo-datebar-day-num, .tripo-datebar-day-active .tripo-datebar-day-name{ color:#fff !important; }
.tripo-datebar-month{
	flex-shrink:0 !important; height:52px !important; padding:0 14px !important; border-radius:10px !important;
	background:#fff !important; border:1px solid var(--tripo-border) !important; cursor:pointer !important;
	font-size:13px !important; font-weight:600 !important; color:var(--tripo-text) !important; white-space:nowrap;
}
.tripo-datebar-month:hover{ border-color:var(--tripo-blue) !important; color:var(--tripo-blue) !important; }
@media(max-width:560px){
	.tripo-datebar-arrow{ width:28px !important; height:28px !important; font-size:15px !important; }
	.tripo-datebar-month-active, .tripo-datebar-day, .tripo-datebar-month{ height:46px !important; }
	.tripo-datebar-day{ width:46px !important; }
}

/* ---------- Upcoming Trips results — 2 columns ---------- */
.tripo-grid-2col{ grid-template-columns:repeat(2,1fr) !important; }
@media(max-width:700px){ .tripo-grid-2col{ grid-template-columns:1fr !important; } }

/* ---------- Horizontal listing card ---------- */
.tripo-lcard{
	display:flex !important; gap:14px; background:#fff; border:1px solid var(--tripo-border);
	border-radius:var(--tripo-radius); overflow:hidden; text-decoration:none; color:inherit;
	padding:10px; transition:transform .15s ease, box-shadow .15s ease;
}
.tripo-lcard:hover{ transform:translateY(-3px); box-shadow:0 10px 24px rgba(20,40,90,.14); }
.tripo-lcard-img{
	flex:0 0 140px !important; width:140px !important; height:140px !important; border-radius:8px !important;
	background-size:cover !important; background-position:center !important;
}
.tripo-lcard-body{ flex:1; min-width:0; display:flex; flex-direction:column; padding:2px 4px 2px 0; }
.tripo-lcard-title{ margin:0 0 8px; font-size:16px; font-weight:700; color:var(--tripo-text); line-height:1.3; }
.tripo-lcard-meta{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-bottom:6px; }
.tripo-lcard-meta-item{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; color:var(--tripo-gray); }
.tripo-lcard-meta-icon{ font-size:12px; }
.tripo-lcard-dates{ display:flex; align-items:center; gap:5px; font-size:12.5px; color:var(--tripo-gray); margin-bottom:10px; }
.tripo-lcard-more{ color:var(--tripo-blue); font-weight:600; margin-left:4px; }
.tripo-lcard-foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tripo-lcard-price{ font-size:14px; }
.tripo-lcard-arrow{
	flex-shrink:0; width:30px; height:30px; border-radius:50%; background:var(--tripo-text);
	color:#fff; display:flex; align-items:center; justify-content:center; font-size:14px;
}
@media(max-width:480px){
	.tripo-lcard{ flex-direction:column; }
	.tripo-lcard-img{ width:100% !important; height:160px !important; }
}

/* ---------- Single trip page ---------- */

/* ==========================================================================
   SINGLE TRIP HERO
   Full-width + responsive + natural image ratio
   NO CROP + NO STRETCH
   ========================================================================== */


.tripo-single-wrap{
	max-width:1280px;
	margin:0 auto;
	padding:28px 20px 60px;
	display:grid;
	grid-template-columns:minmax(0,1fr) 340px;
	gap:32px;
	align-items:start;
}
@media(max-width:900px){ .tripo-single-wrap{ grid-template-columns:minmax(0,1fr); } }

.tripo-single-main{ min-width:0; }
.tripo-single-title{ font-size:28px; margin:0 0 10px; color:var(--tripo-text); word-break:break-word; }
.tripo-single-meta{ display:flex; gap:18px; flex-wrap:wrap; color:var(--tripo-gray); font-size:14px; margin-bottom:20px; }
.tripo-meta-icon{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:var(--tripo-blue-light); margin-right:4px; }

.tripo-tabs{
	display:flex; gap:8px; flex-wrap:wrap; border-bottom:2px solid var(--tripo-border);
	margin-bottom:20px; position:sticky; top:0; background:#fff; z-index:5; padding-top:6px;
}
.tripo-tab-btn{
	background:none !important; border:none !important; cursor:pointer !important;
	padding:10px 4px !important; margin-right:14px !important;
	font-size:14px !important; font-weight:600 !important; color:var(--tripo-gray) !important;
	border-bottom:3px solid transparent !important;
	text-decoration:none !important; display:inline-block !important;
}
.tripo-tab-btn.active{ color:black !important; border-bottom-color:var(--tripo-green) !important; }
/* Fallback (JS also hard-forces this inline) — beats the parent theme's global
   a:hover/a:focus (which turns links white) with higher specificity + !important,
   so tab headings like "Itinerary" stay black on hover/active instead of white. */
.tripo-scope .tripo-tabs a.tripo-tab-btn,
.tripo-scope .tripo-tabs a.tripo-tab-btn:visited{ color:var(--tripo-gray) !important; }
.tripo-scope .tripo-tabs a.tripo-tab-btn:hover,
.tripo-scope .tripo-tabs a.tripo-tab-btn:focus{ color:var(--tripo-text) !important; }
.tripo-scope .tripo-tabs a.tripo-tab-btn.active,
.tripo-scope .tripo-tabs a.tripo-tab-btn.active:hover,
.tripo-scope .tripo-tabs a.tripo-tab-btn.active:focus{ color:var(--tripo-text) !important; border-bottom-color:var(--tripo-green) !important; }

/* Boxed sections — Overview / Itinerary / Inclusions / Exclusions / Other Info / Notes
   all render one after another (not tab-hidden); the tabs above just jump-scroll. */
.tripo-info-box{
	background:#fff !important;
	border:1px solid var(--tripo-border) !important;
	border-left:4px solid var(--tripo-blue) !important;
	border-radius:var(--tripo-radius) !important;
	padding:22px 24px !important;
	margin:0 0 22px !important;
	scroll-margin-top:70px;
	width:100%;
}
.tripo-box-title{ margin:0 0 14px !important; font-size:17px !important; color:var(--tripo-text) !important; }
.tripo-box-green{ border-left-color:var(--tripo-green) !important; }
.tripo-box-red{ border-left-color:var(--tripo-red) !important; }
.tripo-box-gray{ border-left-color:var(--tripo-gray) !important; }

.tripo-clamp{ position:relative; max-height:190px; overflow:hidden; transition:max-height .25s ease; }
.tripo-clamp.tripo-clamp-open{ max-height:none; }
.tripo-clamp:not(.tripo-clamp-open)::after{
	content:''; position:absolute; left:0; right:0; bottom:0; height:50px;
	background:linear-gradient(rgba(255,255,255,0),#fff);
}
.tripo-readmore-btn{ background:none !important; border:none !important; color:var(--tripo-blue) !important; font-weight:600 !important; font-size:13px !important; cursor:pointer !important; padding:6px 0 0 !important; display:block !important; }

.tripo-checklist{ list-style:none !important; margin:0 !important; padding:0 !important; }
.tripo-checklist li{ padding:8px 0 !important; border-bottom:1px dashed var(--tripo-border) !important; font-size:14px !important; word-break:break-word; }
.tripo-checklist-green li{ color:var(--tripo-text) !important; }
.tripo-checklist-red li{ color:var(--tripo-text) !important; }

.tripo-section-flush{ padding-left:0; padding-right:0; max-width:none; }

.tripo-itinerary-accordion{ border:1px solid var(--tripo-border) !important; border-radius:var(--tripo-radius) !important; overflow:hidden; width:100%; }
.tripo-itin-item + .tripo-itin-item{ border-top:1px solid var(--tripo-border) !important; }
.tripo-itin-head{
	width:100% !important; display:flex !important; align-items:center !important; gap:14px !important;
	background:#fff !important; border:none !important; cursor:pointer !important; padding:14px 18px !important; text-align:left !important;
	box-sizing:border-box !important;
}
.tripo-itin-day{ background:var(--tripo-blue-light) !important; color:var(--tripo-blue) !important; font-weight:700 !important; font-size:12px !important; padding:4px 10px !important; border-radius:20px !important; flex-shrink:0; }
.tripo-itin-title{ flex:1 !important; font-weight:600 !important; font-size:14px !important; word-break:break-word; }
.tripo-itin-arrow{ color:var(--tripo-green) !important; font-weight:700 !important; flex-shrink:0; }
.tripo-itin-body{ padding:0 18px 16px 84px !important; font-size:14px !important; color:var(--tripo-gray) !important; word-break:break-word; }

.tripo-reviews-list{ display:flex; flex-direction:column; gap:16px; }
.tripo-review-card{ display:flex; gap:14px; background:#fff; border:1px solid var(--tripo-border); border-radius:var(--tripo-radius); padding:18px; }
.tripo-review-avatar{
	flex-shrink:0; width:44px; height:44px; border-radius:50%;
	background:linear-gradient(135deg,var(--tripo-blue),var(--tripo-green));
	color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700;
}
.tripo-review-name{ font-weight:600; color:var(--tripo-text); }
.tripo-review-stars{ color:var(--tripo-gold); font-size:13px; margin:2px 0 6px; }
.tripo-review-text{ margin:0; font-size:14px; color:var(--tripo-gray); }

/* ---------- Journey in Frames gallery (fan carousel) ---------- */
.tripo-jf-section{ text-align:center; padding:44px 20px 54px !important; }
.tripo-jf-head{ margin-bottom:6px; }
.tripo-jf-head h2{ margin:0 !important; font-size:24px !important; font-weight:700 !important; color:var(--tripo-text) !important; letter-spacing:.3px; }
.tripo-jf-underline{ width:56px; height:3px; margin:12px auto; background:linear-gradient(90deg,var(--tripo-gold),var(--tripo-green)); border-radius:2px; }
.tripo-jf-sub{ margin:0 0 20px !important; color:var(--tripo-gray) !important; font-size:13px !important; letter-spacing:.5px; text-transform:uppercase; }

.tripo-jf-carousel{ position:relative; width:100%; margin:0 auto; }
/* clips the fan/curve so nothing overflows the section, while the track itself scrolls */
.tripo-jf-viewport{ overflow:hidden; padding:44px 0 20px; }
.tripo-jf-track{
	display:flex !important; align-items:center; justify-content:center; gap:6px;
	overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
	padding:0 8px; scrollbar-width:none;
}
.tripo-jf-track::-webkit-scrollbar{ display:none; }
.tripo-jf-slide{
	position:relative !important; flex:0 0 auto !important;
	width:200px !important; height:300px !important; border-radius:12px !important; overflow:hidden !important;
	scroll-snap-align:center; box-shadow:0 14px 26px rgba(20,40,90,.16);
	transition:box-shadow .3s ease; transform-origin:center bottom;
}
.tripo-jf-slide:hover{ box-shadow:0 20px 34px rgba(20,40,90,.28); }
.tripo-jf-slide:hover .tripo-jf-ph img{ transform:scale(1.06); }
.tripo-jf-ph{ width:100% !important; height:100% !important; background:linear-gradient(150deg,var(--tripo-blue),var(--tripo-blue-dark)); position:relative; }
.tripo-jf-slide img{
	width:100% !important; height:100% !important; object-fit:cover !important;
	display:block; transition:transform .4s ease; border-radius:0 !important;
}
.tripo-jf-nav{
	position:absolute !important; top:50%; transform:translateY(-50%);
	width:40px !important; height:40px !important; border-radius:50% !important; cursor:pointer !important;
	background:var(--tripo-blue) !important; color:#fff !important; font-size:20px !important; line-height:1;
	display:flex !important; align-items:center !important; justify-content:center !important;
	box-shadow:0 10px 22px rgba(20,40,90,.3); transition:background .25s ease, transform .25s ease; z-index:10;
}
.tripo-jf-nav:hover{ background:var(--tripo-blue-dark) !important; transform:translateY(-50%) scale(1.08); }
.tripo-jf-nav--prev{ left:8px; }
.tripo-jf-nav--next{ right:8px; }
@media(max-width:900px){
	.tripo-jf-slide{ width:180px !important; height:260px !important; }
	.tripo-jf-nav{ width:36px !important; height:36px !important; font-size:18px !important; }
}
@media(max-width:600px){
	.tripo-jf-section{ padding:36px 14px 44px !important; }
	.tripo-jf-head h2{ font-size:20px !important; }
	.tripo-jf-slide{ width:150px !important; height:220px !important; }
	.tripo-jf-track{ justify-content:flex-start; }
	.tripo-jf-nav--prev{ left:0; }
	.tripo-jf-nav--next{ right:0; }
}
@media(prefers-reduced-motion: reduce){ .tripo-jf-slide{ transition:none !important; } }

/* Similar Trips — full width, matching the gallery above it */
.tripo-similar{ max-width:none !important; width:100%; }

/* Sidebar */
.tripo-single-sidebar{ position:sticky; top:20px; display:flex; flex-direction:column; gap:18px; min-width:0; width:100%; }
.tripo-price-box, .tripo-callback-box{
	background:#fff !important; border:1px solid var(--tripo-border) !important; border-radius:var(--tripo-radius) !important;
	padding:20px !important; box-shadow:0 2px 10px rgba(20,40,90,.06); width:100%;
}
.tripo-price-box-label{ font-size:12px; color:var(--tripo-gray); }
.tripo-price-box-value{ font-size:22px; margin:4px 0; }
.tripo-price-box-sub{ font-size:12px; color:var(--tripo-gray); margin-bottom:14px; }
.tripo-btn-whatsapp{ background:linear-gradient(90deg,#25D366,var(--tripo-green)); border: 1px solid #2c73c9 !important; }
.tripo-btn-link-email{ display:block; text-align:center; margin-top:10px; font-size:12px; color:var(--tripo-blue); text-decoration:none; }
.tripo-btn-link-email:hover{ text-decoration:underline; }
.tripo-callback-box h4{ margin:0 0 4px; color:var(--tripo-blue); }
.tripo-callback-box p{ margin:0 0 14px; font-size:13px; color:var(--tripo-gray); }
.tripo-callback-box input{
	width:100%; padding:10px 12px; margin-bottom:10px;
	border:1px solid var(--tripo-border); border-radius:8px; font-size:14px; box-sizing:border-box;
}
.tripo-lead-msg{ font-size:13px; margin-top:8px; color:var(--tripo-green); }

/* ---------- Admin repeaters ---------- */
#tripo-itinerary-table input, #tripo-itinerary-table textarea,
#tripo-batch-table input{ width:100%; }
.tripo-remove-row{ color:var(--tripo-red); }

/* ==========================================================================
   Location landing page (taxonomy-trip_destination.php)
   ========================================================== */
/* ==========================================================================
   Location landing page hero
   Left content + right destination image
   ========================================================================== */

/* ==========================================================================
   Location landing page hero
   Same container width as header/navigation
   Full destination image without cropping
   ========================================================================== */

/* ==========================================================================
   Location landing page hero
   Gradient background + left content + full destination image
   ========================================================================== */

/* ==========================================================================
   DESTINATION HERO
   Full-width gradient + split text/image layout
   ========================================================================== */

/* ==========================================================================
   DESTINATION HERO
   Full-width gradient background
   Content aligned to the site's 1280px container
   ========================================================================== */

.tripo-dest-hero{
	display:grid;
	grid-template-columns:1fr 1fr;

	width:100%;
	max-width:none;

	margin:0;
	padding:30px 0;

	min-height:430px;

	position:relative;
	overflow:hidden;

	background:linear-gradient(
		105deg,
		#2456a6 0%,
		#1f4f9c 42%,
		#23659b 68%,
		#36a85b 100%
	);

	color:#fff;

	align-items:stretch;

	text-align:left;
	border-top: 1px solid #c3c4c71f;
}


/* Remove old overlay */

.tripo-dest-hero::before{
	display:none !important;
	content:none !important;
}


/* ==========================================================================
   LEFT CONTENT
   ========================================================================== */

.tripo-dest-hero-inner{
	position:relative;
	z-index:2;

	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:flex-start;

	/*
	 * Align left content with the site's main 1280px container.
	 *
	 * Since the hero is now full width, calculate the outer
	 * space automatically.
	 */
	padding-top:50px;
	padding-bottom:50px;

	padding-left:max(
		20px,
		calc((100vw - 1280px) / 2)
	);

	padding-right:45px;

	margin:0;

	background:transparent !important;

	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
}


/* Heading */

.tripo-dest-hero-inner h1{
	margin:0 0 18px;

	font-size:42px;

	font-weight:700;

	line-height:1.15;

	color:#fff;
}


/* Subtitle */

.tripo-dest-hero-inner p{
	margin:0 0 22px;

	max-width:560px;

	font-size:16px;

	line-height:1.6;

	color:rgba(255,255,255,.94);

	opacity:1;
}


/* ==========================================================================
   PACKAGE COUNT
   ========================================================================== */

.tripo-dest-hero-meta{
	margin-bottom:24px;
}


.tripo-dest-hero-meta .tripo-meta-item{
	display:inline-flex;

	align-items:center;

	gap:6px;

	padding:8px 15px;

	border-radius:20px;

	background:rgba(255,255,255,.16);

	border:1px solid rgba(255,255,255,.22);

	color:#fff;

	font-size:13px;

	backdrop-filter:blur(4px);
}


/* ==========================================================================
   BUTTONS
   ========================================================================== */

.tripo-dest-hero-cta{
	display:flex;

	gap:12px;

	justify-content:flex-start;

	align-items:center;

	flex-wrap:wrap;
}


/* Enquire button */

.tripo-btn-outline-light{
	background:rgba(255,255,255,.08) !important;

	color:#fff !important;

	border:1px solid rgba(255,255,255,.75) !important;
}


.tripo-btn-outline-light:hover{
	background:#fff !important;

	color:#2456a6 !important;

	border-color:#fff !important;
}


/* ==========================================================================
   RIGHT IMAGE
   ========================================================================== */

.tripo-dest-hero-media{
	position:relative;

	z-index:2;

	width:100%;

	height:100%;

	min-width:0;

	display:flex;

	align-items:center;

	justify-content:center;

	background:transparent !important;

	margin:0;

	padding:0;

	/*
	 * Right side also respects the 1280px container.
	 */
	padding-right:max(
		20px,
		calc((100vw - 1280px) / 2)
	);

	padding-left:20px;
}


/* Destination image */

.tripo-dest-hero-media img{
	display:block !important;

	width:100% !important;

	height:auto !important;

	max-width:100% !important;

	object-fit:contain !important;

	object-position:center center !important;

	margin:0 !important;

	border:0 !important;

	box-shadow:none !important;

	border-radius:10px !important;
}


/* Placeholder */

.tripo-dest-hero-placeholder{
	width:100%;

	min-height:360px;

	display:flex;

	align-items:center;

	justify-content:center;

	background:rgba(255,255,255,.10);

	border:1px solid rgba(255,255,255,.15);

	border-radius:14px;

	color:#fff;

	font-size:24px;

	font-weight:700;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media(max-width:900px){

	.tripo-dest-hero{
		grid-template-columns:1fr 1fr;

		min-height:360px;
	}


	.tripo-dest-hero-inner{
		padding-top:35px;
		padding-bottom:35px;

		padding-left:30px;

		padding-right:25px;
	}


	.tripo-dest-hero-inner h1{
		font-size:32px;
	}


	.tripo-dest-hero-inner p{
		font-size:15px;
	}


	.tripo-dest-hero-media{
		padding-left:15px;

		padding-right:30px;
	}

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media(max-width:700px){

	.tripo-dest-hero{

		grid-template-columns:1fr;

		min-height:0;

		padding:0;
	}


	.tripo-dest-hero-inner{

		width:100%;

		padding:36px 20px 30px;

		background:transparent !important;

		align-items:flex-start;
	}


	.tripo-dest-hero-inner h1{

		font-size:30px;

		line-height:1.2;

		margin-bottom:14px;
	}


	.tripo-dest-hero-inner p{

		font-size:14px;

		line-height:1.5;

		margin-bottom:18px;

		max-width:100%;
	}


	.tripo-dest-hero-meta{

		margin-bottom:20px;
	}


	.tripo-dest-hero-cta{

		width:100%;
	}


	.tripo-dest-hero-media{

		width:100%;

		height:auto;

		padding:0 20px 30px;

		background:transparent !important;
	}


	.tripo-dest-hero-media img{

		width:100% !important;

		height:auto !important;

		max-width:100% !important;

		object-fit:contain !important;

		border-radius:10px !important;
	}

}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media(max-width:420px){

	.tripo-dest-hero-inner{

		padding:30px 18px 26px;
	}


	.tripo-dest-hero-inner h1{

		font-size:26px;
	}


	.tripo-dest-hero-cta{

		flex-direction:column;

		align-items:stretch;
	}


	.tripo-dest-hero-cta .tripo-btn{

		width:100% !important;

		text-align:center !important;
	}


	.tripo-dest-hero-media{

		padding:0 18px 24px;
	}

}

.tripo-dest-nav{ max-width:1280px; margin:0 auto; padding:14px 20px 0; border-bottom:2px solid var(--tripo-border); position:static; }
.tripo-dest-block .tripo-category-body{ scroll-margin-top:16px; }

/* Horizontal themed carousel rows ("Community Tour — Europe" etc.) */
.tripo-dest-row{ position:relative; display:flex; align-items:center; gap:8px; }
.tripo-dest-row-track{
	display:flex !important; gap:18px; overflow-x:auto; scroll-behavior:smooth; scroll-snap-type:x mandatory;
	padding:2px 2px 10px; flex:1; min-width:0; scrollbar-width:none;
}
.tripo-dest-row-track::-webkit-scrollbar{ display:none; }
.tripo-dest-row-item{ flex:0 0 260px !important; scroll-snap-align:start; }
.tripo-dest-row-item .tripo-card{ height:100%; }
.tripo-dest-row-arrow{
	flex-shrink:0 !important; width:38px !important; height:38px !important; border-radius:50% !important;
	background:#fff !important; box-shadow:0 2px 10px rgba(20,40,90,.18) !important; border:1px solid var(--tripo-border) !important;
	display:flex !important; align-items:center !important; justify-content:center !important;
	font-size:18px !important; color:var(--tripo-blue) !important; cursor:pointer !important;
}
@media(max-width:600px){ .tripo-dest-row-arrow{ display:none !important; } .tripo-dest-row-item{ flex:0 0 220px !important; } }

/* All Packages — Load More */
.tripo-dest-all-hidden{ display:none !important; }
.tripo-dest-loadmore-wrap{ text-align:center; margin-top:22px; }

/* FAQ accordion (mirrors the itinerary accordion) */
.tripo-faq-accordion{ border:1px solid var(--tripo-border) !important; border-radius:var(--tripo-radius) !important; overflow:hidden; width:100%; }
.tripo-faq-item + .tripo-faq-item{ border-top:1px solid var(--tripo-border) !important; }
.tripo-faq-head{
	width:100% !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:14px !important;
	background:#fff !important; border:none !important; cursor:pointer !important; padding:14px 18px !important; text-align:left !important;
	box-sizing:border-box !important;
}
.tripo-faq-q{ flex:1 !important; font-weight:600 !important; font-size:14px !important; color:var(--tripo-text) !important; word-break:break-word; }
.tripo-faq-arrow{ color:var(--tripo-green) !important; font-weight:700 !important; flex-shrink:0; font-size:16px !important; }
.tripo-faq-body{ padding:0 18px 16px !important; font-size:14px !important; color:var(--tripo-gray) !important; word-break:break-word; }

/* Enquiry section — centered card instead of the sidebar layout */
.tripo-dest-enquire{ display:flex; justify-content:center; scroll-margin-top:70px; }
.tripo-dest-callback-box{ max-width:440px; width:100%; text-align:center; }
.tripo-dest-callback-box input{ text-align:left; }

/* ==========================================================================
   Umrah page ([tripo_umrah_page])
   ========================================================== */
.tripo-btn-gold{ background:linear-gradient(90deg,var(--tripo-gold),#e0a423) !important; color:#20250f !important; font-weight:700 !important; }
.tripo-btn-gold:hover{ opacity:.92; }

.tripo-umrah-hero{
	background:linear-gradient(135deg,var(--tripo-blue-dark),#0e3d1f 65%,var(--tripo-green));
	background-size:cover !important; background-position:center !important;
	color:#fff; padding:90px 20px 64px; text-align:center; position:relative;
}
.tripo-umrah-hero::before{ content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(11,26,54,.86),rgba(14,61,31,.78) 55%,rgba(63,168,74,.72)); }
.tripo-umrah-hero-inner{ position:relative; max-width:720px; margin:0 auto; }
.tripo-umrah-hero-inner h1{ font-size:46px; margin:0; line-height:1.1; letter-spacing:1px; }
.tripo-umrah-hero-sub{ font-size:16px; letter-spacing:4px; font-weight:600; color:var(--tripo-gold); margin:8px 0 18px; }
.tripo-umrah-hero-inner p{ margin:0 0 22px; opacity:.92; font-size:15px; }
.tripo-umrah-hero-cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
@media(max-width:600px){ .tripo-umrah-hero{ padding:64px 16px 44px; } .tripo-umrah-hero-inner h1{ font-size:32px; } }

.tripo-umrah-section-head{ text-align:center; margin-bottom:26px; }
.tripo-umrah-section-head h2{ margin:0 0 8px; font-size:24px; color:var(--tripo-text); }
.tripo-umrah-section-head p{ margin:0; color:var(--tripo-gray); font-size:14px; }

.tripo-umrah-card{ position:relative; }
.tripo-umrah-star-badge{
	position:absolute; top:10px; left:10px; background:var(--tripo-gold); color:#20250f;
	font-size:11px; font-weight:700; padding:4px 10px; border-radius:20px; z-index:2;
}
.tripo-umrah-card-stars{ color:var(--tripo-gold); font-size:13px; margin-bottom:6px; letter-spacing:2px; }
.tripo-card-meta{ font-size:12.5px; color:var(--tripo-gray); margin-bottom:8px; }

.tripo-umrah-banner{
	background:linear-gradient(120deg,var(--tripo-blue-dark),var(--tripo-green));
	background-size:cover !important; background-position:center !important;
	position:relative; padding:64px 20px; text-align:center; color:#fff; margin:10px 0;
}
.tripo-umrah-banner::before{ content:''; position:absolute; inset:0; background:rgba(10,30,20,.62); }
.tripo-umrah-banner-inner{ position:relative; max-width:640px; margin:0 auto; }
.tripo-umrah-banner-inner h2{ margin:0 0 22px; font-size:26px; }
.tripo-umrah-feature-row{ display:flex; justify-content:center; gap:28px; flex-wrap:wrap; margin-bottom:26px; }
.tripo-umrah-feature{ display:flex; flex-direction:column; align-items:center; gap:6px; font-size:13px; font-weight:600; }
.tripo-umrah-feature span{ font-size:24px; }

.tripo-umrah-offer-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:900px; margin:0 auto; }
.tripo-umrah-offer-item{ text-align:center; background:#fff; border:1px solid var(--tripo-border); border-radius:var(--tripo-radius); padding:24px 12px; }
.tripo-umrah-offer-icon{ font-size:30px; margin-bottom:10px; }
.tripo-umrah-offer-label{ font-size:13.5px; font-weight:600; color:var(--tripo-text); }
@media(max-width:700px){ .tripo-umrah-offer-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:420px){ .tripo-umrah-offer-grid{ grid-template-columns:1fr; } }

.tripo-umrah-companion{ background:#F6F8FB; }
.tripo-umrah-companion-grid{ display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:start; max-width:1100px; margin:0 auto; }
.tripo-umrah-companion-left h2{ font-size:24px; line-height:1.4; color:var(--tripo-text); margin:0 0 20px; }
.tripo-umrah-companion-img{
	width:100%; height:260px; border-radius:var(--tripo-radius); background-size:cover !important; background-position:center !important;
	box-shadow:0 10px 24px rgba(20,40,90,.14);
}
.tripo-umrah-steps{ display:flex; flex-direction:column; gap:16px; }
.tripo-umrah-step{ display:flex; gap:14px; align-items:flex-start; background:#fff; border:1px solid var(--tripo-border); border-radius:var(--tripo-radius); padding:14px 16px; }
.tripo-umrah-step-num{
	flex-shrink:0; width:32px; height:32px; border-radius:50%;
	background:linear-gradient(90deg,var(--tripo-blue),var(--tripo-green)); color:#fff;
	display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px;
}
.tripo-umrah-step strong{ display:block; font-size:14px; color:var(--tripo-text); margin-bottom:2px; }
.tripo-umrah-step p{ margin:0; font-size:12.5px; color:var(--tripo-gray); }
@media(max-width:800px){ .tripo-umrah-companion-grid{ grid-template-columns:1fr; } .tripo-umrah-companion-img{ height:200px; } }


/* =========================================================
   TRIPO DATE BAR — responsive layout and reliable scrolling
   ========================================================= */

.tripo-scope #tripo-datebar {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-bottom: 16px !important;
    box-sizing: border-box !important;
}

/* The ONLY horizontal scroll container */
.tripo-scope #tripo-datebar .tripo-datebar-scroll {
    flex: 1 1 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none !important;
    scroll-behavior: smooth;
}

.tripo-scope #tripo-datebar .tripo-datebar-scroll::-webkit-scrollbar {
    display: none !important;
}

/* Keep every date/month pill in one horizontal row */
.tripo-scope #tripo-datebar .tripo-datebar-track {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
    padding: 2px 2px 8px !important;
    white-space: nowrap !important;
}

/* Keep arrows visible and clickable */
.tripo-scope #tripo-datebar .tripo-datebar-arrow {
    all: unset !important;
    flex: 0 0 36px !important;
    width: 36px !important;
    height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    border: 1px solid var(--tripo-border) !important;
    border-radius: 50% !important;
    background: #fff !important;
    color: var(--tripo-text) !important;
    font-size: 20px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-next {
    background: var(--tripo-blue) !important;
    border-color: var(--tripo-blue) !important;
    color: #fff !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-arrow:hover {
    opacity: 0.85;
}

/* Month and date pills */
.tripo-scope #tripo-datebar .tripo-datebar-month-active,
.tripo-scope #tripo-datebar .tripo-datebar-day,
.tripo-scope #tripo-datebar .tripo-datebar-month {
    all: unset !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    height: 52px !important;
    padding: 0 12px !important;
    border: 1px solid var(--tripo-border) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: var(--tripo-text) !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

/* Current month */
.tripo-scope #tripo-datebar .tripo-datebar-month-active {
    background: var(--tripo-blue-dark) !important;
    border-color: var(--tripo-blue-dark) !important;
    color: #fff !important;
}

/* Date pills: number above weekday */
.tripo-scope #tripo-datebar .tripo-datebar-day {
    flex-direction: column !important;
    gap: 3px !important;
    width: 52px !important;
    padding: 0 4px !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-day-num {
    color: var(--tripo-text) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-day-name {
    color: var(--tripo-gray) !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

/* Selected date */
.tripo-scope #tripo-datebar .tripo-datebar-day.tripo-datebar-day-active {
    background: var(--tripo-blue) !important;
    border-color: var(--tripo-blue) !important;
    color: #fff !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-day.tripo-datebar-day-active .tripo-datebar-day-num,
.tripo-scope #tripo-datebar .tripo-datebar-day.tripo-datebar-day-active .tripo-datebar-day-name {
    color: #fff !important;
}

.tripo-scope #tripo-datebar .tripo-datebar-day:hover,
.tripo-scope #tripo-datebar .tripo-datebar-month:hover {
    border-color: var(--tripo-blue) !important;
}

/* Tablet */
@media (max-width: 768px) {
    .tripo-scope #tripo-datebar {
        gap: 6px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-arrow {
        flex-basis: 32px !important;
        width: 32px !important;
        height: 32px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-track {
        gap: 6px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-month-active,
    .tripo-scope #tripo-datebar .tripo-datebar-day,
    .tripo-scope #tripo-datebar .tripo-datebar-month {
        height: 46px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-day {
        width: 46px !important;
    }
}

/* Small phones */
@media (max-width: 480px) {
    .tripo-scope #tripo-datebar {
        gap: 4px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-arrow {
        flex-basis: 28px !important;
        width: 28px !important;
        height: 32px !important;
        font-size: 18px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-track {
        gap: 5px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-month-active,
    .tripo-scope #tripo-datebar .tripo-datebar-day,
    .tripo-scope #tripo-datebar .tripo-datebar-month {
        height: 42px !important;
        font-size: 12px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-day {
        width: 42px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-day-num {
        font-size: 14px !important;
    }

    .tripo-scope #tripo-datebar .tripo-datebar-day-name {
        font-size: 10px !important;
    }
}


/* TRIPO: Temporarily hide the listing filters */
.tripo-scope .tripo-filters {
    display: none !important;
}

/* Give the date bar and trip cards the full available width */
.tripo-scope .tripo-listing {
    grid-template-columns: minmax(0, 1fr) !important;
}

/* Prevent the listing from overflowing on smaller screens */
.tripo-scope .tripo-listing,
.tripo-scope .tripo-listing-main {
    min-width: 0;
    width: 100%;
    max-width: 100%;
}



/* SINGLE TRIP HERO — one consistent responsive rule */
.tripo-hero {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 1512 / 620 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    background-size: 100% 100% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Hide Download Itinerary */
.tripo-btn-download {
    display: none !important;
}



/* ==========================================================
   TRIPO SINGLE TRIP — MODERN TWO-COLUMN HERO
   ========================================================== */

.tripo-scope .tripo-trip-hero {
    width: 100%;
    background: #fff;
    padding: clamp(28px, 4vw, 58px) 24px;
    border-bottom: 1px solid #edf0f4;
    box-sizing: border-box;
}

.tripo-scope .tripo-trip-hero-inner {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
    align-items: center;
    gap: clamp(28px, 5vw, 72px);
}

.tripo-scope .tripo-trip-hero-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.tripo-scope .tripo-trip-eyebrow {
    display: inline-flex;
    align-items: center;
    margin-bottom: 16px;
    color: #218b52;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.5px;
    line-height: 1.4;
}

.tripo-scope .tripo-trip-hero-title {
    margin: 0 0 18px !important;
    color: #172033 !important;
    font-size: clamp(30px, 3.4vw, 48px) !important;
    font-weight: 750 !important;
    line-height: 1.12 !important;
    letter-spacing: -1.2px;
    overflow-wrap: anywhere;
}

.tripo-scope .tripo-trip-hero-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    margin-bottom: 24px;
    color: #647084;
    font-size: 14px;
    line-height: 1.6;
}

.tripo-scope .tripo-trip-meta-item {
    display: inline-flex;
    align-items: flex-start;
    gap: 7px;
    min-width: 0;
}

.tripo-scope .tripo-trip-hero-price {
    width: 100%;
    max-width: 440px;
    padding: 22px;
    background: #fff;
    border: 1px solid #e7ebf0;
    border-radius: 16px;
    box-shadow: 0 8px 28px rgba(20, 35, 55, 0.06);
    box-sizing: border-box;
}

.tripo-scope .tripo-trip-price-label {
    display: block;
    margin-bottom: 6px;
    color: #687386;
    font-size: 13px;
    font-weight: 500;
}

.tripo-scope .tripo-trip-price-value {
    color: #218b52;
    font-size: clamp(25px, 2.5vw, 34px);
    font-weight: 800;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.tripo-scope .tripo-trip-price-value del {
    color: #8992a0;
    font-size: 14px;
    font-weight: 500;
}

.tripo-scope .tripo-trip-price-value ins {
    color: #218b52;
    text-decoration: none;
}

.tripo-scope .tripo-trip-price-sub {
    display: block;
    margin: 7px 0 18px;
    color: #7a8494;
    font-size: 12px;
}

.tripo-scope .tripo-trip-hero-price .tripo-btn {
    display: flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 9px !important;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.tripo-scope .tripo-trip-hero-price .tripo-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 7px 18px rgba(30, 110, 75, 0.16);
}

.tripo-scope .tripo-trip-email-link {
    display: block;
    margin-top: 13px;
    color: #526174;
    font-size: 12px;
    text-align: center;
    text-decoration: none;
}

.tripo-scope .tripo-trip-email-link:hover {
    color: #218b52;
    text-decoration: underline;
}

.tripo-scope .tripo-trip-hero-media {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    border-radius: 18px;
    background: none !important;
    box-shadow: none !important;
}

.tripo-scope .tripo-trip-hero-media img {
    display: block;
    border-radius: 10px;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
}

/* Existing image proportions are preserved; no forced crop. */
.tripo-scope .tripo-trip-hero-image-placeholder {
    display: grid;
    min-height: 300px;
    place-items: center;
    padding: 24px;
    color: #647084;
    text-align: center;
}

/* Tablet */
@media (max-width: 900px) {
    .tripo-scope .tripo-trip-hero {
        padding: 32px 20px;
    }

    .tripo-scope .tripo-trip-hero-inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 24px;
    }

    .tripo-scope .tripo-trip-hero-title {
        font-size: clamp(28px, 4vw, 38px) !important;
    }

    .tripo-scope .tripo-trip-hero-price {
        padding: 18px;
    }
}

/* Mobile */
@media (max-width: 680px) {
    .tripo-scope .tripo-trip-hero {
        padding: 26px 16px 30px;
    }

    .tripo-scope .tripo-trip-hero-inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
    }

    .tripo-scope .tripo-trip-hero-content {
        order: 1;
    }

    .tripo-scope .tripo-trip-hero-media {
        order: 2;
        border-radius: 14px;
    }

    .tripo-scope .tripo-trip-hero-title {
        margin-bottom: 14px !important;
        font-size: clamp(29px, 8vw, 38px) !important;
        letter-spacing: -0.7px;
    }

    .tripo-scope .tripo-trip-hero-meta {
        gap: 8px 14px;
        margin-bottom: 20px;
        font-size: 13px;
    }

    .tripo-scope .tripo-trip-hero-price {
        max-width: none;
        padding: 19px;
        border-radius: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tripo-scope .tripo-trip-hero-price .tripo-btn {
        transition: none;
    }
}



/* =========================================================
   TRIPO SINGLE TRIP HERO — MODERN RESPONSIVE DESIGN
   Append at the END of tripo-tours.css
   ========================================================= */

.tripo-scope .tripo-trip-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(42px, 6vw, 88px) 24px;
    background:
        radial-gradient(
            circle at 8% 10%,
            rgba(41, 180, 112, 0.10),
            transparent 34%
        ),
        linear-gradient(135deg, #f7fbff 0%, #ffffff 58%, #f0faf5 100%);
}

.tripo-scope .tripo-trip-hero-inner {
    width: min(1240px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    align-items: center;
    gap: clamp(32px, 5vw, 76px);
}

.tripo-scope .tripo-trip-hero-content {
    min-width: 0;
}

.tripo-scope .tripo-trip-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 18px;
    color: #159653;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.tripo-scope .tripo-trip-eyebrow::before {
    content: "";
    width: 25px;
    height: 3px;
    border-radius: 99px;
    background: #27ad62;
}

.tripo-scope .tripo-trip-hero-title {
    margin: 0 0 20px;
    color: #15223b;
    font-size: clamp(34px, 4vw, 56px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -1.8px;
    overflow-wrap: anywhere;
}

.tripo-scope .tripo-trip-hero-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    margin: 0 0 26px;
    color: #64748b;
    font-size: 14px;
    line-height: 1.6;
}

.tripo-scope .tripo-trip-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

/* Price and booking card */
.tripo-scope .tripo-trip-hero-price {
    max-width: 470px;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow:
        0 18px 50px rgba(25, 48, 82, 0.08),
        0 3px 10px rgba(25, 48, 82, 0.03);
}

.tripo-scope .tripo-trip-price-label {
    display: block;
    margin-bottom: 7px;
    color: #64748b;
    font-size: 14px;
    font-weight: 500;
}

.tripo-scope .tripo-trip-price-value {
    margin-bottom: 5px;
    color: #209c50;
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 800;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.tripo-scope .tripo-trip-price-sub {
    display: block;
    margin-bottom: 20px;
    color: #8390a4;
    font-size: 13px;
}

.tripo-scope .tripo-trip-hero-price .tripo-btn {
    display: flex;
    width: 100%;
    min-height: 49px;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tripo-scope .tripo-trip-hero-price .tripo-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(24, 115, 75, 0.18);
}

.tripo-scope .tripo-trip-email-link {
    display: block;
    margin-top: 15px;
    color: #53657e;
    font-size: 13px;
    text-align: center;
    text-decoration: none;
}

.tripo-scope .tripo-trip-email-link:hover {
    color: #159653;
}

/* Destination image */
.tripo-scope .tripo-trip-hero-media {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 24px;
}

.tripo-scope .tripo-trip-hero-media img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 560px;
    object-fit: contain;
    object-position: center;
}

.tripo-scope .tripo-trip-hero-image-placeholder {
    display: grid;
    min-height: 320px;
    place-items: center;
    padding: 24px;
    color: #64748b;
    text-align: center;
}

/* Tablet */
@media (max-width: 900px) {
    .tripo-scope .tripo-trip-hero {
        padding: 42px 22px;
    }

    .tripo-scope .tripo-trip-hero-inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 26px;
    }

    .tripo-scope .tripo-trip-hero-title {
        font-size: clamp(30px, 4vw, 42px);
        letter-spacing: -1px;
    }

    .tripo-scope .tripo-trip-hero-price {
        padding: 20px;
    }
}

/* Mobile */
@media (max-width: 680px) {
    .tripo-scope .tripo-trip-hero {
        padding: 34px 18px 40px;
    }

    .tripo-scope .tripo-trip-hero-inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 26px;
    }

    .tripo-scope .tripo-trip-hero-content {
        order: 1;
    }

    .tripo-scope .tripo-trip-hero-media {
        order: 2;
        border-radius: 17px;
    }

    .tripo-scope .tripo-trip-hero-media img {
        max-height: none;
    }

    .tripo-scope .tripo-trip-hero-title {
        margin-bottom: 16px;
        font-size: clamp(32px, 8vw, 43px);
        line-height: 1.13;
    }

    .tripo-scope .tripo-trip-hero-meta {
        margin-bottom: 20px;
        font-size: 13px;
    }

    .tripo-scope .tripo-trip-hero-price {
        max-width: none;
        padding: 22px;
        border-radius: 17px;
    }

    .tripo-scope .tripo-trip-price-value {
        font-size: clamp(29px, 7vw, 36px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .tripo-scope .tripo-trip-hero-price .tripo-btn {
        transition: none;
    }
}