/* SEO hub pages (/operators, /ships, /departures, /regions, /activities),
   ship detail specs/gallery/cabins/decks, seasonality hero & accessible season toggle,
   highlights editorial, FAQ, interactive packing checklist, legal, error, and admin pages. */

.hub-wrap {
    padding-top: var(--s5);
    padding-bottom: var(--s8);
}

.hub-intro {
    color: var(--muted);
    max-width: 760px;
    margin: 0 0 20px;
}

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

@media (min-width: 920px) {
    .hub-briefing {
        display: grid;
        grid-template-columns: minmax(0, 1.24fr) minmax(390px, 1fr);
        align-items: stretch;
    }
}

.hub-description {
    max-width: 72ch;
    margin: 0 0 24px;
    font-size: 15.5px;
    line-height: 1.72;
    color: var(--ink);
}

.hub-briefing .hub-description {
    max-width: none;
    margin: 0;
    padding: 24px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (max-width: 640px) {
    .hub-briefing .hub-description {
        padding: 18px 18px;
    }
}

.hub-description p {
    margin: 0 0 13px;
}

.hub-description p:last-child {
    margin-bottom: 0;
}

.hub-description a {
    color: var(--accent);
    text-underline-offset: 3px;
}

.hub-related h2,
.faq h2 {
    font-size: 22px;
    margin: 26px 0 10px;
}

.hub-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.hub-links li {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 6px 12px;
    font-size: 14px;
}

.hub-links li a {
    color: var(--ink);
    font-weight: 500;
}

.hub-links li a:hover {
    color: var(--accent);
    text-decoration: none;
}

.hub-links .count {
    color: var(--muted);
    font-family: var(--f-mono);
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    margin-left: 4px;
}

.hub-links.index {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 8px;
}

.hub-links.index li {
    border-radius: var(--r-lg);
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
}

.hub-cta {
    margin: 28px 0 0;
    font-weight: 600;
}

.hub .cards {
    margin-top: 4px;
}

.hub .pager {
    margin: 16px 0 0;
}

/* Wildlife blocks on hub/voyage pages */
.hub-wildlife,
.voyage-wildlife {
    margin-top: var(--s8);
}

.hub-wildlife h2,
.voyage-wildlife h2 {
    font: 400 24px/1.3 var(--f-serif);
    margin: 0 0 var(--s4);
}

.hub-wildlife .cards,
.voyage-wildlife .cards {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.hub-wildlife .ecard,
.voyage-wildlife .ecard {
    min-height: 300px;
}

/* ============================================================================
   Polar Vessel Dossier (/ships/{slug}):
   Masthead, Naval Architecture Telemetry Card, Adaptive 12-Col Bento Gallery,
   Dual-Mode Cabin Cards (Photo / Architectural Spec), Deck Plans & Routes
   ============================================================================ */
.ship-masthead .masthead-graticule {
    opacity: 0.2;
}

.ship-masthead--no-photo .masthead-graticule,
.catalog-masthead.is-no-photo .masthead-graticule {
    opacity: 0.44;
}

.masthead-bg-photo[hidden],
.ship-gallery-section[hidden],
.ship-photo[hidden],
.cabin-card-media[hidden],
.cabin-card-media-link[hidden],
.ship-decks[hidden],
.deck-plan[hidden] {
    display: none !important;
}

.ship-masthead.catalog-masthead {
    overflow: visible;
}

.ship-masthead .masthead-media {
    overflow: hidden;
}

.season-masthead-badge.ship-masthead-ice {
    position: relative;
    z-index: 5;
    cursor: help;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(12, 48, 68, 0.84);
    border-color: rgba(94, 234, 212, 0.36);
    color: #ccfbf1;
}

.season-masthead-badge.ship-masthead-ice .num {
    font-family: var(--f-mono);
    font-weight: 700;
    color: #5eead4;
}

.season-masthead-badge.ship-masthead-ice .ice-tooltip {
    left: 0;
    transform: translateY(4px);
    text-align: left;
    border-color: rgba(125, 211, 252, 0.34);
    box-shadow: var(--glass-pop-shadow);
}

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

.season-masthead-badge.ship-masthead-ice .ice-tooltip::after {
    left: 22px;
    transform: rotate(45deg);
    border-right-color: rgba(125, 211, 252, 0.34);
    border-bottom-color: rgba(125, 211, 252, 0.34);
}

/* Right-side Naval Architecture & IAATO Shore-Landing Telemetry Card */
.ship-chart-card .rchart-sector-dot {
    background: #38bdf8;
    box-shadow: 0 0 8px rgba(56, 189, 248, 0.72);
}

.ship-chart-card .rchart-coords-cross {
    color: #fbbf24;
}

.shchart-stage {
    padding: 11px 12px 12px;
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.shchart-blueprint-wrap {
    background: rgba(4, 13, 26, 0.52);
    border: 1px solid rgba(125, 211, 252, 0.16);
    border-radius: 10px;
    padding: 6px 8px 4px;
    overflow: hidden;
}

.shchart-svg {
    display: block;
    width: 100%;
    height: auto;
}

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

.shchart-metric {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(11, 29, 53, 0.62);
    border: 1px solid rgba(125, 211, 252, 0.14);
    min-width: 0;
}

.shchart-metric--accent {
    background: rgba(16, 44, 78, 0.74);
    border-color: rgba(56, 189, 248, 0.3);
}

.shchart-metric-lbl {
    font: 600 9.5px/1.2 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.055em;
    color: rgba(186, 222, 250, 0.76);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.shchart-metric-val {
    font: 700 13px/1.25 var(--f-sans);
    color: #f0f7ff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.shchart-metric-val.num {
    font-family: var(--f-mono);
    font-size: 14.5px;
    color: #ffffff;
}

.shchart-metric--accent .shchart-metric-val {
    color: #fde68a;
    font-size: 12px;
}

@media (max-width: 520px) {
    .shchart-metric {
        padding: 7px 8px;
    }

    .shchart-metric--accent .shchart-metric-val {
        font-size: 11px;
    }
}

/* Ship dossier vertical rhythm */
.ship-page > .hub-glance {
    margin: 0 0 34px;
}

.ship-gallery-section,
.ship-cabins,
.ship-decks,
.ship-routes-section,
.ship-departures {
    margin-top: 38px;
}

/* Adaptive 12-column Bento Photo Gallery (zero orphan tiles for 1..6+ photos) */
.ship-gallery {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 14px;
    align-items: start;
}

.ship-photo {
    margin: 0;
    grid-column: span 4;
    display: flex;
    flex-direction: column;
}

.ship-photo-frame {
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: var(--r-lg);
    border: 1px solid var(--line);
    background: var(--photo-placeholder);
    box-shadow: var(--sh-card);
}

.ship-photo-frame img {
    display: block;
    width: 100%;
    height: 230px;
    object-fit: cover;
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

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

@media (min-width: 780px) {
    .ship-gallery[data-count="1"] .ship-photo {
        grid-column: 1 / -1;
    }

    .ship-gallery[data-count="1"] .ship-photo-frame img {
        height: 410px;
    }

    .ship-gallery[data-count="2"] .ship-photo.is-lead {
        grid-column: span 7;
    }

    .ship-gallery[data-count="2"] .ship-photo:not(.is-lead) {
        grid-column: span 5;
    }

    .ship-gallery[data-count="2"] .ship-photo-frame img {
        height: 350px;
    }

    .ship-gallery[data-count="3"] .ship-photo.is-lead {
        grid-column: span 7;
        grid-row: span 2;
    }

    .ship-gallery[data-count="3"] .ship-photo.is-lead .ship-photo-frame img {
        height: 414px;
    }

    .ship-gallery[data-count="3"] .ship-photo:not(.is-lead) {
        grid-column: span 5;
    }

    .ship-gallery[data-count="3"] .ship-photo:not(.is-lead) .ship-photo-frame img {
        height: 200px;
    }

    .ship-gallery[data-count="4"] .ship-photo.is-lead {
        grid-column: 1 / -1;
    }

    .ship-gallery[data-count="4"] .ship-photo.is-lead .ship-photo-frame img {
        height: 350px;
    }

    .ship-gallery[data-count="4"] .ship-photo:not(.is-lead) {
        grid-column: span 4;
    }

    .ship-gallery[data-count="4"] .ship-photo:not(.is-lead) .ship-photo-frame img {
        height: 215px;
    }

    .ship-gallery[data-count="5"] .ship-photo.is-lead {
        grid-column: 1 / -1;
    }

    .ship-gallery[data-count="5"] .ship-photo.is-lead .ship-photo-frame img {
        height: 350px;
    }

    .ship-gallery[data-count="5"] .ship-photo:not(.is-lead) {
        grid-column: span 3;
    }

    .ship-gallery[data-count="5"] .ship-photo:not(.is-lead) .ship-photo-frame img {
        height: 195px;
    }

    .ship-gallery[data-count="6"] .ship-photo {
        grid-column: span 3;
    }

    .ship-gallery[data-count="6"] .ship-photo .ship-photo-frame img {
        height: 195px;
    }

    .ship-gallery[data-count="6"] .ship-photo.is-lead {
        grid-column: span 8;
    }

    .ship-gallery[data-count="6"] .ship-photo.is-lead .ship-photo-frame img {
        height: 340px;
    }

    .ship-gallery[data-count="6"] .ship-photo:nth-child(2) {
        grid-column: span 4;
    }

    .ship-gallery[data-count="6"] .ship-photo:nth-child(2) .ship-photo-frame img {
        height: 340px;
    }

    .ship-gallery[data-count="6"] .ship-photo:nth-child(2 of .ship-photo:not([hidden])) {
        grid-column: span 4;
    }

    .ship-gallery[data-count="6"] .ship-photo:nth-child(2 of .ship-photo:not([hidden])) .ship-photo-frame img {
        height: 340px;
    }
}

@media (max-width: 779px) {
    .ship-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .ship-photo {
        grid-column: span 1;
    }

    .ship-photo.is-lead {
        grid-column: 1 / -1;
    }

    .ship-photo.is-lead .ship-photo-frame img {
        height: 250px;
    }

    .ship-photo:not(.is-lead) .ship-photo-frame img {
        height: 165px;
    }
}

.ship-photo figcaption {
    margin-top: 5px;
    padding: 0 2px;
    font-size: 11px;
    line-height: 1.35;
    color: var(--muted);
}

.ship-photo figcaption a {
    color: var(--muted);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Dual-Mode Cabin Cards: Photo Mode + Architectural Stateroom Spec Mode */
.cabin-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    gap: 16px;
}

.cabin-grid--more {
    margin-top: 16px;
}

.cabin-card {
    display: flex;
    flex-direction: column;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    overflow: hidden;
    transition: border-color 0.16s ease;
}

.cabin-card:hover {
    border-color: var(--accent-ring);
}

.cabin-grid--no-photos .cabin-card {
    border-top: 3px solid var(--accent-ring);
}

.cabin-card-media {
    position: relative;
    width: 100%;
    height: 186px;
    overflow: hidden;
    background: var(--photo-placeholder);
    border-bottom: 1px solid var(--line);
    flex-shrink: 0;
}

.cabin-card-media-link {
    display: block;
    width: 100%;
    height: 100%;
}

.cabin-card-media-link img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

.cabin-card-media-link:hover img {
    transform: scale(1.035);
}

.cabin-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 16px 18px 18px;
    gap: 10px;
}

.cabin-grid--no-photos .cabin-body {
    padding: 18px 20px 20px;
}

.cabin-head {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.cabin-body h3 {
    margin: 0;
    font: 600 17px/1.3 var(--f-serif);
    color: var(--ink);
}

.cabin-spec-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.cabin-spec-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    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);
}

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

.cabin-desc {
    margin: 0;
    font-size: 13.75px;
    line-height: 1.55;
    color: var(--ink-2);
}

/* Unified progressive-disclosure stateroom amenities (.cabin-card & table.offers) */
.cabin-incabin {
    margin-top: auto;
    border-top: 1px solid var(--line);
    padding-top: 10px;
}

.cabin-incabin-summary {
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    user-select: none;
    font: 600 12.5px/1.3 var(--f-sans);
    color: var(--accent);
    transition: color 0.15s ease;
}

.cabin-incabin-summary::-webkit-details-marker {
    display: none;
}

.cabin-incabin-summary:hover {
    color: var(--accent-hover);
}

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

.cabin-incabin-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    padding: 1px 6.5px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    color: var(--accent);
    font: 700 11px/1.3 var(--f-mono);
    font-variant-numeric: tabular-nums;
    transition: background 0.15s ease;
}

.cabin-incabin-summary:hover .cabin-incabin-count,
.cabin-incabin[open] .cabin-incabin-count {
    background: var(--accent-soft-hover);
}

.cabin-incabin-caret {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    color: var(--muted);
    flex-shrink: 0;
    transition: transform 0.18s ease, background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.cabin-incabin-caret .icon {
    width: 13px;
    height: 13px;
}

.cabin-incabin-summary:hover .cabin-incabin-caret {
    color: var(--accent);
    border-color: var(--accent-ring);
    background: var(--accent-soft);
}

.cabin-incabin[open] .cabin-incabin-caret {
    transform: rotate(180deg);
    color: var(--accent);
    border-color: var(--accent-ring);
    background: var(--accent-soft);
}

.cabin-incabin-list {
    margin: 9px 0 0;
    padding: 10px 12px;
    list-style: none;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 5px 14px;
    border-radius: var(--r-md);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--ink-2);
}

.cabin-incabin-list.is-two-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 540px) {
    .cabin-incabin-list.is-two-col {
        grid-template-columns: minmax(0, 1fr);
    }
}

.cabin-incabin-list li {
    padding-left: 13px;
    position: relative;
    min-width: 0;
    overflow-wrap: break-word;
}

.cabin-incabin-list li::before {
    content: '';
    position: absolute;
    left: 1px;
    top: 0.56em;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--accent);
}

