/* ================================================================
   single-tours-v2.css
   Styles for the v2 (PNG-based) deal page layout.
   Scoped under .tours-v2-page to avoid touching the v1 template.
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=GFS+Didot&family=Playfair+Display:wght@700&display=swap');

.tours-v2-page {
    --v2-bg:        #FAFAF7;
    --v2-card:      #FFFAF1;
    --v2-section:   #F8F1E5;
    --v2-rule:      #E8DFD0;
    --v2-ink:       #1F2A36;
    --v2-ink-soft:  #6B7280;
    --v2-accent:    #D85A5B;
    --v2-accent-2:  #5C77CC;
    --v2-radius:    14px;
    --v2-radius-sm: 10px;
    --v2-shadow:    0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(31,42,54,.06);
    --v2-serif:     'Didot', 'GFS Didot', Georgia, 'Times New Roman', serif;

    background: var(--v2-bg);
    color: var(--v2-ink);
    padding: 6px 0 0;
    margin-top: 0;
    font-feature-settings: 'kern' 1, 'liga' 1;
}

/* Hide the breadcrumbs band entirely on v2 pages */
.single-tours .top_site_main { display: none !important; }

/* Header — wider so logo sits top-left and menu top-right (v2 pages only) */
.single-tours header.container {
    width: auto !important;
    max-width: 1400px !important;
    padding-left: 40px;
    padding-right: 40px;
}

/* Breadcrumbs — align with the 1200px content width, left-aligned */
.single-tours .top_site_main .banner-wrapper.container {
    width: auto !important;
    max-width: 1200px !important;
    padding-left: 24px;
    padding-right: 24px;
    text-align: left;
}
.single-tours .breadcrumbs-wrapper,
.single-tours .phys-breadcrumb {
    text-align: left;
    justify-content: flex-start;
}

.tours-v2-page .container {
    max-width: 1200px;
    padding: 16px 24px 0;
    margin: 0 auto;
}

/* =============================================
   Editorial Escape — Hero (magazine cover)
   ============================================= */
.tours-v2-page section.ee-hero {
    position: relative;
    height: 48vh; min-height: 360px;
    margin: 0 0 14px;
    color: #fff;
    display: flex; align-items: center;
    overflow: hidden;
    background-color: transparent;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}
