/* Mentaka's own sales trail. Each connector grows with its lesson row. */
.journey { margin-block-start: 24px; margin-bottom: 24px; }
.journey .journey-heading { margin: 0 0 14px; align-items: baseline; }
.journey .journey-heading h2 { font-size: 21px; line-height: 1.35; }
.journey .journey-heading small { font-size: 12px; color: #786b56; }
.journey .journey-chapters { padding: 3px 3px 9px; margin-bottom: 10px; }
.journey .journey-chapters button { font-size: 12px; border-radius: 15px; }
.journey .journey-chapters button.active { background: #ffe7ad; border-color: #d2a649; }
.journey .route-landmark {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 16px;
  padding: 17px 18px 15px; border: 1px solid #dfbd72; border-radius: 21px;
  background: linear-gradient(135deg, #ffe5a5, #fff1cc);
  box-shadow: inset 0 1px 0 #fff9e9, 0 4px 0 #e9d6a9;
}
.journey .route-unit-copy { min-width: 0; }
.journey .route-landmark small { font-size: 10px; line-height: 1.5; color: #74551e; }
.journey .route-landmark h3 { font-size: 21px; line-height: 1.35; }
.journey .route-count { align-self: center; font-size: 18px; color: #5a421f; }
.journey .route-count > span { font-size: 11px; color: #79603a; }
.journey .route-unit-progress { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.journey .route-unit-step { height: 5px; border-radius: 8px; background: #d2b67b; box-shadow: inset 0 1px 0 #b2996c24; }
.journey .route-unit-step.done { background: #52784d; }
.journey .route-unit-step.current { background: #a96c13; }
.journey .chapter-requirement { margin: 17px 4px 0; font-size: 12px; }
.journey .route-map { position: relative; isolation: isolate; min-width: 0; padding-top: 24px; }
.journey .route-rails { z-index: 0; overflow: visible; pointer-events: none; }
/* This short entrance belongs only to the map below its chapter card. */
.journey .route-map > .route-entry { position: absolute; inset: 12px auto auto 0; width: 100%; height: 62px; overflow: hidden; }
.journey .route-segment { inset: 50px auto auto 0; height: 100%; }
.journey .route-segment.route-tail { height: calc(100% - 50px); }
.journey .route-connector { stroke: #e2d4b7; stroke-width: 7px; }
.journey .route-connector.passed { stroke: #a6c39b; }
.journey .route-leg { position: relative; height: auto; min-height: 184px; }
.journey .route-stop {
  z-index: 1; height: auto; min-height: 184px; padding: 100px 0 20px;
  border-radius: 22px; background: transparent; text-align: center;
}
.journey .route-node {
  left: var(--route-x); top: 50px; width: 76px; height: 76px;
  border: 2px solid #d9bd81; background: linear-gradient(145deg, #fff9e9, #f6e6bd);
  color: #7c602b; box-shadow: inset 0 3px 0 #fffef8, 0 7px 0 #d4bd8b, 0 10px 12px #805f1510;
}
.journey .route-number { font-size: 29px; }
.journey .route-label {
  left: clamp(94px, var(--route-x), calc(100% - 94px)); width: min(188px, 72%);
  margin: 0; padding: 4px 7px; min-width: 0; gap: 5px;
  align-items: center; text-align: center; transform: translateX(-50%);
  background: var(--paper); border-radius: 13px;
}
.journey .route-label strong { font-size: 15px; line-height: 1.5; letter-spacing: -.2px; }
.journey .route-state { display: none; }
.journey .route-meta { font-size: 11px; line-height: 1.6; color: #77674e; }
.journey .route-current .route-node {
  background: linear-gradient(150deg, #ffd974, #f5ad28); border-color: #d4931c; color: #3d2d13;
  box-shadow: inset 0 3px 0 #ffeba9, 0 7px 0 #bd831d, 0 0 0 7px #fff0cd, 0 12px 20px #a16b1720;
}
.journey .route-prompt {
  position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%);
  display: block; width: max-content; max-width: 140px; overflow-wrap: anywhere; padding: 6px 10px; border: 1px solid #d7a13b;
  border-radius: 10px; background: #fffaf0; color: #7c5010; font-size: 10px; line-height: 1.3;
  font-weight: 850; letter-spacing: .4px; box-shadow: 0 3px 8px #7857170a;
}
.journey .route-prompt::after {
  content: ''; position: absolute; left: calc(50% - 4px); top: calc(100% - 3px);
  width: 7px; height: 7px; background: #fffaf0; border-right: 1px solid #d7a13b;
  border-bottom: 1px solid #d7a13b; transform: rotate(45deg);
}
.journey .route-done .route-node {
  background: linear-gradient(145deg, #ecf7e6, #cde3c3); border-color: #97b288; color: #32592d;
  box-shadow: inset 0 3px 0 #f7fff2, 0 7px 0 #8fac80, 0 10px 12px #31532210;
}
.journey .route-done.route-current .route-node { box-shadow: inset 0 3px 0 #f7fff2, 0 7px 0 #8fac80, 0 0 0 7px #e5efdc, 0 10px 12px #31532210; }
.journey .route-locked .route-node {
  background: linear-gradient(145deg, #f6f2e9, #e6dfd0); border-color: #cbc1ac; color: #847861;
  box-shadow: inset 0 3px 0 #fffcf6, 0 7px 0 #c8bfae, 0 10px 12px #755b1910;
}
.journey .route-check, .journey .route-lock, .journey .route-play { width: 26px; height: 26px; right: -5px; bottom: -3px; }
.journey .route-stop:active .route-node { transform: translate(-50%, calc(-50% + 4px)); }
.journey .route-stop:focus-visible { outline: 0; }
.journey .route-stop:focus-visible .route-node { outline: 3px solid #996812; outline-offset: 9px; }
.journey .route-stop:focus-visible .route-label { text-decoration: underline; text-underline-offset: 3px; }
.journey .route-scenery { position: absolute; z-index: 0; top: 17px; width: 74px; height: 74px; pointer-events: none; }
.journey .route-scenery.chapter-scenery {
  top: 5px; width: 112px; height: 100px; max-width: 34%; object-fit: contain;
  border: 0; border-radius: 0; opacity: 1; filter: none;
}
.journey .route-scenery-first.chapter-scenery { left: 3%; right: auto; }
.journey .route-scenery-second.chapter-scenery { right: 3%; left: auto; }
.journey .route-shop { left: 4%; }
.journey .route-orders { right: 4%; }
.journey .route-continuation { padding: 0 0 14px; }
.journey .route-next { width: 100%; min-height: 66px; border-radius: 19px; background: #fff5db; border-color: #dfc387; }
.journey .route-next small { font-size: 10px; line-height: 1.5; }
.journey .route-next strong { font-size: 15px; }
.journey .route-next.chapter-locked { background: #f0ebdf; border-color: #d9cebb; }
.journey .route-end { font-size: 12px; }
html[lang='bn'] .journey .route-label strong { line-height: 1.65; }
html[lang='bn'] .journey .route-prompt { letter-spacing: 0; font-size: 11px; }
html[lang='bn'] .journey .route-landmark h3 { line-height: 1.6; }
@media (max-width: 360px) {
  .journey .journey-heading h2 { font-size: 19px; }
  .journey .journey-chapters button { font-size: 11px; }
  .journey .route-landmark { padding: 14px 15px; }
  .journey .route-landmark h3 { font-size: 19px; }
  .journey .route-label { width: 178px; left: clamp(89px, var(--route-x), calc(100% - 89px)); }
  .journey .route-label strong { font-size: 14px; }
  .journey .route-scenery { width: 64px; height: 64px; }
  .journey .route-scenery.chapter-scenery { width: 96px; height: 88px; }
}
@media (prefers-reduced-motion: reduce) {
  .journey .route-node { transition: none; }
}