/* Deck Plans (high-contrast drafting stage for both light & dark themes) */
.deck-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 16px;
}

.deck-grid--more {
    margin-top: 16px;
}

.deck-plan {
    display: flex;
    flex-direction: column;
    margin: 0;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    padding: 12px;
    transition: border-color 0.16s ease;
}

.deck-plan:hover {
    border-color: var(--accent-ring);
}

.deck-plan-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-md);
    background: #f5f9fd;
    border: 1px solid rgba(15, 35, 62, 0.08);
    padding: 10px;
    overflow: hidden;
}

html[data-theme="dark"] .deck-plan-stage {
    background: #ecf3fa;
    border-color: rgba(148, 197, 244, 0.22);
}

.deck-plan img {
    display: block;
    width: 100%;
    height: auto;
}

.deck-plan figcaption {
    margin-top: 8px;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--ink-2);
}

.deck-plan figcaption a {
    color: var(--muted);
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.deck-pdf {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--s3) var(--s4);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
}

.deck-pdf:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
}

/* Regions Hub (/regions) & Activities Hub (/activities) */
.regions-hub,
.activities-hub {
    margin-bottom: var(--s12);
}

/* ============================================================================
   Polar Nautical Chart Card (.region-chart-card) in /regions & /regions/{slug}
   ============================================================================ */
.region-chart-card {
    width: 100%;
    border-radius: 14px;
    background: rgba(6, 18, 34, 0.74);
    backdrop-filter: blur(16px) saturate(135%);
    -webkit-backdrop-filter: blur(16px) saturate(135%);
    border: 1px solid rgba(125, 211, 252, 0.22);
    box-shadow: 0 18px 42px rgba(2, 8, 18, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    overflow: hidden;
    color: #dbeafe;
}

.rchart-head,
.rchart-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 12px;
    font: 600 10.5px/1.2 var(--f-mono);
    letter-spacing: 0.07em;
    color: rgba(214, 231, 248, 0.86);
}

.rchart-head {
    text-transform: uppercase;
    border-bottom: 1px solid rgba(125, 211, 252, 0.14);
    background: rgba(4, 13, 26, 0.42);
}

.rchart-foot {
    border-top: 1px solid rgba(125, 211, 252, 0.14);
    background: rgba(4, 13, 26, 0.42);
    letter-spacing: 0.04em;
}

.rchart-sector {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rchart-sector-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #38bdf8;
    box-shadow: 0 0 8px rgba(56, 189, 248, 0.8);
    flex-shrink: 0;
}

.rchart-hemisphere {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    color: #93c5fd;
}

.rchart-mini-globe {
    width: 22px;
    height: 22px;
    display: block;
}

.rchart-meridian {
    font-size: 10px;
    color: rgba(186, 230, 253, 0.85);
}

.rchart-stage {
    position: relative;
    background:
        radial-gradient(circle at 50% 48%, rgba(14, 46, 82, 0.68) 0%, rgba(4, 14, 28, 0.94) 100%);
}

.rchart-svg {
    display: block;
    width: 100%;
    height: 222px;
    font-family: var(--f-sans);
    user-select: none;
}

.rchart-grid {
    stroke: rgba(125, 211, 252, 0.13);
    stroke-width: 1px;
    vector-effect: non-scaling-stroke;
    fill: none;
}

.rchart-circle-arc {
    stroke: rgba(125, 211, 252, 0.34);
    stroke-width: 1.2px;
    stroke-dasharray: 4 4;
    vector-effect: non-scaling-stroke;
    fill: none;
}

.rchart-circle-arc.is-active-arc {
    stroke: #38bdf8;
    stroke-width: 2.5px;
    stroke-dasharray: none;
}

.rchart-land {
    fill: rgba(148, 214, 255, 0.14);
    stroke: rgba(148, 214, 255, 0.44);
    stroke-width: 1.1px;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.rchart-shelf {
    fill: rgba(186, 230, 253, 0.22);
    stroke: rgba(186, 230, 253, 0.56);
    stroke-width: 1px;
    stroke-dasharray: 3 2;
    vector-effect: non-scaling-stroke;
}

.rchart-land.is-active-land,
.rchart-shelf.is-active-land {
    fill: rgba(56, 189, 248, 0.34);
    stroke: #7dd3fc;
    stroke-width: 1.85px;
    stroke-dasharray: none;
}

.rchart-active-lane {
    fill: none;
    stroke: #38bdf8;
    stroke-width: 3px;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    opacity: 0.92;
}

.rchart-active-zone {
    fill: rgba(56, 189, 248, 0.17);
    stroke: #38bdf8;
    stroke-width: 1.5px;
    stroke-dasharray: 4 3;
    vector-effect: non-scaling-stroke;
}

.rchart-water-deco {
    font-family: var(--f-mono);
    font-weight: 600;
    letter-spacing: 0.12em;
    fill: rgba(148, 214, 255, 0.38);
    pointer-events: none;
}

.rchart-neighbor {
    cursor: pointer;
    text-decoration: none;
    outline: none;
}

.rchart-hit {
    fill: transparent;
}

.rchart-nb-halo {
    fill: rgba(125, 211, 252, 0.13);
    transition: fill .16s ease;
}

.rchart-nb-dot {
    fill: #93c5fd;
    stroke: #061427;
    stroke-width: 1.1px;
    vector-effect: non-scaling-stroke;
    transition: fill .16s ease;
}

.rchart-nb-label {
    font-weight: 500;
    fill: rgba(219, 234, 254, 0.80);
    paint-order: stroke;
    stroke: rgba(4, 13, 26, 0.90);
    stroke-width: 3.2px;
    stroke-linejoin: round;
    transition: fill .16s ease;
}

.rchart-neighbor:hover .rchart-nb-halo,
.rchart-neighbor:focus-visible .rchart-nb-halo {
    fill: rgba(56, 189, 248, 0.32);
}

.rchart-neighbor:hover .rchart-nb-dot,
.rchart-neighbor:focus-visible .rchart-nb-dot {
    fill: #38bdf8;
}

.rchart-neighbor:hover .rchart-nb-label,
.rchart-neighbor:focus-visible .rchart-nb-label {
    fill: #ffffff;
}

.rchart-active-pin {
    pointer-events: none;
}

.rchart-pulse {
    fill: rgba(56, 189, 248, 0.24);
    transform-box: fill-box;
    transform-origin: center;
    animation: rchart-beacon-pulse 2.8s ease-out infinite;
}

@keyframes rchart-beacon-pulse {
    0% {
        transform: scale(0.65);
        opacity: 0.85;
    }
    75% {
        transform: scale(1.25);
        opacity: 0.1;
    }
    100% {
        transform: scale(1.3);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rchart-pulse {
        animation: none;
    }
}

.rchart-ring {
    fill: none;
    stroke: #38bdf8;
    stroke-width: 1.5px;
    vector-effect: non-scaling-stroke;
}

.rchart-beacon {
    fill: #38bdf8;
    stroke: #ffffff;
    stroke-width: 1.5px;
    vector-effect: non-scaling-stroke;
}

.rchart-active-label {
    fill: #ffffff;
    font-weight: 700;
    paint-order: stroke;
    stroke: rgba(4, 13, 26, 0.95);
    stroke-width: 3.8px;
    stroke-linejoin: round;
}

/* Per-viewBox typography & pin scaling */
.rchart-svg--fine .rchart-nb-label {
    font-size: 12.8px;
}

.rchart-svg--fine .rchart-active-label {
    font-size: 14.6px;
}

.rchart-svg--fine .rchart-water-deco {
    font-size: 10.2px;
}

.rchart-svg--corridor .rchart-nb-label {
    font-size: 13.4px;
}

.rchart-svg--corridor .rchart-active-label {
    font-size: 15.4px;
}

.rchart-svg--overview .rchart-nb-label {
    font-size: 19.2px;
    stroke-width: 4.8px;
}

.rchart-svg--overview .rchart-nb-dot {
    r: 4.4px;
}

.rchart-svg--overview .rchart-nb-halo {
    r: 8.6px;
}

.rchart-svg--overview .rchart-hit {
    r: 18px;
}

/* 2-Hemisphere Embarkation Ports Polar Chart (/ports) */
.ports-chart-card [hidden] {
    display: none !important;
}

.rchart-hemisphere--btn {
    background: transparent;
    border: 1px solid transparent;
    padding: 2px 7px 2px 5px;
    margin: -3px -5px -3px 0;
    border-radius: var(--r-pill);
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.rchart-hemisphere--btn:hover {
    background: rgba(56, 189, 248, 0.14);
    border-color: rgba(125, 211, 252, 0.26);
    color: #e0f2fe;
}

.rchart-hemisphere--btn:focus-visible,
.rchart-side-btn:focus-visible {
    outline: 2px solid #38bdf8;
    outline-offset: 2px;
}

.rchart-svg--ports-sa .rchart-nb-label {
    font-size: 24.8px;
    stroke-width: 6.4px;
}

.rchart-svg--ports-sa .rchart-water-deco {
    font-size: 20px;
}

.rchart-svg--ports-nz .rchart-nb-label {
    font-size: 13.4px;
    stroke-width: 3.4px;
}

.rchart-svg--ports-nz .rchart-water-deco {
    font-size: 10.4px;
}

.rchart-port-route {
    fill: none;
    stroke: rgba(125, 211, 252, 0.34);
    stroke-width: 1.15px;
    stroke-dasharray: 3.5 3.5;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}

.rchart-subisland {
    fill: rgba(148, 214, 255, 0.45);
    stroke: rgba(186, 230, 253, 0.65);
    stroke-width: 0.9px;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}

.rchart-land.is-gateway-land {
    fill: rgba(56, 189, 248, 0.20);
    stroke: rgba(125, 211, 252, 0.58);
}

.rchart-port-pin.is-featured .rchart-nb-halo {
    fill: rgba(56, 189, 248, 0.22);
}

.rchart-port-pin.is-featured .rchart-nb-dot {
    fill: #38bdf8;
    stroke: #f0f9ff;
    stroke-width: 1.25px;
}

.rchart-port-pin.is-featured .rchart-nb-label {
    fill: #f8fafc;
    font-weight: 600;
}

.region-chart-card .flag-icon {
    box-shadow: 0 0 0 1px rgba(186, 230, 253, 0.32);
}

.rchart-flags {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.rchart-flags .flag-icon {
    width: 13px;
    height: 9.5px;
    flex: 0 0 13px;
    border-radius: 1.75px;
    vertical-align: 0;
}

.rchart-coords {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(214, 231, 248, 0.86);
    white-space: nowrap;
    flex-shrink: 0;
}

.rchart-coords-sep {
    opacity: 0.52;
}

.rchart-coords-cross {
    color: #38bdf8;
    font-weight: 700;
}

.rchart-hint {
    font-family: var(--f-sans);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0;
    color: rgba(148, 214, 255, 0.72);
    text-align: right;
    min-width: 0;
}

.rchart-ross-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 9px;
    border-radius: var(--r-pill);
    background: rgba(56, 189, 248, 0.14);
    border: 1px solid rgba(125, 211, 252, 0.28);
    color: #7dd3fc;
    font: 600 10.5px/1.35 var(--f-sans);
    letter-spacing: 0.01em;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.rchart-ross-pill:hover {
    background: rgba(56, 189, 248, 0.25);
    border-color: #38bdf8;
    color: #ffffff;
    text-decoration: none;
}

.rchart-side-btn {
    gap: 5.5px;
    padding: 3px 9px 3px 7.5px;
    cursor: pointer;
}

.rchart-side-arrow {
    display: inline-block;
    font-size: 11px;
    line-height: 1;
    transition: transform .2s ease;
}

.rchart-side-btn[data-side-only="americas"]:hover .rchart-side-arrow {
    transform: rotate(40deg);
}

.rchart-side-btn[data-side-only="pacific"]:hover .rchart-side-arrow {
    transform: rotate(-40deg);
}

/* Sub-masthead bar on /regions/{slug}: breadcrumbs + departure finder CTA */
.region-hub-wrap {
    padding-top: var(--s5);
}

.region-subbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--s3);
    margin-bottom: var(--s5);
}

.region-subbar .breadcrumbs {
    margin: 0;
}

.region-finder-cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    color: var(--accent);
    font: 600 13px/1.3 var(--f-sans);
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.region-finder-cta:hover {
    background: var(--accent-soft-hover);
    border-color: var(--accent);
    text-decoration: none;
    transform: translateY(-1px);
}

.region-finder-cta .icon {
    width: 14px;
    height: 14px;
}

/* Season Masthead Badges, Month Switcher Strip & Solar/Sea-Ice Telemetry SVG Chart */
.season-masthead-badges {
    list-style: none;
    margin: 16px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.season-masthead-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    border-radius: var(--r-pill);
    background: rgba(10, 27, 49, 0.62);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(148, 214, 255, 0.22);
    font: 500 12px/1.25 var(--f-sans);
    color: rgba(224, 242, 254, 0.94);
}

.season-masthead-badge .icon {
    width: 13.5px;
    height: 13.5px;
    color: #7dd3fc;
    flex-shrink: 0;
}

.season-month-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--s3);
    margin: calc(-1 * var(--s2)) 0 var(--s6);
    padding: 8px 12px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
}

