    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    :root {
        --p:  #77258d;
        --pd:  #581b69;
        --pl: #EEEDFE;
        --pm: #a47fad;
        --t: #1D9E75;
        --tl: #E1F5EE;

        --tx: #171625;
        --txm: #5f5b70;
        --bg: #fcfbff;
        --bg2: #f4f0fa;
        --bg3: #eef9f4;
        --surface: #ffffff;
        --bd: #e7e0ef;
        --bds: #d4cae1;

        --r: 14px;
        --rx: 20px;
        --shadow: 0 18px 45px rgba(20, 18, 50, 0.08);
    }

    html {
        scroll-behavior: smooth;
    }

    body {
        font-family: "DM Sans", Arial, sans-serif;
        color: var(--tx);
        background: var(--bg2);
        font-size: 17px;
        line-height: 1.62;
    }

    button,
    input {
        font-family: inherit;
    }

    button {
        cursor: pointer;
    }

    img {
        max-width: 100%;
    }

    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .nav {
        height: 64px;
        padding: 0 2rem;
        border-bottom: 1px solid var(--bd);
        background: rgba(252, 251, 255, 0.94);
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
        position: sticky;
        top: 0;
        z-index: 100;
    }

    .nav-inner {
        height: 100%;
        max-width: 1180px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
    }

    .nav-logo {
        font-size: 18px;
        font-weight: 700;
        color: var(--pd);
        display: flex;
        align-items: center;
        gap: 10px;
        text-decoration: none;
        white-space: nowrap;
    }

    .nav-logo img {
        width: 154px;
        height: auto;
        max-height: 44px;
        object-fit: contain;
        display: block;
        flex-shrink: 0;
    }

    .nav-links {
        display: flex;
        align-items: center;
        gap: 1.5rem;
    }

    .nav-links a {
        font-size: 13px;
        font-weight: 500;
        color: var(--txm);
        text-decoration: none;
    }

    .nav-links a:hover {
        color: var(--p);
    }

    .nav-actions {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .btn-nav,
    .btn-nav-ghost,
    .btn-hero,
    .btn-hero-ghost,
    .btn-book,
    .btn-outline,
    .btn-cta {
        border: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        text-decoration: none;
        transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
        white-space: nowrap;
    }

    .btn-nav:hover,
    .btn-hero:hover,
    .btn-book:hover,
    .btn-cta:hover,
    .btn-outline:hover,
    .btn-nav-ghost:hover,
    .btn-hero-ghost:hover {
        transform: translateY(-1px);
    }

    .btn-nav {
        background: var(--p);
        color: #fff;
        padding: 8px 20px;
        border-radius: 100px;
        font-size: 13px;
        font-weight: 600;
    }

    .btn-nav:hover {
        background: var(--pd);
    }

    .btn-nav-ghost {
        background: transparent;
        border: 1px solid var(--bds);
        color: var(--tx);
        padding: 8px 16px;
        border-radius: 100px;
        font-size: 13px;
        font-weight: 600;
    }

    .nav-mobile {
        display: none;
        width: 40px;
        height: 40px;
        background: var(--bg2);
        border: 1px solid var(--bd);
        border-radius: 50%;
        color: var(--tx);
        font-size: 22px;
        align-items: center;
        justify-content: center;
    }

    .mobile-menu {
        display: block;
        position: absolute;
        top: 64px;
        left: 0;
        right: 0;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transform: translateY(-10px);
        pointer-events: none;
        border-top: 0 solid transparent;
        background: rgba(252, 251, 255, 0.98);
        box-shadow: 0 18px 35px rgba(20, 18, 50, 0.10);
        padding: 0 2rem;
        transition: max-height .34s ease, opacity .24s ease, transform .34s ease, padding .34s ease, border-color .34s ease;
    }

    .mobile-menu.open {
        max-height: 560px;
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
        border-top-width: 1px;
        border-top-color: var(--bd);
        padding: 14px 2rem 18px;
    }

    .mobile-menu a {
        display: block;
        color: var(--txm);
        text-decoration: none;
        font-size: 14px;
        padding: 10px 0;
        transition: color .18s ease, transform .18s ease;
    }

    .mobile-menu a:hover {
        color: var(--p);
        transform: translateX(3px);
    }

    .hero {
        background: #26215C;
        position: relative;
        overflow: hidden;
        padding: 86px 2rem 92px;
    }

    .hero-bg {
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, rgba(38, 33, 92, 0.94), rgba(38, 33, 92, 0.68)),
            url("https://images.unsplash.com/photo-1488085061387-422e29b40080?w=1600&q=80") center/cover no-repeat;
    }

    .hero-inner {
        position: relative;
        z-index: 1;
        max-width: 1180px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 46px;
    }

    .hero-content {
        max-width: 560px;
    }

    .hero-pill {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: rgba(255, 255, 255, 0.12);
        color: rgba(255, 255, 255, 0.9);
        font-size: 11px;
        padding: 6px 14px;
        border-radius: 100px;
        margin-bottom: 22px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        letter-spacing: 0.8px;
        text-transform: uppercase;
    }

    .hero h1 {
        font-size: clamp(34px, 5vw, 64px);
        font-weight: 700;
        color: #fff;
        line-height: 1.05;
        margin-bottom: 18px;
        letter-spacing: -0.02em;
    }

    .hero h1 span {
        color: var(--pm);
    }

    .hero p {
        color: rgba(255, 255, 255, 0.72);
        font-size: 16px;
        line-height: 1.8;
        margin-bottom: 32px;
        max-width: 480px;
    }

    .hero-btns {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
    }

    .btn-hero {
        background: #fff;
        color: var(--pd);
        padding: 12px 28px;
        border-radius: 100px;
        font-size: 14px;
        font-weight: 700;
    }

    .btn-hero-ghost {
        background: rgba(255, 255, 255, 0.08);
        color: #fff;
        border: 1px solid rgba(255, 255, 255, 0.34);
        padding: 12px 28px;
        border-radius: 100px;
        font-size: 14px;
        font-weight: 600;
    }

    .hero-stats {
        display: grid;
        gap: 12px;
        width: 180px;
    }

    .hstat {
        background: rgba(255, 255, 255, 0.1);
        border: 1px solid rgba(255, 255, 255, 0.16);
        border-radius: var(--r);
        padding: 18px 22px;
        text-align: center;
    }

    .hstat-n {
        font-size: 28px;
        font-weight: 700;
        color: #fff;
    }

    .hstat-l {
        font-size: 11px;
        color: rgba(255, 255, 255, 0.62);
        margin-top: 3px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .section {
        padding: 68px 2rem;
        background: var(--bg);
    }

    .section.alt {
        background: linear-gradient(135deg, var(--bg2), var(--bg3));
    }

    .section-inner {
        max-width: 1180px;
        margin: 0 auto;
    }

    .sec-label {
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: var(--p);
        font-weight: 700;
        margin-bottom: 8px;
    }

    .sec-title {
        font-size: clamp(24px, 2.5vw, 34px);
        font-weight: 700;
        color: var(--tx);
        margin-bottom: 10px;
        letter-spacing: -0.02em;
    }

    .sec-sub {
        color: var(--txm);
        font-size: 14px;
        line-height: 1.75;
        max-width: 520px;
        margin-bottom: 36px;
    }

    .sec-hdr {
        text-align: center;
    }

    .sec-hdr .sec-sub {
        margin-left: auto;
        margin-right: auto;
    }

    .dest-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px;
    }

    .dest-card,
    .pkg-card {
        border-radius: var(--rx);
        overflow: hidden;
        border: 1px solid var(--bd);
        background: var(--bg);
        box-shadow: var(--shadow);
        transition: transform 0.2s ease, border-color 0.2s ease;
    }

    .dest-card:hover,
    .pkg-card:hover {
        transform: translateY(-3px);
        border-color: var(--bds);
    }

    .dest-img {
        width: 100%;
        height: 210px;
        object-fit: cover;
        display: block;
    }

    .dest-body {
        padding: 17px;
    }

    .dest-top {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: 6px;
        gap: 12px;
    }

    .dest-country {
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: var(--p);
        font-weight: 700;
    }

    .dest-stars,
    .pkg-stars {
        display: flex;
        gap: 1px;
        color: #EF9F27;
    }

    .dest-stars i,
    .pkg-stars i {
        font-size: 12px;
    }

    .dest-name {
        font-size: 16px;
        font-weight: 700;
        color: var(--tx);
        margin-bottom: 5px;
    }

    .dest-text {
        font-size: 13px;
        color: var(--txm);
        line-height: 1.65;
    }

    .pkg-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px;
    }

    .pkg-img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        display: block;
    }

    .pkg-body {
        padding: 20px;
    }

    .pkg-title {
        font-size: 16px;
        font-weight: 700;
        color: var(--tx);
        margin-bottom: 8px;
    }

    .pkg-text {
        font-size: 13px;
        color: var(--txm);
        line-height: 1.65;
        margin-bottom: 15px;
    }

    .pkg-chips {
        display: flex;
        gap: 7px;
        flex-wrap: wrap;
    }

    .chip {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: 11px;
        color: var(--txm);
        background: var(--bg2);
        border: 1px solid var(--bd);
        padding: 5px 10px;
        border-radius: 100px;
    }

    .chip i {
        font-size: 13px;
        color: var(--p);
    }

    .pkg-footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 20px;
        border-top: 1px solid var(--bd);
        gap: 16px;
    }

    .pkg-rating {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .pkg-rev {
        font-size: 11px;
        color: var(--txm);
    }

    .btn-book {
        background: var(--p);
        color: #fff;
        padding: 8px 18px;
        border-radius: 100px;
        font-size: 12px;
        font-weight: 700;
    }

    .btn-book:hover {
        background: var(--pd);
    }

    .gallery-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 200px;
        gap: 12px;
    }

    .gtile {
        border-radius: var(--r);
        overflow: hidden;
        background: var(--bg2);
    }

    .gtile img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .gtile:nth-child(3) {
        grid-row: span 2;
    }

    .cta-section {
        background: var(--pd);
        padding: 74px 2rem;
        text-align: center;
    }

    .cta-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: rgba(255, 255, 255, 0.12);
        color: rgba(255, 255, 255, 0.84);
        font-size: 11px;
        padding: 6px 14px;
        border-radius: 100px;
        margin-bottom: 20px;
        letter-spacing: 0.8px;
        text-transform: uppercase;
        border: 1px solid rgba(255, 255, 255, 0.2);
    }

    .cta-section h2 {
        font-size: clamp(26px, 3vw, 40px);
        font-weight: 700;
        color: #fff;
        margin-bottom: 12px;
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
    }

    .cta-section p {
        color: rgba(255, 255, 255, 0.68);
        font-size: 15px;
        max-width: 470px;
        margin: 0 auto 32px;
        line-height: 1.75;
    }

    .btn-cta {
        background: #fff;
        color: var(--pd);
        padding: 14px 36px;
        border-radius: 100px;
        font-size: 14px;
        font-weight: 700;
    }

    .footer {
        border-top: 1px solid var(--bd);
        padding: 56px 2rem 24px;
        background: linear-gradient(135deg, var(--bg2), #f8fbf6);
    }

    .footer-inner {
        max-width: 1180px;
        margin: 0 auto;
    }

    .footer-grid {
        display: grid;
        grid-template-columns: 1.7fr 1fr 1fr 1fr;
        gap: 34px;
        margin-bottom: 40px;
    }

    .flogo {
        font-size: 18px;
        font-weight: 700;
        color: var(--pd);
        margin-bottom: 12px;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .flogo img {
        width: 178px;
        height: auto;
        max-height: 58px;
        object-fit: contain;
        display: block;
        flex-shrink: 0;
    }

    .fdesc {
        font-size: 13px;
        color: var(--txm);
        line-height: 1.75;
        max-width: 250px;
        margin-bottom: 16px;
    }

    .fsocials {
        display: flex;
        gap: 8px;
    }

    .fsoc {
        width: 34px;
        height: 34px;
        border-radius: 50%;
        border: 1px solid var(--bd);
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--txm);
        font-size: 16px;
        text-decoration: none;
    }

    .fsoc:hover {
        border-color: var(--p);
        color: var(--p);
    }

    .fcol h4 {
        font-size: 11px;
        font-weight: 700;
        color: var(--tx);
        margin-bottom: 14px;
        text-transform: uppercase;
        letter-spacing: 0.6px;
    }

    .fcol a {
        display: block;
        font-size: 13px;
        color: var(--txm);
        text-decoration: none;
        margin-bottom: 9px;
    }

    .fcol a:hover {
        color: var(--p);
    }

    .fnews p {
        font-size: 13px;
        color: var(--txm);
        margin-bottom: 12px;
        line-height: 1.65;
    }

    .fnews-row {
        display: flex;
        gap: 8px;
    }

    .fnews-row input {
        min-width: 0;
        flex: 1;
        border: 1px solid var(--bd);
        border-radius: 10px;
        padding: 10px 12px;
        font-size: 13px;
        background: var(--bg2);
        color: var(--tx);
        outline: none;
    }

    .fnews-row input:focus {
        border-color: var(--p);
    }

    .fnews-row button {
        background: var(--p);
        color: #fff;
        border: none;
        padding: 10px 16px;
        border-radius: 10px;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
    }

    .fbot {
        border-top: 1px solid var(--bd);
        padding-top: 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
    }

    .fbot p,
    .fbot-links a {
        font-size: 12px;
        color: var(--txm);
    }

    .fbot-links {
        display: flex;
        gap: 16px;
    }

    .fbot-links a {
        text-decoration: none;
    }

    .fbot-links a:hover {
        color: var(--p);
    }

    .nav-links a.active,
    .mobile-menu a.active {
        color: var(--p);
        font-weight: 700;
    }

    .flogo {
        text-decoration: none;
    }

    .page-hero {
        position: relative;
        overflow: hidden;
        background: #26215C;
        padding: 78px 2rem;
    }

    .page-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background:
            linear-gradient(90deg, rgba(38, 33, 92, .94), rgba(38, 33, 92, .72)),
            var(--page-bg, url("../images/hero-banner.jpg")) center/cover no-repeat;
    }

    .page-hero-inner {
        position: relative;
        z-index: 1;
        max-width: 1180px;
        margin: 0 auto;
    }

    .crumbs {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        margin-bottom: 18px;
        color: rgba(255, 255, 255, .7);
        font-size: 12px;
    }

    .crumbs a {
        color: #fff;
        text-decoration: none;
        font-weight: 700;
    }

    .page-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(255, 255, 255, .12);
        color: rgba(255, 255, 255, .88);
        border: 1px solid rgba(255, 255, 255, .2);
        padding: 6px 14px;
        border-radius: 100px;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .8px;
        margin-bottom: 18px;
    }

    .page-title {
        font-size: clamp(34px, 5vw, 58px);
        line-height: 1.05;
        max-width: 720px;
        color: #fff;
        letter-spacing: -0.02em;
        margin-bottom: 16px;
    }

    .page-copy {
        max-width: 620px;
        color: rgba(255, 255, 255, .74);
        font-size: 16px;
        line-height: 1.8;
    }

    .page-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 28px;
    }

    .mini-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
        margin-top: 34px;
        max-width: 620px;
    }

    .mini-stat {
        background: rgba(255, 255, 255, .1);
        border: 1px solid rgba(255, 255, 255, .16);
        border-radius: var(--r);
        padding: 16px;
    }

    .mini-stat strong {
        color: #fff;
        display: block;
        font-size: 24px;
        line-height: 1;
    }

    .mini-stat span {
        display: block;
        color: rgba(255, 255, 255, .64);
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .6px;
        margin-top: 6px;
    }

    .split-grid {
        display: grid;
        grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
        gap: 36px;
        align-items: center;
    }

    .split-media {
        border-radius: var(--rx);
        overflow: hidden;
        border: 1px solid var(--bd);
        box-shadow: var(--shadow);
        background: var(--bg2);
    }

    .split-media img {
        width: 100%;
        height: 430px;
        object-fit: cover;
        display: block;
    }

    .body-copy {
        color: var(--txm);
        font-size: 15px;
        line-height: 1.85;
        margin-bottom: 18px;
    }

    .feature-grid,
    .value-grid,
    .contact-grid,
    .legal-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px;
    }

    .feature-card,
    .value-card,
    .contact-card,
    .legal-card,
    .prose-card {
        background: var(--bg);
        border: 1px solid var(--bd);
        border-radius: var(--rx);
        box-shadow: var(--shadow);
        padding: 24px;
    }

    .feature-icon,
    .value-icon,
    .contact-icon {
        width: 44px;
        height: 44px;
        border-radius: 14px;
        display: grid;
        place-items: center;
        background: var(--pl);
        color: var(--p);
        font-size: 23px;
        margin-bottom: 18px;
    }

    .feature-card h3,
    .value-card h3,
    .contact-card h3,
    .legal-card h3,
    .prose-card h2 {
        color: var(--tx);
        font-size: 18px;
        margin-bottom: 9px;
    }

    .feature-card p,
    .value-card p,
    .contact-card p,
    .legal-card p,
    .prose-card p,
    .prose-card li {
        color: var(--txm);
        font-size: 14px;
        line-height: 1.75;
    }

    .story-strip {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1px;
        overflow: hidden;
        border-radius: var(--rx);
        border: 1px solid var(--bd);
        background: var(--bd);
        box-shadow: var(--shadow);
    }

    .story-strip div {
        background: #fff;
        padding: 22px;
    }

    .story-strip strong {
        display: block;
        color: var(--p);
        font-size: 26px;
        margin-bottom: 5px;
    }

    .story-strip span {
        color: var(--txm);
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: .6px;
    }

    .destination-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px;
    }

    .destination-card {
        background: var(--bg);
        border: 1px solid var(--bd);
        border-radius: var(--rx);
        box-shadow: var(--shadow);
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .destination-card img {
        width: 100%;
        height: 220px;
        object-fit: cover;
        display: block;
    }

    .destination-card-body {
        padding: 20px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        flex: 1;
    }

    .destination-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .meta-pill {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: var(--bg2);
        border: 1px solid var(--bd);
        color: var(--txm);
        border-radius: 100px;
        padding: 5px 10px;
        font-size: 11px;
        font-weight: 600;
    }

    .destination-card h3 {
        font-size: 19px;
        color: var(--tx);
    }

    .destination-card p {
        color: var(--txm);
        font-size: 14px;
        line-height: 1.7;
    }

    .route-list {
        display: grid;
        gap: 12px;
    }

    .route-item {
        display: grid;
        grid-template-columns: 38px 1fr;
        gap: 12px;
        padding: 14px;
        border-radius: var(--r);
        border: 1px solid var(--bd);
        background: var(--bg);
    }

    .route-item i {
        width: 38px;
        height: 38px;
        display: grid;
        place-items: center;
        background: var(--tl);
        color: var(--t);
        border-radius: 12px;
        font-size: 20px;
    }

    .route-item strong {
        display: block;
        color: var(--tx);
        margin-bottom: 3px;
    }

    .route-item span {
        color: var(--txm);
        font-size: 13px;
        line-height: 1.55;
    }

    .package-feature {
        border: 1px solid var(--bd);
        border-radius: var(--rx);
        background: var(--bg);
        box-shadow: var(--shadow);
        overflow: hidden;
        display: grid;
        grid-template-columns: .9fr 1.1fr;
        margin-bottom: 22px;
    }

    .package-feature img {
        width: 100%;
        height: 100%;
        min-height: 320px;
        object-fit: cover;
    }

    .package-feature-body {
        padding: 28px;
    }

    .package-feature-body h3 {
        font-size: clamp(23px, 3vw, 32px);
        line-height: 1.12;
        margin-bottom: 10px;
    }

    .package-list {
        display: grid;
        gap: 12px;
        margin: 18px 0 24px;
    }

    .package-list li {
        list-style: none;
        display: flex;
        gap: 9px;
        color: var(--txm);
        font-size: 14px;
    }

    .package-list i {
        color: var(--t);
        font-size: 18px;
        flex-shrink: 0;
        margin-top: 1px;
    }

    .package-card-click {
        position: relative;
    }

    .package-card-click:hover {
        cursor: pointer;
    }

    .package-card-link {
        position: absolute;
        inset: 0;
        z-index: 1;
        border-radius: inherit;
    }

    .package-card-click .pkg-footer {
        flex-wrap: wrap;
    }

    .package-card-click .btn-book,
    .package-card-click .btn-details {
        position: relative;
        z-index: 2;
    }

    .btn-details {
        padding: 8px 14px;
        font-size: 12px;
    }

    .package-detail-feature {
        margin-bottom: 22px;
    }

    .package-detail-chips {
        margin: 18px 0 22px;
    }

    .package-detail-actions {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
        margin-top: 18px;
    }

    .package-detail-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, .82fr);
        gap: 20px;
        margin-bottom: 20px;
    }

    .package-itinerary-card,
    .package-alert {
        margin-bottom: 22px;
    }

    .package-list-excluded i {
        color: #B42318;
    }

    .gallery-page-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-auto-rows: 210px;
        gap: 12px;
    }

    .gallery-page-tile {
        border: none;
        padding: 0;
        border-radius: var(--r);
        overflow: hidden;
        background: var(--bg2);
        position: relative;
        display: block;
    }

    .gallery-page-tile:nth-child(1),
    .gallery-page-tile:nth-child(6) {
        grid-column: span 2;
        grid-row: span 2;
    }

    .gallery-page-tile img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform .25s ease;
    }

    .gallery-page-tile:hover img {
        transform: scale(1.04);
    }

    .lightbox {
        position: fixed;
        inset: 0;
        background: rgba(23, 22, 37, .82);
        z-index: 200;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 24px;
    }

    .lightbox.open {
        display: flex;
    }

    .lightbox-panel {
        max-width: 980px;
        width: 100%;
        position: relative;
    }

    .lightbox-panel img {
        width: 100%;
        max-height: 78vh;
        object-fit: contain;
        border-radius: var(--r);
        background: #fff;
    }

    .lightbox-close {
        position: absolute;
        top: -18px;
        right: -18px;
        width: 42px;
        height: 42px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, .28);
        background: #fff;
        color: var(--tx);
        font-size: 22px;
    }

    .contact-layout {
        display: grid;
        grid-template-columns: .9fr 1.1fr;
        gap: 24px;
        align-items: start;
    }

    .contact-form {
        background: var(--bg);
        border: 1px solid var(--bd);
        border-radius: var(--rx);
        box-shadow: var(--shadow);
        padding: 26px;
        display: grid;
        gap: 16px;
    }

    .form-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }

    .form-field {
        display: grid;
        gap: 7px;
    }

    .form-field label {
        font-size: 12px;
        color: var(--tx);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .5px;
    }

    .form-field input,
    .form-field select,
    .form-field textarea {
        width: 100%;
        border: 1px solid var(--bd);
        background: var(--bg2);
        border-radius: 12px;
        padding: 12px 13px;
        font: inherit;
        color: var(--tx);
        outline: none;
    }

    .form-field textarea {
        min-height: 140px;
        resize: vertical;
    }

    .form-field input:focus,
    .form-field select:focus,
    .form-field textarea:focus {
        border-color: var(--p);
        background: #fff;
    }

    .form-note {
        color: var(--t);
        font-size: 12px;
        margin-top: 8px;
    }

    .form-note.error {
        color: #B42318;
    }

    .form-note.success {
        color: var(--t);
    }

    .faq-wrap {
        display: grid;
        gap: 12px;
        max-width: 860px;
        margin: 0 auto;
    }

    .faq-intro {
        max-width: 860px;
        margin: 0 auto 18px;
    }

    .faq-item {
        background: var(--bg);
        border: 1px solid var(--bd);
        border-radius: var(--r);
        box-shadow: var(--shadow);
        overflow: hidden;
    }

    .faq-question {
        width: 100%;
        border: none;
        background: transparent;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 14px;
        padding: 19px 22px;
        color: var(--tx);
        font-weight: 700;
        font-size: 15px;
        text-align: left;
    }

    .faq-question i {
        color: var(--p);
        font-size: 22px;
        transition: transform .2s ease;
        flex-shrink: 0;
    }

    .faq-answer {
        display: none;
        padding: 0 22px 20px;
        color: var(--txm);
        font-size: 14px;
        line-height: 1.75;
    }

    .faq-item.open .faq-answer {
        display: block;
    }

    .faq-item.open .faq-question i {
        transform: rotate(45deg);
    }

    .legal-layout {
        display: grid;
        grid-template-columns: 260px minmax(0, 1fr);
        gap: 24px;
        align-items: start;
    }

    .toc-card {
        position: sticky;
        top: 86px;
        background: var(--bg);
        border: 1px solid var(--bd);
        border-radius: var(--rx);
        box-shadow: var(--shadow);
        padding: 18px;
    }

    .toc-card h3 {
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: .7px;
        margin-bottom: 12px;
    }

    .toc-card a {
        display: block;
        color: var(--txm);
        text-decoration: none;
        font-size: 13px;
        padding: 8px 0;
    }

    .toc-card a:hover {
        color: var(--p);
    }

    .prose-card {
        padding: 30px;
    }

    .prose-card p + h2,
    .prose-card ul + h2 {
        margin-top: 24px;
        padding-top: 20px;
        border-top: 1px solid var(--bd);
    }

    .prose-card section + section {
        margin-top: 28px;
        padding-top: 24px;
        border-top: 1px solid var(--bd);
    }

    .prose-card ul {
        margin: 12px 0 0 18px;
    }

    .view-all {
        text-align: center;
        margin-top: 30px;
    }

    .btn-outline {
        background: var(--bg);
        border: 1px solid var(--bds);
        color: var(--tx);
        padding: 11px 28px;
        border-radius: 100px;
        font-size: 13px;
        font-weight: 700;
    }

    .btn-outline:hover {
        border-color: var(--p);
        color: var(--p);
    }

    /* Readability and softer page rhythm */
    .nav-links a,
    .mobile-menu a {
        font-size: 15px;
    }

    .btn-nav,
    .btn-nav-ghost,
    .btn-hero,
    .btn-hero-ghost,
    .btn-book,
    .btn-outline,
    .btn-cta,
    .fnews-row input,
    .fnews-row button {
        font-size: 14.5px;
    }

    .hero p,
    .page-copy,
    .sec-sub,
    .body-copy,
    .cta-section p,
    .dest-text,
    .pkg-text,
    .destination-card p,
    .route-item span,
    .feature-card p,
    .value-card p,
    .contact-card p,
    .legal-card p,
    .prose-card p,
    .prose-card li,
    .faq-answer,
    .form-field input,
    .form-field select,
    .form-field textarea,
    .fdesc,
    .fnews p {
        font-size: 15.5px;
    }

    .fcol a,
    .fbot p,
    .fbot-links a {
        font-size: 14.5px;
    }

    .sec-label,
    .page-eyebrow,
    .dest-country,
    .chip,
    .meta-pill,
    .fcol h4,
    .form-field label,
    .toc-card h3 {
        font-size: 12.5px;
    }

    .dest-name,
    .pkg-title,
    .feature-card h3,
    .value-card h3,
    .contact-card h3,
    .legal-card h3,
    .prose-card h2 {
        font-size: 19px;
    }

    @media (max-width: 960px) {

        .nav-links,
        .nav-actions .btn-nav,
        .nav-actions .btn-nav-ghost {
            display: none;
        }

        .nav-mobile {
            display: inline-flex;
        }

        .hero-inner {
            flex-direction: column;
            align-items: flex-start;
        }

        .hero-stats {
            width: 100%;
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }

        .dest-grid,
        .pkg-grid {
            grid-template-columns: 1fr 1fr;
        }

        .footer-grid {
            grid-template-columns: 1fr 1fr;
        }

        .split-grid,
        .package-feature,
        .package-detail-grid,
        .contact-layout,
        .legal-layout {
            grid-template-columns: 1fr;
        }

        .feature-grid,
        .value-grid,
        .contact-grid,
        .destination-grid {
            grid-template-columns: 1fr 1fr;
        }

        .story-strip {
            grid-template-columns: 1fr 1fr;
        }

        .gallery-page-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .gallery-page-tile:nth-child(1),
        .gallery-page-tile:nth-child(6) {
            grid-column: span 1;
            grid-row: span 1;
        }

        .toc-card {
            position: static;
        }
    }

    @media (max-width: 640px) {
        .nav {
            padding: 0 1rem;
        }

        .mobile-menu {
            padding-left: 1rem;
            padding-right: 1rem;
        }

        .hero {
            padding: 62px 1rem 72px;
        }

        .section {
            padding: 46px 1rem;
        }

        .dest-grid,
        .pkg-grid {
            grid-template-columns: 1fr;
        }

        .hero-stats {
            grid-template-columns: 1fr;
        }

        .gallery-grid {
            grid-template-columns: 1fr 1fr;
            grid-auto-rows: 170px;
        }

        .gtile:nth-child(3) {
            grid-row: span 1;
        }

        .footer {
            padding: 42px 1rem 20px;
        }

        .footer-grid {
            grid-template-columns: 1fr;
            gap: 26px;
        }

        .fnews-row {
            flex-direction: column;
        }

        .cta-section {
            padding: 58px 1rem;
        }

        .fbot {
            flex-direction: column;
            align-items: flex-start;
        }

        .page-hero {
            padding: 58px 1rem;
        }

        .mini-stats,
        .feature-grid,
        .value-grid,
        .contact-grid,
        .destination-grid,
        .story-strip,
        .form-row {
            grid-template-columns: 1fr;
        }

        .split-media img {
            height: 300px;
        }

        .package-feature img {
            min-height: 240px;
        }

        .gallery-page-grid {
            grid-template-columns: 1fr;
            grid-auto-rows: 230px;
        }

        .contact-form,
        .prose-card {
            padding: 20px;
        }

        .lightbox-close {
            top: 10px;
            right: 10px;
        }
    }
