/* ===== BASE WITH CSS VARIABLES ===== */
:root {
    /* Colors */
    --bht-primary: #e67e22;
    --bht-primary-hover: #d35400;
    --bht-secondary: #2c3e50;
    --bht-bg: #ffffff;
    --bht-text: #444444;
    --bht-whatsapp: #25d366;
    --bht-success: #27ae60;
    --bht-error: #e74c3c;
    
    /* Typography */
    --bht-hero-title: 3rem;
    --bht-section-title: 2rem;
    --bht-body: 1.1rem;
    --bht-price: 2.2rem;
    --bht-btn: 1.1rem;
    --bht-badge: 0.9rem;
    
    /* Layout */
    --bht-hero-h: 70vh;
    --bht-archive-cols: 3;
    --bht-container: 1200px;
    --bht-section-space: 60px;
    --bht-card-gap: 30px;
    --bht-radius: 8px;
    
    /* Icon Styling */
    --bht-icon-sm: 2rem;
    --bht-icon-lg: 2.5rem;
    --bht-icon-color: inherit;
    --bht-icon-gap: 8px;
    
    /* Card Design */
    --bht-card-pad: 25px;
    --bht-card-shadow: 0 3px 15px rgba(0,0,0,0.08);
    --bht-card-border: none;
    --bht-card-hover: lift;
    --bht-img-aspect: 16/10;
    
    /* Grid System */
    --bht-cols-desktop: 3;
    --bht-cols-tablet: 2;
    --bht-cols-mobile: 1;
    --bht-gap-x: 30px;
    --bht-gap-y: 30px;
    
    /* Spacing */
    --bht-section-pady: 60px;
    --bht-container-pad: 20px;
    --bht-elem-gap: 20px;
    
    /* Sticky Bar */
    --bht-sticky-items: duration,season,difficulty,group;
    --bht-sticky-bg: #ffffff;
    --bht-sticky-size: 0.9rem;
}

.bht-container {  
    max-width: var(--bht-container, 1200px);  
    padding: 0 var(--bht-container-pad, 20px);  
    margin: 0 auto;  
    box-sizing: border-box;  
}

/* ===== HERO ===== */
.bht-hero {  
    position: relative;  
    height: var(--bht-hero-h, 70vh);  
    min-height: 500px;  
    background-size: cover;  
    background-position: center;  
    display: flex;  
    align-items: flex-end;  
}

.bht-hero-overlay {  
    background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.4) 50%, transparent 100%);  
    width: 100%;  
    padding: 80px 0 40px;  
    color: white;  
}

.bht-hero h1 {  
    font-size: var(--bht-hero-title, 3rem);  
    margin: 0 0 10px;  
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);  
    font-weight: 700;  
    line-height: 1.2;  
}