.season-month-cluster {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.season-austral-tag {
    display: inline-flex;
    align-items: center;
    padding: 5px 8px;
    border-radius: var(--r-sm);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    font: 700 11px/1 var(--f-mono);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
    color: var(--accent);
    white-space: nowrap;
    user-select: none;
}

.season-month-pills {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.season-year-turn {
    display: inline-flex;
    align-items: center;
    height: 18px;
    margin-left: 2px;
    padding-left: 8px;
    border-left: 1px solid var(--line-dark);
    font: 600 10.5px/1 var(--f-mono);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.03em;
    color: var(--muted);
    white-space: nowrap;
    user-select: none;
}

.season-month-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    font: 600 12.5px/1.2 var(--f-sans);
    color: var(--ink-2);
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.season-month-pill:hover {
    background: var(--accent-soft);
    border-color: var(--accent-ring);
    color: var(--accent);
    text-decoration: none;
}

.season-month-pill.is-current {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
}

.season-month-pill.is-current:hover {
    color: var(--accent-ink);
}

.season-month-pill-count {
    font-family: var(--f-mono);
    font-size: 11px;
    font-weight: 600;
    opacity: 0.82;
    font-variant-numeric: tabular-nums;
}

.season-year-switcher {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-shrink: 0;
}

.season-year-prefix {
    font: 700 10.5px/1 var(--f-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
    white-space: nowrap;
    user-select: none;
}

.season-year-track {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border-radius: var(--r-md);
    background: var(--field-bg);
    border: 1px solid var(--line);
}

html[data-theme="dark"] .season-year-track {
    background: var(--subtle-bg);
}

.season-year-seg {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: var(--r-sm);
    font: 600 12px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--ink-2);
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}

.season-year-seg:not(.is-current) + .season-year-seg:not(.is-current)::before {
    content: "";
    position: absolute;
    left: -1.5px;
    top: 22%;
    bottom: 22%;
    width: 1px;
    background: var(--line-dark);
    pointer-events: none;
    transition: opacity .15s ease;
}

a.season-year-seg:hover::before,
a.season-year-seg:hover + .season-year-seg::before {
    opacity: 0;
}

a.season-year-seg:not(.is-current):hover {
    background: var(--card);
    color: var(--accent);
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(11, 29, 58, 0.06);
}

html[data-theme="dark"] a.season-year-seg:not(.is-current):hover {
    background: var(--accent-soft);
    color: var(--accent);
    box-shadow: none;
}

.season-year-seg.is-current {
    background: var(--accent);
    color: var(--accent-ink);
    box-shadow: var(--sh-segment);
}

.season-year-seg.is-current:hover {
    color: var(--accent-ink);
    text-decoration: none;
}

.season-year-seg.is-empty {
    color: var(--muted);
    opacity: 0.45;
    cursor: default;
    user-select: none;
}

.season-year-seg-yr {
    font-weight: 700;
}

.season-year-seg-count {
    font-size: 10.5px;
    font-weight: 500;
    opacity: 0.78;
}

.season-year-seg.is-current .season-year-seg-count {
    opacity: 0.88;
}

@media (max-width: 680px) {
    .season-year-switcher {
        width: 100%;
        justify-content: space-between;
        margin-left: 0;
        padding-top: 8px;
        border-top: 1px solid var(--line);
    }

    .season-year-track {
        overflow-x: auto;
        max-width: 100%;
    }
}

.season-chart-card .rchart-sector-dot {
    background: #fbbf24;
    box-shadow: 0 0 8px rgba(251, 191, 36, 0.85);
}

.season-chart-card .rchart-coords-cross {
    color: #fbbf24;
}

.schart-legend {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    font: 600 10px/1 var(--f-mono);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(214, 231, 248, 0.82);
}

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

.schart-swatch {
    display: inline-block;
    width: 10px;
    height: 2.5px;
    border-radius: 2px;
}

.schart-swatch--solar {
    background: linear-gradient(90deg, #38bdf8, #fbbf24, #a78bfa);
}

.schart-swatch--ice {
    width: 11px;
    height: 0;
    border-top: 2px dashed #7dd3fc;
    background: none;
}

.schart-svg {
    height: 210px;
}

.schart-solar-line {
    fill: none;
    stroke: url(#schart-solar-stroke);
    stroke-width: 2.6px;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

.schart-ice-line {
    fill: none;
    stroke: rgba(125, 211, 252, 0.62);
    stroke-width: 1.6px;
    stroke-dasharray: 4 3;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

.schart-ice-node {
    fill: #7dd3fc;
    opacity: 0.78;
    pointer-events: none;
}

.schart-ice-node.is-active {
    fill: #38bdf8;
    stroke: #061427;
    stroke-width: 1.1px;
    opacity: 1;
}

.schart-solar-dot {
    fill: #fde68a;
    stroke: #061427;
    stroke-width: 1.2px;
    transition: fill .16s ease;
}

.schart-point:hover .schart-solar-dot,
.schart-point:focus-visible .schart-solar-dot {
    fill: #fbbf24;
}

.schart-point:hover .rchart-nb-halo,
.schart-point:focus-visible .rchart-nb-halo {
    fill: rgba(251, 191, 36, 0.28);
}

.schart-val {
    font: 600 10.5px/1 var(--f-mono);
    fill: rgba(224, 242, 254, 0.80);
    paint-order: stroke;
    stroke: rgba(4, 13, 26, 0.88);
    stroke-width: 2.8px;
    stroke-linejoin: round;
    transition: fill .16s ease;
}

.schart-point:hover .schart-val,
.schart-point:focus-visible .schart-val {
    fill: #ffffff;
}

.schart-val.is-active {
    font-weight: 700;
    font-size: 11.5px;
    fill: #fef3c7;
}

.schart-axis-label {
    font: 600 10.5px/1 var(--f-mono);
    letter-spacing: 0.05em;
    fill: rgba(186, 230, 253, 0.78);
    transition: fill .16s ease;
}

.schart-point:hover .schart-axis-label,
.schart-point:focus-visible .schart-axis-label {
    fill: #ffffff;
}

.schart-axis-pill.is-active {
    fill: #fbbf24;
}

.schart-axis-label.is-active {
    fill: #061427;
    font-weight: 700;
}

.schart-scanline {
    stroke: rgba(251, 191, 36, 0.48);
    stroke-width: 1.2px;
    stroke-dasharray: 3 3;
    vector-effect: non-scaling-stroke;
}

.schart-solar-pulse {
    fill: rgba(251, 191, 36, 0.28);
}

.schart-solar-ring {
    fill: none;
    stroke: #fbbf24;
    stroke-width: 1.5px;
    vector-effect: non-scaling-stroke;
}

.schart-solar-beacon {
    fill: #fbbf24;
    stroke: #ffffff;
    stroke-width: 1.5px;
    vector-effect: non-scaling-stroke;
}

@media (max-width: 900px) {
    .region-chart-card--detail {
        max-width: 480px;
    }
    .region-chart-card--detail .rchart-svg {
        height: 192px;
    }
}

@media (max-width: 768px) {
    .region-chart-card--index {
        display: none;
    }
    .rchart-hint {
        display: none;
    }
}

.hub-header {
    margin-bottom: var(--s5);
}

/* Instant category filter bar on /activities */
.act-filter-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 var(--s6);
}

.act-filter-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.act-filter-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    font: 600 13px/1.2 var(--f-sans);
    color: var(--ink-2);
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
}

.act-filter-pill:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.act-filter-pill.is-active {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--bg);
}

.act-filter-icon {
    display: inline-flex;
    align-items: center;
    color: var(--accent);
    line-height: 1;
}

.act-filter-pill.is-active .act-filter-icon {
    color: currentColor;
}

.act-filter-icon .icon {
    width: 14.5px;
    height: 14.5px;
}

.act-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1px 6px;
    border-radius: var(--r-pill);
    background: var(--surface);
    color: var(--muted);
    font-family: var(--f-mono);
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.act-filter-pill.is-active .act-filter-count {
    background: rgba(255, 255, 255, .16);
    color: currentColor;
}

html[data-theme="dark"] .act-filter-pill.is-active .act-filter-count {
    background: rgba(15, 23, 42, .18);
}

.regions-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--s6);
    grid-auto-flow: dense;
}

/* Unified 2+3+3+3 = 11 editorial bento grid on /activities (switches to 3-col when filtered) */
.activities-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--s5);
}

.activities-grid > .acard {
    grid-column: span 2;
}

.activities-grid.is-filtered {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.activities-grid.is-filtered > .acard {
    grid-column: span 1;
}

@media (min-width: 960px) {
    .activities-grid:not(.is-filtered) > .acard:nth-child(-n+2) {
        grid-column: span 3;
        min-height: 430px;
    }
    .activities-grid:not(.is-filtered) > .acard:nth-child(-n+2) .acard-title {
        font-size: 24px;
    }
    .activities-grid:not(.is-filtered) > .acard:nth-child(-n+2) .acard-body {
        padding: 26px 26px 24px;
    }
    .regions-grid:not(.is-filtered) > .rcard:first-child {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 1.15fr 1fr;
    }
    .regions-grid:not(.is-filtered) > .rcard:first-child .rcard-media {
        height: 100%;
        min-height: 320px;
    }
    .regions-grid:not(.is-filtered) > .rcard:first-child .rcard-title {
        font-size: 26px;
    }
    .regions-grid:not(.is-filtered) > .rcard:first-child .rcard-desc {
        font-size: 15px;
        line-height: 1.6;
    }
    .regions-grid:not(.is-filtered) > .rcard:nth-child(4),
    .regions-grid:not(.is-filtered) > .rcard:nth-child(8),
    .regions-grid:not(.is-filtered) > .rcard:nth-child(13) {
        grid-column: span 2;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .regions-grid:not(.is-filtered) > .rcard:nth-child(4) .rcard-media,
    .regions-grid:not(.is-filtered) > .rcard:nth-child(8) .rcard-media,
    .regions-grid:not(.is-filtered) > .rcard:nth-child(13) .rcard-media {
        height: 100%;
        min-height: 280px;
    }
    .regions-grid:not(.is-filtered) > .rcard:nth-child(4) .rcard-title,
    .regions-grid:not(.is-filtered) > .rcard:nth-child(8) .rcard-title,
    .regions-grid:not(.is-filtered) > .rcard:nth-child(13) .rcard-title {
        font-size: 22px;
    }
}

@media (max-width: 959px) and (min-width: 641px) {
    .regions-grid,
    .activities-grid,
    .activities-grid.is-filtered {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--s4);
    }
    .activities-grid > .acard {
        grid-column: span 1;
    }
    .activities-grid:not(.is-filtered) > .acard:first-child {
        grid-column: span 2;
    }
    .regions-grid:not(.is-filtered) > .rcard:first-child,
    .regions-grid:not(.is-filtered) > .rcard:nth-child(4),
    .regions-grid:not(.is-filtered) > .rcard:nth-child(13) {
        grid-column: span 2;
    }
}

@media (max-width: 640px) {
    .regions-grid,
    .activities-grid,
    .activities-grid.is-filtered {
        grid-template-columns: 1fr;
        gap: var(--s4);
    }
    .activities-grid > .acard {
        grid-column: span 1;
        min-height: 340px;
    }
    .regions-grid > .rcard {
        grid-column: span 1;
        display: flex;
        flex-direction: column;
    }
}

/* Antarctic Seasons Index (/seasons) */
.seasonality-title {
    font: 400 34px/1.2 var(--f-serif);
    letter-spacing: -0.015em;
    color: var(--ink);
    margin: 0 0 var(--s3);
}

.catalog-masthead .seasonality-title {
    font: 400 clamp(2.35rem, 4.3vw, 3.85rem)/1.05 var(--f-serif);
    letter-spacing: -0.022em;
    color: #ffffff;
    margin: 0 0 12px;
}

.seasons-page.seasonality-guide {
    margin: 0;
}

.months-departures-wrap {
    padding: var(--s5) 0 var(--s16);
    background: var(--bg);
    position: relative;
    z-index: 10;
}

.seasons-subbar {
    margin-bottom: var(--s5);
}

.months-cards--canonical {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--s5);
}

/* Fringe / Shoulder-Edge Callout Strip (e.g. April or September) */
.shoulder-months-strip {
    margin-top: var(--s5);
    display: flex;
    flex-direction: column;
    gap: var(--s3);
}

.shoulder-mcard {
    content-visibility: visible;
    scroll-margin-top: 90px;
    padding: var(--s4) var(--s5);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--s5);
}

.shoulder-mcard-info {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    flex: 1 1 360px;
}

.shoulder-mcard-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
}

.shoulder-mcard-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    font: 700 10.5px/1.3 var(--f-mono);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--muted);
}

.shoulder-mcard-title {
    margin: 0;
    font: 400 21px/1.2 var(--f-serif);
    letter-spacing: -0.01em;
}

.shoulder-mcard-title a {
    color: var(--ink);
    text-decoration: none;
}

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

.shoulder-mcard-blurb {
    max-width: 620px;
}

.shoulder-mcard-years {
    margin-top: 0;
    padding-top: 0;
    flex: 0 0 340px;
    max-width: 100%;
}

@media (max-width: 1040px) {
    .months-cards--canonical {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--s4);
    }
    .shoulder-mcard {
        flex-direction: column;
        align-items: stretch;
        gap: var(--s3);
    }
    .shoulder-mcard-info {
        flex: 1 1 auto;
    }
    .shoulder-mcard-years {
        flex: 1 1 auto;
    }
}

