:root {

        --primary: #0f3d2e;
        --gold: #d6b46a;
        --light: #f7f8fa;
        --text: #1f2937;

    }

    body {

        background: var(--light);

        font-family:
            'Plus Jakarta Sans',
            sans-serif;

        color: var(--text);

    }

    /* HERO */

    .hero {

        padding: 80px 0 50px;

    }

    .hero-box {

        background:
            linear-gradient(135deg,
                #0f3d2e 0%,
                #1c5d46 100%);

        color: #fff;

        border-radius: 32px;

        padding: 80px 50px;

        text-align: center;

        box-shadow:
            0 20px 60px rgba(0, 0, 0, .12);

    }

    /* TOUR CARD */

    .tour-card {

        background: #fff;

        border-radius: 28px;

        overflow: hidden;

        box-shadow:
            0 10px 30px rgba(0, 0, 0, .06);

        transition: .35s ease;

        height: 100%;

        position: relative;

    }

    .tour-card:hover {

        transform:
            translateY(-8px);

        box-shadow:
            0 25px 60px rgba(0, 0, 0, .12);

    }

    .tour-image {

        position: relative;

        aspect-ratio: 16/10;

        overflow: hidden;

    }

    .tour-image img {

        width: 100%;
        height: 100%;

        object-fit: cover;

        transition: .5s;

    }

    .tour-card:hover img {

        transform:
            scale(1.08);

    }

    /* FLOATING BADGE */

    .tour-badge {

        position: absolute;

        top: 16px;

        left: 16px;

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

        backdrop-filter:
            blur(10px);

        padding:
            8px 14px;

        border-radius: 50px;

        font-size: 13px;

        font-weight: 700;

    }

    /* RATING */

    .rating-pill {

        position: absolute;

        right: 16px;

        top: 16px;

        background:
            rgba(0,
                0,
                0,
                .55);

        color: #fff;

        padding:
            8px 12px;

        border-radius: 50px;

        font-size: 13px;

    }

    /* CONTENT */

    .tour-content {

        padding: 24px;

    }

    .tour-title {

        font-size: 1.2rem;

        font-weight: 800;

        color: #111827;

        margin-bottom: 10px;

    }

    .tour-subtitle {

        color: #6b7280;

        font-size: .95rem;

        line-height: 1.7;

        min-height: 70px;

    }

    .tour-meta {

        display: flex;

        justify-content: space-between;

        font-size: 14px;

        color: #6b7280;

        margin-top: 18px;

    }

    .price {

        margin-top: 20px;

        font-size: 1.2rem;

        font-weight: 800;

        color: var(--primary);

    }

    .price small {

        font-size: .85rem;

        color: #6b7280;

    }

    /* BUTTON */

    .btn-tour {

        width: 100%;

        border-radius: 50px;

        padding: 14px;

        font-weight: 700;

        margin-top: 20px;

        background: var(--primary);

        color: #fff;

        border: none;

    }

    .btn-tour:hover {

        background: #144936;

    }

    .cta-section {

        padding: 80px 0;

    }

    .cta-box {

        position: relative;

        overflow: hidden;

        background:
            linear-gradient(135deg,
                #0f3d2e 0%,
                #1f5d46 100%);

        color: #fff;

        border-radius: 32px;

        padding: 70px 50px;

        text-align: center;

        box-shadow:
            0 25px 80px rgba(15, 61, 46, .18);

    }

    .cta-box::before {

        content: '';

        position: absolute;

        top: -80px;
        right: -80px;

        width: 220px;
        height: 220px;

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

        border-radius: 50%;

    }

    .cta-box::after {

        content: '';

        position: absolute;

        bottom: -100px;
        left: -100px;

        width: 280px;
        height: 280px;

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

        border-radius: 50%;

    }

    .cta-title {

        font-size: 2.3rem;

        font-weight: 800;

        margin-bottom: 18px;

    }

    .cta-text {

        max-width: 720px;

        margin: 0 auto 30px;

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

        line-height: 1.8;

    }

    .btn-cta {

        display: inline-flex;

        align-items: center;

        gap: 10px;

        background: #fff;

        color: #0f3d2e;

        border: none;

        border-radius: 50px;

        padding:
            16px 34px;

        font-weight: 700;

        text-decoration: none;

        transition: .3s;

    }

    .btn-cta:hover {

        transform:
            translateY(-3px);

        box-shadow:
            0 15px 35px rgba(0,
                0,
                0,
                .15);

        color: #0f3d2e;

    }

    @media (max-width:768px) {

        .cta-box {

            padding:
                50px 30px;

        }

        .cta-title {

            font-size:
                1.8rem;

        }

    }

    .destination-card {

        background: #fff;

        border-radius: 28px;

        overflow: hidden;

        height: 100%;

        box-shadow:
            0 12px 35px rgba(0, 0, 0, .06);

        transition: .35s ease;

    }

    .destination-card:hover {

        transform: translateY(-6px);

        box-shadow:
            0 20px 50px rgba(0, 0, 0, .10);

    }

    .destination-image {

        position: relative;

        overflow: hidden;

    }

    .destination-image img {

        width: 100%;

        height: 280px;

        object-fit: cover;

        transition: .5s ease;

    }

    .destination-card:hover img {

        transform: scale(1.08);

    }

    .destination-overlay {

        position: absolute;

        top: 20px;

        left: 20px;

    }

    .destination-badge {

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

        backdrop-filter: blur(10px);

        padding: 8px 14px;

        border-radius: 50px;

        font-size: .8rem;

        font-weight: 600;

        color: #0f172a;

    }

    .destination-content {

        padding: 28px;

    }

    .destination-content h3 {

        font-size: 1.4rem;

        font-weight: 700;

        color: #0f172a;

        margin-bottom: 14px;

    }

    .destination-content p {

        color: #64748b;

        line-height: 1.8;

        margin-bottom: 20px;

    }

    .destination-link {

        color: #d97706;

        font-weight: 700;

        display: inline-flex;

        align-items: center;

        gap: 8px;

        transition: .3s;

    }

    .destination-card:hover .destination-link {

        gap: 12px;

    }