/* Voyage Detail Page: hero header, rounded key-specifications dashboard,
   route strip & day-by-day itinerary, activity & expedition context cards,
   price trend chart, cabin offers table, packing promo, and sticky offer bar. */

.voyage-hero-header {
    margin: 12px 0 24px;
}

.voyage-hero-header.has-photo {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 28px;
    align-items: center;
}

.voyage-hero-media {
    position: relative;
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--sh-card);
    border: 1px solid var(--line);
    background: var(--card);
}

.voyage-hero-media[hidden] {
    display: none !important;
}

.voyage-hero-media a {
    display: block;
    cursor: zoom-in;
}

.voyage-hero-media img {
    display: block;
    width: 100%;
    height: 220px;
    object-fit: cover;
    transition: transform 0.25s ease;
}

.voyage-hero-media:hover img {
    transform: scale(1.02);
}

.voyage-hero-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.voyage-hero-top {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.voyage-hero-month-pill {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
    background: var(--accent-soft);
    padding: 3px 10px;
    border-radius: var(--r-pill);
    text-decoration: none;
    transition: background 0.15s ease;
}

.voyage-hero-month-pill:hover {
    background: rgba(0, 95, 204, 0.2);
    text-decoration: none;
}

.voyage-hero-title {
    margin: 0;
    font: 400 32px/1.2 var(--f-serif);
    color: var(--ink);
    letter-spacing: -0.015em;
}

.voyage-hero-subtitle {
    margin: 0;
    font-size: 15px;
    color: var(--muted);
    line-height: 1.5;
}

.voyage-hero-subtitle strong {
    color: var(--ink);
}

.voyage-hero-subtitle a {
    color: var(--accent);
    text-decoration: none;
    transition: color 0.15s ease;
}

.voyage-hero-subtitle a:hover {
    color: var(--accent-dark);
    text-decoration: underline;
}

/* Key Specifications Dashboard Card — unified --r-lg corners while keeping overflow: visible for tooltips */
.voyage-specs-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    margin: 0 0 32px;
    overflow: visible;
}

.specs-card-layout {
    display: grid;
    grid-template-columns: 1fr;
    background: var(--line);
    border-radius: calc(var(--r-lg) - 1px);
    overflow: visible;
}

.voyage-specs-card.has-ship-photo .specs-card-layout {
    grid-template-columns: 1fr 240px;
    gap: 1px;
}

.specs-grid {
    display: grid;
    grid-template-columns: 1.55fr 1fr 1fr 1fr;
    gap: 1px;
    background: var(--line);
    border-radius: calc(var(--r-lg) - 1px);
    overflow: visible;
}

.voyage-specs-card.has-ship-photo .specs-grid {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.spec-cell {
    background: var(--card);
    padding: 10px 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    position: relative;
    overflow: visible;
}

.spec-cell:first-child {
    border-top-left-radius: calc(var(--r-lg) - 1px);
}

.spec-cell:nth-child(5) {
    border-bottom-left-radius: calc(var(--r-lg) - 1px);
}

.voyage-specs-card:not(.has-ship-photo) .spec-cell:nth-child(4) {
    border-top-right-radius: calc(var(--r-lg) - 1px);
}

.voyage-specs-card:not(.has-ship-photo) .spec-cell:last-child {
    border-bottom-right-radius: calc(var(--r-lg) - 1px);
}

.spec-cell-price {
    background: var(--surface);
}

.spec-label {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.spec-val {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.3;
}

.spec-val .num {
    font-family: var(--f-mono);
    font-variant-numeric: tabular-nums;
}

.spec-val a {
    color: var(--accent);
    text-decoration: none;
    transition: color 0.15s ease;
}

.spec-val a:hover {
    color: var(--accent-dark);
    text-decoration: underline;
}

.spec-subval {
    font-size: 11.5px;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 1px;
}

.spec-subval .icon {
    width: 12px;
    height: 12px;
    color: var(--muted);
}

.spec-subval a {
    color: var(--accent);
    text-decoration: none;
    transition: color 0.15s ease;
}

.spec-subval a:hover {
    color: var(--accent-dark);
    text-decoration: underline;
}

.spec-cell-price .spec-val {
    font-size: 18px;
    line-height: 1.2;
}

.spec-cell-price .spec-val a.spec-price-link {
    color: var(--accent);
    text-decoration: none;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    transition: color .15s ease;
}

.spec-cell-price .spec-val a.spec-price-link:hover {
    color: var(--accent-dark);
    text-decoration: underline;
}

.spec-price-arrow {
    font-size: 14px;
    transition: transform .15s ease;
    display: inline-block;
    text-decoration: none;
}

.spec-cell-price .spec-val a.spec-price-link:hover .spec-price-arrow {
    transform: translateY(2px);
}

#offers {
    scroll-margin-top: 90px;
}

/* Ship Photo Card inside Specs Dashboard — Horizontal 16:10 ratio */
.specs-ship-card {
    background: var(--card);
    display: flex;
    flex-direction: column;
    position: relative;
    border-radius: 0 calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px) 0;
    overflow: hidden;
}

.specs-ship-media {
    display: block;
    position: relative;
    overflow: hidden;
    background: var(--surface);
    aspect-ratio: 16 / 10;
    width: 100%;
}

.specs-ship-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.specs-ship-media:hover img {
    transform: scale(1.04);
}

.specs-ship-zoom {
    position: absolute;
    bottom: 6px;
    right: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(13, 27, 42, 0.72);
    color: #fff;
    padding: 4px 5px;
    border-radius: var(--r-xs);
    pointer-events: none;
}

.specs-ship-zoom .icon {
    width: 13px;
    height: 13px;
}

.specs-ship-meta {
    padding: 6px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    background: var(--subtle-bg);
    border-top: 1px solid var(--line);
    margin-top: auto;
}

.specs-ship-name {
    font-weight: 700;
    font-size: 13px;
    color: var(--ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.specs-ship-link {
    font-size: 12px;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    flex-shrink: 0;
}

.specs-ship-link:hover {
    text-decoration: underline;
}

/* Downward ice-class tooltip inside specs table */
.voyage-specs-card .badge-ice {
    position: relative;
    z-index: 10;
}

.voyage-specs-card .badge-ice:hover,
.voyage-specs-card .badge-ice:focus,
.voyage-specs-card .badge-ice:focus-visible {
    z-index: 50;
}

.voyage-specs-card .badge-ice .ice-tooltip {
    bottom: auto;
    top: calc(100% + 8px);
    transform: translateX(-50%) translateY(-4px);
    z-index: 60;
}

.voyage-specs-card .badge-ice .ice-tooltip::after {
    top: auto;
    bottom: 100%;
    border-top-color: transparent;
    border-bottom-color: var(--dark);
}

.voyage-specs-card .badge-ice:hover .ice-tooltip,
.voyage-specs-card .badge-ice:focus .ice-tooltip,
.voyage-specs-card .badge-ice:focus-visible .ice-tooltip {
    transform: translateX(-50%) translateY(0);
    opacity: 1;
    visibility: visible;
}

/* Route & Day-by-Day Itinerary Layout with Sticky Map on the Right */
.voyage-itinerary-section {
    margin: 0 0 36px;
}

.voyage-itinerary-layout {
    display: block;
}

.voyage-itinerary-layout.has-map {
    display: grid;
    grid-template-columns: 1fr minmax(260px, 350px);
    gap: 28px;
    align-items: start;
}

.voyage-itinerary-main {
    min-width: 0;
}

.route-strip {
    display: flex;
    flex-direction: column;
    margin: 0 0 18px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    overflow: hidden;
}

.route-strip-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 18px;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.route-strip-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.route-strip-compass {
    display: inline-flex;
    align-items: center;
    color: var(--accent);
    line-height: 1;
}

.route-strip-compass .icon {
    width: 14px;
    height: 14px;
}

.route-strip-title {
    font: 700 10.5px/1.2 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: var(--ink-2);
}

.route-strip-count {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: var(--card);
    border: 1px solid var(--line);
    font: 600 11px/1.3 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--ink-2);
}

.route-strip .route-points {
    margin: 0;
    padding: 16px 18px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 6px;
    background: var(--card);
}

.route-point-tag {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    box-sizing: border-box;
    font: 500 13px/1.25 var(--f-sans);
    color: var(--ink);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 5px 12px 5px 11px;
    text-decoration: none;
    transition:
        border-color 0.15s ease,
        background 0.15s ease,
        color 0.15s ease,
        box-shadow 0.15s ease,
        transform 0.15s ease;
}

.route-point-label {
    line-height: 1.25;
}

.route-point-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
    flex-shrink: 0;
}

.route-point-tag.is-endpoint {
    font-weight: 600;
    color: var(--ink);
    background: var(--card);
    border-color: var(--accent-ring);
    box-shadow: 0 1px 2px rgba(13, 27, 42, 0.05);
    padding-left: 6px;
}

.route-point-tag.is-fly {
    font-weight: 600;
    color: var(--ink);
    background: var(--accent-soft);
    border-color: var(--accent-ring);
    padding-left: 6px;
}

.route-point-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: var(--accent-soft);
    color: var(--accent);
    line-height: 1;
    flex-shrink: 0;
}

.route-point-tag.is-fly .route-point-icon {
    background: var(--card);
}

.route-point-icon .icon {
    width: 13px;
    height: 13px;
}

.route-point-ext {
    font-size: 10.5px;
    line-height: 1;
    color: var(--muted);
    opacity: 0.72;
    margin-left: 1px;
    transition: transform 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

a.route-point-tag.is-linked:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent-dark);
    box-shadow: 0 3px 8px rgba(0, 95, 204, 0.10);
    transform: translateY(-1px);
    text-decoration: none;
}

a.route-point-tag.is-linked:hover .route-point-icon {
    background: var(--card);
}

a.route-point-tag.is-linked:hover .route-point-dot {
    box-shadow: 0 0 0 3px var(--card);
}

a.route-point-tag.is-linked:hover .route-point-ext {
    color: var(--accent);
    opacity: 1;
    transform: translate(1px, -1px);
}

.route-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 34px;
    color: var(--muted);
    opacity: 0.65;
    margin: 0;
    line-height: 1;
    flex-shrink: 0;
}

.route-arrow .icon {
    width: 13px;
    height: 13px;
}

.route-disclaimer {
    margin: 0;
    padding: 8.5px 18px;
    background: var(--surface);
    border-top: 1px solid var(--line);
    font: 400 12px/1.45 var(--f-sans);
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 7px;
}

.route-disclaimer-icon {
    display: inline-flex;
    align-items: center;
    color: var(--accent);
    flex-shrink: 0;
}

.route-disclaimer-icon .icon {
    width: 13.5px;
    height: 13.5px;
}

.voyage-itinerary-sidebar {
    position: sticky;
    top: 90px;
    display: flex;
    justify-content: flex-end;
}

.itinerary-map-card {
    margin: 0;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--sh-card);
    padding: 10px;
    width: 100%;
}

.itinerary-map-card a.itinerary-map-link {
    display: block;
    color: inherit;
    text-decoration: none;
    cursor: zoom-in;
}

.itinerary-map-card a.itinerary-map-link:hover {
    text-decoration: none;
}

.itinerary-map-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
    border-radius: var(--r-md);
    overflow: hidden;
    background: var(--surface);
}

.itinerary-map-card img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 460px;
    object-fit: contain;
    border-radius: var(--r-md);
    background: transparent;
    transition: transform 0.22s ease;
}

.itinerary-map-card:hover img {
    transform: scale(1.02);
}

.itinerary-map-caption,
.itinerary-map-card figcaption {
    padding: 10px 4px 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    font: 600 12px/1.2 var(--f-sans);
    color: var(--ink-2);
}

.itinerary-map-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.itinerary-map-icon {
    display: inline-flex;
    align-items: center;
    color: var(--accent);
}

.itinerary-map-icon .icon {
    width: 14px;
    height: 14px;
}

.map-zoom-hint {
    width: 26px;
    height: 26px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--surface);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.map-zoom-hint .icon {
    width: 13px;
    height: 13px;
}

.itinerary-map-card:hover .map-zoom-hint {
    color: var(--accent);
    border-color: color-mix(in srgb, var(--accent) 42%, var(--line));
    background: linear-gradient(0deg, var(--accent-soft), var(--accent-soft)), var(--card);
}