@media (max-width: 768px) {
    .catalog-masthead .seasonality-title {
        font-size: clamp(1.85rem, 7vw, 2.35rem);
        margin-bottom: 8px;
    }
    .months-departures-wrap {
        padding: var(--s4) 0 var(--s12);
    }
}

@media (max-width: 640px) {
    .months-cards--canonical {
        grid-template-columns: 1fr;
    }
    .months-departures-wrap {
        padding: var(--s4) 0 var(--s8);
    }
}

/* Wildlife index (/wildlife) & species detail (/wildlife/{slug}) */
.wildlife-hub {
    margin-bottom: var(--s12);
}

.wildlife-filter-stack {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0 0 var(--s6);
}

.wildlife-filter-stack .wildlife-group-bar {
    margin-bottom: 0;
}

.wildlife-habitat-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
}

.wildlife-habitat-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font: 600 11.5px/1.2 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
    margin-right: 2px;
}

.wildlife-habitat-label .icon {
    width: 13px;
    height: 13px;
    color: var(--accent);
}

.wildlife-habitat-pills {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.wildlife-habitat-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    font: 500 12.5px/1.2 var(--f-sans);
    color: var(--ink-2);
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.wildlife-habitat-pill:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.wildlife-habitat-pill.is-active {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
    font-weight: 600;
}

.wildlife-habitat-count {
    font-family: var(--f-mono);
    font-size: 11px;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.wildlife-habitat-pill.is-active .wildlife-habitat-count {
    color: var(--accent);
}

.wildlife-grid [hidden],
.wildlife-filter-empty[hidden] {
    display: none !important;
}

.wildlife-filter-empty {
    margin: var(--s4) 0;
    padding: var(--s6);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    text-align: center;
}

.wildlife-filter-empty p {
    margin: 0 0 var(--s3);
    color: var(--muted);
    font-size: 15px;
}

.wildlife-reset-btn {
    display: inline-flex;
    align-items: center;
    padding: 7px 15px;
    border-radius: var(--r-pill);
    border: 1px solid var(--accent-ring);
    background: var(--accent-soft);
    color: var(--accent);
    font: 600 13px/1.2 var(--f-sans);
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}

.wildlife-reset-btn:hover {
    background: var(--accent-soft-hover);
    border-color: var(--accent);
}

.wildlife-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--s8);
    align-items: start;
}

@media (min-width: 960px) {
    .wildlife-detail-layout:not(.is-single) {
        grid-template-columns: minmax(0, 1fr) 330px;
        gap: var(--s10);
    }
}

.editorial {
    max-width: 760px;
    margin: 0 auto;
}

.wildlife-editorial {
    margin: 0;
    max-width: 780px;
}

.wildlife-habitat-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 20px 22px;
    box-shadow: var(--sh-card);
}

@media (min-width: 960px) {
    .wildlife-habitat-card {
        position: sticky;
        top: calc(var(--header-actual-h, 64px) + var(--s4));
    }
}

.wildlife-habitat-card-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 6px;
    font: 600 11px/1.2 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent);
}

.wildlife-habitat-card-eyebrow .icon {
    width: 13.5px;
    height: 13.5px;
}

.wildlife-habitat-card h2 {
    margin: 0 0 6px;
    font: 400 21px/1.25 var(--f-serif);
    color: var(--ink);
}

.wildlife-habitat-card-hint {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--muted);
}

.wildlife-habitat-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.wildlife-habitat-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 12px;
    border-radius: var(--r-md);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    color: var(--ink);
    font: 600 13.5px/1.3 var(--f-sans);
    text-decoration: none;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.wildlife-habitat-link:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
    text-decoration: none;
}

.wildlife-habitat-link-main {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.wildlife-habitat-link-main .icon {
    width: 14px;
    height: 14px;
    color: var(--accent);
    flex-shrink: 0;
}

.wildlife-habitat-link-meta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex-shrink: 0;
    color: var(--muted);
}

.wildlife-habitat-link-meta .icon {
    width: 13px;
    height: 13px;
    transition: transform .15s ease;
}

.wildlife-habitat-link:hover .wildlife-habitat-link-meta {
    color: var(--accent);
}

.wildlife-habitat-link:hover .wildlife-habitat-link-meta .icon {
    transform: translateX(2px);
}

.wildlife-habitat-dep-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 7px;
    border-radius: var(--r-pill);
    background: var(--surface);
    border: 1px solid var(--line);
    font: 600 11px/1.2 var(--f-mono);
    color: var(--ink-2);
}

.wildlife-habitat-cta {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 9.5px 14px;
    border-radius: var(--r-pill);
    background: var(--accent);
    color: var(--accent-ink);
    font: 600 13px/1.25 var(--f-sans);
    text-decoration: none;
    transition: background .15s ease, transform .15s ease;
}

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

.wildlife-habitat-cta .icon {
    width: 13.5px;
    height: 13.5px;
}

.wildlife-departures,
.wildlife-related {
    margin-top: var(--s12);
}

.wildlife-related .cards {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.wildlife-related .ecard {
    min-height: 310px;
}

.editorial-eyebrow {
    margin: 0 0 var(--s2);
    font: var(--t-caps);
    text-transform: uppercase;
    letter-spacing: var(--ls-caps);
    color: var(--accent);
}

.editorial h1 {
    font: 400 34px/1.2 var(--f-serif);
    letter-spacing: -.015em;
    margin: 0 0 var(--s3);
}

.editorial-lead {
    margin: 0 0 var(--s6);
    font-size: 17px;
    line-height: 1.6;
    color: var(--muted);
}

.editorial-hero {
    margin: 0 0 var(--s6);
}

.editorial-hero img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--r-lg);
}

.editorial-hero figcaption {
    margin-top: 6px;
    font-size: 12px;
    color: var(--muted);
}

.editorial-hero figcaption a {
    color: var(--muted);
    text-decoration: underline;
}

.editorial-body {
    font-size: 16px;
    line-height: 1.7;
}

.editorial-body p {
    margin: 0 0 var(--s4);
}

.editorial-body a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: color .15s ease, text-decoration-thickness .15s ease;
}

.editorial-body a:hover {
    color: var(--accent-hover);
    text-decoration-thickness: 2px;
}

.editorial h2 {
    font: 400 24px/1.3 var(--f-serif);
    margin: var(--s10) 0 var(--s4);
}

.editorial .cards {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.editorial .ecard {
    min-height: 300px;
}

/* FAQ hub (/faq) + standalone entry (/faq/{slug}) */
.faq-controls-panel {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 0 0 var(--s8);
    padding: 16px 18px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
}

.faq-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
}

.faq-search-box {
    position: relative;
    flex: 1 1 320px;
    max-width: 560px;
    display: flex;
    align-items: center;
}

.faq-search-icon {
    position: absolute;
    left: 14px;
    display: inline-flex;
    align-items: center;
    color: var(--muted);
    pointer-events: none;
}

.faq-search-icon .icon {
    width: 16px;
    height: 16px;
}

.faq-search-input {
    width: 100%;
    height: 42px;
    padding: 0 38px 0 40px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--subtle-bg);
    color: var(--ink);
    font: 500 14.5px/1.3 var(--f-sans);
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.faq-search-input::placeholder {
    color: var(--muted);
    font-weight: 400;
}

.faq-search-input:focus {
    outline: none;
    border-color: var(--accent);
    background: var(--card);
    box-shadow: 0 0 0 3px var(--accent-ring);
}

.faq-search-input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
}

.faq-search-clear {
    position: absolute;
    right: 8px;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 0;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}

.faq-search-clear:hover {
    background: var(--wash);
    color: var(--ink);
}

.faq-search-clear .icon {
    width: 14px;
    height: 14px;
}

.faq-search-clear[hidden] {
    display: none;
}

.faq-expand-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 15px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink-2);
    font: 600 13px/1.2 var(--f-sans);
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.faq-expand-toggle:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: var(--accent-soft);
}

.faq-category-bar {
    margin: 0;
}

.faq-sections {
    display: flex;
    flex-direction: column;
    gap: var(--s8);
    max-width: 920px;
}

.faq-section[hidden],
.faq-item[hidden],
.faq-filter-empty[hidden] {
    display: none !important;
}

.faq-section-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
}

.faq-section-icon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--accent-soft);
    color: var(--accent);
    flex-shrink: 0;
}

.faq-section-icon .icon {
    width: 15px;
    height: 15px;
}

.faq-section-head h2 {
    margin: 0;
    font: 400 24px/1.25 var(--f-serif);
    letter-spacing: -0.01em;
    color: var(--ink);
}

.faq-section-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 9px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    font: 600 11.5px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--muted);
}

.faq-accordion-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.faq-item {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    transition: border-color .16s ease, box-shadow .16s ease;
}

.faq-item:hover {
    border-color: var(--line-dark);
}

.faq-item[open] {
    border-color: var(--accent-ring);
    box-shadow: var(--sh-card);
}

.faq-question {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 18px;
    cursor: pointer;
    user-select: none;
    transition: background .15s ease, color .15s ease;
}

.faq-question::-webkit-details-marker {
    display: none;
}

.faq-question::marker {
    content: "";
}

.faq-question:hover .faq-question-text {
    color: var(--accent);
}

.faq-question-text {
    font: 600 15.5px/1.4 var(--f-sans);
    color: var(--ink);
    transition: color .15s ease;
}

.faq-item[open] .faq-question {
    padding-bottom: 12px;
}

.faq-item[open] .faq-question-text {
    color: var(--accent);
}

.faq-chevron {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    color: var(--ink-2);
    flex-shrink: 0;
    transition: transform .2s ease, background .15s ease, border-color .15s ease, color .15s ease;
}

.faq-chevron .icon {
    width: 13px;
    height: 13px;
}

.faq-item[open] .faq-chevron {
    transform: rotate(180deg);
    background: var(--accent-soft);
    border-color: var(--accent-ring);
    color: var(--accent);
}

.faq-answer-panel {
    padding: 0 18px 16px;
}

.faq-answer-body {
    max-width: 74ch;
    padding-top: 2px;
    font-size: 15.5px;
    line-height: 1.68;
    color: var(--ink-2);
}

.faq-answer-body p {
    margin: 0 0 12px;
}

.faq-answer-body p:last-child {
    margin-bottom: 0;
}

.faq-answer-body a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.faq-answer-body a:hover {
    color: var(--accent-hover);
}

.faq-answer-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 14px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.faq-guide-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6.5px 13px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    color: var(--accent);
    font: 600 13px/1.25 var(--f-sans);
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.faq-guide-chip:hover {
    background: var(--accent-soft-hover);
    border-color: var(--accent);
    color: var(--accent);
    text-decoration: none;
    transform: translateY(-1px);
}

.faq-guide-chip .icon {
    width: 13.5px;
    height: 13.5px;
}

.faq-guide-chip.is-primary {
    padding: 9px 16px;
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
    font-size: 13.5px;
}

.faq-guide-chip.is-primary:hover {
    background: var(--accent-hover);
    border-color: var(--accent-hover);
    color: var(--accent-ink);
}

.faq-permalink {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    color: var(--muted);
    font: 500 12.5px/1.3 var(--f-sans);
    text-decoration: none;
    transition: color .15s ease;
}

.faq-permalink:hover {
    color: var(--accent);
    text-decoration: none;
}

.faq-permalink .icon {
    width: 12px;
    height: 12px;
}

.faq-filter-empty {
    max-width: 920px;
    padding: 36px 24px;
    text-align: center;
    background: var(--card);
    border: 1px dashed var(--line-dark);
    border-radius: var(--r-lg);
}

.faq-filter-empty p {
    margin: 0 0 14px;
    font-size: 15px;
    color: var(--muted);
}

.faq-bottom-banner {
    max-width: 920px;
    margin-top: var(--s10);
    padding: 24px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px 24px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
}

.faq-bottom-copy h2 {
    margin: 0 0 5px;
    font: 400 23px/1.25 var(--f-serif);
    color: var(--ink);
}

.faq-bottom-copy p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--muted);
    max-width: 56ch;
}

.faq-bottom-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.faq-bottom-primary {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9.5px 17px;
    border-radius: var(--r-pill);
    background: var(--accent);
    color: var(--accent-ink);
    font: 600 13.5px/1.25 var(--f-sans);
    text-decoration: none;
    transition: background .15s ease, transform .15s ease;
}

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

.faq-bottom-primary .icon {
    width: 14px;
    height: 14px;
}

.faq-bottom-secondary {
    display: inline-flex;
    align-items: center;
    padding: 9px 14px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink);
    font: 600 13px/1.25 var(--f-sans);
    text-decoration: none;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.faq-bottom-secondary:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: var(--accent-soft);
    text-decoration: none;
}

/* Standalone /faq/{slug} entry layout */
.faq-entry-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--s8);
    align-items: start;
}

@media (min-width: 960px) {
    .faq-entry-layout:not(.is-single) {
        grid-template-columns: minmax(0, 1fr) 340px;
        gap: var(--s10);
    }
}

.faq-entry-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 26px 30px;
    box-shadow: var(--sh-card);
}

@media (max-width: 640px) {
    .faq-entry-card {
        padding: 20px 18px;
    }
    .faq-bottom-banner {
        padding: 20px 18px;
    }
}

.faq-entry-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4.5px 11px;
    margin: 0 0 18px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    color: var(--accent);
    font: 600 12px/1.2 var(--f-sans);
}

.faq-entry-badge .icon {
    width: 13.5px;
    height: 13.5px;
}

.faq-entry .answer {
    max-width: 72ch;
    font-size: 16.5px;
    line-height: 1.72;
    color: var(--ink);
}

