:root {
    --tourism-green: #173B2D;
    --tourism-green-dark: #0D291F;
    --tourism-gold: #D4A81E;
    --tourism-terracotta: #C96A3D;
    --tourism-ivory: #F8F5EE;
    --tourism-white: #FFFFFF;
    --tourism-text: #202722;
    --tourism-muted: #68716B;
}

#backToTop:hover {
    background: #D4A81E !important;
    color: #173B2D !important;
    transform: translateY(-4px) !important;
}

#backToTop i {
    transition: transform .3s ease;
}

#backToTop:hover i {
    transform: translateY(-3px);
}
/* ============================================================
   CURATED JOURNEYS
   ============================================================ */

.journey-card {
    border: 1px solid rgba(23, 59, 45, .08);

    box-shadow:
        0 8px 30px rgba(13, 41, 31, .04);

    transition:
        transform .45s cubic-bezier(.2,.65,.3,1),
        box-shadow .45s ease,
        border-color .45s ease;
}


/* Image */

.journey-image img {
    transition:
        transform 1.2s cubic-bezier(.2,.65,.3,1),
        filter .7s ease;
}


/* Arrow */

.journey-arrow {
    transition:
        transform .35s ease,
        background-color .35s ease;
}


/* Desktop */

@media (hover: hover) {

    .journey-card:hover {
        transform: translateY(-10px);

        border-color:
            rgba(212, 168, 30, .25);

        box-shadow:
            0 30px 70px rgba(13, 41, 31, .12);
    }


    .journey-card:hover
    .journey-image img {
        transform: scale(1.06);
    }


    .journey-card:hover
    .journey-arrow {
        transform:
            translate(3px,-3px)
            rotate(5deg);

        background:#D4A81E !important;
        color:#173B2D !important;
    }

}


/* Mobile */

@media (max-width: 575.98px) {

    .journey-image {
        height:340px !important;
    }

}

/* ============================================================
   ZANZIBAR FEATURE
   ============================================================ */

.zanzibar-feature {
    background-attachment: scroll;
}


/* Glass panel */

.zanzibar-story-card {
    box-shadow:
        0 30px 80px rgba(0, 0, 0, .18);

    transition:
        transform .45s cubic-bezier(.2,.65,.3,1),
        border-color .4s ease,
        box-shadow .4s ease;
}


/* CTA */

.zanzibar-primary-btn {
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.zanzibar-btn-arrow,
.zanzibar-round-link {
    transition:
        transform .35s cubic-bezier(.2,.65,.3,1),
        background-color .35s ease;
}


/* Desktop hover effects */

@media (hover: hover) {

    .zanzibar-story-card:hover {
        transform: translateY(-6px);

        border-color:
            rgba(212,168,30,.35) !important;

        box-shadow:
            0 38px 95px rgba(0,0,0,.24);
    }


    .zanzibar-primary-btn:hover {
        transform: translateY(-3px);

        box-shadow:
            0 18px 40px rgba(0,0,0,.18);

        color:#173B2D;
    }


    .zanzibar-primary-btn:hover
    .zanzibar-btn-arrow {
        transform: translateX(4px);
    }


    .zanzibar-round-link:hover {
        transform:
            translate(3px,-3px)
            rotate(6deg);

        color:#173B2D;
    }

}


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

@media (max-width: 991.98px) {

    .zanzibar-feature {
        min-height:auto !important;

        padding-top:6rem;
        padding-bottom:6rem;

        background:
            linear-gradient(
                90deg,
                rgba(7,31,25,.94),
                rgba(7,31,25,.68)
            ),
            url('../images/home/zanzibar-feature.jpg')
            center / cover no-repeat !important;
    }

}


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

@media (max-width: 575.98px) {

    .zanzibar-feature {
        padding-top:5rem;
        padding-bottom:5rem;
    }


    .zanzibar-story-card {
        padding:2rem !important;
    }

}

/* ============================================================
   TRAVEL WITH CONFIDENCE
   ============================================================ */

.confidence-card {
    border: 1px solid rgba(23, 59, 45, .07);

    box-shadow:
        0 8px 35px rgba(13, 41, 31, .035);

    transition:
        transform .45s cubic-bezier(.2,.65,.3,1),
        box-shadow .45s ease,
        border-color .45s ease;
}


.confidence-icon {
    transition:
        transform .4s cubic-bezier(.2,.65,.3,1),
        background-color .35s ease,
        color .35s ease;
}


.confidence-line {
    transform-origin: left center;

    transition:
        width .4s ease,
        background-color .4s ease;
}


.confidence-corner {
    transition:
        transform .6s cubic-bezier(.2,.65,.3,1),
        background-color .4s ease;
}


.confidence-cta {
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.confidence-cta-arrow {
    transition:
        transform .35s ease;
}


/* ============================================================
   DESKTOP INTERACTIONS
   ============================================================ */

@media (hover: hover) {

    .confidence-card:hover {
        transform: translateY(-8px);

        border-color:
            rgba(212, 168, 30, .28);

        box-shadow:
            0 28px 65px rgba(13, 41, 31, .10);
    }


    .confidence-card:hover
    .confidence-icon {
        transform: rotate(-5deg) scale(1.05);

        background:#D4A81E !important;
        color:#173B2D !important;
    }


    .confidence-card:hover
    .confidence-line {
        width:55px !important;
    }


    .confidence-card:hover
    .confidence-corner {
        transform: scale(1.45);
        background:
            rgba(212,168,30,.09) !important;
    }


    .confidence-cta:hover {
        transform: translateY(-3px);

        box-shadow:
            0 16px 35px rgba(13,41,31,.18);

        color:#fff;
    }


    .confidence-cta:hover
    .confidence-cta-arrow {
        transform: translateX(4px);
    }

}


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

@media (max-width: 767.98px) {

    .confidence-card {
        padding:2rem !important;
    }

}