.bht-badge {  
    display: inline-block;  
    background: var(--bht-primary, #e67e22);  
    color: white;  
    padding: 6px 18px;  
    border-radius: 20px;  
    font-size: var(--bht-badge, 0.9rem);  
    margin-bottom: 15px;  
    font-weight: 600;  
}

.bht-subtitle {  
    font-size: var(--bht-body, 1.1rem);  
    opacity: 0.9;  
    margin: 0 0 20px;  
}

.bht-hero-price {  
    margin: 20px 0;  
}

.bht-price {  
    font-size: var(--bht-price, 2.2rem);  
    font-weight: bold;  
}

.bht-price-label {  
    font-size: var(--bht-body, 1.1rem);  
    opacity: 0.9;  
    margin-left: 10px;  
}

/* ===== BUTTONS ===== */
.bht-btn-primary {  
    display: inline-block;  
    background: var(--bht-primary, #e67e22);  
    color: white;  
    padding: 15px 40px;  
    border-radius: var(--bht-radius, 8px);  
    text-decoration: none;  
    font-weight: 600;  
    font-size: var(--bht-btn, 1.1rem);  
    transition: all 0.3s;  
    border: none;  
    cursor: pointer;  
}

.bht-btn-primary:hover {  
    background: var(--bht-primary-hover, #d35400);  
    transform: translateY(-2px);  
    color: white;  
}

.bht-btn-outline {  
    display: inline-block;  
    border: 2px solid var(--bht-primary, #e67e22);  
    color: var(--bht-primary, #e67e22);  
    padding: 10px 25px;  
    border-radius: var(--bht-radius, 8px);  
    text-decoration: none;  
    transition: all 0.3s;  
    font-weight: 600;  
}

.bht-btn-outline:hover {  
    background: var(--bht-primary, #e67e22);  
    color: white;  
}

.bht-btn-whatsapp {  
    display: inline-flex;  
    align-items: center;  
    gap: 8px;  
    background: var(--bht-whatsapp, #25d366);  
    color: white;  
    padding: 14px 35px;  
    border-radius: var(--bht-radius, 8px);  
    text-decoration: none;  
    font-weight: 600;  
    font-size: var(--bht-btn, 1.1rem);  
    transition: all 0.3s;  
}

.bht-btn-whatsapp:hover {  
    background: #128c7e;  
    color: white;  
    transform: translateY(-2px);  
}

.bht-btn-small {  
    background: var(--bht-primary, #e67e22);  
    color: white;  
    padding: 8px 20px;  
    border-radius: var(--bht-radius, 8px);  
    text-decoration: none;  
    font-size: 0.9rem;  
    font-weight: 600;  
    transition: all 0.3s;  
}

.bht-btn-small:hover {  
    background: var(--bht-primary-hover, #d35400);  
    color: white;  
}

/* ===== STICKY BAR ===== */
.bht-sticky-bar {  
    position: sticky;  
    top: 0;  
    background: white;  
    box-shadow: 0 2px 15px rgba(0,0,0,0.1);  
    z-index: 1000;  
    padding: 15px 0;  
    transform: translateY(-100%);  
    transition: transform 0.3s;  
}

.bht-sticky-bar.visible {  
    transform: translateY(0);  
}

.bht-sticky-bar .bht-container {  
    display: flex;  
    justify-content: space-between;  
    align-items: center;  
}

.bht-info-items {  
    display: flex;  
    gap: 30px;  
}

.bht-info-item {  
    font-size: 0.95rem;  
}

.bht-info-item strong {  
    color: #2c3e50;  
}

/* ===== STATS ===== */
.bht-stats-grid {  
    display: grid;  
    grid-template-columns: repeat(4, 1fr);  
    gap: 20px;  
    margin: 50px 0;  
}

.bht-stat {  
    text-align: center;  
    padding: 30px 20px;  
    background: #f8f9fa;  
    border-radius: 8px;  
    transition: transform 0.3s;  
}

.bht-stat:hover {  
    transform: translateY(-5px);  
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);  
}

.bht-stat-icon {  
    font-size: var(--bht-icon-sm, 2rem);  
    display: block;  
    margin-bottom: 12px;  
    color: var(--bht-icon-color, inherit);  
}

.bht-stat-label {  
    display: block;  
    color: #666;  
    font-size: 0.9rem;  
    margin-bottom: 8px;  
}

.bht-stat-value {  
    display: block;  
    font-size: 1.3rem;  
    font-weight: bold;  
    color: var(--bht-secondary, #2c3e50);  
}

/* ===== SECTION VISIBILITY ===== */
.bht-section.bht-hidden { display: none !important; }
.bht-hero.bht-hidden { display: none !important; }
.bht-stats-grid.bht-hidden { display: none !important; }
.bht-sticky-bar.bht-hidden { display: none !important; }

/* ===== SECTIONS ===== */
.bht-section {  
    margin: var(--bht-section-space, 60px) 0;  
}

.bht-section h2 {  
    font-size: var(--bht-section-title, 2rem);  
    color: var(--bht-secondary, #2c3e50);  
    margin-bottom: 25px;  
    padding-bottom: 10px;  
    border-bottom: 3px solid var(--bht-primary, #e67e22);  
    display: inline-block;  
}

.bht-description {  
    font-size: var(--bht-body, 1.1rem);  
    line-height: 1.8;  
    color: var(--bht-text, #444);  
}

/* ===== HIGHLIGHTS ===== */
.bht-highlights-list {  
    list-style: none;  
    padding: 0;  
    display: grid;  
    grid-template-columns: repeat(2, 1fr);  
    gap: 15px;  
}

.bht-highlights-list li {  
    padding: 18px 22px;  
    background: #f0f7f0;  
    border-left: 4px solid var(--bht-success, #27ae60);  
    border-radius: 0 6px 6px 0;  
    font-size: var(--bht-body, 1.1rem);  
    transition: all 0.3s;  
}

.bht-highlights-list li:hover {  
    background: #e8f5e8;  
    transform: translateX(5px);  
}

/* ===== ITINERARY ===== */
.bht-itinerary {  
    border: 1px solid #e0e0e0;  
    border-radius: var(--bht-radius, 8px);  
    overflow: hidden;  
}

.bht-day {  
    border-bottom: 1px solid #e0e0e0;  
}

.bht-day:last-child {  
    border-bottom: none;  
}

.bht-day-header {  
    display: flex;  
    align-items: center;  
    gap: 15px;  
    padding: 22px 25px;  
    background: white;  
    cursor: pointer;  
    transition: background 0.3s;  
}

.bht-day-header:hover {  
    background: #f8f9fa;  
}

.bht-day-number {  
    background: var(--bht-primary, #e67e22);  
    color: white;  
    padding: 6px 16px;  
    border-radius: 20px;  
    font-size: 0.85rem;  
    font-weight: bold;  
    white-space: nowrap;  
}

.bht-day-header h3 {  
    flex: 1;  
    margin: 0;  
    font-size: 1.15rem;  
    color: var(--bht-secondary, #2c3e50);  
}

.bht-day-distance {  
    color: #666;  
    font-size: 0.9rem;  
    background: #f0f0f0;  
    padding: 4px 12px;  
    border-radius: 12px;  
}

.bht-day-toggle {  
    font-size: 1.8rem;  
    color: var(--bht-primary, #e67e22);  
    font-weight: bold;  
    transition: transform 0.3s;  
    width: 30px;  
    text-align: center;  
}

.bht-day.active .bht-day-toggle {  
    transform: rotate(45deg);  
}

.bht-day-content {  
    display: none;  
    padding: 0 25px 25px;  
    background: #fafafa;  
    font-size: 1rem;  
    line-height: 1.8;  
    color: #555;  
}

.bht-day.active .bht-day-content {  
    display: block;  
}

/* ===== PRICING ===== */
.bht-pricing-grid {  
    display: grid;  
    grid-template-columns: repeat(4, 1fr);  
    gap: 20px;  
}

.bht-price-card {  
    text-align: center;  
    padding: 35px 25px;  
    border: 2px solid #e0e0e0;  
    border-radius: 8px;  
    position: relative;  
    transition: all 0.3s;  
    background: white;  
}

.bht-price-card:hover {  
    transform: translateY(-8px);  
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);  
}

.bht-price-card.featured {  
    border-color: #e67e22;  
    background: #fff8f0;  
    transform: scale(1.05);  
}

.bht-price-card.featured:hover {  
    transform: scale(1.05) translateY(-8px);  
}

.bht-price-badge {  
    position: absolute;  
    top: -12px;  
    left: 50%;  
    transform: translateX(-50%);  
    background: var(--bht-primary, #e67e22);  
    color: white;  
    padding: 4px 18px;  
    border-radius: 20px;  
    font-size: 0.8rem;  
    font-weight: 600;  
}

.bht-price-type {  
    display: block;  
    color: #666;  
    margin-bottom: 12px;  
    font-size: 0.95rem;  
}

.bht-price-amount {  
    display: block;  
    font-size: var(--bht-price, 2.2rem);  
    font-weight: bold;  
    color: var(--bht-secondary, #2c3e50);  
}

.bht-price-note {  
    display: block;  
    color: #999;  
    font-size: 0.9rem;  
    margin-top: 8px;  
}

/* ===== TWO COLUMN ===== */
.bht-two-col {  
    display: grid;  
    grid-template-columns: 1fr 1fr;  
    gap: 50px;  
}

.bht-inclusions ul,  
.bht-exclusions ul {  
    list-style: none;  
    padding: 0;  
}

.bht-inclusions li,  
.bht-exclusions li {  
    padding: 12px 0;  
    padding-left: 35px;  
    position: relative;  
    font-size: var(--bht-body, 1.1rem);  
    border-bottom: 1px solid #f0f0f0;  
}

.bht-inclusions li::before {  
    content: "✓";  
    position: absolute;  
    left: 0;  
    color: var(--bht-success, #27ae60);  
    font-weight: bold;  
    font-size: 1.2rem;  
}

.bht-exclusions li::before {  
    content: "×";  
    position: absolute;  
    left: 0;  
    color: var(--bht-error, #e74c3c);  
    font-weight: bold;  
    font-size: 1.2rem;  
}

/* ===== GALLERY ===== */
.bht-gallery {  
    display: grid;  
    grid-template-columns: repeat(3, 1fr);  
    gap: 15px;  
}

.bht-gallery-item {  
    display: block;  
    overflow: hidden;  
    border-radius: 8px;  
    aspect-ratio: 4/3;  
}

.bht-gallery-item img {  
    width: 100%;  
    height: 100%;  
    object-fit: cover;  
    transition: transform 0.4s;  
}

.bht-gallery-item:hover img {  
    transform: scale(1.08);  
}

/* ===== ENQUIRY FORM ===== */
.bht-enquiry {  
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);  
    padding: 60px;  
    border-radius: 12px;  
    text-align: center;  
}

.bht-enquiry-form {  
    max-width: 700px;  
    margin: 30px auto;  
    text-align: left;  
}

.bht-form-row {  
    display: grid;  
    grid-template-columns: 1fr 1fr;  
    gap: 15px;  
    margin-bottom: 15px;  
}

.bht-enquiry-form input,  
.bht-enquiry-form select,  
.bht-enquiry-form textarea {  
    width: 100%;  
    padding: 14px;  
    border: 1px solid #ddd;  
    border-radius: 6px;  
    font-size: 1rem;  
    transition: border-color 0.3s;  
}

.bht-enquiry-form input:focus,  
.bht-enquiry-form select:focus,  
.bht-enquiry-form textarea:focus {  
    outline: none;  
    border-color: #e67e22;  
}

.bht-enquiry-form textarea {  
    grid-column: 1 / -1;  
    margin-bottom: 15px;  
    resize: vertical;  
}

.bht-whatsapp-cta {  
    margin-top: 40px;  
    padding-top: 35px;  
    border-top: 2px solid #ddd;  
}

.bht-whatsapp-cta p {  
    margin-bottom: 15px;  
    color: #666;  
    font-size: 1.05rem;  
}

.bht-success-msg {  
    background: #d4edda;  
    color: #155724;  
    padding: 15px;  
    border-radius: 4px;  
    margin-bottom: 20px;  
}

/* ===== ARCHIVE PAGE ===== */
.bht-archive-hero {  
    background: linear-gradient(135deg, #1a3a4a 0%, #2c5f7c 100%);  
    color: white;  
    padding: 100px 0;  
    text-align: center;  
}

.bht-archive-hero h1 {  
    font-size: 3rem;  
    margin-bottom: 15px;  
}

.bht-archive-hero p {  
    font-size: 1.2rem;  
    opacity: 0.9;  
}

.bht-tours-grid {  
    display: grid;  
    grid-template-columns: repeat(var(--bht-archive-cols, 3), 1fr);  
    gap: var(--bht-card-gap, 30px);  
    padding: 60px 20px;  
}

.bht-tour-card {  
    background: white;  
    border-radius: var(--bht-radius, 8px);  
    overflow: hidden;  
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);  
    transition: all 0.3s;  
}

.bht-tour-card:hover {  
    transform: translateY(-8px);  
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);  
}

.bht-tour-image {  
    position: relative;  
    aspect-ratio: 16/10;  
    overflow: hidden;  
}

.bht-tour-image img {  
    width: 100%;  
    height: 100%;  
    object-fit: cover;  
    transition: transform 0.4s;  
}

.bht-tour-card:hover .bht-tour-image img {  
    transform: scale(1.08);  
}

.bht-tour-badge {  
    position: absolute;  
    top: 15px;  
    left: 15px;  
    background: var(--bht-primary, #e67e22);  
    color: white;  
    padding: 5px 14px;  
    border-radius: 20px;  
    font-size: var(--bht-badge, 0.9rem);  
    font-weight: 600;  
}

.bht-tour-info {  
    padding: 25px;  
}

.bht-tour-info h3 {  
    margin: 0 0 15px;  
    font-size: 1.25rem;  
}

.bht-tour-info h3 a {  
    color: var(--bht-secondary, #2c3e50);  
    text-decoration: none;  
}

.bht-tour-info h3 a:hover {  
    color: var(--bht-primary, #e67e22);  
}

.bht-tour-meta {  
    display: flex;  
    justify-content: space-between;  
    align-items: center;  
    margin: 15px 0 20px;  
    color: #666;  
} 

.bht-tour-price {  
    color: var(--bht-primary, #e67e22);  
    font-weight: bold;  
    font-size: var(--bht-btn, 1.1rem);  
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .bht-pricing-grid { grid-template-columns: repeat(2, 1fr); }
    .bht-tours-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
    .bht-hero h1 { font-size: 2rem; }
    .bht-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .bht-pricing-grid { grid-template-columns: 1fr; }
    .bht-two-col { grid-template-columns: 1fr; }
    .bht-gallery { grid-template-columns: repeat(2, 1fr); }
    .bht-tours-grid { grid-template-columns: 1fr; }
    .bht-form-row { grid-template-columns: 1fr; }
    .bht-info-items { display: none; }
    .bht-sticky-bar .bht-container { justify-content: center; }
    .bht-archive-hero h1 { font-size: 2rem; }
    .bht-sticky-bar { top: 0; }
}

@media (max-width: 480px) {
    .bht-hero { min-height: 400px; }
    .bht-stats-grid { grid-template-columns: 1fr; }
    .bht-highlights-list { grid-template-columns: 1fr; }
    .bht-gallery { grid-template-columns: 1fr; }
}