/* Public editorial navigation and hubs share the existing Rovefold design tokens. */
.rovefold-destinations { position: static; }
/* The panel centres on the header row, not on the Destinations item it hangs from. */
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .navbar > .container { position: relative; }
.rovefold-destinations summary { cursor: pointer; list-style-position: inside; }
.rovefold-megamenu { position: absolute; z-index: 1100; left: 50%; transform: translateX(-50%); width: min(880px, 86vw); padding: 1.5rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1.25rem 1.5rem; align-items: start; border: 1px solid var(--theme-border, #d8dfdb); border-radius: 1rem; background: var(--theme-surface, #fff); box-shadow: 0 12px 30px #18352b20; }
.rovefold-megamenu-all { grid-column: 1/-1; display: inline-flex; align-items: center; gap: .4rem; min-height: 2.5rem; padding-top: .9rem; border-top: 1px solid var(--theme-border, #d8dfdb); font-weight: 650; font-size: .9rem; }
/* Region names run to three words, so the columns keep a readable width and the lists start on one line. */
.rovefold-region-menu__name { display: flex; align-items: flex-end; min-height: 3rem; padding: .3rem .4rem; font-weight: 650; font-size: .82rem; line-height: 1.25; letter-spacing: .03em; text-transform: uppercase; text-wrap: balance; color: var(--theme-primary, #1b5e5a); }
.rovefold-region-menu ul { margin: 0; padding: 0; list-style: none; }
.rovefold-region-menu ul a { display: flex; align-items: center; min-height: 2.25rem; padding: .25rem .4rem; border-radius: .5rem; color: var(--theme-ink, #2c2c2c); font-size: .9rem; }
.rovefold-region-menu ul a:hover { background: color-mix(in srgb, var(--theme-primary, #1b5e5a) 8%, transparent); color: var(--theme-primary, #1b5e5a); }
.rovefold-megamenu a, .rovefold-hub a, .rovefold-breadcrumb a { color: var(--theme-primary, #1b5e5a); text-underline-offset: .2em; }
.rovefold-destinations summary:focus-visible, .rovefold-megamenu a:focus-visible, .rovefold-hub a:focus-visible, .rovefold-breadcrumb a:focus-visible { outline: 3px solid var(--theme-primary, #1b5e5a); outline-offset: 3px; }
.navbar [aria-current="page"] { text-decoration: underline; text-underline-offset: .3em; }
.rovefold-hub { padding-block: 2rem; }
.rovefold-hub section { margin-block: 2rem; }
.rovefold-hub h2 { margin-bottom: 1.2rem; }
/* The hub section pads the top itself; on an article the trail is the first thing under the header. */
.rovefold-breadcrumb-bar { padding-top: 1.25rem; }
/* The section already pads the top, so the trail only needs space below it. */
.rovefold-breadcrumb ol { display: flex; flex-wrap: wrap; gap: .4rem .6rem; list-style: none; padding: 0; margin: 0 0 1rem; font-size: .85rem; }
.rovefold-breadcrumb li { max-width: 100%; overflow-wrap: anywhere; }
.rovefold-breadcrumb li + li::before { content: '/'; padding-right: .6rem; color: var(--theme-muted, #53615a); }
.rovefold-hub-intro { padding: clamp(1.5rem, 4vw, 3rem); background: var(--theme-sand, #eeeae3); border-radius: 1.5rem; margin-bottom: 2rem; }
.rovefold-hub-intro h1 { max-width: 900px; font-size: clamp(2rem, 4vw, 3.25rem); }
.rovefold-hub-intro p { max-width: 760px; margin-bottom: 0; font-size: 1.1rem; }
.rovefold-hub-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.25rem; }
.rovefold-hub-card { display: flex; flex-direction: column; min-width: 0; padding: 1.4rem; background: var(--theme-surface, #fff); border: 1px solid var(--theme-border, #d8dfdb); border-radius: 1.25rem; }
/* Destination cards have no artwork of their own and borrow the newest guide's cover, so both card kinds share one image treatment. */
/* Destinations reuse the guide card; only the meta line differs, so the whole site has one card. */
.rovefold-guide-card__countries { margin: .35rem 0 0; color: var(--theme-muted, #53615a); font-size: .88rem; line-height: 1.5; }

body.theme-profile--brand-adaptive main > .rovefold-hub { padding-block: 2rem; }
body.theme-profile--brand-adaptive .rovefold-hub section { padding-block: 0; }
.rovefold-destinations summary::after { content: '⌄'; display: inline-block; margin-left: .4rem; }
/* Header metrics mirror the Rovefold app header (storefront .site-header: 3rem row, .62rem block padding, 153x36 logo, 2.5rem controls). */
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .navbar { min-height: 0; padding-block: .62rem; }
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .navbar > .container { min-height: 3rem; align-items: center; }
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .navbar-brand { padding-block: .18rem; }
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .navbar-nav .nav-link { padding-block: .44rem; font-size: .875rem; line-height: 1.25rem; }
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .site-primary-action { min-height: 2.5rem; padding-inline: 1rem; border-radius: .95rem; }
/* Divider keeps the primary CTA from merging with the icon cluster next to it. */
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .site-header-actions > .nav-item.d-block + .nav-item { margin-inline-start: .55rem; padding-inline-start: .55rem; border-inline-start: 1px solid var(--theme-border); }
@media(min-width: 576px) { body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .navbar-brand-item { width: auto; height: 2.25rem; max-height: none; } }
@media(min-width: 992px) { body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .nav > .nav-item > .nav-link, body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .navbar-toggler { min-width: 2.5rem; min-height: 2.5rem; } }
body.theme-profile--brand-adaptive[data-theme-header="light-sticky"] .site-header .site-header-actions .nav-link .bi { line-height: 1; }
/* The facts sit on the thumbnail, so the pills carry their own surface to stay readable on any photo. */
.rovefold-guide-facts { position: absolute; z-index: 2; inset: auto auto .6rem .6rem; display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; padding-right: .6rem; }
.rovefold-guide-facts span { padding: .2rem .6rem; border-radius: 999px; background: #fff; color: var(--theme-primary, #1b5e5a); font-size: .74rem; font-weight: 650; box-shadow: 0 .15rem .5rem rgba(15, 33, 30, .22); }
/* Region map below the region cards, on the hero's sand panel: covered regions are links, land is white so they stand out. Phones get the cards only. */
.rovefold-guide-map { --map-bg: var(--theme-sand, #eeeae3); margin: 2.5rem 0 0; padding: clamp(1rem, 3vw, 2rem); background: var(--map-bg); border-radius: 1.5rem; }
.rovefold-guide-map svg { display: block; width: 100%; height: auto; overflow: hidden; }
.rovefold-guide-map__land { fill: var(--theme-surface, #fff); stroke: var(--map-bg); stroke-width: .5; }
.rovefold-guide-map__shape { fill: color-mix(in srgb, var(--theme-primary, #1b5e5a) 75%, var(--theme-surface, #fff)); stroke: var(--map-bg); stroke-width: .4; transition: fill .15s; }
.rovefold-guide-map__hit { fill: transparent; }
.rovefold-guide-map__pin { fill: var(--theme-surface, #fff); stroke: var(--theme-primary, #1b5e5a); stroke-width: 2; }
.rovefold-guide-map__label { fill: var(--theme-ink, #191a1f); font-size: 13px; font-weight: 650; paint-order: stroke; stroke: var(--map-bg); stroke-width: 4px; stroke-linejoin: round; }
.rovefold-guide-map__region:hover .rovefold-guide-map__shape, .rovefold-guide-map__region:focus-visible .rovefold-guide-map__shape { fill: var(--theme-primary, #1b5e5a); }
.rovefold-guide-map__region:hover .rovefold-guide-map__pin, .rovefold-guide-map__region:focus-visible .rovefold-guide-map__pin { fill: var(--theme-primary, #1b5e5a); }
.rovefold-guide-map__region:hover .rovefold-guide-map__label, .rovefold-guide-map__region:focus-visible .rovefold-guide-map__label { fill: var(--theme-primary, #1b5e5a); text-decoration: underline; }
.rovefold-guide-map__region:focus-visible { outline: none; }
@media (max-width: 767.98px) { .rovefold-guide-map { display: none; } }