.faq-entry .answer p {
    margin: 0 0 14px;
}

.faq-entry .answer p:last-child {
    margin-bottom: 0;
}

.faq-entry .answer a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.faq-entry .answer a:hover {
    color: var(--accent-hover);
}

.faq-next-box {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 18px;
}

.faq-finder-link {
    font: 600 13.5px/1.35 var(--f-sans);
    color: var(--accent);
    text-decoration: none;
}

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

.faq-related-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 20px 22px;
    box-shadow: var(--sh-card);
}

@media (min-width: 960px) {
    .faq-related-card {
        position: sticky;
        top: calc(var(--header-actual-h, 64px) + var(--s4));
    }
}

.faq-related-head h2 {
    margin: 0 0 14px;
    font: 400 20px/1.25 var(--f-serif);
    color: var(--ink);
}

.faq-related-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.faq-related-link {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 9.5px 12px;
    border-radius: var(--r-md);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    color: var(--ink);
    font: 500 13.5px/1.38 var(--f-sans);
    text-decoration: none;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.faq-related-link:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
    text-decoration: none;
}

.faq-related-link .icon {
    width: 13px;
    height: 13px;
    margin-top: 3px;
    color: var(--muted);
    flex-shrink: 0;
    transition: transform .15s ease, color .15s ease;
}

.faq-related-link:hover .icon {
    color: var(--accent);
    transform: translateX(2px);
}

.faq-all-questions-link {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--accent);
    font: 600 13px/1.3 var(--f-sans);
    text-decoration: none;
}

.faq-all-questions-link:hover {
    color: var(--accent-hover);
    text-decoration: underline;
}

.faq-all-questions-link .icon {
    width: 13px;
    height: 13px;
}

/* Packing checklist (/packing-list & /packing-list/{shareId}) */
.packing-subbar-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.packing-sync-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--r-pill);
    background: var(--ok-bg);
    border: 1px solid var(--ok-line);
    color: var(--ok);
    font: 600 12.5px/1.25 var(--f-sans);
}

.packing-sync-badge .icon {
    width: 13px;
    height: 13px;
}

.packing-sync-badge[hidden],
.packing-group[hidden],
.packing-item[hidden],
.packing-filter-empty[hidden] {
    display: none !important;
}

/* 5-tile Polar Packing Rules strip */
.packing-rules-strip {
    margin: 0 0 var(--s8);
}

.packing-rules-head {
    margin: 0 0 12px;
}

.packing-rules-head h2 {
    margin: 0;
    font: 600 12px/1.3 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent);
}

.packing-rules-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.packing-rule-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 15px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.packing-rule-top {
    display: flex;
    align-items: center;
    gap: 8px;
}

.packing-rule-icon {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--accent-soft);
    color: var(--accent);
    flex-shrink: 0;
}

.packing-rule-icon .icon {
    width: 14px;
    height: 14px;
}

.packing-rule-num {
    font: 700 11px/1 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--muted);
}

.packing-rule-title {
    margin: 0;
    font: 700 13.5px/1.25 var(--f-sans);
    color: var(--ink);
}

.packing-rule-body {
    margin: 0;
    font-size: 13px;
    line-height: 1.52;
    color: var(--ink-2);
}

/* 2-Column Interactive Packing Cockpit */
.packing-cockpit {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--s6);
    align-items: start;
}

@media (min-width: 1024px) {
    .packing-cockpit {
        grid-template-columns: 315px minmax(0, 1fr);
        gap: var(--s8);
    }
}

.packing-rail {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

@media (min-width: 1024px) {
    .packing-rail {
        position: sticky;
        top: calc(var(--header-actual-h, 64px) + var(--s4));
        max-height: calc(100vh - var(--header-actual-h, 64px) - 32px);
        overflow-y: auto;
    }
}

.packing-command-card,
.packing-nav-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 18px 18px;
    box-shadow: var(--sh-card);
}

.packing-progress {
    margin: 0 0 14px;
}

.packing-progress-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.packing-count {
    font: 500 13.5px/1.3 var(--f-sans);
    font-variant-numeric: tabular-nums;
    color: var(--muted);
}

.packing-count b {
    font-size: 18px;
    font-weight: 700;
    color: var(--ink);
}

.packing-pct {
    font: 700 13px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--accent);
}

.packing-bar {
    height: 8px;
    border-radius: var(--r-pill);
    background: var(--wash);
    margin-top: 9px;
    overflow: hidden;
}

.packing-bar-fill {
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent) 0%, var(--teal) 100%);
    transition: width .24s ease;
}

.packing-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.packing-btn-primary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 10px 14px;
    border-radius: var(--r-pill);
    background: var(--accent);
    color: var(--accent-ink);
    font: 600 13.5px/1.25 var(--f-sans);
    text-decoration: none;
    transition: background .15s ease, transform .15s ease;
}

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

.packing-btn-primary .icon {
    width: 14px;
    height: 14px;
}

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

.packing-btn-secondary {
    flex: 1 1 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8.5px 12px;
    border-radius: var(--r-pill);
    border: 1px solid var(--accent-ring);
    background: var(--accent-soft);
    color: var(--accent);
    font: 600 12.5px/1.25 var(--f-sans);
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}

.packing-btn-secondary:hover {
    background: var(--accent-soft-hover);
    border-color: var(--accent);
}

.packing-btn-secondary .icon {
    width: 13.5px;
    height: 13.5px;
    flex-shrink: 0;
}

.packing-btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8.5px 12px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--muted);
    font: 600 12.5px/1.25 var(--f-sans);
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease;
}

.packing-btn-ghost:hover {
    border-color: var(--bad);
    color: var(--bad);
}

.packing-filter-block {
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.packing-filter-pills {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
    padding: 3px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
}

.packing-filter-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 6px 8px;
    border-radius: var(--r-pill);
    border: 0;
    background: transparent;
    color: var(--muted);
    font: 600 12px/1.2 var(--f-sans);
    cursor: pointer;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}

.packing-filter-pill:hover {
    color: var(--ink);
}

.packing-filter-pill.is-active {
    background: var(--card);
    color: var(--accent);
    box-shadow: 0 1px 3px rgba(13, 27, 42, 0.08);
}

.packing-pill-num {
    font: 600 11px/1 var(--f-mono);
    font-variant-numeric: tabular-nums;
    opacity: 0.8;
}

.packing-provided-shortcut {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 7.5px 12px;
    border-radius: var(--r-md);
    border: 1px dashed var(--ok-line);
    background: var(--ok-bg);
    color: var(--ok);
    font: 600 12px/1.25 var(--f-sans);
    cursor: pointer;
    transition: border-color .15s ease, filter .15s ease;
}

.packing-provided-shortcut:hover {
    border-style: solid;
    filter: brightness(0.98);
}

.packing-provided-shortcut .icon {
    width: 13.5px;
    height: 13.5px;
    flex-shrink: 0;
}

/* 10-Category Jump Rail */
.packing-nav-eyebrow {
    margin: 0 0 10px;
    font: 600 11px/1.2 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
}

.packing-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

@media (max-width: 1023px) {
    .packing-nav-card {
        padding: 12px 14px;
    }
    .packing-nav-eyebrow {
        display: none;
    }
    .packing-nav-list {
        flex-direction: row;
        overflow-x: auto;
        gap: 8px;
        padding-bottom: 2px;
        scrollbar-width: thin;
    }
    .packing-nav-list li {
        flex: 0 0 auto;
    }
}

.packing-nav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 7px 10px;
    border-radius: var(--r-md);
    color: var(--ink-2);
    font: 500 13px/1.3 var(--f-sans);
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}

@media (max-width: 1023px) {
    .packing-nav-link {
        background: var(--subtle-bg);
        border: 1px solid var(--line);
        border-radius: var(--r-pill);
        padding: 6px 12px;
        white-space: nowrap;
    }
}

.packing-nav-link:hover {
    background: var(--accent-soft);
    color: var(--accent);
    text-decoration: none;
}

.packing-nav-link-main {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.packing-nav-link-main .icon {
    width: 14px;
    height: 14px;
    color: var(--accent);
    flex-shrink: 0;
}

.packing-nav-count {
    font: 600 11px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--muted);
    padding: 2px 6px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    flex-shrink: 0;
}

.packing-nav-link.is-complete .packing-nav-link-main .icon {
    color: var(--ok);
}

.packing-nav-link.is-complete .packing-nav-count {
    background: var(--ok-bg);
    color: var(--ok);
}

/* Main Checklist Column & Unified Category Cards */
.packing-main {
    display: flex;
    flex-direction: column;
    gap: var(--s6);
}

.packing-group {
    scroll-margin-top: calc(var(--header-actual-h, 64px) + 20px);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    overflow: hidden;
    transition: border-color .16s ease;
}

.packing-group.is-complete {
    border-color: var(--ok-line);
}

.packing-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 14px;
    padding: 16px 20px;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.packing-group-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.packing-group-icon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--accent-soft);
    color: var(--accent);
    flex-shrink: 0;
}

.packing-group.is-complete .packing-group-icon {
    background: var(--ok-bg);
    color: var(--ok);
}

.packing-group-icon .icon {
    width: 15px;
    height: 15px;
}

.packing-group h2 {
    margin: 0;
    font: 400 21px/1.25 var(--f-serif);
    color: var(--ink);
}

.packing-group-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 9px;
    border-radius: var(--r-pill);
    background: var(--card);
    border: 1px solid var(--line);
    font: 600 11.5px/1.2 var(--f-mono);
    font-variant-numeric: tabular-nums;
    color: var(--muted);
}

.packing-group-count.is-complete {
    background: var(--ok-bg);
    border-color: var(--ok-line);
    color: var(--ok);
}

.packing-group-toggle {
    padding: 5px 11px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--card);
    color: var(--ink-2);
    font: 600 12px/1.2 var(--f-sans);
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.packing-group-toggle:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: var(--accent-soft);
}

.packing-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.packing-item + .packing-item {
    border-top: 1px solid var(--line);
}

.packing-item-row {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 13px 20px;
    cursor: pointer;
    transition: background .12s ease;
}

.packing-item-row:hover {
    background: var(--subtle-bg);
}

.packing-checkbox {
    position: absolute;
    opacity: 0;
    width: 20px;
    height: 20px;
    margin: 0;
    pointer-events: none;
}

.packing-check-ui {
    width: 21px;
    height: 21px;
    margin-top: 1px;
    border-radius: 6px;
    border: 1.6px solid var(--line-dark);
    background: var(--card);
    color: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .12s ease;
}

.packing-check-ui .icon {
    width: 13px;
    height: 13px;
}

.packing-item-row:hover .packing-check-ui {
    border-color: var(--accent);
}

.packing-checkbox:focus-visible + .packing-check-ui {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.packing-checkbox:checked + .packing-check-ui {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
}

.packing-item-main {
    min-width: 0;
    flex: 1 1 auto;
}

.packing-item-top {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 8px;
}

.packing-item-label {
    font: 600 14.5px/1.38 var(--f-sans);
    color: var(--ink);
    transition: color .15s ease;
}

.packing-item-note {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    color: var(--muted);
    line-height: 1.48;
}

.packing-item.done {
    background: var(--surface);
}

.packing-item.done .packing-item-label {
    color: var(--muted);
    text-decoration: line-through;
}

.packing-item.done .packing-item-note {
    opacity: 0.78;
}

.packing-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: var(--r-pill);
    font: 600 11px/1.25 var(--f-sans);
    color: var(--ok);
    background: var(--ok-bg);
    border: 1px solid var(--ok-line);
}

.packing-badge .icon {
    width: 11.5px;
    height: 11.5px;
}

/* Integrated Field Notes drawer inside each Category Card */
.packing-more {
    border-top: 1px solid var(--line);
    background: var(--subtle-bg);
}

.packing-more-summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 20px;
    cursor: pointer;
    font: 600 13px/1.3 var(--f-sans);
    color: var(--accent);
    user-select: none;
    transition: background .15s ease;
}

.packing-more-summary::-webkit-details-marker {
    display: none;
}

.packing-more-summary::marker {
    content: "";
}

.packing-more-summary:hover {
    background: var(--accent-soft);
}