.map-zoom-hint:hover {
    transform: scale(1.06);
}

/* Expedition Log Timeline (.days.exp-days-log) with .sailing-cal-badge Day Signs */
.days {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    margin: 0;
    overflow: hidden;
}

.exp-days-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 18px;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.exp-day-item {
    position: relative;
    border-bottom: 1px solid var(--line);
    transition: background 0.16s ease;
}

.exp-day-item:last-child {
    border-bottom: 0;
}

.exp-day-item[open] {
    background: linear-gradient(180deg, rgba(0, 95, 204, 0.032) 0%, rgba(255, 255, 255, 0) 72px);
}

html[data-theme="dark"] .exp-day-item[open] {
    background: linear-gradient(180deg, rgba(56, 189, 248, 0.055) 0%, rgba(10, 25, 47, 0) 72px);
}

.exp-days-log.has-spine .exp-day-item::before {
    content: '';
    position: absolute;
    left: 46px;
    top: 0;
    bottom: 0;
    width: 1.5px;
    transform: translateX(-50%);
    background: var(--line);
    pointer-events: none;
    z-index: 0;
}

.exp-days-log.has-spine .exp-day-item:first-child::before {
    top: 37px;
}

.exp-days-log.has-spine .exp-day-item:last-child::before {
    bottom: auto;
    height: 37px;
}

.exp-day-summary {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 13px 18px;
    list-style: none;
}

.exp-day-item.is-static .exp-day-summary {
    grid-template-columns: 56px minmax(0, 1fr);
}

details.exp-day-item > summary.exp-day-summary {
    cursor: pointer;
}

details.exp-day-item > summary.exp-day-summary::-webkit-details-marker {
    display: none;
}

details.exp-day-item > summary.exp-day-summary::marker {
    content: '';
}

details.exp-day-item > summary.exp-day-summary:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
    border-radius: 8px;
}

.exp-day-badge {
    align-self: start;
    width: 56px;
    height: 48px;
    flex-shrink: 0;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: var(--surface);
    box-shadow: 0 0 0 3px var(--card);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 0 4px;
    line-height: 1;
    transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

details.exp-day-item > summary.exp-day-summary:hover .exp-day-badge {
    background: var(--card);
    border-color: color-mix(in srgb, var(--accent) 38%, var(--line));
}

.exp-day-item[open] .exp-day-badge,
details.exp-day-item[open] > summary.exp-day-summary:hover .exp-day-badge {
    background: linear-gradient(0deg, var(--accent-soft), var(--accent-soft)), var(--card);
    border-color: color-mix(in srgb, var(--accent) 44%, var(--line));
}

.exp-day-badge-top {
    font: 700 9.5px/1.1 var(--f-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--accent);
}

.exp-day-badge-num {
    font: 800 16px/1.1 var(--f-mono);
    color: var(--ink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.exp-day-badge.is-range .exp-day-badge-num {
    font-size: 13.5px;
    letter-spacing: -0.03em;
}

.exp-day-badge.is-wide .exp-day-badge-num {
    font-size: 12px;
    letter-spacing: -0.05em;
}

.exp-day-badge-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--accent);
}

.exp-day-badge-icon .icon {
    width: 17px;
    height: 17px;
}

.exp-day-head {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.exp-day-title {
    font: 700 15.5px/1.35 var(--f-sans);
    color: var(--ink);
    letter-spacing: -0.01em;
}

.exp-day-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 12px;
}

.exp-day-date,
.exp-day-port {
    display: inline-flex;
    align-items: center;
    gap: 4.5px;
    color: var(--muted);
}

.exp-day-date {
    font: 600 11.5px/1.25 var(--f-mono);
    font-variant-numeric: tabular-nums;
}

.exp-day-port {
    font: 500 12px/1.25 var(--f-sans);
}

.exp-day-date .icon,
.exp-day-port .icon {
    width: 12.5px;
    height: 12.5px;
    color: var(--accent);
    opacity: 0.8;
    flex-shrink: 0;
}

.exp-day-chevron {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.2s ease, background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.exp-day-chevron .icon {
    width: 14px;
    height: 14px;
}

details.exp-day-item > summary.exp-day-summary:hover .exp-day-chevron {
    background: var(--card);
    border-color: color-mix(in srgb, var(--accent) 38%, var(--line));
    color: var(--accent);
}

.exp-day-item[open] .exp-day-chevron,
details.exp-day-item[open] > summary.exp-day-summary:hover .exp-day-chevron {
    transform: rotate(180deg);
    background: linear-gradient(0deg, var(--accent-soft), var(--accent-soft)), var(--card);
    border-color: color-mix(in srgb, var(--accent) 44%, var(--line));
    color: var(--accent);
}

.exp-day-body {
    position: relative;
    z-index: 1;
    padding: 0 22px 18px 88px;
}

.exp-day-body p {
    margin: 0;
    font: 400 14.5px/1.65 var(--f-sans);
    color: var(--ink-2);
    max-width: 72ch;
}

/* Structured Editorial Expedition Activities Section (#activities) */
.voyage-activities-section {
    margin: 0 0 40px;
}

.exp-activities-head {
    align-items: flex-end;
    margin-bottom: 18px;
}

.exp-activities-head-copy {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.exp-activities-summary {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
    font-size: 13.5px;
    line-height: 1.4;
    color: var(--muted);
}

.exp-act-stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.exp-act-stat strong {
    color: var(--ink);
    font-weight: 700;
}

.exp-act-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.exp-act-stat.is-included .exp-act-dot {
    background: var(--ok);
    box-shadow: 0 0 0 3px var(--ok-bg);
}

.exp-act-stat.is-addon .exp-act-dot {
    background: #d97706;
    box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.14);
}

html[data-theme="dark"] .exp-act-stat.is-addon .exp-act-dot {
    background: #fbbf24;
    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.16);
}

/* 6-Track Adaptive Packing Grid (2h + 3v = N => zero orphan half-rows) */
.exp-activities-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
}

.exp-activities-grid--single {
    grid-template-columns: minmax(0, 680px);
}

.vact-card {
    position: relative;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 0;
    gap: 0;
    overflow: hidden;
    box-shadow: var(--sh-card);
    display: flex;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.vact-card--split {
    grid-column: span 3;
    flex-direction: row;
    align-items: stretch;
}

.exp-activities-grid--single > .vact-card--split {
    grid-column: 1 / -1;
}

.vact-card--stack {
    grid-column: span 2;
    flex-direction: column;
}

.vact-card:hover {
    border-color: var(--accent);
    transform: translateY(-2px);
    box-shadow: var(--sh-card-hover);
}

/* Polar Photography & Bathymetric Icon Fallback Stage */
.vact-media {
    position: relative;
    overflow: hidden;
    background: #061c2c;
    flex-shrink: 0;
}

.vact-card--split .vact-media {
    width: 184px;
    min-height: 184px;
    border-right: 1px solid var(--line);
}

.vact-card--stack .vact-media {
    width: 100%;
    height: 146px;
    border-bottom: 1px solid var(--line);
}

.vact-photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s ease;
}

.vact-photo[hidden] {
    display: none !important;
}

.vact-card:hover .vact-photo {
    transform: scale(1.05);
}

.vact-media-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(155deg, rgba(4, 19, 30, 0.46) 0%, rgba(4, 19, 30, 0.06) 50%, rgba(4, 19, 30, 0.32) 100%);
    pointer-events: none;
}

.vact-icon-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(6, 22, 36, 0.74);
    border: 1px solid rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #bae6fd;
    box-shadow: 0 4px 12px rgba(2, 10, 18, 0.25);
    pointer-events: none;
}

.vact-icon-badge .icon {
    width: 18px;
    height: 18px;
}

.vact-media.is-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #061c2c;
    background-image:
        radial-gradient(rgba(125, 211, 252, 0.16) 1px, transparent 1px),
        linear-gradient(145deg, #04131e 0%, #092c3e 58%, #0e415c 100%);
    background-size: 14px 14px, 100% 100%;
}

.vact-media.is-fallback .vact-media-scrim {
    display: none;
}

.vact-media.is-fallback .vact-icon-badge {
    position: static;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: rgba(125, 211, 252, 0.12);
    border-color: rgba(125, 211, 252, 0.30);
    color: #7dd3fc;
}

.vact-media.is-fallback .vact-icon-badge .icon {
    width: 24px;
    height: 24px;
}

/* 3-Tier Structured Editorial Body */
.vact-body {
    flex: 1 1 auto;
    min-width: 0;
    padding: 15px 18px 13px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.vact-meta-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 6px 10px;
}

.vact-badge {
    display: inline-flex;
    align-items: center;
    gap: 4.5px;
    padding: 3px 9px;
    border-radius: var(--r-pill);
    font: 700 10.5px/1.2 var(--f-sans);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.vact-badge.is-included {
    background: var(--ok-bg);
    border: 1px solid var(--ok-line);
    color: var(--ok);
}

.vact-badge.is-included .icon {
    width: 11px;
    height: 11px;
    flex-shrink: 0;
}

.vact-badge.is-addon {
    background: rgba(217, 119, 6, 0.10);
    border: 1px solid rgba(217, 119, 6, 0.26);
    color: #b45309;
}

html[data-theme="dark"] .vact-badge.is-addon {
    background: rgba(251, 191, 36, 0.13);
    border-color: rgba(251, 191, 36, 0.32);
    color: #fcd34d;
}

.vact-tariff {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    font-size: 12.5px;
    line-height: 1.2;
    color: var(--muted);
    white-space: nowrap;
}

.vact-tariff-usd {
    font-weight: 700;
    font-size: 13.5px;
    color: var(--ink);
}

.vact-tariff-orig {
    font-size: 11.5px;
    color: var(--muted);
}

.vact-name {
    margin: 1px 0 0;
    font: 700 18px/1.24 var(--f-serif);
    letter-spacing: -0.01em;
    color: var(--ink);
}

.vact-card-link {
    color: var(--ink);
    text-decoration: none;
    transition: color 0.15s ease;
}

.vact-card-link::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 3;
    border-radius: inherit;
}

.vact-card:hover .vact-card-link,
.vact-card-link:hover {
    color: var(--accent);
    text-decoration: none;
}

.vact-blurb {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--ink-2);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.vact-meta-bottom {
    margin-top: auto;
    padding-top: 9px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.vact-category {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font: 600 11.5px/1.2 var(--f-sans);
    color: var(--muted);
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vact-category .icon {
    width: 13px;
    height: 13px;
    color: var(--accent);
    flex-shrink: 0;
}

.vact-cat-sep {
    opacity: 0.55;
}

.vact-explore {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font: 600 12.5px/1.2 var(--f-sans);
    color: var(--accent);
    flex-shrink: 0;
}

.vact-explore .icon {
    width: 14px;
    height: 14px;
    transition: transform 0.16s ease;
}

.vact-card:hover .vact-explore .icon {
    transform: translateX(3px);
}

@media (max-width: 980px) {
    .exp-activities-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .exp-activities-grid--single {
        grid-template-columns: 1fr;
    }

    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card--split,
    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card--stack {
        grid-column: span 1;
        flex-direction: column;
    }

    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card--split .vact-media,
    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card--stack .vact-media {
        width: 100%;
        height: 148px;
        min-height: 0;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        flex-direction: row;
    }

    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card:last-child:nth-child(odd) .vact-media {
        width: 184px;
        height: auto;
        min-height: 176px;
        border-bottom: 0;
        border-right: 1px solid var(--line);
    }
}

@media (max-width: 640px) {
    .exp-activities-grid,
    .exp-activities-grid--single {
        grid-template-columns: 1fr;
    }

    .exp-activities-grid > .vact-card,
    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card:last-child:nth-child(odd) {
        grid-column: auto;
        flex-direction: column;
    }

    .exp-activities-grid > .vact-card .vact-media,
    .exp-activities-grid:not(.exp-activities-grid--single) > .vact-card:last-child:nth-child(odd) .vact-media {
        width: 100%;
        height: 156px;
        min-height: 0;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }
}

.vact-link {
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.vact-link:hover {
    text-decoration: underline;
}

/* Expedition Context Section (Operator & Month on top, Regions full-width below) */
.voyage-context-section {
    margin: 0 0 44px;
}

.voyage-context-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 16px;
}

.vcontext-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 22px;
    box-shadow: var(--sh-card);
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
}

.vcontext-card.vcontext-regions {
    grid-column: 1 / -1;
}

.vcontext-badge {
    position: absolute;
    top: 14px;
    right: 18px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
    background: var(--surface);
    padding: 2px 8px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
}

.vcontext-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.vcontext-eyebrow {
    display: block;
    margin-bottom: 2px;
    font: 700 10.5px/1.25 var(--f-mono);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--accent);
}

