/* Preloader base */
#preloader {
    position: fixed;
    inset: 0;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

/* Logo mask container */
.logo-mask {
    width: 220px;
    height: 220px;

    /* Use your logo as mask */
    -webkit-mask: url('../img/logo.png') center/contain no-repeat;
    mask: url('../img/logo.png') center/contain no-repeat;

    /* Animated gradient INSIDE logo */
    background: linear-gradient(to top, #0f2e23 40%, #f59e0b 100%);
    background-size: 100% 200%;
    background-position: bottom;

    animation: fillLogo 2.5s ease-out forwards;
}

/* Gradient rising effect */
@keyframes fillLogo {
    0% {
        background-position: bottom;
    }

    100% {
        background-position: top;
    }
}

/* Index Page */
/* ── Gold shimmer on hover ── */
.gold-btn {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #C8520A, #D4861A);
}

.gold-btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .25), transparent);
    transition: left .5s ease;
}

.gold-btn:hover::after {
    left: 140%;
}

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 1.2s ease;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

@keyframes gradientFlow {
    0% {
        background-position: 50% 0%;
    }

    50% {
        background-position: 50% 100%;
    }

    100% {
        background-position: 50% 0%;
    }
}

body {
    font-family: 'Jost', sans-serif;
}

.font-display {
    font-family: 'Playfair Display', serif;
}

.hero-bg-1 {
    background: linear-gradient(to bottom, rgba(10, 30, 18, .5) 0%, rgba(10, 30, 18, .25) 50%, rgba(10, 30, 18, .6) 100%),
        url('../img/bg-hero.jpg') center/cover no-repeat;
}

.contact-bg {
    background-color: #1b3a2d;
}

@keyframes bounce-slow {

    0%,
    100% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(6px)
    }
}

.animate-bounce-slow {
    animation: bounce-slow 2s infinite;
}

/* Mobile menu slide-down transition */
#mobile-menu {
    transition: max-height 0.35s ease, opacity 0.3s ease;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
}

#mobile-menu.open {
    max-height: 500px;
    opacity: 1;
}

/* ── Ticker ── */
@keyframes ticker {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.ticker-inner {
    animation: ticker 28s linear infinite;
    white-space: nowrap;
    display: flex;
}

.ticker-inner:hover {
    animation-play-state: paused;
}


/* Tour Page */

* {
    box-sizing: border-box;
}

body {
    font-family: 'Jost', sans-serif;
}

.font-display {
    font-family: 'Playfair Display', serif;
}

/* ── Hero ── */
.hero-bg-2 {
    background:
        linear-gradient(to bottom, rgba(10, 20, 12, .72) 0%, rgba(20, 12, 5, .55) 60%, rgba(44, 26, 14, .9) 100%),
        url('../img/bg-hero-tours.jpg') center/cover no-repeat;
}

/* ── Grain overlay ── */
body::after {
    content: '';
    pointer-events: none;
    position: fixed;
    inset: 0;
    z-index: 999;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    opacity: .35;
}

/* ── Scroll reveals ── */
.reveal {
    opacity: 0;
    transform: translateY(44px);
    transition: opacity .9s ease, transform .9s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

.reveal-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 1s ease, transform 1s ease;
}

.reveal-left.visible {
    opacity: 1;
    transform: translateX(0);
}

.reveal-right {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 1s ease, transform 1s ease;
}

.reveal-right.visible {
    opacity: 1;
    transform: translateX(0);
}

/* ── Stagger delays ── */
.delay-1 {
    transition-delay: .1s;
}

.delay-2 {
    transition-delay: .22s;
}

.delay-3 {
    transition-delay: .34s;
}

.delay-4 {
    transition-delay: .46s;
}

.delay-5 {
    transition-delay: .58s;
}

.delay-6 {
    transition-delay: .70s;
}

/* ── Card image zoom ── */
.card-img-wrap {
    overflow: hidden;
}

.card-img-wrap img {
    transition: transform .8s cubic-bezier(.25, .46, .45, .94);
}

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

/* ── Gold shimmer on hover ── */
.gold-btn {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #C8520A, #D4861A);
}

.gold-btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .25), transparent);
    transition: left .5s ease;
}

.gold-btn:hover::after {
    left: 140%;
}

/* ── Divider ornament ── */
.ornament {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.ornament::before,
.ornament::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, transparent, #D4861A, transparent);
}

/* ── Parallax subtle ── */
.parallax-img {
    transition: transform .1s linear;
}

/* ── Ticker ── */
@keyframes ticker {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.ticker-inner {
    animation: ticker 28s linear infinite;
    white-space: nowrap;
    display: flex;
}

.ticker-inner:hover {
    animation-play-state: paused;
}

/* ── Mobile menu ── */
#mobile-menu {
    transition: max-height .35s ease, opacity .3s ease;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
}

#mobile-menu.open {
    max-height: 500px;
    opacity: 1;
}