.packing-more-title {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.packing-more-title .icon {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.packing-more-caret {
    display: inline-flex;
    align-items: center;
    transition: transform .2s ease;
}

.packing-more-caret .icon {
    width: 13px;
    height: 13px;
}

.packing-more[open] .packing-more-caret {
    transform: rotate(180deg);
}

.packing-more-body {
    padding: 0 20px 15px;
}

.packing-more-body p {
    margin: 0;
    max-width: 72ch;
    font-size: 13.5px;
    line-height: 1.64;
    color: var(--ink-2);
}

.packing-filter-empty {
    padding: 36px 24px;
    text-align: center;
    background: var(--card);
    border: 1px dashed var(--line-dark);
    border-radius: var(--r-lg);
}

.packing-filter-empty p {
    margin: 0 0 14px;
    font-size: 15px;
    color: var(--muted);
}

.packing-bottom-banner {
    max-width: none;
}

/* Legal & support pages */
.legal {
    max-width: 760px;
}

.legal h2 {
    font-size: 19px;
    margin: 28px 0 10px;
}

.legal p,
.legal li {
    font-size: 15.5px;
    line-height: 1.6;
    color: var(--ink-2);
}

.legal ul {
    padding-left: 20px;
}

.legal code {
    font-family: var(--f-mono);
    font-size: .92em;
    background: var(--field-bg);
    padding: 1px 5px;
    border-radius: var(--r-xs);
}

.legal-meta {
    color: var(--muted);
    font-size: 13px;
    margin: -8px 0 16px;
}

.legal-contact {
    margin: 16px 0 24px;
}

/* Error pages (templates/bundles/TwigBundle/Exception/) */
.error-page {
    max-width: 640px;
    margin: var(--s12) auto var(--s16);
    text-align: center;
}

.error-code {
    margin: 0 0 var(--s2);
    font: 600 13px/1 var(--f-mono);
    letter-spacing: var(--ls-caps);
    color: var(--muted);
}

.error-page h1 {
    font: 400 32px/1.2 var(--f-serif);
    letter-spacing: -.01em;
    margin: 0 0 var(--s3);
}

.error-lead {
    margin: 0 0 var(--s6);
    color: var(--muted);
    font-size: 15px;
    line-height: 1.6;
}

.error-actions {
    display: flex;
    gap: var(--s5);
    align-items: center;
    justify-content: center;
    margin: 0;
    font-size: 14px;
}

.error-links {
    text-align: left;
}

/* Back-office: scrape board and login */
.admin-scrape h1 { margin: 0 0 var(--s1); }
.admin-scrape .subtitle { color: var(--muted); font: var(--t-body); margin: 0 0 var(--s5); }
.admin-scrape table {
    width: 100%;
    border-collapse: collapse;
    font: var(--t-body);
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
}
.admin-scrape th,
.admin-scrape td {
    padding: var(--s2) var(--s3);
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--line);
}
.admin-scrape th {
    font: var(--t-label);
    letter-spacing: var(--ls-label);
    text-transform: uppercase;
    color: var(--muted);
    background: var(--bg);
    white-space: nowrap;
}
.admin-scrape td.num {
    text-align: right;
    font-family: var(--f-mono);
    font-variant-numeric: tabular-nums;
}
.admin-scrape .muted { color: var(--muted); }
.admin-scrape .badge.success { background: var(--ok-bg); color: var(--ok); border-color: var(--ok-line); }
.admin-scrape .badge.warning { background: var(--warn-bg); color: var(--warn); border-color: var(--warn-line); }
.admin-scrape .badge.failed { background: var(--bad-bg); color: var(--bad); border-color: var(--bad-line); }
.admin-scrape .badge.running { background: var(--accent-soft); color: var(--accent); border-color: rgba(0, 95, 204, .2); }
.admin-scrape .badge.never { background: var(--bg); color: var(--muted); border-color: var(--line); }
.admin-scrape details { max-width: 26rem; }
.admin-scrape details summary { cursor: pointer; color: var(--bad); }
.admin-scrape details ul { margin: var(--s1) 0 0; padding-left: 1.1rem; }
.admin-scrape details li { margin-bottom: var(--s1); overflow-wrap: anywhere; }
.admin-scrape .stats { color: var(--muted); font-size: 12px; }
.admin-scrape button {
    padding: 5px var(--s3);
    border: 1px solid var(--accent);
    border-radius: var(--r-sm);
    background: var(--card);
    color: var(--accent);
    font: var(--t-body);
    font-weight: 600;
    cursor: pointer;
}
.admin-scrape button:hover:not([disabled]) { background: var(--accent); color: var(--accent-ink); }
.admin-scrape button[disabled] { border-color: var(--line); color: var(--muted); cursor: not-allowed; }
.admin-scrape .flash { padding: var(--s3) var(--s4); border-radius: var(--r-md); margin-bottom: var(--s4); font: var(--t-body); }
.admin-scrape .flash.success { background: var(--ok-bg); color: var(--ok); }
.admin-scrape .flash.warning { background: var(--warn-bg); color: var(--warn); }

.login-box {
    max-width: 22rem;
    margin: var(--s16) auto;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: var(--s8);
    box-shadow: var(--sh-card);
}
.login-box h1 { margin: 0 0 var(--s5); font-size: 24px; }
.login-box label {
    display: block;
    margin: var(--s4) 0 var(--s1);
    font: var(--t-label);
    letter-spacing: var(--ls-label);
    text-transform: uppercase;
    color: var(--muted);
}
.login-box input {
    width: 100%;
    height: 38px;
}
.login-box button {
    margin-top: var(--s6);
    width: 100%;
    padding: 10px;
    border: 0;
    border-radius: var(--r-md);
    background: var(--accent);
    color: var(--accent-ink);
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
}
.login-box button:hover { opacity: .92; }
.login-box .error {
    background: var(--bad-bg);
    color: var(--bad);
    border: 1px solid var(--bad-line);
    padding: var(--s3) var(--s4);
    border-radius: var(--r-md);
    margin-bottom: var(--s4);
    font: var(--t-body);
}


/* --- Operator Hub Overview (/operators/{slug} page 1): fleet & evergreen itineraries --- */
.operator-hub-overview {
    display: flex;
    flex-direction: column;
    gap: 36px;
    margin: 0 0 38px;
}


/* --- Phase 3: GEO "At-a-Glance" Summary Citation Tables, Cruise Styles & About Page --- */
.hub-glance {
    margin: 0 0 24px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    overflow: hidden;
}

.hub > .hub-glance:not(.styles-matrix-section) {
    max-width: 760px;
}

.hub--operator > .hub-glance:not(.styles-matrix-section) {
    max-width: none;
    margin-bottom: 32px;
}

/* Operator Dossier Brand Stage + Key Facts Split Card (/operators/{slug}) */
.hub-briefing.operator-briefing {
    margin-bottom: 32px;
}

@media (min-width: 920px) {
    .hub-briefing.operator-briefing {
        grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr);
    }

    .hub-briefing.operator-briefing.has-editorial-desc {
        grid-template-columns: minmax(360px, 0.96fr) minmax(420px, 1.04fr);
    }
}

.operator-brand-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--card);
}

.operator-brand-stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-height: 184px;
    padding: 28px;
}

.operator-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%;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

html[data-theme="dark"] .operator-brand-stage:not(.has-plate) {
    background-color: #eef4fa;
    background-image:
        radial-gradient(rgba(15, 45, 78, 0.085) 1px, transparent 1px),
        linear-gradient(160deg, #f5f9fd 0%, #e1ebf5 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.operator-brand-stage.has-plate {
    padding: 0;
}

.operator-brand-stage.has-plate .media-plate {
    width: 100%;
    height: 100%;
    min-height: 184px;
}

.operator-brand-logo {
    display: block;
    max-width: min(244px, 80%);
    max-height: 76px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.operator-brand-origin {
    position: absolute;
    top: 10px;
    right: 11px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(15, 45, 78, 0.12);
    color: #1e3a5f;
    font: 600 11px/1.2 var(--f-sans);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    pointer-events: none;
}

.operator-brand-flag {
    font-size: 12.5px;
    line-height: 1;
}

.hub-briefing .operator-brand-editorial {
    padding: 18px 22px;
    border-top: 1px solid var(--line);
    font-size: 14.5px;
    line-height: 1.66;
}

.operator-brand-foot {
    display: flex;
    align-items: center;
    padding: 9px 18px;
    min-height: 37px;
    background: var(--surface);
    border-top: 1px solid var(--line);
    box-sizing: border-box;
}

.operator-brand-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
}

.operator-brand-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 2.5px 9px;
    border-radius: var(--r-pill);
    background: var(--card);
    border: 1px solid var(--line);
    color: var(--ink-2);
    font: 600 11px/1.25 var(--f-sans);
    letter-spacing: 0.005em;
}

.operator-brand-chip .icon {
    width: 12px;
    height: 12px;
    color: var(--accent);
    flex-shrink: 0;
}

.operator-brand-chip.is-iaato {
    background: var(--accent-soft);
    border-color: var(--accent-ring);
    color: var(--accent-dark);
}

@media (max-width: 640px) {
    .operator-brand-stage {
        min-height: 144px;
        padding: 22px 20px;
    }

    .operator-brand-stage.has-plate .media-plate {
        min-height: 144px;
    }

    .operator-brand-logo {
        max-width: min(210px, 76%);
        max-height: 62px;
    }

    .hub-briefing .operator-brand-editorial {
        padding: 16px 18px;
    }
}

.hub-briefing .hub-glance {
    margin: 0;
    width: 100%;
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
}

@media (min-width: 920px) {
    .hub-briefing .hub-glance {
        border-top: 0;
        border-left: 1px solid var(--line);
    }
}

.glance-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.glance-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
    line-height: 1.45;
}

.glance-table caption {
    text-align: left;
    padding: 11px 16px;
    font: var(--t-caps);
    text-transform: uppercase;
    letter-spacing: var(--ls-caps);
    color: var(--muted);
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.glance-table th,
.glance-table td {
    padding: 10px 16px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
}

.glance-table tbody tr:last-child th,
.glance-table tbody tr:last-child td {
    border-bottom: 0;
}

.glance-table tbody th {
    width: 34%;
    max-width: 240px;
    font-weight: 600;
    color: var(--ink-2);
}

.glance-table thead th {
    font-size: 11.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
    background: var(--surface);
}

.glance-table td {
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.glance-table td.glance-num {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.glance-subnote {
    display: block;
    margin-top: 2px;
    font-family: var(--f-sans);
    font-size: 11.5px;
    font-weight: 400;
    line-height: 1.3;
    color: var(--muted);
}

/* Compact 2-column Bento Key-Facts Grid for .hub-glance--dossier (preserves semantic <table>) */
.hub-glance--dossier .glance-table {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;
}

.hub-glance--dossier .glance-table caption {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 10px 18px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--muted);
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.hub-glance--dossier .glance-table tbody {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    flex: 1;
    gap: 1px;
    background: var(--line);
}

.hub-glance--dossier .glance-table tbody tr {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 11px 18px;
    background: var(--subtle-bg);
}

.hub > .hub-glance--dossier .glance-table tbody tr {
    background: var(--card);
}

.hub-glance--dossier .glance-table tbody tr:nth-last-child(2):nth-child(odd) {
    grid-column: 1 / -1;
}

.hub-glance--dossier .glance-table tbody th,
.hub-glance--dossier .glance-table tbody td {
    padding: 0;
    border: 0;
    width: auto;
    max-width: none;
}

.hub-glance--dossier .glance-table tbody th {
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1.3;
    color: var(--muted);
}

.hub-glance--dossier .glance-table tbody td {
    font-family: var(--f-sans);
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.hub-glance--dossier .glance-table tbody tr.glance-verified-row {
    grid-column: 1 / -1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 4px 12px;
    padding: 9px 18px;
    background: var(--surface);
}

.hub-glance--dossier .glance-table tbody tr.glance-verified-row th {
    font-size: 12px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    color: var(--muted);
    background: transparent;
}

.hub-glance--dossier .glance-table tbody tr.glance-verified-row td {
    font-size: 12px;
    font-weight: 400;
    color: var(--muted);
    background: transparent;
}

.hub-glance--dossier .glance-table tbody tr.glance-verified-row time {
    font-family: var(--f-sans);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--ink);
}

@media (max-width: 520px) {
    .hub-glance--dossier .glance-table tbody {
        grid-template-columns: 1fr;
    }
    .hub-glance--dossier .glance-table caption,
    .hub-glance--dossier .glance-table tbody tr,
    .hub-glance--dossier .glance-table tbody tr.glance-verified-row {
        padding-left: 16px;
        padding-right: 16px;
    }
}

.glance-table a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.glance-verified-row th,
.glance-verified-row td {
    background: var(--surface);
    font-size: 12.5px;
    color: var(--muted);
}

.glance-verified-row time {
    font-family: var(--f-mono);
    font-weight: 600;
    color: var(--ink);
}

.glance-verified-sep {
    margin: 0 6px;
}

.glance-freshness-note {
    margin: 10px 0 0;
    font-size: 12.5px;
    color: var(--muted);
}

.glance-freshness-note time {
    font-family: var(--f-mono);
    font-weight: 600;
    color: var(--ink-2);
}

/* /styles index & /styles/{slug} detail pages:
   Symmetrical 2x2 Style Cards (.stcard), Side-by-Side Comparison Matrix,
   4-Pill Switcher Strip & Polar Schematic Telemetry SVG (.stchart-*) */
.styles-content-wrap {
    padding-top: var(--s5);
    padding-bottom: var(--s8);
}

.styles-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--s6);
    margin: 0 0 var(--s8);
}

@media (max-width: 820px) {
    .styles-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .glance-table tbody th {
        width: 42%;
    }
}

.stcard-media {
    position: relative;
    width: 100%;
    height: 230px;
    flex-shrink: 0;
    overflow: hidden;
    background: var(--dark);
}

@media (max-width: 520px) {
    .stcard-media {
        height: 196px;
    }
}

.stcard-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .45s cubic-bezier(0.22, 1, 0.36, 1);
}

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

.stcard-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(5, 14, 29, 0.28) 0%,
        rgba(5, 14, 29, 0.0) 40%,
        rgba(5, 14, 29, 0.18) 100%
    );
    pointer-events: none;
}

.stcard-hud {
    position: absolute;
    top: var(--s3);
    left: var(--s3);
    right: var(--s3);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    z-index: 2;
    pointer-events: none;
}

.stcard-hud-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: var(--r-pill);
    background: rgba(6, 20, 39, 0.72);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(186, 230, 253, 0.28);
    font: 600 12px/1.2 var(--f-sans);
    letter-spacing: 0.01em;
    color: #f8fafc;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}

.stcard-hud-pill .icon {
    width: 13.5px;
    height: 13.5px;
    color: #7dd3fc;
    flex-shrink: 0;
}