.vcontext-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--r-md);
    background: var(--surface);
    border: 1px solid var(--line);
    color: var(--accent);
    font-size: 22px;
    line-height: 1;
    flex-shrink: 0;
}

.vcontext-icon .icon {
    width: 20px;
    height: 20px;
}

.vcontext-title {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.25;
}

.vcontext-sub {
    font-size: 12px;
    color: var(--accent);
    font-weight: 600;
}

.vcontext-desc {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: var(--muted);
    flex-grow: 1;
}

.vcontext-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.vcontext-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    line-height: 1.3;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 3.5px 8.5px;
    color: var(--ink-2);
}

.vcontext-chip .icon {
    width: 13.5px;
    height: 13.5px;
    flex-shrink: 0;
    color: var(--accent);
}

.vcontext-regions-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
    margin: 4px 0;
}

.vcontext-region-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    transition: border-color 0.15s ease, background 0.15s ease;
}

.vcontext-region-item:hover {
    border-color: var(--accent);
    background: var(--card);
}

.vcontext-reg-thumb {
    width: 50px;
    height: 50px;
    border-radius: var(--r-md);
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid var(--line);
}

.vcontext-reg-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.vcontext-reg-name {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
}

.vcontext-reg-name a {
    color: var(--accent);
    text-decoration: none;
    transition: color 0.15s ease;
}

.vcontext-reg-name a:hover {
    color: var(--accent-dark);
    text-decoration: underline;
}

.vcontext-reg-tagline {
    margin: 0;
    font-size: 12px;
    color: var(--muted);
    line-height: 1.35;
}

.vcontext-foot {
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

.vcontext-cta {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.vcontext-cta:hover {
    text-decoration: underline;
}

@media (max-width: 1024px) {
    .voyage-specs-card.has-ship-photo .specs-card-layout {
        grid-template-columns: 1fr;
    }
    .voyage-specs-card.has-ship-photo .spec-cell:nth-child(4) {
        border-top-right-radius: calc(var(--r-lg) - 1px);
    }
    .voyage-specs-card.has-ship-photo .spec-cell:nth-child(5) {
        border-bottom-left-radius: 0;
    }
    .specs-ship-card {
        border-radius: 0 0 calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px);
        border-top: 1px solid var(--line);
    }
}

@media (max-width: 960px) {
    .voyage-context-grid {
        grid-template-columns: 1fr;
    }
    .vcontext-card.vcontext-regions {
        grid-column: auto;
    }
}

@media (max-width: 860px) {
    .specs-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .spec-cell {
        border-radius: 0 !important;
    }
    .spec-cell:first-child {
        border-top-left-radius: calc(var(--r-lg) - 1px) !important;
    }
    .spec-cell:nth-child(2) {
        border-top-right-radius: calc(var(--r-lg) - 1px) !important;
    }
    .voyage-specs-card:not(.has-ship-photo) .spec-cell:nth-last-child(2) {
        border-bottom-left-radius: calc(var(--r-lg) - 1px) !important;
    }
    .voyage-specs-card:not(.has-ship-photo) .spec-cell:last-child {
        border-bottom-right-radius: calc(var(--r-lg) - 1px) !important;
    }
    .voyage-itinerary-layout.has-map {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .voyage-itinerary-sidebar {
        position: static;
        order: -1;
        justify-content: flex-start;
    }
    .itinerary-map-card img {
        max-height: 380px;
    }
}

@media (max-width: 768px) {
    .voyage-hero-header.has-photo {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .voyage-hero-media img {
        height: 200px;
    }
    .voyage-hero-title {
        font-size: 26px;
    }
}

@media (max-width: 640px) {
    .specs-grid {
        grid-template-columns: 1fr;
    }
    .spec-cell:first-child {
        border-top-left-radius: calc(var(--r-lg) - 1px) !important;
        border-top-right-radius: calc(var(--r-lg) - 1px) !important;
    }
    .spec-cell:nth-child(2),
    .voyage-specs-card:not(.has-ship-photo) .spec-cell:nth-last-child(2) {
        border-radius: 0 !important;
    }
    .voyage-specs-card:not(.has-ship-photo) .spec-cell:last-child {
        border-bottom-left-radius: calc(var(--r-lg) - 1px) !important;
        border-bottom-right-radius: calc(var(--r-lg) - 1px) !important;
    }
    .vcontext-regions-list {
        grid-template-columns: 1fr;
    }
    .route-strip-bar,
    .exp-days-bar,
    .route-disclaimer {
        padding-left: 14px;
        padding-right: 14px;
    }
    .route-disclaimer {
        align-items: flex-start;
    }
    .route-disclaimer-icon {
        margin-top: 2px;
    }
    .route-strip .route-points {
        padding: 13px 14px;
    }
    .exp-day-summary {
        grid-template-columns: 50px minmax(0, 1fr) auto;
        gap: 12px;
        padding: 12px 14px;
    }
    .exp-day-item.is-static .exp-day-summary {
        grid-template-columns: 50px minmax(0, 1fr);
    }
    .exp-day-badge {
        width: 50px;
        height: 44px;
    }
    .exp-day-badge.is-wide .exp-day-badge-num {
        font-size: 11px;
    }
    .exp-days-log.has-spine .exp-day-item::before {
        left: 39px;
    }
    .exp-days-log.has-spine .exp-day-item:first-child::before {
        top: 34px;
    }
    .exp-days-log.has-spine .exp-day-item:last-child::before {
        height: 34px;
    }
    .exp-day-body {
        padding: 0 16px 16px 76px;
    }
}

/* Polar Fare Telemetry Step Chart (#price-trend) — Dual-Theme (Polar Daylight & Polar Midnight)
   with Vertical Thermal Price Metaphor: Hot (higher fares) above -> Cold (lower fares) below */
.price-trend {
    /* Polar Daylight (Bright Mode) tokens — harmonizes seamlessly with surrounding white cards */
    --pt-card-bg: var(--card);
    --pt-card-border: var(--line);
    --pt-card-shadow: var(--sh-card);
    --pt-chrome-bg: var(--subtle-bg);
    --pt-chrome-border: var(--line);
    --pt-note-bg: var(--surface);
    --pt-stage-bg:
        radial-gradient(ellipse 76% 85% at 50% 58%, rgba(224, 242, 254, 0.52) 0%, rgba(255, 255, 255, 0) 100%),
        linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
    --pt-title: var(--ink);
    --pt-sub-ink: var(--muted);
    --pt-meta-ink: var(--ink-2);
    --pt-muted-ink: var(--muted);
    --pt-kpi-strong: var(--ink);
    --pt-grid-h: rgba(14, 116, 144, 0.13);
    --pt-grid-v: rgba(14, 116, 144, 0.08);
    --pt-dot-border: #ffffff;
    --pt-dot-shadow: 0 1px 3px rgba(13, 27, 42, 0.16);
    --pt-mark-bg: #ffffff;
    --pt-mark-border: var(--line-dark);
    --pt-mark-ink: var(--ink);
    --pt-mark-shadow: 0 2px 6px rgba(11, 29, 58, 0.08);

    /* Thermal spectrum (Hot at top -> Cold at bottom) */
    --pt-hot: #ea580c;
    --pt-hot-ring: rgba(234, 88, 12, 0.18);
    --pt-hot-pill-ink: #ffffff;
    --pt-warm: #f59e0b;
    --pt-mid: #0ea5e9;
    --pt-mid-ring: rgba(14, 165, 233, 0.18);
    --pt-mid-pill-ink: #ffffff;
    --pt-cold: #0284c7;
    --pt-cold-cyan: #06b6d4;
    --pt-cold-ring: rgba(2, 132, 199, 0.18);
    --pt-cold-pill-ink: #ffffff;
    --pt-area-hot-op: 0.20;
    --pt-area-warm-op: 0.12;
    --pt-area-cold-op: 0.10;

    /* Default current-price thermal binding (overridden by .is-now-mid / .is-now-hot) */
    --pt-now: var(--pt-cold);
    --pt-now-ring: var(--pt-cold-ring);
    --pt-now-pill-ink: var(--pt-cold-pill-ink);

    width: 100%;
    border-radius: var(--r-lg);
    background: var(--pt-card-bg);
    border: 1px solid var(--pt-card-border);
    box-shadow: var(--pt-card-shadow);
    overflow: hidden;
    color: var(--pt-meta-ink);
    padding: 0;
    margin: 14px 0 28px;
}

html[data-theme="dark"] .price-trend {
    /* Polar Midnight (Dark Mode) tokens — deep ocean telemetry glass stage */
    --pt-card-bg: linear-gradient(180deg, #07192e 0%, #051325 100%);
    --pt-card-border: rgba(125, 211, 252, 0.22);
    --pt-card-shadow: 0 18px 42px rgba(2, 8, 18, 0.50), inset 0 1px 0 rgba(255, 255, 255, 0.07);
    --pt-chrome-bg: rgba(4, 13, 26, 0.46);
    --pt-chrome-border: rgba(125, 211, 252, 0.14);
    --pt-note-bg: rgba(3, 10, 20, 0.58);
    --pt-stage-bg: radial-gradient(ellipse 72% 88% at 50% 48%, rgba(14, 46, 82, 0.68) 0%, rgba(4, 14, 28, 0.94) 100%);
    --pt-title: #f8fafc;
    --pt-sub-ink: rgba(186, 230, 253, 0.76);
    --pt-meta-ink: rgba(214, 231, 248, 0.86);
    --pt-muted-ink: rgba(186, 214, 238, 0.66);
    --pt-kpi-strong: #f8fafc;
    --pt-grid-h: rgba(125, 211, 252, 0.13);
    --pt-grid-v: rgba(125, 211, 252, 0.09);
    --pt-dot-border: #061427;
    --pt-dot-shadow: 0 1px 4px rgba(2, 8, 18, 0.45);
    --pt-mark-bg: rgba(4, 13, 26, 0.88);
    --pt-mark-border: rgba(125, 211, 252, 0.24);
    --pt-mark-ink: #e0f2fe;
    --pt-mark-shadow: 0 4px 12px rgba(2, 8, 18, 0.42);

    --pt-hot: #fb923c;
    --pt-hot-ring: rgba(251, 146, 60, 0.28);
    --pt-hot-pill-ink: #061427;
    --pt-warm: #fbbf24;
    --pt-mid: #38bdf8;
    --pt-mid-ring: rgba(56, 189, 248, 0.26);
    --pt-mid-pill-ink: #061427;
    --pt-cold: #22d3ee;
    --pt-cold-cyan: #06b6d4;
    --pt-cold-ring: rgba(34, 211, 238, 0.26);
    --pt-cold-pill-ink: #061427;
    --pt-area-hot-op: 0.28;
    --pt-area-warm-op: 0.16;
    --pt-area-cold-op: 0.12;
}

.price-trend.is-now-cold {
    --pt-now: var(--pt-cold);
    --pt-now-ring: var(--pt-cold-ring);
    --pt-now-pill-ink: var(--pt-cold-pill-ink);
}

.price-trend.is-now-mid {
    --pt-now: var(--pt-mid);
    --pt-now-ring: var(--pt-mid-ring);
    --pt-now-pill-ink: var(--pt-mid-pill-ink);
}

.price-trend.is-now-hot {
    --pt-now: var(--pt-hot);
    --pt-now-ring: var(--pt-hot-ring);
    --pt-now-pill-ink: var(--pt-hot-pill-ink);
}

.pt-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 14px;
    padding: 9px 18px;
    font: 600 10.5px/1.2 var(--f-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pt-muted-ink);
    background: var(--pt-chrome-bg);
    border-bottom: 1px solid var(--pt-chrome-border);
}

.pt-sector {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.pt-sector-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--pt-now);
    box-shadow: 0 0 0 3px var(--pt-now-ring);
    flex-shrink: 0;
}

.pt-legend {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    font: 600 10px/1 var(--f-mono);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pt-muted-ink);
}

.pt-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.pt-swatch {
    display: inline-block;
    flex-shrink: 0;
}

.pt-swatch--captured {
    width: 4px;
    height: 12px;
    border-radius: 99px;
    background: linear-gradient(180deg, var(--pt-hot) 0%, var(--pt-warm) 35%, var(--pt-mid) 68%, var(--pt-cold) 100%);
}

.pt-swatch--current {
    width: 12px;
    height: 0;
    border-top: 2px dashed var(--pt-now);
    background: none;
}

.pt-stage {
    position: relative;
    background: var(--pt-stage-bg);
}

.pt-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px 18px;
    flex-wrap: wrap;
    padding: 15px 18px 4px;
}

