/* A small collection of wine-label keepsakes. The words and journey stay put. */
.journey-route [data-stage="calendar"]{--stop-paper:var(--paper-ochre);--stop-edge:var(--edge-ochre);--stop-ink:#816b3d;--stop-turn:-2deg}
.journey-route [data-stage="cards"]{--stop-paper:var(--paper-lilac);--stop-edge:var(--edge-lilac);--stop-ink:#6b507d;--stop-turn:1.4deg}
.journey-route [data-stage="quiz"]{--stop-paper:var(--paper-lime);--stop-edge:var(--edge-lime);--stop-ink:#637341;--stop-turn:-1.2deg}
.journey-route [data-stage="insight"]{--stop-paper:var(--paper-clay);--stop-edge:var(--edge-clay);--stop-ink:#865d4d;--stop-turn:1.6deg}

@media(min-width:901px){
  .journey-route .map-title{position:relative;padding-right:37px;border-bottom-color:#d5cfb7}
  .journey-route .map-title::after{content:"";position:absolute;right:0;top:2px;width:36px;height:46px;background:url('/assets/inama-watermark-grapes.png') center/contain no-repeat;mix-blend-mode:multiply;opacity:.48;transform:rotate(11deg);pointer-events:none}
  .journey-route .map-title>p{color:var(--ink);font-size:25px;letter-spacing:-.02em}
  .journey-route .map-title>.eyebrow{letter-spacing:.09em;color:#8b786b}
  .journey-route .route-instruction{font-size:9px;color:var(--muted)}
  .journey-route .phase-roadmap{margin-top:15px;margin-bottom:9px}
  .journey-route [data-route-path]{stroke:#b7b799;stroke-width:1.5}
  .journey-route [data-route-progress]{stroke:var(--purple);stroke-width:2.3}
  .journey-route .phase-roadmap>.phase-stop{padding-right:8px;isolation:isolate}
  .journey-route .phase-roadmap>.phase-stop::before{content:"";position:absolute;left:49px;top:35px;width:25px;border-top:1px dashed var(--stop-ink);opacity:.55;pointer-events:none}
  .journey-route .phase-roadmap .route-copy{position:relative;display:block;flex:1;min-width:0;min-height:74px;padding:11px 38px 10px 13px;border:1px solid var(--stop-edge);border-radius:var(--paper-radius);background:var(--stop-paper);box-shadow:var(--paper-shadow);transform:rotate(var(--stop-turn));transform-origin:9px 50%;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
  .journey-route .phase-roadmap .route-copy::before{content:"";position:absolute;right:5px;top:10px;width:33px;height:42px;background-position:center;background-size:contain;background-repeat:no-repeat;mix-blend-mode:multiply;opacity:.66;transform:rotate(8deg);pointer-events:none}
  .journey-route .phase-roadmap .route-copy::after{content:"";position:absolute;left:14px;top:-4px;width:27px;height:7px;background:#fff9e2b0;transform:rotate(-6deg);box-shadow:0 1px 0 #796e4412;pointer-events:none}
  .journey-route .phase-roadmap [data-stage="calendar"] .route-copy::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 48'%3E%3Cpath d='M6 11 35 9 37 41 8 43Z' fill='%23faf4df' stroke='%23816d4a' stroke-width='1.4'/%3E%3Cpath d='m6 19 30-2M14 5l1 10M27 4l1 10' fill='none' stroke='%23816d4a' stroke-width='1.6' stroke-linecap='round'/%3E%3Cpath d='m13 26 3-.2m5-.3 3-.2m5-.3 2-.2m-18 7 3-.2m5-.3 3-.2m5-.3 2-.2' fill='none' stroke='%2391825c' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='m21 32 2 2 6-8' fill='none' stroke='%238d688b' stroke-width='1.3'/%3E%3C/svg%3E")}
  .journey-route .phase-roadmap [data-stage="cards"] .route-copy::before{background-image:url('/assets/inama-heritage.png');width:40px;height:44px;right:0;top:13px;transform:rotate(6deg)}
  .journey-route .phase-roadmap [data-stage="quiz"] .route-copy::before{background-image:url('/assets/inama-watermark-sun.png');width:38px;height:38px;right:1px;top:13px;transform:rotate(-12deg);opacity:.75}
  .journey-route .phase-roadmap [data-stage="insight"] .route-copy::before{background-image:url('/assets/inama-watermark-grapes.png');height:49px;right:4px;top:11px;transform:rotate(10deg)}
  .journey-route .phase-roadmap .phase-stop strong{position:relative;font-size:16px;line-height:1.18;color:var(--ink);letter-spacing:-.015em}
  .journey-route .phase-roadmap .phase-stop small{position:relative;font-size:8px;line-height:1.4;color:var(--muted);margin-top:7px}
  .journey-route .phase-roadmap .phase-stop .phase-dot{color:var(--stop-ink);border-color:var(--stop-ink);background:#f8f4e8;box-shadow:0 0 0 3px var(--paper)}
  .journey-route .phase-roadmap .phase-stop.active .route-copy{transform:rotate(0) translateX(2px);border-color:var(--purple);box-shadow:var(--paper-lift)}
  .journey-route .phase-roadmap .phase-stop.active strong{color:var(--purple-hover)}
  .journey-route .phase-roadmap .phase-stop:hover .route-copy{transform:rotate(0) translateX(3px);box-shadow:var(--paper-lift)}
  .journey-route .phase-roadmap .phase-check{right:-2px;color:#7d885b;font-size:10px}
  .journey-route .planned-day{border-radius:var(--paper-radius);border:1px solid var(--line);background:color-mix(in srgb,var(--paper-ochre) 24%,var(--paper));box-shadow:var(--paper-shadow)}
  .journey-route .map-next>p{color:var(--purple)}
  .journey-route .route-next-button{color:var(--purple)}
  .journey-route .route-footer{border-top-color:var(--line)}
  .journey-bottle-cue{background:var(--purple-soft);border-color:var(--edge-lilac);opacity:.85}
}

@media(min-width:901px) and (max-width:1150px){
  .journey-route .phase-roadmap .route-copy{padding-left:10px;padding-right:30px}
  .journey-route .phase-roadmap .phase-stop strong{font-size:15px}
  .journey-route .phase-roadmap .phase-stop small{font-size:7px}
  .journey-route .phase-roadmap .route-copy::before{right:2px;width:29px}
  .journey-route .phase-roadmap [data-stage="cards"] .route-copy::before{width:33px;right:-1px}
  .journey-route .phase-roadmap [data-stage="quiz"] .route-copy::before{width:30px;right:0}
}

/* On a phone, the four labels become little coloured tabs below the thread. */
@media(max-width:900px){
  .journey-route .mobile-route-links{gap:5px;padding-inline:2px}
  .journey-route .mobile-route-links .phase-stop{border-radius:var(--paper-radius);background:color-mix(in srgb,var(--stop-paper) 60%,var(--paper));border-bottom:1px solid var(--stop-edge);transform:rotate(calc(var(--stop-turn) * .5));transition:background .15s,transform .15s}
  .journey-route .mobile-route-links .phase-stop>strong{color:var(--ink);font-size:9px}
  .journey-route .mobile-route-links .phase-stop>.phase-dot{color:var(--stop-ink)}
  .journey-route .mobile-route-links .phase-stop.active{background:var(--stop-paper);transform:rotate(0);border-bottom:2px solid var(--purple)}
  .journey-route .mobile-route-links .phase-stop.active>strong{color:var(--purple-hover)}
  .journey-route .mobile-route-foot{padding-top:5px}
  .journey-route .mobile-route-strip [data-route-path]{stroke:#b6b798}
  .journey-route .mobile-route-strip [data-route-progress]{stroke:var(--purple)}
  .journey-bottle-cue{background:var(--purple-soft);border-color:var(--edge-lilac);opacity:.85}
}
@media(max-width:355px){
  .journey-route .mobile-route-links{gap:3px}
  .journey-route .mobile-route-links .phase-stop{gap:2px}
  .journey-route .mobile-route-links .phase-stop>strong{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  .journey-route .phase-roadmap .route-copy,.journey-route .mobile-route-links .phase-stop{transition:none}
}