.stcard-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 22px 24px 20px;
    gap: 12px;
}

@media (max-width: 520px) {
    .stcard-body {
        padding: 18px 18px 16px;
    }
}

.stcard-head {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.stcard-title {
    font: 400 22.5px/1.25 var(--f-serif);
    letter-spacing: -0.012em;
    margin: 0;
}

.stcard-tagline {
    margin: 0;
    font: 600 12.5px/1.38 var(--f-sans);
    letter-spacing: 0.01em;
    color: var(--usp);
}

.stcard-desc {
    margin: 0;
    font-size: 14px;
    line-height: 1.56;
    color: var(--ink-2);
}

.stcard-chips {
    list-style: none;
    margin: 2px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.stcard-chip {
    display: inline-flex;
    align-items: center;
    gap: 5.5px;
    padding: 4px 10px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--ink-2);
}

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

.stcard-chip .num {
    font-variant-numeric: tabular-nums;
}

.stcard-bestfor {
    margin: 2px 0 4px;
    padding-left: 11px;
    border-left: 2.5px solid var(--accent-ring);
    font-size: 13px;
    line-height: 1.48;
    color: var(--muted);
}

.stcard-spec-lbl {
    font-weight: 600;
    color: var(--ink-2);
}

.stcard-foot {
    margin-top: auto;
    padding-top: 15px;
    align-items: center;
}

.stcard-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    color: var(--accent);
    font: 600 13px/1.2 var(--f-sans);
    white-space: nowrap;
    flex-shrink: 0;
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.stcard-cta .icon {
    width: 13.5px;
    height: 13.5px;
    transition: transform .16s ease;
}

.stcard:hover .stcard-cta {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
}

.stcard:hover .stcard-cta .icon {
    transform: translateX(2px);
}

/* Comparison Matrix section below the 2x2 style cards */
.styles-matrix-section {
    margin: var(--s10) 0 var(--s4);
}

.styles-matrix-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px var(--s4);
    margin: 0 0 14px;
}

.styles-matrix-title {
    margin: 0;
    font: 400 24px/1.25 var(--f-serif);
    letter-spacing: -0.012em;
    color: var(--ink);
}

.styles-matrix-head .glance-freshness-note {
    margin: 0;
}

.styles-matrix-head .glance-freshness-note a {
    color: var(--accent);
    text-decoration: none;
}

.styles-matrix-head .glance-freshness-note a:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.styles-matrix-card {
    margin: 0;
    max-width: none;
}

.styles-comparison-table caption {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.styles-comparison-table thead th {
    padding: 12px 18px;
    white-space: nowrap;
    vertical-align: middle;
}

.styles-comparison-table tbody th,
.styles-comparison-table tbody td {
    padding: 15px 18px;
    vertical-align: middle;
    transition: background .14s ease;
}

.styles-comparison-table tbody th {
    width: 24%;
    min-width: 215px;
    max-width: none;
}

.styles-comparison-table tbody tr:hover th,
.styles-comparison-table tbody tr:hover td {
    background: var(--subtle-bg);
}

.styles-comparison-table th.is-num,
.styles-comparison-table td.is-num {
    text-align: right;
    white-space: nowrap;
}

.glance-table a.styles-matrix-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.35;
    color: var(--ink);
    text-decoration: none;
    transition: color .14s ease;
}

.glance-table a.styles-matrix-link:hover,
.styles-comparison-table tbody tr:hover a.styles-matrix-link {
    color: var(--accent);
    text-decoration: none;
}

.styles-matrix-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: var(--r-sm);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    color: var(--accent);
    flex-shrink: 0;
    transition: background .14s ease, border-color .14s ease, color .14s ease;
}

.styles-comparison-table tbody tr:hover .styles-matrix-icon {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
}

.styles-matrix-icon .icon {
    width: 15px;
    height: 15px;
}

.styles-matrix-rule {
    min-width: 240px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink-2);
}

.styles-matrix-dur {
    white-space: nowrap;
    font-weight: 500;
    color: var(--ink);
}

.styles-matrix-fleet {
    white-space: nowrap;
    font-size: 13px;
    color: var(--ink-2);
}

.styles-matrix-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    padding: 3px 9px;
    border-radius: var(--r-pill);
    background: var(--surface);
    border: 1px solid var(--line);
    font-family: var(--f-mono);
    font-size: 12px;
    font-weight: 600;
    color: var(--ink);
}

.styles-matrix-price {
    font-family: var(--f-mono);
    font-size: 14.5px;
    font-weight: 700;
    color: var(--ink);
}

/* 4-Pill Style Switcher Strip on /styles/{slug} */
.style-switcher-pill .icon {
    width: 13.5px;
    height: 13.5px;
    color: var(--accent);
    flex-shrink: 0;
}

.style-switcher-pill.is-current .icon {
    color: currentColor;
}

/* Polar Expedition Style Telemetry Schematic SVG (.style-chart-card / .stchart-*) */
.style-chart-card .rchart-sector-dot {
    background: #38bdf8;
    box-shadow: 0 0 8px rgba(56, 189, 248, 0.85);
}

.style-chart-card .rchart-coords-cross {
    color: #fbbf24;
}

.stchart-mode-tag {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: rgba(56, 189, 248, 0.13);
    border: 1px solid rgba(125, 211, 252, 0.25);
    font: 600 9.5px/1.25 var(--f-mono);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #bae6fd;
    white-space: nowrap;
}

.stchart-svg {
    height: 210px;
}

.stchart-track-bg {
    fill: rgba(12, 31, 56, 0.48);
    stroke: rgba(125, 211, 252, 0.14);
    stroke-width: 1px;
    transition: fill .16s ease, stroke .16s ease;
}

.stchart-track:hover .stchart-track-bg,
.stchart-track:focus-visible .stchart-track-bg {
    fill: rgba(24, 58, 98, 0.72);
    stroke: rgba(56, 189, 248, 0.55);
}

.stchart-track-dot {
    fill: #38bdf8;
    transition: fill .16s ease;
}

.stchart-track:hover .stchart-track-dot,
.stchart-track:focus-visible .stchart-track-dot {
    fill: #fbbf24;
}

.stchart-track-name {
    font: 600 10.5px/1 var(--f-sans);
    fill: rgba(224, 242, 254, 0.94);
    transition: fill .16s ease;
}

.stchart-track:hover .stchart-track-name,
.stchart-track:focus-visible .stchart-track-name {
    fill: #ffffff;
}

.stchart-bar-rail {
    fill: rgba(6, 20, 39, 0.72);
}

.stchart-bar-fill {
    fill: url(#stchart-bar-grad);
}

.stchart-dur-pill {
    fill: rgba(56, 189, 248, 0.12);
    stroke: rgba(125, 211, 252, 0.24);
    stroke-width: 1px;
}

.stchart-dur-text {
    font: 600 9.5px/1 var(--f-mono);
    fill: #bae6fd;
}

.stchart-track-count {
    font: 700 11px/1 var(--f-mono);
    fill: #fde68a;
}

.stchart-lat {
    font: 600 9.5px/1 var(--f-mono);
    fill: rgba(148, 214, 255, 0.62);
}

.stchart-sea-bypass {
    fill: none;
    stroke: rgba(125, 211, 252, 0.36);
    stroke-width: 1.6px;
    stroke-dasharray: 4 4;
    stroke-linecap: round;
}

.stchart-flight-arc {
    fill: none;
    stroke: url(#stchart-arc-stroke);
    stroke-width: 2.6px;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

.stchart-muted-note {
    font: 600 9px/1 var(--f-mono);
    letter-spacing: 0.05em;
    fill: rgba(148, 214, 255, 0.62);
}

.stchart-pill-gold {
    fill: rgba(251, 191, 36, 0.16);
    stroke: rgba(251, 191, 36, 0.55);
    stroke-width: 1px;
}

.stchart-pill-gold-text {
    font: 700 9.5px/1 var(--f-mono);
    letter-spacing: 0.04em;
    fill: #fef3c7;
}

.stchart-node {
    fill: #38bdf8;
    stroke: #061427;
    stroke-width: 1.5px;
}

.stchart-node.is-mid {
    fill: #7dd3fc;
}

.stchart-node-code {
    font: 700 10.5px/1 var(--f-mono);
    fill: #bae6fd;
}

.stchart-node-code.is-active {
    fill: #fde68a;
}

.stchart-node-sub {
    font: 600 9.5px/1 var(--f-mono);
    fill: rgba(186, 230, 253, 0.76);
}

.stchart-node-sub.is-active {
    fill: #fef3c7;
    font-weight: 700;
}

.stchart-row-label {
    font: 600 9.5px/1 var(--f-mono);
    letter-spacing: 0.03em;
    fill: rgba(186, 230, 253, 0.72);
}

.stchart-row-label.is-active {
    font-weight: 700;
    fill: #fef3c7;
}

.stchart-cap-active {
    fill: url(#stchart-bar-grad);
}

.stchart-bar-ink {
    font: 700 9.5px/1 var(--f-mono);
    letter-spacing: 0.02em;
    fill: #04101f;
}

.stchart-cap-split-a {
    fill: rgba(56, 189, 248, 0.22);
    stroke: rgba(125, 211, 252, 0.36);
    stroke-width: 1px;
}

.stchart-cap-split-b {
    fill: rgba(15, 35, 62, 0.65);
    stroke: rgba(148, 163, 184, 0.38);
    stroke-width: 1px;
    stroke-dasharray: 3 3;
}

.stchart-bar-muted {
    font: 600 9.5px/1 var(--f-mono);
    fill: #bae6fd;
}

.stchart-bar-wait {
    font: 600 9px/1 var(--f-mono);
    fill: rgba(186, 230, 253, 0.56);
}

.stchart-ice-band {
    stroke-width: 1px;
}

.stchart-ice-band--1 {
    fill: rgba(14, 42, 74, 0.40);
    stroke: rgba(125, 211, 252, 0.14);
}

.stchart-ice-band--2 {
    fill: rgba(18, 56, 96, 0.46);
    stroke: rgba(125, 211, 252, 0.22);
}

.stchart-ice-band--3 {
    fill: rgba(24, 72, 120, 0.54);
    stroke: rgba(251, 191, 36, 0.34);
}

.stchart-strata-label {
    font: 600 9.5px/1 var(--f-mono);
    letter-spacing: 0.03em;
    fill: rgba(186, 230, 253, 0.76);
}

.stchart-strata-label.is-deep {
    fill: #fef3c7;
}

.stchart-ice-zone {
    fill: rgba(56, 189, 248, 0.08);
}

.stchart-transit-fast {
    fill: rgba(56, 189, 248, 0.24);
    stroke: rgba(125, 211, 252, 0.5);
    stroke-width: 1px;
}

.stchart-transit-lbl {
    font: 700 9px/1 var(--f-mono);
    fill: #e0f2fe;
}

.style-badges-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
}

.style-badge-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink);
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.style-badge-pill .icon {
    width: 14px;
    height: 14px;
    color: var(--accent);
}

.style-badge-pill:hover {
    border-color: var(--accent);
    color: var(--accent);
    text-decoration: none;
}

.hub-faq {
    margin: 36px 0 28px;
}

.hub-faq h2 {
    font: 400 22px/1.3 var(--f-serif);
    margin: 0 0 14px;
    color: var(--ink);
}

.hub-faq-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.hub-faq-item {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 12px 16px;
}

.hub-faq-item summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 14.5px;
    color: var(--ink);
    list-style-position: outside;
}

.hub-faq-item p {
    margin: 10px 0 2px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-2);
}

.about-page .about-eyebrow {
    margin: 8px 0 6px;
    font: var(--t-caps);
    text-transform: uppercase;
    letter-spacing: var(--ls-caps);
    color: var(--accent);
}

.about-page .about-lead {
    font-size: 16.5px;
    line-height: 1.65;
    color: var(--ink-2);
    margin: 0 0 22px;
}

/* ============================================================================
   Polar Operator Dossier (/operators/{slug}): Masthead, Telemetry Card,
   Visual Fleet Showcase, Route Directory, Ship Quick-Filter & Related Grid
   ============================================================================ */
.operator-masthead .masthead-graticule {
    opacity: 0.2;
}

.operator-masthead--no-photo .masthead-graticule {
    opacity: 0.42;
}

.operator-masthead-badges {
    margin-top: 16px;
}