.pt-head-copy {
    min-width: 0;
}

.price-trend h2 {
    margin: 0;
    font: 600 19.5px/1.22 var(--f-serif);
    letter-spacing: -0.01em;
    color: var(--pt-title);
}

.pt-sub {
    margin: 3px 0 0;
    font: 400 12.5px/1.45 var(--f-sans);
    color: var(--pt-sub-ink);
}

.pt-delta {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    padding: 6px 12px;
    border-radius: 10px;
    font: 700 13.5px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
    background: var(--pt-chrome-bg);
    border: 1px solid var(--pt-chrome-border);
    color: var(--pt-meta-ink);
}

.pt-delta small {
    display: block;
    font: 500 10px/1.2 var(--f-mono);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: currentColor;
    opacity: 0.78;
}

.pt-delta.down {
    background: var(--ok-bg);
    border-color: var(--ok-line);
    color: var(--ok);
}

.pt-delta.up {
    background: var(--bad-bg);
    border-color: var(--bad-line);
    color: var(--bad);
}

.pt-delta.flat {
    color: var(--pt-meta-ink);
}

.pt-canvas {
    padding: 6px 26px 14px;
}

.pt-plot {
    position: relative;
    margin: 10px 0 0;
}

.pt-chart {
    display: block;
    width: 100%;
    height: 132px;
    overflow: visible;
    user-select: none;
}

/* SVG thermal gradient stops bound to theme custom properties */
.pt-stroke-stop-hot {
    stop-color: var(--pt-hot);
}

.pt-stroke-stop-warm {
    stop-color: var(--pt-warm);
}

.pt-stroke-stop-mid {
    stop-color: var(--pt-mid);
}

.pt-stroke-stop-cold {
    stop-color: var(--pt-cold);
}

.pt-area-stop-hot {
    stop-color: var(--pt-hot);
    stop-opacity: var(--pt-area-hot-op);
}

.pt-area-stop-warm {
    stop-color: var(--pt-warm);
    stop-opacity: var(--pt-area-warm-op);
}

.pt-area-stop-cold {
    stop-color: var(--pt-cold);
    stop-opacity: var(--pt-area-cold-op);
}

.pt-area-stop-base {
    stop-color: var(--pt-cold-cyan);
    stop-opacity: 0;
}

.pt-grid {
    stroke: var(--pt-grid-h);
    stroke-width: 1px;
    vector-effect: non-scaling-stroke;
    fill: none;
}

.pt-grid-v {
    stroke: var(--pt-grid-v);
}

.pt-scanline {
    stroke: var(--pt-now);
    stroke-opacity: 0.45;
    stroke-width: 1.2px;
    stroke-dasharray: 3 3;
    vector-effect: non-scaling-stroke;
}

.pt-area {
    fill: url(#pt-area-fill);
    stroke: none;
}

.pt-line {
    fill: none;
    stroke: url(#pt-step-stroke);
    stroke-width: 2.5px;
    vector-effect: non-scaling-stroke;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.pt-line-now {
    stroke: var(--pt-now);
    stroke-opacity: 0.78;
    stroke-width: 1.7px;
    stroke-dasharray: 4 3;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

.pt-dot {
    --pt-dot-fill: var(--pt-mid);
    --pt-dot-ring: var(--pt-mid-ring);
    position: absolute;
    z-index: 2;
    width: 8.5px;
    height: 8.5px;
    border-radius: 50%;
    background: var(--pt-dot-fill);
    border: 1.75px solid var(--pt-dot-border);
    box-shadow: var(--pt-dot-shadow), 0 0 0 3.5px var(--pt-dot-ring);
    transform: translate(-50%, -50%);
    cursor: pointer;
    outline: none;
    transition: background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.pt-dot.is-hot {
    --pt-dot-fill: var(--pt-hot);
    --pt-dot-ring: var(--pt-hot-ring);
}

.pt-dot.is-mid {
    --pt-dot-fill: var(--pt-mid);
    --pt-dot-ring: var(--pt-mid-ring);
}

.pt-dot.is-cold {
    --pt-dot-fill: var(--pt-cold);
    --pt-dot-ring: var(--pt-cold-ring);
}

.pt-dot:hover,
.pt-dot:focus-visible {
    z-index: 5;
    box-shadow: var(--pt-dot-shadow), 0 0 0 6px var(--pt-dot-ring);
    transform: translate(-50%, -50%) scale(1.18);
}

.pt-dot[data-tip]:hover::before,
.pt-dot[data-tip]:focus-visible::before {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 9px);
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    padding: 4px 8px;
    border-radius: 6px;
    background: #0d1b2a;
    border: 1px solid rgba(125, 211, 252, 0.35);
    box-shadow: 0 6px 18px rgba(11, 29, 58, 0.32);
    color: #f8fafc;
    font: 600 10.5px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
    pointer-events: none;
}

.pt-dot.is-edge-left[data-tip]:hover::before,
.pt-dot.is-edge-left[data-tip]:focus-visible::before {
    left: -4px;
    transform: none;
}

.pt-dot.is-edge-right[data-tip]:hover::before,
.pt-dot.is-edge-right[data-tip]:focus-visible::before {
    left: auto;
    right: -4px;
    transform: none;
}

.pt-dot-last {
    --pt-dot-fill: var(--pt-now);
    --pt-dot-ring: var(--pt-now-ring);
    z-index: 3;
    width: 10.5px;
    height: 10.5px;
    background: var(--pt-now);
    border: 2px solid #ffffff;
    box-shadow: var(--pt-dot-shadow), 0 0 0 4px var(--pt-now-ring);
}

.pt-dot-last::after {
    content: '';
    position: absolute;
    inset: -7px;
    border-radius: 50%;
    background: var(--pt-now);
    pointer-events: none;
    animation: pt-beacon-pulse 2.8s ease-out infinite;
}

@keyframes pt-beacon-pulse {
    0% {
        transform: scale(0.55);
        opacity: 0.38;
    }
    75% {
        transform: scale(1.25);
        opacity: 0.06;
    }
    100% {
        transform: scale(1.32);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pt-dot-last::after {
        animation: none;
    }
}

.pt-mark {
    position: absolute;
    z-index: 2;
    transform: translate(-50%, calc(-100% - 9px));
    white-space: nowrap;
    font: 600 10.5px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--pt-mark-ink);
    background: var(--pt-mark-bg);
    border: 1px solid var(--pt-mark-border);
    box-shadow: var(--pt-mark-shadow);
    border-radius: 6px;
    padding: 2px 6.5px;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

.pt-plot.has-marks:has(.pt-dot:hover) .pt-mark,
.pt-plot.has-marks:has(.pt-dot:focus-visible) .pt-mark {
    opacity: 0.15;
}

.pt-mark.below { transform: translate(-50%, 11px); }
.pt-mark.down {
    color: var(--ok);
    border-color: var(--ok-line);
}
.pt-mark.up {
    color: var(--bad);
    border-color: var(--bad-line);
}

.pt-axis {
    position: relative;
    height: 22px;
    margin: 7px 0 0;
    font: 600 10.5px/1 var(--f-mono);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--pt-muted-ink);
}

.pt-axis span {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
}

.pt-axis .pt-axis-now {
    padding: 4px 9px;
    border-radius: var(--r-pill);
    background: var(--pt-now);
    color: var(--pt-now-pill-ink);
    font-weight: 700;
    letter-spacing: 0.06em;
    box-shadow: 0 2px 8px var(--pt-now-ring);
}

.pt-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    padding: 9px 18px;
    font: 600 11.5px/1.3 var(--f-mono);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.03em;
    color: var(--pt-meta-ink);
    background: var(--pt-chrome-bg);
    border-top: 1px solid var(--pt-chrome-border);
}

.pt-foot-kpi {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}

.pt-foot-glyph {
    color: var(--pt-now);
}

.pt-foot b {
    color: var(--pt-kpi-strong);
    font-weight: 700;
    font-size: 12.5px;
}

.pt-foot-range,
.pt-foot-span {
    color: var(--pt-muted-ink);
}

.pt-note {
    margin: 0;
    padding: 7px 18px 10px;
    background: var(--pt-note-bg);
    border-top: 1px solid var(--pt-chrome-border);
    font: 400 11.5px/1.45 var(--f-sans);
    color: var(--pt-muted-ink);
}

@media (max-width: 640px) {
    .pt-topbar,
    .pt-head,
    .pt-foot,
    .pt-note {
        padding-left: 14px;
        padding-right: 14px;
    }

    .pt-canvas {
        padding: 4px 20px 12px;
    }

    .pt-chart {
        height: 118px;
    }

    .pt-delta {
        align-items: flex-start;
        text-align: left;
    }
}

/* Cabin Offers Table */
.offers-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

table.offers {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--sh-card);
}

table.offers th,
table.offers td {
    padding: 14px 16px;
    text-align: left;
    font-size: 14px;
    border-bottom: 1px solid var(--line);
    background: var(--card);
    vertical-align: middle;
}

table.offers th {
    padding: 11px 16px;
    background: var(--subtle-bg);
    font: var(--t-label);
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

table.offers tr:has(.cabin-incabin[open]) td {
    vertical-align: top;
    padding-top: 16px;
}

table.offers tr:last-child td {
    border-bottom: 0;
}

table.offers tbody tr:not(.best):hover td {
    background: var(--surface);
}

table.offers tr.best td {
    background: var(--ok-bg);
    background: color-mix(in srgb, var(--ok-bg) 52%, var(--card));
}

table.offers tr.best td:first-child {
    box-shadow: inset 3px 0 0 var(--ok);
}

table.offers .best-tag {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: var(--r-pill);
    background: var(--ok-bg);
    border: 1px solid var(--ok-line);
    font: 700 10px/1.25 var(--f-mono);
    color: var(--ok);
    text-transform: uppercase;
    letter-spacing: .06em;
}

table.offers tr.best .best-tag,
table.offers tr.best .offer-promo-pill,
table.offers tr.best .badge.available,
table.offers tr.best .cabin-incabin-list {
    background: var(--card);
}

table.offers tr.best .cabin-incabin-list {
    border-color: var(--ok-line);
}

table.offers td.offer-action-cell,
table.offers td:last-child {
    text-align: right;
    white-space: nowrap;
}

table.offers td:last-child .btn {
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
    border-radius: var(--r-md);
}

.offer-cabin-cell {
    min-width: 260px;
    max-width: 500px;
}

.offer-cabin-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
}

.offer-cabin-wrap:has(.offer-cabin-desc, .cabin-incabin) {
    align-items: flex-start;
}

.offer-cabin-thumb {
    position: relative;
    width: 76px;
    height: 56px;
    flex-shrink: 0;
    border-radius: var(--r-md);
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--line);
    display: block;
    cursor: pointer;
}

.offer-cabin-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .2s ease;
}

.offer-cabin-thumb:hover img {
    transform: scale(1.06);
}

.offer-cabin-thumb .thumb-zoom {
    position: absolute;
    bottom: 3px;
    right: 4px;
    display: inline-flex;
    align-items: center;
    color: #fff;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.8));
    opacity: 0;
    transition: opacity .15s ease;
}

.offer-cabin-thumb .thumb-zoom .icon {
    width: 12px;
    height: 12px;
}

.offer-cabin-thumb:hover .thumb-zoom {
    opacity: 1;
}

.offer-cabin-info {
    flex: 1;
    min-width: 0;
}

.offer-cabin-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.35;
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

.offer-cabin-info .cabin-spec-pills {
    margin-top: 5px;
}

.offer-cabin-desc {
    font-size: 12.75px;
    line-height: 1.5;
    color: var(--ink-2);
    margin: 6px 0 0;
}

.offer-cabin-info:has(.cabin-incabin:not([open])) .offer-cabin-desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.offer-cabin-info .cabin-incabin {
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1px solid var(--line);
}

