/* Scroll camera: the actual Panama coastline stays in one SVG coordinate system. */
.journey{position:relative;background:#103639}.journey-stage{height:100svh;min-height:720px;max-height:none;overflow:hidden}.journey-ready .journey{height:580svh}.journey-ready .journey-stage{position:sticky;top:0;height:100svh;min-height:0}.hero-media{z-index:3;will-change:clip-path,transform}.hero-shade{z-index:4;pointer-events:none}.hero-content{z-index:5}.hero-bottom{z-index:5}.hero h1{font-size:clamp(62px,7.4vw,112px)}.hero h1 em{font-size:.78em}.map-experience{position:absolute;inset:0;z-index:2;background:#103639;color:#f2eddf;opacity:0;pointer-events:none;overflow:hidden}.map-experience.is-active{pointer-events:auto}.map-grid{position:absolute;inset:0;opacity:.16;background-image:linear-gradient(#9db4a61c 1px,transparent 1px),linear-gradient(90deg,#9db4a61c 1px,transparent 1px);background-size:80px 80px}.map-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 80% 45%,#42766a35,transparent 65%),linear-gradient(90deg,#0c2e32,transparent 70%)}.map-canvas{position:absolute;left:30%;right:-5%;top:4%;bottom:7%;overflow:hidden;mask-image:linear-gradient(90deg,transparent 0%,black 12%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 12%)}#azuero-map{width:100%;height:100%;overflow:visible}.map-land{fill:url(#land);stroke:#b4c5a6;stroke-width:1.2;vector-effect:non-scaling-stroke;filter:url(#land-shadow)}.coast-echo{fill:none;stroke:#86b5a9;vector-effect:non-scaling-stroke;stroke-linejoin:round}.echo-1{stroke-width:18;opacity:.09}.echo-2{stroke-width:45;opacity:.045}.echo-3{stroke-width:78;opacity:.025}.land-name{fill:#d8dfba40;font:42px 'Italiana',Georgia,serif;letter-spacing:.14em}.land-subtitle{fill:#c7d9b54a;font:10px 'DM Sans',sans-serif}.ocean-name{fill:#aacbc16b;font:italic 21px Georgia,serif;letter-spacing:.15em}.map-pin{cursor:pointer;outline:none}.pin-hit{fill:transparent;r:25}.pin-halo{fill:none;stroke:#e4cb94;opacity:0;stroke-width:1}.pin-dot{fill:#d5dcc1;stroke:#173c36;stroke-width:2;transition:fill .35s}.pin-label{font-family:'DM Sans',sans-serif;font-size:12px;fill:#d6e0ca;paint-order:stroke;stroke:#23483e;stroke-width:3px;stroke-linejoin:round;transition:fill .3s;pointer-events:none}.map-pin.active .pin-dot{fill:#f9dca0;stroke:#fff4cb;stroke-width:2}.map-pin.active .pin-halo{opacity:.8}.map-pin.active .pin-label{fill:#ffe4ac;font-weight:600}.map-pin:hover .pin-label,.map-pin:focus-visible .pin-label{fill:white}.map-pin:hover .pin-dot,.map-pin:focus-visible .pin-dot{fill:#fff}.map-pin:focus-visible .pin-halo{opacity:1;stroke:white}.map-topline{position:absolute;left:5%;right:5%;top:22px;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:2}.map-brand{width:178px}.map-brand img{width:100%;height:auto;filter:brightness(0) invert(1)}.map-location{font-size:9px;letter-spacing:.17em;color:#b7c8b5}.map-skip{font-size:11px;border-bottom:1px solid #a7b9ac66;padding-bottom:7px}.map-story{position:absolute;top:29%;left:8%;width:31%;max-width:390px;z-index:2;transition:opacity .25s}.map-story .eyebrow{color:#c3cba3;font-size:9px;letter-spacing:.15em;margin-bottom:24px}.map-story h2{font-size:clamp(43px,4.7vw,76px);line-height:1.04;letter-spacing:-.045em}.map-story h2 em{font-size:.68em;line-height:1.3;display:block;margin-top:12px;letter-spacing:-.04em;color:#e6dfc9}.map-story>p:not(.eyebrow):not(.map-scroll-hint){font-size:12px;line-height:1.9;color:#b8ccc1;margin-top:27px;max-width:310px}.chapter-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.chapter-tags span{font-size:9px;letter-spacing:.03em;color:#d3d9bc;padding:7px 11px;border:1px solid #adc8ac33;border-radius:20px}.chapter-explore{background:none;border:0;color:#f0e8d3;padding:0 0 8px;border-bottom:1px solid #d1d5b85c;font-size:11px;margin-top:26px;gap:32px;align-items:center;display:flex}.chapter-explore[hidden]{display:none}.chapter-explore:hover{color:white;border-color:white}.map-scroll-hint{display:flex;align-items:center;gap:12px;margin-top:36px!important;font-size:9px;color:#91ada0;line-height:1.8}.scroll-line{display:block;width:1px;height:32px;background:linear-gradient(transparent,#cfcb9e);flex-shrink:0}.map-compass{position:absolute;right:6%;top:150px;display:flex;flex-direction:column;align-items:center;gap:10px;color:#aebfb1;font-size:10px}.map-compass i{height:36px;width:12px;background:linear-gradient(90deg,#d3d9bb 50%,#748f7e 50%);clip-path:polygon(50% 0,100% 100%,50% 75%,0 100%)}.journey-stops{position:absolute;left:8%;right:8%;bottom:60px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #adc4ac30;padding-top:20px;z-index:3}.journey-stops button{position:relative;white-space:nowrap;background:none;border:0;color:#8fae9e;font-size:11px;padding:8px 0;transition:color .3s}.journey-stops button:before{content:'';position:absolute;top:-24px;left:50%;width:5px;height:5px;border-radius:50%;background:#597e6c;transition:background .3s,box-shadow .3s}.journey-stops button.active{color:#f4e3bc}.journey-stops button.active:before{background:#edcf93;box-shadow:0 0 0 4px #eacf9520,0 0 20px #eacf9580}.journey-stops button:hover{color:white}.journey-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff08}.journey-progress span{height:100%;width:100%;display:block;background:#d4bf87;transform:scaleX(0);transform-origin:left}.map-credits{position:absolute;bottom:20px;left:8%;font-size:8px;color:#74988a}.map-credits a:hover{color:#cbd6bd}.chapter-count{position:absolute;bottom:20px;right:8%;color:#a0b5a1;font-size:9px;letter-spacing:.12em}#place-dialog{background:var(--cream);color:var(--ink);padding:50px;width:min(640px,94vw);border-radius:2px}#place-dialog .close-place{position:absolute;right:18px;top:14px;background:none;border:0;font-size:28px;color:var(--ink)}#place-dialog h2{margin:22px 0;font-size:53px}#place-dialog p:not(.eyebrow){padding:0;color:var(--muted);font-size:14px;line-height:1.85}#place-dialog-tags{display:flex;gap:8px;flex-wrap:wrap;margin:25px 0}#place-dialog-tags span{padding:7px 11px;border:1px solid #b5c3ac;border-radius:20px;font-size:11px}.local-story-link{display:block;width:fit-content}#place-businesses:empty{display:none}.film-banner{height:80svh;min-height:440px}.film-overlay{background:#102c2560}.site-header{z-index:10}
@media(max-width:1000px){.map-story{left:6%;width:34%;top:26%}.map-story h2{font-size:46px}.map-canvas{left:29%;right:0}.map-story>p:not(.eyebrow):not(.map-scroll-hint){font-size:11px}.map-story .eyebrow{font-size:8px}.map-location{display:none}.map-story h2 em{font-size:.65em}.map-topline{top:15px}.map-scroll-hint{font-size:8px}.journey-stops{left:6%;right:6%;gap:10px}.journey-stops button{font-size:10px}.hero h1{font-size:68px}.map-compass{top:110px}}
@media(max-width:650px){.journey-ready .journey{height:560svh}.journey-stage{min-height:670px}.journey-ready .journey-stage{min-height:0}.hero h1{font-size:53px}.hero h1 em{font-size:.78em}.hero-content{bottom:21%}.hero-content .hero-copy{max-width:270px}.map-topline{left:4%;right:6%;top:10px}.map-brand{width:153px}.map-skip{font-size:9px}.map-canvas{left:-5%;right:-5%;top:9%;bottom:43%;mask-image:linear-gradient(180deg,transparent,black 10%,black 90%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,black 10%,black 90%,transparent)}.map-story{left:7%;right:7%;width:auto;max-width:none;top:auto;bottom:135px}.map-story .eyebrow{font-size:7px;margin-bottom:12px;letter-spacing:.12em}.map-story h2{font-size:40px;line-height:1}.map-story h2 em{font-size:.57em;display:inline;margin-top:0;margin-left:5px;line-height:1.15}.map-story h2 br{display:none}.map-story>p:not(.eyebrow):not(.map-scroll-hint){font-size:10px;line-height:1.8;max-width:330px;margin-top:15px}.chapter-tags{margin-top:12px;gap:5px}.chapter-tags span{font-size:8px;padding:5px 9px}.chapter-explore{margin-top:15px;font-size:10px;padding-bottom:5px;gap:30px}.map-scroll-hint{display:none}.map-compass{top:95px;right:7%;font-size:8px}.map-compass i{height:24px;width:8px}.journey-stops{bottom:52px;left:7%;right:7%;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;gap:25px;padding-top:21px;padding-bottom:2px}.journey-stops::-webkit-scrollbar{display:none}.journey-stops button{font-size:10px}.journey-stops button:before{top:-23px}.map-credits{left:7%;bottom:20px;font-size:6px;max-width:75%;line-height:1.6}.chapter-count{right:7%;bottom:21px;font-size:8px}#place-dialog{padding:38px 25px}#place-dialog h2{font-size:40px}#place-dialog p:not(.eyebrow){font-size:12px}.film-overlay h2{font-size:43px}.map-canvas #azuero-map{overflow:visible}}
@media(max-height:650px) and (min-width:651px){.map-story{top:22%}.map-story h2{font-size:42px}.map-story>p:not(.eyebrow):not(.map-scroll-hint){margin-top:15px}.map-scroll-hint{display:none}.chapter-tags{margin-top:12px}.chapter-explore{margin-top:15px}.journey-stops{bottom:45px}.map-credits,.chapter-count{bottom:12px}.map-topline{top:5px}}
@media(prefers-reduced-motion:reduce){.journey-ready .journey{height:auto}.journey-ready .journey-stage{height:100svh;min-height:800px;position:relative}.journey-ready .hero-content,.journey-ready .hero-media,.journey-ready .hero-shade,.journey-ready .hero-bottom{display:none}.site-header{display:none}.map-experience{opacity:1!important;pointer-events:auto}.map-story{transition:none}#azuero-map{scroll-behavior:auto}.map-scroll-hint{display:none}}
/* Clip without creating a nested scroll container: focused map controls must not shift the pinned stage. */
.journey-stage,.map-experience,.map-canvas{overflow:clip}
@media(max-width:650px){.map-story h2 em{display:block;margin:9px 0 0;font-size:.58em}.map-story h2{font-size:38px}}
/* Location-specific moving scenery dissolves into the same canvas as the map. */
.coastal-cinema{position:absolute;inset:0;pointer-events:none;overflow:clip;mask-image:linear-gradient(180deg,transparent 32%,#000 60%,#000 80%,transparent 94%);-webkit-mask-image:linear-gradient(180deg,transparent 32%,#000 60%,#000 80%,transparent 94%)}
.coastal-scene{position:absolute;inset:0;opacity:0;transition:opacity 1.4s ease;overflow:clip}.coastal-scene.is-current{opacity:.72}.coastal-scene.media-failed{opacity:0}.coastal-scene img,.coastal-scene video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:coast-drift 22s ease-in-out infinite alternate;animation-play-state:paused;filter:saturate(.75)}.coastal-scene.is-current img,.coastal-scene.is-current video{animation-play-state:running}.coastal-cinema.is-paused img,.coastal-cinema.is-paused video{animation-play-state:paused}.coastal-scene video{opacity:0;transition:opacity .8s}.coastal-scene video.has-frame{opacity:1}
@keyframes coast-drift{from{transform:scale(1.03) translate(-.6%,.3%)}to{transform:scale(1.12) translate(.7%,-.7%)}}
.map-glow{background:linear-gradient(180deg,#10363900 40%,#10363912 72%,#103639 96%),linear-gradient(90deg,#0c2e3266,transparent 75%)}.map-canvas{z-index:1}.map-land{transition:fill-opacity 1.3s}.has-cinema .map-land{fill-opacity:.88}.map-story{ text-shadow:0 2px 18px #082d32 }.map-story>p:not(.eyebrow):not(.map-scroll-hint){color:#c6d6cc}.cinema-meta{position:absolute;left:8%;bottom:138px;z-index:3;display:flex;align-items:center;gap:18px;color:#eee6cc;font-size:8px;letter-spacing:.1em;text-transform:uppercase;text-shadow:0 1px 8px #082d32}.cinema-meta[hidden]{display:none}.cinema-caption:before{content:'';display:inline-block;width:18px;height:1px;background:#d8bd8c;margin-right:10px;vertical-align:middle}.cinema-motion{border:0;background:#10363980;padding:7px 9px;color:#d5e2d6;font-size:9px;letter-spacing:0;text-transform:none;border-radius:2px;cursor:pointer}.cinema-motion:hover{background:#103639}.cinema-motion[hidden]{display:none}
@media(max-width:1000px){.cinema-meta{left:6%;gap:12px;font-size:7px}}
@media(max-width:650px){.coastal-cinema{mask-image:linear-gradient(180deg,transparent 10%,#000 35%,#000 70%,transparent 89%);-webkit-mask-image:linear-gradient(180deg,transparent 10%,#000 35%,#000 70%,transparent 89%)}.coastal-scene.is-current{opacity:.48}.map-glow{background:linear-gradient(180deg,transparent 25%,#10363975 46%,#103639b3 66%,#103639 90%)}.cinema-meta{left:7%;right:7%;bottom:103px;justify-content:space-between;gap:8px;font-size:6px;letter-spacing:.06em}.cinema-motion{font-size:8px;padding:5px 7px}.cinema-caption:before{width:10px;margin-right:6px}}
@media(max-height:650px) and (min-width:651px){.cinema-meta{bottom:110px;left:auto;right:6%}}
@media(prefers-reduced-motion:reduce){.coastal-scene,.coastal-scene video,.map-land{transition:none}.coastal-scene img,.coastal-scene video{animation:none}}

/* Landscape stills sit lower in the canvas so their subjects survive the soft map blend. */
.coastal-scene.scene-lower{top:30%;mask-image:linear-gradient(180deg,transparent,#000 25%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 25%)}
/* Stable brand dimensions and cheaper map painting while the SVG camera moves. */
.map-topline{min-height:76px;isolation:isolate}.map-brand{display:block;flex:0 0 178px;width:178px;height:74px;aspect-ratio:672/279}.map-brand img{width:100%;height:100%;object-fit:contain}.map-skip{flex-shrink:0;white-space:nowrap}.map-land{filter:none}.map-experience{contain:paint}.hero-media{will-change:transform}.hero-media img,.hero-media video{backface-visibility:hidden}.coastal-scene img,.coastal-scene video{filter:none}.coastal-scene.is-current{opacity:.65}.destination-preview[aria-busy=true]{opacity:.6}.profile-visual .photo-credit{font-size:9px;color:inherit;display:inline;border:0;margin:0;text-decoration:underline;text-underline-offset:3px}
@media(max-width:650px){.map-topline{min-height:65px;gap:15px}.map-brand{flex-basis:153px;width:153px;height:64px}.coastal-scene.is-current{opacity:.46}}
@media(max-height:600px) and (max-width:900px) and (min-width:651px){.map-story{top:24%;width:38%}.map-story h2{font-size:34px}.map-story>p:not(.eyebrow):not(.map-scroll-hint){font-size:10px;line-height:1.65;margin-top:12px}.chapter-tags{display:none}.destination-preview{width:190px;bottom:115px}.cinema-meta{bottom:99px;left:6%;right:auto}.journey-stops{bottom:36px}}
@media(max-height:600px) and (max-width:900px) and (min-width:651px){.cinema-meta{left:auto;right:6%;max-width:48%;justify-content:flex-end}.cinema-caption{display:none}}
