.journey{position:relative;max-width:1080px;margin:36px auto 8px;padding:28px 26px 18px;background:
  radial-gradient(ellipse at 18% 80%,rgba(255,255,255,.9),transparent 42%),
  radial-gradient(ellipse at 78% 18%,rgba(255,252,246,.95),transparent 36%),
  linear-gradient(180deg,#fbf6ee 0%,#f3eadc 100%);
  border:1px solid #eadfce;border-radius:28px;box-shadow:0 18px 50px rgba(28,42,58,.06);overflow:hidden}
.journey-top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;position:relative;z-index:3}
.journey-kicker{margin:0 0 8px;color:#a68548;letter-spacing:.22em;text-transform:uppercase;font-family:Inter,sans-serif;font-size:11px;font-weight:550}
.journey-copy h3{margin:0;max-width:11em;color:#163044;font-family:"Cormorant Garamond",serif;font-size:52px;font-weight:500;line-height:.96;letter-spacing:-.02em}
.journey-lead{margin:12px 0 0;color:#5d6e7c;font-family:"Libre Baskerville","Cormorant Garamond",serif;font-style:italic;font-size:15px}
.journey-stats{display:flex;align-items:center;gap:0;margin:6px 0 0;padding:0;list-style:none}
.journey-stats li{display:flex;align-items:center;gap:8px;padding:0 16px;color:#163044}
.journey-stats li+li{border-left:1px solid #e3d5bf}
.journey-stat-icon{display:grid;place-items:center;width:28px;height:28px;color:#b08a45}
.journey-stat-icon svg{width:22px;height:22px}
.journey-stats strong{font-family:"Cormorant Garamond",serif;font-size:26px;font-weight:600;line-height:1}
.journey-stats small{display:block;max-width:7em;color:#7d6a4e;font-size:11px;line-height:1.25}

.journey-stage{position:relative;height:620px;margin-top:4px}
.journey-stage::before{content:"";position:absolute;left:8%;right:8%;top:18%;bottom:10%;border:1px solid rgba(184,148,86,.28);border-radius:50%;transform:rotate(-16deg);pointer-events:none}
.journey-stage::after{content:"";position:absolute;left:22%;right:22%;bottom:46px;height:36px;background:radial-gradient(ellipse,rgba(40,60,80,.16),transparent 70%);pointer-events:none}
.journey-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.journey-compass{position:absolute;left:8px;bottom:18px;width:78px;height:78px;color:#b08a45;opacity:.85;pointer-events:none;z-index:2}
.journey-compass svg{width:100%;height:100%}
.journey-compass text{fill:#8d7044;font-size:8px;font-family:Inter,sans-serif}

.journey-pin,.journey-ocean{position:absolute;z-index:3;margin:0;padding:0;border:0;background:none}
.journey-pin{display:flex;align-items:center;gap:8px;transform:translate(-7px,-7px);cursor:pointer}
.journey-pin[data-side="left"]{flex-direction:row-reverse;transform:translate(calc(-100% + 7px),-7px)}
.journey-pin[hidden],.journey-ocean[hidden]{display:none}
.journey-pin-dot{width:12px;height:12px;border-radius:50%;background:#fff8ea;border:2px solid #e7c98a;box-shadow:0 0 0 4px rgba(231,201,138,.28);flex:none}
.journey-pin.is-active .journey-pin-dot,.journey-pin.is-hot .journey-pin-dot{background:#f3d48a;box-shadow:0 0 0 7px rgba(231,201,138,.35),0 0 18px rgba(231,201,138,.8)}
.journey-pin-label{display:flex;flex-direction:column;align-items:flex-start;padding:5px 10px 6px;border-radius:999px;background:rgba(18,36,52,.82);color:#fff;backdrop-filter:blur(8px);box-shadow:0 8px 20px rgba(16,32,48,.18);pointer-events:none}
.journey-pin-label strong{font-family:Inter,sans-serif;font-size:10px;font-weight:600;letter-spacing:.12em}
.journey-pin-label small{color:#e7d7b4;font-size:10px}
.journey-ocean{color:rgba(232,240,246,.72);font-family:Inter,sans-serif;font-size:10px;letter-spacing:.22em;text-shadow:0 1px 2px rgba(10,24,40,.35);pointer-events:none;transform:translate(-50%,-50%)}

.journey-card{position:absolute;z-index:4;width:232px;padding:8px;border-radius:18px;background:rgba(255,252,247,.92);border:1px solid rgba(255,255,255,.8);box-shadow:0 16px 40px rgba(24,40,58,.16);backdrop-filter:blur(10px);transition:opacity .35s ease,transform .35s ease}
.journey-card img{width:100%;height:132px;object-fit:cover;border-radius:12px;display:block}
.journey-card.is-swap img{opacity:.35}
.journey-card-body{position:relative;padding:10px 36px 8px 8px}
.journey-card-body p{display:flex;align-items:center;gap:6px;margin:0;color:#163044;font-family:Inter,sans-serif;font-size:12px;font-weight:650;letter-spacing:.08em}
.journey-card-pin{width:8px;height:8px;border-radius:50%;background:#c4a265;box-shadow:0 0 0 3px rgba(196,162,101,.25)}
.journey-card-body small,.journey-card-text{display:block;margin-top:4px;color:#6d7c88;font-size:12px;line-height:1.4}
.journey-card-go{position:absolute;right:4px;bottom:8px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f4efe6;color:#163044}
.journey-card-go:hover{background:#e7d7b4}
.journey.is-fallback .journey-card,.journey.is-fallback .journey-canvas,.journey.is-fallback .journey-loading,.journey.is-fallback .journey-compass,.journey.is-fallback .journey-pin,.journey.is-fallback .journey-ocean{display:none}
.journey-loading{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);margin:0;color:#7d6a4e;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.journey.is-ready .journey-loading{display:none}
.journey-fallback{display:none;padding:24px 8px 0}
.journey.is-fallback .journey-fallback{display:block}
.journey-fallback img{width:100%;height:auto;display:block}
.journey-fallback p{margin:8px 0 0;text-align:center;color:#7d6a4e;font-size:13px}

.journey-bar{display:flex;align-items:center;gap:10px;position:relative;z-index:3}
.journey-play,.journey-arrow{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #e3d3b8;background:rgba(255,252,247,.8);color:#163044;border-radius:999px}
.journey-play{height:40px;padding:0 14px;font-size:12px;letter-spacing:.04em;white-space:nowrap}
.journey-play[aria-pressed="true"]{background:#163044;color:#f7f1e6;border-color:#163044}
.journey-arrow{width:36px;height:36px;flex:none}
.journey-play:hover,.journey-arrow:hover{border-color:#c4a265}
.journey-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;flex:1;padding:8px 2px 4px}
.journey-track::-webkit-scrollbar{display:none}
.journey-stop{position:relative;display:grid;grid-template-columns:86px 1fr;gap:10px;align-items:center;min-width:230px;padding:8px;border:1px solid transparent;border-radius:16px;background:rgba(255,252,247,.72);text-align:left;scroll-snap-align:start;box-shadow:0 8px 18px rgba(24,40,58,.04)}
.journey-stop img{width:86px;height:64px;object-fit:cover;border-radius:10px}
.journey-num{position:absolute;left:6px;bottom:6px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#fff;color:#163044;font-size:10px;font-weight:650}
.journey-stop strong{display:block;color:#163044;font-family:Inter,sans-serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.journey-stop small{display:block;margin-top:3px;color:#7d6a4e;font-size:11px}
.journey-stop.is-active,.journey-stop.is-hot{border-color:#d7b56a;box-shadow:0 0 0 1px #e7c98a,0 10px 24px rgba(184,148,86,.18)}

@media (max-width:860px){
  .journey{padding:20px 14px 14px}
  .journey-top{flex-direction:column;gap:16px}
  .journey-copy h3{font-size:36px}
  .journey-stats{flex-wrap:wrap;gap:10px}
  .journey-stats li{padding:0 12px 0 0}
  .journey-stats li+li{border:0}
  .journey-stage{height:460px;margin-top:0}
  .journey-pin-label{display:none}
  .journey-card{position:relative;left:auto!important;top:auto!important;width:auto;margin:0 8px 12px}
  .journey-stage{height:auto}
  .journey-canvas{position:relative;height:380px}
  .journey-compass{bottom:auto;top:300px}
  .journey-card img{height:180px}
}
@media (prefers-reduced-motion:reduce){
  .journey-card,.journey-pin-dot{transition:none}
}
.paused-motion .journey-pin-dot{box-shadow:0 0 0 4px rgba(231,201,138,.28)}