.offer-occ-pill {
    display: inline-flex;
    align-items: center;
    padding: 2.5px 9px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    font: 600 11.5px/1.3 var(--f-sans);
    color: var(--ink-2);
    white-space: nowrap;
}

table.offers tr.best .offer-occ-pill {
    background: var(--card);
}

@media (max-width: 1024px) {
    table.offers th,
    table.offers td {
        padding: 10px;
        font-size: 13px;
    }
    table.offers th {
        font-size: 10.5px;
        padding: 8px 10px;
    }
    .offer-cabin-cell {
        min-width: 200px;
        max-width: 340px;
    }
    .offer-cabin-thumb {
        width: 56px;
        height: 42px;
    }
    .offer-cabin-wrap {
        gap: 8px;
    }
    .offer-cabin-title {
        font-size: 13px;
    }
    .offer-cabin-desc {
        font-size: 12px;
        line-height: 1.45;
    }
    table.offers td:last-child .btn {
        padding: 7px 12px;
        font-size: 12.5px;
    }
}

@media (min-width: 881px) and (max-width: 1024px) {
    .offer-cabin-info .cabin-incabin-list.is-two-col {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 880px) {
    table.offers {
        display: block;
        width: 100%;
        background: transparent;
        border: none;
        border-radius: 0;
        box-shadow: none;
        overflow: visible;
    }
    table.offers tbody {
        display: block;
        width: 100%;
    }
    table.offers thead {
        display: none;
    }
    table.offers tr {
        display: block;
        background: var(--card);
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        margin-bottom: 14px;
        padding: 12px 16px;
        box-shadow: var(--sh-card);
    }
    table.offers tr.best {
        background: var(--ok-bg);
        background: color-mix(in srgb, var(--ok-bg) 52%, var(--card));
        border-color: var(--ok-line);
        box-shadow: inset 3px 0 0 var(--ok), var(--sh-card);
    }
    table.offers td,
    table.offers tr.best td,
    table.offers tbody tr:not(.best):hover td {
        border: 0;
        background: transparent;
        padding: 6px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 13.5px;
        text-align: left;
    }
    table.offers tr.best td:first-child {
        box-shadow: none;
    }
    table.offers td.offer-cabin-cell {
        display: block;
        padding-bottom: 10px;
        margin-bottom: 6px;
        border-bottom: 1px solid var(--line);
    }
    table.offers td.offer-price-cell .offer-price-stack {
        align-items: flex-end;
    }
    table.offers td[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        font-size: 11.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: .04em;
        color: var(--muted);
        flex-shrink: 0;
    }
    table.offers td.offer-cabin-cell::before {
        display: none;
    }
    table.offers td:last-child {
        padding-top: 10px;
        margin-top: 6px;
        border-top: 1px solid var(--line);
        display: block;
    }
    table.offers td:last-child .btn {
        display: flex;
        width: 100%;
        justify-content: center;
        padding: 10px 16px;
    }
    table.offers td:empty {
        display: none;
    }
    .offer-cabin-cell {
        min-width: 0;
        max-width: 100%;
    }
    .offer-cabin-wrap {
        gap: 12px;
    }
    .offer-cabin-thumb {
        width: 84px;
        height: 62px;
    }
}

/* Packing promo band */
.packing-promo {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s3) var(--s6);
    align-items: center;
    justify-content: space-between;
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    border-radius: var(--r-lg);
    padding: var(--s4) var(--s5);
    margin: var(--s6) 0;
}

.packing-promo h2 {
    font-size: 20px;
    margin: 0 0 var(--s1);
}

.packing-promo p {
    margin: 0;
    font-size: 14px;
    color: var(--ink-2);
    max-width: 640px;
}

.packing-promo .btn {
    flex: none;
}

/* Floating cheapest-offer deck (housed inside .expedition-bottom-dock capsule) */
body.has-offer-bar main {
    padding-bottom: 92px;
}

.offer-bar {
    position: fixed;
    left: 50%;
    bottom: calc(14px + env(safe-area-inset-bottom));
    transform: translate3d(-50%, 0, 0);
    width: min(880px, calc(100vw - 24px));
    z-index: 95;
    background: var(--glass-deck-bg);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border: 1px solid var(--glass-deck-border);
    border-radius: 16px;
    box-shadow: var(--glass-deck-shadow);
    padding: 0;
}

.offer-bar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 9px 12px 9px 16px;
    min-height: 56px;
    box-sizing: border-box;
}

.offer-bar .from {
    min-width: 0;
    flex: 1 1 auto;
    line-height: 1.25;
}

.offer-bar .from-price-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}

.offer-bar .from-prefix {
    font-size: 12.5px;
    font-weight: 500;
    color: var(--glass-muted);
}

.offer-bar .from b {
    font-size: 19.5px;
    font-weight: 700;
    color: var(--glass-ink);
    letter-spacing: -0.015em;
    font-variant-numeric: tabular-nums;
}

.offer-bar .from-sub {
    display: block;
    font-size: 11.5px;
    color: var(--glass-muted);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.offer-bar .from-cabin {
    color: var(--glass-ink-2);
    font-weight: 500;
}

.offer-bar-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 17px;
    font-size: 13.5px;
    font-weight: 600;
    border-radius: 10px;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(0, 95, 204, 0.22);
}


/* --- Evergreen Itinerary Hub, Sailed Notice Banner & Sibling Date-Switcher --- */
.voyage-hero-title-meta {
    display: block;
    margin-top: 6px;
    font: 500 16px/1.4 var(--f-sans);
    color: var(--ink-2);
    letter-spacing: 0;
}

.voyage-sailed-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 12px 0 20px;
    padding: 16px 20px;
    background: var(--warn-bg);
    border: 1px solid var(--warn-line);
    border-radius: var(--r-lg);
}

.voyage-sailed-body strong {
    display: block;
    font-size: 15px;
    color: var(--ink);
    margin-bottom: 2px;
}

.voyage-sailed-body p {
    margin: 0;
    font-size: 14px;
    color: var(--ink-2);
}

.itinerary-section-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.itinerary-section-head .section-title {
    margin: 0;
}

.itinerary-verified-stamp {
    font-size: 12.5px;
    color: var(--muted);
}

.itinerary-empty-box {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 24px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.itinerary-empty-box p {
    margin: 0;
    color: var(--ink-2);
    max-width: 580px;
}

.dep-date-link {
    color: var(--ink);
    text-decoration: none;
}

.dep-date-link:hover {
    color: var(--accent);
    text-decoration: underline;
}

.dep-ship-cap {
    font-size: 12.5px;
    color: var(--muted);
    margin-left: 4px;
}

.voyage-offers-section,
.voyage-siblings-section,
.voyage-similar-section,
.itinerary-seasonality-section,
.itinerary-ships-section,
.itinerary-siblings-section {
    margin: 0 0 var(--s12);
}

.similar-section-head {
    align-items: flex-end;
    margin-bottom: 18px;
}

.similar-section-sub {
    margin: 4px 0 0;
    font-size: 14px;
    line-height: 1.45;
    color: var(--muted);
    max-width: 640px;
}

/* Architectural Sailing Schedule Grid (#other-dates) */
.siblings-section-head {
    align-items: flex-end;
    margin-bottom: 18px;
}

.siblings-head-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.siblings-summary-line {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    font-size: 13.5px;
    line-height: 1.4;
    color: var(--muted);
}

.siblings-summary-line strong {
    color: var(--ink);
    font-weight: 700;
}

.siblings-summary-sep {
    opacity: 0.55;
}

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

.sailing-dates-grid--pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sailing-dates-grid--single {
    grid-template-columns: minmax(0, 540px);
}

.sailing-dates-grid--more {
    margin-top: 14px;
}

.sailing-dates-disclosure {
    margin-top: 14px;
}

.sailing-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 14px;
    padding: 15px 17px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    color: var(--ink);
    transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.sailing-card:hover {
    border-color: var(--accent);
    transform: translateY(-2px);
}

.sailing-card.is-best-fare {
    border-color: var(--ok-line);
    background: linear-gradient(180deg, var(--ok-bg) 0%, var(--card) 62%);
}

.sailing-card.is-best-fare:hover {
    border-color: var(--ok);
}

.sailing-card.is-sold-out {
    opacity: 0.8;
}

.sailing-card:has(.sailing-compare-pill input:checked) {
    border-color: var(--accent);
    box-shadow: 0 0 0 1.5px var(--accent-ring), var(--sh-card);
}

.sailing-card-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.sailing-cal-badge {
    width: 44px;
    height: 46px;
    flex-shrink: 0;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: var(--surface);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    line-height: 1;
}

.sailing-card.is-best-fare .sailing-cal-badge {
    background: var(--card);
    border-color: var(--ok-line);
}

.sailing-cal-month {
    font: 700 9.5px/1.1 var(--f-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--accent);
}

.sailing-card.is-best-fare .sailing-cal-month {
    color: var(--ok);
}

.sailing-cal-day {
    font: 800 16px/1.1 var(--f-mono);
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.sailing-date-copy {
    flex: 1 1 auto;
    min-width: 0;
}

.sailing-date-title {
    margin: 0;
    font: 700 15px/1.3 var(--f-sans);
    letter-spacing: -0.01em;
}

.sailing-card-link {
    color: var(--ink);
    text-decoration: none;
}

.sailing-card-link::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}

.sailing-card-link:hover {
    color: var(--accent);
    text-decoration: none;
}

.sailing-meta-line {
    margin: 4px 0 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 6px;
    font-size: 13px;
    line-height: 1.35;
    color: var(--muted);
}

.sailing-meta-line .icon {
    width: 13.5px;
    height: 13.5px;
    flex-shrink: 0;
    color: var(--muted);
}

.sailing-ship-name {
    font-weight: 500;
    color: var(--ink-2);
}

.sailing-meta-sep {
    opacity: 0.6;
}

.sailing-badge {
    flex-shrink: 0;
    padding: 3px 9px;
    border-radius: var(--r-pill);
    font: 700 11px/1.25 var(--f-sans);
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.sailing-badge.is-best,
.sailing-badge.is-save {
    background: var(--ok-bg);
    border: 1px solid var(--ok-line);
    color: var(--ok);
}

.sailing-badge.is-limited {
    background: var(--warn-bg);
    border: 1px solid var(--warn-line);
    color: var(--ink);
}

.sailing-badge.is-sold-out {
    background: var(--surface);
    border: 1px solid var(--line);
    color: var(--muted);
}

.sailing-card-foot {
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
}

.sailing-price {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sailing-price-lbl {
    font: var(--t-label);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--muted);
}

.sailing-price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 6px;
    row-gap: 2px;
}

.sailing-price-row b {
    font: var(--t-price);
    font-size: 19px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--ink);
}

.sailing-price-save {
    font: 700 11.5px/1.25 var(--f-mono);
    color: var(--ok);
}

.sailing-last-listed,
.sailing-soldout-note {
    font-size: 12.5px;
    font-weight: 500;
    color: var(--muted);
}

.sailing-foot-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.sailing-compare-pill {
    position: relative;
    z-index: 2;
}

.sailing-card:hover .sailing-card-arrow {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
    transform: translateX(2px);
}

@media (max-width: 980px) {
    .sailing-dates-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .sailing-dates-grid--single {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .sailing-dates-grid,
    .sailing-dates-grid--pair {
        grid-template-columns: 1fr;
    }
}

.itinerary-seasonality-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 12px;
}

.itinerary-month-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.itinerary-month-top {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
}

.itinerary-month-name {
    font-weight: 600;
    font-size: 14.5px;
    color: var(--accent);
    text-decoration: none;
}

.itinerary-month-name:hover {
    text-decoration: underline;
}

.itinerary-month-count {
    font-size: 12px;
    color: var(--muted);
}

.itinerary-month-price {
    font-size: 15px;
}

.itinerary-month-ships {
    font-size: 12px;
    color: var(--muted);
}

.itinerary-ships-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}

.itinerary-ship-card {
    display: flex;
    gap: 14px;
    align-items: center;
    padding: 14px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
}

.itinerary-ship-thumb img {
    display: block;
    width: 112px;
    height: 76px;
    object-fit: cover;
    border-radius: var(--r-md);
}

