:root {
  --ink: #18392f;
  --ink-soft: #3e6253;
  --green: #285e47;
  --leaf: #7ebc67;
  --lime: #d8ee82;
  --mint: #cfe9ce;
  --coral: #f27c58;
  --yellow: #f4c85f;
  --blue: #63c7c3;
  --cream: #f6f5eb;
  --white: #fffdf7;
  --line: rgba(24, 57, 47, .14);
  --display: "Space Grotesk", "Avenir Next", sans-serif;
  --body: "DM Sans", "Avenir Next", sans-serif;
  color: var(--ink);
  font-family: var(--body);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  scroll-behavior: auto;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--cream); color: var(--ink); }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid #183c30; outline-offset: 3px; box-shadow: 0 0 0 2px #f6f5eb; }
::selection { background: var(--lime); color: var(--ink); }
.skip-link { position: absolute; left: 1rem; top: -4rem; z-index: 100; padding: .75rem 1rem; background: var(--ink); color: white; border-radius: 8px; }
.skip-link:focus { top: 1rem; }

.announcement { display: flex; align-items: center; justify-content: center; gap: .55rem; min-height: 32px; padding: .35rem 1rem; background: var(--ink); color: #ecf2d0; font-size: .65rem; letter-spacing: .12em; font-weight: 700; text-align: center; }
.announcement-dot { width: 6px; height: 6px; border-radius: 99px; background: var(--lime); }
.announcement-spark { color: var(--yellow); margin-left: .3rem; }
.site-header { height: 82px; max-width: 1320px; padding: 0 32px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 6px; color: var(--ink); text-decoration: none; flex: 0 0 auto; }
.brand img { display: block; object-fit: contain; }
.brand img { width: 58px; height: 58px; }
.footer-brand img { width: 47px; height: 47px; }
.brand-wordmark { display: grid; gap: 3px; color: var(--ink); font: 700 1.46rem/.92 "Space Grotesk", "Avenir Next", sans-serif; letter-spacing: -.07em; }
.brand-wordmark span { color: #a8664e; font: 700 .48rem/1 var(--body); letter-spacing: .27em; }
.main-nav { display: flex; align-items: center; gap: 36px; margin-left: auto; margin-right: 24px; }
.main-nav a, .header-cta { text-decoration: none; font-size: .8rem; font-weight: 700; }
.main-nav a { color: #4f665b; transition: color .2s ease; }
.main-nav a:hover { color: var(--coral); }
.header-cta { color: var(--white); background: var(--green); padding: 13px 18px; border-radius: 999px; transition: transform .2s ease, background .2s ease; }
.header-cta:hover { transform: translateY(-2px); background: var(--ink); }
.header-cta span { margin-left: 8px; color: var(--lime); }
.menu-toggle { display: none; border: 0; padding: 10px; background: transparent; cursor: pointer; }
.menu-toggle span { width: 23px; height: 2px; display: block; margin: 5px; background: var(--ink); }

.hero { max-width: 1320px; min-height: 610px; margin: auto; padding: 54px 32px 80px; display: grid; grid-template-columns: minmax(390px, .92fr) minmax(490px, 1.08fr); align-items: center; gap: clamp(38px, 7vw, 105px); }
.hero-copy { padding: 7px 0 14px 3.7%; position: relative; z-index: 1; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin-bottom: 20px; color: #648273; font-size: .66rem; font-weight: 700; letter-spacing: .15em; }
.eyebrow-mark { color: var(--coral); font-size: .85rem; letter-spacing: .08em; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--display); letter-spacing: -.065em; }
h1 { max-width: 610px; margin-bottom: 21px; font-size: clamp(3.45rem, 6.5vw, 5.75rem); line-height: .98; }
h1 span { color: var(--green); position: relative; white-space: nowrap; }
h1 span::after { content: ""; position: absolute; z-index: -1; left: 1%; right: -3%; bottom: 5px; height: 13px; background: var(--lime); border-radius: 100% 30% 70% 45%; transform: rotate(-1.4deg); }
.hero-description { max-width: 425px; margin-bottom: 28px; color: #60756b; font-size: 1.03rem; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 51px; border-radius: 999px; padding: 0 22px; text-decoration: none; font-size: .82rem; font-weight: 700; transition: transform .2s ease, box-shadow .2s ease; }
.button:hover { transform: translateY(-3px); box-shadow: 0 9px 20px rgba(24, 57, 47, .14); }
.button-primary { background: var(--coral); color: #fff; }
.button-primary span { font-size: 1rem; }
.text-link { text-decoration: none; font-weight: 700; font-size: .78rem; border-bottom: 1px solid rgba(24, 57, 47, .28); padding: 0 0 4px; }
.text-link span { margin-left: 5px; color: var(--coral); }
.hero-footnote { margin-top: 42px; display: flex; align-items: center; gap: 12px; color: #75847a; font-size: .72rem; }
.hero-footnote strong { color: var(--ink); }
.avatar-stack { display: flex; padding-left: 4px; }
.avatar { width: 27px; height: 27px; margin-left: -4px; display: grid; place-items: center; border: 2px solid var(--cream); border-radius: 50%; font-size: .8rem; color: var(--ink); }
.avatar-leaf { background: var(--lime); }.avatar-sun { background: var(--yellow); }.avatar-wave { background: #a1d8d5; }

.hero-art-wrap { position: relative; min-width: 0; padding: 9px 8px; }
.hero-art { position: relative; height: 428px; overflow: hidden; isolation: isolate; border: 1px solid rgba(24,57,47,.07); border-radius: 48% 47% 37px 37px; background: #4a4d44; box-shadow: 13px 15px 0 #dce9c5; }
.hero-world-mount { position: absolute; z-index: 0; inset: 0; }
.hero-world-mount .shader-frame { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-scene-shade { position: absolute; z-index: 1; inset: 48% 0 0; pointer-events: none; background: linear-gradient(180deg, rgba(12,20,15,0) 0%, rgba(12,20,15,.42) 100%); }
.art-coordinate { position: absolute; z-index: 2; top: 54px; right: 28px; color: #e1edcb; font: 700 .58rem/1.4 var(--body); letter-spacing: .08em; text-align: right; text-shadow: 0 1px 8px rgba(10,20,14,.45); pointer-events: none; }
.hero-art-caption { position: absolute; z-index: 2; left: 26px; bottom: 20px; display: grid; gap: 3px; color: #e1f0c9; font-size: .52rem; letter-spacing: .16em; text-shadow: 0 1px 8px rgba(10,20,14,.45); pointer-events: none; }
.hero-art-caption strong { color: white; font-size: .65rem; letter-spacing: .12em; }
.hero-sticker { position: absolute; z-index: 5; display: flex; align-items: center; justify-content: center; gap: 4px; width: 93px; height: 93px; border-radius: 50%; font-size: .6rem; line-height: 1.2; font-weight: 700; letter-spacing: .08em; text-align: center; box-shadow: 0 7px 0 rgba(24,57,47,.1); }
.sticker-top { top: 8px; right: -10px; background: var(--coral); color: white; transform: rotate(10deg); }
.sticker-arrow { font-size: 1rem; }
.sticker-bottom { left: -34px; bottom: -19px; flex-direction: column; background: var(--blue); color: var(--ink); transform: rotate(-9deg); }
.sticker-bottom span:last-child { font-size: 1rem; }

.section-pad { padding: 96px max(32px, calc((100vw - 1256px) / 2)); }
.map-section { position: relative; overflow: hidden; background: #e6f0dd; }
.map-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .24; background-image: radial-gradient(#749971 1px, transparent 1px); background-size: 21px 21px; mask-image: linear-gradient(90deg, transparent 2%, black 50%, transparent 100%); }
.section-heading { position: relative; z-index: 1; display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-bottom: 35px; }
.section-heading h2 { margin: 0; color: var(--ink); font-size: clamp(2.55rem, 4.8vw, 4.2rem); line-height: .98; }
.section-heading h2 span { color: var(--green); }
.section-heading > p { max-width: 330px; margin: 0 2% 6px 0; color: #63796c; font-size: .88rem; line-height: 1.7; }
.map-heading > p { padding: 14px 16px; border: 1px solid rgba(24,57,47,.1); border-radius: 16px; background: rgba(248,249,239,.9); box-shadow: 0 10px 28px rgba(28,64,45,.05); color: #405e4d; backdrop-filter: blur(12px); }
.map-heading .eyebrow { margin-bottom: 17px; }
.map-experience { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) 282px; gap: 18px; align-items: start; }
.map-stage { position: relative; min-height: 550px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 28px; background: radial-gradient(ellipse at 50% 49%, #246c66 0, #145650 50%, #0c403f 100%); box-shadow: 0 18px 44px rgba(20,68,57,.14); isolation: isolate; }
.map-stage::before, .map-stage::after { content: ""; position: absolute; pointer-events: none; z-index: 0; border: 1px solid rgba(161,222,189,.13); border-radius: 50%; }
.map-stage::before { width: 71%; height: 69%; top: 17%; left: 15%; transform: rotate(-13deg); }
.map-stage::after { width: 87%; height: 83%; top: 8%; left: 6%; transform: rotate(-13deg); }
.map-topbar { position: absolute; z-index: 7; top: 19px; left: 22px; right: 22px; display: flex; align-items: center; justify-content: space-between; color: #d6eec1; font-size: .62rem; letter-spacing: .14em; font-weight: 700; }
.map-live { display: flex; align-items: center; gap: 9px; }
.map-live > span { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 12px var(--lime); }
.map-live b { color: var(--coral); }
.map-top-right { display: flex; align-items: center; gap: 11px; }
.country-count { color: rgba(223,245,216,.69); }
.map-icon-button { width: 44px; height: 44px; border: 1px solid rgba(226,245,225,.25); border-radius: 50%; background: rgba(9,47,45,.35); color: white; font-size: 1.2rem; cursor: pointer; transition: transform .2s ease, background .2s ease; }
.map-icon-button:hover { transform: rotate(-35deg); background: var(--coral); }
.map-control-stack { position: absolute; z-index: 6; top: 69px; right: 20px; display: flex; flex-direction: column; gap: 7px; }
.map-control-stack button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid rgba(226,245,225,.3); border-radius: 50%; background: rgba(8,45,42,.78); color: #f3f7df; font: 600 1.28rem/1 var(--display); cursor: pointer; box-shadow: 0 4px 12px rgba(3,31,30,.2); transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.map-control-stack button:hover { transform: scale(1.06); border-color: var(--lime); background: #0e5149; }
.map-control-stack button:active { transform: scale(.96); }
#mapCanvas { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; display: none; touch-action: none; cursor: grab; }
#mapCanvas:active { cursor: grabbing; }
.map-stage.webgl-ready #mapCanvas { display: block; }
.map-fallback { position: absolute; z-index: 2; inset: 0; display: block; }
.map-stage.webgl-ready .map-fallback { display: none; }
.map-visual { position: absolute; top: 2%; left: 50%; z-index: 2; height: 86%; aspect-ratio: 640 / 690; transform: translateX(-50%) rotate(var(--field-map-rotation, 0deg)) scale(var(--field-map-zoom, 1)); transform-origin: center; transition: transform .28s ease; }
.borneo-outline { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; filter: drop-shadow(8px 13px 8px rgba(2,32,33,.32)); }
.island-land { fill: url(#landFill); stroke: #e1e7ad; stroke-width: 2.1; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.admin-borders { fill: none; stroke: rgba(30,76,57,.56); stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.island-rivers path { fill: none; stroke: #4ca7a0; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: .78; vector-effect: non-scaling-stroke; }
.fallback-pins { position: absolute; inset: 0; z-index: 3; }
.map-region-label { position: absolute; z-index: 1; padding: 3px 6px; border: 1px solid rgba(238,244,211,.35); border-radius: 999px; background: rgba(236,241,203,.62); color: rgba(25,62,46,.8); font-size: .45rem; font-weight: 800; letter-spacing: .1em; line-height: 1; pointer-events: none; transform: translate(-50%, -50%); white-space: nowrap; }
.map-pin { position: absolute; width: 24px; height: 24px; border: 3px solid rgba(255,255,255,.92); border-radius: 50%; background: var(--coral); color: white; box-shadow: 0 0 0 5px rgba(242,124,88,.23), 0 5px 12px rgba(14,54,46,.35); cursor: pointer; transform: translate(-50%, -50%); transition: transform .2s ease, opacity .2s ease, box-shadow .2s ease; }
.map-pin::before { content: ""; position: absolute; inset: -9px; border: 1px solid rgba(255,255,255,.48); border-radius: 50%; animation: pin-wave 2.2s ease-out infinite; }
.map-pin:hover, .map-pin.is-selected { z-index: 2; transform: translate(-50%, -50%) scale(1.24); background: var(--yellow); box-shadow: 0 0 0 7px rgba(244,200,95,.25), 0 5px 12px rgba(14,54,46,.35); }
.map-pin.is-muted { opacity: .15; pointer-events: none; }
.map-pin-label { position: absolute; top: 26px; left: 50%; width: max-content; padding: 4px 7px; border-radius: 4px; background: #133c36; color: #f2f1df; font-size: .53rem; font-weight: 700; letter-spacing: .03em; transform: translateX(-50%); box-shadow: 0 2px 8px rgba(0,0,0,.15); }
@keyframes pin-wave { 0% { transform: scale(.55); opacity: .72; } 100% { transform: scale(1.8); opacity: 0; } }
.map-orbit { position: absolute; z-index: 1; border: 1px dashed rgba(197,236,190,.18); border-radius: 50%; pointer-events: none; }
.orbit-a { width: 75px; height: 75px; top: 19%; right: 19%; }.orbit-b { width: 44px; height: 44px; bottom: 27%; left: 13%; }
.map-instruction { position: absolute; z-index: 6; left: 50%; bottom: 25px; display: flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid rgba(228,244,218,.2); border-radius: 999px; background: rgba(6,40,39,.55); color: #d6ecce; font-size: .54rem; font-weight: 700; letter-spacing: .11em; white-space: nowrap; transform: translateX(-50%); backdrop-filter: blur(10px); }
.drag-icon { font-size: .85rem; }.instruction-dot { color: var(--coral); }
.map-compass { position: absolute; z-index: 5; top: 25%; right: 6%; display: grid; justify-items: center; gap: 2px; color: rgba(220,241,216,.64); font-size: .5rem; font-weight: 700; }
.map-compass b { display: block; color: var(--yellow); font-size: 1.1rem; line-height: 1; transform-origin: 50% 50%; transition: transform .1s linear; }
.map-corner-note { position: absolute; z-index: 5; right: 17px; bottom: 23px; color: rgba(220,241,216,.43); font: 600 .48rem/1.45 var(--body); letter-spacing: .1em; text-align: right; }
.map-detail { position: absolute; z-index: 8; left: 18px; bottom: 18px; display: flex; align-items: center; gap: 12px; width: min(330px, calc(100% - 190px)); min-height: 74px; padding: 11px 12px; border: 1px solid rgba(236,246,214,.22); border-radius: 17px; background: rgba(14,58,52,.87); color: white; box-shadow: 0 10px 25px rgba(4,32,30,.22); backdrop-filter: blur(12px); }
.detail-icon { flex: 0 0 45px; width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; background: var(--lime); font-size: 1.5rem; }
.detail-copy { min-width: 0; display: grid; gap: 3px; }
.detail-overline { color: #bcd9aa; font-size: .52rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.detail-copy strong { overflow: hidden; font: 600 .91rem/1.2 var(--display); text-overflow: ellipsis; white-space: nowrap; }
.detail-copy > span:last-child { overflow: hidden; color: rgba(255,255,255,.7); font-size: .64rem; text-overflow: ellipsis; white-space: nowrap; }
.detail-open { margin-left: auto; flex: 0 0 35px; width: 35px; height: 35px; border: 0; border-radius: 50%; background: var(--coral); color: white; font-size: 1rem; cursor: pointer; transition: transform .2s ease; }
.detail-open:hover { transform: rotate(45deg); }
.map-source { color: #718378; font-size: .6rem; }
.map-source a { color: var(--green); font-weight: 700; text-decoration-color: rgba(30,76,57,.35); text-underline-offset: 3px; }
.map-source a:hover { color: #a45a42; }
.map-aside { display: grid; grid-template-rows: auto 1fr; gap: 16px; }
.stamp-card, .map-picks-card { border-radius: 24px; padding: 23px; }
.stamp-card { background: var(--yellow); }
.stamp-top { display: flex; align-items: center; gap: 9px; }
.stamp-icon { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; background: #e9ae42; color: #fff7d4; font-size: 1.05rem; }
.stamp-label, .aside-eyebrow { font-size: .6rem; font-weight: 700; letter-spacing: .14em; }
.stamp-count { display: flex; align-items: center; gap: 10px; margin: 16px 0 11px; }
.stamp-count strong { font: 700 3.5rem/.85 var(--display); letter-spacing: -.08em; }
.stamp-count span { color: #6b613e; font-size: .67rem; line-height: 1.25; }
.stamp-progress { height: 6px; overflow: hidden; border-radius: 99px; background: rgba(97,80,36,.2); }
.stamp-progress span { display: block; width: 0; height: 100%; border-radius: 99px; background: var(--ink); transition: width .3s ease; }
.stamp-card p { max-width: 225px; margin: 13px 0 12px; color: #645b3e; font-size: .7rem; line-height: 1.55; }
.stamp-row { display: flex; gap: 7px; }
.stamp-row span { width: 27px; height: 27px; display: grid; place-items: center; border: 1px dashed rgba(73,66,41,.4); border-radius: 50%; color: rgba(73,66,41,.62); font-size: .8rem; }
.stamp-row span.is-collected { border-style: solid; border-color: var(--ink); background: var(--ink); color: var(--lime); }
.map-picks-card { background: var(--white); box-shadow: 0 12px 28px rgba(45,78,57,.07); }
.aside-eyebrow { margin-bottom: 14px; color: #789081; }
.quick-picks { display: grid; gap: 3px; }
.quick-pick { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 56px; padding: 8px 2px; border: 0; border-bottom: 1px solid #edf0e6; background: none; text-align: left; cursor: pointer; }
.quick-pick:last-child { border-bottom: 0; }
.quick-pick-icon { width: 27px; height: 27px; display: grid; place-items: center; flex: 0 0 27px; border-radius: 9px; background: #edf4d9; font-size: .93rem; }
.quick-pick span:nth-child(2) { flex: 1; font-size: .72rem; font-weight: 700; }
.quick-pick small { display: block; margin-top: 2px; color: #52685b; font-size: .6rem; line-height: 1.35; font-weight: 500; }
.quick-pick .quick-pick-credit { color: #52685b; }
.quick-pick > b { color: #8da194; font-size: .8rem; transition: transform .2s ease; }
.quick-pick:hover > b { transform: translate(2px,-2px); color: var(--coral); }
.aside-link { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); color: var(--green); text-decoration: none; font-size: .66rem; font-weight: 700; }
.aside-link span { color: var(--coral); }
.map-bottomline { position: relative; z-index: 1; display: flex; align-items: center; gap: 25px; margin-top: 18px; color: #61776b; font-size: .67rem; }
.map-bottomline > span { display: inline-flex; align-items: center; gap: 7px; }
.legend-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 3px rgba(242,124,88,.22); }
.legend-leaf { color: #669b5b; font-style: normal; }
.share-link { margin-left: auto; padding: 6px 0; border: 0; background: none; color: var(--green); font-size: .69rem; font-weight: 700; cursor: pointer; }
.share-link span { color: var(--coral); }

.regions-section { padding-top: 105px; padding-bottom: 110px; }
.compact-heading { margin-bottom: 31px; }
.compact-heading .eyebrow { margin-bottom: 16px; }
.region-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.region-card { position: relative; min-height: 196px; overflow: hidden; padding: 20px 20px 21px; border: 1px solid transparent; border-radius: 20px; text-align: left; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.region-card:hover, .region-card.is-selected { transform: translateY(-5px); box-shadow: 0 12px 22px rgba(24,57,47,.12); }
.region-card.is-selected { border-color: var(--ink); }
.region-number { display: block; color: rgba(24,57,47,.62); font-size: .54rem; font-weight: 700; letter-spacing: .13em; }
.region-emoji { position: absolute; top: 23px; right: 18px; font-size: 2.2rem; filter: drop-shadow(0 5px 4px rgba(24,57,47,.1)); transition: transform .25s ease; }
.region-card:hover .region-emoji { transform: rotate(-10deg) scale(1.1); }
.region-card strong { display: block; margin-top: 37px; font: 700 1.63rem/1 var(--display); letter-spacing: -.06em; }
.region-line { display: block; margin-top: 8px; color: rgba(24,57,47,.75); font-size: .7rem; }
.region-arrow { position: absolute; right: 19px; bottom: 20px; font-size: 1.15rem; }
.region-sabah { background: #cce6a9; }.region-sarawak { background: #f3c6a6; }.region-brunei { background: #bce3df; }.region-kalimantan { background: #e9dd8c; }
.region-selected-note { min-height: 36px; display: flex; align-items: center; gap: 8px; margin-top: 17px; color: #708175; font-size: .69rem; }
.region-selected-note .note-icon { color: var(--coral); }
.region-note-text { color: #708175; }
.region-selected-note button { display: none; margin-left: 4px; padding: 0 0 2px; border: 0; border-bottom: 1px solid #9eac9f; background: none; color: var(--green); font-size: .67rem; font-weight: 700; cursor: pointer; }
.region-selected-note.has-filter button { display: inline-block; }

.places-section { position: relative; background: #fffdf7; }
.places-section::before { content: ""; position: absolute; top: 10%; right: -100px; width: 260px; height: 260px; border: 1px solid rgba(94,148,95,.14); border-radius: 50%; box-shadow: 0 0 0 28px rgba(94,148,95,.04), 0 0 0 56px rgba(94,148,95,.035); }
.places-heading { margin-bottom: 33px; }
.places-heading .eyebrow { margin-bottom: 16px; }
.filter-bar { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin-bottom: 25px; }
.filter-label { margin-right: 7px; color: #809085; font-size: .59rem; font-weight: 700; letter-spacing: .13em; }
.filter-chip { padding: 10px 13px; border: 1px solid #e1e7da; border-radius: 999px; background: transparent; color: #61776b; font-size: .69rem; font-weight: 700; cursor: pointer; transition: color .2s ease, background .2s ease, border .2s ease, transform .2s ease; }
.filter-chip:hover { transform: translateY(-2px); }
.filter-chip.is-active { border-color: var(--ink); background: var(--ink); color: white; }
.result-count { margin-left: auto; color: #8b978e; font-size: .65rem; }
.place-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.place-card { overflow: hidden; min-width: 0; border: 1px solid #e8ebdf; border-radius: 20px; background: #fff; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.place-card:hover { transform: translateY(-5px); border-color: rgba(40,94,71,.24); box-shadow: 0 15px 30px rgba(39,72,54,.09); }
.place-art { position: relative; display: grid; place-items: center; min-height: 154px; overflow: hidden; }
.place-art::before, .place-art::after { content: ""; position: absolute; border-radius: 50%; }
.place-art::before { width: 142px; height: 142px; right: -26px; top: -56px; border: 1px solid rgba(24,57,47,.12); box-shadow: 0 0 0 19px rgba(255,255,255,.1), 0 0 0 38px rgba(255,255,255,.07); }
.place-art::after { width: 55px; height: 55px; left: 19px; bottom: -34px; background: rgba(255,255,255,.3); }
.place-art-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 91px; height: 91px; border: 1px solid rgba(24,57,47,.1); border-radius: 34px 48px 36px 50px; background: rgba(255,255,255,.58); font-size: 3.2rem; transform: rotate(-5deg); transition: transform .25s ease; }
.place-card:hover .place-art-icon { transform: rotate(5deg) scale(1.07); }
.place-art-mark { position: absolute; left: 17px; top: 15px; color: rgba(24,57,47,.68); font-size: .57rem; font-weight: 700; letter-spacing: .13em; }
.place-region-pill { position: absolute; right: 14px; bottom: 13px; padding: 6px 9px; border: 1px solid rgba(24,57,47,.12); border-radius: 99px; background: rgba(255,253,247,.72); color: #455f50; font-size: .55rem; font-weight: 700; backdrop-filter: blur(8px); }
.place-art.fern { background: #cbe2ae; }.place-art.reef { background: #b7e2df; }.place-art.sunset { background: #f1c5a1; }.place-art.river { background: #d7e4ab; }.place-art.cave { background: #c7cde1; }.place-art.city { background: #f2d681; }.place-art.forest { background: #a8cfaa; }.place-art.mountain { background: #c5dbe3; }.place-art.boat { background: #eed3a9; }.place-art.coast { background: #c3ddd2; }
.place-card-body { padding: 17px 18px 16px; }
.place-kicker { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #829087; font-size: .54rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.place-kicker span:last-child { color: var(--coral); }
.place-title-button { display: block; width: 100%; min-height: 44px; margin: 8px 0 7px; padding: 0; border: 0; background: none; text-align: left; font: 700 1.21rem/1.15 var(--display); letter-spacing: -.04em; cursor: pointer; }
.place-title-button:hover { color: var(--green); }
.place-desc { min-height: 52px; margin: 0 0 14px; color: #6f7f73; font-size: .69rem; line-height: 1.55; }
.place-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 11px; border-top: 1px solid #edf0e8; }
.place-tour { display: inline-flex; align-items: center; min-height: 44px; color: var(--green); text-decoration: none; font-size: .67rem; font-weight: 700; }
.place-tour span { margin-left: 4px; color: var(--coral); }
.place-save { display: inline-flex; align-items: center; min-height: 44px; gap: 5px; padding: 5px 7px; border: 0; background: none; color: #52685b; font-size: .62rem; font-weight: 700; cursor: pointer; }
.place-save:hover, .place-save.is-saved { color: #418052; }
.place-save.is-saved span { color: #418052; }
.empty-state { position: relative; z-index: 1; min-height: 230px; display: grid; align-content: center; justify-items: center; gap: 12px; color: #79887c; }
.empty-state[hidden] { display: none; }
.empty-state > span { font-size: 2.5rem; }.empty-state strong { color: var(--ink); font-family: var(--display); font-size: 1.1rem; }
.empty-state button { border: 0; border-bottom: 1px solid #9eac9f; background: none; color: var(--green); font-size: .74rem; font-weight: 700; cursor: pointer; }
.places-footnote { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: 9px; max-width: 690px; margin-top: 24px; color: #7a897d; font-size: .68rem; line-height: 1.55; }
.places-footnote span { color: #78a160; }
.affiliate-disclosure { position: relative; z-index: 1; margin: 10px 0 0; color: #7a897d; font-size: .65rem; line-height: 1.5; }
.affiliate-disclosure[hidden] { display: none; }

.quiz-section { padding-top: 75px; padding-bottom: 95px; background: #fffdf7; }
.quiz-card { position: relative; display: grid; grid-template-columns: minmax(230px, .9fr) 1.25fr; gap: 28px; min-height: 300px; overflow: hidden; padding: 43px 46px; border-radius: 29px; background: var(--green); color: white; }
.quiz-copy { position: relative; z-index: 1; }
.eyebrow-light { color: #bdd9b2; }
.eyebrow-light .eyebrow-mark { color: var(--yellow); }
.quiz-card h2 { margin: 0 0 12px; font-size: clamp(2.55rem, 4.2vw, 3.8rem); line-height: .96; }
.quiz-card h2 span { color: var(--lime); }
.quiz-copy p { max-width: 250px; margin: 0; color: #d1e1d1; font-size: .78rem; line-height: 1.6; }
.quiz-choices { position: relative; z-index: 2; align-self: center; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.quiz-choices button { min-height: 89px; display: grid; grid-template-columns: 37px 1fr; grid-template-rows: auto auto; align-content: center; align-items: center; column-gap: 10px; padding: 13px 15px; border: 1px solid rgba(228,244,218,.28); border-radius: 15px; background: rgba(231,244,215,.09); color: white; text-align: left; cursor: pointer; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.quiz-choices button:hover, .quiz-choices button.is-selected { transform: translateY(-3px); border-color: var(--lime); background: rgba(216,238,130,.2); }
.quiz-choices button > span { grid-row: span 2; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: #d8ee82; font-size: 1.2rem; }
.quiz-choices strong { font: 600 .75rem/1.2 var(--display); }.quiz-choices small { margin-top: 4px; color: #c5ddc8; font-size: .59rem; }
.quiz-decoration { position: absolute; color: rgba(216,238,130,.2); pointer-events: none; }
.quiz-sun { top: -43px; right: 20%; font-size: 8rem; }.quiz-leaf { bottom: -67px; left: 43%; font-size: 11rem; transform: rotate(-28deg); }
.quiz-emblem { position: absolute; z-index: 1; right: -28px; bottom: -38px; width: 148px; height: 148px; padding: 10px; border-radius: 50%; background: #d8ee82; }
.quiz-emblem img { width: 100%; height: 100%; }
.quiz-result { position: relative; z-index: 3; grid-column: 1 / -1; padding: 15px 18px; border-radius: 15px; background: #f1f6d7; color: var(--ink); font-size: .74rem; line-height: 1.6; }
.quiz-result[hidden] { display: none; }
.quiz-result strong { font-family: var(--display); font-size: .9rem; }
.quiz-result button { margin-left: 8px; padding: 0; border: 0; border-bottom: 1px solid #799678; background: none; color: var(--green); font-size: .68rem; font-weight: 700; cursor: pointer; }

.last-call { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 35px; min-height: 330px; padding-top: 76px; padding-bottom: 76px; }
.last-call h2 { margin: 0 0 12px; font-size: clamp(3rem, 5.5vw, 5rem); line-height: .9; }
.last-call p { margin: 0; color: #697d71; font-size: .83rem; }
.last-call .eyebrow { margin-bottom: 14px; }
.button-dark { background: var(--ink); color: white; white-space: nowrap; }.button-dark span { color: var(--lime); }
.last-call-sticker { width: 105px; height: 105px; flex: 0 0 105px; display: grid; place-items: center; margin-right: 2%; border-radius: 50%; background: var(--coral); color: white; font: 700 .85rem/1.15 var(--display); text-align: center; transform: rotate(10deg); }
.site-footer { min-height: 148px; display: flex; align-items: center; gap: 28px; padding: 28px max(32px, calc((100vw - 1256px) / 2)); background: #e7ecdf; }
.footer-brand { gap: 3px; }.footer-brand img { width: 40px; height: 40px; }
.site-footer > p { margin: 0; color: #456252; font-size: .72rem; line-height: 1.65; }
.site-footer > p span { color: #788a7e; }
.footer-right { display: flex; align-items: center; gap: 25px; margin-left: auto; color: #819087; font-size: .55rem; font-weight: 700; letter-spacing: .1em; }
.footer-right a { color: var(--green); text-decoration: none; }
.footer-trust-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 15px; }
.footer-trust-links a { color: #456252; font-size: .62rem; font-weight: 700; text-decoration-color: rgba(69,98,82,.35); text-underline-offset: 3px; }
.footer-trust-links a:hover { color: #ba6249; }
.booking-disclosure { flex-basis: 100%; color: #66786d; font-size: .64rem; line-height: 1.5; }
.toast { position: fixed; z-index: 50; left: 50%; bottom: 22px; max-width: calc(100vw - 32px); padding: 12px 18px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: var(--ink); color: white; font-size: .73rem; font-weight: 600; box-shadow: 0 9px 32px rgba(10,37,29,.24); opacity: 0; pointer-events: none; transform: translate(-50%, 16px); transition: opacity .22s ease, transform .22s ease; }
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.manual-share-panel { position: fixed; z-index: 80; right: 20px; bottom: 20px; display: grid; grid-template-columns: minmax(0,1fr); gap: 16px; width: min(490px, calc(100vw - 32px)); padding: 20px; border: 1px solid rgba(24,57,47,.13); border-radius: 20px; background: var(--white); box-shadow: 0 18px 54px rgba(10,37,29,.22); }
.manual-share-panel[hidden] { display: none; }
.manual-share-copy { min-width: 0; }
.manual-share-kicker { margin: 0 0 7px; color: #a8664e; font-size: .56rem; font-weight: 800; letter-spacing: .14em; }
.manual-share-copy h2 { margin: 0 0 6px; font-size: 1.35rem; line-height: 1.05; }
.manual-share-copy > p:last-child { margin: 0; color: #60756b; font-size: .76rem; line-height: 1.5; }
.manual-share-controls { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 8px; }
.manual-share-controls label { grid-column: 1 / -1; color: #60756b; font-size: .65rem; font-weight: 700; }
.manual-share-controls input { min-width: 0; min-height: 44px; padding: 0 11px; border: 1px solid #cddbcf; border-radius: 10px; background: white; color: var(--ink); font: 500 .72rem var(--body); }
.manual-share-select, .manual-share-close { min-height: 44px; border: 0; border-radius: 999px; cursor: pointer; }
.manual-share-select { padding: 0 14px; background: var(--green); color: white; font-size: .68rem; font-weight: 700; }
.manual-share-close { width: 44px; background: #eef3e9; color: var(--ink); font-size: 1.4rem; line-height: 1; }
.manual-share-controls input:focus-visible, .manual-share-select:focus-visible, .manual-share-close:focus-visible { outline: 3px solid var(--coral); outline-offset: 2px; }

@media (min-width: 1400px) { .hero { min-height: 690px; } .hero-art { height: 470px; } }
@media (max-width: 1040px) {
  .hero { grid-template-columns: minmax(330px, .9fr) minmax(370px, 1.1fr); gap: 35px; }
  .hero-copy { padding-left: 0; }
  h1 { font-size: clamp(3.3rem, 6.2vw, 4.8rem); }
  .map-experience { grid-template-columns: minmax(0, 1fr) 250px; gap: 13px; }
  .map-stage { min-height: 500px; }
  .stamp-card, .map-picks-card { padding: 19px; }
  .region-card { padding: 17px; }
  .place-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .manual-share-panel { right: 12px; bottom: 12px; padding: 16px; }
  .manual-share-controls { grid-template-columns: minmax(0,1fr) auto; }
  .manual-share-controls input { grid-column: 1 / -1; grid-row: 2; }
  .manual-share-select { grid-column: 1; grid-row: 3; }
  .manual-share-close { grid-column: 2; grid-row: 3; }
}
@media (max-width: 760px) {
  .announcement { min-height: 30px; font-size: .56rem; letter-spacing: .08em; }
  .site-header { height: 70px; padding: 0 20px; }
  .brand img { width: 46px; height: 46px; }
  .main-nav { display: none; position: absolute; z-index: 20; top: 100px; left: 14px; right: 14px; gap: 0; margin: 0; padding: 10px; border: 1px solid #e2e7d9; border-radius: 17px; background: var(--white); box-shadow: 0 14px 30px rgba(24,57,47,.14); }
  .main-nav.is-open { display: grid; }
  .main-nav a { padding: 13px 12px; border-bottom: 1px solid #edf0e8; }.main-nav a:last-child { border: 0; }
  .header-cta { margin-left: auto; padding: 11px 13px; font-size: .68rem; }
  .menu-toggle { display: block; }
  .hero { min-height: 0; grid-template-columns: 1fr; gap: 30px; padding: 54px 22px 65px; }
  .hero-copy { max-width: 600px; }
  h1 { max-width: 470px; font-size: clamp(3.15rem, 11.5vw, 5.1rem); }
  .hero-description { max-width: 440px; font-size: .93rem; }
  .hero-footnote { margin-top: 27px; }
  .hero-art-wrap { width: min(100%, 560px); margin: auto; padding: 8px; }
  .hero-art { height: clamp(330px, 77vw, 430px); border-radius: 42% 42% 30px 30px; }
  .sticker-top { right: -8px; }.sticker-bottom { left: -14px; bottom: -20px; }
  .section-pad { padding: 70px 22px; }
  .section-heading { display: block; margin-bottom: 26px; }
  .section-heading > p { max-width: 510px; margin: 17px 0 0; font-size: .8rem; }
  .section-heading h2 { font-size: clamp(2.65rem, 9vw, 3.8rem); }
  .map-experience { grid-template-columns: 1fr; }
  .map-stage { min-height: 500px; border-radius: 23px; }
  .map-aside { grid-template-columns: .8fr 1.2fr; grid-template-rows: auto; }
  .stamp-card, .map-picks-card { border-radius: 19px; padding: 18px; }
  .stamp-card p { font-size: .65rem; }
  .stamp-count strong { font-size: 3rem; }
  .map-bottomline { flex-wrap: wrap; gap: 10px 18px; }
  .share-link { margin-left: auto; }
  .regions-section { padding-top: 75px; padding-bottom: 78px; }
  .region-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .region-card { min-height: 168px; padding: 15px; border-radius: 17px; }
  .region-card strong { font-size: 1.5rem; margin-top: 31px; }
  .region-line { max-width: 150px; font-size: .64rem; line-height: 1.4; }
  .region-emoji { top: 18px; right: 13px; font-size: 1.75rem; }
  .places-section { padding-top: 75px; padding-bottom: 72px; }
  .filter-bar { gap: 7px; }
  .filter-label { width: 100%; margin-bottom: 2px; }
  .filter-chip { padding: 9px 11px; font-size: .64rem; }
  .result-count { width: 100%; margin: 5px 0 0; }
  .place-grid { gap: 12px; }
  .place-art { min-height: 128px; }
  .place-art-icon { width: 76px; height: 76px; font-size: 2.6rem; }
  .place-card-body { padding: 14px; }
  .place-title-button { font-size: 1.08rem; }
  .place-desc { font-size: .65rem; }
  .quiz-section { padding: 62px 22px 72px; }
  .quiz-card { grid-template-columns: 1fr; gap: 25px; padding: 31px 25px; border-radius: 22px; }
  .quiz-card h2 { font-size: 3rem; }
  .quiz-copy p { font-size: .73rem; }
  .quiz-choices { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .quiz-choices button { min-height: 81px; padding: 10px; grid-template-columns: 31px 1fr; column-gap: 8px; }
  .quiz-choices button > span { width: 30px; height: 30px; font-size: 1rem; }
  .quiz-choices strong { font-size: .67rem; }.quiz-choices small { font-size: .53rem; }
  .quiz-emblem { right: -32px; bottom: -43px; width: 108px; height: 108px; }
  .quiz-result { grid-column: 1; max-width: 100%; padding: 13px; font-size: .68rem; }
  .last-call { min-height: 295px; align-items: flex-start; flex-wrap: wrap; gap: 17px; padding-top: 66px; padding-bottom: 72px; }
  .last-call h2 { font-size: 3.8rem; }.last-call p { max-width: 300px; font-size: .74rem; line-height: 1.5; }
  .last-call .button { margin-left: 119px; margin-top: -2px; }
  .last-call-sticker { position: absolute; left: 22px; bottom: 54px; width: 83px; height: 83px; flex-basis: 83px; font-size: .72rem; }
  .site-footer { display: grid; grid-template-columns: 1fr auto; gap: 15px; padding: 27px 22px 30px; }
  .site-footer > p { grid-column: 1 / -1; grid-row: 2; }
  .footer-right { display: grid; justify-items: end; gap: 7px; margin: 0; }
  .footer-trust-links { grid-column: 1 / -1; grid-row: 3; }
}
@media (max-width: 440px) {
  .hero { padding-top: 45px; }
  .hero-actions { gap: 14px; }.hero-actions .button { min-height: 47px; padding: 0 17px; font-size: .74rem; }.text-link { font-size: .7rem; }
  .hero-art { height: 340px; }
  .art-coordinate { top: 45px; right: 14px; font-size: .51rem; }.hero-art-caption { left: 16px; bottom: 16px; }
  .hero-sticker { width: 76px; height: 76px; font-size: .52rem; }.sticker-top { right: -7px; }.sticker-bottom { left: -5px; }
  .section-pad { padding-left: 17px; padding-right: 17px; }
  .map-stage { min-height: 430px; }
  .map-topbar { top: 14px; left: 14px; right: 14px; font-size: .55rem; }
  .map-live { gap: 6px; }.country-count { display: none; }
  .map-visual { top: 5%; height: 72%; }
  .map-instruction { bottom: 16px; font-size: .48rem; }.map-corner-note { right: 11px; bottom: 15px; font-size: .42rem; }
  .map-detail { left: 10px; bottom: 47px; width: calc(100% - 20px); min-height: 66px; padding: 8px; gap: 8px; }
  .detail-icon { flex-basis: 39px; width: 39px; height: 39px; font-size: 1.27rem; }.detail-copy strong { font-size: .83rem; }.detail-copy > span:last-child { font-size: .59rem; }
  .map-compass { top: 18%; right: 6%; }
  .map-aside { grid-template-columns: 1fr; }
  .stamp-card { display: grid; grid-template-columns: auto 1fr; column-gap: 15px; align-items: center; padding: 16px; }
  .stamp-top { grid-column: 1; grid-row: 1; }.stamp-count { grid-column: 2; grid-row: 1 / span 2; margin: 0; justify-self: end; }
  .stamp-count strong { font-size: 2.6rem; }.stamp-progress { grid-column: 1; grid-row: 2; width: 100%; margin-top: 9px; }
  .stamp-card p { grid-column: 1 / -1; max-width: none; margin: 11px 0 8px; }.stamp-row { grid-column: 1 / -1; }
  .map-picks-card { padding: 17px; }
  .map-bottomline { font-size: .59rem; gap: 8px 13px; }.map-bottomline > span:nth-child(2) { display: none; }
  .region-card { min-height: 157px; }.region-number { font-size: .48rem; }.region-line { max-width: 138px; font-size: .59rem; }
  .region-selected-note { flex-wrap: wrap; font-size: .62rem; }
  .place-grid { grid-template-columns: 1fr; gap: 13px; }
  .place-card { display: grid; grid-template-columns: 35% 65%; }
  .place-art { min-height: 100%; }.place-art-icon { width: 62px; height: 62px; border-radius: 23px; font-size: 2.15rem; }
  .place-art-mark { left: 8px; top: 9px; font-size: .44rem; }.place-region-pill { right: 6px; bottom: 8px; padding: 5px 6px; font-size: .48rem; }
  .place-card-body { padding: 12px 11px; }.place-kicker { font-size: .48rem; }.place-title-button { margin: 6px 0; font-size: 1rem; }.place-desc { min-height: 0; margin-bottom: 9px; font-size: .62rem; line-height: 1.45; }
  .place-actions { padding-top: 8px; }.place-tour { font-size: .6rem; }.place-save { font-size: .54rem; }
  .quiz-section { padding-left: 17px; padding-right: 17px; }.quiz-card { padding: 27px 19px; }.quiz-card h2 { font-size: 2.7rem; }
  .quiz-choices { gap: 7px; }.quiz-choices button { grid-template-columns: 27px 1fr; column-gap: 6px; padding: 8px; }.quiz-choices button > span { width: 27px; height: 27px; font-size: .85rem; }.quiz-choices strong { font-size: .61rem; }.quiz-choices small { font-size: .48rem; }
  .last-call { padding-left: 17px; padding-right: 17px; }.last-call h2 { font-size: 3.25rem; }.last-call .button { margin-left: 100px; font-size: .71rem; }
  .last-call-sticker { left: 17px; bottom: 59px; width: 72px; height: 72px; font-size: .65rem; }
  .site-footer { padding-left: 17px; padding-right: 17px; }.footer-right { font-size: .48rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* The living world now sits behind the entire guide instead of inside a hero card. */
html { min-height: 100%; background: #edf2df; overflow-x: clip; }
body { position: relative; isolation: isolate; background: transparent; overflow-x: clip; }
#sylva-world {
  position: fixed;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  pointer-events: none !important;
}
#sylva-world *,
#sylva-world iframe { pointer-events: none !important; }
#sylva-world .shader-frame,
#sylva-world .sylva-living-world-scene,
.living-world-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
#sylva-world .shader-frame { isolation: isolate; overflow: hidden; }
#sylva-world .sylva-living-world-scene { z-index: 1; }
#sylva-world .sylva-living-world-scene iframe { opacity: .92; }
.world-background-wash {
  position: absolute;
  z-index: 3;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(246,245,235,.53) 0%, rgba(246,245,235,.31) 44%, rgba(246,245,235,.52) 100%),
    linear-gradient(90deg, rgba(246,245,235,.16), transparent 56%, rgba(246,245,235,.1));
  pointer-events: none;
}
.living-world-fallback { z-index: 0; overflow: hidden; background: #b7d5ac; }
.world-landscape { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.world-pollen { position: absolute; inset: 0; overflow: hidden; }
.world-pollen i {
  position: absolute;
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fff4c2;
  box-shadow: 0 0 12px 3px rgba(255,239,180,.7);
  animation: pollen-drift 9s ease-in-out infinite alternate;
}
.world-pollen i:nth-child(1) { top: 22%; left: 18%; animation-delay: -2s; }
.world-pollen i:nth-child(2) { top: 33%; left: 62%; width: 4px; height: 4px; animation-delay: -5s; }
.world-pollen i:nth-child(3) { top: 47%; left: 82%; animation-delay: -1s; }
.world-pollen i:nth-child(4) { top: 61%; left: 39%; width: 4px; height: 4px; animation-delay: -6s; }
.world-pollen i:nth-child(5) { top: 18%; left: 75%; width: 5px; height: 5px; animation-delay: -4s; }
.world-pollen i:nth-child(6) { top: 52%; left: 25%; width: 3px; height: 3px; animation-delay: -7s; }
.world-pollen i:nth-child(7) { top: 70%; left: 70%; animation-delay: -3s; }
.world-pollen i:nth-child(8) { top: 39%; left: 48%; width: 4px; height: 4px; animation-delay: -8s; }
.world-fallback-glow { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(246,245,235,.12), transparent 47%, rgba(24,57,47,.1)); }
@keyframes pollen-drift {
  from { transform: translate3d(-8px, 13px, 0); opacity: .38; }
  to { transform: translate3d(14px, -20px, 0); opacity: .95; }
}
.announcement, .site-header, main, .site-footer { position: relative; z-index: 1; }
.announcement { background: rgba(24,57,47,.92); backdrop-filter: blur(12px); }
.site-header { background: rgba(246,245,235,.25); backdrop-filter: blur(16px); }
.hero {
  min-height: clamp(590px, calc(100svh - 114px), 790px);
  grid-template-columns: minmax(390px, 1.02fr) minmax(320px, .78fr);
  gap: clamp(36px, 6vw, 84px);
  padding-top: 36px;
  padding-bottom: 58px;
}
.hero-copy {
  max-width: 680px;
  padding: 28px 30px;
  border: 1px solid rgba(255,255,255,.57);
  border-radius: 30px;
  background: rgba(246,245,235,.65);
  box-shadow: 0 18px 50px rgba(31,76,53,.09), inset 0 1px 0 rgba(255,255,255,.65);
  backdrop-filter: blur(18px);
}
.hero-copy .eyebrow { margin-bottom: 16px; }
.hero-copy h1 { font-size: clamp(3.35rem, 6vw, 5.2rem); }
.hero-copy h1 .hero-keyword-subline { display: block; max-width: 17em; margin-top: .36em; color: #506c58; font: 700 clamp(.95rem, 1.55vw, 1.2rem)/1.32 var(--body); letter-spacing: .025em; }
.hero-footnote { color: #546f60; }
.hero-field-card {
  position: relative;
  width: min(100%, 410px);
  justify-self: end;
  overflow: hidden;
  padding: clamp(24px, 3vw, 34px);
  border: 1px solid rgba(255,255,255,.62);
  border-radius: 30px;
  background: rgba(246,245,235,.68);
  box-shadow: 0 24px 65px rgba(31,76,53,.14), inset 0 1px 0 rgba(255,255,255,.7);
  backdrop-filter: blur(18px);
}
.hero-field-card::after {
  position: absolute;
  top: -86px;
  right: -54px;
  width: 180px;
  height: 180px;
  border: 1px solid rgba(56,111,74,.14);
  border-radius: 50%;
  box-shadow: 0 0 0 19px rgba(255,255,255,.1), 0 0 0 38px rgba(56,111,74,.06);
  content: "";
  pointer-events: none;
}
.field-card-kicker { display: flex; align-items: center; gap: 8px; color: #607969; font-size: .59rem; font-weight: 800; letter-spacing: .15em; }
.field-card-kicker > span { color: var(--coral); font-size: 1rem; }
.hero-field-card h2 { margin: 20px 0 22px; font-size: clamp(2rem, 3vw, 2.65rem); line-height: .98; }
.hero-field-card h2 span { color: var(--green); }
.field-trail-list { display: grid; gap: 7px; }
.field-trail-list > div { display: flex; align-items: center; gap: 11px; min-height: 57px; padding: 8px 10px; border: 1px solid rgba(24,57,47,.08); border-radius: 15px; background: rgba(255,255,255,.42); }
.trail-icon { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 12px; font-size: 1.12rem; }
.trail-peak { background: #d7e8b2; color: #48704d; }.trail-river { background: #c7e7e0; color: #2c8176; }.trail-reef { background: #f6dfac; color: #bd794c; }
.field-trail-list > div > span:nth-child(2) { display: grid; gap: 2px; }
.field-trail-list strong { font: 700 .77rem/1.15 var(--display); }
.field-trail-list small { color: #75877a; font-size: .59rem; }
.field-trail-list b { margin-left: auto; color: #98a595; font-size: .56rem; letter-spacing: .1em; }
.field-card-link { display: flex; align-items: center; justify-content: space-between; margin-top: 15px; padding: 13px 15px; border-radius: 999px; background: var(--green); color: white; text-decoration: none; font-size: .72rem; font-weight: 700; transition: transform .2s ease, background .2s ease; }
.field-card-link:hover { transform: translateY(-2px); background: var(--ink); }
.field-card-link span { color: var(--lime); font-size: 1rem; }
.map-section { background: rgba(230,240,221,.78); backdrop-filter: blur(10px); }
.home-guide-intro { max-width: 1320px; margin: auto; padding-top: 0; padding-bottom: 64px; }
.home-guide-intro-card { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(310px,.85fr); align-items: center; gap: clamp(24px,4vw,54px); padding: clamp(24px,4vw,48px); border: 1px solid rgba(255,255,255,.58); border-radius: 28px; background: rgba(246,245,235,.77); box-shadow: 0 18px 50px rgba(31,76,53,.09), inset 0 1px 0 rgba(255,255,255,.65); backdrop-filter: blur(16px); }
.home-guide-intro-copy .eyebrow { margin-bottom: 12px; }
.home-guide-intro-copy h2 { margin: 0 0 14px; color: var(--ink); font-size: clamp(2rem,3.5vw,3.15rem); line-height: 1; }
.home-guide-intro-copy p { max-width: 74ch; margin: 0; color: #5e7467; font-size: .83rem; line-height: 1.8; }
.home-guide-pillar-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.home-guide-pillar-links a { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 5px 8px; min-height: 74px; padding: 12px 13px; border: 1px solid rgba(24,57,47,.1); border-radius: 15px; background: rgba(255,253,247,.72); color: #345542; text-decoration: none; transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.home-guide-pillar-links a:hover { transform: translateY(-2px); border-color: rgba(91,128,76,.45); box-shadow: 0 9px 20px rgba(32,62,44,.08); }
.home-guide-pillar-links a span { grid-column: 1/-1; color: #849082; font-size: .53rem; font-weight: 800; letter-spacing: .1em; }
.home-guide-pillar-links a strong { align-self: center; font: 600 .86rem/1.15 var(--display); }
.home-guide-pillar-links a b { align-self: center; color: #58764c; font-size: .57rem; white-space: nowrap; }
.places-section { background: rgba(255,253,247,.82); backdrop-filter: blur(10px); }
.quiz-section { background: rgba(255,253,247,.78); backdrop-filter: blur(10px); }
.site-footer { background: rgba(231,236,223,.83); backdrop-filter: blur(14px); }

@media (max-width: 1040px) {
  .hero { grid-template-columns: minmax(320px, 1fr) minmax(300px, .85fr); gap: 28px; }
  .hero-copy { padding: 24px; }
  .hero-copy h1 { font-size: clamp(3rem, 6vw, 4.3rem); }
}
@media (max-width: 1040px) {
  .home-guide-intro-card { grid-template-columns: 1fr; align-items: start; }
  .home-guide-pillar-links { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  #sylva-world .sylva-living-world-scene iframe { opacity: .8; }
  .hero { min-height: 0; grid-template-columns: 1fr; gap: 21px; padding: 42px 22px 60px; }
  .hero-copy { width: 100%; max-width: 620px; padding: 23px 22px; border-radius: 24px; }
  .hero-copy h1 { font-size: clamp(3rem, 11vw, 4.75rem); }
  .hero-copy h1 .hero-keyword-subline { max-width: 16em; font-size: clamp(.93rem,3.6vw,1.08rem); }
  .home-guide-intro { padding-top: 0; padding-bottom: 44px; }
  .home-guide-intro-card { gap: 20px; padding: 22px 20px; border-radius: 23px; }
  .home-guide-pillar-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hero-field-card { width: 100%; max-width: 540px; justify-self: start; margin-left: auto; }
  .map-section, .places-section, .quiz-section { backdrop-filter: blur(7px); }
}
@media (max-width: 440px) {
  .hero { padding-top: 34px; }
  .hero-copy { padding: 20px 18px; }
  .hero-copy h1 { font-size: clamp(2.7rem, 11vw, 3.45rem); }
  .home-guide-pillar-links { grid-template-columns: 1fr; }
  .home-guide-pillar-links a { min-height: 64px; }
  .hero-field-card { padding: 22px 18px; border-radius: 23px; }
  .hero-field-card h2 { font-size: 2.05rem; }
}
@media (prefers-reduced-motion: reduce) {
  .world-pollen i { animation: none; }
}

/* Crisp full-page rainforest, with just enough glass for the guide to read. */
#sylva-world .shader-frame,
#sylva-world .living-world-fallback {
  transform: translate3d(0, var(--world-drift-y, 0px), 0) scale(1.055);
  transform-origin: center;
  will-change: transform;
}
#sylva-world .sylva-living-world-scene {
  filter: saturate(1.18) contrast(1.1);
  opacity: .24;
  mix-blend-mode: screen;
}
#sylva-world .sylva-living-world-scene iframe { opacity: 1 !important; }
.living-world-fallback { background: transparent; }
.world-page-photo {
  position: fixed;
  z-index: 0;
  top: -3%;
  left: -3%;
  display: block;
  width: 106%;
  height: 106%;
  object-fit: cover;
  object-position: center 50%;
  filter: saturate(1.24) contrast(1.14) brightness(.97);
  transform: translate3d(0, var(--world-drift-y, 0px), 0) scale(1.035);
  transform-origin: center;
  will-change: transform;
  pointer-events: none;
}
.world-photo-depth {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(10,34,23,.13), transparent 35%, rgba(10,34,23,.26)),
    linear-gradient(90deg, rgba(10,34,23,.12), transparent 46%, rgba(10,34,23,.08));
}
.world-background-wash {
  background:
    linear-gradient(180deg, rgba(246,245,235,.08) 0%, rgba(246,245,235,.04) 48%, rgba(246,245,235,.14) 100%),
    linear-gradient(90deg, rgba(246,245,235,.05), transparent 48%, rgba(246,245,235,.03));
}
.world-scan-light {
  position: absolute;
  inset: -35%;
  background: linear-gradient(112deg, transparent 43%, rgba(221,250,177,.08) 49%, rgba(255,255,236,.2) 50%, rgba(221,250,177,.06) 52%, transparent 59%);
  mix-blend-mode: screen;
  opacity: .64;
  transform: translateX(-38%);
  animation: world-scan 17s ease-in-out infinite alternate;
}
@keyframes world-scan {
  to { transform: translateX(38%); }
}

.site-header { background: rgba(246,245,235,.74); }
.hero-copy { background: rgba(246,245,235,.77); }
.hero-field-card { background: rgba(246,245,235,.8); }
.map-section { background: rgba(230,240,221,.48); backdrop-filter: none; }
.regions-section { background: rgba(246,245,235,.42); backdrop-filter: none; }
.places-section { background: rgba(255,253,247,.56); backdrop-filter: none; }
.quiz-section { background: rgba(255,253,247,.49); backdrop-filter: none; }
.site-footer { background: rgba(231,236,223,.62); backdrop-filter: none; }

.journey-progress {
  position: fixed;
  z-index: 100;
  inset: 0 0 auto;
  height: 3px;
  pointer-events: none;
}
.journey-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--coral);
  box-shadow: 0 0 12px rgba(242,124,88,.5);
  transform: scaleX(var(--scroll-progress, 0));
  transform-origin: left center;
}
.journey-rail {
  position: fixed;
  z-index: 30;
  top: 50%;
  right: 18px;
  display: grid;
  gap: 13px;
  justify-items: center;
  padding: 13px 10px;
  border: 1px solid rgba(255,255,255,.52);
  border-radius: 999px;
  background: rgba(246,245,235,.56);
  box-shadow: 0 8px 24px rgba(19,54,39,.1);
  backdrop-filter: blur(14px);
  pointer-events: none;
  transform: translateY(-50%);
}
.journey-rail-link {
  position: relative;
  display: block;
  width: 9px;
  height: 9px;
  border: 1px solid rgba(24,57,47,.45);
  border-radius: 99px;
  background: rgba(255,255,255,.72);
  pointer-events: auto;
  transition: width .2s ease, height .2s ease, border-color .2s ease, background .2s ease;
}
.journey-rail-link::after {
  position: absolute;
  top: 50%;
  right: 19px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--ink);
  color: white;
  content: attr(data-label);
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .03em;
  line-height: 1;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transform: translate(4px,-50%);
  transition: opacity .18s ease, transform .18s ease;
}
.journey-rail-link:hover::after,
.journey-rail-link:focus-visible::after,
.journey-rail-link[aria-current="step"]::after { opacity: 1; transform: translate(0,-50%); }
.journey-rail-link[aria-current="step"] {
  width: 20px;
  height: 9px;
  border-color: var(--coral);
  background: var(--coral);
}

html.has-scroll-reveals [data-scroll-reveal] {
  opacity: 0;
  filter: blur(4px);
  transform: translate3d(0, 22px, 0);
  transition: opacity .72s cubic-bezier(.2,.7,.2,1), transform .72s cubic-bezier(.2,.7,.2,1), filter .72s ease;
  transition-delay: var(--reveal-delay, 0ms);
}
html.has-scroll-reveals [data-scroll-reveal].is-visible {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0,0,0);
}

@media (max-width: 1000px) {
  .journey-rail { display: none; }
}
@media (max-width: 760px) {
  #sylva-world .sylva-living-world-scene iframe { opacity: 1 !important; }
  .hero-copy { background: rgba(246,245,235,.83); }
  .hero-field-card { background: rgba(246,245,235,.86); }
  .site-header { background: rgba(246,245,235,.81); }
  .map-section, .regions-section, .places-section, .quiz-section { backdrop-filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  .world-scan-light { animation: none; }
  #sylva-world .shader-frame,
  #sylva-world .living-world-fallback { transform: scale(1.04); }
  html.has-scroll-reveals [data-scroll-reveal],
  html.has-scroll-reveals [data-scroll-reveal].is-visible {
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }
}

/* Editorial guide expansion: searchable places, regional field notes and route sketches. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.region-guide-card { position: relative; display: grid; grid-template-columns: 1.05fr .92fr .88fr; gap: 24px; margin-top: 15px; padding: 25px 28px; border: 1px solid rgba(255,255,255,.7); border-radius: 22px; background: rgba(255,253,247,.74); box-shadow: 0 12px 35px rgba(32,72,47,.07); backdrop-filter: blur(12px); }
.region-guide-intro { display: grid; grid-template-columns: 52px 1fr; align-content: start; gap: 15px; }
.region-guide-emoji { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 18px 15px 20px 14px; background: #d9e8bd; font-size: 1.65rem; transform: rotate(-4deg); }
.region-guide-country, .region-guide-label { display: block; margin: 2px 0 8px; color: #8a9a8c; font-size: .52rem; font-weight: 800; letter-spacing: .13em; }
.region-guide-intro h3 { margin: 0 0 8px; font: 700 1.37rem/1.06 var(--display); letter-spacing: -.045em; }
.region-guide-intro p, .region-guide-start p { margin: 0; color: #6e8073; font-size: .68rem; line-height: 1.65; }
.region-guide-start { padding-left: 22px; border-left: 1px solid rgba(24,57,47,.12); }
.region-guide-start strong { display: block; margin-bottom: 9px; font: 700 .88rem/1.3 var(--display); }
.region-guide-picks { padding-left: 22px; border-left: 1px solid rgba(24,57,47,.12); }
.region-guide-picks > div { display: flex; flex-wrap: wrap; gap: 7px; }
.region-guide-picks button { padding: 7px 9px; border: 1px solid #dfe8d8; border-radius: 999px; background: rgba(255,255,255,.75); color: #426550; font-size: .6rem; font-weight: 700; cursor: pointer; }
.region-guide-picks button:hover { border-color: var(--green); background: #eef5e8; }
.region-guide-picks button span, .region-guide-picks > a span { color: var(--coral); }
.region-guide-picks > a { display: inline-block; margin-top: 14px; color: #718476; font-size: .58rem; font-weight: 700; text-decoration: none; }
.region-guide-picks > a:hover { color: var(--green); }
.place-search { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; width: min(100%, 440px); min-height: 48px; margin: -7px 0 24px auto; padding: 0 13px; border: 1px solid #e1e7da; border-radius: 13px; background: rgba(255,255,255,.78); color: #74877a; }
.place-search > span:first-child { font: 400 1.5rem/1 var(--body); color: #91a196; transform: rotate(-15deg); }
.place-search input { flex: 1; width: 0; padding: 10px 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: 500 .73rem var(--body); }
.place-search input::placeholder { color: #9aa79d; }
.place-search:focus-within { border-color: #77a17d; box-shadow: 0 0 0 3px rgba(126,188,103,.15); }
.place-search kbd { display: grid; place-items: center; min-width: 23px; height: 23px; border: 1px solid #e4e9de; border-radius: 6px; color: #a0aaa0; font: 600 .63rem var(--body); }
.place-planning-note { margin: -3px 0 12px; border: 1px solid #e6ece0; border-radius: 11px; background: #f9fbf5; color: #657b6b; }
.place-planning-note summary { padding: 9px 10px; color: #557361; font-size: .59rem; font-weight: 700; cursor: pointer; list-style: none; }
.place-planning-note summary::-webkit-details-marker { display: none; }
.place-planning-note summary::after { content: "+"; float: right; color: var(--coral); font-size: .8rem; line-height: .8; }
.place-planning-note[open] summary::after { content: "−"; }
.place-planning-note summary span { color: #91a095; font-weight: 500; }
.place-planning-note > p { margin: 0; padding: 0 10px 10px; color: #728277; font-size: .6rem; line-height: 1.55; }
.place-planning-note > p strong { color: #3f654f; }
.trip-planner-section { background: rgba(225,237,216,.69); backdrop-filter: blur(12px); }
.planner-heading { margin-bottom: 32px; }
.planner-controls { display: grid; grid-template-columns: 170px 140px minmax(0,1fr); align-items: end; gap: 17px; margin-bottom: 16px; }
.planner-controls > label { display: grid; gap: 8px; color: #829186; font-size: .53rem; font-weight: 800; letter-spacing: .14em; }
.planner-controls select { width: 100%; min-height: 45px; padding: 0 35px 0 13px; border: 1px solid rgba(24,57,47,.14); border-radius: 12px; appearance: none; background: rgba(255,255,255,.72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='m3 5 4 4 4-4' fill='none' stroke='%235b7765' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 13px center; color: var(--ink); font: 600 .72rem var(--body); letter-spacing: 0; }
.planner-stop-picker { margin: 0 0 16px; padding: 16px 18px; border: 1px solid rgba(24,57,47,.11); border-radius: 16px; background: rgba(255,253,247,.7); }
.planner-stop-picker-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 12px; margin-bottom: 12px; }
.planner-stop-picker-heading strong { color: #304e3f; font-size: .82rem; }
.planner-stop-picker-heading span { color: #718276; font-size: .68rem; line-height: 1.45; }
.planner-stop-picker-list { display: flex; flex-wrap: wrap; gap: 8px; }
.planner-stop-toggle { display: flex; align-items: center; gap: 9px; min-height: 48px; min-width: 160px; padding: 7px 12px; border: 1px solid #dce6d8; border-radius: 12px; background: rgba(255,255,255,.7); color: #536d5c; text-align: left; font: 600 .72rem/1.25 var(--body); cursor: pointer; }
.planner-stop-toggle.is-selected { border-color: #9ab58f; background: #edf4e8; color: #284f39; }
.planner-stop-toggle > span:last-child { display: grid; gap: 3px; }
.planner-stop-toggle small { color: #7b8c7e; font-size: .62rem; font-weight: 500; }
.planner-stop-toggle-mark { display: grid; place-items: center; flex: 0 0 25px; width: 25px; height: 25px; border-radius: 50%; background: #e9eee3; color: #527653; font-size: .86rem; }
.planner-stop-toggle.is-selected .planner-stop-toggle-mark { background: #3d694d; color: #fff; }
.planner-stop-toggle:focus-visible, .planner-controls select:focus-visible { outline: 3px solid var(--coral); outline-offset: 3px; }
.planner-moods { min-width: 0; margin: 0; padding: 0; border: 0; }
.planner-moods legend { margin-bottom: 8px; color: #829186; font-size: .53rem; font-weight: 800; letter-spacing: .14em; }
.planner-moods > div { display: flex; flex-wrap: wrap; gap: 6px; }
.planner-moods button { min-height: 44px; padding: 0 11px; border: 1px solid rgba(24,57,47,.13); border-radius: 999px; background: rgba(255,255,255,.42); color: #52685b; font-size: .6rem; font-weight: 700; cursor: pointer; transition: background .18s ease,color .18s ease,transform .18s ease; }
.planner-moods button:hover { transform: translateY(-2px); }
.planner-moods button.is-active { border-color: var(--green); background: var(--green); color: #fff; }
.trip-plan-result { padding: 26px 29px 21px; border: 1px solid rgba(255,255,255,.7); border-radius: 23px; background: rgba(255,253,247,.85); box-shadow: 0 15px 38px rgba(32,72,47,.09); }
.trip-plan-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 22px; border-bottom: 1px solid rgba(24,57,47,.1); }
.route-kicker { display: block; margin: 0 0 9px; color: #8b9b8d; font-size: .53rem; font-weight: 800; letter-spacing: .14em; }
.trip-plan-top h3 { margin: 0 0 8px; font: 700 clamp(1.45rem, 3vw, 2.15rem)/1 var(--display); letter-spacing: -.06em; }
.trip-plan-top p { max-width: 680px; margin: 0; color: #718276; font-size: .7rem; line-height: 1.6; }
.share-plan { flex: 0 0 auto; padding: 11px 13px; border: 1px solid #dce5d8; border-radius: 999px; background: rgba(255,255,255,.6); color: #466550; font-size: .62rem; font-weight: 700; cursor: pointer; }
.share-plan:hover { border-color: var(--green); background: #eef5e8; }
.share-plan span { margin-left: 6px; color: var(--coral); }
.route-stops { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 12px; padding: 19px 0 16px; }
.route-stop { display: grid; grid-template-columns: 65px 1fr; align-content: start; gap: 11px; min-height: 150px; padding: 15px; border: 1px solid #e8ece1; border-radius: 16px; background: rgba(255,255,255,.57); }
.route-day { display: grid; align-content: start; justify-items: start; gap: 6px; color: #b66c4f; font-size: .48rem; font-weight: 800; letter-spacing: .06em; }
.route-day small { color: #8f9a8f; font-size: .52rem; font-weight: 600; letter-spacing: 0; }
.route-stop h4 { margin: 0 0 6px; font: 700 .88rem/1.1 var(--display); letter-spacing: -.025em; }
.route-stop p { margin: 0; color: #76857a; font-size: .62rem; line-height: 1.55; }
.route-transfer-unknown { grid-column: 1 / -1; margin: -4px 0 2px; padding: 10px 13px; border-left: 3px solid #c88763; border-radius: 0 10px 10px 0; background: #f7f0e6; color: #6e6d5c; font-size: .69rem; line-height: 1.5; }
.route-transfer-unknown strong { color: #5a604d; }
.planner-alert { margin: 12px 0 0; padding: 11px 13px; border: 1px solid #ead2b6; border-radius: 11px; background: #fff6e9; color: #725a42; font-size: .72rem; line-height: 1.5; }
.route-pin-link { display: inline-block; margin-top: 10px; padding: 0; border: 0; border-bottom: 1px solid rgba(40,94,71,.3); background: transparent; color: #41684c; font-size: .59rem; font-weight: 700; text-decoration: none; cursor: pointer; }
.route-pin-link span { margin-left: 4px; color: var(--coral); }
.route-caution { display: flex; gap: 8px; margin: 0; padding: 12px 14px; border-radius: 11px; background: #f0f4e7; color: #708273; font-size: .61rem; line-height: 1.5; }
.route-caution span { color: var(--coral); }
.planner-footnote { display: flex; gap: 9px; max-width: 790px; margin: 14px 0 0; color: #728275; font-size: .64rem; line-height: 1.55; }
.planner-footnote span { color: var(--coral); }
.know-before-section { background: rgba(255,253,247,.75); backdrop-filter: blur(12px); }
.field-note-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }
.field-note-card { position: relative; min-height: 245px; padding: 21px 21px 20px; overflow: hidden; border: 1px solid rgba(24,57,47,.08); border-radius: 20px; background: rgba(255,255,255,.76); }
.field-note-card::after { position: absolute; right: -33px; bottom: -57px; width: 116px; height: 116px; border: 1px solid rgba(24,57,47,.1); border-radius: 50%; box-shadow: 0 0 0 15px rgba(255,255,255,.16),0 0 0 31px rgba(24,57,47,.035); content: ""; }
.field-note-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 14px 12px 14px 11px; background: #e0ecc9; color: #4e7759; font-size: 1.1rem; }
.note-wildlife .field-note-icon { background: #f6e1bd; color: #c47b50; }.note-weather .field-note-icon { background: #d8ebe5; color: #438279; }.note-people .field-note-icon { background: #f4d5c5; color: #a95d49; }
.field-note-label { margin: 18px 0 7px; color: #91a095; font-size: .5rem; font-weight: 800; letter-spacing: .14em; }
.field-note-card h3 { max-width: 235px; margin: 0 0 10px; font: 700 1.06rem/1.04 var(--display); letter-spacing: -.045em; }
.field-note-card > p:last-child { position: relative; z-index: 1; margin: 0; color: #76867a; font-size: .62rem; line-height: 1.6; }
.official-guides { display: grid; grid-template-columns: 1.45fr repeat(4,1fr); align-items: center; gap: 12px; margin-top: 18px; padding: 22px 23px; border-radius: 18px; background: rgba(24,57,47,.94); color: #fffdf7; }
.official-guides > div .eyebrow { margin-bottom: 9px; color: #bdd9b2; font-size: .48rem; }
.official-guides > div h3 { margin: 0 0 5px; font: 700 .97rem/1.1 var(--display); }
.official-guides > div p { max-width: 270px; margin: 0; color: #c1d1c3; font-size: .57rem; line-height: 1.45; }
.official-guides > a { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 42px; padding: 0 11px; border: 1px solid rgba(255,255,255,.17); border-radius: 11px; color: #edf3dc; font-size: .57rem; font-weight: 700; text-decoration: none; }
.official-guides > a:hover { background: rgba(255,255,255,.09); border-color: rgba(216,238,130,.5); }
.official-guides > a span { color: var(--lime); }
.faq-wrap { display: grid; grid-template-columns: .72fr 1.28fr; gap: 40px; margin-top: 63px; padding-top: 42px; border-top: 1px solid rgba(24,57,47,.11); }
.faq-heading .eyebrow { margin-bottom: 9px; font-size: .5rem; }
.faq-heading h3 { margin: 0; font: 700 clamp(1.8rem,3.2vw,2.5rem)/.98 var(--display); letter-spacing: -.06em; }
.faq-list { border-top: 1px solid rgba(24,57,47,.12); }
.faq-list details { border-bottom: 1px solid rgba(24,57,47,.12); }
.faq-list summary { position: relative; padding: 17px 34px 17px 0; color: #294d3d; font: 600 .78rem/1.3 var(--display); list-style: none; cursor: pointer; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { position: absolute; top: 14px; right: 4px; color: var(--coral); content: "+"; font: 400 1.2rem var(--body); }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 680px; margin: -3px 30px 16px 0; color: #748478; font-size: .67rem; line-height: 1.7; }

@media (max-width: 1040px) {
  .region-guide-card { grid-template-columns: 1fr 1fr; }
  .region-guide-picks { grid-column: 1 / -1; padding: 17px 0 0; border-top: 1px solid rgba(24,57,47,.12); border-left: 0; }
  .field-note-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .field-note-card { min-height: 215px; }
  .official-guides { grid-template-columns: repeat(2,1fr); }
  .official-guides > div { grid-column: 1 / -1; }
  .planner-controls { grid-template-columns: 1fr 1fr; }
  .planner-moods { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .region-guide-card { grid-template-columns: 1fr; gap: 18px; padding: 21px; }
  .region-guide-start, .region-guide-picks { padding: 17px 0 0; border-top: 1px solid rgba(24,57,47,.12); border-left: 0; }
  .region-guide-picks { grid-column: auto; }
  .place-search { width: 100%; margin: 0 0 18px; }
  .trip-planner-section, .know-before-section { backdrop-filter: none; }
  .planner-controls { grid-template-columns: 1fr 1fr; gap: 13px; }
  .planner-moods { grid-column: 1 / -1; }
  .trip-plan-result { padding: 21px 17px 16px; }
  .trip-plan-top { display: block; }
  .share-plan { margin-top: 15px; }
  .route-stops { grid-template-columns: 1fr; }
  .route-stop { min-height: 0; }
  .field-note-grid { gap: 10px; }
  .field-note-card { min-height: 235px; padding: 17px; }
  .official-guides { grid-template-columns: 1fr 1fr; padding: 19px; }
  .official-guides > a { min-height: 44px; }
  .faq-wrap { grid-template-columns: 1fr; gap: 21px; margin-top: 47px; padding-top: 31px; }
}
@media (max-width: 440px) {
  .region-guide-card { padding: 17px; border-radius: 17px; }
  .region-guide-intro { grid-template-columns: 41px 1fr; gap: 11px; }
  .region-guide-emoji { width: 41px; height: 41px; border-radius: 13px; font-size: 1.3rem; }
  .region-guide-intro h3 { font-size: 1.15rem; }
  .region-guide-intro p, .region-guide-start p { font-size: .63rem; }
  .planner-controls { grid-template-columns: 1fr 1fr; }
  .planner-moods > div { gap: 5px; }
  .planner-moods button { min-height: 44px; padding: 0 9px; font-size: .55rem; }
  .trip-plan-top h3 { font-size: 1.45rem; }
  .route-stop { grid-template-columns: 53px 1fr; padding: 13px; }
  .field-note-grid { grid-template-columns: 1fr; }
  .field-note-card { min-height: 0; padding: 18px; }
  .field-note-card > p:last-child { max-width: 310px; }
  .official-guides { grid-template-columns: 1fr; }
  .official-guides > div { grid-column: auto; }
}

/* Keep the authored Three.js world vivid, with the rainforest photo beneath as a fallback. */
#sylva-world .sylva-living-world-scene {
  z-index: 1;
  opacity: 1;
  mix-blend-mode: normal;
  background: transparent !important;
}
#sylva-world .sylva-living-world-scene iframe { opacity: 1 !important; filter: saturate(1.42) contrast(1.1); background: transparent; }
#sylva-world .living-world-fallback { z-index: 0; }
#sylva-world .world-background-wash { z-index: 2; }
#sylva-world ~ .world-page-photo { z-index: 1; opacity: .16; filter: saturate(1.3) contrast(1.14); }

/* The map card follows the selected pin and surfaces real places and tours. */
.map-aside { grid-template-rows: auto auto auto; align-content: start; }
.map-destination-card { overflow: hidden; border: 1px solid #e8ebdf; border-radius: 22px; background: rgba(255,255,255,.97); box-shadow: 0 12px 28px rgba(45,78,57,.08); }
.map-destination-photo { position: relative; height: 142px; overflow: hidden; background: #d5e3c7; }
.map-destination-photo::after { content: ""; position: absolute; inset: 35% 0 0; background: linear-gradient(180deg, transparent, rgba(7,36,30,.4)); pointer-events: none; }
.map-destination-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.map-destination-photo > span { position: absolute; z-index: 1; left: 14px; bottom: 12px; padding: 5px 9px; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; background: rgba(11,48,41,.62); color: #fff; font-size: .55rem; font-weight: 700; letter-spacing: .08em; backdrop-filter: blur(8px); }
.map-destination-copy { padding: 15px 17px 14px; }
.map-destination-kicker { color: #718476; font-size: .48rem; font-weight: 800; letter-spacing: .105em; line-height: 1.5; text-transform: uppercase; }
.map-destination-kicker span { color: var(--coral); }
.map-destination-copy h3 { margin: 6px 0 5px; color: var(--green); font: 700 1.13rem/1.14 var(--display); }
.map-destination-copy p { margin: 0; color: #62736a; font-size: .65rem; line-height: 1.5; }
.map-destination-facts { display: grid; grid-template-columns: .68fr 1.32fr; gap: 7px; margin-top: 10px; }
.map-destination-facts > div { min-width: 0; padding: 8px 9px; border: 1px solid #edf0e8; border-radius: 10px; background: #f7f9f2; }
.map-destination-facts span { display: block; margin-bottom: 4px; color: #819087; font-size: .44rem; font-weight: 800; letter-spacing: .12em; }
.map-destination-facts strong { display: block; color: #315b45; font-size: .57rem; line-height: 1.35; }
.map-destination-copy p.map-destination-route { display: grid; grid-template-columns: 70px 1fr; gap: 7px; margin: 9px 0 0; }
.map-destination-route strong { color: #315b45; font-size: .47rem; letter-spacing: .09em; }
.map-destination-route span { color: #62736a; font-size: .58rem; line-height: 1.45; }

.map-destination-tip { display: grid; grid-template-columns: 70px 1fr; gap: 7px; margin-top: 9px; padding: 9px 10px; border: 1px solid #f0e6cf; border-radius: 11px; background: #fffaf0; }
.map-destination-tip > span { color: #a16a30; font-size: .46rem; font-weight: 850; letter-spacing: .1em; }
.map-destination-tip p { margin: 0; color: #746447; font-size: .57rem; line-height: 1.45; }
.map-all-places { margin-top: 11px; padding-top: 10px; border-top: 1px solid #e6ebdf; }
.map-all-places summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #315b45; font-size: .61rem; font-weight: 800; cursor: pointer; list-style: none; }
.map-all-places summary::-webkit-details-marker { display: none; }
.map-all-places summary span { color: #b55f47; font-size: .85rem; transition: transform .2s ease; }
.map-all-places[open] summary span { transform: rotate(45deg); }
.map-all-place-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; margin-top: 9px; }
.map-all-place { display: flex; min-width: 0; flex-direction: column; gap: 2px; padding: 8px 9px; border: 1px solid #e9eee4; border-radius: 9px; background: #fbfcf8; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.map-all-place:hover, .map-all-place.is-selected { border-color: #b6ce9d; background: #f3f7e9; transform: translateY(-1px); }
.map-all-place > span { overflow: hidden; color: #315b45; font-size: .55rem; font-weight: 760; text-overflow: ellipsis; white-space: nowrap; }
.map-all-place small { color: #839087; font-size: .47rem; }

.map-destination-actions { display: flex; align-items: center; justify-content: space-between; gap: 7px; margin-top: 11px; padding-top: 10px; border-top: 1px solid #edf0e8; }
.map-destination-tour { color: var(--green); font-size: .61rem; font-weight: 800; text-decoration: none; }
.map-destination-tour span { color: var(--coral); }
.map-destination-save { padding: 6px 8px; border: 1px solid #e6ebdf; border-radius: 999px; background: #f9faf5; color: #617469; font-size: .54rem; font-weight: 700; cursor: pointer; }
.map-destination-save.is-saved { border-color: #d1e2b8; background: #eff5df; color: #355d43; }
.map-aside .map-picks-card { min-height: 0; }
.quick-pick-image { display: block; width: 36px; height: 36px; flex: 0 0 36px; overflow: hidden; border: 1px solid rgba(33,77,58,.08); border-radius: 11px; background: #edf4d9; }
.quick-pick-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.quick-pick { gap: 9px; }

/* Photo-led field notes use real, credited Borneo photography. */
.place-art { display: block; height: 194px; min-height: 194px; background: #d9e3d2; }
.place-art::before, .place-art::after { display: none; }
.place-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .45s cubic-bezier(.2,.75,.25,1); }
.place-card:hover .place-photo { transform: scale(1.045); }
.place-art-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,31,28,.27) 0%, transparent 42%, rgba(6,31,26,.44) 100%); pointer-events: none; }
.place-art-mark { z-index: 1; color: rgba(255,255,255,.92); font-size: .53rem; text-shadow: 0 1px 8px rgba(0,0,0,.35); }
.place-region-pill { z-index: 1; color: #fff; background: rgba(11,47,39,.66); border-color: rgba(255,255,255,.3); backdrop-filter: blur(9px); }
.place-card-body { display: flex; flex-direction: column; align-items: stretch; min-width: 0; }
.place-actions { margin-top: auto; }

@media (max-width: 760px) {
  .map-aside { grid-template-rows: auto auto auto; align-content: stretch; }
  .map-destination-photo { height: 168px; }
  .map-control-stack { top: 61px; right: 12px; gap: 6px; }
  .map-control-stack button { width: 44px; height: 44px; }
  .main-nav a { display: inline-flex; align-items: center; min-height: 44px; }
  .header-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; }
  .footer-trust-links a, .footer-right > a { display: inline-flex; align-items: center; min-height: 44px; }
  .map-pin { width: 44px; height: 44px; border: 0; background: transparent; box-shadow: none; }
  .map-pin::before { inset: 1px; }
  .map-pin::after { position: absolute; top: 10px; left: 10px; width: 18px; height: 18px; border: 3px solid rgba(255,255,255,.92); border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 5px rgba(242,124,88,.23), 0 5px 12px rgba(14,54,46,.35); content: ""; }
  .map-pin:hover, .map-pin.is-selected { background: transparent; box-shadow: none; }
  .map-pin:hover::after, .map-pin.is-selected::after { background: var(--yellow); box-shadow: 0 0 0 7px rgba(244,200,95,.25), 0 5px 12px rgba(14,54,46,.35); }
  .map-all-places summary, .map-all-place { min-height: 44px; }
  .map-destination-tour, .map-destination-save, .map-destination-guide { display: inline-flex; align-items: center; min-height: 44px; }
  .place-art { height: 100%; min-height: 205px; }
  .place-art-mark { left: 8px; top: 9px; font-size: .43rem; }
}
@media (max-width: 440px) {
  .map-destination-copy { padding: 14px 15px 13px; }
  .map-destination-photo { height: 176px; }
  .map-destination-copy h3 { font-size: 1.03rem; }
  .map-destination-copy p { font-size: .64rem; }
  .quick-pick-image { width: 35px; height: 35px; flex-basis: 35px; }
}


/* Borneo Travels approved horizontal brand lockup */
.site-header .brand-lockup { width: 230px; height: auto; max-width: 100%; }
.footer-brand .brand-lockup { width: 205px; height: auto; max-width: 100%; }
@media (max-width: 760px) {
  .site-header .brand-lockup { width: 190px; }
  .footer-brand .brand-lockup { width: 180px; }
}


@media (max-width: 620px) {
  .map-destination-tip { grid-template-columns: 1fr; gap: 4px; }
  .map-all-place-list { grid-template-columns: 1fr 1fr; }
  .map-all-place { padding: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .map-all-places summary span, .map-all-place { transition: none; }
}

/* Clear discovery flow: choose a mood, explore a place, then shape a trip. */
.hero-field-card { width: min(100%, 455px); background: rgba(246,245,235,.88); }
.hero-field-card h2 { margin-bottom: 17px; }
.field-trail-list { gap: 8px; }
.field-trail-list > button { display: flex; align-items: center; gap: 11px; min-height: 58px; width: 100%; padding: 8px 11px; border: 1px solid rgba(24,57,47,.1); border-radius: 15px; background: rgba(255,255,255,.58); color: var(--ink); text-align: left; cursor: pointer; transition: transform .18s ease, background .18s ease, border-color .18s ease; }
.field-trail-list > button:hover { transform: translateY(-2px); border-color: rgba(40,94,71,.42); background: #fffdf7; }
.field-trail-list > button:focus-visible { outline: 3px solid var(--coral); outline-offset: 2px; }
.field-trail-list > button > span:nth-child(2) { display: grid; flex: 1; gap: 3px; }
.field-trail-list > button b { margin-left: auto; color: #8b998e; font-size: .95rem; }
.trail-food { background: #f5dfcf; color: #9b573e; }
.field-card-hint { margin: 11px 0 0; color: #64786d; font-size: .66rem; line-height: 1.5; }

.home-guide-intro-card { display: block; padding: clamp(28px,4vw,54px); border-color: rgba(240,244,221,.16); background: linear-gradient(148deg,rgba(14,39,35,.97),rgba(26,71,56,.95)); box-shadow: 0 22px 64px rgba(8,30,25,.25),inset 0 1px 0 rgba(255,255,255,.08); }
.home-guide-intro-copy { max-width: 920px; }
.home-guide-intro-copy .eyebrow { color: #b9cba7; }
.home-guide-intro-copy h2 { max-width: 900px; color: #f6f5eb; font-size: clamp(2rem,4.2vw,3.4rem); line-height: 1.02; }
.home-guide-intro-copy h2 span { color: #d5e88c; }
.home-guide-intro-copy p { max-width: 84ch; color: #d5e0d2; font-size: .9rem; line-height: 1.75; }
.home-guide-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 29px; }
.home-guide-steps a { display: flex; align-items: center; gap: 14px; min-height: 100px; padding: 16px; border: 1px solid rgba(241,246,226,.18); border-radius: 17px; background: rgba(255,255,255,.065); color: #f6f5eb; text-decoration: none; transition: transform .2s ease,background .2s ease,border-color .2s ease; }
.home-guide-steps a:hover { transform: translateY(-3px); border-color: rgba(213,232,140,.55); background: rgba(255,255,255,.11); }
.home-guide-step-number { display: grid; place-items: center; flex: 0 0 39px; width: 39px; height: 39px; border: 1px solid rgba(213,232,140,.45); border-radius: 50%; color: #d5e88c; font-size: .68rem; font-weight: 800; }
.home-guide-step-copy { display: grid; flex: 1; gap: 4px; }
.home-guide-step-copy strong { font: 650 1.15rem/1 var(--display); }
.home-guide-step-copy small { color: #c8d4ca; font-size: .68rem; line-height: 1.35; }
.home-guide-steps a > b { color: #d5e88c; }
.home-guide-more { display: flex; flex-wrap: wrap; align-items: center; gap: 9px 22px; margin-top: 20px; color: #bdcdbd; font-size: .68rem; }
.home-guide-more span { color: #99ae9c; font-size: .58rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.home-guide-more a { color: #f6f5eb; text-decoration-color: rgba(246,245,235,.4); text-underline-offset: 4px; }
.home-guide-more a:hover { color: #d5e88c; }

.map-heading h2 { max-width: 780px; }
.map-heading > p { max-width: 390px; font-size: .84rem; }
.map-howto { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: -10px 0 20px; }
.map-howto > div { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 10px 13px; border: 1px solid rgba(24,57,47,.09); border-radius: 13px; background: rgba(255,253,247,.77); }
.map-howto > div > span { display: grid; place-items: center; flex: 0 0 27px; width: 27px; height: 27px; border-radius: 50%; background: var(--ink); color: #e8f0d9; font-size: .56rem; font-weight: 800; }
.map-howto strong { color: #405e4d; font-size: .67rem; line-height: 1.35; }
.map-filter-panel { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; gap: 12px; margin-bottom: 16px; padding: 15px 17px; border: 1px solid rgba(24,57,47,.1); border-radius: 17px; background: rgba(249,250,241,.92); box-shadow: 0 8px 22px rgba(28,64,45,.05); }
.map-filter-group { display: flex; align-items: center; gap: 13px; min-width: 0; }
.map-filter-label { flex: 0 0 78px; color: #7e8e80; font-size: .53rem; font-weight: 850; letter-spacing: .12em; }
.map-region-filters,.map-interest-filters { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.map-region-chip,.map-filter-chip { min-height: 36px; padding: 7px 12px; border: 1px solid rgba(24,57,47,.13); border-radius: 999px; background: #fffdf7; color: #50685a; font-size: .65rem; font-weight: 700; cursor: pointer; transition: color .16s ease,background .16s ease,border-color .16s ease,transform .16s ease; }
.map-region-chip:hover,.map-filter-chip:hover { transform: translateY(-1px); border-color: rgba(40,94,71,.48); }
.map-region-chip.is-active,.map-filter-chip.is-active { border-color: var(--ink); background: var(--ink); color: #f6f5eb; }
.map-filter-count { position: absolute; top: 14px; right: 17px; color: #849083; font-size: .58rem; font-weight: 700; }
.map-filter-panel { padding-right: 106px; }
.map-instruction { bottom: 106px; padding: 9px 13px; color: #f1f4df; font-size: .55rem; letter-spacing: .08em; }
.map-instruction .drag-icon { color: var(--yellow); }

.trip-shortlist-card { min-width: 0; padding: 18px; border: 1px solid rgba(228,241,222,.14); border-radius: 19px; background: #183c33; color: #f6f5eb; box-shadow: 0 12px 28px rgba(8,35,29,.12); }
.trip-shortlist-heading { display: flex; align-items: center; gap: 10px; }
.trip-shortlist-icon { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; background: #d5e88c; color: #183c33; font-size: 1rem; font-weight: 800; }
.trip-shortlist-heading > div { display: grid; gap: 5px; }
.trip-shortlist-card .stamp-label { color: #afc5b2; font-size: .52rem; }
.trip-shortlist-heading strong { font: 650 1rem/1.1 var(--display); }
.trip-shortlist-card > p { margin: 12px 0; color: #cedbcf; font-size: .66rem; line-height: 1.5; }
.shortlist-places { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.shortlist-places li { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 7px 0; border-top: 1px solid rgba(234,242,221,.12); }
.shortlist-place-link { display: grid; flex: 1; gap: 2px; min-width: 0; padding: 0; border: 0; background: none; color: #f6f5eb; text-align: left; font-size: .68rem; font-weight: 700; cursor: pointer; }
.shortlist-place-link small { color: #b8cabb; font-size: .56rem; font-weight: 500; }
.shortlist-remove { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border: 1px solid rgba(236,245,225,.2); border-radius: 50%; background: transparent; color: #e8f0d9; font-size: 1rem; cursor: pointer; }
.shortlist-remove:hover { background: rgba(242,124,88,.2); border-color: #f27c58; }
.shortlist-plan-link { display: flex; align-items: center; justify-content: space-between; min-height: 42px; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(234,242,221,.12); color: #e7efcd; font-size: .65rem; font-weight: 750; text-decoration: none; }
.shortlist-plan-link[aria-disabled="true"] { color: #a7b7aa; }
.shortlist-plan-link span { color: #d5e88c; }
.map-picks-card .quick-pick small { max-width: 195px; font-size: .56rem; }
.map-picks-card .quick-pick-image { flex-basis: 42px; width: 42px; height: 42px; }
.map-picks-card .aside-link { line-height: 1.45; }


@media (max-width: 760px) {
  .home-guide-intro-card { padding: 25px 22px; }
  .home-guide-intro-copy h2 { font-size: clamp(2rem,7vw,3rem); }
  .home-guide-steps { grid-template-columns: 1fr; gap: 8px; margin-top: 22px; }
  .home-guide-steps a { min-height: 75px; padding: 12px 14px; }
  .home-guide-more { gap: 9px 16px; }
  .map-howto { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: -5px; }
  .map-howto > div { min-height: 70px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 6px; padding: 9px; }
  .map-howto > div > span { flex-basis: 23px; width: 23px; height: 23px; }
  .map-filter-panel { padding: 13px; }
  .map-filter-group { display: block; }
  .map-filter-label { display: block; margin-bottom: 7px; }
  .map-region-filters,.map-interest-filters { flex-wrap: nowrap; overflow-x: auto; padding: 0 1px 5px; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
  .map-region-filters::-webkit-scrollbar,.map-interest-filters::-webkit-scrollbar { display: none; }
  .map-region-chip,.map-filter-chip { flex: 0 0 auto; min-height: 40px; }
  .map-filter-count { top: auto; right: 14px; bottom: 14px; }
  .map-filter-panel { padding-bottom: 36px; }
  .map-instruction { bottom: 126px; max-width: calc(100% - 22px); font-size: .5rem; }
}
@media (max-width: 440px) {
  .home-guide-intro-card { padding: 22px 18px; }
  .home-guide-intro-copy p { font-size: .82rem; line-height: 1.7; }
  .home-guide-step-copy small { font-size: .64rem; }
  .map-filter-count { left: 13px; right: auto; }
  .map-instruction { left: 50%; bottom: 126px; width: max-content; max-width: calc(100% - 16px); font-size: .46rem; }
  .trip-shortlist-card { padding: 16px; }
}

/* Keep the planning intro and map workspace on the same comfortable content width. */
.home-guide-intro {
  width: auto;
  max-width: none;
  margin: 0;
  padding-top: 54px;
  padding-bottom: 86px;
}
.home-guide-intro-card {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(350px, .85fr);
  align-items: center;
  gap: clamp(30px, 4vw, 62px);
  max-width: 1256px;
  margin-inline: auto;
}
.home-guide-intro-copy { max-width: 800px; }
.home-guide-intro-copy p { max-width: 68ch; }
.home-guide-steps { margin-top: 0; }
.home-guide-more { grid-column: 1 / -1; }

/* Keep the selected place beside the map, then give discovery picks a full-width row. */
.map-experience {
  grid-template-columns: minmax(0, 1.42fr) minmax(390px, .86fr);
  gap: 22px;
}
.map-stage { min-height: 650px; }
.map-aside {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 12px;
  align-content: start;
}
.map-picks-card {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(185px, .7fr) minmax(0, 3.3fr);
  gap: 0 clamp(16px, 2.4vw, 32px);
  align-items: start;
  padding: 20px 24px;
}
.map-picks-intro { grid-column: 1; grid-row: 1; }
.map-picks-intro .aside-eyebrow { margin-bottom: 7px; }
.map-picks-intro p { margin: 0; color: #708176; font-size: .68rem; line-height: 1.45; }
.map-picks-card .quick-picks {
  grid-column: 2;
  grid-row: 1 / span 3;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
}
.map-picks-card .quick-pick {
  min-height: 70px;
  gap: 8px;
  padding: 8px 9px;
  border-bottom: 0;
  border-left: 1px solid #edf0e6;
}
.map-picks-card .quick-pick span:nth-child(2) { min-width: 0; font-size: .66rem; }
.map-picks-card .quick-pick small { font-size: .52rem; line-height: 1.3; }
.map-picks-card .quick-pick-image { width: 38px; height: 38px; flex-basis: 38px; border-radius: 10px; }
.map-picks-card .map-all-places { grid-column: 1; grid-row: 2; margin-top: 8px; }
.map-picks-card .aside-link { grid-column: 1; grid-row: 3; margin-top: 0; }

@media (max-width: 1100px) {
  .home-guide-intro-card { grid-template-columns: minmax(0, 1fr) minmax(300px, .85fr); }
  .map-experience { grid-template-columns: minmax(0, 1fr); }
  .map-stage { min-height: 590px; }
  .map-aside { grid-template-columns: minmax(0, 1fr) minmax(250px, .72fr); grid-template-rows: auto; align-items: start; }
  .map-aside > #mapDestinationCard { grid-column: 1; }
  .map-aside > .trip-shortlist-card { grid-column: 2; }
}
@media (max-width: 900px) {
  .home-guide-intro-card { grid-template-columns: 1fr; gap: 20px; }
  .home-guide-steps { margin-top: 6px; }
}
@media (max-width: 760px) {
  .home-guide-intro { padding: 54px 22px 72px; }
  .home-guide-intro-card { padding: 25px 22px; }
  .home-guide-steps { margin-top: 6px; }
  .map-stage { min-height: 500px; }
  .map-aside { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto; }
  .map-aside > #mapDestinationCard,
  .map-aside > .trip-shortlist-card { grid-column: 1; }
  .map-picks-card {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding: 18px;
  }
  .map-picks-intro,
  .map-picks-card .quick-picks,
  .map-picks-card .map-all-places,
  .map-picks-card .aside-link { grid-column: 1; grid-row: auto; }
  .map-picks-card .quick-picks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .map-picks-card .quick-pick { border-bottom: 1px solid #edf0e6; border-left: 0; }
  .map-picks-card .quick-pick:nth-last-child(-n + 2) { border-bottom: 0; }
  .map-picks-card .map-all-places { margin-top: 0; }
}
@media (max-width: 440px) {
  .home-guide-intro { padding-right: 17px; padding-left: 17px; }
}

.map-filter-scroll-hint { display: none; margin-left: 8px; color: #718176; font-size: .82rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
@media (max-width: 760px) {
  .map-filter-scroll-hint { display: inline-block; }
  .map-corner-note { display: none; }
}

.home-guide-intro-card { display: block; }
.home-guide-intro-copy { max-width: 1080px; }
.home-guide-intro-copy h2 { max-width: 1040px; }
.home-guide-intro-copy p { max-width: 100ch; }
.home-guide-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 26px; }
.home-guide-more {
  grid-column: auto;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(241,246,226,.16);
}
@media (max-width: 760px) {
  .home-guide-steps { grid-template-columns: minmax(0, 1fr); margin-top: 22px; }
}

/* Keep map controls, trip notes and footer links comfortable to read. */
.announcement, .eyebrow, .hero-footnote, .map-topbar, .map-instruction,
.map-pin-label, .map-region-label, .detail-overline, .detail-copy > span:last-child,
.map-source, .stamp-label, .aside-eyebrow, .stamp-count span, .stamp-card p,
.quick-pick span:nth-child(2), .quick-pick small, .aside-link, .map-bottomline,
.place-art-mark, .place-region-pill, .place-kicker, .place-desc, .place-tour,
.place-guide-link, .place-save, .result-count, .filter-label, .places-footnote,
.hero-art-caption, .hero-art-caption strong, .home-guide-step-copy small,
.home-guide-more, .site-footer > p, .footer-right, .footer-trust-links a,
.booking-disclosure {
  font-size: .8rem;
}

.booking-disclosure { color: #45624f; line-height: 1.55; }
.map-destination-photo > span { font-size: .75rem; }
.map-destination-kicker { font-size: .7rem; letter-spacing: .07em; }
.booking-disclosure a { color: #315d43; font-weight: 700; text-underline-offset: 3px; }
.place-desc { line-height: 1.55; }
.place-kicker, .map-topbar, .map-region-label, .place-art-mark { letter-spacing: .06em; }

@media (max-width: 440px) {
  .map-topbar, .map-instruction, .map-pin-label, .map-region-label,
  .detail-overline, .detail-copy > span:last-child, .map-bottomline,
  .place-art-mark, .place-region-pill, .place-kicker, .place-desc,
  .place-tour, .place-guide-link, .place-save, .footer-right {
    font-size: .76rem;
  }
  .place-card-body .place-desc, .place-actions .place-tour,
  .place-actions .place-guide-link, .place-actions .place-save,
  .quiz-choices strong { font-size: .76rem; }
  .quiz-choices small { font-size: .72rem; }
}

/* Keep the compact navigation inside the header's available width. */
@media (max-width: 1180px) {
  .site-header {
    position: relative;
    z-index: 50;
    isolation: isolate;
    gap: 12px;
    padding-inline: clamp(12px, 4vw, 24px);
  }
  .site-header .brand { flex: 1 1 auto; min-width: 0; }
  .site-header .brand-lockup { display: block; width: min(190px, 100%); max-width: 100%; height: auto; }
  .main-nav {
    display: none;
    position: absolute;
    z-index: 2;
    top: calc(100% - 1px);
    left: clamp(12px, 4vw, 24px);
    right: clamp(12px, 4vw, 24px);
    gap: 0;
    margin: 0;
    padding: 10px;
    border: 1px solid #e2e7d9;
    border-radius: 17px;
    background: var(--white);
    box-shadow: 0 14px 30px rgba(24,57,47,.14);
  }
  .main-nav.is-open { display: grid; }
  .main-nav a { display: flex; align-items: center; min-height: 44px; padding: 10px 12px; border-bottom: 1px solid #edf0e8; }
  .main-nav a:last-child { border: 0; }
  .header-cta { display: none; }
  .menu-toggle {
    display: flex;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    width: 44px;
    min-width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border-radius: 12px;
    position: relative;
    z-index: 3;
  }
  .menu-toggle span { width: 23px; margin: 0; transition: transform .18s ease; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
}