.ee-hero-inner {
    max-width: 1200px; margin: 0 auto; padding: 40px 48px;
    width: 100%;
}
.ee-eyebrow {
    font-family: 'GFS Didot', Georgia, serif; font-style: italic; font-size: 18px;
    letter-spacing: 0.08em; opacity: 0.95; margin-bottom: 8px;
    display: flex; align-items: center; gap: 12px;
}
.ee-eyebrow::before {
    content: ''; height: 1px; background: rgba(255,255,255,0.6); flex: 0 0 40px;
}
.ee-eyebrow a { color: #fff; text-decoration: none; }
.ee-eyebrow a:hover { text-decoration: underline; }
.ee-eyebrow__sep { opacity: 0.6; }
.tours-v2-page .ee-title {
    font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-weight: 700;
    font-size: clamp(28px, 3.4vw, 48px); line-height: 1.1;
    max-width: 900px; letter-spacing: -0.02em; margin: 0 0 20px;
    color: #fff;
    text-align: left;
    padding: 0;
}
.tours-v2-page .ee-title .accent {
    font-family: 'GFS Didot', Georgia, serif; font-style: italic; font-weight: 400;
    color: #ffd5d5;
}
.ee-meta {
    display: flex; gap: 32px; font-size: 13px;
    letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.9;
    flex-wrap: wrap;
}
.ee-meta .dot { opacity: 0.4; }
.ee-meta .ee-meta-link { color: #fff; text-decoration: none; }
.ee-meta .ee-meta-link:hover { text-decoration: underline; }
.ee-author {
    display: flex; align-items: center; gap: 10px;
    margin-top: 18px; font-size: 13px; opacity: 0.95;
}
.ee-author .avatar {
    width: 32px; height: 32px; border-radius: 50%;
    background: #EC5A5B; color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 700; letter-spacing: 0.04em;
}
.ee-author .dot { opacity: 0.4; margin: 0 6px; }

/* Booking card overlay */
.ee-booking {
    position: absolute; right: 48px; top: 50%;
    transform: translateY(-50%);
    background: #fff; color: #1a2a33;
    padding: 22px 20px; border-radius: 14px;
    width: 264px; box-shadow: 0 16px 48px rgba(0,70,97,0.14);
    font-family: 'Montserrat', Helvetica, Arial, sans-serif;
    font-weight: 500;
}
.ee-booking .label {
    font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
    color: #4a5a63; margin-bottom: 4px;
    font-weight: 500;
}
.ee-booking .strike-row {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.ee-booking .strike {
    color: #4a5a63; text-decoration: line-through; font-size: 14px;
}
.ee-booking .save {
    font-size: 11px; font-weight: 700; letter-spacing: 0.04em; color: #fff;
    background: #EC5A5B; padding: 3px 8px; border-radius: 4px;
}
.ee-booking .price {
    font-size: 34px; font-weight: 700; color: #004661; line-height: 1; margin-top: 6px;
}
.ee-booking .price .pp { font-size: 13px; font-weight: 500; color: #4a5a63; }
/* "per night" suffix after the new price — same look as the "from" prefix
   (see zh-mr-aside__from / price__from) but upright (regular), not italic. */
.ee-booking .zh-mr-aside__pernight,
.ee-booking .price .price__pernight {
    font-weight: 500;
    font-size: 10.8px;
    font-style: italic;
    text-transform: uppercase;
    color: #4a5a63;
    letter-spacing: 0.08em;
    align-self: baseline;
    white-space: nowrap;
}
/* Tight gap to the price. Pill: negative margin trims the 8px flex gap of
   .zh-mr-aside__prices. Plain price: small margin (the literal space between
   the amount and the span is removed in the markup). */
.ee-booking .zh-mr-aside__pernight { margin-left: -4px; }
.ee-booking .price .price__pernight { margin-left: 4px; }
.ee-booking--has-member .zh-mr-aside__pernight,
.ee-booking--has-member .price .price__pernight { font-size: 9.9px; }
/* "from" prefix matches the booking-row labels (Travel dates / Room): 10px,
   upright — overrides the member-rate mu-plugin's 12px italic. */
.tours-v2-page .ee-booking .zh-mr-aside__from,
.tours-v2-page .ee-booking .price .price__from {
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
}
/* Halve the gap between "from" and the old price in the pill (negative margin
   trims the 8px flex gap of .zh-mr-aside__prices). */
.tours-v2-page .ee-booking .zh-mr-aside__from { margin-right: -3px; }
/* Promocode ticket in the booking baige (replaces "Book now" for promo deals) —
   same red-dashed ticket + side dots as the promo section, stacked: code,
   Copy, Apply now. */
.ee-booking .bk-promo-wrap {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ee-booking .bk-promo {
    position: relative;
    background: #FFF7F6;
    border: 2px dashed #EC5A5B;
    border-radius: 12px;
    padding: 8px 16px;
    text-align: center;
}
.ee-booking .bk-promo::before,
.ee-booking .bk-promo::after {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    background: #fff;
    border: 2px dashed #EC5A5B;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    box-sizing: border-box;
}
.ee-booking .bk-promo::before { left: -9px; }
.ee-booking .bk-promo::after  { right: -9px; }
.ee-booking .bk-promo__code {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 19.8px;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    color: #EC5A5B;
    line-height: 1.1;
    text-align: center;
    user-select: all;
}
.ee-booking .bk-promo-actions {
    display: flex;
    gap: 8px;
}
.ee-booking .bk-promo-wrap .v2-promo__copy,
.ee-booking .bk-promo-wrap .v2-promo__apply {
    flex: 1 1 0;
    width: auto;
    text-align: center;
    box-sizing: border-box;
}
.ee-booking .from { font-size: 12px; color: #4a5a63; margin-top: 2px; font-weight: 400; }
.ee-booking .bk-rows { margin: 18px 0 6px; }
.ee-booking .bk-row {
    display: flex; justify-content: space-between; align-items: center;
    width: 100%;
    padding: 12px 0; margin: 0;
    border-bottom: 1px solid #e5e0d6; font-size: 13px;
    text-align: left;
}
.ee-booking .bk-row:last-of-type { border-bottom: none; }
.ee-booking .bk-row:first-child { padding-bottom: 6px; }
.ee-booking .bk-row:last-child { padding-top: 6px; }
.ee-booking .bk-row .k {
    color: #4a5a63; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
    margin: 0; padding: 0; text-align: left; flex: 0 0 auto;
}
.ee-booking .bk-row .v {
    font-weight: 600;
    margin: 0; padding: 0; text-align: right; flex: 0 0 auto;
}
/* "Expired" stamp — stands in for the Guests and Room rows on a Last-minute
   deal whose travel dates have passed. Deliberately not button-shaped: flat
   brand-Gray ground, dashed edge, small uppercase type, no hover and no
   pointer. It reads as a status, so it cannot be mistaken for the CTA sitting
   under it — which is untouched. */
.ee-booking .bk-expired {
    margin-top: 10px;
    padding: 9px 14px;
    background: #F0EDE8;
    border: 1px dashed #D6CFC4;
    border-radius: 8px;
    color: #7A8A91;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-align: center;
    cursor: default;
}
.ee-booking .btn-primary {
    width: 100%; margin-top: 12px;
    background: #EC5A5B; color: #fff;
    padding: 8px 18px; border-radius: 8px;
    font-size: 13px; font-weight: 700; line-height: 1.4;
    border: none; cursor: pointer;
    transition: background .15s ease;
    text-align: center; display: block; text-decoration: none;
    font-family: inherit;
}
.ee-booking .btn-primary:hover { background: #d8484a; color: #fff; }

@media (max-width: 900px) {
    .tours-v2-page section.ee-hero {
        height: auto; min-height: 380px;
        padding-bottom: 24px;
    }
    .ee-hero-inner { padding: 32px 24px; }
    .tours-v2-page .ee-title { font-size: clamp(28px, 8vw, 44px); }
    .ee-booking {
        position: static; transform: none; margin: 0 auto;
        width: calc(100% - 32px);
        max-width: 480px;
    }
}

.tours-v2-page section,
.tours-v2-page header.v2-titlebar {
    background: #FFFFFF;
    border-radius: var(--v2-radius);
    padding: 28px 32px;
    margin: 0 0 18px;
    box-shadow: 0 6px 20px #E0EBF3;
}

.tours-v2-page .v2-section-title {
    font-size: 26px;
    line-height: 1.15;
    margin: 0 0 18px;
    font-weight: 700;
    color: var(--v2-ink);
}

.tours-v2-page .v2-section-title--italic {
    font-family: 'GFS Didot', Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-weight: 400;
    font-size: 48px;
    line-height: 1.1;
    letter-spacing: -0.01em;
    color: #004661;
}

/* 1. Title bar
------------------------------------------------------------ */
.tours-v2-page header.v2-titlebar {
    background: transparent;
    box-shadow: none;
    padding: 8px 0 6px;
}

.v2-titlebar__title {
    font-family: 'Montserrat', Helvetica, Arial, sans-serif;
    font-size: 32px;
    line-height: 1.2;
    margin: 0 0 8px;
    font-weight: 700;
    color: #004661;
    text-align: left;
}

.v2-titlebar__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 12px;
}

.v2-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border: 1px solid #004661;
    border-radius: 6px;
    color: #004661;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
    text-decoration: none;
    background: #fff;
    transition: background .15s ease, color .15s ease;
}

.v2-tag::before {
    content: '#';
    margin-right: 1px;
}

.v2-tag:hover {
    background: #004661;
    color: #fff;
}

.v2-titlebar__byline {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: var(--v2-ink-soft);
}

.v2-byline-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: var(--v2-accent);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .02em;
    flex-shrink: 0;
}

.v2-byline-sep { margin: 0 4px; color: var(--v2-ink-soft); }
.v2-byline-rating-num { font-weight: 700; color: var(--v2-ink); }
.v2-byline-star { color: var(--v2-ink); }
.v2-byline-reviews { color: var(--v2-ink-soft); }

/* 2. Hero + price card
------------------------------------------------------------ */
.tours-v2-page .v2-hero {
    position: relative;
    padding: 0;
    overflow: visible;
    background: transparent;
    box-shadow: none;
    border-radius: var(--v2-radius);
    margin-bottom: 28px;
}

.v2-hero__image { width: 100%; }

.v2-hero__image img {
    display: block;
    width: 100%;
    height: 240px;
    object-fit: cover;
    border-radius: var(--v2-radius-sm);
}

.v2-pricecard {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 185px;
    background: #FFFFFF;
    border-radius: var(--v2-radius-sm);
    padding: 14px 12px 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,.16);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.v2-pricecard__pricing { display: flex; flex-direction: column; gap: 2px; }

.v2-pricecard__top-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.v2-pricecard__strike {
    color: var(--v2-ink-soft);
    text-decoration: line-through;
    font-size: 13px;
    font-weight: 500;
}

.v2-pricecard__save {
    display: inline-block;
    padding: 2px 8px;
    background: var(--v2-accent);
    color: #fff;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .03em;
}

.v2-pricecard__price-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.v2-pricecard__from {
    font-size: 11px;
    font-weight: 600;
    color: var(--v2-ink-soft);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.v2-pricecard__amount {
    font-family: 'Montserrat', Helvetica, Arial, sans-serif;
    font-size: 30px;
    font-weight: 600;
    color: var(--v2-ink);
    line-height: 1;
}

.v2-pricecard__basis {
    font-size: 12px;
    color: var(--v2-ink-soft);
    margin-top: 2px;
    line-height: 1.35;
}

.v2-pricecard__section {
    border: 1px solid var(--v2-rule);
    border-radius: 8px;
    padding: 8px 10px;
}

.v2-pricecard__section-label {
    font-size: 10px;
    font-weight: 700;
    color: var(--v2-ink-soft);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.v2-pricecard__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.v2-pricecard__pill {
    display: inline-block;
    padding: 3px 8px;
    background: #fff;
    border: 1px solid var(--v2-rule);
    border-radius: 999px;
    font-size: 11px;
    color: var(--v2-ink);
}

.v2-pricecard__guests {
    font-size: 13px;
    color: var(--v2-ink);
    line-height: 1.4;
}

.v2-pricecard__cta {
    display: block;
    text-align: center;
    padding: 10px 14px;
    background: var(--v2-accent);
    color: #fff;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: background .15s ease;
}
.v2-pricecard__cta:hover { background: #c44849; color: #fff; }

.v2-pricecard__action--full { width: 100%; }

.v2-pricecard__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 7px 10px;
    background: #fff;
    border: 1px solid var(--v2-rule);
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    color: var(--v2-ink);
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
.v2-pricecard__action:hover { background: var(--v2-section); }
.v2-pricecard__action svg { flex-shrink: 0; }
.v2-pricecard__action.favorite-saved {
    color: var(--v2-accent);
    border-color: var(--v2-accent);
}
.v2-pricecard__action.favorite-saved svg path { fill: var(--v2-accent); stroke: var(--v2-accent); }

/* 3. 4 quick-fact tiles
------------------------------------------------------------ */
.v2-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.v2-tile {
    background: #FFFFFF;
    border: 1px solid #E5E0D6;
    border-radius: 14px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    box-shadow: none;
}

.v2-tile__icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #F0EDE8;
    color: #004661;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}
.v2-tile__icon svg {
    width: 22px; height: 22px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.v2-tile__icon svg polygon { fill: currentColor; stroke: currentColor; }

.v2-tile__name {
    font-size: 17px;
    font-weight: 700;
    color: #004661;
    line-height: 1.3;
    margin-bottom: 4px;
}

.v2-tile__value {
    font-size: 14px;
    font-weight: 400;
    color: #4a5a63;
    line-height: 1.55;
    margin-top: 0;
}

.v2-tile__inline-star {
    color: #F2B100;
    font-size: 14px;
    margin-left: 2px;
}

/* 4. Why we love it
------------------------------------------------------------ */
.tours-v2-page .v2-why {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    margin: 40px auto;
    max-width: 900px;
}

.v2-why__body {
    background: transparent;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
    font-size: 17px;
    line-height: 1.75;
    color: #1a2a33;
}
.v2-why__body p { margin: 0 0 22px; }
.v2-why__body p:last-child { margin-bottom: 0; }

.v2-why__subheading {
    font-family: 'GFS Didot', Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-weight: 400;
    font-size: 26px;
    color: #004661;
    margin: 28px 0 14px;
    line-height: 1.2;
}
.v2-why__subheading:first-of-type { margin-top: 0; }

/* 5. Pictures gallery
------------------------------------------------------------ */
.tours-v2-page .v2-pictures {
    background: #FFFFFF;
    box-shadow: none;
    border-radius: 0;
    padding: 40px 32px;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.v2-pictures__grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: 240px 240px;
    gap: 12px;
    max-width: 1122px;
    margin: 0 auto;
}
.v2-pic {
    display: block;
    background-size: cover;
    background-position: center;
    border-radius: 8px;
}
.v2-pic--main {
    grid-row: span 2;
    border-radius: 14px;
}
.v2-pictures__caption {
    max-width: 1122px;
    margin: 16px auto 0;
    font-family: 'GFS Didot', Georgia, 'Times New Roman', serif;
    font-style: italic;
    color: #4a5a63;
    font-size: 14px;
    text-align: right;
    cursor: pointer;
}

/* 6. What's inside the price
------------------------------------------------------------ */
.tours-v2-page .v2-included {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 12px 32px;
    margin-left: 0;
    margin-right: 0;
}
.v2-included__grid {
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 64px;
}
.v2-included__heading {
    font-family: 'GFS Didot', Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 32px;
    line-height: 1.2;
    color: #004661;
    align-self: center;
}
.v2-included__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.v2-included__list li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 16px 0;
    font-size: 16px;
    color: var(--v2-ink);
    line-height: 1.5;
    border-bottom: 1px solid #E5E0D6;
}
.v2-included__list li::before {
    content: '\2726';
    color: #EC5A5B;
    font-size: 14px;
    margin-top: 2px;
    flex-shrink: 0;
}
.v2-included__list li:first-child { padding-top: 0; }
.v2-included__list li:last-child { padding-bottom: 0; border-bottom: none; }

@media (max-width: 720px) {
    .v2-included__grid { grid-template-columns: 1fr; gap: 16px; }
}

/* 7. Choose your villa
------------------------------------------------------------ */
.tours-v2-page .v2-villas {
    background: #FFFFFF;
    box-shadow: none;
    border-radius: 0;
    padding: 40px 32px;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.v2-section-title--center { text-align: center; }
.v2-villas__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1122px;
    margin: 0 auto;
}
/* Centre the card when there's only one room option. */
.v2-villas__grid:has(> .v2-villa:only-child) {
    grid-template-columns: minmax(0, 364px);
    justify-content: center;
}
/* Centre the pair when there are exactly two room options (2nd child is also
   the last) — otherwise they'd sit in the left two of three columns. */
.v2-villas__grid:has(> .v2-villa:nth-child(2):last-child) {
    grid-template-columns: repeat(2, minmax(0, 364px));
    justify-content: center;
}
.v2-villa {
    position: relative;
    background: #FFFFFF;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #E5E0D6;
    box-shadow: none;
}
.v2-villa--selected {
    border-color: #004661;
    box-shadow: 0 0 0 2px #004661;
}
.v2-villa__image {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
}
.v2-villa__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.v2-villa__tag {
    position: absolute;
    top: 12px; left: 12px;
    background: #fff;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.v2-villa__tag--included { color: #004661; }
.v2-villa__tag--upgrade { color: #EC5A5B; }
.v2-villa__body { padding: 22px; }
.tours-v2-page .v2-villa__title {
    font-family: 'GFS Didot', Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-weight: 400;
    font-size: 24px;
    color: #004661;
    margin: 0 0 8px;
}
.tours-v2-page .v2-villa__desc {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    color: #4a5a63;
    margin: 0;
}
.v2-villa__link {
    display: inline-block;
    margin-top: 16px;
    font-size: 14px;
    font-weight: 600;
    color: #EC5A5B;
    text-decoration: none;
}
.v2-villa__link:hover { text-decoration: underline; }

/* 8. Itinerary
------------------------------------------------------------ */
.tours-v2-page .v2-itinerary {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 24px 0;
}
.v2-itinerary__lead {
    text-align: center;
    max-width: 600px;
    margin: -8px auto 16px;
    font-size: 15px;
    color: #4a5a63;
}
.v2-itinerary__days {
    max-width: 900px;
    margin: 0 auto;
}
.v2-itinerary__day {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 32px;
    padding: 28px 0 10px;
    border-bottom: 1px solid #E5E0D6;
    align-items: baseline;
}
.v2-itinerary__day:last-child { border-bottom: 0; }
.v2-itinerary__day-num {
    font-family: 'GFS Didot', Georgia, 'Times New Roman', serif;
    font-style: italic;
    color: #EC5A5B;
    font-size: 36px;
    line-height: 1;
}
.v2-itinerary__day-title {
    font-size: 18px;
    font-weight: 700;
    color: #004661;
    margin: 0 0 6px;
}
.v2-itinerary__day-text {
    font-size: 15px;
    color: #4a5a63;
    line-height: 1.6;
    margin: 0;
}

/* 9. Where you'll be
------------------------------------------------------------ */
.tours-v2-page .v2-where {
    background: #FFFFFF;
    box-shadow: none;
    border-radius: 0;
    padding: 40px 32px;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.v2-where__card {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 32px;
    background: #fff;
    padding: 32px;
    border-radius: 14px;
    border: 1px solid #E5E0D6;
    max-width: 1122px;
    margin: 0 auto;
}
.v2-where__map {
    border-radius: 8px;
    min-height: 280px;
    overflow: hidden;
}
.v2-where__map iframe {
    width: 100%;
    height: 100%;
    min-height: 280px;
    border: 0;
    display: block;
}
.v2-where__label {
    font-size: 14px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #4a5a63;
    font-weight: 600;
    margin: 0 0 12px;
}
.v2-where__place {
    font-family: 'GFS Didot', Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-size: 28px;
    color: #004661;
    margin: 0 0 20px;
}
.v2-where__poi {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px dashed #E5E0D6;
    font-size: 14px;
}
.v2-where__poi:last-child { border-bottom: 0; }
.v2-where__poi-km {
    color: #EC5A5B;
    font-weight: 600;
}

/* 10. FAQ
------------------------------------------------------------ */
.tours-v2-page .v2-faqs {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 24px 0;
}
.v2-faqs__list {
    max-width: 760px;
    margin: 0 auto;
}
.v2-faq {
    border-bottom: 1px solid #E5E0D6;
    padding: 22px 0;
}
.v2-faq summary {
    cursor: pointer;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    font-size: 17px;
    font-weight: 600;
    color: #004661;
}
.v2-faq summary::-webkit-details-marker { display: none; }
.v2-faq summary::after {
    content: '+';
    font-size: 24px;
    font-weight: 300;
    color: #EC5A5B;
    flex-shrink: 0;
    line-height: 1;
}
.v2-faq[open] summary::after { content: '\2212'; }
.v2-faq__a {
    margin: 14px 0 0;
    font-size: 15px;
    line-height: 1.7;
    color: #4a5a63;
}

/* 11. Promo banners
------------------------------------------------------------ */
.v2-promos {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.v2-promo {
    border-radius: var(--v2-radius-sm);
    padding: 18px 20px;
    color: #fff;
}
.v2-promo--green { background: #3D8C71; }
.v2-promo--blue  { background: #4A7BC8; }
.v2-promo__code {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 4px;
    opacity: .9;
}
.v2-promo__copy {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
}
.v2-promo__disclaimer {
    display: block;
    font-size: 11px;
    opacity: .85;
    margin-top: 4px;
}

/* 12. Related — "You might also love"
------------------------------------------------------------ */
.tours-v2-page .v2-related {
    background: #F0EDE8;
    box-shadow: none;
    border-radius: 0;
    padding: 48px 32px;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.v2-related__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-width: 1122px;
    margin: 0 auto;
}
.v2-related__grid > *,
.v2-related__grid .offer-card {
    width: 100%;
    max-width: 100%;
}
.v2-related__grid .offer-card {
    border: 1px solid #E5E0D6;
    border-radius: 14px;
    box-shadow: none;
    overflow: hidden;
}

/* 13. Anchor menu
------------------------------------------------------------ */
.tours-v2-page + .v2-anchor-menu {
    background: var(--v2-card);
    border-top: 1px solid var(--v2-rule);
}

/* Responsive
------------------------------------------------------------ */
@media (max-width: 720px) {
    .tours-v2-page section,
    .tours-v2-page header.v2-titlebar { padding: 20px 18px; }
    /* Sprint 74: Quick-facts tiles stack one per row, each a horizontal
       rectangle — icon on the left, title + subtitle stacked on the right. */
    .v2-tiles { grid-template-columns: 1fr; gap: 10px; }
    .v2-tile {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-areas:
            "icon name"
            "icon value";
        align-items: center;
        column-gap: 14px;
        row-gap: 2px;
        padding: 14px 16px;
    }
    .v2-tile__icon  { grid-area: icon;  align-self: center; margin-bottom: 0; }
    .v2-tile__name  { grid-area: name;  margin-bottom: 0; }
    .v2-tile__value { grid-area: value; }
    .v2-pictures__grid { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 160px); }
    .v2-pic--main { grid-row: span 2; grid-column: span 2; }
    .v2-included__groups { grid-template-columns: 1fr; gap: 18px; }
    .v2-villas__grid { grid-template-columns: 1fr; }
    .v2-where__card { grid-template-columns: 1fr; padding: 20px; }
    .v2-promos { grid-template-columns: 1fr; }
    .v2-related__grid { grid-template-columns: 1fr; }
    .v2-hero__image img { height: 150px; }
    .tours-v2-page .v2-hero { margin-bottom: 12px; }
    .v2-pricecard {
        position: static;
        width: 100%;
        margin-top: 12px;
        top: auto;
        right: auto;
    }
    .v2-section-title { font-size: 22px; }
    .v2-section-title--italic { font-size: 24px; }
}

/* =============================================
   SEO/AEO audit fixes (2026-05-21)
   Hero <img> + overlay (H4), gallery <img> (H4 + H5),
   subtitle moved out of <h1> (H3)
   ============================================= */
.ee-hero__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.ee-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.7) 100%);
    z-index: 1;
    pointer-events: none;
}
.tours-v2-page section.ee-hero .ee-hero-inner {
    position: relative;
    z-index: 2;
}
.tours-v2-page section.ee-hero .ee-booking {
    z-index: 2;
}

.tours-v2-page .ee-title__subtitle {
    font-family: 'GFS Didot', Georgia, serif;
    font-style: italic;
    font-weight: 400;
    color: #ffd5d5;
    font-size: clamp(28px, 3.4vw, 48px);
    line-height: 1.1;
    letter-spacing: -0.02em;
    max-width: 900px;
    margin: -20px 0 20px;
    padding: 0;
    text-align: left;
}
.tours-v2-page .ee-title__subtitle .ee-emoji {
    font-style: normal;
    font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', 'Twemoji Mozilla', sans-serif;
    display: inline-block;
}

.v2-pic { overflow: hidden; }
.v2-pic > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

/* Breadcrumbs — quiet trail above the H1 (was a heavy header band) */
.single-tours .breadcrumbs-wrapper {
    padding-top: 4px;
    padding-bottom: 4px;
}
.single-tours .phys-breadcrumb {
    font-family: 'Montserrat', Helvetica, Arial, sans-serif;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 400;
    letter-spacing: 0.02em;
    color: #8a96a0;
}
.single-tours .phys-breadcrumb li,
.single-tours .phys-breadcrumb li a {
    color: #8a96a0;
    font-weight: 400;
}
.single-tours .phys-breadcrumb li a:hover {
    color: #004661;
    text-decoration: underline;
}
.single-tours .phys-breadcrumb li:last-child {
    color: #4a5a63;
}

/* 4.4 Deal expired — the Member rate slot on a Last-minute deal whose travel
   dates have passed. Same white band and centred Didot title as every other
   section; the lead copies .v2-promo__lead so the expired promo message and this
   one read as one thing.
------------------------------------------------------------ */
.tours-v2-page .v2-expired {
    padding: 12px 0;
    margin: 40px auto;
}
.tours-v2-page .v2-expired .v2-section-title {
    margin-bottom: 4px;
}
.tours-v2-page .v2-expired__lead {
    text-align: center;
    color: #4a5a63;
    font-size: 14px;
    line-height: 1.5;
    margin: 0 auto;
    max-width: 640px;
}

/* 4.5 Perks at checkout — promo codes (coupon-style)
------------------------------------------------------------ */
.tours-v2-page .v2-promo {
    padding: 12px 0;
    margin: 40px auto;
}
/* One promo code only: the white card spans just quick facts 2–3 — the middle
   two tiles plus the 12px gap between them = (50% - 6px) of the row — centred. */
.tours-v2-page section.v2-promo--single {
    max-width: calc(50% - 6px);
    margin-left: auto;
    margin-right: auto;
}
.tours-v2-page .v2-promo .v2-section-title {
    margin-bottom: 4px;
}
.tours-v2-page .v2-promo__lead {
    text-align: center;
    color: #4a5a63;
    font-size: 14px;
    line-height: 1.5;
    margin: 0 auto 14px;
    max-width: 640px;
}
.tours-v2-page .v2-promo__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    max-width: 70%;
    margin: 0 auto;
}
/* A single promo code: a compact, centred card (kept at the wider size). */
.tours-v2-page .v2-promo__list--single {
    grid-template-columns: auto;
    justify-content: center;
}
.tours-v2-page .v2-promo__list--single .v2-promo__card {
    width: fit-content;
    max-width: 460px;
    justify-content: flex-start;   /* pack snugly instead of spreading to the edges */
    gap: 12px;                      /* half the text↔Copy space (was 24px) */
}
/* Card: the eyebrow + code (DEALS) stacked on the LEFT, Copy button on the RIGHT. */
.tours-v2-page .v2-promo__card {
    position: relative;
    background: #FFF7F6;
    border: 2px dashed #EC5A5B;
    border-radius: 12px;
    padding: 12px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    min-height: 64px;
}
.tours-v2-page .v2-promo__card-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
    text-align: left;
}
.tours-v2-page .v2-promo__card::before,
.tours-v2-page .v2-promo__card::after {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    background: #fff;
    border: 2px dashed #EC5A5B;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    box-sizing: border-box;
}
.tours-v2-page .v2-promo__card::before { left: -9px; }
.tours-v2-page .v2-promo__card::after  { right: -9px; }
.tours-v2-page .v2-promo__eyebrow {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #4a5a63;
    white-space: nowrap; /* keep "Code · Save 10% (up to £15)" on one line */
}
.tours-v2-page .v2-promo__code-value {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 20px;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    color: #EC5A5B;
    line-height: 1.1;
    user-select: all;
}
.tours-v2-page .v2-promo__copy {
    appearance: none;
    border: none;
    background: #EC5A5B;
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.3px;
    padding: 8px 20px;
    border-radius: 8px;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color 0.15s ease, transform 0.1s ease;
}
.tours-v2-page .v2-promo__copy:hover  { background: #d8484a; }
.tours-v2-page .v2-promo__copy:active { transform: scale(0.97); }
.tours-v2-page .v2-promo__copy.is-copied { background: #2f7d4f; }
/* Copy (red) + Apply now (blue) side by side, mirroring the promo-hub preview. */
.tours-v2-page .v2-promo__actions {
    display: flex;
    align-items: stretch;   /* both buttons take the same (taller) height, like the baige */
    gap: 8px;
    flex-shrink: 0;
}
/* Copy + Apply now: snug to their text, with an identical box so their heights
   match (Copy is a <button>, Apply an <a> — inline-flex + line-height:1 on both
   removes the height difference). */
.tours-v2-page .v2-promo__actions .v2-promo__copy,
.tours-v2-page .v2-promo__actions .v2-promo__apply {
    flex: 0 0 auto;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 10px;   /* half the side space so the buttons aren't so wide */
    min-width: 94px;     /* snug equal width, same as the baige buttons */
}
.tours-v2-page .v2-promo__apply {
    appearance: none;
    border: none;
    background: #004661;
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.3px;
    padding: 8px 20px;
    border-radius: 8px;
    cursor: pointer;
    flex-shrink: 0;
    text-decoration: none;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.15s ease, transform 0.1s ease;
}
.tours-v2-page .v2-promo__apply:hover  { background: #00354a; }
.tours-v2-page .v2-promo__apply:active { transform: scale(0.97); }
.tours-v2-page .v2-promo__fine {
    text-align: center;
    color: #4a5a63;
    font-size: 12px;
    font-style: italic;
    margin: 12px auto 0;
}
/* Sprint 124 — the cap footnote for the tiered codes, whose eyebrow reads
   "SAVE 10%*". It sits OUTSIDE the dashed ticket, centred beneath it, so the card
   itself keeps the layout it has always had. Carries .v2-promo__eyebrow too, so the
   type matches that line exactly; everything here is layout only. */
.tours-v2-page .v2-promo__footnote {
    display: block;
    text-align: center;
    margin: 10px auto 0;
    text-transform: none;   /* a sentence, not a label — the eyebrow uppercases */
    letter-spacing: 0.2px;
}

@media (max-width: 720px) {
    .tours-v2-page section.v2-promo--single { max-width: none; }
    .tours-v2-page .v2-promo__list { grid-template-columns: 1fr; }
    .tours-v2-page .v2-promo__card {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        padding: 14px 18px;
        min-height: 0;
    }
    .tours-v2-page .v2-promo__card::before,
    .tours-v2-page .v2-promo__card::after { display: none; }
    .tours-v2-page .v2-promo__code-value { font-size: 18px; }
    .tours-v2-page .v2-promo__copy { width: 100%; text-align: center; padding: 10px 16px; }
    .tours-v2-page .v2-promo__actions { display: flex; width: 100%; gap: 8px; }
    .tours-v2-page .v2-promo__actions .v2-promo__copy,
    .tours-v2-page .v2-promo__actions .v2-promo__apply {
        flex: 1 1 0; width: auto; text-align: center; padding: 10px 16px;
    }
}

/* =====================================================
   Sprint 8.3 — Section bands with alternating colours.
   Anchor: "What's inside the price" is white. Sections
   become full-bleed bands flush against each other.
   "Why we love it" stays as it was (transparent over the
   page beige) — visually it joins the beige bands.
   ===================================================== */
.tours-v2-page .v2-villas,
.tours-v2-page .v2-included,
.tours-v2-page .v2-pictures,
.tours-v2-page .v2-itinerary,
.tours-v2-page .v2-where,
.tours-v2-page .v2-faqs,
.tours-v2-page .v2-related {
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 48px 32px;
}
.tours-v2-page .v2-villas     { background: #FAFAF7; }
.tours-v2-page .v2-included   { background: #FFFFFF; }
.tours-v2-page .v2-pictures   { background: #FAFAF7; }
.tours-v2-page .v2-itinerary  { background: #FFFFFF; }
.tours-v2-page .v2-where      { background: #FAFAF7; }
.tours-v2-page .v2-faqs       { background: #FFFFFF; }
.tours-v2-page .v2-related    { background: #FAFAF7; }

/* =====================================================
   Sprint 11 — Tighten band vertical padding (2026-05-22)
   Halves the top/bottom padding (48px -> 24px) on five
   bands so less empty space sits between each band edge
   and its content. Horizontal padding (32px) unchanged.
   "Where you'll be" and "Choose your room" keep 48px.
   Later in source + equal specificity to the Sprint 8.3
   band rule, so these win without !important.
   ===================================================== */
.tours-v2-page .v2-included,
.tours-v2-page .v2-pictures,
.tours-v2-page .v2-itinerary,
.tours-v2-page .v2-faqs,
.tours-v2-page .v2-related {
    padding-top: 24px;
    padding-bottom: 24px;
}

/* "Where you'll be" — remove the empty strip below the map.
   (Sprint 11.1) The card is a 2-col grid (map | POI list). The map
   cell stretches to the taller column, but the click-to-load button
   only had `min-height`, so it stayed short and left white space
   beneath it. Stretch the button to fill the cell — same as the
   loaded <iframe>, which already has height:100%. Then the only gap
   below the map is the card frame's bottom padding (32px -> 16px). */
.tours-v2-page .v2-where__map .zh-map-load {
    height: 100%;
}
.tours-v2-page .v2-where__card {
    padding-bottom: 16px;
}

/* =====================================================
   Sprint 14 — Tighten the gap above "Choose your room"
   (2026-05-22)
   The gap between the end of "Why we love it" (its last
   subheading, "Best for") and the "Choose your room"
   title is the Why section's bottom margin (40px) plus
   the room band's top padding (48px) = 88px. Halve both
   so the total gap becomes 44px.
   ===================================================== */
.tours-v2-page .v2-why {
    margin-bottom: 20px;
}
.tours-v2-page .v2-villas {
    padding-top: 24px;
}

/* Gallery caption — now a <button>; strip UA chrome, keep the italic styling
   from the existing .v2-pictures__caption rule above. */
.tours-v2-page button.v2-pictures__caption {
    display: block;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    background: none;
    border: 0;
    padding: 0;
}
.tours-v2-page button.v2-pictures__caption:hover {
    color: #EC5A5B;
    text-decoration: underline;
}

/* Photo lightbox — full-screen viewer opened from the gallery / caption */
.v2-lightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.v2-lightbox[hidden] { display: none; }
.v2-lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 32, 0.93);
    border: 0;
    cursor: zoom-out;
}
.v2-lightbox__stage {
    position: relative;
    z-index: 1;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
.v2-lightbox__img {
    max-width: min(1100px, 86vw);
    max-height: 80vh;
    object-fit: contain;
    border-radius: 8px;
    display: block;
    background: #1f2a36;
}
.v2-lightbox__counter {
    color: rgba(255, 255, 255, 0.85);
    font-family: 'Montserrat', Helvetica, Arial, sans-serif;
    font-size: 13px;
    letter-spacing: 0.06em;
}
.v2-lightbox__close,
.v2-lightbox__nav {
    position: absolute;
    z-index: 2;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    transition: background 0.15s ease;
}
.v2-lightbox__close:hover,
.v2-lightbox__nav:hover { background: rgba(255, 255, 255, 0.30); }
.v2-lightbox__close {
    top: 20px;
    right: 24px;
    width: 44px;
    height: 44px;
    font-size: 30px;
}
.v2-lightbox__nav {
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    font-size: 30px;
}
.v2-lightbox__nav--prev { left: 20px; }
.v2-lightbox__nav--next { right: 20px; }

@media (max-width: 720px) {
    .v2-lightbox { padding: 12px; }
    .v2-lightbox__nav { width: 40px; height: 40px; font-size: 24px; }
    .v2-lightbox__nav--prev { left: 8px; }
    .v2-lightbox__nav--next { right: 8px; }
    .v2-lightbox__close { top: 10px; right: 10px; }
    .v2-lightbox__img { max-width: 90vw; }
}