.itinerary-ship-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.itinerary-ship-name {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.itinerary-ship-name a {
    color: var(--ink);
    text-decoration: none;
}

.itinerary-ship-name a:hover {
    color: var(--accent);
}

.itinerary-ship-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    font-size: 12.5px;
    color: var(--muted);
}

.itinerary-siblings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 10px;
}

.itinerary-sibling-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 13px 16px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    text-decoration: none;
    color: var(--ink);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.itinerary-sibling-card:hover {
    border-color: var(--accent);
    box-shadow: var(--sh-card);
    text-decoration: none;
}

.itinerary-sibling-title {
    font-weight: 600;
    font-size: 14.5px;
    color: var(--ink);
}

.itinerary-sibling-meta {
    font-size: 12.5px;
    color: var(--muted);
}

.itinerary-sibling-meta strong {
    color: var(--ink);
}


/* ==========================================================================
   Polar Expedition Cockpit & Route Masthead Redesign
   (/voyages/{slug} & /operators/{operator}/itineraries/{slug})
   ========================================================================== */

.expedition-masthead {
    --exp-accent: #fbbf24;
    --exp-accent-soft: rgba(251, 191, 36, 0.14);
    --exp-accent-border: rgba(251, 191, 36, 0.34);
    --exp-accent-ink: #fef3c7;
    --exp-cta-bg: #fbbf24;
    --exp-cta-ink: #061826;
    --exp-cta-hover: #fcd34d;
    --exp-canvas-deep: #04131e;
    --exp-canvas-mid: #072232;
    --exp-canvas-low: #092c3e;

    padding: calc(var(--header-actual-h, 64px) + 22px) 0 40px;
    background:
        radial-gradient(ellipse 68% 90% at 80% 34%, rgba(20, 128, 150, 0.22) 0%, transparent 68%),
        linear-gradient(135deg, var(--exp-canvas-deep) 0%, var(--exp-canvas-mid) 56%, var(--exp-canvas-low) 100%);
    border-bottom: 1px solid rgba(125, 211, 252, 0.16);
}

.expedition-masthead--route {
    --exp-accent: #2dd4bf;
    --exp-accent-soft: rgba(45, 212, 191, 0.14);
    --exp-accent-border: rgba(45, 212, 191, 0.34);
    --exp-accent-ink: #ccfbf1;
    --exp-cta-bg: #2dd4bf;
    --exp-cta-ink: #042026;
    --exp-cta-hover: #5eead4;
}

.expedition-masthead .masthead-bg-photo {
    width: min(68%, 1080px);
    opacity: 0.46;
    filter: saturate(0.88) contrast(1.08);
}

.expedition-masthead .masthead-scrim {
    background:
        radial-gradient(ellipse 52% 80% at 74% 44%, rgba(45, 212, 191, 0.13) 0%, transparent 72%),
        linear-gradient(90deg,
            #04131e 0%,
            #04131e 28%,
            rgba(5, 24, 37, 0.90) 52%,
            rgba(7, 34, 50, 0.48) 78%,
            rgba(4, 19, 30, 0.78) 100%),
        linear-gradient(180deg,
            rgba(3, 12, 20, 0.68) 0%,
            rgba(5, 24, 37, 0.22) 45%,
            #061d2c 100%);
}

.expedition-masthead.is-no-photo .masthead-scrim {
    background:
        radial-gradient(ellipse 60% 85% at 76% 48%, var(--exp-accent-soft) 0%, transparent 68%),
        radial-gradient(ellipse 50% 70% at 22% 85%, rgba(14, 116, 144, 0.20) 0%, transparent 66%),
        linear-gradient(180deg, rgba(3, 12, 20, 0.42) 0%, #061d2c 100%);
}

.masthead-course-plot {
    position: absolute;
    right: max(-30px, calc(50% - 700px));
    top: 52%;
    transform: translateY(-50%);
    width: 760px;
    height: auto;
    color: rgba(165, 243, 252, 0.55);
}

.expedition-masthead-inner {
    position: relative;
    z-index: 1;
}

/* In-masthead translucent breadcrumbs */
.exp-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin: 0 0 20px;
    font: 500 12.5px/1.4 var(--f-sans);
    color: rgba(186, 214, 235, 0.68);
}

.exp-breadcrumbs a {
    color: rgba(214, 234, 248, 0.78);
    text-decoration: none;
    transition: color 0.15s ease;
}

.exp-breadcrumbs a:hover {
    color: #ffffff;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.exp-bc-current {
    color: rgba(240, 249, 255, 0.94);
    font-weight: 600;
}

.expedition-masthead-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(330px, 416px);
    gap: 28px 40px;
    align-items: center;
}

.exp-masthead-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.exp-dispatch-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

.exp-dispatch-stamp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 11px;
    border-radius: var(--r-pill);
    background: var(--exp-accent-soft);
    border: 1px solid var(--exp-accent-border);
    font: 600 11px/1.25 var(--f-mono);
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: var(--exp-accent-ink);
}

.exp-dispatch-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--exp-accent);
    box-shadow: 0 0 0 3px var(--exp-accent-soft), 0 0 10px var(--exp-accent);
    flex-shrink: 0;
}

.exp-status-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: var(--r-pill);
    font: 700 10.5px/1.2 var(--f-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(16, 185, 129, 0.16);
    border: 1px solid rgba(52, 211, 153, 0.36);
    color: #a7f3d0;
}

.exp-status-pill.is-limited {
    background: rgba(245, 158, 11, 0.18);
    border-color: rgba(251, 191, 36, 0.42);
    color: #fde68a;
}

.exp-status-pill.is-sold_out,
.exp-status-pill.is-sold-out {
    background: rgba(244, 63, 94, 0.18);
    border-color: rgba(251, 113, 133, 0.38);
    color: #fecdd3;
}

.exp-masthead-title {
    margin: 0 0 14px;
    font: 400 clamp(2rem, 3.6vw, 3.15rem)/1.08 var(--f-serif);
    letter-spacing: -0.02em;
    color: #ffffff;
}

.exp-title-main {
    display: block;
}

.exp-title-sub {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin-top: 10px;
    font: 500 clamp(0.96rem, 1.35vw, 1.12rem)/1.4 var(--f-sans);
    letter-spacing: 0;
    color: rgba(219, 238, 252, 0.90);
}

.exp-title-ship {
    font-weight: 700;
    color: #ffffff;
}

.exp-title-sep {
    color: var(--exp-accent);
}

.exp-title-dates {
    font-family: var(--f-mono);
    font-size: 0.94em;
    color: var(--exp-accent-ink);
}

.exp-masthead-sub {
    margin: 0 0 18px;
    max-width: 56ch;
    font: 400 15.5px/1.55 var(--f-sans);
    color: rgba(214, 234, 248, 0.84);
}

.exp-masthead-sub strong {
    color: #ffffff;
    font-weight: 600;
}

/* Masthead Primary CTA, Compare Toggle & Photo Lightbox Trigger */
.exp-cta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 4px 0 18px;
}

.exp-primary-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: var(--r-pill);
    background: var(--exp-cta-bg);
    color: var(--exp-cta-ink);
    font: 700 13.5px/1.2 var(--f-sans);
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(2, 10, 18, 0.34);
    transition: background 0.16s ease, transform 0.16s ease;
}

.exp-primary-cta:hover {
    background: var(--exp-cta-hover);
    color: var(--exp-cta-ink);
    text-decoration: none;
    transform: translateY(-1px);
}

.exp-cta-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    padding: 2px 7px;
    border-radius: var(--r-pill);
    background: rgba(4, 19, 30, 0.18);
    font: 700 11.5px/1.2 var(--f-mono);
}

.exp-compare-toggle,
.exp-ghost-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 15px;
    border-radius: var(--r-pill);
    background: rgba(7, 27, 42, 0.66);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(165, 220, 250, 0.24);
    color: #eef7ff;
    font: 600 13px/1.2 var(--f-sans);
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.exp-ghost-btn[hidden] {
    display: none !important;
}

.exp-compare-toggle:hover,
.exp-ghost-btn:hover {
    background: rgba(12, 42, 63, 0.84);
    border-color: rgba(165, 220, 250, 0.46);
    color: #ffffff;
    text-decoration: none;
}

.exp-compare-toggle input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}

.exp-compare-box {
    width: 15px;
    height: 15px;
    border-radius: 4px;
    border: 1.5px solid rgba(186, 226, 252, 0.65);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, border-color 0.15s ease;
    flex-shrink: 0;
}

.exp-compare-toggle:has(input:checked) {
    background: var(--exp-accent-soft);
    border-color: var(--exp-accent);
    color: var(--exp-accent-ink);
}

.exp-compare-toggle:has(input:checked) .exp-compare-box {
    background: var(--exp-accent);
    border-color: var(--exp-accent);
}

.exp-compare-toggle:has(input:checked) .exp-compare-box::after {
    content: '✓';
    color: #04131e;
    font: 800 10.5px/1 var(--f-sans);
}

.exp-compare-toggle:has(input:focus-visible) {
    outline: 2px solid var(--exp-accent);
    outline-offset: 2px;
}

.exp-compare-toggle:has(input:disabled) {
    opacity: 0.5;
    cursor: not-allowed;
}

.exp-ghost-btn .icon {
    width: 14px;
    height: 14px;
    color: var(--exp-accent);
}

/* Context Meta Pills */
.exp-meta-pills {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}

.exp-meta-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(186, 226, 252, 0.16);
    color: rgba(226, 241, 252, 0.90);
    font: 500 12.5px/1.25 var(--f-sans);
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.exp-meta-pill .icon {
    width: 13px;
    height: 13px;
    color: rgba(165, 225, 252, 0.85);
}

.exp-meta-pill:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(186, 226, 252, 0.36);
    color: #ffffff;
    text-decoration: none;
}

.exp-meta-pill--route {
    border-color: var(--exp-accent-border);
    color: var(--exp-accent-ink);
}

/* Right-hand Boarding Manifest / Master Route Cockpit Card */
.exp-cockpit {
    position: relative;
    background: linear-gradient(180deg, rgba(6, 24, 38, 0.86) 0%, rgba(4, 17, 28, 0.92) 100%);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(148, 214, 248, 0.22);
    border-radius: 16px;
    box-shadow: 0 20px 44px rgba(2, 9, 16, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    color: #eaf5ff;
    overflow: visible;
}

.exp-cockpit.spec-cell-price,
.exp-cockpit .spec-cell-price {
    background: transparent;
}

.exp-cockpit-fare {
    padding: 18px 20px 14px;
}

.exp-fare-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
}

.exp-fare-label {
    font: 700 10.5px/1.2 var(--f-mono);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(176, 212, 236, 0.78);
}

.exp-fare-avail {
    font: 600 11px/1.2 var(--f-mono);
    color: var(--exp-accent-ink);
    background: var(--exp-accent-soft);
    border: 1px solid var(--exp-accent-border);
    padding: 2px 8px;
    border-radius: var(--r-pill);
}

.exp-fare-main {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 10px;
}

.exp-fare-amount {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    font: 700 clamp(1.75rem, 2.5vw, 2.2rem)/1.1 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: #ffffff;
    text-decoration: none;
    letter-spacing: -0.02em;
    transition: color 0.15s ease;
}

.exp-fare-amount:hover {
    color: var(--exp-accent);
    text-decoration: none;
}

.exp-fare-arrow {
    font-size: 0.7em;
    color: var(--exp-accent);
    transition: transform 0.15s ease;
}

.exp-fare-amount:hover .exp-fare-arrow {
    transform: translateY(2px);
}

.exp-fare-unit {
    font: 500 12.5px/1.35 var(--f-sans);
    color: rgba(196, 222, 242, 0.80);
}

.exp-fare-orig {
    margin: 5px 0 0;
    font: 500 12px/1.35 var(--f-mono);
    color: rgba(176, 212, 236, 0.76);
}

.exp-fare-status {
    font: 700 1.35rem/1.2 var(--f-sans);
    color: #fde68a;
    text-decoration: none;
}

.exp-fare-status--soldout {
    color: #fecdd3;
}

.exp-fare-status--soldout:hover {
    text-decoration: underline;
}

.exp-fare-empty {
    margin: 4px 0 0;
    font: 500 13.5px/1.45 var(--f-sans);
    color: rgba(196, 222, 242, 0.78);
}

/* Boarding-Pass Perforation Divider */
.exp-cockpit-perf {
    position: relative;
    display: flex;
    align-items: center;
    height: 16px;
    overflow: hidden;
}

