/* Green Candle Journeys: Signature Journey pages (journeys/*). Loaded after blog.css + landing.css. */
.tp-hero{position:relative;min-height:520px;display:flex;align-items:flex-end;padding:120px 0 52px;border-bottom:1px solid var(--line);overflow:hidden}
.tp-hero > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.42}
.tp-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,17,23,.25) 0%,rgba(13,17,23,.6) 55%,var(--bg) 100%)}
.tp-hero .wrap{position:relative;z-index:1;width:100%}
.tp-hero h1{font-family:var(--head);font-size:clamp(38px,5.6vw,66px);line-height:1.02;letter-spacing:-1.8px;max-width:880px;margin:14px 0}
.tp-hero h1 em{font-style:normal;color:var(--green)}
.tp-hero p.lead{color:var(--text);opacity:.86;font-size:19px;max-width:680px}
.tp-route{font-family:var(--mono);font-size:13px;color:var(--muted);margin-top:18px;letter-spacing:.4px}
.tp-route em{font-style:normal;color:var(--green);margin:0 6px}
.tp-px{display:flex;gap:28px;flex-wrap:wrap;margin-top:22px;font-family:var(--mono)}
.tp-px small{display:block;font-size:11px;color:var(--dim);letter-spacing:.6px;text-transform:uppercase}
.tp-px b{font-size:26px;color:var(--green);font-weight:700}
.tp-px b.g5{color:var(--gold)}
.tp-px span{font-size:20px;color:var(--text)}

