:root {
    --gold: #b8912f;
    --gold-light: #d4af5a;
    --dark: #2b2b2b;
    --charcoal: #3d3d3d;
    --cream: #faf6ee;
    --text-muted: #6b6b6b;
}

body {
    font-family: 'Poppins', sans-serif;
    color: var(--charcoal);
    background: #fff;
}

h1, h2, h3, h4, h5, .brand-font {
    font-family: 'Playfair Display', serif;
    color: var(--dark);
}

a { text-decoration: none; color: inherit; }
a:hover { color: var(--gold); }

/* ---------- Topbar ---------- */
.topbar {
    background: var(--dark);
    color: #eee;
    font-size: 0.85rem;
}
.topbar a { color: #eee; }
.topbar a:hover { color: var(--gold-light); }
.topbar-right a { margin-left: 12px; }
.navbar{
    padding: 0;
}
/* ---------- Header / Nav ---------- */
.site-header {
    background: #fff;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    z-index: 1000;
}
.navbar-nav .nav-link {
    color: var(--charcoal);
    font-weight: 500;
    margin: 0 10px;
    position: relative;
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover {
    color: var(--gold);
}
.btn-gold {
    background: var(--gold);
    border: 1px solid var(--gold);
    color: #fff;
    font-weight: 600;
    padding: 0.55rem 1.4rem;
    border-radius: 4px;
    transition: all 0.25s ease;
}
.btn-gold:hover {
    background: var(--dark);
    border-color: var(--dark);
    color: #fff;
}
.btn-outline-gold {
    border: 1px solid var(--gold);
    color: var(--gold);
    font-weight: 600;
    padding: 0.55rem 1.4rem;
    border-radius: 4px;
    background: transparent;
}
.btn-outline-gold:hover {
    background: var(--gold);
    color: #fff;
}

/* ---------- Hero ---------- */
.hero {
    position: relative;
    background: linear-gradient(rgba(20,20,20,0.55), rgba(20,20,20,0.55)), url('../img/hero-bg.jpg') center/cover no-repeat;
    color: #fff;
    padding: 130px 0 110px;
}
.hero h1 {
    color: #fff;
    font-size: 3rem;
    font-weight: 800;
}
.hero .tagline {
    font-style: italic;
    color: var(--gold-light);
    font-size: 1.25rem;
}
.hero p.lead {
    color: #eee;
    max-width: 640px;
}
.page-hero {
    background: linear-gradient(rgba(25,25,25,0.72), rgba(25,25,25,0.72)), url('../img/hero-bg.jpg') center/cover no-repeat;
    color: #fff;
    padding: 90px 0 60px;
    text-align: center;
}
.page-hero h1 { color: #fff; }
.page-hero .breadcrumb-nav a { color: var(--gold-light); }
.page-hero .breadcrumb-nav span { color: #ccc; }

/* ---------- Sections ---------- */
section { padding: 80px 0; }
.section-tag {
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
    font-size: 0.85rem;
}
.section-title { font-size: 2.1rem; font-weight: 700; }
.bg-cream { background: var(--cream); }
.bg-dark-section { background: var(--dark); color: #eee; }
.bg-dark-section h2, .bg-dark-section h3 { color: #fff; }

/* ---------- Cards ---------- */
.service-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 2rem 1.5rem;
    text-align: center;
    height: 100%;
    transition: all 0.25s ease;
}
.service-card:hover {
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transform: translateY(-5px);
}
.service-card .icon-wrap {
    width: 70px; height: 70px;
    border-radius: 50%;
    background: var(--cream);
    color: var(--gold);
    font-size: 1.8rem;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 1.2rem;
}

.circuit-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(0,0,0,0.06);
    height: 100%;
    display: flex;
    flex-direction: column;
}
.circuit-card .circuit-img {
    height: 200px;
    background-size: cover;
    background-position: center;
    position: relative;
}
.circuit-card .circuit-badge {
    position: absolute;
    top: 14px; right: 14px;
    background: var(--gold);
    color: #fff;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 600;
}
.circuit-card .circuit-body {
    padding: 1.4rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.circuit-card .circuit-subtitle {
    color: var(--gold);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}

.destination-card {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    height: 320px;
    background-size: cover;
    background-position: center;
}
.destination-card .overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.75), rgba(0,0,0,0.05));
    display: flex; align-items: flex-end;
    padding: 1.5rem;
}
.destination-card h4 { color: #fff; margin: 0; }
.destination-card p { color: #ddd; font-size: 0.9rem; margin: 0; }

/* ---------- About page ---------- */
.stat-box {
    text-align: center;
    padding: 1.5rem;
}
.stat-box .num {
    font-family: 'Playfair Display', serif;
    font-size: 2.6rem;
    font-weight: 800;
    color: var(--gold);
}
.value-icon {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: var(--dark);
    color: var(--gold-light);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

/* ---------- Gallery ---------- */
.gallery-item {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    height: 260px;
    background-size: cover;
    background-position: center;
    margin-bottom: 1.5rem;
}
.gallery-item::after {
    content: '';
    position: absolute; inset: 0;
    background: rgba(0,0,0,0);
    transition: background 0.25s ease;
}
.gallery-item:hover::after { background: rgba(0,0,0,0.15); }
.gallery-filter .btn {
    border-radius: 20px;
    margin: 0 6px 10px 0;
    font-weight: 500;
}

/* ---------- Contact ---------- */
.contact-info-box {
    background: var(--dark);
    color: #eee;
    border-radius: 10px;
    padding: 2.5rem;
    height: 100%;
}
.contact-info-box .item {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.6rem;
}
.contact-info-box .item i {
    color: var(--gold-light);
    font-size: 1.3rem;
    margin-top: 3px;
}
.contact-info-box a { color: #eee; }
.contact-info-box a:hover { color: var(--gold-light); }

.form-control, .form-select {
    border-radius: 6px;
    padding: 0.7rem 1rem;
    border: 1px solid #ddd;
}
.form-control:focus, .form-select:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 0.2rem rgba(184,145,47,0.15);
}
.map-wrap {
    border-radius: 10px;
    overflow: hidden;
    line-height: 0;
}

/* ---------- CTA Strip ---------- */
.cta-strip {
    background: linear-gradient(rgba(20,20,20,0.85), rgba(20,20,20,0.85)), url('../img/hero-bg.jpg') center/cover no-repeat;
    color: #fff;
}
.cta-strip h3 { color: #fff; }

/* ---------- Footer ---------- */
.site-footer {
    background: var(--dark);
    color: #ccc;
}
.footer-heading {
    color: #fff;
    font-weight: 600;
    margin-bottom: 1.2rem;
}
.footer-links li { margin-bottom: 0.6rem; }
.footer-links a { color: #bbb; }
.footer-links a:hover { color: var(--gold-light); }
.text-muted-light { color: #aaa; font-size: 0.92rem; }
/* .footer-logo { filter: brightness(0) invert(1); opacity: 0.92; } */
.social-icons a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px;
    border: 1px solid #555;
    border-radius: 50%;
    margin-right: 8px;
    color: #ddd;
}
.social-icons a:hover { background: var(--gold); border-color: var(--gold); color: #fff; }
.footer-bottom {
    background: #222;
    border-top: 1px solid #3a3a3a;
    color: #999;
}

/* ---------- WhatsApp float ---------- */
.whatsapp-float {
    position: fixed;
    bottom: 24px; right: 24px;
    width: 58px; height: 58px;
    background: #25d366;
    color: #fff;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.7rem;
    box-shadow: 0 6px 20px rgba(0,0,0,0.25);
    z-index: 1200;
    animation: pulse 2.2s infinite;
}
.whatsapp-float:hover { color: #fff; transform: scale(1.06); }
@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(37,211,102,0.5); }
    70% { box-shadow: 0 0 0 14px rgba(37,211,102,0); }
    100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}

/* ---------- Misc ---------- */
.accordion-button:not(.collapsed) {
    background: var(--cream);
    color: var(--dark);
}
.accordion-button:focus { box-shadow: none; border-color: rgba(184,145,47,0.3); }
.nav-tabs .nav-link.active {
    color: var(--gold);
    border-color: #ddd #ddd #fff;
    font-weight: 600;
}
.nav-tabs .nav-link { color: var(--charcoal); }

@media (max-width: 991px) {
    .hero { padding: 90px 0 70px; }
    .hero h1 { font-size: 2.2rem; }
}