.exp-perf-line {
    width: 100%;
    border-top: 1px dashed rgba(148, 214, 248, 0.24);
    margin: 0 12px;
}

.exp-perf-notch {
    position: absolute;
    top: 50%;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #051c2b;
    border: 1px solid rgba(148, 214, 248, 0.24);
    transform: translateY(-50%);
}

.exp-perf-notch--l {
    left: -8px;
}

.exp-perf-notch--r {
    right: -8px;
}

/* Compact Waypoint Vector Chain */
.exp-cockpit-route {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 6px;
    padding: 8px 20px 12px;
    border-bottom: 1px solid rgba(148, 214, 248, 0.14);
    font: 500 12px/1.35 var(--f-sans);
    color: rgba(214, 234, 248, 0.86);
}

.exp-waypoint {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.exp-waypoint.is-terminal {
    font-weight: 600;
    color: #ffffff;
}

.exp-waypoint .icon {
    width: 12.5px;
    height: 12.5px;
    color: var(--exp-accent);
    flex-shrink: 0;
}

.exp-waypoint-sep {
    color: rgba(148, 214, 248, 0.48);
    font-family: var(--f-mono);
}

/* Auto-Flowing Zero-Dash Telemetry Grid */
.exp-cockpit-specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: rgba(148, 214, 248, 0.12);
    border-radius: 0 0 15px 15px;
}

.exp-spec-item {
    background: rgba(5, 20, 32, 0.72);
    padding: 11px 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    position: relative;
}

.exp-spec-item:nth-last-child(1):nth-child(odd) {
    grid-column: 1 / -1;
}

.exp-cockpit-specs > .exp-spec-item:last-child {
    border-bottom-right-radius: 15px;
}

.exp-cockpit-specs > .exp-spec-item:nth-last-child(2):nth-child(odd),
.exp-cockpit-specs > .exp-spec-item:last-child:nth-child(odd) {
    border-bottom-left-radius: 15px;
}

.exp-spec-k {
    font: 700 10px/1.2 var(--f-mono);
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: rgba(164, 203, 228, 0.72);
}

.exp-spec-v {
    font: 600 13.5px/1.3 var(--f-sans);
    color: #f4faff;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

a.exp-spec-v:hover {
    color: var(--exp-accent);
    text-decoration: underline;
}

.exp-spec-item:has(.exp-badge-ice) {
    overflow: visible;
}

.exp-spec-item:has(.exp-badge-ice:hover),
.exp-spec-item:has(.exp-badge-ice:focus),
.exp-spec-item:has(.exp-badge-ice:focus-visible) {
    z-index: 30;
}

.exp-spec-item:has(.exp-badge-ice) .exp-spec-v {
    overflow: visible;
}

.exp-spec-sub {
    font: 500 11.5px/1.3 var(--f-sans);
    color: rgba(176, 212, 236, 0.72);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.exp-badge-ice {
    background: rgba(56, 189, 248, 0.15);
    border-color: rgba(125, 211, 252, 0.34);
    color: #bae6fd;
}

/* Center tooltip directly above the Ice Class pill in the right-hand cockpit cell;
   left-anchor only when the cell sits in column 1 (odd full-width fallback or <=520px mobile). */
.exp-badge-ice .ice-tooltip {
    bottom: calc(100% + 10px);
    left: 50%;
    right: auto;
    transform: translateX(-50%) translateY(4px);
}

.exp-badge-ice:hover .ice-tooltip,
.exp-badge-ice:focus .ice-tooltip,
.exp-badge-ice:focus-visible .ice-tooltip {
    transform: translateX(-50%) translateY(0);
}

.exp-spec-item:nth-child(odd) .exp-badge-ice .ice-tooltip {
    left: 0;
    transform: translateY(4px);
    text-align: left;
}

.exp-spec-item:nth-child(odd) .exp-badge-ice:hover .ice-tooltip,
.exp-spec-item:nth-child(odd) .exp-badge-ice:focus .ice-tooltip,
.exp-spec-item:nth-child(odd) .exp-badge-ice:focus-visible .ice-tooltip {
    transform: translateY(0);
}

.exp-spec-item:nth-child(odd) .exp-badge-ice .ice-tooltip::after {
    left: 22px;
    transform: rotate(45deg);
}

@media (max-width: 520px) {
    .exp-badge-ice .ice-tooltip {
        left: 0;
        transform: translateY(4px);
        text-align: left;
    }

    .exp-badge-ice:hover .ice-tooltip,
    .exp-badge-ice:focus .ice-tooltip,
    .exp-badge-ice:focus-visible .ice-tooltip {
        transform: translateY(0);
    }

    .exp-badge-ice .ice-tooltip::after {
        left: 22px;
        transform: rotate(45deg);
    }
}

/* Architectural Lower Section-Split Sticky Jump Bar */
.exp-jumpbar {
    position: sticky;
    top: var(--header-actual-h, 64px);
    z-index: 40;
    background: var(--glass-hdr-bg, rgba(255, 255, 255, 0.90));
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 4px 16px rgba(8, 22, 38, 0.05);
}

.exp-jumpbar-inner {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-top: 9px;
    padding-bottom: 9px;
    overflow-x: auto;
    scrollbar-width: none;
}

.exp-jumpbar-inner::-webkit-scrollbar {
    display: none;
}

.exp-jump-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--r-pill);
    font: 600 12.5px/1.2 var(--f-sans);
    color: var(--ink-2);
    background: transparent;
    border: 1px solid transparent;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.exp-jump-link[hidden] {
    display: none !important;
}

.exp-jump-link:hover {
    background: var(--surface);
    border-color: var(--line);
    color: var(--accent);
    text-decoration: none;
}

.exp-jump-count {
    font: 700 11px/1.15 var(--f-mono);
    padding: 1px 6px;
    border-radius: var(--r-pill);
    background: var(--surface);
    border: 1px solid var(--line);
    color: var(--muted);
}

.exp-section,
#offers,
#price-trend,
#departures,
#itinerary,
#activities,
#regions,
#overview,
#other-dates,
#similar-expeditions,
#seasonality,
#ships,
#wildlife {
    scroll-margin-top: 126px;
}

/* Unified major-section vertical rhythm across /voyages/{slug} & /operators/{op}/itineraries/{slug} */
.expedition-body {
    padding-top: var(--s8);
}

.expedition-body > .exp-section,
.expedition-body > .itinerary-glance,
.expedition-body > .price-trend,
.expedition-body > .packing-promo {
    margin: 0 0 var(--s12);
}

.expedition-body > .exp-section > h2.section-title,
.expedition-body > .exp-section > h2 {
    margin: 0 0 16px;
}

/* Keep the Price History telemetry card coupled as a companion sub-panel under Cabin Offers,
   while preserving the full 48px break before the next major section (Day by day, etc.). */
.expedition-body > .voyage-offers-section:has(+ .price-trend) {
    margin-bottom: 22px;
}

.expedition-body > :last-child {
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .expedition-body {
        padding-top: var(--s6);
    }

    .expedition-body > .exp-section,
    .expedition-body > .itinerary-glance,
    .expedition-body > .price-trend,
    .expedition-body > .packing-promo {
        margin-bottom: 36px;
    }

    .expedition-body > .voyage-offers-section:has(+ .price-trend) {
        margin-bottom: 18px;
    }

    .expedition-body > :last-child {
        margin-bottom: 0;
    }
}

/* Cabin Offers & Upcoming Departures Table Refinements */
.offer-price-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}

.offer-price-main {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px;
    white-space: nowrap;
}

.offer-price-main b {
    font: 700 15.5px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--ink);
    letter-spacing: -0.01em;
}

.offer-price-main .price-orig-note {
    display: inline;
    margin-top: 0;
    font: 500 12px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--muted);
}

.offer-promo-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: var(--ok-bg);
    border: 1px solid var(--ok-line);
    color: var(--ok);
    font: 700 11px/1.25 var(--f-sans);
    letter-spacing: 0.01em;
}

.offers-captured-note {
    color: var(--muted);
    font-size: 13px;
    margin: 10px 0 0;
}

.offer-cabin-thumb[hidden] {
    display: none !important;
}

.dep-row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: nowrap;
}

.dep-compare-check {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: var(--r-pill);
    background: var(--surface);
    border: 1px solid var(--line);
    color: var(--ink-2);
    font: 600 12px/1.2 var(--f-sans);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.dep-compare-check:hover {
    border-color: var(--accent);
    color: var(--ink);
}

.dep-compare-check input {
    margin: 0;
    accent-color: var(--accent);
    cursor: pointer;
}

.dep-compare-check:has(input:checked) {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
}

.dep-compare-check:has(input:disabled) {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Day-by-Day Expand / Collapse All Control (anchored inside .exp-days-bar right above Day 1) */
.itinerary-head-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
}

.days-toggle-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4.5px 10.5px;
    border-radius: var(--r-md);
    background: var(--card);
    border: 1px solid var(--line-dark);
    color: var(--ink-2);
    font: 600 12px/1.25 var(--f-sans);
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.days-toggle-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: linear-gradient(0deg, var(--accent-soft), var(--accent-soft)), var(--card);
}

.days-toggle-caret {
    display: inline-flex;
    align-items: center;
    color: var(--muted);
    transition: transform 0.18s ease, color 0.15s ease;
}

.days-toggle-caret .icon {
    width: 12px;
    height: 12px;
}

.days-toggle-btn:hover .days-toggle-caret {
    color: var(--accent);
}

.days-toggle-btn[aria-expanded="true"] .days-toggle-caret {
    transform: rotate(180deg);
    color: var(--accent);
}

.voyage-itinerary-section[hidden],
.voyage-itinerary-sidebar[hidden] {
    display: none !important;
}

/* Editorial Polar Atlas Visited Regions Grid (#regions) */
.exp-regions-section {
    margin: 0 0 40px;
}

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

.exp-regions-grid--pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.exp-regions-grid--single {
    grid-template-columns: minmax(0, 540px);
}

.exp-region-card {
    display: flex;
    align-items: stretch;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    overflow: hidden;
    text-decoration: none;
    color: var(--ink);
    min-height: 98px;
    transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.exp-region-card:hover {
    border-color: var(--accent);
    transform: translateY(-2px);
    text-decoration: none;
}

.exp-region-media {
    width: 108px;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    background: #072232;
    border-right: 1px solid var(--line);
}

.exp-region-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.exp-region-card:hover .exp-region-media img {
    transform: scale(1.06);
}

.exp-region-media.is-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #04131e 0%, #092c3e 100%);
    color: #38bdf8;
}

.exp-region-compass .icon {
    width: 24px;
    height: 24px;
}

.exp-region-body {
    flex: 1 1 auto;
    min-width: 0;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
}