a.operator-masthead-badge {
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

a.operator-masthead-badge:hover {
    background: rgba(18, 48, 84, 0.84);
    border-color: rgba(125, 211, 252, 0.55);
    color: #ffffff;
    text-decoration: none;
    transform: translateY(-1px);
}

/* Right-side Operator Fleet & IAATO Capacity Telemetry Card */
.operator-chart-card .rchart-sector-dot {
    background: #38bdf8;
    box-shadow: 0 0 8px rgba(56, 189, 248, 0.72);
}

.operator-chart-card .rchart-coords-cross {
    color: #fbbf24;
}

.ochart-stage {
    padding: 11px 12px 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ochart-gauge-wrap {
    background: rgba(4, 13, 26, 0.46);
    border: 1px solid rgba(125, 211, 252, 0.14);
    border-radius: 10px;
    padding: 8px 10px 5px;
}

.ochart-gauge-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 3px;
}

.ochart-gauge-title {
    font: 600 9.5px/1.2 var(--f-mono);
    letter-spacing: 0.08em;
    color: rgba(191, 219, 245, 0.78);
    text-transform: uppercase;
}

.ochart-gauge-pill {
    padding: 2px 7px;
    border-radius: 999px;
    background: rgba(251, 191, 36, 0.14);
    border: 1px solid rgba(251, 191, 36, 0.36);
    font: 700 10px/1.2 var(--f-mono);
    letter-spacing: 0.04em;
    color: #fde68a;
    white-space: nowrap;
}

.ochart-gauge-svg {
    display: block;
    width: 100%;
    height: auto;
}

.ochart-rail {
    fill: rgba(148, 197, 242, 0.13);
}

.ochart-rail--cat1 {
    fill: rgba(56, 189, 248, 0.17);
}

.ochart-tick {
    stroke: rgba(148, 214, 255, 0.34);
    stroke-width: 1;
    stroke-dasharray: 2 2;
}

.ochart-node-start {
    fill: #38bdf8;
    stroke: #061427;
    stroke-width: 1.5;
}

.ochart-tick-gold {
    fill: #fcd34d;
    font-weight: 600;
}

.ochart-fleet {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.ochart-vessel {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 8px;
    background: rgba(11, 29, 53, 0.62);
    border: 1px solid rgba(125, 211, 252, 0.14);
    color: #e6f2ff;
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.ochart-vessel:hover,
.ochart-vessel:focus-visible {
    background: rgba(19, 48, 84, 0.84);
    border-color: rgba(56, 189, 248, 0.5);
    color: #ffffff;
    text-decoration: none;
    transform: translateX(2px);
}

.ochart-vessel-dot {
    width: 6.5px;
    height: 6.5px;
    border-radius: 50%;
    background: rgba(148, 184, 218, 0.45);
    flex-shrink: 0;
}

.ochart-vessel-dot.is-active {
    background: #38bdf8;
    box-shadow: 0 0 8px rgba(56, 189, 248, 0.7);
}

.ochart-vessel-name {
    flex: 1;
    min-width: 0;
    font: 600 12.5px/1.25 var(--f-sans);
    color: #f0f7ff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ochart-vessel-ice {
    padding: 2.5px 6px;
    border-radius: 999px;
    background: rgba(56, 189, 248, 0.14);
    border: 1px solid rgba(56, 189, 248, 0.28);
    font: 600 10px/1.1 var(--f-mono);
    color: #7dd3fc;
    flex-shrink: 0;
}

.ochart-vessel-pax {
    font: 500 11px/1.1 var(--f-mono);
    color: rgba(196, 220, 242, 0.82);
    flex-shrink: 0;
}

.ochart-vessel-deps {
    font: 700 11.5px/1.1 var(--f-mono);
    color: #fde68a;
    flex-shrink: 0;
    min-width: 44px;
    text-align: right;
}

.ochart-vessel-deps-lbl {
    font-size: 10px;
    font-weight: 500;
    opacity: 0.78;
}

.ochart-tier-note {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 8px;
    background: rgba(4, 13, 26, 0.36);
    border: 1px dashed rgba(125, 211, 252, 0.2);
    font: 500 10.5px/1.3 var(--f-mono);
    color: rgba(203, 225, 246, 0.86);
}

.ochart-tier-badge {
    color: #7dd3fc;
    font-weight: 600;
}

.ochart-tier-sep {
    opacity: 0.55;
}

/* Unified Operator Section Headers (Fleet, Itineraries, Departures) */
.operator-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin: 0 0 16px;
}

.operator-section-title-group {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.operator-section-title {
    margin: 0;
    font: 400 24px/1.25 var(--f-serif);
    color: var(--ink);
}

.operator-section-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 10px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    color: var(--accent);
    font: 600 12px/1.35 var(--f-mono);
}

.operator-section-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: 600 13.5px/1.3 var(--f-sans);
    color: var(--accent);
    text-decoration: none;
    white-space: nowrap;
}

.operator-section-link:hover {
    text-decoration: underline;
}

.operator-section-link .icon {
    width: 14px;
    height: 14px;
}

/* Single-Vessel Flagship Horizontal Spotlight Card (e.g. Poseidon Sea Spirit) */
@media (min-width: 720px) {
    .operator-fleet-grid--single {
        grid-template-columns: 1fr;
    }

    .operator-fleet-grid--single .operator-vessel-card {
        display: grid;
        grid-template-columns: minmax(280px, 380px) 1fr;
        align-items: stretch;
    }

    .operator-fleet-grid--single .operator-vessel-card .vcard-media {
        height: 100%;
        min-height: 220px;
        aspect-ratio: auto;
        border-radius: calc(var(--r-lg) - 1px) 0 0 calc(var(--r-lg) - 1px);
        border-bottom: 0;
        border-right: 1px solid var(--line);
    }

    .operator-fleet-grid--single .operator-vessel-card .vcard-body {
        justify-content: center;
        padding: 22px 26px;
    }
}

/* Structured Antarctic Itineraries Directory & Progressive Disclosure */
.operator-routes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 14px;
}

.operator-routes-grid--more {
    margin-top: 14px;
}

.operator-route-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 18px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-card);
    color: var(--ink);
    text-decoration: none;
    transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

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

.operator-route-card.is-offseason {
    opacity: 0.76;
}

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

.operator-route-tags {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 8px;
    min-width: 0;
}

.operator-route-days {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: var(--subtle-bg);
    border: 1px solid var(--line);
    font: 600 11.5px/1.3 var(--f-mono);
    color: var(--ink-2);
}

.operator-route-port {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--muted);
}

.operator-route-port .icon {
    width: 12.5px;
    height: 12.5px;
    flex-shrink: 0;
    opacity: 0.78;
}

.operator-route-count {
    padding: 2px 9px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    font: 600 11.5px/1.3 var(--f-mono);
    color: var(--accent);
    white-space: nowrap;
}

.operator-route-card.is-offseason .operator-route-count {
    background: var(--subtle-bg);
    border-color: var(--line);
    color: var(--muted);
}

.operator-route-title {
    margin: 2px 0 0;
    font: 600 16.5px/1.35 var(--f-serif);
    color: var(--ink);
}

.operator-route-regions {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--muted);
}

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

.operator-route-price {
    font-size: 14px;
    color: var(--ink);
}

.operator-route-price.is-muted {
    font-size: 12.5px;
    color: var(--muted);
}

.operator-route-from-lbl {
    font: 600 10.5px/1 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
    margin-right: 4px;
}

.operator-route-price strong {
    font-size: 15.5px;
    font-weight: 700;
    color: var(--ink);
}

.operator-route-card:hover .operator-route-arrow {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-ink);
}

.operator-routes-disclosure {
    margin-top: 14px;
}

.operator-routes-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 16px;
    border-radius: var(--r-pill);
    background: var(--card);
    border: 1px solid var(--line);
    font: 600 13px/1.3 var(--f-sans);
    color: var(--accent);
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.operator-routes-toggle::-webkit-details-marker {
    display: none;
}

.operator-routes-toggle:hover {
    background: var(--accent-soft);
    border-color: var(--accent-ring);
}

.operator-routes-disclosure .when-open {
    display: none;
}

.operator-routes-disclosure[open] .when-closed {
    display: none;
}

.operator-routes-disclosure[open] .when-open {
    display: inline;
}

.operator-routes-disclosure[open] .operator-routes-toggle .icon-chevron {
    transform: rotate(180deg);
}

.operator-routes-toggle .icon-chevron {
    transition: transform 0.18s ease;
}

/* Departures Section & Inline Vessel Quick-Filter Bar */
.operator-departures-section {
    margin-top: 6px;
}

.operator-finder-inline {
    padding: 6px 13px;
    border-radius: var(--r-pill);
    background: var(--accent-soft);
    border: 1px solid var(--accent-ring);
    transition: background 0.15s ease, border-color 0.15s ease;
}

.operator-finder-inline:hover {
    background: var(--accent-soft-hover);
    border-color: var(--accent);
    text-decoration: none;
}

.operator-ship-filterbar {
    justify-content: flex-start;
    gap: 10px 14px;
    margin: 0 0 20px;
}

.operator-ship-filter-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding-left: 4px;
    font: 600 11px/1.2 var(--f-mono);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.operator-ship-filter-label .icon {
    width: 14px;
    height: 14px;
    color: var(--accent);
}

turbo-frame#operator-departures {
    display: block;
}

turbo-frame#operator-departures[busy] .cards {
    opacity: 0.55;
    transition: opacity 0.15s ease;
}

/* Structured Editorial Related Cross-Link Panels */
.hub-related-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin: 38px 0 24px;
}

@media (min-width: 860px) {
    .hub-related-grid--split {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 720px) and (max-width: 979px) {
    .hub-related-grid--triple {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hub-related-grid--triple .hub-related:last-child {
        grid-column: 1 / -1;
    }
}

@media (min-width: 980px) {
    .hub-related-grid--triple {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.hub-related-grid .hub-related {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 18px 20px;
    box-shadow: var(--sh-card);
}

.hub-related-grid .hub-related h2 {
    margin: 0 0 12px;
    font: 400 19px/1.3 var(--f-serif);
    color: var(--ink);
}

.hub-related-grid .hub-links li {
    background: var(--subtle-bg);
    transition: border-color 0.15s ease, background 0.15s ease;
}

.hub-related-grid .hub-links li:hover {
    border-color: var(--accent-ring);
    background: var(--accent-soft);
}

/* Blog (/blog, /blog/{category}, /blog/{category}/{slug}, operator-hub press block) */
.blog-masthead-lede {
    max-width: 60ch;
    margin: var(--s3) 0 0;
    color: rgba(255, 255, 255, .86);
    font: 400 16px/1.55 var(--f-sans);
}

.blog-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 var(--s6);
}

.blog-filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--card);
    color: var(--ink);
    font: 500 13px/1.2 var(--f-sans);
    text-decoration: none;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.blog-filter:hover,
.blog-filter.is-active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
    text-decoration: none;
}

.blog-filter-count {
    color: var(--muted);
    font: 500 11.5px/1 var(--f-mono);
}

.blog-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--s4);
    max-width: 860px;
}

.blog-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 20px 24px;
    box-shadow: var(--sh-card);
}

.blog-card-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 8px;
    color: var(--muted);
    font: 500 12.5px/1.3 var(--f-sans);
}

.blog-card-meta time {
    font-family: var(--f-mono);
}

.blog-card-meta a {
    color: var(--accent);
    text-decoration: none;
}

.blog-card-meta a:hover {
    text-decoration: underline;
}

.blog-card-title {
    margin: 0;
    font: 400 21px/1.3 var(--f-serif);
}

.blog-card-title a {
    color: var(--ink);
    text-decoration: none;
}

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

.blog-card-summary {
    margin: 10px 0 0;
    color: var(--ink);
    font-size: 14.5px;
    line-height: 1.6;
}

.blog-post-body {
    max-width: 72ch;
    font-size: 16.5px;
    line-height: 1.72;
    color: var(--ink);
}

.blog-post-body p {
    margin: 0 0 14px;
}

.blog-post-body p:last-child {
    margin-bottom: 0;
}

.blog-pager {
    margin-top: var(--s6);
}

.blog-empty,
.blog-disclaimer {
    max-width: 72ch;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.55;
}

.blog-disclaimer {
    margin: var(--s8) 0 0;
}

.blog-post-card .blog-disclaimer {
    margin-top: 18px;
}

.operator-blog {
    margin: var(--s8) 0;
}

.operator-blog-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px 16px;
    margin: 0 0 var(--s4);
}

.operator-blog-head h2 {
    margin: 0;
    font: 400 24px/1.25 var(--f-serif);
    color: var(--ink);
}

.operator-blog-head a {
    color: var(--accent);
    font: 600 13px/1.3 var(--f-sans);
    text-decoration: none;
}

.operator-blog-head a:hover {
    text-decoration: underline;
}

.operator-blog .blog-list {
    max-width: none;
}

@media (min-width: 960px) {
    .operator-blog .blog-list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .blog-card {
        padding: 16px 18px;
    }
    .blog-card-title {
        font-size: 19px;
    }
}

/* Long-form article bodies (BlogHtmlSanitizer markup) */
.blog-post-body h2 {
    margin: 28px 0 10px;
    font: 400 24px/1.3 var(--f-serif);
    color: var(--ink);
}

.blog-post-body h3 {
    margin: 22px 0 8px;
    font: 600 17px/1.35 var(--f-sans);
    color: var(--ink);
}

.blog-post-body > :first-child {
    margin-top: 0;
}

.blog-post-body ul,
.blog-post-body ol {
    margin: 0 0 14px;
    padding-left: 1.4em;
}

.blog-post-body li {
    margin: 0 0 6px;
}

.blog-post-body blockquote {
    margin: 18px 0;
    padding: 4px 0 4px 18px;
    border-left: 3px solid var(--accent);
    color: var(--muted);
    font-style: italic;
}

.blog-post-body a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.blog-post-body a:hover {
    color: var(--accent-hover);
}

.blog-card.has-photo {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
}

.blog-card-photo {
    display: block;
    overflow: hidden;
    border-radius: var(--r-md);
    aspect-ratio: 16 / 9;
    background: var(--subtle-bg);
}

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

@media (min-width: 720px) {
    .blog-list > .blog-card.has-photo {
        grid-template-columns: 220px minmax(0, 1fr);
        grid-template-rows: auto auto 1fr;
        column-gap: 20px;
    }
    .blog-list > .blog-card.has-photo .blog-card-photo {
        grid-row: 1 / span 3;
    }
    .operator-blog .blog-list > .blog-card.has-photo {
        grid-template-columns: minmax(0, 1fr);
    }
    .operator-blog .blog-list > .blog-card.has-photo .blog-card-photo {
        grid-row: auto;
    }
}