/* Route map: Vietnam drawn as a chart (generated SVG in journeys/*) */
.ov{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ov .rmap,.ov .rmap2{order:-1}
.rmap{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.rm-h{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--dim)}
.rm-h .sym{color:var(--text);font-weight:500;margin-right:8px}
.rm-h .tf{padding:2px 6px;border-radius:4px}
.rm-h .tf.on{background:var(--panel2);color:var(--text)}
.rm-h .ind{color:var(--teal);margin-left:8px}
.rm-h .up{margin-left:auto;color:var(--green);font-weight:500}
.rmap svg{display:block;width:100%;height:auto;font-family:var(--mono)}
.rmap .dt{fill:var(--line)}
.rmap .gl{stroke:var(--line);stroke-dasharray:2 5;stroke-width:1}
.rmap .ax{fill:var(--dim);font-size:10px}
.rmap .vn{fill:rgba(20,184,166,.07);stroke:var(--teal);stroke-width:1.2;stroke-linejoin:round;stroke-opacity:.75}
.rmap .isl{fill:var(--teal);opacity:.8}
.rmap .isn{fill:var(--muted);font-size:9.5px}
.rmap .lv{stroke-width:1;stroke-dasharray:1.5 4}
.rmap .lv.en{stroke:var(--gold);opacity:.7}
.rmap .lv.tp{stroke:var(--green);opacity:.7}
.rmap .trail .tg{fill:var(--green);opacity:.4}
.rmap .trail .tr{fill:var(--red);opacity:.4}
.rmap .rt{fill:none;stroke:var(--green);stroke-width:1.8;stroke-linecap:round;filter:drop-shadow(0 0 4px rgba(0,230,118,.55))}
.rmap .lg{fill:var(--muted);font-size:9.5px;font-style:italic}
.rmap .cd line{stroke-width:1.4}
.rmap .cg line{stroke:var(--green)}.rmap .cg rect{fill:var(--green)}
.rmap .cr line{stroke:var(--red)}.rmap .cr rect{fill:var(--red)}
.rmap .pl rect{fill:var(--bg);stroke:var(--line)}
.rmap .pl text{fill:var(--text);font-size:10.5px}
.rmap .pl.en rect{stroke:var(--gold)}.rmap .pl.en text{fill:var(--gold)}
.rmap .pl.tp rect{fill:var(--green);stroke:var(--green)}.rmap .pl.tp text{fill:#04150c;font-weight:700}
.rmap .zn rect{fill:none;stroke-dasharray:4 3;stroke-width:1.2}
.rmap .zn text{font-size:9.5px}
.rmap .zn.rz rect{stroke:var(--red);fill:rgba(255,82,82,.07)}.rmap .zn.rz text{fill:var(--red)}
.rmap .zn.tz rect{stroke:var(--teal);fill:rgba(20,184,166,.08)}.rmap .zn.tz text{fill:var(--teal)}
.rmap .zb{fill:rgba(245,194,73,.08);stroke:var(--gold);stroke-dasharray:3 3}
.rmap .zl{stroke:var(--gold);stroke-dasharray:2 3;opacity:.6}
.rmap .zn.gz rect{stroke:var(--gold);fill:rgba(245,194,73,.07)}.rmap .zn.gz text{fill:var(--gold)}
.rmap .nav{fill:var(--bg);stroke:var(--line)}
.rmap .vg{fill:var(--green);opacity:.75}
.rmap .vr{fill:var(--red);opacity:.75}
.rm-l{display:flex;gap:16px;flex-wrap:wrap;padding:10px 16px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;color:var(--dim)}
.rm-l i{display:inline-block;width:7px;height:12px;border-radius:1px;margin-right:6px;vertical-align:-1px}
.rm-l .g{background:var(--green)}.rm-l .r{background:var(--red)}.rm-l .v{background:var(--green);opacity:.5;width:12px}
/* The script adds .pend (hidden) and then .go (draw) when the map scrolls into view; skipped under reduced motion. */
.rmap.pend .rt{stroke-dasharray:1;stroke-dashoffset:1}
.rmap.pend .cd,.rmap.pend .pl,.rmap.pend .trail{opacity:0}
.rmap.go .rt{animation:rmdraw 2.2s .2s ease-out forwards}
.rmap.go .cd,.rmap.go .pl{animation:rmpop .5s 1.4s ease-out forwards}
.rmap.go .trail{animation:rmpop 1.2s .6s forwards}
@keyframes rmdraw{to{stroke-dashoffset:0}}
@keyframes rmpop{to{opacity:1}}

/* A trader's day */
.tday{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:28px}
.tday div{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;border-top:3px solid var(--c,var(--teal))}
.tday time{font-family:var(--mono);font-size:12px;color:var(--c,var(--teal))}
.tday h4{font-family:var(--head);font-size:16px;margin:6px 0 4px}
.tday p{color:var(--muted);font-size:14px}

/* Day by day */
.days{margin-top:28px;border-top:1px solid var(--line)}
.days-tools{display:flex;justify-content:flex-end;margin-top:18px}
.days-tools button{font-family:var(--mono);font-size:12px;color:var(--green);background:none;border:1px solid var(--line);border-radius:6px;padding:6px 10px;cursor:pointer}
.day{border-bottom:1px solid var(--line)}
.day summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:86px 1fr auto;gap:16px;align-items:center;padding:18px 0}
.day summary::-webkit-details-marker{display:none}
.day summary::after{content:"+";font-family:var(--mono);color:var(--green);font-size:18px}
.day[open] summary::after{content:"−"}
.day .dn{font-family:var(--mono);font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:.6px}
.day .dn b{display:block;font-size:24px;color:var(--text);font-weight:700;letter-spacing:0}
.day .dt h3{font-family:var(--head);font-size:19px;letter-spacing:-.3px}
.day .dt small{font-family:var(--mono);font-size:11.5px;color:var(--muted);letter-spacing:.5px;text-transform:uppercase}
.day .db{padding:0 0 22px 102px;display:grid;gap:12px}
.day .db > p{color:var(--muted);max-width:780px}
.slot{display:grid;grid-template-columns:150px 1fr;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:13px 16px;max-width:880px}
.slot > span{font-family:var(--mono);font-size:11.5px;letter-spacing:.6px;text-transform:uppercase;color:var(--c,var(--teal));padding-top:2px}
.slot p{color:var(--muted);font-size:15px}
.slot p b{color:var(--text);font-weight:600}
.slot.cafe{--c:var(--green)}
.slot.local{--c:var(--gold)}
.slot.desk{--c:var(--purple)}
.slot.off{--c:var(--red)}
.dmeta{display:flex;gap:18px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;color:var(--dim)}
.dmeta b{color:var(--muted);font-weight:500}

/* Stays */
.stays{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:28px}
.stay-c{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.stay-c .ph{height:150px;background:var(--bg2);border-bottom:1px solid var(--line)}
.stay-c .ph img{width:100%;height:100%;object-fit:cover}
.stay-c .in{padding:16px}
.stay-c .k{font-family:var(--mono);font-size:11px;letter-spacing:.7px;color:var(--teal);text-transform:uppercase}
.stay-c h3{font-family:var(--head);font-size:18px;margin:4px 0 6px}
.stay-c p{color:var(--muted);font-size:14.5px}

/* Other journeys */
.others{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}
.oj{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:6px;transition:border-color .2s}
.oj:hover{border-color:var(--green)}
.oj small{font-family:var(--mono);font-size:11px;color:var(--gold);letter-spacing:.7px}
.oj h3{font-family:var(--head);font-size:18px}
.oj p{color:var(--muted);font-size:14px;flex:1}
.oj b{font-family:var(--mono);color:var(--green);font-size:14px}
.guides{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}
.guides a{display:block;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px;color:var(--text);font-size:15px}
.guides a small{display:block;font-family:var(--mono);font-size:10.5px;color:var(--teal);letter-spacing:.7px;margin-bottom:4px}
.guides a:hover{border-color:var(--teal)}

@media (max-width:860px){
  .ov{grid-template-columns:1fr}
}
@media (max-width:980px){
  .tday{grid-template-columns:1fr 1fr}
  .others{grid-template-columns:1fr 1fr}
  .guides{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .tp-hero{min-height:440px;padding-top:96px}
  .tday,.others,.guides{grid-template-columns:1fr}
  .rm-h .tf,.rm-h .ind{display:none}
  .day summary{grid-template-columns:60px 1fr auto;gap:10px}
  .day .db{padding-left:0}
  .slot{grid-template-columns:1fr;gap:4px}
}

/* Hand-drawn route map v2 (journeys/all-time-high, from scripts/maps/all-time-high.html) */
.rmap2 {
  margin: 0;
  background: #161B22;
  border: 1px solid #30363D;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.25);
  font-family: 'Inter', -apple-system, sans-serif;
  color: #F0F6FC;
  width: 100%;
}

.rmap2 .rm-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid #30363D;
  background: #161B22;
  font-size: 11.5px;
}

.rmap2 .rm-h-left {
  display: flex;
  align-items: center;
  gap: 10px;
}

.rmap2 .sym {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
  color: #F0F6FC;
  letter-spacing: 0.04em;
}

.rmap2 .rm-route {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: #8B949E;
}

.rmap2 .rm-price {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  font-size: 11.5px;
  color: #00E676;
}

.rmap2 svg {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
}

/* Draw-on-scroll animation */
.rmap2 .route-line {
  stroke-dasharray: 1;
  stroke-dashoffset: 0;
}

.rmap2 .fade-item {
  opacity: 1;
}

.rmap2.pend .route-line {
  stroke-dashoffset: 1;
}

.rmap2.pend .fade-item {
  opacity: 0;
}

.rmap2.go .route-line {
  stroke-dashoffset: 0;
  transition: stroke-dashoffset 1.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.rmap2.go .fade-item {
  opacity: 1;
  transition: opacity 0.6s ease-out 1.2s;
}

@media (prefers-reduced-motion: reduce) {
  .rmap2 .route-line,
  .rmap2.pend .route-line,
  .rmap2.go .route-line {
    stroke-dashoffset: 0 !important;
    transition: none !important;
  }
  .rmap2 .fade-item,
  .rmap2.pend .fade-item,
  .rmap2.go .fade-item {
    opacity: 1 !important;
    transition: none !important;
  }
}