.exp-region-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.exp-region-coords,
.exp-region-step {
    font: 600 10.5px/1.2 var(--f-mono);
    letter-spacing: 0.04em;
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.exp-region-arrow {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.exp-region-arrow .icon {
    width: 12px;
    height: 12px;
}

.exp-region-card:hover .exp-region-arrow {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
    transform: translateX(2px);
}

.exp-region-title {
    margin: 0;
    font: 700 15px/1.28 var(--f-sans);
    color: var(--ink);
    transition: color 0.15s ease;
}

.exp-region-card:hover .exp-region-title {
    color: var(--accent);
}

.exp-region-tagline {
    margin: 1px 0 0;
    font-size: 12.5px;
    line-height: 1.38;
    color: var(--muted);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Balanced 3-Up Expedition Dossier Grid (/voyages/{slug}) */
.exp-dossier-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 16px;
}

.exp-dossier-grid > .vcontext-card {
    padding: 0;
    gap: 0;
    overflow: hidden;
}

.exp-dossier-grid > .vcontext-card:has(.badge-ice) {
    overflow: visible;
}

.exp-dossier-grid > .vcontext-card:has(.badge-ice:hover, .badge-ice:focus, .badge-ice:focus-visible),
.itinerary-ship-card:has(.badge-ice:hover, .badge-ice:focus, .badge-ice:focus-visible) {
    z-index: 25;
}

.vcontext-chip.vcontext-chip-ice {
    background: var(--teal-bg);
    border-color: var(--teal-line);
    color: var(--teal-ink);
    font-weight: 600;
}

.vcontext-chip.vcontext-chip-ice .num {
    font-family: var(--f-mono);
    font-weight: 700;
}

.itinerary-badge-ice {
    padding: 1px 6px;
    font-family: var(--f-mono);
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.3;
    vertical-align: baseline;
}

.exp-dossier-grid .vcontext-body {
    padding: 15px 18px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1 1 auto;
}

.exp-dossier-grid .vcontext-title {
    font-size: 17px;
}

.exp-dossier-grid .vcontext-desc {
    font-size: 13.5px;
    line-height: 1.5;
    flex-grow: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.exp-dossier-grid .vcontext-chips {
    margin-top: auto;
    padding-top: 2px;
}

.exp-dossier-grid .vcontext-foot {
    margin-top: 0;
    padding-top: 10px;
}

.exp-ship-media,
.vcontext-season-stage,
.vcontext-brand-stage {
    position: relative;
    width: 100%;
    height: 132px;
    aspect-ratio: auto;
    border-radius: calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px) 0 0;
    overflow: hidden;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
    flex-shrink: 0;
}

.vcontext-stage-link {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

/* Travel Season Top Visual & Climate Telemetry Stage */
.vcontext-season-stage {
    background: linear-gradient(145deg, #0b1f38 0%, #14365c 55%, #1d4e7a 100%);
}

.vcontext-season-stage img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s ease;
}

.vcontext-season-stage:hover img {
    transform: scale(1.03);
}

.vcontext-season-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8, 22, 40, 0.08) 0%, rgba(8, 22, 40, 0.36) 52%, rgba(7, 19, 36, 0.84) 100%);
    pointer-events: none;
}

.vcontext-season-telemetry {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 9px;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    pointer-events: none;
}

.vcontext-tele-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 7.5px;
    border-radius: var(--r-pill);
    background: rgba(9, 23, 42, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: #f8fafc;
    font: 600 11px/1.2 var(--f-sans);
    letter-spacing: 0.01em;
}

.vcontext-tele-pill .icon {
    width: 12px;
    height: 12px;
    color: #7dd3fc;
    flex-shrink: 0;
}

/* Operator Pure-Vector Brand Stage */
.vcontext-brand-stage:not(.has-plate) {
    background-color: #f4f8fc;
    background-image:
        radial-gradient(rgba(15, 45, 78, 0.075) 1px, transparent 1px),
        linear-gradient(160deg, #fafdff 0%, #edf4fb 58%, #e4eef8 100%);
    background-size: 14px 14px, 100% 100%;
}

html[data-theme="dark"] .vcontext-brand-stage:not(.has-plate),
html[data-theme="dark"] .vcontext-banner-logo-box {
    background-color: #eef4fa;
    background-image:
        radial-gradient(rgba(15, 45, 78, 0.08) 1px, transparent 1px),
        linear-gradient(160deg, #f4f8fc 0%, #e1ebf5 100%);
    border-color: rgba(148, 197, 244, 0.22);
}

.vcontext-brand-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 24px 24px 16px;
    position: relative;
}

.vcontext-brand-stage.has-plate .vcontext-brand-link {
    display: block;
    padding: 0;
}

.vcontext-operator-logo {
    display: block;
    max-width: min(216px, 84%);
    max-height: 58px;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: transform 0.25s ease;
}

.vcontext-brand-stage:hover .vcontext-operator-logo {
    transform: scale(1.03);
}

.vcontext-brand-origin {
    position: absolute;
    top: 8px;
    right: 9px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 4.5px;
    padding: 2.5px 8px;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(15, 45, 78, 0.11);
    color: #1e3a5f;
    font: 600 10.5px/1.2 var(--f-sans);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    pointer-events: none;
}

.vcontext-brand-flag {
    font-size: 12px;
    line-height: 1;
}

/* Sleek Horizontal Operator Dossier Banner on Evergreen Itinerary Hubs */
.vcontext-operator--banner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 20px 28px;
    padding: 18px 22px;
}

.vcontext-banner-main {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
    flex: 1 1 auto;
}

.vcontext-banner-logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 184px;
    height: 86px;
    padding: 12px 18px;
    border-radius: var(--r-md);
    border: 1px solid rgba(15, 45, 78, 0.11);
    background-color: #f4f8fc;
    background-image:
        radial-gradient(rgba(15, 45, 78, 0.07) 1px, transparent 1px),
        linear-gradient(160deg, #fafdff 0%, #eaf2fa 100%);
    background-size: 12px 12px, 100% 100%;
    flex-shrink: 0;
    transition: border-color 0.2s ease;
}

.vcontext-banner-logo-box:hover {
    border-color: var(--accent);
}

.vcontext-banner-logo {
    display: block;
    max-width: 100%;
    max-height: 52px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.vcontext-banner-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.vcontext-banner-copy .vcontext-desc {
    max-width: 720px;
    margin-top: 1px;
    font-size: 13.5px;
    line-height: 1.5;
}

.vcontext-banner-chips {
    margin-top: 6px;
}

.vcontext-banner-cta {
    flex-shrink: 0;
    white-space: nowrap;
}

@media (max-width: 980px) {
    .exp-regions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .exp-regions-grid--single {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .vcontext-operator--banner {
        flex-direction: column;
        align-items: stretch;
    }

    .vcontext-banner-main {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

    .vcontext-banner-logo-box {
        width: 100%;
        height: 82px;
    }
}

@media (max-width: 620px) {
    .exp-regions-grid,
    .exp-regions-grid--pair {
        grid-template-columns: 1fr;
    }
}

.exp-ship-photo-link {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

.exp-ship-photo-link[hidden] {
    display: none !important;
}

.exp-ship-photo-link img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.exp-ship-photo-link:hover img {
    transform: scale(1.03);
}

.vcontext-header--ship {
    padding-right: 0;
}

.vcontext-title a {
    color: var(--ink);
    text-decoration: none;
    transition: color 0.15s ease;
}

.vcontext-title a:hover {
    color: var(--accent);
}

/* Balanced 2-Column Operator + Regions Pair on Itinerary Hubs (zero blank 50% gap) */
.voyage-context-grid--pair {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
}

.voyage-context-grid--pair .vcontext-card.vcontext-regions {
    grid-column: auto;
}

.voyage-context-grid--single {
    grid-template-columns: 1fr;
}

/* Consistent Operating Ship Thumb Frame with Naval Architecture Plate Fallback */
.itinerary-ship-thumb {
    width: 132px;
    height: 88px;
    flex-shrink: 0;
    border-radius: var(--r-md);
    overflow: hidden;
    border: 1px solid var(--line);
    background: var(--surface);
    position: relative;
}

.itinerary-ship-photo-link,
.itinerary-ship-plate-link {
    display: block;
    width: 100%;
    height: 100%;
}

.itinerary-ship-photo-link[hidden] {
    display: none !important;
}

.itinerary-ship-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
}

/* Unified Centered Floating Glass Capsule (Compare Strip + Scroll-Aware Offer Deck) */
.expedition-bottom-dock {
    position: fixed;
    left: 50%;
    bottom: calc(14px + env(safe-area-inset-bottom));
    transform: translate3d(-50%, 0, 0);
    width: min(880px, calc(100vw - 24px));
    z-index: 95;
    display: flex;
    flex-direction: column;
    background: var(--glass-deck-bg);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border: 1px solid var(--glass-deck-border);
    border-radius: 16px;
    box-shadow: var(--glass-deck-shadow);
    overflow: hidden;
    transition:
        opacity 0.22s ease,
        transform 0.24s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0.22s ease;
}

/* Smoothly hide the entire capsule whenever neither compare nor offer deck is active */
.expedition-bottom-dock:not(:has(.compare-tray:not([hidden]))):not(:has(.offer-bar:not(.is-scroll-hidden))) {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(-50%, 18px, 0);
}

.expedition-bottom-dock:has(.compare-tray.pulse) {
    animation: ct-pulse .4s ease;
}

/* Strip standalone outer shell off children inside the unified capsule — ONE surface, ONE shadow */
.expedition-bottom-dock .compare-tray,
.expedition-bottom-dock .offer-bar {
    position: static;
    left: auto;
    bottom: auto;
    transform: none;
    width: 100%;
    max-width: none;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    animation: none;
}

/* When compare is open while cockpit/#offers is on screen, collapse offer-bar so capsule wraps only compare */
.expedition-bottom-dock:has(.compare-tray:not([hidden])) .offer-bar.is-scroll-hidden {
    display: none;
}

/* Subtle upper-shelf tint + hairline divider when both tiers are visible together */
.expedition-bottom-dock:has(.offer-bar:not(.is-scroll-hidden)) .compare-tray {
    background: rgba(15, 23, 42, 0.032);
    border-bottom: 1px solid var(--glass-divider);
}

html[data-theme="dark"] .expedition-bottom-dock:has(.offer-bar:not(.is-scroll-hidden)) .compare-tray {
    background: rgba(148, 210, 255, 0.045);
}

.expedition-bottom-dock:has(.offer-bar:not(.is-scroll-hidden)) .compare-tray .ct-inner {
    padding-top: 6px;
    padding-bottom: 6px;
    min-height: 38px;
}

@media (prefers-reduced-motion: reduce) {
    .expedition-bottom-dock {
        transition: none;
    }
}

.offer-bar-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.offer-bar-cabins-link {
    font: 600 12.5px/1.2 var(--f-sans);
    color: var(--glass-ink-2);
    text-decoration: none;
    white-space: nowrap;
    padding: 7px 12px;
    border-radius: var(--r-pill);
    background: var(--glass-ctrl-bg);
    border: 1px solid var(--glass-ctrl-border);
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.offer-bar-cabins-link:hover {
    background: var(--glass-ctrl-bg-hover);
    border-color: var(--glass-accent-border);
    color: var(--glass-accent);
    text-decoration: none;
}

body:has(.expedition-bottom-dock .compare-tray:not([hidden])) main {
    padding-bottom: 88px;
}

body.has-offer-bar:has(.expedition-bottom-dock .compare-tray:not([hidden])) main {
    padding-bottom: 136px;
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
    .expedition-masthead-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .exp-cockpit {
        max-width: 560px;
    }

    .exp-dossier-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .exp-dossier-grid .vcontext-ship {
        grid-column: 1 / -1;
    }

    .exp-dossier-grid .vcontext-ship .exp-ship-media {
        height: 152px;
        aspect-ratio: auto;
    }
}

@media (max-width: 960px) {
    .voyage-context-grid--pair {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 880px) {
    table.offers td.is-empty-cell {
        display: none;
    }

    .offer-price-stack {
        align-items: flex-end;
        text-align: right;
    }

    table.offers td.dep-actions-cell {
        display: block;
    }

    .dep-row-actions {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 10px;
        width: 100%;
    }

    .dep-compare-check {
        padding: 9px 14px;
        justify-content: center;
    }
}

@media (max-width: 720px) {
    .expedition-masthead {
        padding: calc(var(--header-actual-h, 56px) + 16px) 0 28px;
    }

    .exp-breadcrumbs {
        font-size: 11.5px;
        margin-bottom: 14px;
    }

    .exp-dossier-grid {
        grid-template-columns: 1fr;
    }

    .exp-dossier-grid .vcontext-ship {
        grid-column: auto;
    }

    .exp-dossier-grid .vcontext-ship .exp-ship-media {
        height: 140px;
        aspect-ratio: auto;
    }

    .itinerary-ship-card {
        flex-direction: column;
        align-items: stretch;
    }

    .itinerary-ship-thumb {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .expedition-bottom-dock,
    .offer-bar {
        width: calc(100vw - 20px);
        bottom: calc(10px + env(safe-area-inset-bottom));
        border-radius: 14px;
    }

    .offer-bar-inner {
        padding: 8px 10px 8px 13px;
        min-height: 52px;
        gap: 10px;
    }

    .offer-bar .from b {
        font-size: 17.5px;
    }

    .offer-bar-cta {
        padding: 8px 13px;
        font-size: 13px;
    }

    .offer-bar-cabins-link {
        display: none;
    }
}

@media (max-width: 520px) {
    .exp-cockpit-specs {
        grid-template-columns: 1fr;
    }

    .exp-cockpit-specs > .exp-spec-item {
        border-radius: 0 !important;
    }

    .exp-cockpit-specs > .exp-spec-item:last-child {
        border-radius: 0 0 15px 15px !important;
    }
}
