/* ==========================================================================
   Typography & Custom Fonts (Rule 3)
   - Custom Heading Font: Metromedium 2 W02 Roman (loaded locally from /fonts)
   - Signature Accent Font: Beyond The Mountains (optimized WOFF2/WOFF from /fonts)
   - Body & General Content Font: Roboto (loaded locally from /fonts)
   ========================================================================== */

@font-face {
    font-family: "Roboto";
    src: url("../fonts/Roboto-Variable-Latin.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-stretch: 100%;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url("../fonts/Roboto-Italic-Variable-Latin.woff2") format("woff2");
    font-weight: 100 900;
    font-style: italic;
    font-stretch: 100%;
    font-display: swap;
}

@font-face {
    font-family: "Metromedium";
    src: url("../fonts/Metromedium.eot");
    src: url("../fonts/Metromedium.eot?#iefix") format("embedded-opentype"),
         url("../fonts/Metromedium.woff2") format("woff2"),
         url("../fonts/Metromedium.woff") format("woff"),
         url("../fonts/Metromedium.ttf") format("truetype"),
         url("../fonts/Metromedium.svg#Metromedium") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Metromedium 2 W02 Roman";
    src: url("../fonts/Metromedium.eot");
    src: url("../fonts/Metromedium.eot?#iefix") format("embedded-opentype"),
         url("../fonts/Metromedium.woff2") format("woff2"),
         url("../fonts/Metromedium.woff") format("woff"),
         url("../fonts/Metromedium.ttf") format("truetype"),
         url("../fonts/Metromedium.svg#Metromedium") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Optimized signature font used only for selected editorial accents. */
@font-face {
    font-family: "Beyond The Mountains";
    src: url("../fonts/beyond-the-mountains-regular.woff2") format("woff2"),
         url("../fonts/beyond-the-mountains-regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+2215;
}

/* Agents Directive: all interface corners use the required 7px radius. */

:root {
    --bs-border-radius: 7px !important;
    --bs-border-radius-sm: 7px !important;
    --bs-border-radius-lg: 7px !important;
    --bs-border-radius-xl: 7px !important;
    --bs-border-radius-xxl: 7px !important;
    --bs-border-radius-2xl: 7px !important;
    --bs-border-radius-pill: 7px !important;

    /* Font Family Definitions */
    --font-heading: "Metromedium", "Roboto", sans-serif;
    --font-body: "Roboto", Arial, Helvetica, sans-serif;
    --font-signature: "Beyond The Mountains", "Metromedium", cursive;

    --csp-primary: #f10100;
    --csp-primary-dark: #f10100;
    --csp-blue: #1e88ff;
    --csp-blue-dark: #000000;
    --csp-dark: #090909;
    --csp-text: #5d5d5d;
    --csp-muted: #818181;
    --csp-light: #f7f7f5;
    --csp-white: #ffffff;
    --csp-border: #e8e8e4;
    --blog-primary: #f10100;
    --blog-primary-dark: #f10100;
    --blog-blue: #1e88ff;
    --blog-blue-dark: #000000;
    --blog-dark: #171717;
    --blog-text: #5d5d5d;
    --blog-muted: #818181;
    --blog-light: #f7f7f5;
    --blog-soft: #fffaf5;
    --blog-white: #ffffff;
    --blog-border: #e8e8e4;
    --tour-primary: #f10100;
    --tour-primary-dark: #f10100;
    --tour-dark: #171717;
    --tour-text: #5d5d5d;
    --tour-muted: #818181;
    --tour-light: #f7f7f5;
    --tour-soft: #fffaf5;
    --tour-white: #ffffff;
    --tour-border: #e8e8e4;
    --tour-radius: 7px;
}

html {
    font-size: 16px;
    max-width: 100%;
    overflow-x: clip;
    scroll-behavior: smooth;
}

body {
    max-width: 100%;
    overflow-x: clip;
    margin: 0;
    color: var(--tour-text);
    background-color: var(--tour-white);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.7;
}

/* Page Titles and Headings - Metromedium 2 W02 Roman (Rule 3 Documentation) */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
[class*="-title"],
[class*="__title"],
[class*="-heading"],
[class*="__heading"] {
    font-family: var(--font-heading);
}

img {
    display: block;
    max-width: 100%;
}

.tour-main > .container,
.tour-extra > .container,
.tour-best-selling > .container,
.tour-excellence > .container,
.tour-social-projects > .container {
    max-width: 1440px !important;
}

a {
    color: inherit;
    text-decoration: none;
}

/* Shared tour cards */
.tour-best-selling {
    padding: 4.5rem 0;
    background-color: var(--tour-white);
}

.tour-best-selling-title {
    position: relative;
    margin: 0;
    padding-bottom: 1rem;
    color: var(--tour-dark);
    font-size: clamp(2rem, 4vw, 3.6rem);
    font-weight: 500;
    line-height: 1.05;
    text-transform: uppercase;
}

.tour-best-selling-title::after {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 4.2rem;
    height: 2px;
    background-color: var(--tour-primary);
    content: "";
    transform: translateX(-50%);
}

.tour-best-selling-shell {
    position: relative;
}

.tour-best-selling-swiper {
    overflow: hidden;
    padding: 0.25rem 0.15rem 2.4rem;
}

/* Tour Best Selling Cards - Modern Card Design with Meta Details & Llama Icon */
.tour-best-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    border-radius: 7px !important;
    background-color: #ffffff;
    box-shadow: 0 4px 18px rgba(17, 24, 39, 0.06);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.tour-best-card:hover,
.tour-best-card:focus-within {
    border-color: #cbd5e1;
    box-shadow: 0 16px 36px rgba(17, 24, 39, 0.12);
    transform: translateY(-4px);
}

.tour-best-card-media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background-color: #f1f5f9;
}

.tour-best-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-best-card:hover .tour-best-card-image,
.tour-best-card:focus-within .tour-best-card-image {
    transform: scale(1.05);
}

/* Bestseller Floating Badge */
.tour-best-card-badge {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.42rem 0.95rem;
    background-color: #f59e0b;
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.01em;
    border-radius: 7px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
}

.tour-best-card-favorite {
    position: absolute;
    top: 0.85rem;
    left: 0.85rem;
    z-index: 2;
    display: inline-flex;
    width: 2.5rem;
    height: 2.5rem;
    aspect-ratio: 1 / 1;
    align-items: center;
    justify-content: center;
    border-radius: 7px !important;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background-color: rgba(255, 255, 255, 0.92);
    color: var(--tour-dark);
    font-size: 0.95rem;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.tour-best-card-favorite:hover,
.tour-best-card-favorite:focus {
    background-color: var(--tour-primary);
    color: var(--tour-white);
    transform: scale(1.04);
}

/* The restrained map trigger stays readable without competing with the tour photography. */
.tour-best-card-map-button {
    position: absolute;
    bottom: 0.85rem;
    left: 0.85rem;
    z-index: 2;
    display: inline-flex;
    min-height: 2.5rem;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.7rem;
    border: 0;
    border-radius: 7px !important;
    background-color: rgba(15, 23, 42, 0.62);
    color: rgba(255, 255, 255, 0.9) !important;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    transition: background-color 0.2s ease, transform 0.2s ease;
}

/* Hover and keyboard states keep the compact map action clear and accessible. */
.tour-best-card-map-button:hover,
.tour-best-card-map-button:focus-visible {
    background-color: rgba(15, 23, 42, 0.82);
    color: #ffffff !important;
    transform: translateY(-1px);
}

.tour-best-card-map-button:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 2px;
}

/* Tripadvisor bubbles and review count sit quietly above the image at the opposite edge. */
.tour-best-card-review-summary {
    position: absolute;
    right: 0.85rem;
    bottom: 0.85rem;
    z-index: 2;
    display: inline-flex;
    min-height: 2.5rem;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.7rem;
    border-radius: 7px !important;
    background-color: rgba(15, 23, 42, 0.68);
    color: #ffffff;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.tour-best-card-review-bubbles {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
}

.tour-best-card-review-bubbles span {
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 7px !important;
    background-color: #34c78a;
}

.tour-best-card-review-count {
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.tour-best-card-body {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: 0;
    background-color: #ffffff;
}

/* Card Title - Centered */
.tour-best-card-title {
    margin: 0;
    padding: 1.25rem 1.25rem 1.15rem;
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.25;
    color: #0f172a;
    text-align: center;
}

.tour-best-card-title a {
    color: inherit;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

.tour-best-card-title a:hover {
    color: #ea0000;
}

/* Card Features Section (Activity Type, Physical Rating, Service Level + Llama Icon) */
.tour-best-card-features {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1.1rem 1.25rem;
    border-top: 1px solid #e5e7eb;
    background-color: #ffffff;
}

.tour-best-card-features-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1;
    min-width: 0;
}

/* Feature rows use a consistent icon, label and value grid for faster scanning. */
.tour-best-card-feature-item {
    display: grid;
    grid-template-columns: 1.15rem minmax(0, 1fr);
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.55rem 0;
    border-bottom: 1px solid #eef0f2;
    color: #4b5563;
}

.tour-best-card-feature-item:first-child {
    padding-top: 0;
}

.tour-best-card-feature-item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.tour-best-card-feature-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    flex-shrink: 0;
    margin-top: 0.22rem;
    color: #6b7280;
    font-size: 0.82rem;
}

.tour-best-card-feature-desc {
    display: grid;
    min-width: 0;
    gap: 0.1rem;
    color: #1f2937;
}

.tour-best-card-feature-desc strong {
    margin: 0;
    color: #6b7280;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    line-height: 1.2;
    text-transform: uppercase;
}

.tour-best-card-feature-desc span {
    color: #1f2937;
    font-size: 0.8rem;
    font-weight: 500;
    line-height: 1.4;
}

/* Cute Llama Icon Container */
.tour-best-card-llama {
    flex-shrink: 0;
    width: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tour-best-card-llama img {
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
}

/* Card Footer: Duration/Price and CTA Button */
.tour-best-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1.25rem 1.35rem;
    margin-top: auto;
}

.tour-best-card-price-group {
    display: flex;
    flex-direction: column;
}

.tour-best-card-price-duration {
    display: block;
    font-size: 1.05rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.tour-best-card-price-total {
    display: block;
    font-size: 1.65rem;
    font-weight: 800;
    color: #111827;
    line-height: 1.1;
    margin-top: 0.18rem;
    letter-spacing: -0.02em;
}

/* Vibrant Red CTA Button */
.tour-best-card-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.85rem;
    padding: 0.75rem 1.45rem;
    background-color: #ea0000;
    color: #ffffff !important;
    font-size: 0.86rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-radius: 7px !important;
    border: none;
    text-decoration: none !important;
    transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.tour-best-card-button:hover,
.tour-best-card-button:focus {
    background-color: #cc0000;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(234, 0, 0, 0.28);
}

.tour-best-card-button :is(i, span, strong) {
    color: var(--tour-white) !important;
}

/* ==========================================================================
   Tour Hover Card Component (Reusable interactive reveal card)
   ========================================================================== */
.tour-hover-card {
    position: relative;
    min-height: 590px;
    height: 100%;
    width: 100%;
    overflow: hidden;
    isolation: isolate;
    border-radius: 7px !important;
    background: #1d2430;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
    transition: box-shadow 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-hover-card-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -2;
    object-position: center;
    transition: filter 520ms cubic-bezier(0.16, 1, 0.3, 1), transform 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-hover-card-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 26px;
}

.tour-hover-card-overlay::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    content: "";
    background: linear-gradient(180deg, rgba(5, 10, 18, 0.12) 22%, rgba(5, 10, 18, 0.28) 52%, rgba(5, 10, 18, 0.94) 100%);
    opacity: 0.88;
    transition: opacity 420ms ease;
}

.tour-hover-card-badge {
    align-self: flex-start;
    padding: 9px 16px;
    border-radius: 7px !important;
    color: #ffffff;
    background: #f59e0b;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
    font-size: 0.7rem;
    font-weight: 400;
    letter-spacing: 0.06em;
    line-height: 1;
    text-transform: uppercase;
    transition: color 300ms ease, background-color 300ms ease;
}

.tour-hover-card-content {
    color: #ffffff;
}

.tour-hover-card-location {
    margin: 0 0 6px;
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.88rem;
    line-height: 1.35;
}

.tour-hover-card-title {
    margin: 0 0 18px;
    color: #ffffff;
    font-size: clamp(1.35rem, 2vw, 1.75rem) !important;
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.12;
}

/* Tour metadata row: duration on the left, prominent high-contrast price badge on the right */
.tour-hover-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.9rem;
}

.tour-hover-card-duration {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.92);
}

.tour-hover-card-duration i {
    color: #ffffff;
}

/* Elegant, differentiated price badge */
.tour-hover-card-price {
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    padding: 0.22rem 0.65rem;
    border-radius: 7px !important;
    background: rgb(0 0 0);
    border: 0px solid rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);
    transition: border-color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
}

.tour-hover-card-price-label {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgb(255 255 255);
}

/* The warm, restrained price value stays visible without overpowering the tour title. */
.tour-hover-card-price-value {
    color: #ffffff;
    font-size: 1.3rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
/* Subtle, refined active feedback when card is hovered */
.tour-hover-card:hover .tour-hover-card-price, .tour-hover-card:focus-within .tour-hover-card-price {
    border-color: rgba(241, 1, 0, 0.85);
    background: rgb(0 0 0);
}
.tour-hover-card-reveal {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 460ms cubic-bezier(0.16, 1, 0.3, 1), opacity 480ms ease 70ms;
}

.tour-hover-card-reveal-inner {
    overflow: hidden;
}

.tour-hover-card-reveal p {
    margin: 18px 0;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.9rem;
    line-height: 1.55;
}

.tour-hover-card-button {
    text-transform: uppercase;
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 12px 18px;
    border-radius: 7px !important;
    color: #ffffff !important;
    background: var(--csp-primary, #f10100);
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-decoration: none !important;
    transition: background-color 180ms ease, transform 180ms ease;
}
.tour-hover-card-button i {
    transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-hover-card-button:hover,
.tour-hover-card-button:focus-visible {
    color: #ffffff !important;
    background: var(--csp-primary-dark, #cc0000);
    transform: translateY(-2px);
}

.tour-hover-card-button:hover i,
.tour-hover-card-button:focus-visible i {
    transform: translateX(4px);
}

.tour-hover-card-button:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 3px;
}

.tour-hover-card:hover .tour-hover-card-image,
.tour-hover-card:focus-within .tour-hover-card-image {
    filter: saturate(0.88) brightness(0.78);
    transform: scale(1.03);
}

.tour-hover-card:hover .tour-hover-card-overlay::before,
.tour-hover-card:focus-within .tour-hover-card-overlay::before {
    opacity: 1;
}

.tour-hover-card:hover,
.tour-hover-card:focus-within {
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.22);
}

.tour-hover-card:hover .tour-hover-card-badge,
.tour-hover-card:focus-within .tour-hover-card-badge {
    color: #ffffff;
    background: #f59e0b;
}

.tour-hover-card:hover .tour-hover-card-reveal,
.tour-hover-card:focus-within .tour-hover-card-reveal {
    grid-template-rows: 1fr;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .tour-hover-card {
        min-height: 560px;
    }

    .tour-hover-card-overlay {
        padding: 22px;
    }

    .tour-hover-card-overlay::before {
        background: linear-gradient(180deg, rgba(5, 10, 18, 0.18) 10%, rgba(5, 10, 18, 0.48) 48%, rgba(5, 10, 18, 0.98) 100%);
    }

    .tour-hover-card-reveal {
        grid-template-rows: 1fr;
        opacity: 1;
    }
}

/* ==========================================================================
   Destination Card Component (Reusable destination card with background image and text overlay)
   ========================================================================== */
.destination-card {
    position: relative;
    width: 100%;
    min-height: clamp(495px, 45.5vw, 600px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 7px !important;
    background-color: #121820;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
    translate: 0 0;
    transition: translate 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease;
}

.destination-card:hover,
.destination-card:focus-within {
    translate: 0 -6px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.22);
}

/* Link wrapper spans the entire card to maximize clickability while maintaining bottom-aligned content. */
.destination-card-link {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    height: 100%;
    min-height: inherit;
    padding: clamp(1.75rem, 3vw, 2.5rem);
    text-decoration: none;
    overflow: hidden;
    border-radius: 7px !important;
}

/* Media container fills the card and holds the background image. */
.destination-card-media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
}

/* Background image uses identity transform to ensure stable stacking context on hover. */
.destination-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    scale: 1;
    transition: scale 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Hover scales the background image smoothly for a cinematic reveal. */
.destination-card:hover .destination-card-image,
.destination-card:focus-within .destination-card-image {
    scale: 1.08;
}

/* Dark gradient overlay guarantees text legibility over any destination photo. */
.destination-card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(9, 9, 9, 0.12) 0%, rgba(9, 9, 9, 0.42) 50%, rgba(9, 9, 9, 0.88) 100%);
    transition: background 0.45s ease;
}

.destination-card:hover .destination-card-overlay,
.destination-card:focus-within .destination-card-overlay {
    background: linear-gradient(180deg, rgba(9, 9, 9, 0.05) 0%, rgba(9, 9, 9, 0.35) 45%, rgba(9, 9, 9, 0.94) 100%);
}

/* Text and button container sits above the overlay with smooth vertical float on hover. */
.destination-card-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    translate: 0 0;
    transition: translate 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.destination-card:hover .destination-card-content,
.destination-card:focus-within .destination-card-content {
    translate: 0 -6px;
}

/* Destination title uses heading face with high contrast against the dark overlay. */
.destination-card-title {
    margin: 0 0 0.85rem;
    color: #ffffff;
    font-family: var(--font-heading, "Metromedium", "Roboto", sans-serif);
    font-size: clamp(1.4rem, 2vw, 1.85rem);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.18;
    text-wrap: balance;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

/* Reveal container for supporting destination text revealed smoothly on hover. */
.destination-card-reveal {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    translate: 0 8px;
    transition: grid-template-rows 0.42s cubic-bezier(0.16, 1, 0.3, 1),
                opacity 0.38s ease,
                translate 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}

.destination-card:hover .destination-card-reveal,
.destination-card:focus-within .destination-card-reveal {
    grid-template-rows: 1fr;
    opacity: 1;
    translate: 0 0;
}

/* Inner reveal wrapper clips overflowing content during grid row expansion. */
.destination-card-reveal-inner {
    overflow: hidden;
}

/* Supporting destination description text styled with high contrast and readable line measure. */
.destination-card-desc {
    margin: 0 0 1.25rem;
    color: rgba(255, 255, 255, 0.9);
    font-family: var(--font-body, "Roboto", Arial, sans-serif);
    font-size: 0.92rem;
    font-weight: 400;
    line-height: 1.6;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}

@media (hover: none), (prefers-reduced-motion: reduce) {
    .destination-card-reveal {
        grid-template-rows: 1fr;
        opacity: 1;
        translate: 0 0;
    }
}

/* View Trips action button with 7px rounded corners and smooth color shift. */
.destination-card-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.75rem 1.45rem;
    background-color: #ffffff;
    color: #090909;
    font-family: var(--font-body, "Roboto", Arial, sans-serif);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 7px !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
    transition: background-color 0.35s ease, color 0.35s ease, box-shadow 0.35s ease;
}

.destination-card:hover .destination-card-btn,
.destination-card:focus-within .destination-card-btn {
    background-color: var(--csp-primary, #f10100);
    color: #ffffff;
    box-shadow: 0 8px 24px rgba(241, 1, 0, 0.35);
}

/* Arrow icon slides forward on hover for interactive affordance. */
.destination-card-btn i {
    font-size: 0.78rem;
    translate: 0 0;
    transition: translate 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.destination-card:hover .destination-card-btn i,
.destination-card:focus-within .destination-card-btn i {
    translate: 4px 0;
}

.tour-best-arrow {
    position: absolute;
    top: 50%;
    z-index: 4;
    display: inline-flex;
    width: 2.8rem;
    height: 2.8rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--tour-border);
    background-color: var(--tour-white);
    color: var(--tour-dark);
    font-size: 1rem;
    box-shadow: 0 12px 28px rgba(17, 24, 39, 0.1);
    transform: translateY(-50%);
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.tour-best-arrow:hover,
.tour-best-arrow:focus {
    border-color: var(--tour-primary);
    background-color: var(--tour-primary);
    color: var(--tour-white);
}

.tour-best-prev {
    left: -1.4rem;
}

.tour-best-next {
    right: -1.4rem;
}

.tour-best-pagination {
    position: static;
    display: flex;
    justify-content: center;
    gap: 0.55rem;
    margin-top: 1rem;
}

.tour-best-pagination .swiper-pagination-bullet {
    width: 0.7rem;
    height: 0.7rem;
    margin: 0;
    border-radius: var(--tour-radius);
    background-color: #d7d9dc;
    opacity: 1;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.tour-best-pagination .swiper-pagination-bullet-active {
    background-color: var(--tour-primary);
    transform: scale(1.08);
}

@media (max-width: 767.98px) {
    .tour-best-selling {
        padding: 3rem 0;
    }

    .tour-best-arrow {
        top: 46%;
        width: 2.45rem;
        height: 2.45rem;
    }

    .tour-best-prev {
        left: 0.25rem;
    }

    .tour-best-next {
        right: 0.25rem;
    }

    .tour-best-card-footer {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .tour-best-card-button {
        width: 100%;
    }
}

/* Site header */
.csp-site-header {
    position: relative;
    z-index: 1040;
    background-color: var(--tour-white);
    box-shadow: 0 8px 28px rgba(9, 16, 21, 0.12);
}

.csp-site-header,
.csp-site-header *,
.csp-main-nav,
.csp-main-nav * {
    box-sizing: border-box;
}

/* Compact vertical header shell & actions */
.csp-header-shell {
    display: grid;
    min-height: 80px;
    grid-template-columns: 180px minmax(0, 1fr);
    column-gap: 2.25rem;
    align-items: center;
}

.csp-header-mobile-bar {
    display: flex;
    align-self: center;
    align-items: center;
    justify-content: center;
}

.csp-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.csp-brand-logo {
    width: 148px;
    max-width: 100%;
    height: auto;
}

/* Header action bar with utility navigation and CTA buttons aligned vertically to center */
.csp-header-actions {
    display: grid;
    grid-column: 2;
    gap: 0.35rem;
    justify-items: end;
    align-self: center;
    align-content: center;
    margin: 0;
    padding: 0;
}

.csp-utility-nav,
.csp-header-cta-row,
.csp-main-menu,
.csp-menu-link,
.csp-header-link,
.csp-phone-box,
.csp-enquire-button,
.csp-navbar-toggle {
    display: flex;
    align-items: center;
}

/* Header utility navigation links */
.csp-utility-nav {
    gap: 1.35rem;
    color: #27313d;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1;
}

.csp-utility-nav a {
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.csp-utility-nav a:hover,
.csp-utility-nav a:focus {
    color: var(--tour-primary);
}

.csp-header-cta-row {
    gap: 1.15rem;
    justify-content: flex-end;
}

.csp-header-link,
.csp-phone-box,
.csp-enquire-button {
    min-height: 34px;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.csp-header-search {
    display: grid;
    width: min(17.5rem, 25vw);
    min-width: 12.5rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.45rem;
    min-height: 34px;
    padding: 0.15rem 0.35rem 0.15rem 0.75rem;
    border: 1px solid #e3e7ec;
    border-radius: 7px;
    background-color: #f9fafb;
    color: #7a8492;
    transition: border-color 0.22s ease, background-color 0.22s ease, box-shadow 0.22s ease;
}

.csp-header-search:focus-within {
    border-color: rgba(241, 1, 0, 0.5);
    background-color: var(--tour-white);
    box-shadow: 0 10px 24px rgba(17, 24, 39, 0.08);
}

.csp-header-search > i {
    color: var(--tour-primary);
    font-size: 0.82rem;
}

.csp-header-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    background-color: transparent;
    color: #27313d;
    font-size: 0.78rem;
    font-weight: 500;
    line-height: 1;
    outline: 0;
}

.csp-header-search input::placeholder {
    color: #8a94a3;
}

.csp-header-search button {
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 7px;
    background-color: var(--tour-white);
    color: var(--tour-primary);
    font-size: 0.72rem;
    line-height: 1;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.csp-header-search button:hover,
.csp-header-search button:focus {
    background-color: var(--tour-primary);
    color: var(--tour-white);
    transform: translateX(1px);
}

.csp-header-link {
    color: var(--tour-primary);
}

.csp-phone-box,
.csp-enquire-button {
    padding: 0.42rem 1.15rem;
    border: 1px solid var(--tour-primary);
    border-radius: 7px;
    transition: background-color 0.22s ease, color 0.22s ease, border-color 0.22s ease, transform 0.22s ease;
}

.csp-phone-box {
    color: var(--tour-primary);
}

.csp-phone-box:hover,
.csp-phone-box:focus {
    background-color: var(--tour-primary);
    color: var(--tour-white);
    transform: translateY(-1px);
}

.csp-enquire-button {
    border-color: var(--tour-primary);
    background-color: var(--tour-primary);
    color: var(--tour-white);
    text-transform: uppercase;
}

.csp-enquire-button:hover,
.csp-enquire-button:focus {
    border-color: var(--tour-primary-dark);
    background-color: var(--tour-primary-dark);
    color: var(--tour-white);
    transform: translateY(-1px);
}

.csp-main-nav {
    position: relative;
    z-index: 1035;
    width: 100%;
    border-top: 1px solid #e5e7eb;
    background-color: #ffffff;
}

/* Main navigation stays inside the header while keeping menu overlays anchored to the bar. */
.csp-main-nav-shell {
    position: relative;
}

.csp-main-menu {
    width: 100%;
    justify-content: flex-start;
    gap: 0.28rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.csp-menu-item {
    position: static;
}

.csp-menu-link {
    min-height: 42px;
    gap: 0.72rem;
    padding: 0 1.08rem;
    border-bottom: 3px solid transparent;
    color: #27313d;
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    transition: background-color 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}

/* Main navigation links stay square to align cleanly with the full-width mega-menu panels. */
a.csp-menu-link {
    border-radius: 0 !important;
}

.csp-menu-link i {
    color: #27313d;
    font-size: 0.72rem;
    transition: transform 0.22s ease, color 0.22s ease;
}

.csp-menu-item.is-menu-open .csp-menu-link {
    border-bottom-color: var(--tour-primary);
    background-color: #f7faf6;
    color: #18212b;
}

.csp-menu-item.is-menu-open .csp-menu-link i {
    color: var(--tour-primary);
    transform: rotate(180deg);
}

/* Mega Menu Panel spanning 100% width of the Bootstrap 5 container (Rule 3) */
.csp-mega-panel {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1045;
    width: 100%;
    padding-top: 0px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(18px);
    transition: opacity 0.28s ease, transform 0.34s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.28s;
}

/* JavaScript owns the single open state for pointer and keyboard interaction. */
.csp-menu-item.is-menu-open > .csp-mega-panel {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

/* Shared full-width visual megamenus preserve the established edge-to-edge geometry. */
[data-csp-visual-megamenu],
[data-csp-visual-megamenu] * {
    border-radius: 0 !important;
}

.csp-mega-panel.csp-mega-panel-fullwidth {
    z-index: 0;
    position: absolute;
    top: 100%;
    left: 50%;
    right: auto;
    width: 100vw;
    max-width: 100vw;
    padding-top: 0;
    border-radius: 0 !important;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-50%) translateY(18px);
    transition: opacity 0.28s ease, transform 0.34s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.28s;
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.45);
}

.csp-menu-item.is-menu-open > .csp-mega-panel.csp-mega-panel-fullwidth {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

.csp-dest-megamenu-shell {
    position: relative;
    width: 100%;
    height: min(850px, calc(100vh - 135px));
    min-height: 660px;
    max-height: 850px;
    background-color: #0c1219;
    overflow: hidden;
    border-bottom: 0;
}

/* Background image cross-fade layers */
.csp-dest-bg-layers {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}

.csp-dest-bg-layer {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
    opacity: 0;
    transform: scale(1.02);
    transition: opacity 0.55s cubic-bezier(0.25, 1, 0.5, 1), transform 0.8s ease-out;
}

.csp-dest-bg-layer.is-active {
    opacity: 1;
    transform: scale(1);
}

/* Both full-width megamenus use the available viewport height so editorial copy rarely needs scrolling. */
.csp-dest-columns-wrap {
    position: relative;
    z-index: 3;
    display: flex;
    height: min(850px, calc(100vh - 135px));
    min-height: 660px;
    max-height: 850px;
    width: 100%;
    overflow: hidden;
}

/* Column 1: Left Destinations Navigation - yellow text on hover without background */
.csp-dest-nav-col {
    width: 270px;
    flex-shrink: 0;
    background: rgba(12, 17, 24, 0.90);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-right: none;
    padding: 1.5rem 0.6rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    height: 100%;
    overflow: visible;
}

.csp-dest-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.csp-dest-nav-item {
    position: relative;
    background: transparent !important;
    border-radius: 0 !important;
}

/* Opening either visual megamenu reveals its primary choices in a slow, ordered sequence. */
.csp-menu-item.is-menu-open > [data-csp-visual-megamenu] .csp-dest-nav-item {
    animation: csp-dest-item-reveal 720ms cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: var(--csp-dest-item-delay);
}

/* Each destination rises gently into place while preserving the list's successive rhythm. */
@keyframes csp-dest-item-reveal {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Reduced-motion visitors receive immediate list visibility with a restrained opacity change. */
@media (prefers-reduced-motion: reduce) {
    .csp-menu-item.is-menu-open > [data-csp-visual-megamenu] .csp-dest-nav-item {
        animation: csp-dest-item-fade 140ms ease-out both;
        animation-delay: 0ms;
    }
}

@keyframes csp-dest-item-fade {
    from {
        opacity: 0.7;
    }

    to {
        opacity: 1;
    }
}

.csp-dest-nav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.72rem 1.1rem;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.94rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    white-space: nowrap;
    text-decoration: none !important;
    transition: color 0.2s ease, padding-left 0.2s ease;
}

.csp-dest-nav-link i {
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.5);
    transition: transform 0.2s ease, color 0.2s ease;
}

/* Only yellow text on hover/active, completely without background */
.csp-dest-nav-item:hover .csp-dest-nav-link,
.csp-dest-nav-item.is-active .csp-dest-nav-link {
    color: #f59e0b !important;
    background: transparent !important;
    padding-left: 1.25rem;
}

.csp-dest-nav-item:hover .csp-dest-nav-link i,
.csp-dest-nav-item.is-active .csp-dest-nav-link i {
    color: #f59e0b !important;
    transform: translateX(4px);
}

.csp-dest-nav-item.is-active {
    background: transparent !important;
}

/* Column 2: A semitransparent surface reveals the photograph without applying backdrop blur. */
.csp-dest-content-col {
    width: 520px;
    flex-shrink: 0;
    background: rgba(9, 13, 19, 0.82);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding: 0;
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    height: 100%;
    overflow: hidden;
}

.csp-dest-panel {
    grid-area: 1 / 1;
    padding: 2.2rem 2.4rem;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.csp-dest-panel.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.csp-dest-panel-title {
    margin: 0 0 1.25rem;
    color: #ffffff;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.csp-dest-tour-list {
    list-style: none;
    margin: 0 0 1.5rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.csp-dest-tour-list li {
    border-top: 1px dotted rgba(255, 255, 255, 0.12);
}

.csp-dest-tour-list li:first-child {
    border-top: 0;
}

.csp-dest-tour-list a {
    position: relative;
    display: block;
    padding: 0.72rem 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none !important;
    transition: color 0.2s ease, transform 0.2s ease;
}

.csp-dest-tour-list a:hover,
.csp-dest-tour-list a:focus {
    color: #ffffff;
    transform: translateX(4px);
}

/* Editorial destination description in column 2 (Rule 2 & 9: No border-left) */
.csp-dest-panel-desc {
    margin: 0;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.88rem;
    line-height: 1.65;
    font-weight: 400;
    text-align: justify;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    padding-top: 1.25rem;
}

/* Column 3: Open Scenic Window revealing the full landscape photo */
.csp-dest-scenic-col {
    flex: 1;
    background: transparent;
    height: 100%;
    position: relative;
}

/* Navigation Mega Menu Card with Panoramic Background */
.csp-mega-card {
    position: relative;
    display: block;
    min-height: 420px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 7px !important;
    background-color: #ffffff;
    background-image: url('../images/pano-machu-picchu.jpg');
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 100% auto;
    box-shadow: 0 28px 80px rgba(9, 16, 21, 0.24);
}

/* The panorama is a contained, non-repeating card background anchored to the megamenu base. */
.csp-mega-card.has-footer-image {
    background-color: #ffffff;
    background-image: var(--csp-mega-background-image);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
}

/* Text-only megamenus such as About Us never inherit the default panorama. */
.csp-mega-card.has-no-image {
    background-image: none;
}

/* Megamenus keep tour links above their panoramic artwork, with an optional per-menu depth. */
.csp-mega-card.has-footer-image .csp-mega-content {
    padding-bottom: var(--csp-mega-footer-padding, 15rem);
}

.csp-mega-content {
    position: relative;
    z-index: 2;
    display: grid;
    align-content: stretch;
    gap: 1.6rem;
    padding: 2.4rem;
    background: transparent;
}

/* The megamenu intro reserves a compact right column for its primary action. */
.csp-mega-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: clamp(1.5rem, 3vw, 3rem);
    align-items: start;
    padding-bottom: 15px;
    border-bottom: 1px solid #e5e7eb;
}

.csp-mega-title {
    margin: 0 0 0.5rem;
    color: #27313d;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.csp-mega-description {
    grid-column: 1;
    max-width: 820px;
    margin: 0;
    color: #64748b;
    font-size: 0.92rem;
    line-height: 1.6;
}

/* Megamenu columns container using Bootstrap 5 grid */
.csp-mega-columns {
    margin-top: 0;
}

/* Ensure 2-of-3 column megamenus (e.g. Machu Picchu tours) occupy exactly 66.6667% width */
.csp-mega-columns > .col-8 {
    width: 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}

/* Ensure 3-column megamenus occupy 33.3333% width each */
.csp-mega-columns > .col-4 {
    width: 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

/* Ensure 2-column megamenus occupy 50% width each */
.csp-mega-columns > .col-6 {
    width: 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

/* Ensure single-group megamenus occupy 100% width */
.csp-mega-columns > .col-12 {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

/* Megamenu editorial text block for destination descriptions (clean layout without border or background) */
.csp-mega-highlight-col {
    display: flex;
    flex-direction: column;
}

.csp-mega-highlight {
    position: relative;
    padding: 0;
    border: none;
    background: transparent;
}

/* Optional editorial headings keep supplied destination links above their megamenu copy. */
.csp-mega-highlight-title,
.csp-mobile-highlight-title {
    margin: 0 0 1rem;
    color: #27313d;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    line-height: 1.2;
    text-transform: uppercase;
}

.csp-mega-highlight-title a,
.csp-mobile-highlight-title a {
    display: inline-block;
    padding: 0;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.csp-mega-highlight-title a::before,
.csp-mobile-highlight-title a::before {
    content: none;
}

.csp-mega-highlight-text {
    margin: 0;
    color: #64748b;
    font-size: 0.92rem;
    line-height: 1.6;
    font-weight: 400;
    text-align: justify;
}

/* Mobile accordion destination highlight text without border or background */
.csp-mobile-highlight-text {
    margin-top: 1rem;
    padding: 0;
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 0.92rem;
    line-height: 1.6;
    text-align: justify;
}

.csp-mega-group-title {
    margin: 0 0 1rem;
    color: #27313d;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    line-height: 1.2;
    text-transform: uppercase;
}

.csp-mega-group ul {
    display: grid;
    gap: 0;
    padding: 0;
    margin: 0;
    list-style: none;
}

/* The Machu Picchu group spans the panel so its single title can lead two balanced tour columns. */
.csp-mega-group:has(> .menu_tours) {
    grid-column: 1 / -1;
}

.csp-mega-group > .menu_tours {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(1.75rem, 4vw, 4rem);
}

/* Both items in the first visual row begin without a divider. */
.csp-mega-group > .menu_tours li:nth-child(-n + 2) {
    border-top: 0;
}

.csp-mega-group li + li {
    border-top: 1px dotted #cfd6df;
}

.csp-mega-group a {
    position: relative;
    display: block;
    padding: 0.82rem 0 0.82rem 1.35rem;
    color: #3f4a59;
    font-size: 0.98rem;
    font-weight: 500;
    line-height: 1.35;
    transition: color 0.2s ease, transform 0.2s ease;
}

.csp-mega-group a::before {
    position: absolute;
    top: 1.25rem;
    left: 0;
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 7px;
    background-color: var(--tour-primary);
    content: "";
}

.csp-mega-group a:hover,
.csp-mega-group a:focus {
    color: #000;
    transform: translateX(3px);
}

/* The primary megamenu action occupies the top-right corner without adding a footer row. */
.csp-mega-cta {
    grid-column: 2;
    grid-row: 1 / span 2;
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 0.85rem 1.45rem;
    border-radius: 7px;
    background-color: var(--tour-primary);
    color: var(--tour-white);
    font-size: 0.88rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.csp-mega-cta:hover,
.csp-mega-cta:focus {
    background-color: var(--tour-primary-dark);
    color: var(--tour-white);
    transform: translateY(-2px);
}

.csp-navbar-toggle {
    display: none;
    width: 44px;
    height: 44px;
    flex-direction: column;
    justify-content: center;
    gap: 0.32rem;
    border: 1px solid rgba(241, 1, 0, 0.65);
    border-radius: 7px;
    background-color: var(--tour-white);
    color: var(--tour-primary);
    font-size: 1rem;
    transition: color 0.22s ease, transform 0.22s ease;
}

.csp-menu-toggle-line {
    display: block;
    width: 1.85rem;
    height: 0.18rem;
    background-color: currentColor;
    transform-origin: center;
    transition:
        opacity 0.18s ease,
        transform 0.34s cubic-bezier(0.22, 1, 0.36, 1),
        width 0.28s ease;
}

.csp-navbar-toggle:hover,
.csp-navbar-toggle:focus {
    color: var(--tour-primary-dark);
    transform: translateY(-1px);
}

.csp-navbar-toggle:hover .csp-menu-toggle-line,
.csp-navbar-toggle:focus .csp-menu-toggle-line {
    width: 2.05rem;
}

.csp-navbar-toggle[aria-expanded="true"] .csp-menu-toggle-line:nth-child(1),
.csp-site-header:has(.csp-mobile-menu.show) .csp-navbar-toggle .csp-menu-toggle-line:nth-child(1) {
    transform: translateY(0.5rem) rotate(45deg);
}

.csp-navbar-toggle[aria-expanded="true"] .csp-menu-toggle-line:nth-child(2),
.csp-site-header:has(.csp-mobile-menu.show) .csp-navbar-toggle .csp-menu-toggle-line:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}

.csp-navbar-toggle[aria-expanded="true"] .csp-menu-toggle-line:nth-child(3),
.csp-site-header:has(.csp-mobile-menu.show) .csp-navbar-toggle .csp-menu-toggle-line:nth-child(3) {
    transform: translateY(-0.5rem) rotate(-45deg);
}

.csp-mobile-quick-actions {
    display: none;
}

/* Responsive mobile menu in elegant light style */
.csp-mobile-menu {
    width: 100vw !important;
    max-width: none;
    border: 0;
    background-color: #ffffff;
    color: #17212b;
    overflow-y: auto;
    overscroll-behavior: contain;
    opacity: 0;
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease;
}

.csp-mobile-menu.offcanvas-start {
    transform: translateX(-100%);
}

.csp-mobile-menu.show:not(.hiding),
.csp-mobile-menu.showing {
    opacity: 1;
    transform: translateX(0);
}

.csp-mobile-menu .csp-mobile-menu-header,
.csp-mobile-menu .csp-mobile-contact,
.csp-mobile-menu .csp-mobile-accordion,
.csp-mobile-menu .csp-mobile-menu-actions {
    opacity: 0;
    transform: translateX(-16px);
    transition: opacity 0.38s ease, transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.csp-mobile-menu.show .csp-mobile-menu-header,
.csp-mobile-menu.showing .csp-mobile-menu-header {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.06s;
}

.csp-mobile-menu.show .csp-mobile-contact,
.csp-mobile-menu.showing .csp-mobile-contact {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.12s;
}

.csp-mobile-menu.show .csp-mobile-accordion,
.csp-mobile-menu.showing .csp-mobile-accordion {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.18s;
}

.csp-mobile-menu.show .csp-mobile-menu-actions,
.csp-mobile-menu.showing .csp-mobile-menu-actions {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.24s;
}

/* Light theme inner canvas container */
.csp-mobile-menu-inner {
    display: grid;
    min-height: 100dvh;
    align-content: start;
    gap: 1.25rem;
    padding: 1.1rem 1.1rem 2.5rem;
    background-color: #ffffff;
    overflow: visible;
}

/* Header with brand logo on the left and close button on the right */
.csp-mobile-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid #eaedf1;
}

.csp-mobile-menu-brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.csp-mobile-menu-logo {
    width: 140px;
    max-width: 100%;
    height: auto;
    display: block;
}

.csp-mobile-close {
    display: inline-flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border: 1px solid #e3e7ec;
    border-radius: 7px;
    background-color: #f7f9fb;
    color: #374151;
    font-size: 1.05rem;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.csp-mobile-close:hover,
.csp-mobile-close:focus {
    background-color: #ebf0f5;
    color: #111827;
    border-color: #d1d5db;
}

/* Clean contact row with minimal red: WhatsApp official green and neutral phone */
.csp-mobile-contact {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0;
    border: 0;
    background-color: transparent;
}

.csp-mobile-contact a {
    display: inline-flex;
    width: 100%;
    min-height: 2.85rem;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid #e5e7eb;
    border-radius: 7px;
    background-color: #f9fafb;
    color: #1f2937;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.csp-mobile-contact a:first-child i {
    color: #25d366;
    font-size: 1.05rem;
}

.csp-mobile-contact a:last-child i {
    color: #4b5563;
    font-size: 0.95rem;
}

.csp-mobile-contact a:hover,
.csp-mobile-contact a:focus {
    border-color: #d1d5db;
    background-color: #f3f4f6;
    color: #111827;
    transform: translateY(-1px);
}

/* Light accordion structure */
.csp-mobile-accordion {
    display: grid;
    gap: 0.55rem;
}

.csp-mobile-accordion .accordion-item {
    overflow: hidden;
    border: 1px solid #e8ecf1;
    border-radius: 7px !important;
    background-color: #ffffff;
    color: #1f2937;
}

.csp-mobile-accordion .accordion-button {
    min-height: 3.15rem;
    padding: 0.85rem 1rem;
    background-color: #fbfcfd;
    color: #17212b;
    font-size: 0.88rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    line-height: 1.2;
    text-transform: uppercase;
    box-shadow: none;
    border-bottom: 1px solid transparent;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.csp-mobile-accordion .accordion-button::after {
    filter: none;
    opacity: 0.55;
    transition: transform 0.22s ease, opacity 0.22s ease;
}

.csp-mobile-accordion .accordion-button:not(.collapsed) {
    background-color: #f4f6f8;
    color: #0f172a;
    border-bottom-color: #e8ecf1;
}

.csp-mobile-accordion .accordion-button:not(.collapsed)::after {
    opacity: 0.85;
}

.csp-mobile-accordion .accordion-body {
    padding: 0.85rem 1rem 1rem;
    background-color: #ffffff;
    color: #4b5563;
}

.csp-mobile-accordion strong {
    display: block;
    margin: 0.85rem 0 0.45rem;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.csp-mobile-accordion strong:first-child {
    margin-top: 0.25rem;
}

.csp-mobile-accordion ul {
    display: grid;
    gap: 0;
    padding: 0;
    margin: 0;
    list-style: none;
}

.csp-mobile-accordion li + li {
    border-top: 1px solid #f1f5f9;
}

.csp-mobile-accordion a {
    display: block;
    padding: 0.65rem 0;
    color: #334155;
    font-size: 0.88rem;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none;
    transition: color 0.2s ease, transform 0.2s ease;
}

.csp-mobile-accordion a:hover,
.csp-mobile-accordion a:focus {
    color: var(--tour-primary, #f10100);
    transform: translateX(2px);
}

/* Bottom action row */
.csp-mobile-menu-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
    padding-top: 0.35rem;
}

.csp-mobile-tripadvisor,
.csp-mobile-contact-button {
    display: inline-flex;
    min-height: 3.1rem;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.8rem 0.9rem;
    border-radius: 7px;
    font-size: 0.84rem;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.csp-mobile-tripadvisor {
    display: grid;
    min-height: 4.6rem;
    justify-content: center;
    justify-items: center;
    gap: 0.35rem;
    padding: 0.75rem 1rem;
    border: 1px solid #e3e7ec;
    background-color: #fbfcfd;
    color: #17212b;
    text-align: center;
    text-transform: none;
}

.csp-tripadvisor-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #17212b;
    font-size: 0.92rem;
    font-weight: 900;
    line-height: 1;
}

.csp-tripadvisor-brand i {
    color: #00aa6c;
    font-size: 1rem;
}

.csp-tripadvisor-rating {
    display: inline-flex;
    gap: 0.22rem;
    align-items: center;
}

.csp-tripadvisor-rating i {
    width: 0.62rem;
    height: 0.62rem;
    border-radius: 50%;
    background-color: #00aa6c;
}

.csp-tripadvisor-reviews {
    color: #64748b;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    text-transform: uppercase;
}

.csp-mobile-tripadvisor:hover,
.csp-mobile-tripadvisor:focus {
    border-color: #cbd5e1;
    background-color: #f1f5f9;
    color: #0f172a;
    transform: translateY(-1px);
}

/* Contact button: dark elegant primary button, keeping red minimal */
.csp-mobile-contact-button {
    background-color: #17212b;
    border: 1px solid #17212b;
    color: var(--tour-white);
}

.csp-mobile-contact-button:hover,
.csp-mobile-contact-button:focus {
    background-color: var(--tour-primary);
    border-color: var(--tour-primary);
    color: var(--tour-white);
    transform: translateY(-1px);
}

@media (min-width: 1400px) and (max-width: 1599.98px) {
    .csp-header-shell {
        grid-template-columns: 160px minmax(0, 1fr);
        column-gap: 1.35rem;
    }

    .csp-brand-logo {
        width: 138px;
    }

    .csp-utility-nav,
    .csp-header-cta-row {
        gap: 0.9rem;
    }

    .csp-menu-link {
        padding-inline: 0.78rem;
        font-size: 0.72rem;
    }

    .csp-phone-box,
    .csp-enquire-button {
        padding-inline: 0.9rem;
    }

    .csp-header-search {
        width: 12.75rem;
        min-width: 10.8rem;
    }
}

@media (max-width: 1399.98px) {
    .csp-header-shell {
        display: block;
        min-height: 0;
        padding-top: 0.35rem;
        padding-bottom: 0.35rem;
    }

    .csp-header-mobile-bar {
        justify-content: space-between;
        gap: 1rem;
    }

    .csp-brand-logo {
        width: 130px;
    }

    .csp-mobile-quick-actions {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: auto;
        border-right: 1px solid #dfe3e8;
        border-left: 1px solid #dfe3e8;
    }

    .csp-mobile-quick-actions a {
        display: inline-flex;
        width: 2.85rem;
        height: 2.2rem;
        align-items: center;
        justify-content: center;
        border-right: 1px solid #dfe3e8;
        color: var(--tour-primary);
        font-size: 1.15rem;
        line-height: 1;
        transition: color 0.2s ease, transform 0.2s ease;
    }

    .csp-mobile-quick-actions a:last-child {
        border-right: 0;
    }

    .csp-mobile-quick-actions a:hover,
    .csp-mobile-quick-actions a:focus {
        color: var(--tour-primary-dark);
        transform: translateY(-1px);
    }

    .csp-header-actions,
    .csp-main-nav {
        display: none;
    }

    .csp-navbar-toggle {
        display: inline-flex;
        width: 3.2rem;
        height: 2.65rem;
        border: 0;
        border-radius: 7px;
        background-color: transparent;
        color: #27313d;
        font-size: 1.8rem;
        animation: cspMenuButtonBreathe 2.8s ease-in-out infinite;
    }
}

@keyframes cspMenuButtonBreathe {
    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-1px);
    }
}

@media (max-width: 575.98px) {
    .csp-brand-logo {
        width: 122px;
    }

    .csp-header-mobile-bar {
        gap: 0.45rem;
    }

    .csp-mobile-quick-actions a {
        width: 2.45rem;
        height: 2.3rem;
        font-size: 1.05rem;
    }

    .csp-navbar-toggle {
        width: 2.7rem;
        font-size: 1.65rem;
    }

    .csp-mobile-menu-inner {
        padding: 0.85rem 0.85rem 1.75rem;
    }

    .csp-mobile-menu-actions {
        grid-template-columns: 1fr;
    }

}

@media (prefers-reduced-motion: reduce) {
    .csp-mobile-menu,
    .csp-mobile-menu .csp-mobile-menu-inner,
    .csp-mobile-menu .csp-mobile-menu-header,
    .csp-mobile-menu .csp-mobile-contact,
    .csp-mobile-menu .csp-mobile-accordion,
    .csp-mobile-menu .csp-mobile-menu-actions,
    .csp-navbar-toggle {
        animation: none;
        transition: none;
    }
}


.csp-floating-contact-bar {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;
    display: none;
    align-items: center;
    grid-template-columns: 3.5rem minmax(0, 1fr);
    gap: 0.7rem;
    padding: 0.6rem 0.85rem;
    border-top: 1px solid rgba(241, 1, 0, 0.24);
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    background-color: rgba(255, 255, 255, 0.94);
    box-shadow: 0 -14px 38px rgba(9, 16, 21, 0.16);
    opacity: 0;
    transform: translateY(100%);
    transition: opacity 0.32s ease, transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
    backdrop-filter: blur(10px);
}

.csp-floating-whatsapp,
.csp-floating-contact-button {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.csp-floating-whatsapp {
    width: 100%;
    border: 1px solid rgba(37, 211, 102, 0.35);
    background-color: var(--tour-white);
    color: #25d366;
    font-size: 1.35rem;
    transition: background-color 0.22s ease, color 0.22s ease, transform 0.22s ease;
}

.csp-floating-contact-button {
    gap: 0.55rem;
    padding: 0.85rem 1.15rem;
    background-color: var(--tour-primary);
    color: var(--tour-white);
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transition: background-color 0.22s ease, color 0.22s ease, transform 0.22s ease;
}

.csp-floating-contact-button:hover,
.csp-floating-contact-button:focus {
    color: var(--tour-white);
    transform: translateY(-2px);
}

.csp-floating-whatsapp:hover,
.csp-floating-whatsapp:focus {
    background-color: #f5fff8;
    color: #1ebe5d;
    transform: translateY(-2px);
}

.csp-floating-contact-button:hover,
.csp-floating-contact-button:focus {
    background-color: var(--tour-primary-dark);
}

@media (max-width: 575.98px) {
    .csp-floating-contact-bar {
        display: grid;
    }

    .csp-floating-contact-bar.is-visible {
        opacity: 1;
        transform: translateY(0);
    }

    .csp-floating-contact-button {
        width: 100%;
    }
}

/* Official Certifications & Accreditations Strip (Placed immediately before Footer)
---------------------------------------------------------------------------------- */
.footer-partners-bar {
    background-color: #ffffff;
    border-top: 1px solid #e9ecef;
    border-bottom: 1px solid #e9ecef;
    padding: 1.5rem 0;
    position: relative;
    z-index: 5;
}

/* Single-line horizontal alignment of all 6 brand and certification logos */
.footer-partners-list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0;
    padding: 0.25rem 0;
}

.footer-partners-list::-webkit-scrollbar {
    display: none;
}

.footer-partner-item {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem 0.5rem;
}

/* Grayscale and subdued opacity by default */
.footer-partner-item img {
    height: 100px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.55;
    transition: filter 0.35s ease, opacity 0.35s ease, transform 0.35s ease;
    display: block;
    user-select: none;
}
/* Smooth transition to original full color on hover */
.footer-partner-item:hover img,
.footer-partner-item img:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: translateY(-2px);
}

/* Inspirational quote block below the certification logos */
.footer-partners-quote {
    text-align: center;
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f1f3f5;
}

/* The main certification statement leaves a clear pause before the supporting line. */
.footer-partners-quote-main {
    margin: 0 0 0.8rem;
    color: #535353;
    font-size: 2rem;
    font-family: var(--font-signature);
    font-weight: 400;
    font-synthesis: none;
    line-height: 1.3;
    letter-spacing: 0.01em;
}
.footer-partners-quote-sub {
    margin: 0;
    color: #a9a7a7;
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1.45;
}
@media (max-width: 767.98px) {
    .footer-partners-bar {
        padding: 1.25rem 0;
    }

    .footer-partners-list {
        gap: 1.25rem;
    }

    .footer-partner-item img {
        height: 38px;
        max-width: 110px;
    }

    .footer-partners-quote {
        margin-top: 1.25rem;
        padding-top: 1rem;
    }
}

/* Peru Summit Adventures - Panoramic Mountain Footer
-------------------------------------------------- */

.ps-footer {
    position: relative;
    z-index: 10;
    overflow: hidden;
    background-color: #0b131e;
    background-image: url('../images/footer.jpg');
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
    color: #e5e7eb;
    font-family: inherit;
    /* Generous top padding before content to showcase panoramic mountain background image */
    padding-top: clamp(160px, 22vw, 320px);
}

.ps-footer-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgb(255 255 255 / 15%) 0%, rgb(0 0 0 / 48%) 45%, rgb(0 0 0 / 78%) 100%);
    pointer-events: none;
    z-index: 1;
}

.ps-footer-content {
    position: relative;
    z-index: 2;
    padding-bottom: 2.5rem;
}

/* Headings */
.ps-footer-heading {
    margin: 0 0 1.35rem;
    color: #ffffff;
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    line-height: 1.25;
    text-transform: uppercase;
}

/* Link Lists */
.ps-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.ps-footer-links li {
    margin: 0;
    padding: 0;
}

.ps-footer-links a {
    display: inline-flex;
    align-items: flex-start;
    gap: 0.65rem;
    color: #d1d5db;
    font-size: 0.88rem;
    font-weight: 400;
    line-height: 1.45;
    text-decoration: none;
    transition: color 0.22s ease, transform 0.22s ease;
}

.ps-footer-links a:hover,
.ps-footer-links a:focus {
    color: #ffffff;
    transform: translateX(4px);
}

/* ==========================================================================
   Footer - Keep In Touch (24/7) Modern Card Interface
   ========================================================================== */
.ps-footer-contact-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.ps-footer-contact-links li {
    margin: 0;
    padding: 0;
}

.ps-footer-contact-card {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.45rem 0.55rem;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 7px;
    text-decoration: none !important;
    transition: background-color 0.22s ease, box-shadow 0.22s ease;
}

.ps-footer-contact-card:hover,
.ps-footer-contact-card:focus {
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

/* Contact Icon Box Container with #FFAE00 accent */
.ps-contact-icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: rgba(255, 174, 0, 0.12);
    border: 1px solid rgba(255, 174, 0, 0.3);
    border-radius: 7px;
    color: #FFAE00;
    font-size: 0.85rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
    transition: background-color 0.22s ease, border-color 0.22s ease, color 0.22s ease, box-shadow 0.22s ease;
}

.ps-footer-contact-card:hover .ps-contact-icon-box {
    background-color: #FFAE00;
    border-color: #FFAE00;
    color: #0b131e;
    box-shadow: 0 0 12px rgba(255, 174, 0, 0.45);
}

/* Contact Info Text Hierarchy */
.ps-contact-info {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.ps-contact-label {
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #9ca3af;
    line-height: 1.2;
    transition: color 0.22s ease;
}

.ps-footer-contact-card:hover .ps-contact-label {
    color: #f3f4f6;
}

.ps-contact-value {
    font-size: 0.82rem;
    font-weight: 500;
    color: #e5e7eb;
    line-height: 1.35;
    word-break: break-word;
    overflow-wrap: anywhere;
    transition: color 0.22s ease;
}

.ps-footer-contact-card:hover .ps-contact-value {
    color: #ffffff;
}

.ps-contact-value-address {
    font-size: 0.74rem;
    line-height: 1.35;
    color: #cbd5e1;
}


/* ==========================================================================
   Footer Pre-Brand Hub: Social Media, Legal Links & Card Payment Methods
   ========================================================================== */
.ps-footer-prebrand {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1.35rem;
    margin-top: 3.5rem;
    padding-top: 2.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

/* 1. Social Media Links Strip (Top) */
.ps-footer-prebrand-social {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.ps-footer-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 7px !important;
    background-color: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #f1f5f9 !important;
    font-size: 1.05rem;
    text-decoration: none !important;
    transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, color 0.22s ease;
}

.ps-footer-social-link:hover,
.ps-footer-social-link:focus {
    transform: translateY(-4px) scale(1.08);
    color: #ffffff !important;
}

/* Brand-specific hover colors & glows */
.ps-footer-social-link.is-facebook:hover,
.ps-footer-social-link.is-facebook:focus {
    background-color: #1877f2;
    border-color: #1877f2;
    box-shadow: 0 6px 18px rgba(24, 119, 242, 0.45);
}

.ps-footer-social-link.is-instagram:hover,
.ps-footer-social-link.is-instagram:focus {
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
    border-color: transparent;
    box-shadow: 0 6px 18px rgba(214, 36, 159, 0.45);
}

.ps-footer-social-link.is-youtube:hover,
.ps-footer-social-link.is-youtube:focus {
    background-color: #ff0000;
    border-color: #ff0000;
    box-shadow: 0 6px 18px rgba(255, 0, 0, 0.45);
}

.ps-footer-social-link.is-twitter:hover,
.ps-footer-social-link.is-twitter:focus {
    background-color: #000000;
    border-color: rgba(255, 255, 255, 0.6);
    box-shadow: 0 6px 18px rgba(255, 255, 255, 0.25);
}

.ps-footer-social-link.is-tiktok:hover,
.ps-footer-social-link.is-tiktok:focus {
    background-color: #000000;
    border-color: #00f2fe;
    box-shadow: -2px -2px 10px rgba(0, 242, 254, 0.4), 2px 2px 10px rgba(254, 44, 85, 0.4);
}

.ps-footer-social-link.is-pinterest:hover,
.ps-footer-social-link.is-pinterest:focus {
    background-color: #e60023;
    border-color: #e60023;
    box-shadow: 0 6px 18px rgba(230, 0, 35, 0.45);
}

.ps-footer-social-link.is-tripadvisor:hover,
.ps-footer-social-link.is-tripadvisor:focus {
    background-color: #00aa6c;
    border-color: #00aa6c;
    box-shadow: 0 6px 18px rgba(0, 170, 108, 0.45);
}

.ps-footer-social-link.is-whatsapp:hover,
.ps-footer-social-link.is-whatsapp:focus {
    background-color: #25d366;
    border-color: #25d366;
    box-shadow: 0 6px 18px rgba(37, 211, 102, 0.45);
}

/* 2. Horizontal Center Quick Menu (Discreet & Elegant Navigation) */
.ps-footer-prebrand-nav {
    display: flex;
    justify-content: center;
    width: 100%;
}

.ps-footer-prebrand-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5rem 1.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ps-footer-prebrand-menu li {
    display: inline-flex;
    align-items: center;
}

/* Discreet menu link styling with subtle muted color and refined sizing */
.ps-footer-prebrand-menu a {
    position: relative;
    display: inline-block;
    padding: 0.2rem 0;
    color: #94a3b8;
    font-size: 0.8rem;
    font-weight: 450;
    text-decoration: none !important;
    letter-spacing: 0.02em;
    transition: color 0.25s ease;
}

/* Elegant centered animated underline */
.ps-footer-prebrand-menu a::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #FFAE00;
    border-radius: 7px;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.ps-footer-prebrand-menu a:hover,
.ps-footer-prebrand-menu a:focus {
    color: #ffffff !important;
}

.ps-footer-prebrand-menu a:hover::after,
.ps-footer-prebrand-menu a:focus::after {
    transform: scaleX(1);
}

/* 3. Accepted Payment Cards Image (Bottom) */
.ps-footer-prebrand-payments {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

/* Discreet Payments label above cards image */
.ps-footer-payments-label {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #9ca3af;
    line-height: 1;
    user-select: none;
    transition: color 0.22s ease;
}

.ps-footer-prebrand-payments:hover .ps-footer-payments-label {
    color: #e5e7eb;
}

.ps-footer-cards-img {
    display: block;
    width: 100%;
    max-width: 380px;
    height: auto;
    object-fit: contain;
    border-radius: 7px; /* Directiva de diseño: 7px de radio */
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.35));
    transition: transform 0.22s ease, filter 0.22s ease;
}

.ps-footer-cards-img:hover {
    transform: translateY(-2px);
    filter: drop-shadow(0 4px 14px rgba(0, 0, 0, 0.5));
}

/* Divider HR */
.ps-footer-hr {
    margin: 2.25rem 0 1.75rem;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    opacity: 1;
}

/* Bottom Bar */
.ps-footer-bottom {
    padding-top: 0.5rem;
}

.ps-footer-brand-logo {
    display: inline-block;
}

.ps-footer-brand-logo img {
    max-height: 48px;
    width: auto;
    object-fit: contain;
    display: block;
}

.ps-footer-copyright {
    margin: 0;
    color: #9ca3af;
    font-size: 0.8rem;
    line-height: 1.6;
}

.ps-footer-copyright strong {
    color: #e5e7eb;
    font-weight: 600;
}

@media (max-width: 991.98px) {
    .ps-footer {
        /* Adjusted responsive top padding for tablets and mobile devices */
        padding-top: clamp(120px, 20vw, 220px);
    }

    .ps-footer-grid {
        row-gap: 2rem;
    }

    .ps-footer-hr {
        margin: 2.5rem 0 1.5rem;
    }
}

@media (max-width: 767.98px) {
    /* Mobile footer uses a clean black surface and removes the panoramic image presentation. */
    .ps-footer {
        padding-top: clamp(2.5rem, 8vw, 3.5rem);
        background-color: #000000;
        background-image: none !important;
    }

    /* The desktop image overlay is unnecessary on the solid mobile surface. */
    .ps-footer-overlay {
        display: none;
    }
}


/* ==========================================================================
   Sticky Floating Bottom Contact Bar (.footer_flotante)
   Light glass style, spaced from viewport edges with 7px rounded corners.
   Appears with smooth slide-up fade-in animation upon scrolling down,
   and smoothly fades out when reaching the page footer.
   ========================================================================== */
.footer_flotante {
    position: fixed;
    bottom: 16px;
    left: 16px;
    right: 16px;
    width: auto;
    max-width: 1440px;
    margin: 0 auto;
    z-index: 1045;
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 7px !important;
    box-shadow: 0 10px 30px -5px rgba(15, 23, 42, 0.12), 0 2px 8px rgba(15, 23, 42, 0.04);
    padding: 10px 18px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
                visibility 0.35s ease;
    pointer-events: none;
}

/* Floating bar visible state */
.footer_flotante.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

/* Descriptive travel designer notice - light theme, regular weight, and slightly smaller font */
.footer_flotante .label-footer {
    color: #334155;
    font-size: 0.78rem;
    font-weight: 400;
    line-height: 1.35;
    letter-spacing: 0.01em;
}

/* Text alignment helpers for Bootstrap compatibility */
.footer_flotante .text-left {
    text-align: left;
}

.footer_flotante .text-right {
    text-align: right;
}

/* Direct call telephone link - dark text with vibrant phone icon */
.footer_flotante .link-footer,
.footer_flotante .link-white {
    color: #0f172a !important;
    text-decoration: none;
    font-size: 0.78rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.footer_flotante .link-footer i,
.footer_flotante .link-white i {
    color: #ff6a3d;
}

.footer_flotante .link-footer:hover,
.footer_flotante .link-white:hover {
    color: #ff6a3d !important;
    text-decoration: none;
}

/* High-contrast orange CTA button (Rule 1: 7px border radius) */
.footer_flotante .btn-naranja {
    background-color: #FFAE00 !important;
    border: 1px solid #FFAE00 !important;
    color: #ffffff !important;
    border-radius: 7px !important;
    font-weight: 700;
    font-size: 0.74rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 7px 15px;
    box-shadow: 0 3px 10px rgba(255, 106, 61, 0.3);
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.footer_flotante .btn-naranja:hover,
.footer_flotante .btn-naranja:focus {
    background-color: #e65100 !important;
    border-color: #e65100 !important;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(230, 81, 0, 0.4);
}

/* Mobile responsive adaptations */
@media (max-width: 767.98px) {
    .footer_flotante {
        bottom: 10px;
        left: 10px;
        right: 10px;
        padding: 8px 12px;
    }

    .footer_flotante .label-footer {
        font-size: 0.72rem;
        line-height: 1.3;
        margin-bottom: 6px;
        text-align: center;
    }

    .footer_flotante .text-left {
        text-align: center !important;
        margin-bottom: 6px;
    }

    .footer_flotante .text-right {
        text-align: center !important;
    }

    .footer_flotante .btn-contact {
        width: 100%;
        padding: 6px 12px;
        font-size: 0.72rem;
    }
}

/* Internal page hero */
.csp-internal-hero,
.contact-hero {
    position: relative;
    overflow: hidden;
    background-color: var(--tour-dark);
}

.csp-internal-hero-image,
.contact-hero-image {
    width: 100%;
    height: min(62vh, 560px);
    min-height: 420px;
    object-fit: cover;
    object-position: center;
    opacity: 0.86;
}

.csp-internal-hero-overlay,
.contact-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.84) 0%, rgba(0, 0, 0, 0.58) 42%, rgba(0, 0, 0, 0.12) 100%);
    pointer-events: none;
}

.csp-internal-hero-content,
.contact-hero-content {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
}

.csp-internal-hero-inner,
.contact-hero-inner {
    max-width: 760px;
}

.csp-internal-breadcrumb,
.contact-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    padding: 0;
    margin: 0 0 1rem;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.74rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1.35;
    list-style: none;
    text-transform: uppercase;
}

.csp-internal-breadcrumb a,
.contact-breadcrumb a {
    color: rgba(255, 255, 255, 0.92);
}

.csp-internal-breadcrumb i,
.contact-breadcrumb i {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.58rem;
}

.csp-internal-eyebrow,
.contact-eyebrow {
    display: inline-flex;
    gap: 0.55rem;
    align-items: center;
    margin-bottom: 1rem;
    color: var(--tour-primary);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.csp-internal-title,
.contact-title {
    margin: 0 0 1.1rem;
    color: var(--tour-white);
    font-size: 3.75rem;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.03;
    text-transform: uppercase;
}

.csp-internal-hero-text,
.contact-hero-text {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.75;
}

/* Internal page content */
.csp-internal-main,
.contact-main {
    padding: 4rem 0;
    background-color: var(--tour-light);
}

.csp-internal-card,
.contact-intro-card,
.contact-sidebar-card,
.tour-contact-form-card {
    border: 1px solid var(--tour-border);
    background-color: var(--tour-white);
}

.csp-page-card {
    padding: 1.5rem;
}

.csp-card-spaced {
    margin-bottom: 1rem;
}

.csp-card-spaced-lg {
    margin-bottom: 1.5rem;
}

.csp-kicker-spaced {
    margin-bottom: 0.5rem;
}

.csp-heading-spaced,
.csp-icon-spaced,
.csp-payment-card-number {
    margin-bottom: 1rem;
}

.csp-copy-tight {
    margin-bottom: 0;
}

.csp-main-row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
    align-items: flex-start;
}

.csp-card-row {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1rem;
}

.csp-sidebar-stack {
    display: grid;
    gap: 1rem;
}

@media (min-width: 1200px) {
    .csp-sidebar-stack {
        position: sticky;
        top: 1rem;
    }
}

.contact-sidebar-title {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 1rem;
}

.csp-clean-list {
    display: grid;
    gap: 1rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.csp-form-grid {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
}

.csp-field {
    display: grid;
    gap: 0.5rem;
    margin-bottom: 0;
}

.csp-button-inline {
    display: inline-flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
}

.csp-card-fill {
    height: 100%;
}

.csp-form-section {
    padding: 0;
    margin: 0 0 1.5rem;
    border: 0;
}

.csp-form-section-title {
    margin-bottom: 1rem;
}

.csp-internal-kicker,
.contact-intro-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0;
    color: var(--tour-primary-dark);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.csp-internal-section-title,
.contact-intro-title {
    margin: 0;
    color: var(--tour-dark);
    font-size: 2.35rem;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.08;
    text-transform: uppercase;
}

.csp-internal-copy,
.contact-intro-text {
    margin: 0;
    color: var(--tour-text);
    line-height: 1.75;
}

.csp-content h2,
.csp-content h3 {
    color: var(--tour-dark);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.12;
    text-transform: uppercase;
}

.csp-content h2 {
    font-size: 1.7rem;
}

.csp-content h3 {
    font-size: 1.1rem;
}

.csp-content p,
.csp-content li {
    color: var(--tour-text);
    line-height: 1.75;
}

.csp-icon-list li {
    display: grid;
    grid-template-columns: 1.2rem minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
}

.csp-icon-list i {
    margin-top: 0.35rem;
    color: var(--tour-primary);
}

.csp-soft-panel {
    border: 1px solid var(--tour-border);
    background-color: var(--tour-soft);
}

.csp-mini-label {
    color: var(--tour-primary-dark);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    line-height: 1.2;
    text-transform: uppercase;
}

.csp-card-icon {
    display: inline-flex;
    width: 3rem;
    height: 3rem;
    align-items: center;
    justify-content: center;
    background-color: var(--tour-soft);
    color: var(--tour-primary);
    font-size: 1.25rem;
}

.csp-payment-card-preview {
    min-height: 14rem;
    background:
        linear-gradient(135deg, rgba(241, 1, 0, 0.94), rgba(241, 1, 0, 0.96)),
        var(--tour-primary);
    color: var(--tour-white);
    display: grid;
    align-content: space-between;
}

.csp-payment-card-preview small,
.csp-payment-card-preview span {
    color: rgba(255, 255, 255, 0.82);
}

.csp-payment-card-preview small {
    display: block;
}

.csp-payment-brand {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}

.csp-payment-brand .fa-cc-visa {
    font-size: 2em;
}

.csp-payment-card-number {
    color: var(--tour-white);
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.csp-form-note {
    border: 1px dashed rgba(241, 1, 0, 0.5);
    background-color: var(--tour-soft);
    color: var(--tour-primary-dark);
    font-size: 0.9rem;
    font-weight: 500;
}

.csp-note-icon {
    margin-right: 0.5rem;
}

.csp-payment-meta {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.csp-payment-expiry {
    text-align: right;
}

.contact-sidebar-title {
    color: var(--tour-dark);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    line-height: 1.25;
    text-transform: uppercase;
}

.contact-sidebar-title i {
    color: var(--tour-primary);
}

.contact-info-list a,
.contact-info-list li,
.contact-help-list li {
    display: grid;
    grid-template-columns: 1.1rem minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
    color: var(--tour-text);
    font-size: 0.94rem;
    line-height: 1.45;
}

.contact-info-list i,
.contact-help-list i {
    margin-top: 0.2rem;
    color: var(--tour-primary);
}

.contact-info-list strong,
.contact-info-list span {
    display: block;
}

.contact-info-list strong {
    color: var(--tour-dark);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.contact-info-list span {
    margin-top: 0.1rem;
}

.contact-social {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--tour-border);
    background-color: var(--tour-light);
    color: var(--tour-dark);
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.contact-social:hover,
.contact-social:focus {
    border-color: var(--tour-primary);
    background-color: var(--tour-primary);
    color: var(--tour-white);
    transform: translateY(-2px);
}

/* Tour category page */
.csp-blog-topic-grid {
    --bs-gutter-x: 1.35rem;
    --bs-gutter-y: 1.35rem;
}

.csp-blog-topic-card {
    position: relative;
    display: grid;
    height: 100%;
    min-height: 24rem;
    overflow: hidden;
    border: 1px solid var(--tour-border);
    background-color: var(--tour-dark);
    box-shadow: 0 14px 34px rgba(17, 24, 39, 0.06);
    transition: border-color 0.26s ease, box-shadow 0.26s ease, transform 0.26s ease;
}

.csp-blog-topic-card::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    border: 1px solid transparent;
    content: "";
    pointer-events: none;
    transition: border-color 0.26s ease;
}

.csp-blog-topic-media {
    position: absolute;
    inset: 0;
    display: block;
    overflow: hidden;
    background-color: var(--tour-dark);
}

.csp-blog-topic-media::before {
    position: absolute;
    top: -25%;
    bottom: -25%;
    left: -70%;
    z-index: 2;
    width: 42%;
    background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.2) 48%, transparent 100%);
    content: "";
    opacity: 0;
    transform: skewX(-18deg);
    transition: left 0.64s ease, opacity 0.28s ease;
}

.csp-blog-topic-media::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.34) 42%, rgba(0, 0, 0, 0.82) 100%),
        linear-gradient(90deg, rgba(0, 0, 0, 0.68) 0%, rgba(0, 0, 0, 0.16) 100%);
    content: "";
    transition: opacity 0.26s ease, background 0.26s ease;
}

.csp-blog-topic-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.42s ease, opacity 0.42s ease;
}

.csp-blog-topic-body {
    position: relative;
    z-index: 3;
    display: grid;
    min-height: 24rem;
    align-content: end;
    gap: 0.8rem;
    padding: 1.35rem;
    opacity: 0;
    transition: opacity 0.32s ease;
}

.csp-blog-topic-count {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 4;
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    justify-content: center;
    padding: 0.42rem 0.65rem;
    background-color: var(--tour-primary);
    color: var(--tour-white);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.csp-blog-topic-title {
    color: var(--tour-white);
    font-size: 1.45rem;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.1;
    text-transform: uppercase;
}

.csp-blog-topic-copy {
    color: rgba(255, 255, 255, 0.86);
    line-height: 1.65;
    opacity: 0;
    transition: opacity 0.28s ease 0.06s;
}

.csp-blog-topic-link {
    display: inline-flex;
    gap: 0.5rem;
    align-items: center;
    align-self: end;
    margin-top: 0.2rem;
    color: var(--tour-white);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
    opacity: 0;
    transition: opacity 0.28s ease 0.12s;
}

.csp-blog-topic-link i {
    color: var(--tour-primary);
    transition: transform 0.24s ease;
}

.csp-blog-topic-card:hover,
.csp-blog-topic-card:focus {
    border-color: rgba(241, 1, 0, 0.52);
    box-shadow: 0 24px 52px rgba(17, 24, 39, 0.13);
    transform: translateY(-7px);
}

.csp-blog-topic-card:hover::after,
.csp-blog-topic-card:focus::after {
    border-color: rgba(241, 1, 0, 0.24);
}

.csp-blog-topic-card:hover .csp-blog-topic-media::after,
.csp-blog-topic-card:focus .csp-blog-topic-media::after {
    opacity: 0.92;
}

.csp-blog-topic-card:hover .csp-blog-topic-media::before,
.csp-blog-topic-card:focus .csp-blog-topic-media::before {
    left: 125%;
    opacity: 1;
}

.csp-blog-topic-card:hover .csp-blog-topic-media img,
.csp-blog-topic-card:focus .csp-blog-topic-media img {
    opacity: 0.95;
    transform: scale(1.1);
}

.csp-blog-topic-card:hover .csp-blog-topic-body,
.csp-blog-topic-card:focus .csp-blog-topic-body,
.csp-blog-topic-card:hover .csp-blog-topic-copy,
.csp-blog-topic-card:focus .csp-blog-topic-copy,
.csp-blog-topic-card:hover .csp-blog-topic-link,
.csp-blog-topic-card:focus .csp-blog-topic-link {
    opacity: 1;
}

.csp-blog-topic-card:hover .csp-blog-topic-link i,
.csp-blog-topic-card:focus .csp-blog-topic-link i {
    transform: translateX(4px);
}

/* Reusable internal inquiry/contact form */
.tour-contact-form-title {
    margin: 0 0 1.35rem;
    color: var(--tour-dark);
    font-size: 1.9rem;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.15;
    text-transform: uppercase;
}
.tour-contact-control-wrap {
    position: relative;
}

.tour-contact-control-wrap i {
    position: absolute;
    top: 50%;
    left: 1rem;
    z-index: 2;
    color: #9aa2af;
    font-size: 1rem;
    transform: translateY(-50%);
    transition: color 0.2s ease, transform 0.2s ease;
    pointer-events: none;
}

.tour-contact-textarea-wrap i {
    top: 2.1rem;
    transform: none;
}

.tour-contact-input,
.tour-contact-select,
.tour-contact-textarea {
    width: 100%;
    min-height: 3.75rem;
    padding: 0.9rem 1rem 0.9rem 3.25rem;
    border: 1px solid #dfe4ea;
    border-radius: var(--tour-radius);
    background-color: #f8f9fb;
    color: var(--tour-dark);
    font-size: 0.98rem;
    font-weight: 500;
    line-height: 1.35;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.tour-contact-select {
    appearance: none;
    padding-right: 3.25rem;
    background-image:
        linear-gradient(45deg, transparent 50%, #2f3540 50%),
        linear-gradient(135deg, #2f3540 50%, transparent 50%);
    background-position:
        calc(100% - 1.42rem) 50%,
        calc(100% - 1.08rem) 50%;
    background-size: 0.42rem 0.42rem, 0.42rem 0.42rem;
    background-repeat: no-repeat;
}

.tour-contact-textarea {
    min-height: 13rem;
    resize: vertical;
}

.tour-contact-input::placeholder,
.tour-contact-textarea::placeholder {
    color: transparent;
}

.tour-contact-control-wrap:hover i,
.tour-contact-input:focus + i,
.tour-contact-select:focus + i,
.tour-contact-textarea:focus + i {
    color: var(--tour-primary);
    transform: translateY(-50%) translateX(2px);
}

.tour-contact-textarea-wrap:hover i,
.tour-contact-textarea:focus + i {
    transform: translateX(2px);
}

.tour-contact-input:hover,
.tour-contact-select:hover,
.tour-contact-textarea:hover,
.tour-contact-input:focus,
.tour-contact-select:focus,
.tour-contact-textarea:focus {
    border-color: rgba(241, 1, 0, 0.5);
    background-color: var(--tour-white);
    box-shadow: 0 12px 26px rgba(17, 24, 39, 0.06);
    outline: 0;
}

.tour-contact-submit {
    min-height: 3rem;
    padding: 0.8rem 1.35rem;
    border: 1px solid var(--tour-primary);
    border-radius: var(--tour-radius);
    background-color: var(--tour-primary);
    color: var(--tour-white);
    font-size: 0.9rem;
    font-weight: 900;
    line-height: 1;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.tour-contact-submit:hover,
.tour-contact-submit:focus {
    border-color: var(--tour-primary-dark);
    background-color: var(--tour-primary-dark);
    color: var(--tour-white);
    transform: translateY(-2px);
}

@media (max-width: 767.98px) {
    .csp-internal-hero-image,
    .contact-hero-image {
        height: 560px;
        min-height: 560px;
    }

    .csp-internal-main,
    .contact-main {
        padding: 2rem 0;
    }

    .csp-page-card {
        padding: 1rem;
    }

    .csp-internal-title,
    .contact-title {
        font-size: 2.4rem;
    }

    .csp-internal-section-title,
    .contact-intro-title {
        font-size: 1.7rem;
    }

    .csp-blog-topic-grid {
        --bs-gutter-x: 1rem;
        --bs-gutter-y: 1rem;
    }

    .csp-blog-topic-card {
        min-height: 21rem;
    }

    .csp-blog-topic-body {
        min-height: 21rem;
        gap: 0.65rem;
        padding: 1rem;
        opacity: 1;
    }

    .csp-blog-topic-title {
        font-size: 1.15rem;
    }

    .csp-blog-topic-copy {
        opacity: 1;
    }

    .csp-blog-topic-link {
        opacity: 1;
    }

    .tour-contact-form-title {
        font-size: 1.45rem;
    }

    .csp-content h2 {
        font-size: 1.45rem;
    }

    .csp-payment-card-number {
        font-size: 1.05rem;
    }

    .tour-contact-input,
    .tour-contact-select {
        min-height: 3.35rem;
    }

    .tour-contact-textarea {
        min-height: 12rem;
    }
}

/* Consolidated project styles */

/* Front page styles */

.csp-section {
    padding: clamp(3rem, 6vw, 5.5rem) 0;
}

.csp-section-light {
    background-color: var(--csp-light);
}

.csp-section-title {
    margin: 0 0 1.25rem;
    color: var(--csp-dark);

    font-weight: 500;
    letter-spacing: -0.045em;
    line-height: 1.05;
}

.csp-section-title span {
    color: var(--csp-primary);
}


/* Front-page hero follows the panoramic media ratio so the next section reflows with every viewport width. */
.front-hero {
    position: relative;
    aspect-ratio: 2400 / 1032;
    min-height: 0;
    display: flex;
    align-items: center;
    overflow: hidden;
    border-radius: 7px;
    background-color: var(--csp-dark);
    text-align: left;
}

/* Hero media fills the frame without affecting the content layout. */
.front-hero-media,
.front-hero-media .carousel-inner,
.front-hero-media .carousel-item {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

/* Hero foreground media preserves its original aspect ratio and remains fully visible without a cover crop. */
.front-hero-image,
.front-hero-video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

/* The proportional hero image stays crisp while occupying the media frame at full width. */
.front-hero-image {
    display: block;
}

/* Hero container aligns content to the left inside the grid layout. */
.front-hero-container {
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: flex-start;
    padding-top: clamp(3rem, 6vw, 5rem);
    padding-bottom: clamp(3rem, 6vw, 5rem);
    padding-left: clamp(1rem, 3.5vw, 2.5rem);
    pointer-events: none;
}

/* Hero content stays above media, aligned to the left with controlled measure and high-contrast text shadow. */
.front-hero-content {
    position: relative;
    z-index: 3;
    max-width: 820px;
    width: 100%;
    color: var(--csp-white);
    text-align: left;
    text-shadow: 2px 2px 0px hsla(202 0% 0% / 30%);
    pointer-events: auto;
}

.front-hero-title {
    margin: 0 0 0.45rem;
    color: var(--csp-white);
    font-size: clamp(1.25rem, 2vw, 1.85rem);
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-transform: uppercase;
}

.front-hero-subtitle {
    margin: 0 0 1rem;
    color: var(--csp-white);
    font-size: clamp(1.85rem, 3.4vw, 3rem);
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.1;
    text-transform: uppercase;
}

/* The white Tripadvisor award follows the hero promise as a compact trust signal. */
.front-hero-award {
    display: block;
    width: clamp(4.75rem, 7vw, 6.25rem);
    height: auto;
    filter: drop-shadow(0 0.35rem 0.75rem rgba(0, 0, 0, 0.28));
}

/* Slider controls remain visible while yielding visual priority to the hero copy. */
.front-hero-control {
    z-index: 4;
    width: 3rem;
    height: 3rem;
    top: 50%;
    margin: 0 1rem;
    border: 1px solid rgba(255, 255, 255, 0.48);
    border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.3);
    opacity: 0.82;
    transform: translateY(-50%);
    transition: background-color 180ms ease, border-color 180ms ease, opacity 180ms ease;
}

/* Slider controls use the brand interaction state on hover and keyboard focus. */
.front-hero-control:hover,
.front-hero-control:focus-visible {
    border-color: var(--csp-primary);
    background-color: var(--csp-primary);
    opacity: 1;
}

/* Preserve a clear keyboard focus indicator over changing photography. */
.front-hero-control:focus-visible {
    outline: 3px solid var(--csp-white);
    outline-offset: 3px;
}

/* Tailored introduction: a vertical editorial flow establishes the brand story after the hero. */
.front-tailored-intro {
    background-color: var(--csp-light);
}

/* The single-column composition places the introduction above its supporting copy. */
.front-tailored-intro-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(1.75rem, 3vw, 2.5rem);
    text-align: center;
}

/* The paired heading keeps both supplied title lines in one clear semantic hierarchy. */
.front-tailored-intro-title {
    margin: 0;
    color: var(--csp-dark);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.04;
    text-transform: uppercase;
}

/* The opening phrase uses the brand red as the first line of the editorial statement. */
.front-tailored-intro-title span {
    display: block;
    margin-bottom: 1.25rem;
    color: var(--csp-primary);
    font-size: clamp(1.25rem, 7vw, 2.5rem);
    letter-spacing: -0.02em;
    line-height: 1.1;
    text-transform: none;
}

/* Founder welcome: a warm editorial surface gives the personal message its own quiet moment. */
.front-ceo-welcome {
    background-color: var(--csp-warm, #fffaf5);
}

/* The portrait and letter share one restrained two-column composition on larger screens. */
.front-ceo-welcome-layout {
    display: grid;
    grid-template-columns: minmax(15rem, 0.7fr) minmax(0, 1.3fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: stretch;
}

/* The founder media frame presents the single photo or video selected by the ACF priority. */
.front-ceo-welcome-media {
    position: relative;
    min-height: 28rem;
    margin: 0;
    overflow: hidden;
    border-radius: 7px !important;
    background-color: #0b1118;
}

/* The chosen media asset fills the frame without maintaining hidden duplicate content. */
.front-ceo-welcome-media > img,
.front-ceo-welcome-media > video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    border-radius: 7px !important;
}

/* Photo-only hover movement remains as the section's subtle authored interaction. */
.front-ceo-welcome-media:hover > img {
    transform: scale(1.025);
    transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* The message follows the rhythm of a personal letter rather than a promotional card. */
.front-ceo-welcome-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-block: clamp(0.5rem, 2vw, 2rem);
}

/* The heading layers the quotation behind the title without adding a decorative container. */
.front-ceo-welcome-heading {
    position: relative;
    min-height: 4.75rem;
    display: flex;
    align-items: center;
    padding: 0.85rem 0 0.35rem 1.1rem;
    isolation: isolate;
}

/* The plain gray quotation mark sits quietly behind the founder's welcome title. */
.front-ceo-welcome-icon {
    position: absolute;
    z-index: 0;
    top: -0.7rem;
    left: -0.3rem;
    color: #c7c7c7;
    font-size: clamp(4rem, 6vw, 5.25rem);
    line-height: 1;
    opacity: 0.55;
    pointer-events: none;
}

/* The welcome title uses a refined, smaller font size for an elegant editorial balance. */
.front-ceo-welcome-heading h2 {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--csp-dark);
    font-family: var(--font-heading, "Metromedium", "Roboto", sans-serif);
    font-size: clamp(1.35rem, 2.2vw, 1.85rem);
    font-weight: 500;
    letter-spacing: -0.025em;
    line-height: 1.22;
    text-wrap: balance;
}

/* The welcome copy stays open and readable without a boxed or bordered treatment. */
.front-ceo-welcome-message {
    display: grid;
    gap: 1rem;
    margin-top: clamp(1.5rem, 3vw, 2.25rem);
}

.front-ceo-welcome-message p {
    margin: 0;
    color: var(--csp-text);
    font-size: 1rem;
    line-height: 1.75;
}

/* Signature and booking action conclude the letter on one calm, practical line. */
.front-ceo-welcome-footer {
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    margin-top: clamp(1.75rem, 4vw, 3rem);
    padding-top: 1.25rem;
    border-top: 1px solid var(--csp-border);
}

.front-ceo-welcome-signature {
    display: grid;
    gap: 0.2rem;
}

.front-ceo-welcome-signature strong {
    color: var(--csp-dark);
    font-size: 1.1rem;
    font-weight: 700;
}

.front-ceo-welcome-signature span,
.front-ceo-welcome-signature small {
    color: var(--csp-text);
    font-size: 0.86rem;
    line-height: 1.45;
}

.front-ceo-welcome-signature small i {
    margin-right: 0.35rem;
    color: var(--csp-primary);
}

/* The single red action turns the founder's invitation into a clear reservation path. */
.front-ceo-welcome-button {
    min-height: 3rem;
    display: inline-flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 1.2rem;
    border-radius: 7px;
    background-color: var(--csp-primary);
    color: var(--csp-white);
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color 180ms ease, transform 180ms ease;
}

.front-ceo-welcome-button:hover,
.front-ceo-welcome-button:focus-visible {
    background-color: var(--csp-primary-dark, #b90201);
    color: var(--csp-white);
    transform: translateY(-2px);
}

.front-ceo-welcome-button:focus-visible {
    outline: 3px solid rgba(241, 1, 0, 0.25);
    outline-offset: 3px;
}

@media (max-width: 991.98px) {
    /* Tablet stacks the portrait above the letter before either column becomes cramped. */
    .front-ceo-welcome-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 2rem;
    }

    .front-ceo-welcome-media {
        min-height: 24rem;
    }

    .front-ceo-welcome-media img {
        object-position: center 35%;
    }
}

@media (max-width: 575.98px) {
    /* Mobile keeps the letter linear and gives the booking action a comfortable touch target. */
    .front-ceo-welcome-media {
        min-height: 20rem;
    }

    .front-ceo-welcome-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .front-ceo-welcome-button {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    /* Motion-sensitive visitors receive the same hierarchy without image or control movement. */
    .front-ceo-welcome-media img,
    .front-ceo-welcome-button {
        transition: none;
    }

    .front-ceo-welcome-layout:hover .front-ceo-welcome-media img,
    .front-ceo-welcome-button:hover,
    .front-ceo-welcome-button:focus-visible {
        transform: none;
    }
}

/* Welcome features: a strong introduction leads into three lightweight benefit groups. */
.front-welcome-features {
    background-color: var(--csp-white);
}

/* The title remains left-aligned and compact as the section's visual anchor. */
.front-welcome-features-intro {
    text-align: left;
}

/* Desktop separates the title column from the factor list with a restrained gray divider. */
@media (min-width: 768px) {
    .front-welcome-features-intro {
        align-self: stretch;
        padding-right: clamp(1.5rem, 3vw, 2.5rem);
        border-right: 1px solid var(--csp-border);
    }
}

/* The section title provides distinct visual hierarchy between agency brand and slogan statement. */
.front-welcome-features-title {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

/* The welcome word uses the established signature face and a deliberate pause before the agency name. */
.front-welcome-features-lead {
    display: block;
    color: var(--csp-dark);
    font-family: var(--font-signature);
    font-size: clamp(2rem, 3vw, 2.7rem);
    font-weight: 400;
    letter-spacing: 0.02em;
    line-height: 1.1;
    text-transform: none;
}

/* The connector sits on its own line in the site's simple body typeface. */
.front-welcome-features-connector {
    display: block;
    color: var(--csp-copy);
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 0.02em;
    line-height: 1;
    text-transform: lowercase;
}

/* Distinct agency brand styling: prominent, elegant brand accent. */
.front-welcome-features-agency {
    display: block;
    color: var(--csp-primary);
    font-size: clamp(1.2rem, 1.8vw, 1.45rem);
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.15;
    text-transform: uppercase;
}

/* Slogan / section statement: clean editorial typography with clear separation from agency brand. */
.front-welcome-features-slogan {
    display: block;
    color: var(--csp-dark);
    font-size: clamp(1.1rem, 1.5vw, 1.3rem);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.35;
    text-transform: none;
}

/* The three factors form a calm vertical sequence of individually framed editorial blocks. */
.front-welcome-features-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(1rem, 2vw, 1.4rem);
}

/* Each benefit uses a restrained surface and full outline to read as one refined content block. */
.front-welcome-feature {
    position: relative;
    overflow: hidden;
    padding: clamp(1.5rem, 2.6vw, 2.15rem);
    border-radius: 7px;
    background-color: var(--csp-light);
}

/* A short vertical accent moves the existing brand cue to the left edge of each block. */
.front-welcome-feature::before {
    position: absolute;
    top: clamp(1.5rem, 2.6vw, 2.15rem);
    left: 0;
    width: 3px;
    height: clamp(3.5rem, 7vw, 5.5rem);
    border-radius: 7px;
    background-color: var(--csp-primary);
    content: "";
}

/* Every benefit places its title directly above the related paragraph for a natural reading order. */
.front-welcome-feature-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
}

/* Benefit headings remain close to their descriptions for clear semantic grouping. */
.front-welcome-feature h3 {
    margin: 0;
    color: var(--csp-dark);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.25;
    text-wrap: balance;
}

/* Feature descriptions share a comfortable reading rhythm across both columns. */
.front-welcome-feature p {
    margin: 0;
    color: var(--csp-text);
    font-size: 1rem;
    line-height: 1.65;
}

/* Awards section: compact, equidistant vertical padding on a subtle light surface */
.front-awards,
.front-awards.csp-section {
    background-color: var(--csp-light);
    padding: clamp(2rem, 3.5vw, 2.75rem) 0;
}

/* Awards heading and statement with clean, equidistant editorial spacing */
.front-awards-header {
    display: grid;
    gap: 0.5rem;
}

/* Awards description paragraph inherits site content typography with compact measure */
.front-awards-header p {
    margin: 0;
    color: var(--csp-text);
    font-size: 1rem;
    line-height: 1.55;
    max-width: 76ch;
}

/* The award title remains the main entry point without relying on an extra label. */
.front-awards-title {
    margin: 0;
    color: var(--csp-dark);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.05;
    text-wrap: balance;
    text-transform: uppercase;
}

/* The award collection: 6 equidistant, uniformly centered badge columns with controlled vertical margins */
.front-awards-visual {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(6, 1fr);
    justify-items: center;
    align-items: center;
    gap: clamp(0.75rem, 1.75vw, 1.5rem);
    margin: 1.5rem 0;
}

/* Slightly enlarged badge dimensions improve recognition while preserving the six-item row. */
.front-awards-visual img {
    display: block;
    width: 108%;
    max-width: 150px;
    height: auto;
    object-fit: contain;
    transition: transform 0.22s ease;
}

.front-awards-visual img:hover {
    transform: translateY(-2px);
}

/* Review link: centered, compact and equidistant from the visual row without ghost margins */
.front-awards-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    margin: 0 auto;
    gap: 0.5rem;
    min-height: auto;
    border-radius: 7px;
    color: var(--csp-dark);
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: underline;
    text-decoration-color: var(--csp-primary);
    text-decoration-thickness: 2px;
    text-underline-offset: 0.35rem;
    transition: color 180ms ease, text-underline-offset 180ms ease;
}

/* Hover and keyboard focus reinforce the external review action with the brand color. */
.front-awards-link:hover,
.front-awards-link:focus-visible {
    color: var(--csp-primary);
    text-underline-offset: 0.5rem;
}

/* Keyboard navigation receives a visible indicator that follows the project corner rule. */
.front-awards-link:focus-visible {
    outline: 3px solid var(--csp-primary);
    outline-offset: 5px;
}

/* Bestseller tours: a white editorial surface separates discovery content from the awards block. */
.front-bestsellers {
    background-color: var(--csp-white);
}

/* The section introduction stacks its heading above the supporting copy. */
.front-bestsellers-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
}

/* Both supplied title lines remain within one semantic heading. */
.front-bestsellers-title {
    margin: 0;
    color: var(--csp-dark);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.04;
    text-transform: uppercase;
    text-align: center;
}

/* The opening phrase uses brand color and sentence case to create contrast within the title. */
.front-bestsellers-title span {
    display: block;
    margin-bottom: 1rem;
    color: var(--csp-primary);
    letter-spacing: -0.02em;
    line-height: 1.1;
    text-transform: none;
}

/* Tour cards form the requested three-column structure with consistent vertical rhythm. */
.front-bestsellers-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1.25rem, 2.5vw, 2rem);
    margin-top: clamp(3rem, 6vw, 5rem);
}

/* Video quote hero: full-width moving landscape carrying the travel statement from edge to edge. */
.front-video-quote-hero {
    position: relative;
    width: 100%;
    min-height: clamp(22rem, 45vh, 34rem);
    display: grid;
    place-items: center;
    padding: clamp(3.5rem, 6vw, 5.5rem) 1.5rem;
    overflow: hidden;
    border-radius: 0;
    background-color: var(--csp-dark);
    isolation: isolate;
}

/* The background video fills the hero from edge to edge without affecting content flow. */
.front-video-quote-media {
    position: absolute;
    z-index: -2;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* A dark neutral overlay maintains readable contrast over every video frame. */
.front-video-quote-overlay {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.52);
}

/* The quotation remains centered horizontally and vertically with a controlled, elegant measure. */
.front-video-quote-content {
    width: min(56rem, 100%);
    margin: 0;
    color: var(--csp-white);
    text-align: center;
}

/* The main quote uses a refined, smaller font size for a balanced and sophisticated editorial feel. */
.front-video-quote-content p {
    margin: 0;
    color: inherit;
    font-family: "Metromedium", "Roboto", sans-serif;
    font-size: clamp(1.35rem, 2.5vw, 2.15rem);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.35;
    text-wrap: balance;
}

/* The attribution stays concise and clearly subordinate to the quotation. */
.front-video-quote-content cite {
    display: block;
    margin-top: 1.25rem;
    color: inherit;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 0.82rem;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}



/* Signature tours: a soft alternate surface distinguishes this second tour collection. */
.front-signature-tours {
    background-color: var(--csp-light);
}

/* The signature heading and paragraph follow the broad stacked composition in the reference. */
.front-signature-tours-header {
    text-align: center;
    display: grid;
    gap: clamp(1.5rem, 3vw, 1.5rem);
}

/* The section title uses the established display face and uppercase treatment. */
.front-signature-tours-title {
    margin: 0;
    color: var(--csp-dark);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.05;
    text-transform: uppercase;
}

/* Bootstrap controls the responsive columns while this class establishes section spacing. */
.front-signature-tours-grid {
    margin-top: clamp(3rem, 6vw, 5rem);
}

/* Flex columns allow the shared cards to remain equal-height within each Bootstrap row. */
.front-signature-tours-column {
    display: flex;
}

/* Tour hover cards fill their Bootstrap columns without adding section-specific card markup. */
.front-signature-tours-column .tour-hover-card {
    width: 100%;
}

/* Premium treks: a clean white surface continues the editorial tour collections. */
.front-premium-treks {
    background-color: var(--csp-white);
}

/* The premium trek heading and description follow the established centered hierarchy. */
.front-premium-treks-header {
    display: grid;
    gap: 1.5rem;
    text-align: center;
}

/* The premium trek title matches the uppercase display treatment used by adjacent collections. */
.front-premium-treks-title {
    margin: 0;
    color: var(--csp-dark);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.05;
    text-transform: uppercase;
}

/* Bootstrap supplies responsive columns while this spacing separates cards from the introduction. */
.front-premium-treks-grid {
    margin-top: clamp(3rem, 6vw, 5rem);
}

/* Flex columns keep all shared cards equal in height within the Bootstrap row. */
.front-premium-treks-column {
    display: flex;
}

/* Tour best cards fill each premium trek column and retain equal width. */
.front-premium-treks-column .tour-best-card {
    width: 100%;
}

/* Trending tours: an editorial introduction leads into the final three-tour collection. */
.front-trending-tours {
    background-color: var(--csp-light);
}

/* The heading group centers the supplied title and balances the long experiential statement. */
.front-trending-tours-header {
    display: grid;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    text-align: center;
}

/* The trending title uses the brand color as the strongest visual cue in the section. */
.front-trending-tours-title {
    margin: 0;
    color: var(--csp-primary);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.05;
    text-transform: uppercase;
}

/* The experiential subtitle stays prominent while wrapping naturally on smaller screens. */
.front-trending-tours-subtitle {
    margin: 0 auto;
    color: var(--csp-dark);
    font-family: "Metromedium", "Roboto", sans-serif;
    font-size: clamp(1.5rem, 3vw, 2.75rem);
    font-weight: 500;
    letter-spacing: -0.025em;
    line-height: 1.15;
    text-wrap: balance;
}

/* The supplied paragraphs form one readable editorial stream without boxed decoration, spaced via Bootstrap 5. */
.front-trending-tours-copy {
    display: grid;
    gap: 1.5rem;
    margin-inline: auto;
}

/* Paragraph styling maintains comfortable reading contrast and rhythm. */
.front-trending-tours-copy p {
    margin: 0;
    color: var(--csp-text);
    font-size: clamp(1rem, 1.35vw, 1.15rem);
    line-height: 1.8;
}

/* Bootstrap supplies the responsive columns while this margin separates tours from the story. */
.front-trending-tours-grid {
    margin-top: clamp(3rem, 6vw, 5rem);
}

/* Flex columns maintain equal-height shared tour cards across each Bootstrap row. */
.front-trending-tours-column {
    display: flex;
}

/* Tour best cards fill each trending tour column and retain equal width. */
.front-trending-tours-column .tour-best-card {
    width: 100%;
}

/* Planning hero: a calm photographic surface presents the booking path as one clear sequence. */
.front-planning-hero {
    position: relative;
    min-height: clamp(44rem, 72vh, 54rem);
    display: grid;
    align-items: center;
    overflow: hidden;
    border-radius: 7px !important;
    background-color: var(--csp-dark);
    isolation: isolate;
}

/* The destination photograph is sized with vertical bleed for scroll-driven parallax. */
.front-planning-hero-image {
    position: absolute;
    z-index: -3;
    top: -15%;
    left: 0;
    width: 100%;
    height: 130%;
    object-fit: cover;
    object-position: center;
    will-change: transform;
}

/* Native CSS scroll-driven parallax animation per modern web guidance. */
@supports ((animation-timeline: view()) and (animation-range: entry)) {
    @keyframes front-planning-parallax {
        from {
            transform: translateY(-10%);
        }
        to {
            transform: translateY(10%);
        }
    }

    .front-planning-hero {
        view-timeline-name: --front-planning-timeline;
        view-timeline-axis: block;
    }

    .front-planning-hero-image {
        animation: front-planning-parallax linear both;
        animation-timeline: --front-planning-timeline;
        animation-range: entry 0% exit 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .front-planning-hero-image {
        animation: none !important;
        transform: none !important;
    }
}

/* A restrained directional overlay protects copy without obscuring the destination image. */
.front-planning-hero-overlay {
    position: absolute;
    z-index: -2;
    inset: 0;
    background: linear-gradient(
        115deg,
        rgba(5, 15, 25, 0.94) 0%,
        rgba(9, 31, 48, 0.84) 52%,
        rgba(8, 22, 35, 0.72) 100%
    );
}

/* The content container uses a compact vertical rhythm suited to a short reservation guide. */
.front-planning-hero-content {
    padding-top: clamp(3.5rem, 6vw, 5.5rem);
    padding-bottom: clamp(3.5rem, 6vw, 5.5rem);
    color: var(--csp-white);
}

/* The moved travel-interest block opens the hero and remains visually distinct from the planning steps. */
.front-planning-hero-interest {

}

/* Inside the photographic hero, the editorial heading follows the planning content alignment. */
.front-planning-hero-interest .front-trending-tours-header {
    gap: clamp(0.85rem, 2vw, 1.5rem);
    text-align: left;
}

/* The title segment after the divider contrasts in white against the photographic hero. */
.front-planning-hero-interest .front-travel-interest-title-secondary {
    color: var(--csp-white);
}

/* The moved subtitle gains sufficient contrast while keeping a controlled reading width. */
.front-planning-hero-interest .front-trending-tours-subtitle {
    max-width: 28ch;
    margin-inline: 0;
    color: var(--csp-white);
}

/* The moved long-form copy uses a readable line length against the dark image overlay. */
.front-planning-hero-interest .front-trending-tours-copy {

}

/* Body paragraphs use softened white to preserve hierarchy within the hero. */
.front-planning-hero-interest .front-trending-tours-copy p {
    color: rgba(255, 255, 255, 0.86);
}

/* The tailoring statement introduces the moved editorial copy with restrained brand emphasis. */
.front-planning-hero-interest .front-travel-interest-lead {
    color: var(--csp-primary);
    font-family: "Metromedium", "Roboto", sans-serif;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.25;
}

/* The booking statement anchors the sequence with a direct editorial alignment. */
.front-planning-hero-title {
    margin: 0;
    color: inherit;
    font-size: clamp(2rem, 3.4vw, 3.4rem);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.08;
    text-align: left;
    text-wrap: balance;
}

/* Three columns for planning hero steps */
.front-planning-hero-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1.5rem, 3vw, 3rem);
    margin-top: clamp(2.5rem, 5vw, 4rem);
    position: relative;
}

/* Each reservation step has an interactive card container with subtle glass treatment. */
.front-planning-hero-step {
    position: relative;
    display: grid;
    align-content: start;
    padding: 1.5rem;
    border-radius: 7px !important;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background-color: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(8px);
    text-align: left;
    transition:
        border-color 0.35s ease,
        background-color 0.35s ease,
        transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.35s ease;
}

/* Red border only appears on hover and keyboard focus */
.front-planning-hero-step:hover,
.front-planning-hero-step:focus-visible {
    border-color: var(--csp-primary, #f10100);
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-3px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}

.front-planning-hero-step:focus-visible {
    outline: 2px solid var(--csp-primary, #f10100);
    outline-offset: 2px;
}

/* Metadata pairs the step icon with the prominent STEP label and number badge. */
.front-planning-hero-step-meta {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
}

/* Step icons reinforce each action with smooth elevation and active illumination on hover. */
.front-planning-hero-icon {
    width: 2.6rem;
    height: 2.6rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.48);
    border-radius: 7px !important;
    background-color: rgba(8, 22, 35, 0.35);
    color: var(--csp-white);
    font-size: 0.95rem;
    transition: transform 0.35s ease, border-color 0.35s ease, background-color 0.35s ease, box-shadow 0.35s ease;
}

.front-planning-hero-step:hover .front-planning-hero-icon {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.85);
    background-color: var(--csp-primary, #f10100);
    color: #ffffff;
    box-shadow: 0 4px 14px rgba(241, 1, 0, 0.45);
}

/* Step word is enlarged with high contrast and confident typography. */
.front-planning-hero-number {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    color: rgba(255, 255, 255, 0.95);
    font-family: var(--font-heading, "Metromedium", "Roboto", sans-serif);
    font-size: clamp(1.05rem, 1.35vw, 1.28rem);
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}



/* Step titles with elegant hover movement and luminous text glow. */
.front-planning-hero-step h3 {
    margin: 1.15rem 0 0.75rem;
    color: var(--csp-white);
    font-family: var(--font-heading, "Metromedium", "Roboto", sans-serif);
    font-size: clamp(1.2rem, 1.5vw, 1.45rem);
    font-weight: 700;
    line-height: 1.28;
    text-wrap: balance;
    translate: 0 0;
    transition: color 0.35s ease, translate 0.35s cubic-bezier(0.16, 1, 0.3, 1), text-shadow 0.35s ease;
}

.front-planning-hero-step:hover h3 {
    color: #ffffff;
    translate: 4px 0;
    text-shadow: 0 2px 14px rgba(255, 255, 255, 0.35);
}

/* Step descriptions stay calm and readable against the protected photograph. */
.front-planning-hero-step p {
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.95rem;
    line-height: 1.68;
}

/* The conversion row keeps reassurance and all contact paths in one predictable place. */
.front-planning-hero-contact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.5rem 2.5rem;
    margin-top: clamp(2.5rem, 5vw, 4rem);
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.36);
}

/* The action group presents one primary next step followed by quieter direct-contact options. */
.front-planning-hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.85rem;
}

/* Shared controls are significantly larger, prominent, touchable, and high-converting. */
.front-planning-hero-button {
    min-height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 0.95rem 1.75rem;
    border: 1px solid transparent;
    border-radius: 7px !important;
    color: var(--csp-white);
    font-family: var(--font-body, "Roboto", Arial, sans-serif);
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.1;
    text-decoration: none;
    transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

/* Primary planning action button with high-contrast filled brand color and shadow. */
.front-planning-hero-button.is-primary {
    background-color: var(--csp-primary, #f10100);
    border-color: var(--csp-primary, #f10100);
    box-shadow: 0 4px 16px rgba(241, 1, 0, 0.32);
}

.front-planning-hero-button.is-primary:hover,
.front-planning-hero-button.is-primary:focus-visible {
    background-color: #d00100;
    border-color: #d00100;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(241, 1, 0, 0.45);
}

/* Official WhatsApp brand green styling for high visibility and instant recognition. */
.front-planning-hero-button.is-whatsapp {
    background-color: #25d366;
    border-color: #25d366;
    color: #ffffff;
    box-shadow: 0 4px 16px rgba(37, 211, 102, 0.3);
}

.front-planning-hero-button.is-whatsapp:hover,
.front-planning-hero-button.is-whatsapp:focus-visible {
    background-color: #20bd5a;
    border-color: #20bd5a;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(37, 211, 102, 0.45);
}

.front-planning-hero-button.is-whatsapp i {
    font-size: 1.25rem;
}

/* Secondary phone contact method with refined translucent pill treatment. */
.front-planning-hero-button.is-secondary {
    border-color: rgba(255, 255, 255, 0.65);
    background-color: rgba(8, 22, 35, 0.35);
    backdrop-filter: blur(4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.front-planning-hero-button.is-secondary:hover,
.front-planning-hero-button.is-secondary:focus-visible {
    border-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.18);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}

.front-planning-hero-button.is-secondary i {
    font-size: 1.05rem;
}

/* Keyboard users receive a high-contrast focus indicator on every contact action. */
.front-planning-hero-button:focus-visible {
    outline: 2px solid var(--csp-white);
    outline-offset: 3px;
}

/* Supporting copy explains the service promise beside the available contact methods. */
.front-planning-hero-support {
    margin: 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.96rem;
    line-height: 1.55;
}

@media (max-width: 991.98px) {
    /* Tablet and mobile stack the reservation sequence for a direct top-to-bottom scan. */
    .front-planning-hero-steps {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    /* Stacked steps preserve the interactive card treatment with appropriate padding. */
    .front-planning-hero-step {
        padding: 1.25rem;
    }

    /* Contact choices move below the reassurance copy while retaining their shared alignment. */
    .front-planning-hero-contact {
        grid-template-columns: 1fr;
    }

    /* Tablet actions align with the start of the explanatory copy. */
    .front-planning-hero-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 575.98px) {
    /* Small screens reduce the image height naturally as the stacked content grows. */
    .front-planning-hero {
        min-height: 0;
    }

    /* Compact screens keep a useful gutter around all hero content. */
    .front-planning-hero-content {
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
    }

    /* Phones keep the transferred editorial introduction compact above the planning sequence. */
    .front-planning-hero-interest {
        margin-bottom: 2.5rem;
        padding-bottom: 2rem;
    }

    /* Contact actions expand to comfortable full-width touch targets on phones. */
    .front-planning-hero-actions,
    .front-planning-hero-button {
        width: 100%;
    }
}

/* Difference section: a quiet gray editorial surface keeps the proof points easy to scan. */
.front-difference {
    background-color: #f2f2ef;
}

/* The asymmetric layout gives the evidence more room while keeping the team visible. */
.front-difference-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(20rem, 0.75fr);
    align-items: stretch;
    gap: clamp(2.5rem, 5vw, 5rem);
}

/* The text column follows one uninterrupted editorial flow without card containers. */
.front-difference-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* The section heading uses the brand accent as the only strong color on the gray surface. */
.front-difference-title {
    margin: 0;
    color: var(--csp-primary);
    font-size: clamp(2rem, 3.3vw, 3.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.08;
    text-transform: uppercase;
    text-wrap: balance;
}

/* The benefit list flows down two columns and remains one semantic list. */
.front-difference-list {
    width: 100%;
    margin: clamp(2rem, 4vw, 3rem) 0 0;
    padding: 0;
    columns: 2;
    column-gap: clamp(1.5rem, 4vw, 3.5rem);
    list-style: none;
}

/* Each benefit uses a compact check and open spacing instead of a card or divider. */
.front-difference-list li {
    display: inline-flex;
    width: 100%;
    align-items: flex-start;
    gap: 0.8rem;
    margin: 0 0 1rem;
    break-inside: avoid;
    color: var(--csp-dark);
    line-height: 1.5;
}

/* Small red checks make the proof points identifiable without adding visual noise. */
.front-difference-list i {
    flex: 0 0 auto;
    margin-top: 0.28rem;
    color: var(--csp-primary);
    font-size: 0.78rem;
}

/* The single action closes the reading flow with the established compact button style. */
.front-difference-button {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    margin-top: 1.25rem;
    padding: 0.75rem 1.35rem;
    border-radius: 7px;
    background-color: var(--csp-primary);
    color: var(--csp-white);
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1;
}

/* Button feedback is restrained and keeps the text contrast unchanged. */
.front-difference-button:hover,
.front-difference-button:focus-visible {
    background-color: var(--csp-primary-dark);
    color: var(--csp-white);
    transform: translateY(-1px);
}

/* Keyboard focus stays visible against both the gray section and the red control. */
.front-difference-button:focus-visible {
    outline: 2px solid var(--csp-dark);
    outline-offset: 3px;
}

/* The team photograph uses the shared corner rule and a deliberate portrait crop. */
.front-difference-media {
    min-height: 32rem;
    margin: 0;
    overflow: hidden;
    border-radius: 7px;
}

/* The image fills its column while preserving the people as the visual subject. */
.front-difference-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

@media (max-width: 991.98px) {
    /* Tablet stacks the image after the proof points to preserve reading order. */
    .front-difference-layout {
        grid-template-columns: 1fr;
    }

    /* The stacked photograph returns to a landscape composition. */
    .front-difference-media {
        min-height: 24rem;
    }
}

@media (max-width: 575.98px) {
    /* Mobile uses one uninterrupted benefit column for effortless scanning. */
    .front-difference-list {
        columns: 1;
    }

    /* The primary action becomes a full-width touch target on small screens. */
    .front-difference-button {
        width: 100%;
    }

    /* The compact mobile crop keeps the section from becoming unnecessarily tall. */
    .front-difference-media {
        min-height: 18rem;
    }
}

/* Showcase slider: a centered cinematic frame keeps the active journey visually dominant with a reduced vertical footprint. */
.front-showcase {
    overflow: hidden;
    background-color: var(--csp-white);
    padding-block: clamp(1.5rem, 3.5vw, 3rem) !important;
}

/* The Swiper viewport spans the page so both neighboring journeys remain partially visible. */
.front-showcase-slider {
    position: relative;
    overflow: visible;
}

/* Every journey gains an additional fifteen-percent height increase for a more immersive view. */
.front-showcase-slide {
    height: clamp(26.45rem, 44.965vw, 34.385rem);
    overflow: hidden;
    border-radius: 0 !important;
}

/* The active journey stays above the softened neighboring slides without opening visual gaps. */
.front-showcase-slide.swiper-slide-active {
    z-index: 2;
}

/* The complete slide is an accessible link with a stable focus boundary and angular corners. */
.front-showcase-link {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 0 !important;
    color: var(--csp-white);
}

/* Destination photography fills each slide with sharp angular corners. */
.front-showcase-link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0 !important;
    transition: transform 850ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* The active slide receives a restrained image movement on hover and keyboard focus. */
.front-showcase-slide.swiper-slide-active .front-showcase-link:hover img,
.front-showcase-slide.swiper-slide-active .front-showcase-link:focus-visible img {
    transform: scale(1.025);
}

/* A strong graduated overlay quiets adjacent slides before yielding to the active image, keeping angular corners. */
.front-showcase-overlay {
    position: absolute;
    inset: 0;
    border-radius: 0 !important;
    background: linear-gradient(
        180deg,
        rgba(6, 15, 22, 0.3) 0%,
        rgba(6, 15, 22, 0.62) 58%,
        rgba(6, 15, 22, 0.92) 100%
    );
    opacity: 0.9;
    transition: opacity 650ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* The principal slide removes its overlay smoothly to reveal the complete photograph. */
.front-showcase-slide.swiper-slide-active .front-showcase-overlay {
    opacity: 0;
}

/* Captions use a localized dark gradient to remain legible without obscuring the full photograph. */
.front-showcase-caption {
    position: absolute;
    inset: auto 0 0;
    display: grid;
    grid-template-rows: auto 0fr auto;
    gap: 0.8rem;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    background: linear-gradient(
        180deg,
        rgba(4, 12, 18, 0) 0%,
        rgba(4, 12, 18, 0.34) 46%,
        rgba(4, 12, 18, 0.76) 100%
    );
    visibility: hidden;
    opacity: 0;
    transform: translateY(calc(100% + 1px));
    filter: blur(0);
    clip-path: inset(100% 0 0 0);
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.58);
    transition:
        grid-template-rows 520ms cubic-bezier(0.16, 1, 0.3, 1),
        opacity 260ms ease,
        transform 260ms ease,
        filter 260ms ease,
        visibility 0s linear 280ms;
}

/* Only the active caption is exposed; adjacent slide captions remain fully hidden. */
.front-showcase-slide.swiper-slide-active .front-showcase-caption {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0s;
}

/* Once Swiper is ready, JavaScript coordinates an authored reveal for each active caption. */
.front-showcase-slider.is-ready .front-showcase-slide.swiper-slide-active .front-showcase-caption {
    visibility: visible;
    opacity: 0;
    transform: translateY(calc(100% + 1px));
    filter: blur(4px);
    clip-path: inset(100% 0 0 0);
}

/* The newly active caption rises from below the frame with a soft focus-to-sharp transition. */
.front-showcase-slider.is-ready .front-showcase-slide.is-caption-entering .front-showcase-caption {
    animation: front-showcase-caption-enter 780ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* Captions return toward the lower edge as navigation begins. */
.front-showcase-slider.is-changing .front-showcase-slide .front-showcase-caption {
    animation: none;
    visibility: hidden;
    opacity: 0;
    transform: translateY(calc(100% + 1px));
    filter: blur(4px);
    clip-path: inset(100% 0 0 0);
}

/* The entrance reveals the caption progressively from the bottom edge upward. */
@keyframes front-showcase-caption-enter {
    from {
        opacity: 0;
        transform: translateY(calc(100% + 1px));
        filter: blur(4px);
        clip-path: inset(100% 0 0 0);
    }

    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
        clip-path: inset(0 0 0 0);
    }
}

/* Journey names remain concise and legible over varied destination photography. */
.front-showcase-caption strong {
    color: inherit;
    font-family: "Metromedium", "Roboto", sans-serif;
    font-size: clamp(1.6rem, 3vw, 3rem);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.08;
    text-wrap: balance;
    transition: transform 500ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* The added destination detail stays collapsed until the active journey receives intent. */
.front-showcase-description {
    min-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(0.65rem);
    filter: blur(3px);
    transition:
        opacity 360ms ease,
        transform 520ms cubic-bezier(0.16, 1, 0.3, 1),
        filter 420ms ease;
}

/* Supporting copy remains understated beneath the destination name. */
.front-showcase-description > .front-copy-editor {
    display: block;
    color: rgba(255, 255, 255, 0.88);
    font-size: clamp(0.92rem, 1.2vw, 1.05rem);
    line-height: 1.55;
}

/* Front-page ACF editor content keeps predictable spacing without suppressing authored formatting. */
.front-copy-editor > :first-child {
    margin-top: 0;
}

.front-copy-editor > :last-child {
    margin-bottom: 0;
}

/* The action line clarifies that every slide opens its corresponding journey. */
.front-showcase-action {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* The arrow acknowledges hover and keyboard focus with a restrained directional cue. */
.front-showcase-action i {
    transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Hovering or focusing the principal slide elegantly expands its richer destination story. */
.front-showcase-slide.swiper-slide-active .front-showcase-link:hover .front-showcase-caption,
.front-showcase-slide.swiper-slide-active .front-showcase-link:focus-visible .front-showcase-caption {
    grid-template-rows: auto 1fr auto;
}

/* The expanded description moves into view only on the principal slide. */
.front-showcase-slide.swiper-slide-active .front-showcase-link:hover .front-showcase-description,
.front-showcase-slide.swiper-slide-active .front-showcase-link:focus-visible .front-showcase-description {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* Title and action micro-movements reinforce the hover state without shifting the layout. */
.front-showcase-slide.swiper-slide-active .front-showcase-link:hover .front-showcase-caption strong,
.front-showcase-slide.swiper-slide-active .front-showcase-link:focus-visible .front-showcase-caption strong {
    transform: translateY(-0.12rem);
}

.front-showcase-slide.swiper-slide-active .front-showcase-link:hover .front-showcase-action i,
.front-showcase-slide.swiper-slide-active .front-showcase-link:focus-visible .front-showcase-action i {
    transform: translateX(0.3rem);
}

/* Minimal circular outline controls overlap the active slide edges at its midpoint. */
.front-showcase-control {
    position: absolute;
    z-index: 5;
    top: 50%;
    width: 2.75rem;
    height: 2.75rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.82);
    border-radius: 50% !important;
    background-color: transparent;
    color: var(--csp-white);
    box-shadow: none;
    font-size: 0.85rem;
    transform: translateY(-50%);
    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        color 180ms ease;
}

/* The previous control sits across the left edge of the centered desktop slide. */
.front-showcase-control.is-prev {
    left: calc(25% - 1.375rem);
}

/* The next control mirrors the previous control on the right edge. */
.front-showcase-control.is-next {
    right: calc(25% - 1.375rem);
}

/* Navigation feedback stays subtle while preserving clear pointer affordance. */
.front-showcase-control:hover,
.front-showcase-control:focus-visible {
    border-color: var(--csp-white);
    background-color: var(--csp-white);
    color: var(--csp-dark);
}

/* Focus rings remain visible over both bright and dark photography. */
.front-showcase-control:focus-visible,
.front-showcase-link:focus-visible {
    outline: 3px solid var(--csp-primary);
    outline-offset: 3px;
}

@media (max-width: 575.98px) {
    /* Mobile preserves the additional fifteen-percent showcase increase without losing the active caption. */
    .front-showcase-slide {
        height: clamp(21.16rem, 72.7375vw, 25.1275rem);
    }

    /* Compact controls remain reachable at the visible edges of the principal slide. */
    .front-showcase-control.is-prev {
        left: 0.5rem;
    }

    /* The next mobile control mirrors the previous control. */
    .front-showcase-control.is-next {
        right: 0.5rem;
    }

    /* Mobile captions use a tighter inset while preserving hierarchy. */
    .front-showcase-caption {
        padding: 1.5rem;
    }

    /* Small screens show the supporting copy because they do not offer persistent hover. */
    .front-showcase-slide.swiper-slide-active .front-showcase-caption {
        grid-template-rows: auto 1fr auto;
    }

    /* Mobile visitors receive the same destination context as desktop hover users. */
    .front-showcase-slide.swiper-slide-active .front-showcase-description {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

@media (hover: none) {
    /* Touch devices keep the supporting copy available because they have no persistent hover. */
    .front-showcase-slide.swiper-slide-active .front-showcase-caption {
        grid-template-rows: auto 1fr auto;
    }

    /* The touch presentation reveals the same detail offered by desktop hover. */
    .front-showcase-slide.swiper-slide-active .front-showcase-description {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    /* Reduced-motion users receive immediate captions and static hover details. */
    .front-showcase-caption,
    .front-showcase-caption strong,
    .front-showcase-description,
    .front-showcase-action i,
    .front-showcase-overlay,
    .front-showcase-link img {
        animation: none !important;
        transition: none !important;
    }

    /* JavaScript animation states never hide content when motion is reduced. */
    .front-showcase-slider.is-ready .front-showcase-slide.swiper-slide-active .front-showcase-caption,
    .front-showcase-slider.is-changing .front-showcase-slide.swiper-slide-active .front-showcase-caption {
        visibility: visible;
        opacity: 1;
        transform: none;
        filter: none;
        clip-path: none;
    }
}

/* Reviews carousel: a quiet editorial surface lets traveler stories lead the section. */
.front-reviews {
    --front-review-brand: #007f5f;
    --front-review-rating: #00aa6c;
    --front-review-surface: #f7f7f5;
    overflow: hidden;
    padding-block: clamp(1.5rem, 2.5vw, 2.5rem);
    background-color: var(--front-review-surface);
}

/* Google keeps its familiar blue interaction color and warm yellow rating stars. */
.front-reviews--google {
    --front-review-brand: #1a73e8;
    --front-review-rating: #fbbc04;
    --front-review-surface: #ffffff;
}

/* Trustpilot uses its recognizable green across controls, ratings, and actions. */
.front-reviews--trustpilot {
    --front-review-brand: #007a55;
    --front-review-rating: #00b67a;
    --front-review-surface: #f4faf7;
}

/* The compact heading introduces the reviews without competing with their content. */
.front-reviews-header {
    display: grid;
    gap: 0.4rem;
    margin-bottom: clamp(0.85rem, 1.5vw, 1.15rem);
    text-align: center;
}

/* The review title follows the established homepage display hierarchy. */
.front-reviews-header h2 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    margin: 0;
    color: var(--csp-dark);
    font-size: clamp(1.7rem, 2.5vw, 2.2rem);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.05;
    text-wrap: balance;
}

/* Each main title carries its platform mark at a restrained editorial scale. */
.front-reviews-header h2 img {
    width: 2rem;
    height: 2rem;
    display: block;
    flex: 0 0 2rem;
    object-fit: contain;
}

/* The title copy remains centered even when it wraps beside the fixed-size icon. */
.front-reviews-header h2 span {
    text-align: center;
}

/* The supporting line stays restrained and readable beneath the title. */
.front-reviews-header p {
    margin: 0;
    color: var(--csp-text);
    font-size: 0.95rem;
    line-height: 1.5;
}

/* The review stage stacks the compact navigation above the cards. */
.front-reviews-stage {
    display: grid;
    gap: 0.45rem;
    padding-inline: clamp(2.5rem, 4vw, 3.5rem);
}

/* Previous and next controls stay together at the carousel's upper-right edge with elevated stacking. */
.front-reviews-controls {
    position: relative;
    z-index: 10;
    display: flex;
    justify-content: flex-end;
    gap: 0.45rem;
    padding-inline: 1.25rem;
}

/* A clipped outer viewport hides adjacent slides while preserving room for every card shadow. */
.front-reviews-viewport {
    overflow: hidden;
    margin-block: -2.5rem;
    padding: 2.5rem 1.25rem;
}

/* Swiper remains visible inside the protected viewport so shadows are never cropped. */
.front-reviews-carousel {
    overflow: visible;
}

/* Each testimonial uses a compact editorial rhythm and one quiet defining border. */
.front-review-card {
    position: relative;
    display: flex;
    box-sizing: border-box;
    height: auto;
    min-height: 14.75rem;
    flex-direction: column;
    align-items: flex-start;
    padding: clamp(0.95rem, 1.4vw, 1.15rem);
    border: 1px solid rgba(17, 24, 39, 0.12);
    border-radius: 7px;
    background-color: var(--csp-white);
    transition:
        border-color 280ms ease,
        box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Source and score share one compact line so the review content starts sooner. */
.front-review-meta {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

/* A soft shadow adds depth without moving or clipping the card inside the slider. */
.front-review-card:hover,
.front-review-card:focus-within {
    border-color: rgba(17, 24, 39, 0.08);
    box-shadow: 0 0.6rem 1.1rem rgba(17, 24, 39, 0.11);
}

/* Platform labels keep each source recognizable without oversized branding. */
.front-review-source {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--csp-dark);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* Platform icons stay crisp and aligned without increasing card height. */
.front-review-source img {
    display: block;
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    object-fit: contain;
}

/* Sample content remains visibly distinguished until real platform reviews replace it. */
.front-review-sample {
    padding: 0.18rem 0.32rem;
    border: 1px solid currentColor;
    border-radius: 7px;
    color: var(--front-review-brand);
    font-size: 0.55rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1;
    text-transform: uppercase;
}

/* Five compact platform-colored marks communicate the shared five-point rating. */
.front-review-rating {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 0.18rem;
    margin: 0;
}

/* Tripadvisor retains its familiar circular rating language. */
.front-review-rating.is-bubbles span {
    position: relative;
    width: 0.72rem;
    height: 0.72rem;
    border: 1.5px solid var(--front-review-rating);
    border-radius: 50% !important;
    background-color: var(--front-review-rating);
}

/* The white center keeps the five rating marks crisp at small sizes. */
.front-review-rating.is-bubbles span::after {
    position: absolute;
    inset: 0.14rem;
    border-radius: 50% !important;
    background-color: var(--csp-white);
    content: "";
}

/* Google and Trustpilot use compact stars in their native rating colors. */
.front-review-rating.is-stars {
    color: var(--front-review-rating);
    font-size: 0.72rem;
    line-height: 1;
}

/* Review titles remain concise and distinct from the quoted copy. */
.front-review-card h3 {
    margin: 0.7rem 0 0;
    color: var(--csp-dark);
    font-family: "Metromedium", "Roboto", sans-serif;
    font-size: clamp(1.08rem, 1.35vw, 1.25rem);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.2;
    text-wrap: balance;
}

/* Native blockquote margins are removed for a continuous editorial rhythm. */
.front-review-card blockquote {
    margin: 0.45rem 0 0;
}

/* Testimonial copy uses comfortable leading without decorative quotation styling. */
.front-review-card blockquote p {
    margin: 0;
    color: var(--csp-text);
    font-size: 0.84rem;
    line-height: 1.45;
}

/* Author details sit at the bottom so all cards align regardless of quote length. */
.front-review-author {
    display: flex;
    align-items: baseline;
    gap: 0.45rem;
    margin-top: auto;
    padding-top: 0.7rem;
}

/* The traveler name carries slightly more emphasis than the location. */
.front-review-author strong {
    color: var(--csp-dark);
    font-size: 0.82rem;
    font-weight: 700;
}

.front-review-author span {
    color: var(--csp-muted);
    font-size: 0.74rem;
}

/* The individual review action stays text-led with only a small red accent. */
.front-review-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.55rem;
    color: var(--csp-dark);
    font-size: 0.76rem;
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: var(--front-review-brand);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.3rem;
}

/* The external-link icon moves just enough to acknowledge intent. */
.front-review-link i {
    color: var(--front-review-brand);
    font-size: 0.68rem;
    transition: transform 260ms cubic-bezier(0.16, 1, 0.3, 1);
}

.front-review-link:hover i,
.front-review-link:focus-visible i {
    transform: translate(0.12rem, -0.12rem);
}

/* Review navigation uses compact, quiet outlined controls. */
.front-reviews-control {
    position: relative;
    z-index: 11;
    flex: 0 0 2.15rem;
    width: 2.15rem;
    height: 2.15rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(17, 24, 39, 0.2);
    border-radius: 7px;
    background-color: transparent;
    color: var(--csp-dark);
    font-size: 0.7rem;
    cursor: pointer;
    pointer-events: auto !important;
    transition:
        border-color 180ms ease,
        color 180ms ease;
}

/* Controls borrow the current platform color on interaction. */
.front-reviews-control:hover,
.front-reviews-control:focus-visible {
    border-color: var(--front-review-brand);
    color: var(--front-review-brand);
}

/* Ensure review controls remain interactive in infinite loop mode without getting hidden or locked. */
.front-reviews-control.swiper-button-lock {
    display: inline-grid !important;
}

.front-reviews-control.swiper-button-disabled {
    opacity: 0.6;
    cursor: pointer !important;
    pointer-events: auto !important;
}

/* Footer elements share one line on desktop and keep the primary action at the end. */
.front-reviews-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-top: 0.75rem;
    padding-inline: clamp(2.5rem, 4vw, 3.5rem);
}

/* Swiper pagination remains compact and uses the current platform color. */
.front-reviews-pagination {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.front-reviews-pagination .swiper-pagination-bullet {
    width: 0.45rem;
    height: 0.45rem;
    margin: 0 !important;
    background-color: rgba(17, 24, 39, 0.24);
    opacity: 1;
}

.front-reviews-pagination .swiper-pagination-bullet-active {
    width: 1.5rem;
    background-color: var(--front-review-brand);
}

/* The section action adopts its platform color while retaining one shared structure. */
.front-reviews-all {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 0.55rem 0.85rem;
    border: 1px solid var(--front-review-brand);
    border-radius: 7px;
    background-color: transparent;
    color: var(--front-review-brand);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    transition:
        background-color 180ms ease,
        color 180ms ease;
}

.front-reviews-all:hover,
.front-reviews-all:focus-visible {
    background-color: var(--front-review-brand);
    color: var(--csp-white);
}

/* Keyboard focus remains visible across cards, controls, and review actions. */
.front-review-link:focus-visible,
.front-reviews-control:focus-visible,
.front-reviews-all:focus-visible {
    outline: 3px solid var(--front-review-brand);
    outline-offset: 3px;
}

@media (max-width: 767.98px) {
    /* Long mobile review titles place the platform mark above the centered copy. */
    .front-reviews-header h2 {
        flex-direction: column;
        gap: 0.45rem;
    }

    .front-reviews-header h2 img {
        width: 1.75rem;
        height: 1.75rem;
        flex-basis: 1.75rem;
    }

    /* Mobile keeps the paired controls above the cards and aligned to the right. */
    .front-reviews-stage {
        padding-inline: 0;
    }

    .front-reviews-controls {
        padding-inline: 1.25rem;
    }

    /* Mobile footer stacks its low-priority pagination above the full-width action. */
    .front-reviews-footer {
        display: grid;
        justify-items: center;
        padding-inline: 0;
    }

    .front-reviews-all {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    /* Reduced-motion visitors keep state feedback without spatial movement. */
    .front-review-card,
    .front-review-link i,
    .front-reviews-control,
    .front-reviews-all {
        transition: none;
    }

    .front-review-card:hover,
    .front-review-card:focus-within,
    .front-review-link:hover i,
    .front-review-link:focus-visible i {
        transform: none;
    }
}

.front-feature {
    display: grid;
    gap: 0.55rem;
    justify-items: center;
    text-align: center;
}

.front-feature i {
    color: var(--csp-white);
    font-size: 2.4rem;
}

.front-feature h2,
.front-feature h3 {
    margin: 0;
    color: var(--csp-primary);
    font-size: 1.2rem;
    font-weight: 500;
}

.front-feature p {
    margin: 0;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.45;
}

.csp-section-light .front-feature i {
    color: var(--csp-dark, #000000);
}

#why-book-with-us .front-feature {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas:
        "icon title"
        "icon desc";
    gap: 0.3rem 1.25rem;
    text-align: left;
    justify-items: start;
}

#why-book-with-us .front-feature i {
    grid-area: icon;
    color: var(--tour-primary);
    background-color: rgba(230, 74, 25, 0.12);
    width: 4.5rem;
    height: 4.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-bottom: 0;
    font-size: 1.8rem;
}

#why-book-with-us .front-feature h3 {
    grid-area: title;
    align-self: end;
    margin: 0;
    line-height: 1.2;
}

#why-book-with-us .front-feature p {
    grid-area: desc;
    align-self: start;
    margin: 0;
}

.csp-section-light .front-feature p {
    color: var(--csp-text, #4b5563);
}

@media (max-width: 991.98px) {
    /* Two columns preserve useful card width at intermediate viewports. */
    .front-bestsellers-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    /* Mobile stacks the proportional image and copy so neither creates empty vertical filler. */
    .front-hero {
        aspect-ratio: auto;
        min-height: 0;
        display: block;
        text-align: left;
    }

    /* The mobile media frame keeps the source panorama's ratio and contributes its height to document flow. */
    .front-hero-media {
        position: relative;
        inset: auto;
        aspect-ratio: 2400 / 1032;
        height: auto;
    }

    /* Video mode uses the same responsive geometry as the photo carousel. */
    .front-hero-video {
        height: auto;
    }

    /* Hero copy follows the image naturally so the next homepage section moves with the content. */
    .front-hero-container {
        padding-top: 1.5rem;
        padding-bottom: 1.75rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .front-hero-title {
        font-size: clamp(1.1rem, 4.8vw, 1.45rem);
        letter-spacing: 0.03em;
        margin-bottom: 0.35rem;
    }

    .front-hero-subtitle {
        font-size: clamp(1.5rem, 6.8vw, 2.1rem);
        line-height: 1.15;
        margin-bottom: 0.75rem;
    }

    /* Mobile controls stay clear of the left-aligned hero copy. */
    .front-hero-control {
        width: 2.75rem;
        height: 2.75rem;
        top: auto;
        bottom: 1rem;
        margin: 0 0.75rem;
        transform: none;
    }

    /* Mobile tightens the vertical rhythm while preserving the reading order. */
    .front-tailored-intro-layout {
        gap: 1.5rem;
    }

    /* Mobile keeps the headline prominent without forcing awkward single-word lines. */
    .front-tailored-intro-title {

    }

    /* Mobile turns the benefit matrix into one direct, uninterrupted reading column. */
    .front-welcome-features-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    /* Mobile keeps each feature compact and stacks its heading above the description. */
    .front-welcome-feature {
        padding: 1.35rem;
    }

    /* Mobile keeps the award statement compact before the centered accolade. */
    .front-awards-header {
        gap: 0.5rem;
    }

    /* Mobile reduces the display title enough to avoid awkward isolated words. */
    .front-awards-title {
        font-size: clamp(1.6rem, 6.5vw, 2.2rem);
    }

    /* Mobile preserves the requested single row with compact, evenly sized awards. */
    .front-awards-visual {
        gap: 0.35rem;
        margin-top: 1.25rem;
        margin-bottom: 1.25rem;
    }

    /* Mobile presents tours in one direct comparison column. */
    .front-bestsellers-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    /* Mobile keeps the paired heading prominent without forcing isolated words. */
    .front-bestsellers-title {
        font-size: clamp(2rem, 10vw, 3.3rem);
    }

}

/* Homepage subtitles placed directly beneath H2 headings share the requested display size. */

/* Tour customer reviews styles */
/* Shared customer reviews component
-------------------------------------------------- */

/* Tour Customer Reviews Showcase (TripAdvisor Travelers' Choice Layout)
-------------------------------------------------- */

.tour-reviews-section {
    position: relative;
    padding: 2.5rem 0;
}

/* Reviews section header matching tour-departures-heading style */
.tour-reviews-heading-wrap {
    margin-bottom: 2rem;
}

.tour-reviews-heading-wrap .tour-reviews-title {
    margin: 0;
    color: var(--tour-dark, #0f172a);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
}

/* Reviews grid using Bootstrap 12-column layout with col-md-3 and col-md-9 */
.tour-reviews-grid {
    align-items: start;
    row-gap: 2.5rem;
}

/* Left Column: Awards & Badges Typography & Visual Hierarchy */
.tour-reviews-award-col {
    display: flex;
    flex-direction: column;
}

.tour-reviews-brand {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--tour-primary, #e25822);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.25;
    text-transform: uppercase;
}

.tour-reviews-award-title {
    margin: 0 0 1rem;
}

/* The principal Tripadvisor award uses the badge's natural proportions. */
.tour-reviews-awards-image-wrap {
    margin-bottom: 0.85rem;
    max-width: 128px;
}

/* Repeated mini TripAdvisor awards row */
.tour-reviews-awards-row {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 1.5rem;
}

.tour-reviews-awards-mini-item {
    flex: 1;
    min-width: 0;
}

.tour-reviews-award-img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 7px;
}

/* TripAdvisor Rating Bar */
.tour-reviews-tripadvisor-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
    margin-top: 0.5rem;
}

.tripadvisor-logo-img {
    height: 24px;
    width: auto;
    object-fit: contain;
}

.tripadvisor-bubbles {
    display: inline-flex;
    gap: 0.2rem;
    align-items: center;
}

.tripadvisor-bubbles span {
    width: 10px;
    height: 10px;
    border-radius: 7px !important;
    background-color: #00aa6c;
}

.tripadvisor-count {
    color: #4b5563;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

/* Right Column: Customer Reviews List with 2-Column Minimalist Grid */
.tour-reviews-list-col {
    display: flex;
    flex-direction: column;
}

.tour-reviews-list {
    position: relative;
    border-left: 1px solid #e5e7eb;
    padding-left: 2rem;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 1.15rem;
}

.tour-review-entry {
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 7px !important;
    padding: 1.15rem 1.25rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.tour-review-entry:hover {
    border-color: #cbd5e1;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.tour-review-entry-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.55rem;
}

.tour-review-entry-meta {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.tour-review-entry-author {
    margin: 0;
    color: #111827;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.2;
}

.tour-review-entry-traveled {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #64748b;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.2;
}

.verified-check-icon {
    display: inline-block;
    vertical-align: middle;
    width: 13px;
    height: 13px;
    flex-shrink: 0;
}

.tour-review-entry-stars {
    display: flex;
    gap: 0.15rem;
    color: #00aa6c;
    font-size: 0.72rem;
    line-height: 1;
    margin: 0;
    flex-shrink: 0;
    padding-top: 2px;
}

.tour-review-entry-copy {
    position: relative;
}

.tour-review-entry-text {
    margin: 0;
    color: #475569;
    font-size: 0.82rem;
    line-height: 1.55;
    transition: max-height 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Long reviews collapse to four rendered lines after JavaScript confirms overflow. */
.tour-review-entry-copy.is-overflowing:not(.is-expanded) .tour-review-entry-text {
    max-height: var(--tour-review-collapsed-height, 6.2em);
    overflow: hidden;
}

/* The fade communicates that more review text remains below the fourth line. */
.tour-review-entry-copy.is-overflowing::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2.8rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), #ffffff 88%);
    content: "";
    opacity: 1;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

.tour-review-entry-copy.is-expanded::after {
    opacity: 0;
}

.tour-review-entry-toggle {
    align-self: flex-start;
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.35rem;
    padding: 0.35rem 0;
    border: 0;
    border-radius: 7px;
    background-color: transparent;
    color: var(--tour-primary, #f10100);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: underline;
    text-underline-offset: 0.22em;
    cursor: pointer;
}

.tour-review-entry-toggle[hidden] {
    display: none;
}

.tour-review-entry-toggle:hover,
.tour-review-entry-toggle:focus-visible {
    color: var(--tour-primary-dark, #b90201);
}

.tour-review-entry-toggle:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}

.tour-review-entry-toggle i {
    font-size: 0.7rem;
    transition: transform 0.22s ease;
}

.tour-review-entry-toggle[aria-expanded="true"] i {
    transform: rotate(180deg);
}

/* Bottom Action Buttons */
.tour-reviews-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin-top: 1.5rem;
    padding-left: 2rem;
}

.tour-reviews-btn-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0.45rem 1.25rem;
    background-color: #111827;
    color: #ffffff !important;
    font-size: 0.8rem;
    font-weight: 600;
    border: 1px solid #111827;
    border-radius: 7px !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, transform 0.15s ease;
}

.tour-reviews-btn-all:hover,
.tour-reviews-btn-all:focus {
    background-color: #262626;
    border-color: #262626;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.tour-reviews-link-all {
    color: #4b5563;
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: underline;
    transition: color 0.2s ease;
}

.tour-reviews-link-all:hover,
.tour-reviews-link-all:focus {
    color: #111827;
}

@media (max-width: 991.98px) {
    .tour-reviews-list {
        grid-template-columns: 1fr;
        border-left: none;
        padding-left: 0;
        margin-top: 1.5rem;
        gap: 1rem;
    }

    .tour-reviews-actions {
        padding-left: 0;
        margin-top: 1.25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tour-review-entry-text,
    .tour-review-entry-copy.is-overflowing::after,
    .tour-review-entry-toggle i {
        transition-duration: 0.01ms;
    }
}

/* Trip Leaders Section
-------------------------------------------------- */
.tour-trip-leaders {
    margin-bottom: 2.75rem;
}

.tour-trip-leaders-heading {
    margin-bottom: 1.15rem;
}

.tour-trip-leaders-body {
    max-width: 64rem;
}

.tour-trip-leaders-body p {
    margin-bottom: 1.15rem;
    color: #374151;
    font-size: 0.92rem;
    line-height: 1.68;
}

.tour-trip-leaders-body p:last-child {
    margin-bottom: 0;
}

/* Trip Leaders Showcase Grid & Cards
-------------------------------------------------- */
/* Trip Leaders Grid & Compact Elegant Cards
-------------------------------------------------- */
.tour-trip-leaders-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}

.tour-leader-card {
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 7px !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.tour-leader-card:hover {
    transform: translateY(-2px);
    border-color: #cbd5e1;
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.06);
}

.tour-leader-media {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background-color: #f1f5f9;
}

.tour-leader-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    border-radius: 7px 7px 0 0;
    transition: transform 0.35s ease;
}

.tour-leader-card:hover .tour-leader-img {
    transform: scale(1.03);
}

.tour-leader-badge {
    position: absolute;
    bottom: 0.45rem;
    right: 0.45rem;
    background-color: rgba(15, 23, 42, 0.85);
    color: #ffffff;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    padding: 0.2rem 0.5rem;
    border-radius: 7px !important;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    backdrop-filter: blur(4px);
}

.tour-leader-badge i {
    color: #f59e0b;
}

.tour-leader-info {
    padding: 0.85rem 0.95rem 1rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.tour-leader-name {
    margin: 0 0 0.15rem;
    color: #0f172a;
    font-size: 0.96rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.2;
}

.tour-leader-role {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--tour-primary, #b90201);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.3;
}

.tour-leader-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.75rem;
    padding: 0.4rem 0;
    border-top: 1px solid #f1f5f9;
    border-bottom: 1px solid #f1f5f9;
    margin-bottom: 0.5rem;
}

.tour-leader-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.25;
}

.tour-leader-meta-item i {
    color: #94a3b8;
    font-size: 0.68rem;
}

.tour-leader-bio {
    margin: 0 0 0.6rem;
    color: #475569;
    font-size: 0.75rem;
    line-height: 1.45;
    flex-grow: 1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tour-leader-certs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-top: auto;
    padding-top: 0.2rem;
}

.tour-leader-cert-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #334155;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.16rem 0.45rem;
    border-radius: 7px !important;
    line-height: 1.25;
}

.tour-leader-cert-pill i {
    color: #00aa6c;
    font-size: 0.58rem;
}

@media (max-width: 1024px) {
    .tour-trip-leaders-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.15rem;
    }
}

@media (max-width: 576px) {
    .tour-trip-leaders-grid {
        grid-template-columns: 1fr;
    }
}

/* Extend Your Experience groups optional add-ons on the established light neutral surface. */
.tour-extend-experience,
.tour-itinerary-main > .tour-extend-experience {
    margin-bottom: 3rem;
    padding: clamp(1.5rem, 3vw, 2.25rem);
    border: 1px solid var(--tour-border);
    border-radius: 7px !important;
    background-color: var(--tour-light);
}

/* The section introduction pairs the decision context with a concise optionality note. */
.tour-extend-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(220px, 0.7fr);
    gap: clamp(1.25rem, 3vw, 3rem);
    align-items: end;
    margin-bottom: 1.75rem;
}

/* The heading uses the established tour hierarchy without adding an eyebrow label. */
.tour-extend-heading-copy h2 {
    margin: 0;
    color: var(--tour-dark);
    font-size: clamp(2rem, 3vw, 2.5rem);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.05;
    text-transform: uppercase;
}

/* Introductory copy explains how these optional experiences support trip planning. */
.tour-extend-intro {
    max-width: 66ch;
    margin: 0.85rem 0 0;
    color: var(--tour-text);
    font-size: 1rem;
    line-height: 1.7;
}

/* The planning note confirms that the recommendations are optional, not included services. */
.tour-extend-note {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--tour-border);
    border-radius: 7px !important;
    background-color: var(--tour-white);
    color: var(--tour-text);
    font-size: 0.82rem;
    line-height: 1.5;
}

/* The note icon uses the existing warm yellow signal for optional additions. */
.tour-extend-note > i {
    flex: 0 0 auto;
    margin-top: 0.15rem;
    color: #f59e0b;
    font-size: 1rem;
}

/* The note lead remains visually distinct without adding a decorative side border. */
.tour-extend-note strong {
    display: block;
    margin-bottom: 0.1rem;
    color: var(--tour-dark);
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

/* The two-column grid gives long experience names enough room to scan comfortably. */
.tour-extend-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

/* Each optional-experience card separates photographic proof from decision details. */
.tour-extend-card {
    display: grid;
    grid-template-columns: minmax(150px, 0.82fr) minmax(0, 1.18fr);
    min-height: 240px;
    overflow: hidden;
    border-radius: 7px !important;
    background-color: var(--tour-white);
    box-shadow: 0 4px 18px rgba(17, 24, 39, 0.08);
    color: var(--tour-dark);
    text-decoration: none !important;
    transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 220ms ease;
}

/* Hover and keyboard focus lift the complete actionable card. */
.tour-extend-card:hover,
.tour-extend-card:focus-visible {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(17, 24, 39, 0.14);
}

/* Keyboard focus remains visible against the warm section surface. */
.tour-extend-card:focus-visible {
    outline: 3px solid rgba(241, 1, 0, 0.28);
    outline-offset: 3px;
}

/* Media uses a stable crop so mixed source images align across the grid. */
.tour-extend-media {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    background-color: var(--tour-light);
}

/* Card photography fills the media column and receives a restrained hover zoom. */
.tour-extend-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Image movement reinforces that the full card is interactive. */
.tour-extend-card:hover .tour-extend-img,
.tour-extend-card:focus-visible .tour-extend-img {
    transform: scale(1.06);
}

/* Duration stays attached to the image as practical trip metadata. */
.tour-extend-duration {
    position: absolute;
    top: 0.75rem;
    left: 0.75rem;
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
    min-height: 32px;
    padding: 0.4rem 0.65rem;
    border-radius: 7px !important;
    background-color: rgba(23, 23, 23, 0.88);
    color: var(--tour-white);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: 1;
}

/* Duration icon inherits the clear high-contrast metadata treatment. */
.tour-extend-duration i {
    color: #f59e0b;
    font-size: 0.78rem;
}

/* The information column keeps the title and decision details in a simple vertical rhythm. */
.tour-extend-info {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 1.25rem;
    text-align: left;
}

/* The optional label differentiates these cards from the included main itinerary. */
.tour-extend-type {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
    align-self: flex-start;
    margin-bottom: 0.7rem;
    color: var(--tour-text);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-transform: uppercase;
}

/* The plus icon carries the established warm accent without turning the label into a badge. */
.tour-extend-type i {
    color: #f59e0b;
    font-size: 0.72rem;
}

/* Experience titles use the documented card-title scale on a readable white surface. */
.tour-extend-card .tour-extend-card-title,
.tour-extend-card-title {
    margin: 0;
    color: var(--tour-dark) !important;
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.3;
}

/* Price and action share the card footer while remaining visually distinct. */
.tour-extend-card-footer {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 1.25rem;
}

/* Starting price uses tabular figures for easier comparison across cards. */
.tour-extend-price {
    display: grid;
    gap: 0.15rem;
    color: var(--tour-dark);
    font-size: 1.1rem;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
    white-space: nowrap;
}

/* Price qualifier remains secondary to the confirmed starting amount. */
.tour-extend-price small {
    color: var(--tour-muted);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    line-height: 1;
    text-transform: uppercase;
}

/* The action uses the primary red reserved for clear next steps. */
.tour-extend-action {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
    color: var(--tour-primary);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-align: right;
    text-transform: uppercase;
}

/* The arrow responds to card interaction without changing the layout. */
.tour-extend-action i {
    font-size: 0.72rem;
    transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Card interaction advances the action arrow in the reading direction. */
.tour-extend-card:hover .tour-extend-action i,
.tour-extend-card:focus-visible .tour-extend-action i {
    transform: translateX(4px);
}

@media (max-width: 991.98px) {
    /* Tablet layouts stack the section introduction and show one generous card per row. */
    .tour-extend-heading,
    .tour-extend-grid {
        grid-template-columns: 1fr;
    }

    /* The optionality note keeps a readable measure when it moves below the introduction. */
    .tour-extend-note {
        max-width: 520px;
    }
}

@media (max-width: 575.98px) {
    /* Mobile section spacing preserves the surrounding single-tour gutter. */
    .tour-extend-experience {
        padding: 1rem;
    }

    /* Mobile cards place imagery above the decision details. */
    .tour-extend-card {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    /* Mobile media keeps a useful landscape crop without dominating the card. */
    .tour-extend-media {
        min-height: 210px;
    }

    /* Mobile card footers keep the price and action comfortably separated. */
    .tour-extend-card-footer {
        align-items: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    /* Reduced motion removes lift, zoom and arrow movement from optional-experience cards. */
    .tour-extend-card,
    .tour-extend-img,
    .tour-extend-action i {
        transition: none;
    }

    .tour-extend-card:hover,
    .tour-extend-card:focus-visible,
    .tour-extend-card:hover .tour-extend-img,
    .tour-extend-card:focus-visible .tour-extend-img,
    .tour-extend-card:hover .tour-extend-action i,
    .tour-extend-card:focus-visible .tour-extend-action i {
        transform: none;
    }
}

/* Lodging & Camping Card with Swiper Slider
-------------------------------------------------- */
.tour-lodging-card {
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 7px !important;
    padding: clamp(1.75rem, 2.5vw, 2.5rem);
    margin-bottom: 2.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.tour-lodging-grid {
    row-gap: 2rem;
}

.tour-lodging-heading {
    margin-bottom: 1.25rem;
}

.tour-lodging-body p {
    margin-bottom: 1rem;
    color: #374151;
    font-size: 0.88rem;
    line-height: 1.62;
}

.tour-lodging-body p strong {
    color: #111827;
    font-weight: 700;
}

.tour-lodging-body p:last-child {
    margin-bottom: 0;
}

/* Slider Wrap on Right */
/* Slider Wrap on Right: image with top captions overlay and bottom details overlay */
.tour-lodging-slider-wrap {
    position: relative;
    width: 100%;
    border-radius: 7px !important;
    overflow: hidden;
}

/* Day captions overlayed on the upper part of the image, centered in white text */
.tour-lodging-captions {
    position: absolute;
    top: 1.1rem;
    left: 0;
    right: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin: 0;
    padding: 0 1rem;
    pointer-events: auto;
}

.tour-lodging-tab {
    background: transparent;
    border: none;
    padding: 0.25rem 0.45rem;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7);
    transition: color 0.2s ease, border-color 0.2s ease;
}

.tour-lodging-tab:hover {
    color: #ffffff;
}

.tour-lodging-tab.is-active {
    color: #ffffff;
    font-weight: 800;
}

.tour-lodging-sep {
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.8rem;
    user-select: none;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7);
}

.tour-lodging-swiper {
    position: relative;
    width: 100%;
    min-height: 440px;
    border-radius: 7px !important;
    overflow: hidden;
    background-color: #0f172a;
}

.tour-lodging-slide {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 440px;
    overflow: hidden;
    border-radius: 7px !important;
}

.tour-lodging-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Gradient overlay protecting contrast of top captions and bottom details */
.tour-lodging-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        180deg,
        rgba(15, 23, 42, 0.75) 0%,
        rgba(15, 23, 42, 0.15) 24%,
        rgba(15, 23, 42, 0.1) 42%,
        rgba(15, 23, 42, 0.65) 68%,
        rgba(10, 15, 29, 0.94) 100%
    );
    pointer-events: none;
}

/* Bottom content container overlayed directly on the lower part of the image */
.tour-lodging-bottom-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 1.15rem;
}

.tour-lodging-slide-badge {
    color: #ffffff;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.25;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
}

/* 4 feature boxes ("cuadritos") overlayed on the image at the bottom */
.tour-lodging-details-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    width: 100%;
}

.tour-lodging-detail-box {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.6rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 7px !important;
    background: rgba(15, 23, 42, 0.68);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    min-width: 0;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.tour-lodging-detail-box:hover {
    background: rgba(15, 23, 42, 0.85);
    border-color: rgba(255, 255, 255, 0.38);
}

.tour-lodging-detail-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    flex-shrink: 0;
    border-radius: 7px !important;
    background: rgba(255, 255, 255, 0.14);
    color: #fbbf24;
    font-size: 0.82rem;
}

.tour-lodging-detail-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 0.05rem;
}

.tour-lodging-detail-label {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.1;
}

.tour-lodging-detail-value {
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 991.98px) {
    .tour-lodging-slider-wrap {
        margin-top: 0.5rem;
    }
}

/* Hotels Swiper Slider Section
-------------------------------------------------- */
.tour-hotels-section {
    margin-bottom: 2.75rem;
}

.tour-hotels-heading-wrap {
    margin-bottom: 1.5rem;
    align-items: center;
}

.tour-hotels-controls {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.tour-hotels-arrow {
    width: 38px;
    height: 38px;
    border-radius: 7px !important;
    border: 1px solid #e2e8f0;
    background-color: #ffffff;
    color: #111827;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.85rem;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.tour-hotels-arrow:hover {
    background-color: #111827;
    border-color: #111827;
    color: #ffffff;
}

.tour-hotels-stage {
    position: relative;
    border-radius: 7px !important;
}

.tour-hotels-main-swiper {
    position: relative;
    width: 100%;
    border-radius: 7px !important;
    overflow: hidden;
    padding-bottom: 150px;
}

.tour-hotel-slide {
    position: relative;
    width: 100%;
    min-height: 540px;
    aspect-ratio: 16 / 9;
    overflow: visible;
    background-color: transparent;
    display: flex;
    align-items: flex-end;
}

.tour-hotel-bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    z-index: 0;
    border-radius: 7px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* Semitransparent white card overlay (0.9 opacity, no blur) protruding 100px outside the hotel image block */
.tour-hotel-card-overlay {
    position: relative;
    left: 15px;
    z-index: 2;
    margin: 0;
    max-width: 530px;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.95);
    border: 0;
    border-radius: 7px !important;
    padding: 1.75rem 2rem;
    box-shadow: 0 14px 36px rgba(23, 23, 23, 0.14);
    transform: translateY(100px);
}
.tour-hotel-name {
    margin: 0 0 0.4rem;
    color: #0f172a;
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.01em;
}

.tour-hotel-stars {
    display: flex;
    gap: 0.2rem;
    color: #FFAE00;
    font-size: 0.85rem;
    line-height: 1;
    margin-bottom: 0.55rem;
}

/* Hotel category fallback preserves the star-rating rhythm for unrated lodges and boutique stays. */
.tour-hotel-category {
    color: #5d5d5d;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1.25;
    text-transform: uppercase;
}

.tour-hotel-location {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #475569;
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 0.85rem;
}

.tour-hotel-location i {
    color: #ef4444;
    font-size: 0.9rem;
}


.tour-hotel-desc {
    margin: 0 0 1rem;
    color: #374151;
    font-size: 0.84rem;
    line-height: 1.55;
}


/* Tour decision title styling */
section.tour-decision h2,
section.tour-decision h3 {
    font-size: 1.36rem;
    font-weight: 700;
    color: #173033;
    margin-bottom: 0.75rem;
}

h2.tour-section-title {
    font-size: 1.7rem;
    color: black;
}


/* Hotel detail link uses the theme's primary interactive color. */
.tour-hotel-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #b90201 !important;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: gap 0.2s ease, color 0.2s ease;
}

.tour-hotel-link:hover,
.tour-hotel-link:focus {
    color: #f10100 !important;
    gap: 0.65rem;
}

a.tour-hotel-link span {
    color: inherit;
    font-weight: 800;
}

.tour-hotels-section :is(.tour-hotels-arrow, .tour-hotel-slide-next-btn, .tour-hotel-link):focus-visible {
    outline: 3px solid rgba(241, 1, 0, 0.38);
    outline-offset: 3px;
}
.tour-hotels-section {
    margin-bottom: 1rem;
}
/* On-slide right chevron button */
.tour-hotel-slide-next-btn {
    position: absolute;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 48px;
    height: 48px;
    border-radius: 7px !important;
    background-color: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.7);
    color: #111827;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.tour-hotel-slide-next-btn:hover {
    background-color: #ffffff;
    transform: translateY(-50%) scale(1.05);
}

/* Swiper Pagination */
.tour-hotels-pagination {
    position: absolute;
    bottom: calc(100px + 1rem) !important;
    right: 1.5rem !important;
    width: auto !important;
    left: auto !important;
    z-index: 4;
}

.tour-hotels-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 7px !important;
    background-color: #ffffff;
    opacity: 0.6;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.tour-hotels-pagination .swiper-pagination-bullet-active {
    opacity: 1;
    width: 22px;
    background-color: #ffffff;
}

@media (max-width: 768px) {
    .tour-hotels-main-swiper {
        padding-bottom: 0;
    }

    .tour-hotel-slide {
        min-height: auto;
        aspect-ratio: auto;
        flex-direction: column;
    }

    .tour-hotel-bg-img {
        position: relative;
        height: 260px;
    }

    .tour-hotel-card-overlay {
        left: 0;
        margin: 0;
        max-width: 100%;
        box-shadow: none;
        padding: 1.35rem 1.15rem;
        transform: none;
    }

    .tour-hotel-slide-next-btn {
        display: none;
    }

    .tour-hotels-pagination {
        bottom: 1rem !important;
    }
}

/* Single tour styles */

/* Hero
-------------------------------------------------- */

.tour-hero {
    position: relative;
    overflow: hidden;
    min-height: 0;
}

/* Single tour hero: the grid stretches the foreground across the full image height. */
.tour-hero-slider-shell {
    position: relative;
    z-index: 0;
    aspect-ratio: 16 / 9;
    min-height: 600px;
    height: auto;
    overflow: hidden;
    display: grid;
    isolation: isolate;
    border-radius: 7px;
    background-color: #171717;
}

.tour-hero-image {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0.88;
}

/* Hero background video when video switch is enabled */
.tour-hero-video-wrap {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #0b0f19;
}

.tour-hero-video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0.88;
}

.tour-hero-video-wrap > .tour-hero-motion-toggle {
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
    z-index: 10;
}

.tour-hero-motion-toggle {
    display: inline-flex;
    min-width: 36px;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 7px;
    background: rgba(0, 0, 0, 0.72);
    color: #fff;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.tour-hero-motion-toggle:hover {
    border-color: #ffffff;
    background-color: rgba(0, 0, 0, 0.9);
}

.tour-hero-motion-toggle:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 3px;
}

/* Hero contrast layer: the inset shadow keeps the title readable without a decorative gradient. */
.tour-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background-color: rgba(23, 23, 23, 0.08);
    box-shadow: inset 0 -24rem 12rem -10rem rgba(0, 0, 0, 0.94);
    pointer-events: none;
}

/* Keep the footer in the bottom grid row over the image, reserving its actual height. */
.tour-hero-body {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-rows: 1fr auto;
    width: 100%;
    min-height: 0;
}

/* Single tour hero: align the textual content at the bottom, above the highlights. */
.tour-hero-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    flex-grow: 1;
    padding: clamp(1.75rem, 3.5vw, 3rem) clamp(1.25rem, 3vw, 2.5rem) 1rem;
}

/* Tour hero text container spans full width to allow wide titles */
.tour-hero-inner {
    width: 100%;
}

/* Bottom image overlay: add a small breathing space between the main copy and tour facts. */
.tour-hero-footer {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-top: 0.4rem;
    align-self: end;
}

/* Compact tour facts strip keeps the key details visible without covering much of the image. */
.tour-hero-details {
    position: relative;
    z-index: 3;
    width: 100%;
    padding: 0.78rem clamp(1.1rem, 2.2vw, 1.75rem);
    background: rgba(0, 0, 0, 0.76);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 7px;
    color: #ffffff;
}

.tour-hero-details-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1.4rem;
    align-items: center;
}

/* Each fact uses a compact icon-and-copy arrangement. */
.tour-hero-detail {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 0.26rem 0.72rem;
    align-items: center;
    min-width: 0;
}

.tour-hero-detail-title {
    display: flex;
    align-items: center;
    grid-column: 2;
    grid-row: 1;
    gap: 0.35rem;
    margin: 0;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    line-height: 1.3;
    text-transform: uppercase;
}

.tour-hero-detail > i {
    grid-column: 1;
    grid-row: 1 / span 2;
    color: #ffffff;
    font-size: 1.05rem;
    line-height: 1;
}

/* Value text in tour facts: sized slightly smaller to balance with labels */
.tour-hero-detail p {
    grid-column: 2;
    grid-row: 2;
    max-width: 15rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.78rem;
    font-weight: 400;
    letter-spacing: 0.025em;
    line-height: 1.4;
}

.tour-hero-info-icon {
    color: #fec902;
    font-size: 0.72rem;
    line-height: 1;
    cursor: pointer;
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: 0;
    background: transparent;
    vertical-align: middle;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.tour-hero-info-icon:hover {
    opacity: 0.85;
    transform: scale(1.15);
}

.tour-hero-info-icon:focus-visible,
.tour-hero-motion-toggle:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* Bootstrap 5 tooltip styling: black background, white text and 7px corner radius */
.tooltip.tour-hero-tooltip .tooltip-inner,
.tour-hero-tooltip .tooltip-inner,
.tooltip .tooltip-inner {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-radius: 7px !important;
    font-size: 0.76rem;
    line-height: 1.45;
    padding: 0.45rem 0.75rem;
    text-align: center;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

/* Tooltip arrow matched to black background */
.tooltip.bs-tooltip-top .tooltip-arrow::before,
.tour-hero-tooltip.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #000000 !important;
}

.tooltip.bs-tooltip-bottom .tooltip-arrow::before,
.tour-hero-tooltip.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color: #000000 !important;
}

.tooltip.bs-tooltip-start .tooltip-arrow::before,
.tour-hero-tooltip.bs-tooltip-start .tooltip-arrow::before {
    border-left-color: #000000 !important;
}

.tooltip.bs-tooltip-end .tooltip-arrow::before,
.tour-hero-tooltip.bs-tooltip-end .tooltip-arrow::before {
    border-right-color: #000000 !important;
}

/* Tripadvisor rating combines its familiar green bubbles with a short trust message. */
.tour-hero-tripadvisor-rating {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.4rem;
    align-items: center;
}

.tour-hero-tripadvisor-bubbles {
    display: inline-flex;
    gap: 0.12rem;
}

/* CSS circles reproduce the Tripadvisor rating without adding icon assets. */
.tour-hero-tripadvisor-bubbles > span {
    display: block;
    width: 0.58rem;
    height: 0.58rem;
    border: 1px solid #34e0a1;
    border-radius: 50%;
    background-color: #34e0a1;
}

.tour-hero-tripadvisor-text {
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.2;
}

.tour-hero-tripadvisor {
    justify-items: start;
}

/* Tour title: full-width hero title spanning from edge to edge */
.tour-title {
    width: 100%;
    margin: 0;
    color: var(--tour-white);
    font-size: 2.4rem;
    font-weight: 500;
    line-height: 1.03;
    letter-spacing: -0.04em;
    text-transform: uppercase;
}

/* Tour breadcrumb navigation */
.tour-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
    padding: 0;
    margin: 0 0 0.85rem;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    line-height: 1.3;
    list-style: none;
    text-transform: uppercase;
}

.tour-breadcrumb a {
    color: #64748b;
    text-decoration: none;
    transition: color 0.2s ease;
}

.tour-breadcrumb a:hover,
.tour-breadcrumb a:focus {
    color: var(--tour-primary, #f10100);
}

.tour-breadcrumb li[aria-current="page"] {
    color: var(--tour-dark, #0f172a);
    font-weight: 700;
}

.tour-breadcrumb i {
    color: #94a3b8;
    font-size: 0.55rem;
}

/* Main content
-------------------------------------------------- */

.tour-main {
    padding: 2rem 0;
}

.tour-description {
    max-width: 900px;
}

.tour-description strong {
    color: var(--tour-dark);
}

.tour-description ul {
    display: grid;
    padding: 0;
    margin: 1rem 0 1rem 0;
    list-style: none;
}

.tour-description ul li {
    position: relative;
    padding-left: 2rem;
    color: #393939;
    font-size: 0.95rem;
}

.tour-description ul li::before {
    position: absolute;
    top: 0.38rem;
    left: 0;
    color: var(--tour-primary);
    content: "\f00c";
    font-family: "Font Awesome 7 Free";
    font-size: 0.92rem;
    font-weight: 900;
    line-height: 1;
}

article.tour-description blockquote {
    color: grey;
    border: 2px solid #f10100;
    padding: 1rem;
}

.tour-description ul li > i:first-child {
    display: block;
}

/* Booking summary
-------------------------------------------------- */

.tour-booking-sticky {
    position: sticky;
    top: 1.5rem;
    display: grid;
    gap: 1rem;
    width: 100%;
    max-width: 420px;
    margin-left: auto;
}

/* Compact & elegant Tour Inquiry Summary Card
-------------------------------------------------- */
.tour-inquiry-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 7px !important;
    background-color: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.tour-inquiry-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid #eef2f6;
    background-color: #f8fafc;
    gap: 0.75rem;
}

.tour-inquiry-duration {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.tour-inquiry-duration span {
    color: #64748b;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.1;
    text-transform: uppercase;
}

.tour-inquiry-duration strong {
    color: #0f172a;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.2;
}

.tour-inquiry-price {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.1rem;
    text-align: right;
}

.tour-inquiry-price-label {
    color: #64748b;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.1;
    text-transform: uppercase;
}

.tour-inquiry-price-value {
    display: inline-flex;
    align-items: baseline;
    gap: 0.15rem;
    line-height: 1;
}

.tour-inquiry-currency {
    color: var(--tour-primary, #b90201);
    font-size: 0.85rem;
    font-weight: 700;
}

/* Highlighted tour price amount in inquiry card header */
.tour-inquiry-price strong {
    color: #0f172a;
    font-size: 2.4rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1;
}

.tour-inquiry-unit {
    color: #64748b;
    font-size: 0.66rem;
    font-weight: 500;
    line-height: 1.1;
}

.tour-inquiry-action {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.85rem 1rem 0.95rem;
}

.tour-inquiry-button {
    display: inline-flex;
    width: 100%;
    min-height: 2.5rem;
    align-items: center;
    justify-content: center;
    padding: 0.55rem 1rem;
    border: 1px solid var(--tour-primary, #b90201);
    border-radius: 7px !important;
    background-color: var(--tour-primary, #b90201);
    color: #ffffff;
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.tour-inquiry-button:hover,
.tour-inquiry-button:focus {
    background-color: var(--tour-primary-dark, #8e0201);
    border-color: var(--tour-primary-dark, #8e0201);
    color: #ffffff;
    transform: translateY(-1px);
}

/* Minimal impact disclosure keeps the social contribution message clear inside the booking card. */
.tour-impact {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.15rem;
    text-align: left;
}

.tour-impact-intro {
    margin: 0;
    color: #5d5d5d;
    font-size: 0.82rem;
    line-height: 1.55;
}

.tour-impact-details {
    padding: 0 0.75rem;
    border-radius: 7px;
    background-color: #f7f7f5;
}

/* The summary acts as a compact text control with a restrained plus-to-minus indicator. */
.tour-impact-summary {
    display: flex;
    min-height: 44px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 0;
    border-radius: 7px;
    color: #171717;
    cursor: pointer;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    list-style: none;
}

.tour-impact-summary::-webkit-details-marker {
    display: none;
}

.tour-impact-summary:focus-visible {
    outline: 2px solid #f10100;
    outline-offset: 3px;
}

/* Your Impact uses one solid red hand without a border or background treatment. */
.tour-impact-summary-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.tour-impact-like {
    display: inline-grid;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    place-items: center;
}

.tour-impact-like-icon {
    display: block;
    color: var(--tour-primary, #f10100);
    font-size: 1.1rem;
    line-height: 1;
}

.tour-impact-toggle {
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

/* The Your Impact disclosure symbol uses a stronger two-pixel stroke in both states. */
.tour-impact-toggle::before,
.tour-impact-toggle::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 2px;
    border-radius: 7px;
    background-color: #f10100;
    content: "";
    transform: translate(-50%, -50%);
    transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-impact-toggle::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.tour-impact-details[open] .tour-impact-toggle::after {
    transform: translate(-50%, -50%) rotate(90deg) scaleX(0);
}

/* The panel clips only its own pixels so opening it never animates the surrounding page layout. */
.tour-impact-panel {
    overflow: hidden;
}

.tour-impact-panel-inner {
    padding: 0 0 0.8rem;
}

.tour-impact-panel ul {
    display: grid;
    gap: 0.42rem;
    margin: 0;
    padding-left: 1.1rem;
}

.tour-impact-panel li {
    color: #5d5d5d;
    font-size: 0.82rem;
    line-height: 1.45;
}

.tour-impact-panel li::marker {
    color: #f10100;
}

/* Tour inquiry modal (Bootstrap 5)
-------------------------------------------------- */

.tour-modal .modal-content {
    border: 1px solid #e2e8f0;
    border-radius: 7px !important;
    background-color: #ffffff;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

.tour-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.5rem 1.75rem 1.25rem;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f8fafc;
    border-radius: 7px !important;
}

.tour-modal-eyebrow {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--tour-primary, #f10100);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.tour-modal-title {
    margin: 0;
    color: var(--tour-dark, #0f172a);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.25;
}

.tour-modal-close {
    border-radius: 7px !important;
    opacity: 0.65;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.tour-modal-close:hover,
.tour-modal-close:focus {
    opacity: 1;
    outline: none;
    box-shadow: none;
}

.tour-modal-body {
    padding: 1.75rem;
}

.tour-modal-label {
    display: block;
    margin-bottom: 0.4rem;
    color: #334155;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.tour-modal-input-group {
    position: relative;
    display: flex;
    align-items: center;
}

.tour-modal-input-icon {
    position: absolute;
    left: 0.95rem;
    color: #94a3b8;
    font-size: 0.9rem;
    pointer-events: none;
    z-index: 3;
}

.tour-modal-input,
.tour-modal-select,
.tour-modal-textarea {
    width: 100%;
    min-height: 44px;
    padding: 0.6rem 0.9rem 0.6rem 2.45rem;
    border: 1px solid #cbd5e1;
    border-radius: 7px !important;
    background-color: #ffffff;
    color: #1e293b;
    font-size: 0.9rem;
    line-height: 1.4;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.tour-modal-textarea {
    min-height: 84px;
    padding-left: 0.9rem;
    resize: vertical;
}

.tour-modal-input:focus,
.tour-modal-select:focus,
.tour-modal-textarea:focus {
    border-color: var(--tour-primary, #f10100);
    outline: none;
    box-shadow: 0 0 0 3px rgba(241, 1, 0, 0.12);
}

.tour-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid #e2e8f0;
}

.tour-modal-guarantee {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 500;
}

.tour-modal-guarantee i {
    color: #10b981;
    font-size: 0.95rem;
}

.tour-modal-submit {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.65rem 1.6rem;
    border: 1px solid var(--tour-primary-dark, #b91c1c);
    border-radius: 7px !important;
    background-color: var(--tour-primary-dark, #b91c1c);
    color: #ffffff;
    font-size: 0.88rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.tour-modal-submit:hover,
.tour-modal-submit:focus {
    background-color: var(--tour-dark, #0f172a);
    border-color: var(--tour-dark, #0f172a);
    color: #ffffff;
    transform: translateY(-1px);
}

@media (max-width: 575.98px) {
    .tour-modal-footer {
        flex-direction: column;
        align-items: stretch;
    }

    .tour-modal-submit {
        width: 100%;
    }
}

/* Media resources keep the map and video visually connected with clear spacing. */
.tour-inquiry-resources {
    padding: 15px;
    display: grid;
    gap: 0.75rem;
    border-top: 1px solid #e5e7eb;
}

/* Compact Tripadvisor slider shows one review at a time inside the booking card. */
.tour-inquiry-tripadvisor {
    display: grid;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border-top: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
    border-radius: 7px !important;
    background-color: #ffffff;
    color: #050505;
    text-align: left;
}

/* Tripadvisor heading pairs its identity with the overall five-bubble score. */
.tour-inquiry-review-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

.tour-inquiry-review-bubbles {
    display: inline-flex;
    align-items: center;
    gap: 0.14rem;
}

.tour-inquiry-review-bubbles > span {
    display: block;
    width: 0.58rem;
    height: 0.58rem;
    border: 1px solid #008f3a;
    border-radius: 50%;
    background-color: #008f3a;
}

.tour-inquiry-tripadvisor-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    color: #000000;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
}

.tour-inquiry-tripadvisor-brand > span,
.tour-inquiry-review-author {
    display: grid;
    gap: 0.2rem;
}

.tour-inquiry-tripadvisor-brand img {
    display: block;
    width: 7.25rem;
    height: auto;
}

.tour-inquiry-tripadvisor-brand strong {
    color: var(--tour-dark);
    font-size: 0.82rem;
    line-height: 1.1;
}

.tour-inquiry-tripadvisor-brand small {
    color: #6b7280;
    font-size: 0.68rem;
    line-height: 1.1;
}

/* Review content uses fixed visual rhythm while Swiper handles touch and slide movement. */
.tour-inquiry-review-swiper {
    width: 100%;
    min-width: 0;
}

.tour-inquiry-review-slide {
    display: grid;
    gap: 0.65rem;
    height: auto;
}

.tour-inquiry-review-slide h3 {
    margin: 0;
    color: var(--tour-dark);
    font-size: 0.94rem;
    font-weight: 700;
    line-height: 1.3;
}

.tour-inquiry-review-slide p {
    margin: 0;
    color: #555555;
    font-size: 0.78rem;
    line-height: 1.55;
}

.tour-inquiry-review-author strong {
    color: var(--tour-dark);
    font-size: 0.74rem;
    line-height: 1.2;
}

.tour-inquiry-review-author small {
    color: #777777;
    font-size: 0.66rem;
    line-height: 1.2;
}

/* Bottom controls use compact circular indicators and keep the reviews link secondary. */
.tour-inquiry-review-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-top: 0.85rem;
    border-top: 1px solid #e5e7eb;
}

.tour-inquiry-review-pagination {
    display: inline-flex;
    width: auto !important;
    align-items: center;
    gap: 0.3rem;
}

.tour-inquiry-review-pagination .swiper-pagination-bullet {
    width: 0.45rem;
    height: 0.45rem;
    margin: 0 !important;
    border: 1px solid #008f3a;
    border-radius: 50%;
    background-color: transparent;
    opacity: 1;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.tour-inquiry-review-pagination .swiper-pagination-bullet-active {
    background-color: #008f3a;
    transform: scale(1.2);
}

.tour-inquiry-review-footer a {
    color: #006b45;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

.tour-inquiry-review-footer a:hover,
.tour-inquiry-review-footer a:focus-visible {
    color: var(--tour-dark);
    text-decoration: underline;
}

/* Interactive route-map card inside the sticky booking summary with 7px rounded corners. */
.tour-inquiry-map {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 7px;
    border-top: 1px solid #e2e2e2;
    background-color: #f5f5f5;
    color: #ffffff;
    text-decoration: none;
}

/* Bottom gradient preserves map visibility while keeping the copy readable. */
.tour-inquiry-map::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    content: "";
    background: linear-gradient(180deg, transparent 28%, rgba(0, 0, 0, 0.82) 100%);
    transition: background 0.3s ease;
    pointer-events: none;
}

.tour-inquiry-map img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    height: auto;
    object-fit: cover;
    transition: transform 0.45s ease, filter 0.3s ease;
}

.tour-inquiry-map:hover img,
.tour-inquiry-map:focus-visible img {
    filter: contrast(1.05) saturate(1.08);
    transform: scale(1.055);
}

/* Elegant map title, description and compact opening cue. */
.tour-inquiry-map-copy {
    position: absolute;
    right: 1.3rem;
    bottom: 1.2rem;
    left: 1.3rem;
    z-index: 2;
    display: grid;
    gap: 0.55rem;
    transform: translateY(0.4rem);
    transition: transform 0.3s ease;
}

.tour-inquiry-map-copy strong {
    color: #ffffff;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
}

.tour-inquiry-map-copy > span:not(.tour-inquiry-map-action) {
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.76rem;
    line-height: 1.45;
}

.tour-inquiry-map-action {
    width: max-content;
    margin-top: 0.25rem;
    padding-bottom: 0.15rem;
    border-bottom: 1px solid currentColor;
    color: #ffffff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(0.3rem);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.tour-inquiry-map:hover .tour-inquiry-map-copy,
.tour-inquiry-map:focus-visible .tour-inquiry-map-copy,
.tour-inquiry-map:hover .tour-inquiry-map-action,
.tour-inquiry-map:focus-visible .tour-inquiry-map-action {
    opacity: 1;
    transform: translateY(0);
}

.tour-inquiry-map:focus-visible {
    outline: 2px solid var(--tour-primary);
    outline-offset: -2px;
}

/* Preserve comfortable spacing without crowding the booking card on small phones. */
@media (max-width: 575.98px) {
    .tour-inquiry-summary {
        gap: 0.65rem;
        padding: 1.1rem;
    }

    .tour-inquiry-duration {
        padding-right: 0.8rem;
    }

    .tour-inquiry-action,
    .tour-inquiry-tripadvisor {
        padding-right: 1.1rem;
        padding-left: 1.1rem;
    }
}

/* Remove nonessential movement when the visitor prefers reduced motion. */
@media (prefers-reduced-motion: reduce) {
    .tour-impact-toggle::before,
    .tour-impact-toggle::after {
        transition: none;
    }

    .tour-inquiry-map img,
    .tour-inquiry-map-copy,
    .tour-inquiry-map-action {
        transition: none;
    }

    .tour-inquiry-map:hover img,
    .tour-inquiry-map:focus-visible img {
        transform: none;
    }
}

/* Floating tour navigation
-------------------------------------------------- */

.tour-floating-nav {
    position: sticky;
    top: var(--tour-floating-top, 0);
    z-index: 1040;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f3f4f6;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: background-color 0.35s ease, box-shadow 0.35s ease;
}

/* Once the navigation reaches the viewport top, switch to a clean white surface. */
.tour-floating-nav.is-fixed {
    position: fixed;
    top: var(--tour-floating-top, 0);
    right: 0;
    left: 0;
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0 8px 20px -4px rgba(17, 24, 39, 0.08), 0 4px 8px -2px rgba(17, 24, 39, 0.04);
}

body.admin-bar {
    --tour-floating-top: 32px;
}

@media (max-width: 782px) {
    body.admin-bar {
        --tour-floating-top: 46px;
    }
}

/* Spacer preserves exact layout height when floating navigation becomes fixed */
.tour-floating-spacer {
    display: none;
    height: var(--tour-floating-nav-height, 0px);
}

.tour-floating-spacer.is-active {
    display: block;
    height: var(--tour-floating-nav-height, 64px);
}

/* Unified scroll margin offset for all one-page navigation sections to align accurately below the sticky nav */
#overview {
    scroll-margin-top: calc(var(--tour-floating-top, 0px) + 20px);
}

#itinerary,
#inclusions,
#trip-checklist,
#departures,
#why-peru-summit,
#trip-reviews,
#trip-leaders,
#lodging,
#inquire {
    scroll-margin-top: calc(var(--tour-floating-top, 0px) + 74px);
}

.tour-floating-nav-inner {
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.5rem 0;
}

/* Left-aligned navigation cluster */
.tour-floating-nav-left {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    margin-left: 0;
    margin-right: auto;
    padding-left: 0;
    text-align: left;
}

.tour-floating-logo {
    display: none;
}

.tour-floating-nav.is-fixed .tour-floating-logo {
    display: none;
}

.tour-floating-logo img {
    width: 7.35rem;
    max-height: 2.65rem;
    object-fit: contain;
}

/* Modern segmented navigation track aligned to the left */
.tour-floating-links {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.35rem;
    min-width: 0;
    padding: 0.3rem 0;
    margin: 0;
    border-radius: 7px !important;
}

/* Hide the detached indicator that caused desync and white-on-white text */
.tour-floating-indicator {
    display: none !important;
}

/* Individual tab link item */
.tour-floating-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 38px;
    padding: 0.45rem 1.1rem;
    border: 0;
    border-radius: 7px !important;
    color: #334155;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
    background-color: transparent;
    transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

/* Contextual icon inside each menu item */
.tour-floating-link-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    line-height: 1;
    color: #64748b;
    transition: color 0.2s ease, transform 0.2s ease;
}

/* Inactive link hover: subtle red background and dark-red text, never turns white */
.tour-floating-link:hover,
.tour-floating-link:focus-visible {
    color: var(--tour-primary, #b90201);
    background-color: rgba(185, 2, 1, 0.08);
    text-decoration: none;
}

.tour-floating-link:hover .tour-floating-link-icon,
.tour-floating-link:focus-visible .tour-floating-link-icon {
    color: var(--tour-primary, #b90201);
    transform: translateY(-1px);
}

/* Active navigation item: Solid red pill with white text and icon.
   Because background-color is set directly on .is-active, text is NEVER white on a light/white background. */
.tour-floating-link.is-active {
    background-color: var(--tour-primary, #b90201) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(185, 2, 1, 0.32);
    border-radius: 7px !important;
}

.tour-floating-link.is-active .tour-floating-link-icon {
    color: #ffffff !important;
}

.tour-floating-link.is-active:hover,
.tour-floating-link.is-active:focus-visible {
    background-color: var(--tour-primary-dark, #8b0000) !important;
    color: #ffffff !important;
    box-shadow: 0 3px 10px rgba(139, 0, 0, 0.4);
}

.tour-floating-link.is-active:hover .tour-floating-link-icon,
.tour-floating-link.is-active:focus-visible .tour-floating-link-icon {
    color: #ffffff !important;
}

/* "MORE" navigation item and dropdown menu
----------------------------------------------------------------------- */
.tour-floating-more-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.tour-floating-link-more {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    border: none;
    cursor: pointer;
    font-family: inherit;
}

.tour-floating-more-indicator {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    line-height: 1;
}

/* Three small dots on the right side of MORE */
.tour-floating-dots {
    position: absolute;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2.5px;
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.22s ease, transform 0.24s cubic-bezier(0.4, 0, 0.2, 1);
}

.tour-floating-dot {
    width: 3.5px;
    height: 3.5px;
    border-radius: 50%;
    background-color: currentColor;
    display: inline-block;
    transition: transform 0.24s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Chevron down icon initially hidden and scaled down */
.tour-floating-chevron {
    position: absolute;
    font-size: 0.72rem;
    color: currentColor;
    opacity: 0;
    transform: translateY(-4px) scale(0.5);
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.24s cubic-bezier(0.4, 0, 0.2, 1);
}

/* On hover / focus-within / is-open: 3 dots smoothly collapse inwards while chevron drops into place */
.tour-floating-more-wrap:hover .tour-floating-dots,
.tour-floating-more-wrap:focus-within .tour-floating-dots,
.tour-floating-more-wrap.is-open .tour-floating-dots,
.tour-floating-link-more:hover .tour-floating-dots,
.tour-floating-link-more:focus-visible .tour-floating-dots {
    opacity: 0;
    transform: scale(0.2);
}

.tour-floating-more-wrap:hover .tour-floating-dot:nth-child(1),
.tour-floating-more-wrap:focus-within .tour-floating-dot:nth-child(1),
.tour-floating-more-wrap.is-open .tour-floating-dot:nth-child(1) {
    transform: translateX(3px);
}

.tour-floating-more-wrap:hover .tour-floating-dot:nth-child(3),
.tour-floating-more-wrap:focus-within .tour-floating-dot:nth-child(3),
.tour-floating-more-wrap.is-open .tour-floating-dot:nth-child(3) {
    transform: translateX(-3px);
}

.tour-floating-more-wrap:hover .tour-floating-chevron,
.tour-floating-more-wrap:focus-within .tour-floating-chevron,
.tour-floating-more-wrap.is-open .tour-floating-chevron,
.tour-floating-link-more:hover .tour-floating-chevron,
.tour-floating-link-more:focus-visible .tour-floating-chevron {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.tour-floating-more-wrap:hover .tour-floating-link-more,
.tour-floating-more-wrap:focus-within .tour-floating-link-more,
.tour-floating-more-wrap.is-open .tour-floating-link-more {
    color: var(--tour-primary, #b90201);
    background-color: rgba(185, 2, 1, 0.08);
}

/* Dropdown menu appearing below MORE on hover / click */
.tour-floating-dropdown {
    position: absolute;
    top: calc(100% + 0.4rem);
    left: 0;
    min-width: 195px;
    padding: 0.4rem;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    box-shadow: 0 10px 25px -4px rgba(15, 23, 42, 0.12), 0 6px 12px -3px rgba(15, 23, 42, 0.06);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
    z-index: 1060;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

/* Invisible hover bridge */
.tour-floating-dropdown::before {
    content: "";
    position: absolute;
    top: -0.5rem;
    left: 0;
    right: 0;
    height: 0.5rem;
}

.tour-floating-more-wrap:hover .tour-floating-dropdown,
.tour-floating-more-wrap:focus-within .tour-floating-dropdown,
.tour-floating-more-wrap.is-open .tour-floating-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* State when a dropdown link is clicked: forces the dropdown to disappear immediately even if hovered or focused */
.tour-floating-more-wrap.is-closed .tour-floating-dropdown {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(6px) !important;
    transition: none !important;
}

/* Reset indicator and link styling immediately when dismissed via link click */
.tour-floating-more-wrap.is-closed .tour-floating-dots {
    opacity: 1 !important;
    transform: none !important;
}

.tour-floating-more-wrap.is-closed .tour-floating-dot {
    transform: none !important;
}

.tour-floating-more-wrap.is-closed .tour-floating-chevron {
    opacity: 0 !important;
    transform: translateY(-4px) scale(0.6) !important;
}

.tour-floating-more-wrap.is-closed .tour-floating-link-more {
    color: inherit !important;
    background-color: transparent !important;
}

/* Individual dropdown links */
.tour-floating-dropdown-item {
    display: flex;
    align-items: center;
    padding: 0.55rem 0.85rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: #334155;
    text-decoration: none;
    border-radius: 7px;
    white-space: nowrap;
    transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.tour-floating-dropdown-item:hover,
.tour-floating-dropdown-item:focus {
    background-color: rgba(185, 2, 1, 0.08);
    color: var(--tour-primary, #b90201);
    text-decoration: none;
    transform: translateX(3px);
}

/* High-contrast Book Now CTA */
.tour-floating-contact {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
}

.tour-floating-book {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.55rem 1.35rem;
    border: 1px solid var(--tour-dark);
    border-radius: 7px;
    background-color: var(--tour-dark);
    color: var(--tour-white);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1;
    text-transform: uppercase;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.tour-floating-book:hover,
.tour-floating-book:focus {
    background-color: var(--tour-primary-dark);
    border-color: var(--tour-primary-dark);
    color: var(--tour-white);
    transform: translateY(-1px);
}

.tour-floating-booking {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    border-top: 1px solid var(--tour-border);
    background-color: rgba(255, 255, 255, 0.96);
    box-shadow: 0 18px 34px rgba(17, 24, 39, 0.14);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    white-space: nowrap;
}

.tour-floating-button {
    display: inline-flex;
    min-height: clamp(3.8rem, 6vw, 4.8rem);
    align-items: center;
    justify-content: center;
    padding: 0.9rem 1.5rem;
    background-color: var(--tour-primary-dark);
    color: var(--tour-white);
    font-size: clamp(1.25rem, 2.5vw, 2rem);
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    transition:
            background-color 0.2s ease,
            color 0.2s ease;
}

.tour-floating-button:hover,
.tour-floating-button:focus {
    background-color: var(--tour-dark);
    color: var(--tour-white);
}

/* Tour decision list at the end of the main description.
   Rendered as a clean vertical list with star bullet icons.
-------------------------------------------------- */

/* The requested warm light-gray surface groups the tour decision message with calm, readable contrast. */
.tour-decision {
    margin-top: 1.75rem;
    margin-bottom: 1.5rem;
    padding: clamp(1.25rem, 2.5vw, 1.75rem);
    border: 1px solid #dededb;
    border-radius: 7px;
    background-color: rgb(247, 247, 245);
}

.tour-decision > p {
    max-width: 52rem;
    margin: 0 0 1.25rem;
    color: #40585a;
    font-size: 0.92rem;
    line-height: 1.55;
}

.tour-description .tour-decision ul {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.tour-description .tour-decision li {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0;
    border: none;
    background: transparent;
    color: #173033;
    box-shadow: none;
    transform: none;
    transition: none;
}

.tour-description .tour-decision li:hover {
    border-color: transparent;
    box-shadow: none;
    transform: none;
}

/* Explicitly disable inherited pseudo-element checkmarks */
.tour-description .tour-decision li::before {
    display: none !important;
    content: none !important;
}

/* Star bullet icon for each list item */
.tour-description .tour-decision .tour-decision-bullet,
.tour-description .tour-decision li > i.fa-star {
    flex-shrink: 0;
    font-size: 0.85rem;
    color: var(--tour-primary, #f10100);
    margin-top: 0.22rem;
    line-height: 1;
}

.tour-decision-text {
    flex: 1 1 auto;
}

.tour-description .tour-decision li h4 {
    margin: 0 0 0.25rem;
    color: #173033;
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.35;
}

.tour-description .tour-decision li p {
    margin: 0;
    color: #4f6365;
    font-size: 0.88rem;
    line-height: 1.55;
}

/* Tour WebM and YouTube video facade with lazy loading
-------------------------------------------------- */

.tour-video-section {
    margin: 2.25rem 0 2rem 0;
}

.tour-video-facade {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-color: #0b0f19;
    border-radius: 7px;
    overflow: hidden;
    cursor: pointer;
}

.tour-video-facade .tour-video-poster {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 7px;
    transition: transform 300ms ease, opacity 300ms ease;
    display: block;
}

.tour-video-facade:hover .tour-video-poster {
    transform: scale(1.02);
}

/* Semi-transparent dark mask overlay over JPG poster */
.tour-video-facade .tour-video-mask {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.45) 100%);
    border-radius: 7px;
    pointer-events: none;
    transition: background 300ms ease;
}

.tour-video-facade:hover .tour-video-mask {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.35) 100%);
}

/* Play button centered over the JPG mask */
.tour-video-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 4.25rem;
    height: 4.25rem;
    border: none;
    border-radius: 7px;
    background-color: var(--tour-primary, #f10100);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    padding: 0 0 0 4px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    cursor: pointer;
    transition: transform 220ms ease, background-color 220ms ease, box-shadow 220ms ease;
    z-index: 2;
}

.tour-video-facade:hover .tour-video-play-button {
    transform: translate(-50%, -50%) scale(1.08);
    background-color: #d00000;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
}

.tour-video-play-button:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 3px;
}

/* Responsive embedded or uploaded video when loaded */
.tour-video-facade iframe,
.tour-video-facade .tour-video-file {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 7px;
    z-index: 3;
}

.tour-video-facade .tour-video-file {
    background-color: var(--tour-ink, #171717);
    object-fit: contain;
}

/* Tour itinerary accordion
-------------------------------------------------- */

.tour-itinerary-layout {
    align-items: flex-start;
}

.tour-itinerary-layout h2 {
    font-size: 1.35rem;
}
.tour-itinerary-layout h3 {
    font-size: 1rem;
}

.tour-itinerary-main {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
}

.tour-itinerary-main > section {
    min-width: 0;
    max-width: 100%;
    margin-bottom: 2.25rem;
    padding: 0;
    border: 0;
    background-color: var(--tour-white);
}

.tour-itinerary-main > section:last-child {
    margin-bottom: 0;
}

/* Sticky itinerary sidebar keeps cards accessible on larger screens. */
.tour-itinerary-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    position: sticky;
    top: calc(var(--tour-floating-top, 0px) + 5.5rem);
    align-self: flex-start;
}

/* Travel specialist card uses the site's existing neutral and red color palette. */
.tour-specialist-card {
    overflow: hidden;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    background-color: #ffffff;
}

/* Social-profile header presents the specialist portrait and availability clearly. */
.tour-specialist-media {
    position: relative;
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 0.8rem;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 1rem 1.25rem;
    overflow: hidden;
    background-color: #f7f8f9;
    text-align: center;
}

.tour-specialist-media img {
    display: block;
    width: 5rem;
    height: 5rem;
    border: 3px solid #ffffff;
    border-radius: 50% !important;
    box-shadow: 0 0 0 1px #e1e4e8, 0 7px 18px rgba(17, 24, 39, 0.1);
    object-fit: cover;
    transition: transform 0.45s ease;
}

.tour-specialist-card:hover .tour-specialist-media img {
    transform: scale(1.035);
}

.tour-specialist-media > span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: #59616d;
    font-size: 0.64rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.3;
    text-transform: uppercase;
}

.tour-specialist-media > span::before {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50% !important;
    background-color: #38a169;
    content: "";
}

/* Compact specialist content container with balanced padding */
.tour-specialist-content {
    padding: 0.9rem 1rem;
}

.tour-specialist-label {
    display: block;
    margin-bottom: 0.3rem;
    color: var(--tour-primary);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.tour-specialist-content h2,
.tour-itinerary-layout .tour-specialist-content h2 {
    margin: 0 0 0.4rem;
    color: var(--tour-dark);
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.25;
}

.tour-specialist-content > p {
    margin: 0 0 0.7rem;
    color: #5f6670;
    font-size: 0.78rem;
    line-height: 1.45;
}

/* Compact contact rows separate each contact method */
.tour-specialist-contact {
    display: grid;
    margin-bottom: 0.7rem;
    border-top: 1px solid #e5e7eb;
}

.tour-specialist-contact a {
    display: grid;
    gap: 0.15rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid #e5e7eb;
    color: var(--tour-dark);
    text-decoration: none;
}

.tour-specialist-contact a:hover,
.tour-specialist-contact a:focus-visible {
    color: var(--tour-primary);
}

.tour-specialist-contact span {
    color: #6b7280;
    font-size: 0.62rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.tour-specialist-contact strong {
    overflow-wrap: anywhere;
    font-size: 0.75rem;
    font-weight: 600;
}

/* Compact specialist action button with 7px rounded corners per design directive */
.tour-specialist-button {
    display: inline-flex;
    width: 100%;
    min-height: 2.35rem;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.45rem 0.75rem;
    border: 1px solid var(--tour-dark);
    border-radius: 7px !important;
    background-color: var(--tour-dark);
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.tour-specialist-button:hover,
.tour-specialist-button:focus-visible {
    border-color: var(--tour-primary);
    background-color: var(--tour-primary);
    color: #ffffff;
}

/* On small screens the specialist card returns to normal document flow. */
@media (max-width: 767.98px) {
    .tour-itinerary-sidebar {
        position: static;
    }

    .tour-specialist-card {
        display: grid;
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    }

    .tour-specialist-media {
        min-height: 100%;
        height: 100%;
    }
}

/* Stack the specialist image and contact details on narrow phones. */
@media (max-width: 575.98px) {
    .tour-specialist-card {
        grid-template-columns: 1fr;
    }

    .tour-specialist-media {
        min-height: 0;
        height: auto;
    }
}

/* Respect reduced-motion preferences on the specialist photograph. */
@media (prefers-reduced-motion: reduce) {
    .tour-specialist-media img {
        transition: none;
    }

    .tour-specialist-card:hover .tour-specialist-media img {
        transform: none;
    }
}

.tour-itinerary-heading-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.1rem;
}

.tour-itinerary-title {
    margin: 0;
    color: var(--tour-dark);
    font-size: clamp(2.2rem, 4vw, 3rem);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1;
    text-transform: uppercase;
}

.tour-itinerary-expand {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.55rem 0.95rem;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    background-color: #ffffff;
    color: var(--tour-primary);
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tour-itinerary-expand::after {
    content: "\f078";
    font-family: "Font Awesome 7 Free";
    font-weight: 900;
    font-size: 0.7rem;
    transition: transform 0.2s ease;
}

.tour-itinerary-expand[aria-expanded="true"]::after {
    transform: rotate(180deg);
}

.tour-itinerary-expand:hover,
.tour-itinerary-expand:focus {
    border-color: var(--tour-primary);
    background-color: #fff5f5;
    color: var(--tour-primary);
    box-shadow: 0 2px 8px rgba(241, 1, 0, 0.12);
    transform: translateY(-1px);
    outline: 0;
}

.tour-itinerary-section > p {
    max-width: 1180px;
    margin: 0 0 3rem;
    color: #343840;
    line-height: 1.8;
}

.tour-itinerary-section > p + p,
.tour-itinerary-section > .tour-itinerary-heading-row + p + p {
    display: none;
}

/* Trip details form a compact two-column card grid placed before the video section. */
.tour-trip-details {
    padding: 0;
    border: 0;
    margin: 2.25rem 0 0 0;
    background-color: #ffffff;
}

.tour-trip-details > h2 {
    margin: 0 0 1.1rem;
    color: var(--tour-dark);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Trip details grid displaying tour characteristics with regular body typography */
.tour-trip-details-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem 1.25rem;
}

/* Trip detail card container with 7px rounded corners and balanced spacing */
.tour-trip-detail-item {
    display: grid;
    grid-template-columns: 1.5rem auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 0.4rem 0.75rem;
    align-content: start;
    padding: 1.15rem;
    border: 1px solid #eceef0;
    border-radius: 7px !important;
    background-color: #ffffff;
    color: var(--tour-dark);
}

/* Trip detail icon aligned to match standard text size */
.tour-trip-detail-item > i {
    display: inline-flex;
    grid-column: 1;
    grid-row: 1;
    width: 1.5rem;
    height: 1.5rem;
    align-items: center;
    justify-content: center;
    color: #8a9099;
    font-size: 0.95rem;
    transition: color 180ms ease;
}

/* Trip detail hover highlights only the supporting icon. */
.tour-trip-detail-item:hover > i {
    color: var(--tour-primary);
}

/* Trip detail label title scaled to regular headline font size */
.tour-trip-detail-item > h4 {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    color: #2d3748;
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.35;
}

/* Trip detail value text matching regular font size */
.tour-trip-detail-item > strong {
    grid-column: 3;
    grid-row: 1;
    align-self: center;
    color: #4b5563;
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.35;
}

/* Trip detail descriptive paragraph scaled to regular text size matching main content */
.tour-trip-detail-item > p {
    grid-column: 2 / -1;
    grid-row: 2;
    margin: 0.25rem 0 0;
    color: #4b5563;
    font-size: 0.95rem;
    line-height: 1.6;
}

/* Tour itinerary accordion uses a continuous linear list with clear open and closed states.
-------------------------------------------------- */

.tour-itinerary-accordion {
    position: relative;
    display: grid;
    row-gap: 0.85rem;
    padding-left: 0;
    border: 0;
}

/* Individual accordion card with subtle border and 7px rounded corners */
.tour-itinerary-item.accordion-item {
    position: relative;
    margin: 0;
    border: 1px solid #e9ecef;
    border-radius: 7px !important;
    background-color: #ffffff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.02);
    overflow: hidden;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

/* Elegant minimalist hover state on entire card */
.tour-itinerary-item.accordion-item:hover {
    border-color: #cbd5e1;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
    transform: translateY(-1px);
}

/* Open accordion card styling */
.tour-itinerary-item.accordion-item:has(.accordion-collapse.show),
.tour-itinerary-item.accordion-item:has(.accordion-button:not(.collapsed)) {
    border-color: rgba(241, 1, 0, 0.3);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.04);
}

.tour-itinerary-item:last-child {
    margin-bottom: 0;
}

.tour-itinerary-item .accordion-header {
    border-radius: 7px !important;
    margin: 0;
    border: 0;
}

/* Minimalist trigger button with smooth interaction */
.tour-itinerary-button {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1.15rem 1.35rem;
    border: 0;
    border-radius: 7px !important;
    background-color: #ffffff;
    color: var(--tour-dark);
    box-shadow: none;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.tour-itinerary-button:hover,
.tour-itinerary-button:focus {
    background-color: #fafbfd;
    color: var(--tour-dark);
    outline: 0;
    box-shadow: none;
}

.tour-itinerary-button:not(.collapsed) {
    background-color: #ffffff;
    border-bottom: 1px solid #f1f3f5;
    border-radius: 7px 7px 0 0 !important;
    box-shadow: none;
    color: var(--tour-dark);
}

.tour-itinerary-button:focus {
    border-color: transparent;
    outline: 0;
}

.tour-itinerary-button:focus-visible {
    outline: 2px solid var(--tour-primary);
    outline-offset: -2px;
}

.tour-itinerary-button::after {
    display: none;
}

/* Step day container */
.tour-itinerary-day {
    display: flex;
    gap: 0.85rem;
    align-items: center;
    line-height: 1.3;
}

/* Minimalist pill badge for Step number */
.tour-itinerary-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem 0.65rem;
    background-color: rgba(241, 1, 0, 0.08);
    color: var(--tour-primary);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 7px !important;
    transition: background-color 0.25s ease, color 0.25s ease;
}

/* Title typography with subtle elegant hover motion */
.tour-itinerary-day strong {
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3;
    transition: color 0.25s ease, transform 0.25s ease;
}

.tour-itinerary-button:hover .tour-itinerary-day strong {
    color: var(--tour-primary);
    transform: translateX(2px);
}

.tour-itinerary-button:hover .tour-itinerary-step {
    background-color: rgba(241, 1, 0, 0.14);
}

/* Minimalist chevron toggle indicator */
.tour-itinerary-chevron {
    display: inline-flex;
    width: 2.1rem;
    height: 2.1rem;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2e8f0;
    border-radius: 7px !important;
    background-color: #f8fafc;
    color: #64748b;
    font-size: 0.76rem;
    transition: all 0.25s ease;
}

.tour-itinerary-button:hover .tour-itinerary-chevron {
    background-color: #f1f5f9;
    border-color: #cbd5e1;
    color: #0f172a;
    transform: scale(1.05);
}

.tour-itinerary-button:not(.collapsed) .tour-itinerary-chevron {
    border-color: var(--tour-primary);
    background-color: var(--tour-primary);
    color: #ffffff;
    transform: rotate(180deg);
    box-shadow: 0 2px 6px rgba(241, 1, 0, 0.22);
}

.tour-itinerary-button:not(.collapsed):hover .tour-itinerary-chevron {
    background-color: var(--tour-primary-dark);
    transform: rotate(180deg) scale(1.05);
}

/* Accordion body container */
.tour-itinerary-body {
    padding: 1.35rem 1.45rem 1.65rem;
    background-color: #ffffff;
    border-radius: 0 0 7px 7px !important;
}

.tour-itinerary-body > p {
    margin-top: 0;
    margin-bottom: 0.95rem;
    color: #475569;
    font-size: 0.94rem;
    line-height: 1.75;
}

.tour-itinerary-body > p:last-of-type {
    margin-bottom: 0;
}

/* Minimalist facts grid with subtle card design */
.tour-itinerary-details,
.tour-itinerary-details-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem 1rem;
    margin-top: 1.65rem;
    margin-bottom: 0.5rem;
    padding-top: 1.35rem;
    border-top: 1px solid #f1f5f9;
    border-bottom: 0;
}

/* Discreet and elegant fact card with subtle resting state */
.tour-itinerary-detail,
.tour-itinerary-details-grid .tour-itinerary-detail {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 0.75rem;
    row-gap: 0.15rem;
    align-items: center;
    min-height: auto;
    min-width: 0;
    padding: 0.75rem 0.85rem;
    border: 1px solid #edf0f3;
    border-radius: 7px !important;
    background-color: #fbfcfd;
    color: inherit;
    text-align: left;
    transition: background-color 0.22s ease, border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
}

.tour-itinerary-detail:last-child {
    border-bottom: 1px solid #edf0f3;
}

/* Subtle, elegant elevation on card hover with neutral border */
.tour-itinerary-detail:hover,
.tour-itinerary-details-grid .tour-itinerary-detail:hover {
    background-color: #ffffff;
    border-color: #cbd5e1;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
}

/* Discreet neutral icon without background */
.tour-itinerary-detail i,
.tour-itinerary-details-grid .tour-itinerary-detail i {
    display: inline-flex;
    grid-row: 1 / span 2;
    width: 2.25rem;
    height: 2.25rem;
    align-items: center;
    justify-content: center;
    border: 0;
    background-color: transparent;
    color: #64748b;
    font-size: 1.15rem;
    line-height: 1;
    transition: color 0.25s ease, transform 0.25s ease;
}

/* Hover effect on icons */
.tour-itinerary-detail:hover i,
.tour-itinerary-details-grid .tour-itinerary-detail:hover i {
    color: var(--tour-primary);
    background-color: transparent;
    transform: scale(1.1);
}

.tour-itinerary-detail :is(strong, span),
.tour-itinerary-details-grid .tour-itinerary-detail :is(strong, span) {
    display: block;
}

.tour-itinerary-detail strong,
.tour-itinerary-details-grid .tour-itinerary-detail strong {
    align-self: end;
    color: #94a3b8;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
    transition: color 0.2s ease;
}

.tour-itinerary-detail:hover strong,
.tour-itinerary-details-grid .tour-itinerary-detail:hover strong {
    color: #64748b;
}

.tour-itinerary-detail span,
.tour-itinerary-details-grid .tour-itinerary-detail span {
    grid-column: 2;
    align-self: start;
    color: #1e293b;
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.35;
}
.tour-itinerary-gallery {
    display: none;
}

/* Note on Itinerary informational callout box */
.tour-itinerary-note {
    margin-top: 1.5rem;
    padding: 1.25rem 1.4rem;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 7px !important;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.tour-itinerary-note-title {
    margin: 0;
    color: #0f172a;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    line-height: 1.3;
}

.tour-itinerary-note-text {
    margin: 0;
    color: #475569;
    font-size: 0.88rem;
    line-height: 1.65;
}

.air-datepicker {
    --adp-border-radius: 7px;
    --adp-cell-border-radius: 7px;
    --adp-color-current-date: var(--tour-primary-dark);
    --adp-color-selected: #37b76a;
    --adp-background-color-selected-other-month: #37b76a;
    --adp-color-selected-other-month: #ffffff;
}

/* Extra section
-------------------------------------------------- */

.tour-extra {
    padding: 4rem 0 0 0;
    background-color: var(--tour-white);
}

.tour-extra :is(h2, h3, h4, h5, h6) {
    color: var(--tour-dark);
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1.2;
}

.tour-extra h2:not(#tourGreenEngageTitle) {
    font-size: 1.35rem;
}

.tour-extra h4 {
    font-size: 1.15rem;
}

.tour-extra h5,
.tour-extra h6 {
    font-size: 1.05rem;
}

/* Tour route locations banner with bottom margin and 7px border radius */
.tour-route-locations {
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
    align-items: center;
    width: 100%;
    margin: 1rem 0 1.5rem;
    padding: 0.3rem;
    overflow-x: auto;
    border-radius: 7px;
    background-color: #f1f1f1;
    font-size: 0.8rem;
    line-height: 1.2;
    white-space: nowrap;
    scrollbar-width: thin;
}

.tour-route-locations i {
    margin-right: 1rem;
    color: var(--tour-primary);
    font-size: 1.25rem;
}

.tour-route-location-divider {
    width: 1px;
    height: 1rem;
    margin: 0 1.05rem;
    background-color: #c9c9c9;
    flex: 0 0 auto;
}

.section-travel-stories h3 {
    font-size: 1.2rem;
    font-weight: 500;
}

.section-travel-stories  h3 {
    font-size: 1.2rem;
    font-weight: 500;
}

/* Shared review card styles
-------------------------------------------------- */

.tour-review-card {
    min-height: 100%;
    display: grid;
    gap: 0.6rem;
    align-content: start;
    padding: 1rem;
    border: 1px solid var(--tour-border);
    background-color: var(--tour-white);
    box-shadow: 0 12px 28px rgba(17, 24, 39, 0.06);
}
.tour-review-card-stars {
    display: inline-flex;
    gap: 0.2rem;
    color: var(--tour-primary);
    font-size: 1rem;
    line-height: 1;
}

.tour-review-card p {
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--tour-dark);
}

.tour-review-title {
    margin: 0;
    color: var(--tour-dark);
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.2;
}
.tour-review-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0.8rem;
    margin-top: 0.5rem;
    border-top: 1px solid var(--tour-border);
}

.tour-review-author-info {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.tour-review-avatar {
    display: inline-flex;
    width: 2.5rem;
    height: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #fdf4ed;
    color: var(--tour-primary);
    font-size: 1.1rem;
}

.tour-review-author-info p {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin: 0;
    color: var(--tour-dark);
    font-size: 0.85rem;
    font-weight: 500;
}

.tour-review-author-info p i {
    color: #00aa6c;
    font-size: 0.8rem;
}

.tour-review-author-note {
    display: flex;
    align-items: center;
    margin-top: 0.1rem;
    color: #7a808a;
    font-size: 0.75rem;
    line-height: 1.25;
}

/* Tour excellence cards
-------------------------------------------------- */

.tour-excellence {
    padding: 4.5rem 0;
    background-color: #f6fbff;
}

.tour-excellence .tour-best-selling-header {
    margin-bottom: 1.25rem;
    margin-right: 0;
    margin-left: 0;
    text-align: left;
}

.tour-excellence .tour-best-selling-title {
    font-size: 2rem;
}

.tour-excellence .tour-best-selling-title::after {
    left: 0;
    transform: none;
}
.tour-excellence-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
}

.tour-excellence-card {
    position: relative;
    min-height: 260px;
    overflow: hidden;
    background-color: #17212c;
    color: var(--tour-white);
    isolation: isolate;
    box-shadow: 0 14px 30px rgba(17, 24, 39, 0.08);
    transition:
            border-color 0.25s ease,
            box-shadow 0.25s ease,
            transform 0.25s ease;
}

.tour-excellence-image {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
            opacity 0.25s ease,
            transform 0.42s ease;
}

.tour-excellence-card::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
            linear-gradient(
                    rgba(0, 0, 0, 0.05),
                    rgba(0, 0, 0, 0.68)
            );
    content: "";
    transition: background 0.25s ease;
}

.tour-excellence-content {
    display: flex;
    min-height: inherit;
    flex-direction: column;
    justify-content: end;
    padding: 1.55rem;
}

.tour-excellence-kicker {
    position: relative;
    display: inline-flex;
    gap: 0.55rem;
    align-items: center;
    width: fit-content;
    margin-bottom: 0.55rem;
    color: #ffae00;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    line-height: 1;
    text-transform: uppercase;
}

.tour-excellence-kicker::before {
    width: 1.55rem;
    height: 2px;
    background-color: #FFAE00;
    content: "";
    transition: width 0.25s ease;
}

.tour-excellence-title {
    margin: 0;
    color: var(--tour-white);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.12;
    text-transform: uppercase;
    text-shadow: 0 6px 18px rgba(0, 0, 0, 0.32);
    transform: translateY(0);
    transition:
            color 0.25s ease,
            transform 0.25s ease;
}

.tour-excellence-detail {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
    width: fit-content;
    margin-top: 0.75rem;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.tour-excellence-card:hover,
.tour-excellence-card:focus-within {
    border-color: rgba(241, 1, 0, 0.42);
    box-shadow: 0 24px 52px rgba(17, 24, 39, 0.16);
    transform: translateY(-6px);
}

.tour-excellence-card:hover .tour-excellence-image,
.tour-excellence-card:focus-within .tour-excellence-image {
    opacity: 0.9;
    transform: scale(1.06);
}

.tour-excellence-card:hover .tour-excellence-title,
.tour-excellence-card:focus-within .tour-excellence-title {
    color: #fff2e9;
    transform: translateY(-4px);
}

.tour-excellence-card:hover .tour-excellence-kicker::before,
.tour-excellence-card:focus-within .tour-excellence-kicker::before {
    width: 2.25rem;
}

@media (max-width: 991.98px) {
    .tour-excellence-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .tour-excellence {
        padding: 3rem 0;
    }

    .tour-excellence-grid {
        grid-template-columns: 1fr;
    }

    .tour-excellence-card {
        min-height: 245px;
    }
}

/* Social projects
-------------------------------------------------- */

.tour-social-projects {
    padding: 4.5rem 0;
    background-color: #f6fbff;
}

.tour-social-projects .tour-best-selling-header {
    margin-right: 0;
    margin-left: 0;
    text-align: left;
}

.tour-social-projects .tour-best-selling-title {
    font-size: 2rem;
}

.tour-social-projects .tour-best-selling-title::after {
    left: 0;
    transform: none;
}

.tour-social-projects .tour-best-selling-title span {
    color: var(--tour-primary);
}
.tour-social-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
}

.tour-social-card {
    position: relative;
    min-height: 280px;
    overflow: hidden;
    background-color: #17212c;
    color: var(--tour-white);
    isolation: isolate;
    box-shadow: 0 14px 30px rgba(17, 24, 39, 0.08);
    transition:
            border-color 0.25s ease,
            box-shadow 0.25s ease,
            transform 0.25s ease;
}

.tour-social-card-wide {
    grid-column: span 2;
}

.tour-social-image {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
            opacity 0.25s ease,
            transform 0.4s ease;
}

.tour-social-card::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
            linear-gradient(
                    rgba(17, 24, 39, 0.04),
                    rgba(17, 24, 39, 0.74)
            );
    content: "";
    transition: background 0.25s ease;
}

.tour-social-content {
    display: flex;
    height: 100%;
    min-height: inherit;
    align-items: end;
    padding: 1.35rem;
}

.tour-social-title {
    position: relative;
    max-width: 92%;
    margin: 0;
    padding-left: 0.95rem;
    color: var(--tour-white);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.18;
    text-shadow: 0 4px 14px rgba(0, 0, 0, 0.24);
    transform: translateY(0);
    transition:
            color 0.25s ease,
            transform 0.25s ease;
}

.tour-social-title::before {
    position: absolute;
    top: 0.08rem;
    bottom: 0.08rem;
    left: 0;
    width: 3px;
    background-color: var(--tour-white);
    content: "";
    transition:
            background-color 0.25s ease,
            transform 0.25s ease;
}

.tour-social-card:hover,
.tour-social-card:focus-within {
    border-color: rgba(241, 1, 0, 0.46);
    box-shadow: 0 24px 48px rgba(17, 24, 39, 0.16);
    transform: translateY(-5px);
}

.tour-social-card:hover .tour-social-image,
.tour-social-card:focus-within .tour-social-image {
    opacity: 0.9;
    transform: scale(1.055);
}

.tour-social-card:hover .tour-social-title,
.tour-social-card:focus-within .tour-social-title {
    color: #fff2e9;
    transform: translateY(-4px);
}

.tour-social-card:hover .tour-social-title::before,
.tour-social-card:focus-within .tour-social-title::before {
    background-color: var(--tour-primary);
    transform: scaleY(1.08);
}

@media (max-width: 991.98px) {
    .tour-social-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tour-social-card-wide {
        grid-column: span 2;
    }
}

@media (max-width: 575.98px) {
    .tour-social-projects {
        padding: 3rem 0;
    }

    .tour-social-grid {
        grid-template-columns: 1fr;
    }

    .tour-social-card,
    .tour-social-card-wide {
        grid-column: auto;
        min-height: 260px;
    }
}

/* Departure calendar provides year and month filters above bookable tour dates. */
.tour-departures {
    margin-bottom: 2.75rem;
}

.tour-departures-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.4rem;
}

.tour-departures-heading span {
    display: block;
    margin-bottom: 0.35rem;
    color: #64748b;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.tour-departures-heading h2, .tour-services-wide h2 {
    margin-bottom: 0.6rem;
    text-transform: uppercase;
}

/* Description paragraph directly underneath the departure title */
.tour-departures-heading p {
    margin-top: 0.45rem;
    margin-bottom: 0;
    max-width: 44rem;
    color: #64748b;
    font-size: 0.84rem;
    line-height: 1.55;
}

/* Tour departure date filters container */
.tour-departure-controls {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    margin-bottom: 1.35rem;
    padding: 1.25rem;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
}

/* Individual filter group wrapper */
.tour-departure-filter-block {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

/* Header row for filter group labels and summaries */
.tour-departure-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

/* Category labels to differentiate Year (macro) and Month (micro) */
.tour-departure-filter-label {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #475569;
}

.tour-departure-filter-label i {
    color: #64748b;
    font-size: 0.85rem;
}

/* Selected active month badge */
.tour-departure-selected-summary {
    display: inline-block;
    font-size: 0.76rem;
    font-weight: 700;
    color: #0f172a;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    padding: 0.22rem 0.65rem;
    transition: all 0.2s ease;
}

.tour-departure-selected-summary.is-updating {
    animation: summaryFade 0.25s ease-out;
}

@keyframes summaryFade {
    0% { opacity: 0.35; transform: translateY(-2px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* Year & Service tabs selector: 4 cards showing Year Departures + Private Service */
.tour-departure-years {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
    width: 100%;
}

.tour-departure-years button,
.tour-departure-year-btn {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    min-height: 3.9rem;
    padding: 0.65rem 0.95rem;
    border: 1px solid #e2e8f0;
    background-color: #ffffff;
    border-radius: 7px !important;
    cursor: pointer;
    text-align: center;
    transition: all 0.22s ease;
}

/* Inactive year buttons: hover state with distinct visible background */
.tour-departure-years .tour-departure-year-btn:not(.is-active):hover:not([aria-disabled="true"]):not(.tour-departure-private-btn),
.tour-departure-years button:not(.is-active):hover:not([aria-disabled="true"]):not(.tour-departure-private-btn),
.tour-departure-year-btn:not(.is-active):hover:not([aria-disabled="true"]):not(.tour-departure-private-btn) {
    border-color: #94a3b8;
    background-color: #e2e8f0;
    color: #0f172a;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    transform: translateY(-2px);
}

.tour-departure-years .tour-departure-year-btn:not(.is-active):hover:not([aria-disabled="true"]):not(.tour-departure-private-btn) .tour-departure-year-title,
.tour-departure-years button:not(.is-active):hover:not([aria-disabled="true"]):not(.tour-departure-private-btn) .tour-departure-year-title,
.tour-departure-year-btn:not(.is-active):hover:not([aria-disabled="true"]):not(.tour-departure-private-btn) .tour-departure-year-title {
    color: #0f172a;
}

/* Active year button: deep charcoal slate background */
.tour-departure-years .tour-departure-year-btn.is-active:not(.tour-departure-private-btn),
.tour-departure-years button.is-active:not(.tour-departure-private-btn),
.tour-departure-year-btn.is-active:not(.tour-departure-private-btn) {
    border-color: #0f172a !important;
    background-color: #0f172a !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.16) !important;
}

/* Active year button on hover: remains deep charcoal slate, never turns white! */
.tour-departure-years .tour-departure-year-btn.is-active:hover:not(.tour-departure-private-btn),
.tour-departure-years button.is-active:hover:not(.tour-departure-private-btn),
.tour-departure-year-btn.is-active:hover:not(.tour-departure-private-btn) {
    border-color: #1e293b !important;
    background-color: #1e293b !important;
    color: #ffffff !important;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.24) !important;
    transform: translateY(-2px) !important;
}

/* Title remains bold white in active state and active hover */
.tour-departure-years .tour-departure-year-btn.is-active .tour-departure-year-title,
.tour-departure-years button.is-active .tour-departure-year-title,
.tour-departure-year-btn.is-active .tour-departure-year-title,
.tour-departure-years .tour-departure-year-btn.is-active:hover .tour-departure-year-title,
.tour-departure-years button.is-active:hover .tour-departure-year-title,
.tour-departure-year-btn.is-active:hover .tour-departure-year-title {
    color: #ffffff !important;
}

.tour-departure-years button[aria-disabled="true"],
.tour-departure-year-btn[aria-disabled="true"] {
    background-color: #f8fafc;
    border-color: #e2e8f0;
    cursor: not-allowed;
    opacity: 0.55;
}

/* Primary year line (e.g. 2026 Departures) */
.tour-departure-year-title {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0f172a;
    line-height: 1.2;
    transition: color 0.2s ease;
}

/* Private Service Tab: Distinctive VIP / Amber color scheme */
.tour-departure-private-btn {
    border-color: #fcd34d !important;
    background-color: #fffdf5 !important;
}

.tour-departure-private-btn .tour-departure-year-title {
    color: #92400e;
}

.tour-departure-private-btn:hover:not([aria-disabled="true"]) {
    border-color: #f59e0b !important;
    background-color: #fef3c7 !important;
    box-shadow: 0 4px 14px rgba(217, 119, 6, 0.16) !important;
}

.tour-departure-private-btn.is-active {
    border-color: #b45309 !important;
    background-color: #b45309 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 16px rgba(180, 83, 9, 0.28) !important;
}

.tour-departure-private-btn.is-active .tour-departure-year-title {
    color: #ffffff !important;
}

.tour-departure-private-btn.is-active:hover {
    border-color: #92400e !important;
    background-color: #92400e !important;
    color: #ffffff !important;
}

/* Month selector container: Keeps all 12 months in a single horizontal row with smooth scroll on mobile */
.tour-departure-months-container {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
    padding-bottom: 3px;
}

.tour-departure-months-container::-webkit-scrollbar {
    height: 5px;
}

.tour-departure-months-container::-webkit-scrollbar-track {
    background: transparent;
}

.tour-departure-months-container::-webkit-scrollbar-thumb {
    background-color: #cbd5e1;
    border-radius: 7px;
}

/* Month buttons row: Exactly 12 columns in a single row */
.tour-departure-months {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.35rem;
    min-width: 560px;
    margin-bottom: 0;
}

@media (min-width: 992px) {
    .tour-departure-months {
        min-width: 0;
    }
}

.tour-departure-months button {
    min-height: 2.6rem;
    padding: 0.5rem 0.25rem;
    border: 1px solid #cbd5e1;
    background-color: #ffffff;
    color: #334155;
    font-size: 0.78rem;
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-radius: 7px;
    cursor: pointer;
    transition: all 180ms ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Inactive month button on hover */
.tour-departure-months button:not(.is-active):hover:not([aria-disabled="true"]) {
    border-color: #94a3b8;
    color: #0f172a;
    background-color: #e2e8f0;
}

/* Active month button */
.tour-departure-months button.is-active {
    border-color: var(--tour-primary);
    background-color: var(--tour-primary) !important;
    color: #ffffff !important;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(241, 1, 0, 0.26);
}

/* Active month button on hover: remains red, never turns white! */
.tour-departure-months button.is-active:hover {
    border-color: var(--tour-primary-dark, #b90201);
    background-color: var(--tour-primary-dark, #b90201) !important;
    color: #ffffff !important;
}

.tour-departure-months button[aria-disabled="true"] {
    border-color: #e2e8f0;
    background-color: #f1f5f9;
    color: #94a3b8;
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}

/* Status message for departures inside controls container */
.tour-departure-message {
    display: none;
    margin: 0;
    padding: 0.85rem 1.15rem;
    border: 1px solid #e2e8f0;
    background-color: #ffffff;
    color: #475569;
    font-size: 0.82rem;
    line-height: 1.5;
    border-radius: 7px;
}

.tour-departure-message.is-visible {
    display: block;
}

/* Card list container nested inside controls */
.tour-departure-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    position: relative;
    overflow: hidden;
}

/* Expandable wrapper for dates beyond the first 10 with smooth grid-template-rows animation */
.tour-departure-extra-wrap {
    display: grid;
    grid-template-rows: 0fr;
    margin-top: -0.75rem;
    overflow: hidden;
    opacity: 0;
    transition: grid-template-rows 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                margin-top 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                opacity 0.28s ease;
}

.tour-departure-extra-wrap.is-expanded {
    grid-template-rows: 1fr;
    margin-top: 0;
    opacity: 1;
}

/* Inner wrapper containing cards beyond the first 10 */
.tour-departure-extra-inner {
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Container for the View More / View Less dates toggle button */
.tour-departure-toggle-wrap {
    display: flex;
    justify-content: center;
    padding-top: 0.35rem;
}

/* Minimalist and aesthetic toggle button with 7px rounded corners */
.tour-departure-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.65rem 1.4rem;
    font-size: 0.84rem;
    font-weight: 700;
    color: #0f172a;
    background-color: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 7px !important;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    transition: all 0.22s ease;
    text-decoration: none;
}

/* Hover state for toggle button */
.tour-departure-toggle-btn:hover {
    background-color: #0f172a;
    color: #ffffff;
    border-color: #0f172a;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
    transform: translateY(-1px);
}

/* Animated chevron icon that rotates 180deg when expanded */
.tour-departure-toggle-icon {
    font-size: 0.75rem;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-departure-toggle-btn.is-expanded .tour-departure-toggle-icon {
    transform: rotate(180deg);
}

/* Single entrance animation for each departure card: Fade In Up */
@keyframes departureFadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Each departure row card: displays with a single smooth Fade In Up animation */
.tour-departure-card {
    display: grid;
    grid-template-columns: 1fr 1fr 0.8fr auto;
    gap: 1.25rem;
    align-items: center;
    padding: 1.15rem 1.25rem;
    border: 1px solid #e2e8f0;
    background-color: #ffffff;
    box-shadow: 0 2px 6px rgba(17, 24, 39, 0.035);
    border-radius: 7px;
    animation: departureFadeInUp 0.35s ease-out both;
    animation-delay: calc(var(--card-index, 0) * 40ms);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.tour-departure-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 6px 16px rgba(17, 24, 39, 0.07);
}

.tour-departure-card > div {
    display: grid;
    gap: 0.25rem;
}

.tour-departure-card span {
    color: #6c7480;
    font-size: 0.72rem;
}

.tour-departure-card strong {
    color: #111827;
    font-size: 0.9rem;
    font-weight: 700;
}

.tour-departure-action {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: flex-end;
}

/* Pricing layout with subtext */
.tour-departure-pricing {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
}

.tour-departure-price {
    color: #111827;
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.015em;
    white-space: nowrap;
}

.tour-departure-price-sub {
    color: #64748b;
    font-size: 0.68rem;
    font-weight: 500;
    white-space: nowrap;
}

.tour-departure-book {
    display: inline-flex;
    min-height: 2.45rem;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 0.95rem;
    border: 1px solid var(--tour-primary);
    background-color: var(--tour-primary);
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 7px;
    transition: background-color 180ms ease, border-color 180ms ease;
}

.tour-departure-book:hover {
    border-color: var(--tour-primary-dark);
    background-color: var(--tour-primary-dark);
    color: #ffffff;
}

/* Trust bar with customer guarantees dividing filters and departure cards */
.tour-departure-trust-bar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
    padding-top: 0.95rem;
    padding-bottom: 0.95rem;
    margin-top: 0.15rem;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.tour-departure-trust-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    color: #475569;
    font-size: 0.75rem;
    line-height: 1.35;
}

.tour-departure-trust-item i {
    color: #059669;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.tour-departure-trust-item strong {
    color: #0f172a;
}

/* ==========================================================================
   Private Service Pricing Panel & Advantage Alert
   ========================================================================== */

/* Private service main container panel inside controls */
.tour-departure-private-panel {
    margin-top: 0;
    animation: fadeInPrivate 0.25s ease-in-out;
}

@keyframes fadeInPrivate {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive table wrapper with discreet border and rounded 7px corners */
.tour-departure-private-panel .table-responsive {
    border-radius: 7px;
    border: 1px solid #e2e8f0;
    overflow: hidden;
    background-color: #ffffff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03);
}

/* Minimalist and discreet table styles */
.tour-departure-private-panel .table-prices {
    width: 100%;
    margin: 0 !important;
    border-collapse: separate;
    border-spacing: 0;
    border: none;
    font-size: 0.88rem;
    color: #334155;
    background-color: #ffffff;
}

.tour-departure-private-panel .table-prices th,
.tour-departure-private-panel .table-prices td {
    padding: 0.95rem 1.35rem;
    vertical-align: middle;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #f1f5f9;
}

.tour-departure-private-panel .table-prices thead th {
    background-color: #fafbfc;
    color: #64748b;
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8edf2;
    padding-top: 0.9rem;
    padding-bottom: 0.9rem;
}

/* Smooth background hover effect with transitions on pricing table rows */
.tour-departure-private-panel .table-prices tbody tr {
    transition: background-color 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-departure-private-panel .table-prices tbody tr > th,
.tour-departure-private-panel .table-prices tbody tr > td {
    transition: background-color 0.25s cubic-bezier(0.16, 1, 0.3, 1), color 0.25s ease;
}

.tour-departure-private-panel .table-prices tbody tr:last-child th,
.tour-departure-private-panel .table-prices tbody tr:last-child td {
    border-bottom: none;
}

/* Discreet row hover: subtle soft background and smooth focus */
.tour-departure-private-panel .table-prices tbody tr:hover,
.tour-departure-private-panel .table-prices tbody tr:hover > th,
.tour-departure-private-panel .table-prices tbody tr:hover > td {
    background-color: #f8fafc !important;
}

.tour-departure-private-panel .table-prices tbody tr:hover th[scope="row"] {
    color: #0f172a;
}

.tour-departure-private-panel .table-prices tbody th[scope="row"] {
    color: #334155;
    font-weight: 600;
    font-size: 0.9rem;
    transition: color 0.25s ease;
}

.tour-departure-private-panel .table-prices td.text-right {
    font-variant-numeric: tabular-nums;
    font-weight: 500;
    color: #475569;
}

.tour-departure-private-panel .table-prices .total {
    font-size: 0.96rem;
    font-weight: 700;
    color: #0f172a;
    transition: color 0.25s ease;
}

/* Solo / Group helper text in private table */
.tour-departure-private-panel .table-prices .table-note-text {
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.45;
}

/* Discreet CTA button in table: clean border, gentle hover transition */
.tour-departure-private-panel .btn-book-single,
.tour-departure-private-panel .btn-naranja {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.25rem;
    padding: 0.45rem 1.15rem;
    font-size: 0.74rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #1e293b !important;
    background-color: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 7px !important;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: background-color 0.22s ease, border-color 0.22s ease, color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
}

/* When table row is hovered, button border softly prepares */
.tour-departure-private-panel .table-prices tbody tr:hover .btn-book-single {
    border-color: #94a3b8;
}

/* Discreet button hover: smooth dark elevation with gentle icon movement */
.tour-departure-private-panel .btn-book-single:hover,
.tour-departure-private-panel .btn-naranja:hover {
    background-color: #0f172a !important;
    border-color: #0f172a !important;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.15);
}

.tour-departure-private-panel .btn-book-single i {
    font-size: 0.7rem;
    transition: transform 0.2s ease;
}

.tour-departure-private-panel .btn-book-single:hover i {
    transform: translateX(2px);
}

/* Mobile & Desktop table toggles */
@media (min-width: 768px) {
    .tour-departure-private-panel .table-mobile {
        display: none !important;
    }
}

@media (max-width: 767.98px) {
    .tour-departure-private-panel .table-desktop {
        display: none !important;
    }

    .tour-departure-private-panel .table-mobile th,
    .tour-departure-private-panel .table-mobile td {
        padding: 0.75rem 0.85rem;
    }

    .tour-departure-private-panel .price_table_list {
        font-size: 0.82rem;
        font-weight: 700;
        color: #0f172a;
        margin-top: 0.2rem;
    }
}

/* Mobile tooltip for solo & 6+ participants info */
.tour-departure-private-panel .tooltip_tour {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
}

.tour-departure-private-panel .tooltip_tour .circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    height: 1.15rem;
    font-size: 0.65rem;
    background-color: #e2e8f0;
    color: #475569;
    border-radius: 7px;
}

.tour-departure-private-panel .top_tooltip {
    display: none;
    position: absolute;
    bottom: calc(100% + 6px);
    left: 0;
    z-index: 10;
    min-width: 210px;
    padding: 0.55rem 0.75rem;
    background-color: #0f172a;
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 400;
    line-height: 1.35;
    border-radius: 7px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}

.tour-departure-private-panel .tooltip_tour:hover .top_tooltip,
.tour-departure-private-panel .tooltip_tour:focus .top_tooltip {
    display: block;
}

/* Advantages alert banner */
.tour-departure-private-panel .alerta-book {
    margin-top: 1.25rem;
    padding: 1.2rem 1.4rem;
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 7px !important;
    color: #166534;
}

.tour-departure-private-panel .alerta-book > b:first-child {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 0.65rem;
    color: #14532d;
}

.tour-departure-private-panel .alerta-book ul {
    margin: 0;
    padding-left: 1.2rem;
    list-style-type: disc;
}

.tour-departure-private-panel .alerta-book li {
    font-size: 0.84rem;
    line-height: 1.55;
    margin-bottom: 0.45rem;
    color: #166534;
}

.tour-departure-private-panel .alerta-book li:last-child {
    margin-bottom: 0;
}

.tour-departure-private-panel .alerta-book li b {
    color: #14532d;
}

/* Tablet responsive adjustment for 4-column year tabs */
@media (max-width: 991.98px) {
    .tour-departure-years {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Departure controls responsive adjustments */
@media (max-width: 767.98px) {
    .tour-departures-heading { display: grid; gap: 0.65rem; }
    .tour-departure-years { grid-template-columns: 1fr; }
    .tour-departure-trust-bar { grid-template-columns: 1fr; gap: 0.6rem; }
    .tour-departure-card { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem; }
    .tour-departure-action { grid-column: 1 / -1; justify-content: space-between; padding-top: 0.7rem; border-top: 1px solid #eceef0; }
    .tour-departure-pricing { align-items: flex-start; }
}

@media (max-width: 420px) {
    .tour-departure-years button { padding: 0.65rem 0.85rem; }
}

/* ==========================================================================
   What Makes Us Different - Accordion Section
   ========================================================================== */

/* Main outer card container with 7px rounded corners and subtle border */
.tour-why-diff-card {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    padding: 2.25rem 2.25rem 2rem;
    margin: 0 0 2rem;
}

/* Header section holding titles and introductory copy */
.tour-why-diff-header {
    margin-bottom: 0.5rem;
}

/* Primary heading in uppercase */
.tour-why-diff-title {
    font-size: 1.18rem;
    font-weight: 800;
    color: #111827;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.25;
    margin: 0 0 0.35rem;
}

/* Custom spacing for What's the Trip Like card header */
.tour-trip-like-card .tour-why-diff-title {
    margin: 0 0 1.25rem;
}

/* Subtitle under primary heading */
.tour-why-diff-subtitle {
    font-size: 0.98rem;
    font-weight: 700;
    color: #1f2937;
    line-height: 1.4;
    margin: 0 0 1.15rem;
}

/* Lead descriptive text paragraphs, including the editable ACF introduction. */
.tour-why-diff-lead,
.tour-why-diff-introduction p {
    font-size: 0.88rem;
    line-height: 1.65;
    color: #4b5563;
    margin: 0 0 0.95rem;
}

.tour-why-diff-introduction > :last-child {
    margin-bottom: 0;
}

/* Actions toolbar with SHOW ALL button aligned to right */
.tour-why-diff-toolbar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 1.1rem;
    margin-bottom: 0.5rem;
}

/* Show all / Collapse all text toggle button */
.tour-why-diff-toggle-all {
    background: transparent;
    border: none;
    padding: 0;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: underline;
    color: #111827;
    cursor: pointer;
    transition: color 0.2s ease;
}

.tour-why-diff-toggle-all:hover {
    color: var(--tour-primary, #b90201);
}

/* Accordion wrapper */
.tour-why-diff-accordion {
    border: none;
    background: transparent;
}

/* Each accordion item separated with subtle horizontal rules */
.tour-why-diff-item {
    background: transparent !important;
    border: none !important;
    border-top: 1px solid #e5e7eb !important;
    border-radius: 0 !important;
}

.tour-why-diff-item:last-child {
    border-bottom: 1px solid #e5e7eb !important;
}

/* Header button for each accordion item */
.tour-why-diff-button {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    padding: 1.15rem 0 !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    text-align: left;
    cursor: pointer;
}

.tour-why-diff-button::after {
    display: none !important;
}

/* Title text within accordion button */
.tour-why-diff-button-title {
    font-size: 0.94rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.45;
    transition: color 0.2s ease;
}

.tour-why-diff-button:hover .tour-why-diff-button-title {
    color: var(--tour-primary, #b90201);
}

/* Minimalist animated chevron icon on the right */
.tour-why-diff-chevron {
    font-size: 0.78rem;
    color: #111827;
    flex-shrink: 0;
    margin-left: 1.25rem;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.tour-why-diff-button:not(.collapsed) .tour-why-diff-chevron {
    transform: rotate(180deg);
}

/* Body content of the accordion panel */
.tour-why-diff-body {
    padding: 0 0 1.35rem 0 !important;
}

.tour-why-diff-body p {
    font-size: 0.88rem;
    line-height: 1.65;
    color: #4b5563;
    margin: 0;
}

/* What Makes Us Different uses a soft gray surface and light border to separate it from adjacent content. */
#why-peru-summit.tour-why-diff-card {
    position: relative;
    overflow: hidden;
    padding: clamp(1.75rem, 3vw, 2.75rem);
    background-color: #f3f4f4;
    border-color: #d8ddde;
}

/* The section introduction stays readable without stretching across the full content width. */
#why-peru-summit .tour-why-diff-header {
    max-width: 62rem;
    margin-bottom: 1.4rem;
}

/* Neutral dark typography establishes the hierarchy on the gray surface. */
#why-peru-summit .tour-why-diff-title {
    margin-bottom: 0.55rem;
    color: #1f2937;
    font-size: 1.45rem;
    letter-spacing: -0.02em;
}

/* The supporting statement stays distinct through weight rather than accent color. */
#why-peru-summit .tour-why-diff-subtitle {
    margin-bottom: 1.25rem;
    color: #374151;
    font-size: 1.02rem;
}

/* Introductory paragraphs use a balanced neutral tone for comfortable reading. */
#why-peru-summit .tour-why-diff-lead,
#why-peru-summit .tour-why-diff-introduction p {
    color: #4b5563;
    font-size: 0.94rem;
}

/* The bulk accordion action remains a quiet secondary control on the gray section. */
#why-peru-summit .tour-why-diff-toolbar {
    margin: 1.4rem 0 0.85rem;
}

#why-peru-summit .tour-why-diff-toggle-all {
    min-height: 42px;
    padding: 0.65rem 1rem;
    border: 1px solid #c7ced0;
    border-radius: 7px;
    color: #374151;
    text-decoration: none;
    transition: background-color 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}

#why-peru-summit .tour-why-diff-toggle-all:hover,
#why-peru-summit .tour-why-diff-toggle-all:focus-visible {
    background-color: #ffffff;
    border-color: #aeb7b9;
    color: #111827;
}

/* Spaced accordion rows read as one structured collection rather than loose rules. */
#why-peru-summit .tour-why-diff-accordion {
    display: grid;
    gap: 0.7rem;
}

#why-peru-summit .tour-why-diff-item,
#why-peru-summit .tour-why-diff-item:last-child {
    overflow: hidden;
    background-color: #ffffff !important;
    border: 1px solid #d5dadd !important;
    border-radius: 7px !important;
}

/* Accordion buttons use numbered markers and a stronger expanded state. */
#why-peru-summit .tour-why-diff-button {
    min-height: 68px;
    padding: 0.9rem 1rem !important;
    background-color: #ffffff !important;
    transition: background-color 0.22s ease;
}

#why-peru-summit .tour-why-diff-button:hover,
#why-peru-summit .tour-why-diff-button:not(.collapsed) {
    background-color: #eef1f1 !important;
}

#why-peru-summit .tour-why-diff-button:focus-visible {
    z-index: 1;
    outline: 3px solid #747f82;
    outline-offset: -3px;
}

/* Number and title form a stable scan line across short and long accordion labels. */
#why-peru-summit .tour-why-diff-button-copy {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    align-items: center;
    gap: 0.9rem;
    min-width: 0;
}

#why-peru-summit .tour-why-diff-number {
    display: grid;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border-radius: 7px;
    background-color: #e1e5e6;
    color: #263238;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    transition: background-color 0.22s ease;
}

#why-peru-summit .tour-why-diff-button:not(.collapsed) .tour-why-diff-number {
    background-color: #cfd5d6;
}

#why-peru-summit .tour-why-diff-button-title {
    color: #263238;
    font-size: 0.94rem;
}

/* The chevron sits in a defined target that remains visible in every state. */
#why-peru-summit .tour-why-diff-chevron {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    margin-left: 1rem;
    border-radius: 7px;
    background-color: #e7ebeb;
    color: #374151;
}

/* Expanded copy remains on a clean reading surface within the accordion item. */
#why-peru-summit .tour-why-diff-body {
    padding: 0.15rem 1.1rem 1.25rem 4.15rem !important;
    background-color: #ffffff;
}

#why-peru-summit .tour-why-diff-body p {
    max-width: 75ch;
    color: #354c50;
    font-size: 0.92rem;
}

/* Responsive adjustments for mobile devices */
@media (max-width: 767.98px) {
    .tour-why-diff-card {
        padding: 1.35rem 1.15rem;
    }
    .tour-why-diff-button {
        padding: 1rem 0 !important;
    }
    .tour-why-diff-button-title {
        font-size: 0.88rem;
    }

    /* Mobile keeps the distinguished section compact and the bulk action easy to tap. */
    #why-peru-summit.tour-why-diff-card {
        padding: 1.4rem 1rem;
    }

    #why-peru-summit .tour-why-diff-title {
        font-size: 1.45rem;
    }

    #why-peru-summit .tour-why-diff-toggle-all {
        width: 100%;
    }

    #why-peru-summit .tour-why-diff-button {
        padding: 0.85rem !important;
    }

    #why-peru-summit .tour-why-diff-button-copy {
        grid-template-columns: 2rem minmax(0, 1fr);
        gap: 0.7rem;
    }

    #why-peru-summit .tour-why-diff-number {
        width: 2rem;
        height: 2rem;
    }

    #why-peru-summit .tour-why-diff-chevron {
        margin-left: 0.65rem;
    }

    #why-peru-summit .tour-why-diff-body {
        padding: 0.15rem 0.9rem 1.1rem 3.55rem !important;
    }
}

/* ==========================================================================
   Green Engage - Eco-Friendly & Sustainable Tourism Banner
   ========================================================================== */

/* ==========================================================================
   Tour Green Engage Banner - Sustainable & Eco-friendly Travel Section
   ========================================================================== */

/* The Green Engage card uses the requested light brown paper tone and a restrained central contact shadow. */
.tour-green-engage-card,
.tour-itinerary-main > .tour-green-engage-card {
    --tour-green-paper: #fbf9f2;
    --tour-green-corner-shadow: rgb(0 0 0 / 26%);
    --tour-green-corner-lift: 14px;
    position: relative;
    isolation: isolate;
    padding: 0;
    margin: 0 0 2.25rem;
    background: transparent;
    border-radius: 7px !important;
    overflow: visible;
}

/* The opaque paper surface covers the inner portion of both shadows so they remain behind the card. */
.tour-green-engage-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: var(--tour-green-paper);
    border-radius: inherit;
    box-shadow: 0 1px 3px rgb(0 0 0 / 8%);
    pointer-events: none;
}

/* The corner shadows overlap the card from a lower layer, so they read as depth behind the paper. */
.tour-green-engage-card::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: 1%;
    bottom: calc(-1 * var(--tour-green-corner-lift));
    left: 1%;
    height: calc(2 * var(--tour-green-corner-lift));
    background:
        radial-gradient(ellipse, var(--tour-green-corner-shadow), transparent 70%) left center / 48% 100% no-repeat,
        radial-gradient(ellipse, var(--tour-green-corner-shadow), transparent 70%) right center / 48% 100% no-repeat;
    filter: blur(3px);
    pointer-events: none;
}

/* The banner follows the exact 503:1897 width relationship of the supplied background artwork. */
.tour-green-engage-layout {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(150px, 503fr) minmax(0, 1897fr);
    align-items: stretch;
    min-height: 100%;
    overflow: hidden;
    border-radius: inherit;
}

/* The narrow botanical panel integrates the existing Green Engage logo with the first supplied image. */
.tour-green-engage-brand-panel {
    display: grid;
    align-items: start;
    justify-items: center;
    min-width: 0;
    padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1rem, 2vw, 1.5rem);
    background-color: #eff3d7;
    background-image: url('../images/green_1.jpg');
    background-position: center;
    background-size: cover;
}

/* The wide reading panel uses the companion botanical image as a quiet editorial surface. */
.tour-green-engage-story-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(1.75rem, 3vw, 2.5rem);
    background-color: var(--tour-green-paper);
    background-image: url('../images/green_2.png');
    background-position: center;
    background-size: cover;
}

/* The content stack separates the lead, supporting copy and closing statement. */
.tour-green-engage-content {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 1.15rem;
    z-index: 1;
}

/* The editorial heading recreates the two-level hierarchy from the supplied reference. */
.tour-green-engage-header {
    position: relative;
    z-index: 1;
    margin-bottom: clamp(2rem, 3vw, 2.75rem);
}

/* The title wrapper keeps both display lines together as one semantic heading. */
.tour-green-engage-card .tour-green-engage-title {
    margin: 0;
    text-transform: uppercase;
}

/* The first title line uses the ecological green, italic angle and open tracking from the reference. */
.tour-green-engage-title-accent {
    display: block;
    color: #718c2c;
    font-family: var(--font-heading);
    font-size: clamp(0.9rem, 1.4vw, 1.1rem);
    font-style: italic;
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.15;
}

/* The principal statement carries the larger warm-brown editorial scale. */
.tour-green-engage-title-main {
    display: block;
    margin-top: 0.8rem;
    color: #92704e;
    font-family: var(--font-body);
    font-size: clamp(1.5rem, 2.05vw, 1.95rem);
    font-weight: 400;
    letter-spacing: 0.015em;
    line-height: 1.08;
}

/* Supporting copy uses a deep warm brown for accessible reading on the light paper. */
.tour-green-engage-content p {
    margin: 0;
    color: #45423d;
    font-family: var(--font-body);
    font-size: 0.75rem;
    line-height: 1.58;
}

/* The three body paragraphs follow the equal editorial columns shown in the supplied layout. */
.tour-green-engage-copy-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1rem, 2vw, 1.5rem);
}

/* The opening statement is a compact black uppercase anchor above the reading columns. */
.tour-green-engage-content .tour-green-engage-lead {
    color: #1f211d;
    font-size: clamp(0.82rem, 1vw, 0.9rem);
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.4;
}

/* The closing thought sits low in the composition with the light italic treatment from the reference. */
.tour-green-engage-content .tour-green-engage-closing {
    margin-top: auto;
    padding-top: clamp(1.75rem, 3vw, 2.75rem);
    color: #343630;
    font-size: clamp(0.9rem, 1.3vw, 1.05rem);
    font-style: italic;
    font-weight: 400;
    line-height: 1.35;
}

/* The bare Green Engage logo remains centered in the narrow botanical column. */
.tour-green-engage-media {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    z-index: 1;
}

/* The Green Engage artwork is rendered as the original image without borders or shadows. */
.tour-green-engage-img {
    width: 120px;
    height: auto;
    object-fit: contain;
    display: block;
}

/* Responsive styles for tablet and mobile devices */
@media (max-width: 767.98px) {
    .tour-green-engage-card,
    .tour-itinerary-main > .tour-green-engage-card {
        padding: 0;
        text-align: left;
    }

    .tour-green-engage-layout {
        grid-template-columns: 1fr;
    }

    .tour-green-engage-brand-panel {
        min-height: 11rem;
        padding: 1.5rem;
        background-position: center 72%;
    }

    .tour-green-engage-story-panel {
        padding: 1.35rem 1.15rem;
        background-position: center bottom;
    }

    .tour-green-engage-header {
        margin-bottom: 1.5rem;
    }

    .tour-green-engage-title-accent {
        font-size: 0.8rem;
        letter-spacing: 0.1em;
    }

    .tour-green-engage-title-main {
        margin-top: 0.6rem;
        font-size: 1.4rem;
        line-height: 1.12;
    }

    .tour-green-engage-copy-grid {
        grid-template-columns: 1fr;
        gap: 1.15rem;
    }

    .tour-green-engage-content p {
        font-size: 0.8rem;
        line-height: 1.6;
    }

    .tour-green-engage-content .tour-green-engage-closing {
        margin-top: 0.5rem;
        padding-top: 1rem;
        font-size: 0.92rem;
    }

    .tour-green-engage-img {
        width: 90px;
    }
}

/* Train selection Swiper layers service information over the image and uses thumbnail navigation. */
.tour-train-selection {
    --train-accent: var(--tour-primary);
    margin: 0 0 2rem;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: #ffffff;
}

/* Train selection header matching tour-departures-heading style */
.tour-train-heading-wrap {
    margin-bottom: 1.4rem;
    align-items: center;
}

.tour-train-heading-wrap .tour-train-heading-title {
    margin: 0;
    color: var(--tour-dark, #0f172a);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.2;
    text-transform: uppercase;
}

.tour-train-heading-wrap .tour-train-controls {
    margin-bottom: 0;
    flex-shrink: 0;
}
/* Train selection stage: height increased by 30% (520px -> 676px) with 7px rounded corners */
.tour-train-stage { position: relative; border-radius: 7px !important; }
.tour-train-main-swiper { overflow: hidden; background: #111827; border-radius: 7px !important; }
.tour-train-slide { position: relative; height: 676px; min-height: 676px; overflow: hidden; border-radius: 7px !important; }
.tour-train-slide > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 900ms ease; }
/* Train slide overlay gradient: covers only the bottom 50% of the slide */
.tour-train-slide::after {
    position: absolute;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    height: 50%;
    z-index: 1;
    background: linear-gradient(
        to top,
        rgba(6, 10, 18, 0.96) 0%,
        rgba(6, 10, 18, 0.78) 40%,
        rgba(6, 10, 18, 0.22) 75%,
        rgba(6, 10, 18, 0) 100%
    );
    pointer-events: none;
    content: "";
}
.tour-train-slide.swiper-slide-active > img { transform: scale(1.025); }

/* The overlay container positioned in the bottom 50% of the slide */
.tour-train-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    display: flex;
    height: 50%;
    min-height: 50%;
    flex-direction: column;
    justify-content: flex-end;
    width: min(72%, 700px);
    padding: 1.5rem 2.25rem 7.25rem;
    color: var(--tour-white);
}
.tour-train-copy { max-width: 580px; }

/* The train name uses the established yellow accent and outranks the secondary slide title. */
.tour-train-kicker {
    display: block;
    margin-bottom: 0.4rem;
    color: #f59e0b;
    font-size: clamp(2rem, 3.2vw, 2.5rem);
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
}
.tour-train-selection .tour-train-title { margin: 0 0 0.5rem; color: var(--tour-white); font-size: clamp(1.35rem, 2.2vw, 1.85rem); font-weight: 500; letter-spacing: -0.03em; line-height: 1.15; }
.tour-train-copy p { max-width: 540px; margin: 0; color: rgba(255,255,255,0.84); font-size: 0.84rem; line-height: 1.5; }
.tour-train-features { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; margin-top: 1.1rem; background: transparent; }
.tour-train-feature { display: grid; gap: 0.15rem; min-width: 0; padding: 0.6rem 0.7rem; border: 1px solid rgba(255,255,255,0.32); border-radius: 7px !important; background: rgba(11, 17, 28, 0.58); backdrop-filter: blur(7px); }
.tour-train-feature i { margin-bottom: 0.15rem; color: #ff6a3d; font-size: 0.88rem; }
.tour-train-feature strong { color: var(--tour-white); font-size: 0.7rem; line-height: 1.25; }
.tour-train-feature span { color: rgba(255,255,255,0.68); font-size: 0.62rem; line-height: 1.35; }
.tour-train-notice { display: flex; align-items: center; gap: 0.55rem; align-self: flex-start; margin: 0.75rem 0 0; padding: 0.35rem 0.5rem; border: 0; border-radius: 7px !important; background: transparent; color: #ffffff; }
.tour-train-notice > i { color: #ffffff; font-size: 0.82rem; }
.tour-train-notice > span { display: grid; gap: 0.1rem; }
.tour-train-notice strong { color: #ffffff; font-size: 0.72rem; }

/* Thumbnail cards: compact height and spacing */
.tour-train-thumbs { position: absolute; right: clamp(1rem, 3vw, 2.25rem); bottom: 1rem; left: clamp(1rem, 3vw, 2.25rem); z-index: 4; }
.tour-train-thumbs .swiper-slide { display: grid; grid-template-columns: 3.8rem minmax(0, 1fr); gap: 0.65rem; min-height: 58px; align-items: center; padding: 0.45rem; border: 1px solid rgba(255,255,255,0.2); border-radius: 7px !important; background: rgba(7,11,18,0.7); color: rgba(255,255,255,0.78); cursor: pointer; backdrop-filter: blur(9px); transition: border-color 220ms ease, background-color 220ms ease, color 220ms ease; }
.tour-train-thumbs .swiper-slide:hover { border-color: rgba(241,1,0,0.72); background: rgba(7,11,18,0.76); color: rgba(255,255,255,0.9); }
.tour-train-thumbs .swiper-slide-thumb-active { border-color: rgba(241,1,0,0.72); background: rgba(7,11,18,0.82); color: var(--tour-white); }
.tour-train-thumbs img { width: 3.8rem; height: 2.7rem; border-radius: 5px; object-fit: cover; }
.tour-train-thumbs span { display: grid; gap: 0.15rem; min-width: 0; }
.tour-train-thumbs strong { color: inherit; font-size: 0.69rem; font-weight: 600; line-height: 1.2; }
.tour-train-thumbs small { color: rgba(255,255,255,0.58); font-size: 0.58rem; font-weight: 400; line-height: 1.25; }
.tour-train-thumbs .swiper-slide:hover small, .tour-train-thumbs .swiper-slide-thumb-active small { color: rgba(255,255,255,0.7); }
/* Train navigation buttons with 7px border radius */
.tour-train-controls { display: flex; gap: 0.45rem; justify-content: flex-end; margin-bottom: 0.65rem; }
.tour-train-prev, .tour-train-next { display: inline-flex; width: 2.2rem; height: 2.2rem; align-items: center; justify-content: center; border: 1px solid #dfe2e6; border-radius: 7px !important; background: #ffffff; color: #4f5661; font-size: 0.78rem; transition: background-color 200ms ease, border-color 200ms ease, color 200ms ease; }
.tour-train-prev:hover, .tour-train-next:hover { border-color: var(--train-accent); background: #ffffff; color: var(--train-accent); }
.tour-train-prev.swiper-button-disabled, .tour-train-next.swiper-button-disabled { opacity: 0.35; cursor: not-allowed; }

/* Train slider responsive layout */
@media (max-width: 991.98px) {
    .tour-train-overlay { width: 86%; }
    .tour-train-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .tour-train-slide { height: 820px; min-height: 820px; }
    .tour-train-slide::after {
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        height: 50%;
        background: linear-gradient(to top, rgba(6, 10, 18, 0.96) 0%, rgba(6, 10, 18, 0.74) 50%, rgba(6, 10, 18, 0) 100%);
    }
    .tour-train-overlay {
        height: 50%;
        min-height: 50%;
        justify-content: flex-end;
        width: 100%;
        padding: 1.25rem 1rem 10.5rem;
    }
    .tour-train-copy p { font-size: 0.8rem; line-height: 1.5; }
    .tour-train-features { margin-top: 0.95rem; gap: 0.45rem; }
    .tour-train-feature { padding: 0.55rem 0.65rem; }
    .tour-train-thumbs { right: 0.65rem; bottom: 0.65rem; left: 0.65rem; }
    .tour-train-thumbs .swiper-slide { grid-template-columns: 1fr; min-height: 105px; align-content: start; padding: 0.35rem; }
    .tour-train-thumbs img { width: 100%; height: 3.6rem; }
    .tour-train-thumbs strong { font-size: 0.63rem; }
    .tour-train-thumbs small { font-size: 0.54rem; }
}

/* Reduced motion prevents train image and control transitions when requested. */
@media (prefers-reduced-motion: reduce) {
    .tour-train-selection *, .tour-train-selection *::after { animation: none !important; transition: none !important; }
    .tour-train-slide.swiper-slide-active > img { transform: none; }
}

.tour-services-wide {
    grid-column: 1 / -1;
}

/* Tour Inclusions and Exclusions (Minimalist Split Card)
-------------------------------------------------- */

/* Tour Inclusions & Exclusions section
-------------------------------------------------- */

.tour-inclusions-section {
    margin-bottom: 2.75rem;
}

/* Section header matching tour-departures-heading style */
.tour-inclusions-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.4rem;
}

.tour-inclusions-eyebrow {
    display: block;
    margin-bottom: 0.35rem;
    color: #64748b;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.tour-inclusions-title {
    margin: 0;
    color: var(--tour-dark, #0f172a);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.2;
    text-transform: uppercase;
}

/* Description paragraph directly underneath the title matching tour-departures-heading */
.tour-inclusions-desc {
    margin-top: 0.45rem;
    margin-bottom: 0;
    max-width: 44rem;
    color: #64748b;
    font-size: 0.84rem;
    line-height: 1.55;
}

/* 2-column grid layout for Included and Excluded cards */
.tour-inclusions-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: stretch;
}

/* Individual column cards with 7px rounded corners and subtle hover */
.tour-inclusions-col {
    position: relative;
    padding: 1.75rem 1.65rem;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 7px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.02);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.tour-inclusions-col:hover {
    border-color: #cbd5e1;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
    transform: translateY(-1px);
}

.tour-inclusions-col-included:hover {
    border-color: rgba(16, 185, 129, 0.35);
}

.tour-inclusions-col-excluded:hover {
    border-color: rgba(241, 1, 0, 0.28);
}

/* Inclusions Column Header & Typography styled directly from the container */
.tour-inclusions-col h3 {
    margin: 0 0 1.25rem;
    padding-bottom: 0.95rem;
    border-bottom: 1px solid #f1f5f9;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.35;
}
/* Inclusions & Exclusions list styled directly from container */
.tour-inclusions-col ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

/* Individual list item styled with clean spacing */
.tour-inclusions-col li {
    position: relative;
    display: flex;
    align-items: flex-start;
    padding: 0 0.65rem 0 2.15rem;
    color: #334155;
    font-size: 0.92rem;
    line-height: 1.55;
    border-radius: 7px !important;
}

/* Bullet icon box styled via ::before pseudo-element */
.tour-inclusions-col li::before {
    position: absolute;
    top: 0.52rem;
    left: 0.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.3rem;
    height: 1.3rem;
    border-radius: 7px !important;
    font-family: "Font Awesome 7 Free", "Font Awesome 6 Free", "FontAwesome", sans-serif;
    font-weight: 900;
    font-size: 0.65rem;
    line-height: 1;
    flex-shrink: 0;
    transition: color 0.2s ease, background-color 0.2s ease;
}

/* Included column: Green checkmark bullet */
.tour-inclusions-col-included li::before {
    content: "\f00c";
    background-color: #ecfdf5;
    color: #059669;
}

.tour-inclusions-col-included li:hover::before {
    background-color: #d1fae5;
    color: #047857;
}

/* Excluded column: Red xmark bullet */
.tour-inclusions-col-excluded li::before {
    content: "\f00d";
    background-color: #fef2f2;
    color: #dc2626;
}

.tour-inclusions-col-excluded li:hover::before {
    background-color: #fee2e2;
    color: #b91c1c;
}

/* What to Bring uses the established light-gray surface to separate practical packing details. */
.tour-packing-card,
.tour-itinerary-main > .tour-packing-card {
    padding: clamp(1.5rem, 2.5vw, 2.25rem);
    background-color: var(--tour-light, #f7f7f5);
    border: 1px solid #e2e8f0;
    border-radius: 7px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.02);
    margin-bottom: 2.75rem;
}

.tour-packing-title {
    margin: 0 0 0.65rem;
    color: var(--tour-dark, #0f172a);
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.2;
}

.tour-packing-desc {
    margin-bottom: 1.15rem;
    color: #475569;
    font-size: 0.92rem;
    line-height: 1.55;
}

/* Minimalist list: strictly 3 columns, clean spacing without hover boxes */
.tour-packing-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 1.25rem;
    row-gap: 0.35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.tour-packing-list li {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.25rem 0;
    background: none;
    border: none;
    color: #334155;
    font-size: 0.88rem;
    font-weight: 500;
    line-height: 1.45;
}

.tour-packing-list li::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #94a3b8;
    flex-shrink: 0;
}

/* Suggested reading editorial card pairs the book cover image with trip-specific copy. */
.tour-reading-list {
    display: grid;
    grid-template-columns: minmax(250px, 0.82fr) minmax(0, 1.18fr);
    margin-top: 2.75rem;
    margin-bottom: 2.75rem;
    overflow: hidden;
    border-radius: 7px !important;
    background-color: #fff8ee;
    box-shadow: 0 12px 32px rgba(35, 25, 18, 0.1);
}

/* The media panel lets the image's natural 3:2 ratio define the desktop card height. */
.tour-reading-list-media {
    min-width: 0;
    background-color: #eeeae2;
}

.tour-reading-list-image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: contain;
    border-radius: 7px !important;
}

/* Compact desktop typography keeps the copy within the image-defined card height. */
.tour-reading-list-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 1.25rem 1.55rem;
}

.tour-reading-list-heading {
    margin-bottom: 0.6rem;
}

.tour-reading-list-heading h2 {
    margin: 0;
    color: var(--tour-dark, #171717);
    font-size: clamp(1.2rem, 1.7vw, 1.42rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.tour-reading-list-content p {
    max-width: 68ch;
    margin: 0;
    color: #554f49;
    font-size: 0.76rem;
    line-height: 1.62;
}

/* The inline title link remains visibly discoverable within the long-form copy. */
.tour-reading-list-content p a {
    color: #b60000;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
    transition: color 0.2s ease;
}

.tour-reading-list-content p a:hover,
.tour-reading-list-content p a:focus-visible {
    color: #171717;
}

/* The final action reinforces the destination without competing with the inquiry form. */
.tour-reading-list-action {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 0.8rem;
    color: #171717;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.055em;
    line-height: 1.3;
    text-transform: uppercase;
    text-decoration: none;
}

.tour-reading-list-action i {
    color: var(--tour-primary, #f10100);
    transition: transform 0.22s ease;
}

.tour-reading-list-action:hover,
.tour-reading-list-action:focus-visible {
    color: #b60000;
}

.tour-reading-list-action:hover i,
.tour-reading-list-action:focus-visible i {
    transform: translateX(4px);
}

.tour-reading-list-content a:focus-visible {
    outline: 3px solid rgba(241, 1, 0, 0.28);
    outline-offset: 4px;
}

/* Suggested reading stacks image-first on tablets and phones for easy scanning. */
@media (max-width: 767.98px) {
    .tour-reading-list {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .tour-reading-list-image {
        height: auto;
        aspect-ratio: 3 / 2;
    }

    .tour-reading-list-content {
        padding: 1.5rem 1.25rem 1.75rem;
    }

    /* Mobile restores a larger reading size because content sits below the image. */
    .tour-reading-list-heading {
        margin-bottom: 0.9rem;
    }

    .tour-reading-list-heading h2 {
        font-size: 1.45rem;
    }

    .tour-reading-list-content p {
        font-size: 0.9rem;
        line-height: 1.72;
    }

    .tour-reading-list-action {
        margin-top: 1.1rem;
        font-size: 0.74rem;
    }
}

/* Reduced motion keeps reading-list interactions still when motion is disabled. */
@media (prefers-reduced-motion: reduce) {
    .tour-reading-list-content a,
    .tour-reading-list-action i {
        transition: none;
    }
}

/* Contact booking form
-------------------------------------------------- */

.tour-contact-form-card {
    padding: 1rem;
    border: 1px solid var(--tour-border);
    background-color: var(--tour-white);
}

.tour-contact-form-title-group {
    margin: 0 0 0.75rem;
}

.tour-contact-form-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.6rem 1.5rem;
}

.tour-contact-grid-item {
    min-width: 0;
}

.tour-contact-third {
    grid-column: span 4;
}

.tour-contact-half {
    grid-column: span 6;
}

.tour-contact-full {
    grid-column: 1 / -1;
}

.tour-contact-spacer {
    margin-top: 0.15rem;
}

.tour-contact-group-title {
    margin: 0;
    color: var(--tour-dark);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    line-height: 1.25;
    text-transform: uppercase;
}

.tour-contact-field {
    display: grid;
    gap: 0.25rem;
}
.tour-contact-control-wrap {
    position: relative;
}

.tour-contact-control-wrap i {
    position: absolute;
    top: 50%;
    left: 0.72rem;
    z-index: 2;
    color: #9aa2af;
    font-size: 0.84rem;
    transform: translateY(-50%);
    transition:
            color 0.2s ease,
            transform 0.2s ease;
    pointer-events: none;
}

.tour-contact-textarea-wrap i {
    top: 0.65rem;
    transform: none;
}

/* Reduced interior spacing and compact height for tour contact controls */
.tour-contact-form :is(.tour-contact-input, .tour-contact-select),
.tour-contact-field :is(.tour-contact-input, .tour-contact-select) {
    width: 100%;
    min-height: 2.35rem;
    padding: 0.35rem 0.65rem 0.35rem 2.05rem;
    border: 1px solid #dfe4ea;
    border-radius: var(--tour-radius);
    background-color: #f8f9fb;
    color: var(--tour-dark);
    font-size: 0.85rem;
    font-weight: 400;
    line-height: 1.35;
    transition:
            background-color 0.2s ease,
            border-color 0.2s ease,
            box-shadow 0.2s ease;
}

.tour-contact-form .tour-contact-textarea,
.tour-contact-field .tour-contact-textarea {
    width: 100%;
    min-height: 5.5rem;
    padding: 0.45rem 0.65rem 0.45rem 2.05rem;
    border: 1px solid #dfe4ea;
    border-radius: var(--tour-radius);
    background-color: #f8f9fb;
    color: var(--tour-dark);
    font-size: 0.85rem;
    font-weight: 400;
    line-height: 1.35;
    resize: vertical;
    transition:
            background-color 0.2s ease,
            border-color 0.2s ease,
            box-shadow 0.2s ease;
}

.tour-contact-select {
    appearance: none;
    padding-right: 2rem;
    background-image:
            linear-gradient(45deg, transparent 50%, #2f3540 50%),
            linear-gradient(135deg, #2f3540 50%, transparent 50%);
    background-position:
            calc(100% - 1.2rem) 50%,
            calc(100% - 0.95rem) 50%;
    background-size: 0.38rem 0.38rem, 0.38rem 0.38rem;
    background-repeat: no-repeat;
}

.tour-contact-input::placeholder,
.tour-contact-textarea::placeholder {
    color: transparent;
}

.tour-contact-control-wrap:hover i,
.tour-contact-input:focus + i,
.tour-contact-select:focus + i {
    color: var(--tour-primary);
    transform: translateY(-50%) translateX(2px);
}

.tour-contact-textarea-wrap:hover i,
.tour-contact-textarea:focus + i {
    color: var(--tour-primary);
    transform: translateX(2px);
}

.tour-contact-field :is(.tour-contact-input, .tour-contact-select, .tour-contact-textarea):is(:hover, :focus) {
    border-color: rgba(241, 1, 0, 0.5);
    background-color: var(--tour-white);
    box-shadow: 0 12px 26px rgba(17, 24, 39, 0.06);
    outline: 0;
}

.tour-contact-checks {
    display: grid;
    gap: 0.22rem;
    margin-top: 0.35rem;
}

.tour-contact-check {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.4rem;
    align-items: center;
    color: #2f3540;
    font-size: 0.84rem;
    font-weight: 500;
    line-height: 1.35;
}

.tour-contact-check input {
    width: 1rem;
    height: 1rem;
    margin: 0;
    border: 1px solid #dfe4ea;
    border-radius: var(--tour-radius);
    accent-color: var(--tour-primary);
}

.tour-contact-submit {
    display: inline-flex;
    gap: 0.55rem;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    padding: 0.55rem 0.95rem;
    border: 1px solid var(--tour-primary);
    border-radius: var(--tour-radius);
    background-color: var(--tour-primary);
    color: var(--tour-white);
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
    transition:
            background-color 0.2s ease,
            border-color 0.2s ease,
            transform 0.2s ease;
}

.tour-contact-submit:hover,
.tour-contact-submit:focus {
    border-color: var(--tour-primary-dark);
    background-color: var(--tour-primary-dark);
    color: var(--tour-white);
    transform: translateY(-2px);
}




/* Responsive
-------------------------------------------------- */

@media (min-width: 1400px) {
    .container {
        max-width: 1440px;
    }
}

@media (max-width: 1199.98px) {
    .tour-hero-details-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1.15rem 2rem;
    }
}

@media (max-width: 991.98px) {
    .tour-hero-slider-shell {
        aspect-ratio: auto;
        min-height: 560px;
    }

    .tour-contact-form-grid {
        grid-template-columns: 1fr;
    }

    .tour-contact-third,
    .tour-contact-half,
    .tour-contact-full {
        grid-column: 1 / -1;
    }

    .tour-main,
    .tour-extra {
        padding: 4rem 0;
    }


    .tour-booking-sticky {
        position: static;
        margin-top: 1rem;
        margin-right: auto;
        margin-left: auto;
    }

    .tour-section-header {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

}

@media (max-width: 767.98px) {
    /* Trip detail accordions stack into one column on narrow screens. */
    .tour-trip-details-grid {
        grid-template-columns: 1fr;
    }

    .tour-hero {
        background-color: var(--tour-dark);
    }

    .tour-hero-slider-shell {
        aspect-ratio: auto;
        min-height: auto;
    }

    .tour-hero-content {
        padding: 1.5rem 1rem 1rem;
    }

    .tour-hero-image,
    .tour-hero-video {
        opacity: 0.82;
    }

    .tour-hero-details {
        padding: 0.65rem 0.85rem;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .tour-hero-details-grid {
        display: flex;
        gap: 1rem;
        width: max-content;
        min-width: 100%;
    }

    .tour-hero-detail {
        gap: 0.2rem 0.5rem;
        width: 9rem;
        flex: 0 0 auto;
    }

    .tour-hero-inner {
        max-width: 100%;
    }

    .tour-hero-overlay {
        background-color: rgba(23, 23, 23, 0.12);
        box-shadow: inset 0 -30rem 14rem -11rem rgba(0, 0, 0, 0.98);
    }

    .tour-title {
        margin-bottom: 0;
        font-size: clamp(1.8rem, 6vw, 2.5rem);
        line-height: 1.08;
    }

    .tour-breadcrumb {
        margin-bottom: 1rem;
    }

    .tour-main,
    .tour-extra {
        padding: 3.2rem 0;
    }

    .tour-floating-nav-inner {
        display: flex;
        min-height: auto;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.5rem 0;
    }

    .tour-floating-nav-left {
        flex: 1 1 auto;
        min-width: 0;
        justify-content: flex-start;
        margin-left: 0;
        margin-right: auto;
        padding-left: 0;
        text-align: left;
    }

    .tour-floating-links {
        display: flex;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0.25rem 0;
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 0.2rem;
    }

    .tour-floating-links::-webkit-scrollbar {
        display: none;
    }

    .tour-floating-link {
        flex: 0 0 auto;
        min-height: 32px;
        padding: 0.35rem 0.75rem;
        font-size: 0.72rem;
        gap: 0.35rem;
        white-space: nowrap;
    }

    .tour-floating-link-icon {
        font-size: 0.72rem;
    }

    .tour-floating-more-indicator {
        width: 0.85rem;
        height: 0.85rem;
    }

    .tour-floating-dot {
        width: 3px;
        height: 3px;
    }

    .tour-floating-chevron {
        font-size: 0.65rem;
    }

    .tour-floating-dropdown {
        top: calc(100% + 0.35rem);
        left: auto;
        right: 0;
        min-width: 175px;
        box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18);
    }

    .tour-floating-booking {
        display: block;
        white-space: nowrap;
    }

    .tour-floating-button {
        min-height: 2.9rem;
        padding: 0.7rem 0.65rem;
        font-size: 0.95rem;
    }

    .tour-floating-contact {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .tour-floating-book {
        flex: 0 0 auto;
        min-height: 34px;
        padding: 0.4rem 0.85rem;
        font-size: 0.75rem;
        gap: 0.4rem;
        white-space: nowrap;
    }

    .tour-inclusions-heading {
        display: grid;
        gap: 0.65rem;
    }

    .tour-inclusions-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }


    .tour-customer-reviews {
        padding: 1.6rem;
    }

}

@media (max-width: 575.98px) {
    .tour-hero-content {
        min-height: 0;
        padding: 1.25rem 0.85rem 0.85rem;
    }

    .tour-title {
        font-size: 1.4rem;
        letter-spacing: -0.03em;
    }

    .tour-hero-inner {
        max-width: 100%;
    }

    .tour-main,
    .tour-extra {
        padding: 2.8rem 0;
    }

    .tour-itinerary-details-grid {
        grid-template-columns: 1fr;
    }

    .tour-itinerary-heading-row {
        display: grid;
        gap: 0.8rem;
    }

    .tour-itinerary-expand {
        justify-self: start;
    }

    .tour-itinerary-button {
        padding: 1.05rem 0.9rem;
    }

    .tour-itinerary-body {
        padding: 1.25rem 1.1rem;
    }

    .tour-itinerary-day {
        display: flex;
        gap: 0.6rem;
    }

    .tour-itinerary-detail,
    .tour-itinerary-details-grid .tour-itinerary-detail {
        grid-template-columns: 2.25rem minmax(0, 1fr);
        padding: 0.75rem 0.85rem;
    }

    .tour-contact-form-card {
        padding: 0.9rem;
    }

    .tour-contact-input,
    .tour-contact-select {
        min-height: 2.45rem;
    }

    .tour-contact-textarea {
        min-height: 6rem;
    }

}

/* Single-tour mobile refinement improves hierarchy, touch comfort, and safe viewport spacing. */
@media (max-width: 767.98px) {
    /* Reserve the safe-area space used by the tour-specific booking action. */
    body.tour-single-page {
        padding-bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px));
    }

    /* The compact header keeps every quick action at an accessible touch size on narrow phones. */
    .tour-single-page .csp-brand-logo {
        width: clamp(6rem, 30vw, 7.25rem);
    }

    .tour-single-page .csp-mobile-quick-actions a,
    .tour-single-page .csp-navbar-toggle {
        width: 2.75rem;
        height: 2.75rem;
    }

    /* The mobile hero becomes a destination-led opening instead of a shallow image strip. */
    .tour-single-page .tour-hero-slider-shell {
        width: 100%;
        max-width: none;
        min-height: 35rem;
        min-height: clamp(35rem, 78svh, 42.5rem);
        padding-right: 0;
        padding-left: 0;
    }

    .tour-single-page .tour-hero-content {
        padding: clamp(1.35rem, 5vw, 1.75rem) clamp(1rem, 4.5vw, 1.35rem) 1rem;
    }

    .tour-single-page .tour-title {
        max-width: 16ch;
        font-size: clamp(2rem, 9vw, 2.65rem);
        line-height: 1.04;
        text-wrap: balance;
    }

    .tour-single-page .tour-hero-overlay {
        background-color: rgba(23, 23, 23, 0.1);
        box-shadow: inset 0 -32rem 15rem -11rem rgba(0, 0, 0, 0.98);
    }

    .tour-single-page .tour-hero-image,
    .tour-single-page .tour-hero-video {
        object-position: center;
    }

    /* Horizontal hero facts remain readable and snap naturally while swiping. */
    .tour-single-page .tour-hero-details {
        padding: 0.85rem 1rem;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .tour-single-page .tour-hero-details::-webkit-scrollbar {
        display: none;
    }

    .tour-single-page .tour-hero-detail {
        width: 10.5rem;
        scroll-snap-align: start;
    }

    .tour-single-page .tour-hero-detail p {
        font-size: 0.85rem;
    }

    /* Mobile sections use a tighter outer rhythm while retaining generous internal grouping. */
    .tour-single-page .tour-main,
    .tour-single-page .tour-extra {
        padding: 2.25rem 0;
    }

    .tour-single-page .tour-itinerary-main > section {
        margin-bottom: 2rem;
    }

    .tour-single-page .tour-itinerary-title {
        font-size: clamp(1.75rem, 8vw, 2.15rem);
        line-height: 1.08;
        text-wrap: balance;
    }

    .tour-single-page :is(
        .tour-inclusions-title,
        .tour-departures-heading h2,
        .tour-services-wide h2,
        .tour-train-heading-wrap .tour-train-heading-title
    ) {
        font-size: clamp(1.35rem, 6.5vw, 1.65rem);
        line-height: 1.2;
        text-wrap: balance;
    }

    .tour-single-page :is(
        .tour-inclusions-desc,
        .tour-departures-heading p,
        .tour-packing-desc,
        .tour-lodging-body p
    ) {
        font-size: 0.95rem;
        line-height: 1.65;
    }

    .tour-single-page :is(
        .tour-customer-reviews,
        .tour-inclusions-col,
        .tour-departure-controls,
        .tour-why-diff-card,
        .tour-packing-card,
        .tour-lodging-card
    ) {
        padding: 1.25rem;
    }

    /* Optional experiences preserve the current visual language with mobile-sized insets. */
    .tour-single-page .tour-extend-experience {
        padding: clamp(1rem, 4vw, 1.25rem);
    }

    .tour-single-page .tour-extend-heading {
        gap: 1rem;
        margin-bottom: 1.25rem;
    }

    .tour-single-page .tour-extend-heading-copy h2 {
        font-size: clamp(1.65rem, 8vw, 2.1rem);
        line-height: 1.1;
        text-wrap: balance;
    }

    .tour-single-page .tour-extend-info {
        padding: 1.1rem;
    }

    /* What to Bring becomes a single readable checklist instead of narrow text columns. */
    .tour-single-page .tour-packing-list {
        grid-template-columns: 1fr !important;
        gap: 0.1rem;
    }

    .tour-single-page .tour-packing-list li {
        min-height: 2.25rem;
        padding: 0.4rem 0;
        font-size: 0.95rem;
    }

    /* Lodging removes Bootstrap's negative row gutter and enlarges its day controls for touch. */
    .tour-single-page .tour-lodging-grid {
        --bs-gutter-x: 0;
    }

    .tour-single-page .tour-lodging-tab {
        min-height: 2.75rem;
        padding: 0.5rem 0.55rem;
    }

    /* Hotel cards align their copy to the image edge and keep navigation easy to tap. */
    .tour-single-page .tour-hotel-card-overlay {
        left: 0;
    }

    .tour-single-page .tour-hotel-bg-img {
        height: clamp(15rem, 70vw, 18rem);
    }

    .tour-single-page :is(.tour-hotels-arrow, .tour-train-prev, .tour-train-next) {
        width: 2.75rem;
        height: 2.75rem;
    }

    .tour-single-page .tour-train-copy p {
        font-size: 0.9rem;
        line-height: 1.55;
    }

    /* Form controls use a 16px reading size to avoid iOS zoom and a comfortable touch height. */
    .tour-single-page .tour-itinerary-main > .tour-contact-form-card {
        padding: 1.25rem;
    }

    .tour-single-page .tour-contact-form-grid {
        row-gap: 0.9rem;
    }

    .tour-single-page .tour-contact-form :is(.tour-contact-input, .tour-contact-select),
    .tour-single-page .tour-contact-field :is(.tour-contact-input, .tour-contact-select) {
        min-height: 3rem;
        font-size: 1rem;
    }

    .tour-single-page .tour-contact-form .tour-contact-textarea,
    .tour-single-page .tour-contact-field .tour-contact-textarea {
        min-height: 8rem;
        font-size: 1rem;
    }

    .tour-single-page .tour-contact-submit {
        min-height: 3rem;
    }

    /* Primary mobile controls meet the 44px minimum touch target. */
    .tour-single-page :is(
        .tour-itinerary-expand,
        .tour-departure-months button,
        .tour-departure-book,
        .tour-floating-link,
        .tour-floating-book,
        .tour-floating-dropdown-item,
        .tour-inquiry-button,
        .tour-inquiry-review-footer a,
        .tour-reading-list-action,
        .tour-hotel-link,
        .tour-review-entry-toggle,
        .tour-reviews-link-all,
        .tour-reviews-btn-all,
        .tour-specialist-button,
        .tour-best-arrow,
        .tour-best-card-map-button,
        .tour-why-diff-toggle-all,
        .ps-footer-social-link
    ) {
        min-height: 2.75rem;
    }

    .tour-single-page .tour-departure-months {
        min-width: 36.875rem;
    }

    .tour-single-page :is(.tour-best-arrow, .ps-footer-social-link) {
        min-width: 2.75rem;
    }

    .tour-single-page .tour-breadcrumb a {
        display: inline-flex;
        min-height: 2.75rem;
        align-items: center;
    }

    .tour-single-page .tour-floating-nav-inner {
        gap: 0.5rem;
        padding: 0.35rem 0;
    }

    /* Only the tour CTA remains fixed, avoiding three competing mobile bottom bars. */
    .tour-single-page :is(.footer_flotante, .csp-floating-contact-bar) {
        display: none !important;
    }

    .tour-single-page .tour-floating-booking {
        padding-top: 0.75rem !important;
        padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px)) !important;
    }

    .tour-single-page .tour-floating-button {
        min-height: 3rem;
    }
}

/* Very narrow phones stack paired fields and reclaim card width without changing content order. */
@media (max-width: 359.98px) {
    .tour-single-page .tour-whatsapp-control {
        grid-template-columns: 1fr;
    }

    .tour-single-page :is(
        .tour-customer-reviews,
        .tour-inclusions-col,
        .tour-departure-controls,
        .tour-why-diff-card,
        .tour-packing-card,
        .tour-lodging-card
    ),
    .tour-single-page .tour-itinerary-main > .tour-contact-form-card {
        padding: 1rem;
    }
}

/* Blog category template styles */

.blog-category-hero {
            position: relative;
            overflow: hidden;
            background-color: var(--blog-dark);
        }

/* Home index
-------------------------------------------------- */

.home-page {
    background-color: var(--csp-white);
}


.home-page .csp-section-title {
    font-size: clamp(1.85rem, 3vw, 2.75rem);
    letter-spacing: 0;
    line-height: 1.12;
}

.home-page .csp-section-title span {
    color: var(--csp-primary);
}

.home-page .tour-best-card-title {
    font-size: 1.05rem;
    letter-spacing: 0;
}

.home-page .tour-review-title,
.home-reason-card h3,
.home-faq-title {
    letter-spacing: 0;
}

.home-section-head > p:not([class]),
.home-local-intro .container > p:not([class]) {
    margin: 0;
    color: var(--csp-text);
    line-height: 1.7;
}

.home-hero {
    min-height: 100vh;
    background-color: var(--csp-dark);
}

.home-hero .csp-internal-hero-image {
    height: 100vh;
    min-height: 100vh;
}

.home-hero .csp-internal-hero-content {
    min-height: 100vh;
}

.home-hero .csp-internal-hero-overlay {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.86) 0%, rgba(0, 0, 0, 0.56) 44%, rgba(0, 0, 0, 0.16) 100%);
}

.home-hero .csp-internal-title {
    max-width: 920px;
}

.home-hero .csp-internal-hero-text {
    max-width: 760px;
}

.home-feature-band {
    padding: clamp(1.8rem, 4vw, 3rem) 0;
}

.home-local-intro .container {
    max-width: 1120px;
}

.home-reason-card,
.home-review-card {
    border: 1px solid var(--csp-border);
    background-color: var(--csp-white);
}

.home-reason-card {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    padding: clamp(1.25rem, 2.3vw, 2rem);
    box-shadow: 0 18px 36px rgba(17, 24, 39, 0.05);
    transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

.reason-card-content {
    position: relative;
    z-index: 2;
}

.reason-bg-icon {
    position: absolute;
    right: -15px;
    bottom: -20px;
    font-size: 8rem !important;
    color: rgba(241, 1, 0, 0.09) !important;
    opacity: 0;
    transform: scale(0.6) rotate(-12deg);
    transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
    z-index: 1;
}

.home-reason-card:hover,
.home-reason-card:focus-within {
    border-color: rgba(241, 1, 0, 0.38);
    box-shadow: 0 24px 48px rgba(17, 24, 39, 0.1);
    transform: translateY(-5px);
}

.home-reason-card:hover .reason-bg-icon,
.home-reason-card:focus-within .reason-bg-icon {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

.home-reason-card .reason-main-icon {
    position: relative;
    display: inline-block;
    margin-bottom: 1.1rem;
    color: var(--csp-primary);
    font-size: 2rem;
    transition: transform 0.25s ease;
}

.home-reason-card:hover .reason-main-icon,
.home-reason-card:focus-within .reason-main-icon {
    transform: translateY(-2px) scale(1.06);
}

.home-reason-card h3 {
    margin: 0 0 0.7rem;
    color: var(--csp-dark);
    font-size: 1.15rem;
    font-weight: 500;
}

.home-reason-card p {
    margin: 0;
    color: var(--csp-text);
    line-height: 1.58;
}

.home-faq-title {
    margin: 0 0 1rem;
    color: var(--csp-dark);
    font-size: 1.25rem;
    font-weight: 500;
    text-align: left;
}

.home-faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.home-faq-accordion .accordion-item {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #e5e7eb;
    border-radius: 7px !important;
}

.home-faq-accordion .accordion-item:first-of-type {
    border-top: 1px solid #e5e7eb;
}

.home-faq-accordion .accordion-button {
    min-height: auto;
    padding: 1.15rem 0;
    background-color: transparent;
    color: var(--csp-dark, #000000);
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.4;
    box-shadow: none !important;
    border: none;
    transition: color 0.2s ease;
}

.home-faq-accordion .accordion-button:not(.collapsed) {
    background-color: transparent;
    color: var(--csp-primary, #f10100);
    box-shadow: none;
}

.home-faq-accordion .accordion-button:focus {
    box-shadow: none !important;
    background-color: transparent;
}

.home-faq-accordion .accordion-body {
    padding: 0 0 1.25rem 0;
    color: #4b5563;
    font-size: 0.92rem;
    line-height: 1.6;
    background-color: transparent;
}

.home-review-section {
    padding: clamp(3.5rem, 6vw, 5.5rem) 0;
}

.home-review-swiper {
    position: relative;
    padding: 0.5rem 0.25rem 2rem;
}

.home-review-card {
    position: relative;
    background: #ffffff;
    border-radius: 7px !important;
    border: 1px solid #e5e7eb;
    padding: 2rem 1.85rem 1.75rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
    transition: border-color 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease;
}

.home-review-quote-icon {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    font-size: 2.2rem;
    color: rgba(241, 1, 0, 0.14);
    transition: color 0.35s ease, transform 0.35s ease;
    pointer-events: none;
}

.tour-review-card-stars {
    display: flex;
    gap: 0.25rem;
    color: #f10100;
    font-size: 0.95rem;
    margin-bottom: 0.85rem;
}

.tour-review-title {
    font-size: 1.1rem;
    font-weight: 500;
    color: #000000;
    margin: 0 0 0.65rem 0;
    line-height: 1.35;
}

.home-review-card > p:not([class]) {
    color: #4b5563;
    font-size: 0.94rem;
    line-height: 1.65;
    margin-bottom: 1.5rem;
    flex-grow: 1;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tour-review-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 1rem;
    border-top: 1px solid #f3f4f6;
}

.tour-review-author-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tour-review-avatar {
    width: 2.5rem;
    height: 2.5rem;
    background-color: #f3f4f6;
    color: #f10100;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.05rem;
}
.tour-review-author-note {
    font-size: 0.78rem;
    color: #6b7280;
    margin: 0.2rem 0 0 0;
}

.home-review-badge {
    background-color: #ecfdf5;
    color: #059669;
    border: 1px solid rgba(16, 185, 129, 0.2);
    border-radius: 7px !important;
    font-size: 0.72rem;
    font-weight: 500;
    padding: 0.25rem 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Hover State */
.home-review-card:hover {
    border-color: rgba(241, 1, 0, 0.35);
    box-shadow: 0 20px 40px rgba(17, 24, 39, 0.08);
    transform: translateY(-4px);
}

.home-review-card:hover .home-review-quote-icon {
    color: rgba(241, 1, 0, 0.32);
    transform: scale(1.15) rotate(-5deg);
}

/* Carousel Controls Wrap */
.home-review-controls-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    margin-top: 2rem;
}

.home-review-arrow {
    position: static;
    width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e5e7eb;
    background-color: #ffffff;
    color: #111827;
    border-radius: 7px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    transition: all 0.25s ease;
}

.home-review-arrow:hover {
    background-color: #f10100;
    border-color: #f10100;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(241, 1, 0, 0.25);
}

.home-review-pagination {
    position: static;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: auto;
}

.home-review-pagination .swiper-pagination-bullet {
    width: 20px;
    height: 4px;
    margin: 0;
    border-radius: 7px !important;
    background-color: #d1d5db;
    opacity: 1;
    transition: all 0.3s ease;
}

.home-review-pagination .swiper-pagination-bullet-active {
    width: 38px;
    background-color: #f10100;
}

/* Custom Travel Guide Cards (Background Image, Text Overlay & Smooth Slow Blur Hover) */
.guide-card-v2 {
    position: relative;
    height: 420px;
    border-radius: 7px !important;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background-color: #111827;
    transition: border-color 1.1s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 1.1s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-card-v2-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 7px !important;
    transition: transform 1.25s cubic-bezier(0.16, 1, 0.3, 1), filter 1.1s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 1;
}

.guide-card-v2-overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.6) 45%, rgba(0, 0, 0, 0.92) 100%);
    z-index: 2;
    transition: background 1.1s cubic-bezier(0.16, 1, 0.3, 1), backdrop-filter 1.1s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-card-v2-content {
    position: relative;
    z-index: 3;
    padding: 1.75rem 1.5rem 1.5rem;
    color: #ffffff;
    display: flex;
    flex-direction: column;
}

.guide-card-v2-kicker {
    display: inline-block;
    background-color: #f10100;
    color: #ffffff;
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    padding: 0.25rem 0.6rem;
    text-transform: uppercase;
    margin-bottom: 0.75rem;
    width: fit-content;
    border-radius: 7px !important;
}

.guide-card-v2-title {
    font-size: 1.25rem;
    font-weight: 500;
    color: #ffffff !important;
    line-height: 1.35;
    margin: 0 0 0.5rem 0;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    transition: color 0.4s ease;
}

.guide-card-v2-meta {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: 0;
    transition: margin-bottom 1.1s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-card-v2-hover-body {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transform: translateY(24px);
    transition: max-height 1.15s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.95s cubic-bezier(0.16, 1, 0.3, 1), transform 1.15s cubic-bezier(0.16, 1, 0.3, 1);
}

.guide-card-v2-excerpt {
    font-size: 0.88rem;
    color: rgba(255, 255, 255, 0.92);
    line-height: 1.6;
    margin: 0.85rem 0 1.15rem;
}

.guide-card-v2-btn {
    display: inline-flex;
    align-items: center;
    background-color: #ffffff;
    color: #111827;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0.55rem 1.25rem;
    border-radius: 7px !important;
    text-decoration: none;
    width: fit-content;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
}

/* ========================================================= */
/* HOVER STATE: Smooth Blurred Background & Excerpt Reveal   */
/* ========================================================= */
.guide-card-v2:hover {
    border-color: rgba(241, 1, 0, 0.4);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.3);
}

/* Background Image Blur & Scale */
.guide-card-v2:hover .guide-card-v2-bg {
    transform: scale(1.1);
    filter: blur(8px) brightness(0.8);
}

/* Frosted Glass Overlay Blur */
.guide-card-v2:hover .guide-card-v2-overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.75) 40%, rgba(0, 0, 0, 0.96) 100%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Smooth Slide-up of Excerpt and Read More Button */
.guide-card-v2:hover .guide-card-v2-hover-body {
    max-height: 180px;
    opacity: 1;
    transform: translateY(0);
}

.guide-card-v2:hover .guide-card-v2-meta {
    margin-bottom: 0.25rem;
}

.guide-card-v2-btn:hover {
    background-color: #f10100;
    color: #ffffff;
}

/* Travel Guide Swiper Controls (Identical to Reviews Carousel style) */
.home-guide-swiper {
    position: relative;
    padding: 0.5rem 0.25rem 2rem;
}

.home-guide-controls-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    margin-top: 2.25rem;
}

.home-guide-arrow {
    position: static;
    width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e5e7eb;
    background-color: #ffffff;
    color: #111827;
    border-radius: 7px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    transition: all 0.25s ease;
}

.home-guide-arrow:hover {
    background-color: #f10100;
    border-color: #f10100;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(241, 1, 0, 0.25);
}

.home-guide-pagination {
    position: static;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: auto;
}

.home-guide-pagination .swiper-pagination-bullet {
    width: 20px;
    height: 4px;
    margin: 0;
    border-radius: 7px !important;
    background-color: #d1d5db;
    opacity: 1;
    transition: all 0.3s ease;
}

.home-guide-pagination .swiper-pagination-bullet-active {
    width: 38px;
    background-color: #f10100;
}

/* Centered Header for Private Travel Specialists Section */
#private-travel-specialists .csp-narrow {
    text-align: center !important;
}

#private-travel-specialists .csp-narrow h2 {
    text-align: center !important;
}

#private-travel-specialists .csp-narrow h2::after {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Cusco experience CTA */
.home-cusco-experience {
    position: relative;
    overflow: hidden;
    padding: clamp(3rem, 6vw, 5rem) 0;
    background: linear-gradient(90deg, #ffffff 0 22%, #f25a00 22% 100%);
    color: #ffffff;
}

.home-cusco-experience-layout {
    display: grid;
    grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr);
    gap: clamp(2rem, 4vw, 4rem);
    align-items: center;
}

.home-cusco-experience-media img {
    width: 100%;
    min-height: 680px;
    object-fit: cover;
    object-position: center;
}

.home-cusco-experience-content {
    max-width: 720px;
}

.home-cusco-experience-kicker {
    display: inline-flex;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 1.5rem;
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1;
    text-transform: uppercase;
}

.home-cusco-experience-kicker::before {
    display: none;
    content: "";
}

.home-cusco-experience h2 {
    margin: 0 0 1.3rem;
    color: #ffffff !important;
    font-size: clamp(2.2rem, 4.6vw, 4rem) !important;
    font-weight: 500 !important;
    letter-spacing: 0;
    line-height: 1.05;
    text-transform: uppercase;
}

.home-cusco-experience h2::after {
    display: none !important;
}

.home-cusco-experience-copy {
    max-width: 590px;
    margin: 0 0 2rem;
    color: rgba(255, 255, 255, 0.9);
    font-size: 1rem;
    line-height: 1.6;
}

.home-cusco-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid rgba(255, 255, 255, 0.32);
    border-bottom: 1px solid rgba(255, 255, 255, 0.32);
}

.home-cusco-stat {
    display: grid;
    grid-template-columns: 4.4rem minmax(0, 1fr);
    gap: 1.1rem;
    align-items: center;
    min-height: 7.2rem;
    padding: 1.15rem 1.4rem;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.3;
}

.home-cusco-stat:nth-child(odd) {
    border-right: 1px solid rgba(255, 255, 255, 0.32);
}

.home-cusco-stat:nth-child(-n + 2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.32);
}

.home-cusco-stat-icon {
    display: inline-flex;
    width: 4.1rem;
    height: 4.1rem;
    align-items: center;
    justify-content: center;
    background-color: #fff4ec;
    color: #f25a00;
    font-size: 1.45rem;
}

.home-cusco-stat strong {
    display: block;
    color: #ffffff;
    font-size: clamp(1.8rem, 3vw, 2.5rem);
    font-weight: 500;
    line-height: 1;
}

.home-cusco-contact-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 0.75fr);
    gap: 1.5rem;
    align-items: center;
    margin-top: 2rem;
    padding: 1.35rem 1.55rem;
    background-color: #fff4ec;
    color: #31231b;
}

.home-cusco-support {
    display: grid;
    grid-template-columns: 3.4rem minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
}

.home-cusco-support i {
    color: #f25a00;
    font-size: 2.3rem;
}

.home-cusco-support strong,
.home-cusco-phone span {
    display: block;
    margin-bottom: 0.25rem;
    color: #cf4f00;
    font-weight: 500;
}

.home-cusco-phone {
    padding-left: 1.5rem;
}

.home-cusco-phone a {
    display: block;
    color: #f25a00;
    font-size: clamp(1.45rem, 2.4vw, 2rem);
    font-weight: 500;
    line-height: 1.18;
    text-decoration: none;
}

@media (max-width: 991.98px) {
    .home-cusco-experience {
        padding: clamp(3rem, 8vw, 4.5rem) 0;
        background: #f25a00;
    }

    .home-cusco-experience-layout {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .home-cusco-experience-media {
        display: none;
    }

    .home-cusco-experience-content {
        max-width: 780px;
        margin: 0 auto;
    }

    .home-cusco-contact-panel {
        grid-template-columns: 1fr;
    }

    .home-cusco-phone {
        padding-top: 1rem;
        padding-left: 0;
        border-top: 1px solid rgba(207, 79, 0, 0.24);
        border-left: 0;
    }
}

@media (max-width: 767.98px) {
    .home-review-swiper {
        padding-inline: 0;
    }

    .home-review-arrow {
        display: none;
    }

    .home-cusco-experience {
        padding: 2.6rem 0;
    }

    .home-cusco-experience-kicker {
        margin-bottom: 1rem;
    }

    .home-cusco-experience h2 {
        font-size: clamp(2rem, 10vw, 2.8rem) !important;
    }

    .home-cusco-experience-copy {
        margin-bottom: 1.5rem;
    }

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

    .home-cusco-stat {
        grid-template-columns: 3.5rem minmax(0, 1fr);
        gap: 0.9rem;
        min-height: auto;
        padding: 1rem 0;
    }

    .home-cusco-stat-icon {
        width: 3.3rem;
        height: 3.3rem;
        font-size: 1.2rem;
    }

    .home-cusco-stat,
    .home-cusco-stat:nth-child(odd),
    .home-cusco-stat:nth-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.32);
    }

    .home-cusco-stat:last-child {
        border-bottom: 0;
    }

    .home-cusco-contact-panel {
        gap: 1rem;
        margin-top: 1.5rem;
        padding: 1.2rem;
    }

    .home-cusco-support {
        grid-template-columns: 2.8rem minmax(0, 1fr);
        gap: 0.85rem;
    }

    .home-cusco-support i {
        font-size: 1.9rem;
    }

    .home-cusco-phone a {
        font-size: clamp(1.3rem, 7vw, 1.75rem);
    }

    .tour-train-notice-copy {
        justify-self: start;
        text-align: left;
    }
}

        .blog-category-hero-image {
            width: 100%;
            height: min(58vh, 560px);
            min-height: 420px;
            object-fit: cover;
            object-position: center;
            opacity: 0.86;
        }

        .blog-category-hero-overlay {
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(90deg, rgba(0, 0, 0, 0.84) 0%, rgba(0, 0, 0, 0.58) 42%, rgba(0, 0, 0, 0.12) 100%);
            pointer-events: none;
        }

        .blog-category-hero-content {
            position: absolute;
            inset: 0;
            z-index: 2;
            display: flex;
            align-items: center;
        }

        .blog-category-hero-inner {
            max-width: 760px;
        }

        .blog-category-main {
            padding: 3.5rem 0 4rem;
            background-color: var(--blog-white);
        }

        .blog-category-breadcrumb {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
            align-items: center;
            padding: 0;
            margin: 0 0 1.75rem;
            color: var(--blog-dark);
            font-size: 0.92rem;
            font-weight: 900;
            letter-spacing: 0.02em;
            line-height: 1.35;
            list-style: none;
            text-transform: uppercase;
        }

        .blog-category-breadcrumb a {
            color: var(--blog-dark);
        }

        .blog-category-hero .blog-category-breadcrumb {
            margin-bottom: 1.2rem;
            color: rgba(255, 255, 255, 0.72);
            font-size: 0.74rem;
            letter-spacing: 0.04em;
        }

        .blog-category-hero .blog-category-breadcrumb a {
            color: rgba(255, 255, 255, 0.92);
        }

        .blog-category-breadcrumb i {
            color: var(--blog-blue);
            font-size: 0.72rem;
        }

        .blog-category-hero .blog-category-breadcrumb i {
            color: rgba(255, 255, 255, 0.5);
            font-size: 0.58rem;
        }

        .blog-category-eyebrow,
        .blog-category-card-kicker {
            display: inline-flex;
            align-items: center;
            gap: 0.55rem;
            margin: 0 0 0.65rem;
            color: var(--blog-primary-dark);
            font-size: 0.78rem;
            font-weight: 900;
            letter-spacing: 0.12em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .blog-category-hero .blog-category-eyebrow {
            color: var(--blog-primary);
        }

        .blog-category-title {
            margin: 0 0 1.75rem;
            color: var(--blog-dark);
            font-size: clamp(2rem, 3.6vw, 3.35rem);
            font-weight: 500;
            letter-spacing: -0.04em;
            line-height: 1.05;
            text-transform: uppercase;
        }

        .blog-category-hero .blog-category-title {
            max-width: 720px;
            margin-bottom: 1rem;
            color: var(--blog-white);
            font-size: clamp(2.35rem, 4.2vw, 4rem);
        }

        .blog-category-hero-copy {
            max-width: 650px;
            margin: 0;
            color: rgba(255, 255, 255, 0.9);
            line-height: 1.75;
        }

        .blog-featured-post-title,
        .blog-list-post-title {
            margin: 0;
            color: var(--blog-blue-dark);
            font-weight: 500;
            letter-spacing: -0.035em;
            line-height: 1.08;
        }

        .blog-featured-post-title {
            font-size: clamp(1.7rem, 2.6vw, 2.35rem);
        }

        .blog-post-meta {
            margin: 1rem 0 0.85rem;
            color: var(--blog-blue-dark);
            font-size: 0.9rem;
            font-weight: 900;
        }

        .blog-post-meta i {
            color: var(--blog-blue-dark);
        }

        .blog-read-more {
            display: inline-flex;
            min-height: 44px;
            align-items: center;
            justify-content: center;
            gap: 0.55rem;
            padding: 0.72rem 1.1rem;
            border: 1px solid var(--blog-blue);
            background-color: var(--blog-blue);
            color: var(--blog-white);
            font-size: 0.78rem;
            font-weight: 900;
            letter-spacing: 0.06em;
            line-height: 1;
            text-transform: uppercase;
            transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
        }

        .blog-read-more:hover,
        .blog-read-more:focus {
            border-color: var(--blog-primary);
            background-color: var(--blog-primary);
            color: var(--blog-white);
            transform: translateY(-2px);
        }

        .blog-list-post:hover {
            border-color: rgba(241, 1, 0, 0.45);
            box-shadow: 0 18px 42px rgba(17, 24, 39, 0.08);
            transform: translateY(-2px);
        }

        .blog-list-post-title {
            font-size: clamp(1.25rem, 1.9vw, 1.75rem);
        }

        .blog-category-card-title {
            color: var(--blog-blue-dark);
            font-size: clamp(1.25rem, 2vw, 1.65rem);
            font-weight: 500;
            letter-spacing: -0.035em;
            line-height: 1.1;
            text-transform: uppercase;
        }

        .blog-category-card-title i {
            color: var(--blog-primary);
        }

        .blog-category-link-list li + li {
            border-top: 1px solid var(--blog-border);
        }

        .blog-category-link-list a {
            display: grid;
            grid-template-columns: 1rem minmax(0, 1fr) auto;
            gap: 0.65rem;
            align-items: center;
            padding: 0.9rem 0;
            color: var(--blog-text);
            font-size: 0.96rem;
            font-weight: 500;
            line-height: 1.35;
            transition: color 0.2s ease, transform 0.2s ease;
        }

        .blog-category-link-list a:hover,
        .blog-category-link-list a:focus {
            color: var(--blog-primary-dark);
            transform: translateX(3px);
        }

        .blog-category-link-list i {
            color: var(--blog-primary);
            font-size: 0.75rem;
        }

        .blog-category-count {
            display: inline-flex;
            min-width: 2rem;
            min-height: 2rem;
            align-items: center;
            justify-content: center;
            background-color: var(--blog-light);
            color: var(--blog-blue-dark);
            font-size: 0.78rem;
            font-weight: 900;
        }

        .blog-category-pagination .page-link {
            width: 3rem;
            height: 3rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-color: var(--blog-border);
            color: var(--blog-blue-dark);
            font-weight: 900;
        }

        .blog-category-pagination .page-link:hover,
        .blog-category-pagination .page-link:focus {
            border-color: var(--blog-primary);
            background-color: var(--blog-soft);
            color: var(--blog-primary-dark);
            box-shadow: none;
        }

        .blog-category-pagination .page-item.active .page-link {
            border-color: var(--blog-primary);
            background-color: var(--blog-primary);
            color: var(--blog-white);
        }

        .csp-blog-topic-media::before {
            display: none;
        }

        .csp-blog-topic-media::after {
            background: linear-gradient(45deg, rgba(12, 22, 32, 0.9) 0%, rgba(12, 22, 32, 0.56) 50%, rgba(241, 1, 0, 0.34) 100%);
            opacity: 0.86;
            transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1), background 0.7s cubic-bezier(0.22, 1, 0.36, 1);
        }

        .csp-blog-topic-card:hover,
        .csp-blog-topic-card:focus {
            transform: none;
        }

        .csp-blog-topic-card:hover .csp-blog-topic-media::after,
        .csp-blog-topic-card:focus .csp-blog-topic-media::after {
            opacity: 0.96;
        }

        .csp-blog-topic-media img {
            transition: transform 0.85s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1);
        }

        .csp-blog-topic-body {
            opacity: 1;
        }

        .csp-blog-topic-copy,
        .csp-blog-topic-link {
            max-height: 0;
            overflow: hidden;
            opacity: 0;
            transform: translateY(18px);
            transition: max-height 0.68s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.58s ease, transform 0.68s cubic-bezier(0.22, 1, 0.36, 1);
        }

        .csp-blog-topic-card:hover .csp-blog-topic-copy,
        .csp-blog-topic-card:focus .csp-blog-topic-copy,
        .csp-blog-topic-card:hover .csp-blog-topic-link,
        .csp-blog-topic-card:focus .csp-blog-topic-link {
            max-height: 9rem;
            opacity: 1;
            transform: translateY(0);
        }

        .blog-category-support {
            padding-top: 1.25rem;
        }

        .blog-category-support-panel {
            height: 100%;
            padding: 1.45rem;
            border: 1px solid var(--blog-border);
            border-top: 4px solid var(--blog-primary);
            background-color: var(--blog-white);
        }

        .blog-category-support-title {
            display: flex;
            align-items: center;
            gap: 0.65rem;
            margin: 0 0 1rem;
            color: var(--blog-blue-dark);
            font-size: 1.08rem;
            font-weight: 500;
            letter-spacing: 0;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .blog-category-support-title i {
            color: var(--blog-primary);
            font-size: 1rem;
        }

        .blog-latest-list li + li,
        .blog-contact-list li + li,
        .blog-private-list li + li {
            border-top: 1px solid var(--blog-border);
        }

        .blog-latest-list a,
        .blog-contact-list a {
            display: grid;
            gap: 0.35rem;
            padding: 0.85rem 0;
            color: var(--blog-blue-dark);
            font-weight: 900;
            line-height: 1.3;
            transition: color 0.22s ease;
        }

        .blog-latest-list a:hover,
        .blog-latest-list a:focus,
        .blog-contact-list a:hover,
        .blog-contact-list a:focus {
            color: var(--blog-primary-dark);
        }

        .blog-latest-list small,
        .blog-contact-list small {
            color: var(--blog-muted);
            font-size: 0.78rem;
            font-weight: 500;
            letter-spacing: 0.06em;
            text-transform: uppercase;
        }

        .blog-contact-list i {
            color: var(--blog-primary);
            margin-right: 0.45rem;
        }

        .blog-private-heading {
            margin: 0 0 0.9rem;
            color: var(--blog-blue-dark);
            font-size: clamp(1.45rem, 2.4vw, 2rem);
            font-weight: 500;
            letter-spacing: 0;
            line-height: 1.05;
        }

        .blog-private-heading span {
            display: block;
            color: var(--blog-primary-dark);
        }

        .blog-private-intro {
            margin: 0 0 1rem;
            color: var(--blog-text);
            line-height: 1.65;
        }

        .blog-private-list li {
            padding: 0.9rem 0;
            color: var(--blog-text);
            line-height: 1.55;
        }

        .blog-private-list strong {
            display: block;
            margin-bottom: 0.25rem;
            color: var(--blog-blue-dark);
            font-size: 0.86rem;
            font-weight: 900;
            letter-spacing: 0.06em;
            text-transform: uppercase;
        }

        .blog-promo-hero {
            position: relative;
            background-image: url('images/front-machu-picchu-tour.jpg');
            overflow: hidden;
            padding: clamp(4.5rem, 8vw, 7rem) 0;
            background-position: center;
            background-size: cover;
            color: var(--blog-white);
        }

        .blog-promo-hero::after {
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(45deg, rgba(7, 16, 24, 0.92) 0%, rgba(23, 50, 77, 0.66) 48%, rgba(241, 1, 0, 0.34) 100%);
            content: "";
            pointer-events: none;
        }

        .blog-promo-hero-inner {
            position: relative;
            z-index: 2;
            max-width: 760px;
        }

        .blog-promo-hero-kicker {
            display: inline-flex;
            align-items: center;
            gap: 0.55rem;
            margin: 0 0 0.85rem;
            color: var(--blog-primary);
            font-size: 0.78rem;
            font-weight: 900;
            letter-spacing: 0.12em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .blog-promo-hero-title {
            max-width: 720px;
            margin: 0 0 1rem;
            color: var(--blog-white);
            font-size: clamp(2rem, 4vw, 3.65rem);
            font-weight: 500;
            letter-spacing: 0;
            line-height: 1.02;
            text-transform: uppercase;
        }

        .blog-promo-hero-copy {
            max-width: 650px;
            margin: 0 0 1.5rem;
            color: rgba(255, 255, 255, 0.9);
            line-height: 1.75;
        }

        .blog-promo-hero-link {
            display: inline-flex;
            min-height: 48px;
            align-items: center;
            justify-content: center;
            gap: 0.55rem;
            padding: 0.9rem 1.25rem;
            background-color: var(--blog-primary);
            color: var(--blog-white);
            font-size: 0.82rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            line-height: 1;
            text-transform: uppercase;
            transition: background-color 0.22s ease, transform 0.22s ease;
        }

        .blog-promo-hero-link:hover,
        .blog-promo-hero-link:focus {
            background-color: var(--blog-blue);
            color: var(--blog-white);
            transform: translateY(-2px);
        }

        @media (max-width: 767.98px) {
            .blog-category-hero-image {
                height: 560px;
                min-height: 560px;
            }

            .blog-category-main {
                padding: 2rem 0 3rem;
            }
        }

/* Single blog template styles */

.blog-reading-progress {
            position: fixed;
            top: 0;
            left: 0;
            z-index: 1000;
            width: 100%;
            height: 5px;
            background: rgba(23, 23, 23, 0.12);
        }

        .blog-reading-progress span {
            display: block;
            width: 0;
            height: 100%;
            background: linear-gradient(90deg, var(--blog-primary), var(--blog-blue), var(--blog-primary));
            background-size: 220% 100%;
            animation: blogProgressGlow 2.8s linear infinite;
            transition: width 0.12s linear;
        }

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

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

        .blog-hero {
            position: relative;
            overflow: hidden;
            background-color: var(--blog-dark);
        }

        .blog-hero-image {
            width: 100%;
            height: min(66vh, 620px);
            min-height: 440px;
            object-fit: cover;
            object-position: center;
            opacity: 0.86;
        }

        .blog-hero-overlay {
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(90deg, rgba(0, 0, 0, 0.86) 0%, rgba(0, 0, 0, 0.62) 42%, rgba(0, 0, 0, 0.15) 100%);
            pointer-events: none;
        }

        .blog-hero-content {
            position: absolute;
            inset: 0;
            z-index: 2;
            display: flex;
            align-items: center;
        }

        .blog-hero-inner {
            max-width: 820px;
        }

        .blog-breadcrumb {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem;
            align-items: center;
            padding: 0;
            margin: 0 0 1.15rem;
            color: rgba(255, 255, 255, 0.72);
            font-size: 0.74rem;
            font-weight: 500;
            letter-spacing: 0.04em;
            line-height: 1.35;
            list-style: none;
            text-transform: uppercase;
        }

        .blog-breadcrumb a {
            color: rgba(255, 255, 255, 0.92);
        }

        .blog-breadcrumb i {
            color: rgba(255, 255, 255, 0.5);
            font-size: 0.58rem;
        }

        .blog-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 0.55rem;
            margin-bottom: 1rem;
            color: var(--blog-primary);
            font-size: 0.78rem;
            font-weight: 900;
            letter-spacing: 0.12em;
            text-transform: uppercase;
        }

        .blog-eyebrow i {
            color: var(--blog-primary);
        }

        .blog-title {
            max-width: 780px;
            margin: 0 0 1.1rem;
            color: var(--blog-white);
            font-size: clamp(2.25rem, 4.2vw, 4.15rem);
            font-weight: 500;
            letter-spacing: -0.04em;
            line-height: 1.03;
            text-transform: uppercase;
            text-wrap: balance;
        }

        .blog-hero-excerpt {
            max-width: 660px;
            margin: 0 0 1.7rem;
            color: rgba(255, 255, 255, 0.9);
            line-height: 1.75;
        }

        .blog-meta-row {
            display: flex;
            flex-wrap: wrap;
            gap: 0.85rem 1rem;
            align-items: center;
        }

        .blog-meta-pill {
            display: inline-flex;
            min-height: 38px;
            align-items: center;
            gap: 0.55rem;
            padding: 0.5rem 0.85rem;
            border: 1px solid rgba(255, 255, 255, 0.24);
            background-color: rgba(255, 255, 255, 0.1);
            color: var(--blog-white);
            font-size: 0.78rem;
            font-weight: 500;
            line-height: 1;
        }

        .blog-main {
            position: relative;
            padding: 4rem 0;
            background-color: var(--blog-white);
        }

        .blog-layout {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 360px;
            gap: 2rem;
            align-items: start;
        }

        .blog-article-card,
        .blog-sidebar-card,
        .blog-author-box,
        .blog-comments,
        .blog-related {
            border: 1px solid var(--blog-border);
            background-color: var(--blog-white);
        }

        .blog-article-card {
            padding: clamp(1.35rem, 2.8vw, 2.8rem);
        }

        .blog-quick-answer {
            display: grid;
            gap: 1rem;
            padding: 1.25rem;
            margin-bottom: 1.5rem;
            border: 1px solid #f3e2d5;
            background-color: #fff8f2;
            box-shadow: 0 10px 24px rgba(241, 1, 0, 0.06);
        }

        .blog-quick-answer-heading {
            display: flex;
            gap: 0.55rem;
            align-items: center;
            color: var(--blog-primary-dark);
        }

        .blog-quick-answer-heading i {
            color: var(--blog-primary);
            line-height: 1;
        }

        .blog-quick-answer-heading h2 {
            margin: 0;
            color: var(--blog-primary-dark);
            letter-spacing: 0;
            line-height: 1;
        }

        .blog-quick-answer-copy {
            max-width: 1120px;
            margin: 0;
            color: var(--blog-dark);
            line-height: 1.48;
        }

        .blog-quick-answer-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 0;
            padding: 0.85rem;
            border: 1px solid #f1ede8;
            background-color: var(--blog-white);
        }

        .blog-quick-answer-item {
            display: grid;
            grid-template-columns: 42px minmax(0, 1fr);
            gap: 0.7rem;
            align-items: center;
            padding: 0.15rem 0.85rem;
        }

        .blog-quick-answer-item + .blog-quick-answer-item {
            border-left: 1px solid #eee4dc;
        }

        .blog-quick-answer-item i {
            justify-self: center;
            color: var(--blog-primary);
            line-height: 1;
        }

        .blog-quick-answer-item span,
        .blog-quick-answer-item strong,
        .blog-quick-answer-item small {
            display: block;
        }

        .blog-quick-answer-item strong {
            margin-bottom: 0.2rem;
            color: #26324b;
            font-weight: 500;
            line-height: 1.2;
        }

        .blog-quick-answer-item small {
            color: var(--blog-text);
            font-weight: 500;
            line-height: 1.35;
        }

        .blog-share-row {
            display: flex;
            flex-wrap: wrap;
            gap: 0.75rem;
            align-items: center;
            justify-content: space-between;
            padding: 1rem;
            margin-bottom: 2rem;
            background-color: var(--blog-light);
        }

        .blog-share-label {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            color: var(--blog-dark);
            font-size: 0.78rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .blog-share-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem;
        }

        .blog-share-button {
            display: inline-flex;
            width: 40px;
            height: 40px;
            align-items: center;
            justify-content: center;
            border: 1px solid var(--blog-border);
            background-color: var(--blog-white);
            color: var(--blog-dark);
            transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
        }

        .blog-share-button:hover,
        .blog-share-button:focus {
            border-color: var(--blog-primary);
            background-color: var(--blog-primary);
            color: var(--blog-white);
            transform: translateY(-2px);
        }

        .blog-share-button.is-copied {
            border-color: var(--blog-blue);
            background-color: var(--blog-blue);
            color: var(--blog-white);
        }

        .blog-content {
            color: var(--blog-text);
            font-size: 1.03rem;
        }

        .blog-content > *:first-child {
            margin-top: 0;
        }

        .blog-content h2,
        .blog-content h3,
        .blog-content h4,
        .blog-content h5,
        .blog-content h6 {
            scroll-margin-top: 90px;
            color: var(--blog-dark);
            font-weight: 500;
            letter-spacing: 0;
            line-height: 1.15;
            text-transform: uppercase;
        }

        .blog-content h2 {
            font-size: 1.36rem;
        }

        .blog-content h3 {
            font-size: 1.24rem;
        }

        .blog-content h4 {
            font-size: 1.16rem;
        }

        .blog-content h5 {
            font-size: 1.1rem;
        }

        .blog-content h6 {
            font-size: 1.05rem;
        }

        .blog-content p,
        .blog-content ul,
        .blog-content ol,
        .blog-content blockquote {
            margin-bottom: 1.25rem;
        }

        .blog-content a {
            color: var(--blog-primary-dark);
            font-weight: 500;
        }

        .blog-content blockquote {
            padding: 1.25rem 1.35rem;
            border: 1px solid var(--blog-border);
            background-color: var(--blog-soft);
            color: var(--blog-dark);
            font-size: 1.08rem;
            font-weight: 500;
        }

        .blog-final-advice-faq {
            margin-top: 2rem;
            padding-top: 1.75rem;
            border-top: 1px solid var(--blog-border);
        }

        .blog-final-advice-faq > h2 {
            margin-top: 0;
            margin-bottom: 1rem;
        }

        .blog-content img {
            width: 100%;
            height: auto;
            margin: 1.6rem 0;
        }

        .blog-sidebar {
            position: sticky;
            top: 1.5rem;
            display: grid;
            gap: 1rem;
        }

        .blog-sidebar-card {
            padding: 1.35rem;
        }

        .blog-sidebar-title {
            display: flex;
            align-items: center;
            gap: 0.55rem;
            margin: 0 0 1rem;
            color: var(--blog-dark);
            font-size: 1rem;
            font-weight: 500;
            letter-spacing: 0.08em;
            line-height: 1.25;
            text-transform: uppercase;
        }

        .blog-sidebar-title i {
            color: var(--blog-primary);
        }

        .blog-toc-list,
        .blog-link-list,
        .blog-info-list {
            display: grid;
            gap: 0.72rem;
            padding: 0;
            margin: 0;
            list-style: none;
        }

        .blog-toc-list {
            gap: 0;
        }

        .blog-toc-list li {
            border-bottom: 1px dotted #dde2e8;
        }

        .blog-toc-list li:last-child {
            border-bottom: 0;
        }

        .blog-toc-list a,
        .blog-link-list a,
        .blog-info-list li {
            display: grid;
            grid-template-columns: 1rem minmax(0, 1fr);
            gap: 0.65rem;
            align-items: start;
            color: var(--blog-text);
            font-size: 0.92rem;
            line-height: 1.45;
        }

        .blog-toc-list a {
            padding: 0.42rem 0;
            line-height: 1.3;
        }

        .blog-toc-list a.is-active,
        .blog-toc-list a:hover,
        .blog-link-list a:hover {
            color: var(--blog-primary-dark);
        }

        .blog-toc-list i,
        .blog-link-list i,
        .blog-info-list i {
            margin-top: 0.24rem;
            color: var(--blog-primary);
            font-size: 0.72rem;
        }

        .blog-toc-list .is-h3 {
            padding-left: 1rem;
            font-size: 0.88rem;
        }

        .blog-info-list strong,
        .blog-info-list span {
            display: block;
        }

        .blog-info-list strong {
            color: var(--blog-dark);
            font-size: 0.72rem;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .blog-info-list span {
            margin-top: 0.1rem;
            color: var(--blog-text);
        }

        .blog-nav-posts {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 1rem;
            margin-top: 2rem;
        }

        .blog-nav-post {
            display: grid;
            gap: 0.45rem;
            min-height: 130px;
            padding: 1.25rem;
            border: 1px solid var(--blog-border);
            background-color: var(--blog-light);
            transition: border-color 0.2s ease, transform 0.2s ease;
        }

        .blog-nav-post:hover {
            border-color: var(--blog-primary);
            transform: translateY(-2px);
        }

        .blog-nav-post small {
            display: inline-flex;
            align-items: center;
            gap: 0.45rem;
            color: var(--blog-primary-dark);
            font-size: 0.72rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .blog-nav-post strong {
            color: var(--blog-dark);
            font-size: 1.04rem;
            font-weight: 900;
            line-height: 1.25;
        }

        .blog-section {
            margin-top: 3rem;
        }

        .blog-section-heading {
            display: flex;
            flex-wrap: wrap;
            gap: 0.75rem;
            align-items: end;
            justify-content: space-between;
            margin-bottom: 1.2rem;
        }

        .blog-section-kicker {
            margin: 0 0 0.25rem;
            color: var(--blog-primary-dark);
            font-size: 0.78rem;
            font-weight: 900;
            letter-spacing: 0.12em;
            text-transform: uppercase;
        }

        .blog-section-title {
            margin: 0;
            color: var(--blog-dark);
            font-size: clamp(1.7rem, 2.8vw, 2.45rem);
            font-weight: 500;
            letter-spacing: -0.04em;
            line-height: 1.08;
            text-transform: uppercase;
        }

        .blog-related-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 1rem;
        }

        .blog-related {
            padding: clamp(1.2rem, 2.3vw, 2rem);
        }

        .blog-related-card {
            display: grid;
            overflow: hidden;
            border: 1px solid var(--blog-border);
            background-color: var(--blog-white);
        }

        .blog-related-card img {
            width: 100%;
            aspect-ratio: 4 / 3;
            object-fit: cover;
        }

        .blog-related-card-body {
            padding: 1rem;
        }

        .blog-related-card small {
            color: var(--blog-primary-dark);
            font-size: 0.72rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .blog-related-card h3 {
            margin: 0.35rem 0 0;
            color: var(--blog-dark);
            font-size: 1rem;
            font-weight: 500;
            line-height: 1.25;
        }

        .blog-author-box,
        .blog-comments {
            padding: clamp(1.2rem, 2.3vw, 2rem);
        }

        .blog-author-box {
            display: grid;
            grid-template-columns: 64px minmax(0, 1fr);
            gap: 1rem;
            align-items: center;
            margin-top: 2rem;
            background-color: var(--blog-soft);
        }

        .blog-author-avatar {
            display: inline-flex;
            width: 64px;
            height: 64px;
            align-items: center;
            justify-content: center;
            background-color: var(--blog-primary);
            color: var(--blog-white);
            font-size: 1.4rem;
        }

        .blog-author-box h2 {
            margin: 0 0 0.25rem;
            color: var(--blog-dark);
            font-size: 1.1rem;
            font-weight: 500;
            text-transform: uppercase;
        }

        .blog-author-box p {
            margin: 0;
        }

        .blog-comments {
            margin-top: 3rem;
        }

        .blog-comments .comment-reply-title,
        .blog-comments h2,
        .blog-comments h3 {
            color: var(--blog-dark);
            font-weight: 500;
            letter-spacing: -0.03em;
            text-transform: uppercase;
        }

        .blog-comments input,
        .blog-comments textarea {
            width: 100%;
            min-height: 46px;
            border: 1px solid var(--blog-border);
            padding: 0.75rem 0.85rem;
        }

        .blog-comments textarea {
            min-height: 150px;
        }

        .blog-comments .submit {
            width: auto;
            min-height: 48px;
            padding: 0.75rem 1.25rem;
            border: 1px solid var(--blog-primary);
            background-color: var(--blog-primary);
            color: var(--blog-white);
            font-size: 0.78rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        @media (max-width: 1199.98px) {
            .blog-layout {
                grid-template-columns: 1fr;
            }

            .blog-sidebar {
                position: static;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .blog-related-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 767.98px) {
            .blog-hero-image {
                height: 560px;
                min-height: 560px;
            }

            .blog-main {
                padding: 2rem 0;
            }

            .blog-quick-answer-grid {
                grid-template-columns: 1fr;
            }

            .blog-quick-answer-item {
                padding: 0.85rem 0;
            }

            .blog-quick-answer-item + .blog-quick-answer-item {
                border-top: 1px solid #eee4dc;
                border-left: 0;
            }

            .blog-sidebar {
                grid-template-columns: 1fr;
            }

            .blog-nav-posts,
            .blog-related-grid {
                grid-template-columns: 1fr;
            }

            .blog-share-row {
                align-items: flex-start;
                flex-direction: column;
            }

            .blog-author-box {
                grid-template-columns: 1fr;
            }
        }

/* Travel Peru Without the Crowds Section */
.travel-without-crowds-box {
    background-color: #ffffff;
    border-radius: 16px;
    padding: clamp(1.5rem, 3vw, 2.5rem);
}

.travel-without-crowds-eyebrow {
    color: var(--csp-primary, #f10100);
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.travel-without-crowds-eyebrow::after {
    content: "";
    display: inline-block;
    width: 24px;
    height: 2px;
    background-color: var(--csp-primary, #f10100);
}

.travel-without-crowds-title {
    font-size: clamp(2rem, 3.5vw, 2.85rem);
    font-weight: 500;
    line-height: 1.12;
    color: var(--csp-dark, #000000);
    letter-spacing: -0.02em;
    margin-bottom: 1.25rem;
}

.travel-without-crowds-title span {
    color: var(--csp-primary, #f10100);
    display: block;
}

.travel-without-crowds-text {
    color: #4b5563;
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

.travel-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 1.5rem;
    column-gap: 1.5rem;
    margin-bottom: 2.25rem;
    position: relative;
}

.travel-feature-item {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.travel-feature-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 50%;
    background-color: #fff3eb;
    color: var(--csp-primary, #f10100);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.travel-feature-content h4 {
    color: var(--csp-dark, #000000);
    font-size: 1rem;
    font-weight: 500;
    margin: 0 0 0.25rem 0;
    line-height: 1.25;
}

.travel-feature-content p {
    color: #64748b;
    font-size: 0.85rem;
    line-height: 1.4;
    margin: 0;
}

.travel-feature-border-bottom {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.travel-feature-border-right {
    padding-right: 1rem;
    border-right: 1px solid #e5e7eb;
}

.travel-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.csp-btn-orange-pill {
    background: linear-gradient(135deg, #f10100 0%, #f10100 100%);
    color: #ffffff !important;
    font-weight: 500;
    padding: 0.85rem 2rem;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 14px rgba(241, 1, 0, 0.3);
}

.csp-btn-orange-pill:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(241, 1, 0, 0.4);
    color: #ffffff;
}

.csp-link-dark {
    color: var(--csp-dark, #000000);
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.95rem;
    transition: color 0.2s ease;
}

.csp-link-dark:hover {
    color: var(--csp-primary, #f10100);
}

@media (max-width: 767.98px) {
    .travel-feature-grid {
        grid-template-columns: 1fr;
    }
    .travel-feature-border-right {
        border-right: none;
        padding-right: 0;
    }
}

/* Package Feature Cards (Mosaic Grid) */
.package-card {
    --package-card-hover-color: #ffe303;
    position: relative;
    height: 480px;
    border-radius: 7px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.package-card-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.package-card-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.6) 30%, rgba(0, 0, 0, 0) 100%);
}

.package-card-content {
    position: relative;
    z-index: 3;
    padding: 2rem 1.5rem;
    text-align: left;
    color: #ffffff;
}

.package-card-title {
    color: #ffffff;
    font-size: clamp(1.05rem, 1.5vw, 1.25rem);
    font-weight: 500;
    text-transform: uppercase;
    line-height: 1.3;
    margin-bottom: 0.8rem;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    max-width: 80%;
    transition: color 400ms ease;
}

.package-card:hover .package-card-title,
.package-card:focus .package-card-title {
    color: var(--package-card-hover-color);
}

.package-card-info {
    display: flex;
    align-items: stretch;
    border-top: 1px solid rgba(255, 255, 255, 0.8);
    gap: 1rem;
    max-width: 85%;
    transition: border-color 400ms ease;
}

.package-card:hover .package-card-info,
.package-card:focus .package-card-info {
    border-top-color: var(--package-card-hover-color);
}

.package-card-days {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
    color: #ffffff;
    padding-top: 0.8rem;
    padding-right: 1rem;
    border-right: 1px solid rgba(255, 255, 255, 0.8);
    flex-shrink: 0;
    transition: border-color 400ms ease, color 400ms ease;
}

.package-card:hover .package-card-days,
.package-card:focus .package-card-days {
    border-right-color: var(--package-card-hover-color);
    color: var(--package-card-hover-color);
}

.package-card-days strong {
    font-size: 1.6rem;
    font-weight: 900;
}

.package-card-days span {
    font-size: 0.65rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 0.15rem;
}

.package-card-locations {
    display: flex;
    align-items: center;
    padding-top: 0.8rem;
    font-size: 1.05rem;
    color: #e5e7eb;
    line-height: 1.4;
    font-weight: 500;
    transition: color 400ms ease;
}

.package-card:hover .package-card-locations,
.package-card:focus .package-card-locations {
    color: var(--package-card-hover-color);
}


/* Global Container Max Width & Proportional Typography Scaling for Large Screens (1400px - 1512px+ viewports) */
@media (min-width: 1400px) {
    html {
        font-size: 17.5px;
    }
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: 1440px !important;
    }
}

/* Unified H2 Titles Style Across Homepage (Black Color, Exact Same Font Size, Orange Underline) */
.home-page h2,
.home-page .csp-section-title {
    font-size: clamp(1.85rem, 2.5vw, 2.35rem) !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
    text-align: left !important;
}

.home-page h2 span,
.home-page .csp-section-title span {
    color: #000000 !important;
    font-weight: 500 !important;
}

.home-page h2::after,
.home-page .csp-section-title::after {
    content: "";
    display: block;
    width: 48px;
    height: 4px;
    background-color: var(--csp-primary, #f10100) !important;
    border-radius: 2px;
    margin-top: 0.65rem;
    margin-bottom: 0.85rem;
}

/* Custom Front Page Refactored Component Styles (No Inline Styles) */
.travel-specialists-img {
    min-height: 480px;
    max-height: 600px;
}

.exclusive-packages-lead {
    max-width: 800px;
}

#craft-machu-picchu-experience .csp-section-title {
    color: var(--csp-dark, #000000);
    font-weight: 500;
    font-size: clamp(2rem, 3vw, 2.75rem);
}

#craft-machu-picchu-experience p {
    color: #4b5563;
    line-height: 1.65;
}

.craft-experience-img {
    min-height: 420px;
    max-height: 520px;
}

#custom-private-peru-tours-hero {
    overflow: hidden;
    min-height: 540px;
    display: flex;
    align-items: center;
}

.hero-overlay-dark {
    z-index: 2;
    background: linear-gradient(90deg, rgba(15, 23, 42, 0.92) 0%, rgba(15, 23, 42, 0.78) 55%, rgba(15, 23, 42, 0.58) 100%);
}

.hero-overlay-angled {
    z-index: 2;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.94) 0%, rgba(15, 23, 42, 0.78) 45%, rgba(15, 23, 42, 0.25) 100%);
}

.z-index-1 { z-index: 1; }
.z-index-3 { z-index: 3; }

/* All Buttons Square Corners (Zero Border-Radius) */
.csp-btn,
.csp-btn-orange-pill,
.package-card-btn,
.travel-without-crowds-box .csp-btn,
.home-page .csp-btn,
.home-page a.csp-btn,
.home-page button,
.home-page .btn {
    border-radius: 7px !important;
}

/* Semi-transparent Glass Card for Hero Sections */
.hero-glass-card {
    background: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 16px;
    padding: clamp(1.75rem, 3.5vw, 3rem);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
}

.hero-glass-card .csp-section-title {
    color: #000000 !important;
}

.hero-glass-card p {
    color: #2d3748 !important;
    line-height: 1.7;
}




.horizontal-package-card {
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.hp-badge {
    color: #f97316 !important;
    border-color: #f97316 !important;
    font-size: 0.75rem;
    padding: 0.5rem 1rem !important;
}

.hp-title {
    font-size: clamp(1.8rem, 2.5vw, 2.4rem);
    letter-spacing: -0.02em;
    color: #0f172a !important;
    transition: color 0.3s ease;
}

.hp-subtitle {
    font-size: clamp(1.6rem, 2vw, 1.9rem);
    letter-spacing: -0.02em;
    color: #f97316 !important;
    transition: color 0.3s ease;
}

.hp-desc {
    font-size: 0.95rem;
    line-height: 1.6;
    border-color: #f0f0f0 !important;
    transition: color 0.3s ease;
}

.hp-icon-circle {
    font-size: 1.75rem;
    color: #f97316 !important;
    display: inline-block;
    transition: color 0.3s ease;
}

.hp-icons > [class*="col-"] + [class*="col-"] {
    border-left: 1px solid #e5e7eb;
}

.hp-icon-title {
    font-size: 0.8rem;
    line-height: 1.2;
    color: #0f172a !important;
    transition: color 0.3s ease;
}

.hp-icon-text {
    font-size: 0.7rem;
    line-height: 1.3;
    transition: color 0.3s ease;
}

.hp-price-container {
    background-color: #fffaf5 !important;
}

.hp-price-val {
    font-size: 1.7rem;
    letter-spacing: -0.03em;
    color: #0f172a !important;
}

.hp-price-label,
.hp-price-unit,
.hp-price-currency {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 500;
}

.hp-price-currency {
    font-size: 0.9rem;
}

.hp-btn {
    background-color: #f97316;
    border-color: #f97316;
    color: #fff;
}
.hp-btn:hover {
    background-color: #ea580c;
    border-color: #ea580c;
    color: #fff;
}

@media (max-width: 767.98px) {
    .horizontal-package-img {
        position: relative !important;
        height: 350px !important;
    }
}