/* ── Floating CTA pulse ── */
@keyframes pulse-ring {
    0% {
        box-shadow: 0 0 0 0 rgba(200, 82, 10, .5);
    }

    70% {
        box-shadow: 0 0 0 14px rgba(200, 82, 10, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(200, 82, 10, 0);
    }
}

.pulse {
    animation: pulse-ring 2.4s infinite;
}

/* ── Testimonial card bg ── */
.testi-bg {
    background: linear-gradient(135deg, #2C1A0E 0%, #3A200E 100%);
}

/* ── Process step line ── */
.step-line {
    position: relative;
}

.step-line::before {
    content: '';
    position: absolute;
    left: 24px;
    top: 56px;
    bottom: -32px;
    width: 2px;
    background: linear-gradient(to bottom, #D4861A, transparent);
}

.step-line:last-child::before {
    display: none;
}

/* Accommodation Page */
* {
    box-sizing: border-box;
}

body {
    font-family: 'Jost', sans-serif;
}

.font-display {
    font-family: 'Playfair Display', serif;
}

/* Hero */
.hero-bg-3 {
    background:
        linear-gradient(to bottom, rgba(10, 20, 12, .72) 0%, rgba(20, 12, 5, .55) 60%, rgba(44, 26, 14, .9) 100%),
        url('../img/bg-hero-3.jpg') center/cover no-repeat;
}

/* Grain */
body::after {
    content: '';
    pointer-events: none;
    position: fixed;
    inset: 0;
    z-index: 999;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    opacity: .32
}

/* Reveals */
.reveal {
    opacity: 0;
    transform: translateY(44px);
    transition: opacity .9s ease, transform .9s ease
}

.reveal-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 1s ease, transform 1s ease
}

.reveal-right {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 1s ease, transform 1s ease
}

.reveal.visible,
.reveal-left.visible,
.reveal-right.visible {
    opacity: 1;
    transform: none
}

.delay-1 {
    transition-delay: .10s
}

.delay-2 {
    transition-delay: .22s
}

.delay-3 {
    transition-delay: .34s
}

.delay-4 {
    transition-delay: .46s
}

.delay-5 {
    transition-delay: .58s
}

.delay-6 {
    transition-delay: .70s
}

/* Gold shimmer button */
.gold-btn {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #C8520A, #D4861A)
}

.gold-btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .25), transparent);
    transition: left .5s ease
}

.gold-btn:hover::after {
    left: 140%
}

/* Card image zoom */
.acc-card:hover .acc-img {
    transform: scale(1.07)
}

.acc-img {
    transition: transform .8s cubic-bezier(.25, .46, .45, .94)
}

/* Ticker */
@keyframes ticker {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(-50%)
    }
}

.ticker-inner {
    animation: ticker 30s linear infinite;
    white-space: nowrap;
    display: flex
}

.ticker-inner:hover {
    animation-play-state: paused
}

/* Pulse */
@keyframes pulse-ring {
    0% {
        box-shadow: 0 0 0 0 rgba(200, 82, 10, .5)
    }

    70% {
        box-shadow: 0 0 0 14px rgba(200, 82, 10, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgba(200, 82, 10, 0)
    }
}

.pulse {
    animation: pulse-ring 2.4s infinite
}

/* Feature card hover */
.feat-card {
    transition: transform .35s ease, box-shadow .35s ease
}

.feat-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 60px rgba(44, 26, 14, .18)
}

/* Mobile menu */
#mobile-menu {
    transition: max-height .35s ease, opacity .3s ease;
    max-height: 0;
    opacity: 0;
    overflow: hidden
}

#mobile-menu.open {
    max-height: 500px;
    opacity: 1
}

/* Parallax-lite on hero image */
.hero-scroll {
    will-change: transform
}

/* Star rating */
.star-fill {
    color: #F0C060
}


/* Transfers */
* {
    box-sizing: border-box
}

body {
    font-family: 'Jost', sans-serif
}

.font-display {
    font-family: 'Cormorant Garamond', serif
}

.hero-bg-5 {
    background:
        linear-gradient(to bottom, rgba(10, 20, 12, .75) 0%, rgba(20, 12, 5, .55) 55%, rgba(44, 26, 14, .92) 100%),
        url('../img/bg-hero-trans.jpg') center/cover no-repeat;
}

body::after {
    content: '';
    pointer-events: none;
    position: fixed;
    inset: 0;
    z-index: 999;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    opacity: .32
}

.reveal {
    opacity: 0;
    transform: translateY(44px);
    transition: opacity .9s ease, transform .9s ease
}

.reveal-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 1s ease, transform 1s ease
}

.reveal-right {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 1s ease, transform 1s ease
}

.reveal.visible,
.reveal-left.visible,
.reveal-right.visible {
    opacity: 1;
    transform: none
}

.delay-1 {
    transition-delay: .10s
}

.delay-2 {
    transition-delay: .22s
}

.delay-3 {
    transition-delay: .34s
}

.delay-4 {
    transition-delay: .46s
}

.card-img {
    transition: transform .7s cubic-bezier(.25, .46, .45, .94)
}

.route-card:hover .card-img {
    transform: scale(1.07)
}

.gold-btn {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #C8520A, #D4861A)
}

.gold-btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .25), transparent);
    transition: left .5s ease
}

.gold-btn:hover::after {
    left: 140%
}

@keyframes ticker {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(-50%)
    }
}

.ticker-inner {
    animation: ticker 28s linear infinite;
    white-space: nowrap;
    display: flex
}

.ticker-inner:hover {
    animation-play-state: paused
}

@keyframes pulse-ring {
    0% {
        box-shadow: 0 0 0 0 rgba(200, 82, 10, .5)
    }

    70% {
        box-shadow: 0 0 0 14px rgba(200, 82, 10, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgba(200, 82, 10, 0)
    }
}

.pulse {
    animation: pulse-ring 2.4s infinite
}

.fleet-card {
    transition: transform .35s ease, box-shadow .35s ease
}

.fleet-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 60px rgba(44, 26, 14, .18)
}

.timeline-step {
    position: relative
}

.timeline-step:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 28px;
    left: calc(50% + 28px);
    width: calc(100% - 56px);
    height: 2px;
    background: linear-gradient(to right, #D4861A, rgba(212, 134, 26, .1))
}

@media(max-width:768px) {
    .timeline-step:not(:last-child)::after {
        display: none
    }
}

#mobile-menu {
    transition: max-height .35s ease, opacity .3s ease;
    max-height: 0;
    opacity: 0;
    overflow: hidden
}

#mobile-menu.open {
    max-height: 500px;
    opacity: 1
}