/* A large, straight interface is the subject; the explanation supports it. */
.journey-flow .journey-pin {
  height:100svh;
  min-height:0;
  padding-top:calc(var(--header) + 16px);
  padding-bottom:18px;
}
.journey-flow .journey-pin > .section-label { margin-bottom:12px; }
.journey-flow .journey-stage {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:18px;
  flex:1;
  min-height:0;
  padding:0;
  overflow:visible;
}
.journey-flow .journey-story { display:none; }
.journey-flow .journey-tabs {
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  flex:none;
  width:min(780px,100%);
  min-height:76px;
  margin:0;
  padding:0;
  order:0;
}
.journey-flow .journey-tab {
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  min-width:0;
  min-height:70px;
  padding:0 4px;
  text-align:center;
  font-size:14px;
  line-height:1.35;
  border:0;
  color:#aab7aa;
  transition:color .65s var(--ease);
  z-index:1;
}
.journey-flow .journey-tab > span:first-child {
  position:relative;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  margin:0;
  font-size:12px;
  font-weight:600;
  letter-spacing:.01em;
  line-height:1;
  color:#aab7aa;
  border:1px solid #59655d;
  background:#15231f;
  border-radius:50%;
  transition:background .65s var(--ease),border-color .65s var(--ease),color .65s var(--ease),box-shadow .65s var(--ease);
}
.journey-flow .journey-tab .journey-node-label {
  display:block;
  margin:0;
  font-size:14px;
  line-height:1.4;
  letter-spacing:0;
}
.journey-flow .journey-tab.journey-complete > span:first-child {
  color:#17251f;
  background:#d5bd8a;
  border-color:#d5bd8a;
}
.journey-flow .journey-tab.journey-current { color:#f5f2e8; }
.journey-flow .journey-tab.journey-current > span:first-child {
  color:#f6efd9;
  border-color:#d5bd8a;
  box-shadow:0 0 0 5px #d5bd8a10,0 0 22px #d5bd8a0d;
}
.journey-flow-path {
  position:absolute;
  width:75%;
  height:4px;
  left:12.5%;
  top:17px;
  fill:none;
  stroke-width:1;
  pointer-events:none;
  overflow:visible;
  z-index:0;
}
.journey-path-base { stroke:#46594e; }
.journey-path-trace { stroke:#d5bd8a;stroke-dasharray:1;stroke-dashoffset:1; }
.journey-flow .journey-visual {
  position:relative;
  order:1;
  flex:0 1 auto;
  width:min(940px,100%);
  min-height:0;
  max-width:none;
  margin:0;
  perspective:none;
}
.journey-flow .device-shadow { display:none; }
.journey-flow .concept-device {
  display:flex;
  flex-direction:column;
  width:100%;
  height:clamp(270px,40svh,430px);
  min-height:0;
  padding:0;
  border:1px solid #d9d5c5;
  border-radius:18px;
  background:#f7f5ee;
  color:#233a31;
  transform:none;
  will-change:auto;
  box-shadow:0 26px 80px #0002,0 1px 0 #fff9 inset;
  overflow:hidden;
}
.journey-flow .device-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  height:54px;
  flex:none;
  padding:0 26px;
  border-bottom:1px solid #dfdfd2;
  background:#efeee6;
}
.journey-flow .device-top img { width:72px;height:32px;object-fit:contain; }
.journey-flow .device-top > span { font-size:12px;color:#536156;line-height:1.4; }
.journey-flow .device-top .journey-browser-location { font-size:12px;color:#647267; }
.journey-flow .concept-screen {
  height:auto;
  min-height:0;
  flex:1;
  width:100%;
  padding:24px 36px;
  overflow:visible;
}
.journey-flow .screen-content {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:clamp(28px,5vw,80px);
  width:100%;
  height:100%;
  transform:none!important;
  transform-origin:initial;
}
.journey-screen-intro,.journey-screen-controls { min-width:0; }
.journey-flow .concept-screen h4 {
  margin:0 0 14px;
  font-size:clamp(30px,3.3vw,48px);
  font-weight:500;
  letter-spacing:-.055em;
  line-height:1.08;
}
.journey-flow .concept-screen p { font-size:15px;line-height:1.55;color:#5c6b60; }
.journey-flow .concept-screen .mock-kicker {
  margin:0 0 14px;
  font-size:14px;
  line-height:1.4;
  font-weight:600;
  letter-spacing:.065em;
  color:#77643f;
}
.journey-flow .mock-options { display:grid;gap:9px;margin:0; }
.journey-flow .mock-option {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:44px;
  padding:12px 16px;
  font-size:14px;
  line-height:1.4;
  border:1px solid #d9dcd0;
  border-radius:7px;
  background:#f7f7f1;
}
.journey-flow .mock-option.selected { color:#faf7ed;background:#264136;border-color:#264136; }
.journey-flow .journey-screen-controls { display:flex;flex-direction:column;justify-content:center;gap:12px; }
.journey-flow .mock-cta {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:44px;
  padding:12px 16px;
  margin:0;
  font-size:14px;
  line-height:1.4;
  color:#f8f5e9;
  background:#264136;
  border-radius:7px;
  text-align:left;
}
.journey-arrow-icon,.journey-check-icon {
  display:inline-block;
  flex:none;
  vertical-align:middle;
  width:20px;
  height:20px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.journey-flow .mock-details {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  padding:0 0 13px;
  margin:0;
  border-top:0;
  border-bottom:1px solid #dcdfd2;
  font-size:14px;
  line-height:1.5;
  color:#47594b;
}
.journey-flow .mock-detail-label { font-size:14px;line-height:1.4;margin-bottom:4px;color:#6d7767; }
.journey-flow .mock-doctor {
  height:172px;
  min-height:0;
  margin:0;
  border-radius:7px;
  background:linear-gradient(110deg,#e0e5d7,#ebeee4);
}
.journey-flow .mock-doctor img { width:180px;height:225px;bottom:-14px;right:4px; }
.journey-flow .mock-doctor span { left:16px;bottom:16px;padding:0;background:none;font-size:14px;line-height:1.5;color:#365042; }
.journey-flow .mock-summary { padding:12px 15px;font-size:14px;line-height:1.5;background:#e9ecdf;border-radius:7px; }
.journey-flow .mock-fields { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0; }
.journey-flow .mock-fields > span { display:flex;align-items:center;min-height:42px;padding:10px 12px;font-size:14px;line-height:1.4;border:1px solid #d5dbcc;border-radius:6px;color:#687568; }
.journey-flow .mock-confirm { display:flex;gap:9px;padding:0;font-size:14px;line-height:1.4;color:#52654f; }
.journey-flow .mock-confirm > span { width:24px;height:24px;flex:none;border:0;background:#e8eddf; }
.journey-flow .mock-confirm .journey-check-icon { width:17px;height:17px; }
.journey-flow .device-bottom { display:none; }
.journey-flow .concept-note { display:none; }
.journey-flow .journey-panel {
  order:2;
  flex:none;
  min-height:0;
  width:min(940px,100%);
  text-align:center;
}
.journey-flow .journey-panel h3 {
  max-width:none;
  min-height:0;
  margin:0;
  font-size:clamp(22px,2vw,30px);
  line-height:1.2;
  font-weight:400;
  letter-spacing:-.04em;
}
.journey-flow .journey-panel p { max-width:900px;margin:9px auto 0;font-size:15px;line-height:1.55;color:rgb(var(--muted)); }
.journey-flow .scene-bottom { gap:20px;padding-top:12px; }
.journey-flow .scene-bottom .scroll-instruction { font-size:10px;line-height:1.4;letter-spacing:.04em; }
.journey-flow .scene-bottom .scene-progress { display:none; }
.journey-flow .scene-bottom .text-button { font-size:14px;line-height:1.4;padding:5px 0; }

@media(min-width:761px) and (max-height:740px) {
  .journey-flow .journey-pin { padding-top:calc(var(--header) + 10px);padding-bottom:10px; }
  .journey-flow .journey-pin > .section-label { margin-bottom:8px; }
  .journey-flow .journey-stage { gap:12px; }
  .journey-flow .journey-tabs { min-height:62px; }
  .journey-flow .journey-tab { min-height:60px;gap:7px; }
  .journey-flow .journey-tab > span:first-child { width:32px;height:32px;font-size:11px; }
  .journey-flow .journey-tab .journey-node-label { font-size:14px; }
  .journey-flow .journey-flow-path { top:14px; }
  .journey-flow .concept-device { height:clamp(238px,40svh,290px);border-radius:14px; }
  .journey-flow .device-top { height:40px;padding:0 22px; }
  .journey-flow .device-top img { width:61px;height:27px; }
  .journey-flow .concept-screen { padding:14px 28px; }
  .journey-flow .concept-screen h4 { font-size:32px;margin-bottom:10px; }
  .journey-flow .concept-screen .mock-kicker { font-size:14px;margin-bottom:8px; }
  .journey-flow .concept-screen p { font-size:14px;line-height:1.45; }
  .journey-flow .journey-screen-controls { gap:8px; }
  .journey-flow .concept-screen[data-screen="3"] .journey-screen-controls { gap:6px; }
  .journey-flow .mock-options { gap:7px; }
  .journey-flow .mock-option,.journey-flow .mock-cta { min-height:38px;padding:8px 12px;font-size:14px; }
  .journey-flow .mock-details { padding-bottom:8px;font-size:14px;line-height:1.4; }
  .journey-flow .mock-detail-label { font-size:14px; }
  .journey-flow .mock-doctor { height:112px; }
  .journey-flow .mock-doctor img { width:130px;height:168px;bottom:-18px; }
  .journey-flow .mock-doctor span { font-size:14px;left:12px;bottom:12px; }
  .journey-flow .mock-summary { padding:8px 12px;font-size:14px;line-height:1.4; }
  .journey-flow .mock-fields > span { min-height:34px;padding:7px 10px;font-size:14px; }
  .journey-flow .mock-confirm { min-height:24px;font-size:14px; }
  .journey-flow .journey-panel h3 { font-size:22px; }
  .journey-flow .journey-panel p { font-size:14px;line-height:1.45;margin-top:7px;max-width:940px; }
  .journey-flow .scene-bottom { padding-top:6px; }
}

@media(max-width:760px) {
  .journey-flow .journey-pin { padding:calc(var(--header) + 12px) var(--gutter) 12px; }
  .journey-flow .journey-pin > .section-label { margin-bottom:12px; }
  .journey-flow .journey-stage {
    justify-content:flex-start;
    align-items:stretch;
    gap:18px;
    min-height:0;
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:3px 3px 20px;
  }
  .journey-flow .journey-tabs { width:100%;min-height:72px; }
  .journey-flow .journey-tab { min-height:70px;padding:0;gap:10px; }
  .journey-flow .journey-tab > span:first-child { width:32px;height:32px;font-size:11px; }
  .journey-flow .journey-tab .journey-node-label { font-size:12px;line-height:1.4; }
  .journey-flow .journey-flow-path { top:14px; }
  .journey-flow .journey-visual { width:100%;flex:none; }
  .journey-flow .concept-device { height:auto;min-height:0;border-radius:14px;box-shadow:0 20px 50px #0002; }
  .journey-flow .device-top { height:46px;padding:0 17px;gap:10px; }
  .journey-flow .device-top img { width:63px;height:27px; }
  .journey-flow .device-top > span { font-size:11px; }
  .journey-flow .device-top .journey-browser-location { display:none; }
  .journey-flow .concept-screen { flex:none;height:auto;min-height:0;padding:22px 20px;overflow:visible; }
  .journey-flow .screen-content { display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:20px;height:auto; }
  .journey-flow .concept-screen .mock-kicker { display:none; }
  .journey-flow .concept-screen h4,.journey-flow .concept-screen[data-screen="2"] h4,.journey-flow .concept-screen[data-screen="3"] h4 { font-size:29px;line-height:1.12;margin:0 0 12px; }
  .journey-flow .concept-screen h4 br { display:none; }
  .journey-flow .concept-screen p,.journey-flow .concept-screen[data-screen="2"] p:not(.mock-kicker) { display:block;font-size:14px;line-height:1.5; }
  .journey-flow .journey-screen-controls { gap:10px; }
  .journey-flow .mock-options { margin:0;gap:8px; }
  .journey-flow .mock-option,.journey-flow .mock-cta { min-height:44px;padding:11px 13px;font-size:14px;line-height:1.4; }
  .journey-flow .mock-details { font-size:14px;padding-bottom:13px;gap:14px; }
  .journey-flow .mock-detail-label { font-size:14px;line-height:1.4; }
  .journey-flow .mock-doctor { height:152px;margin:0; }
  .journey-flow .mock-doctor img { width:150px;height:200px;bottom:-15px;right:0; }
  .journey-flow .mock-doctor span { font-size:14px;left:12px;bottom:12px; }
  .journey-flow .mock-summary { padding:12px;font-size:14px;line-height:1.5; }
  .journey-flow .mock-fields,.journey-flow .concept-screen[data-screen="3"] .mock-fields { display:grid;grid-template-columns:1fr;gap:8px;margin:0; }
  .journey-flow .mock-fields > span,.journey-flow .concept-screen[data-screen="3"] .mock-fields > span:first-child { display:flex;min-height:42px;padding:10px 12px;font-size:14px; }
  .journey-flow .concept-screen[data-screen="3"] .mock-cta { margin:0; }
  .journey-flow .mock-confirm,.journey-flow .concept-screen[data-screen="3"] .mock-confirm { padding:0;font-size:14px;line-height:1.4; }
  .journey-flow .mock-confirm > span { width:24px;height:24px; }
  .journey-flow .journey-panel { flex:none;max-width:none;width:100%;padding:0 2px; }
  .journey-flow .journey-panel h3 { font-size:24px;line-height:1.18;text-wrap:balance; }
  .journey-flow .journey-panel p { display:block;font-size:14px;line-height:1.55;margin-top:12px; }
  .journey-flow .scene-bottom { flex:none;display:flex;align-items:center;justify-content:space-between;padding-top:10px; }
  .journey-flow .scene-bottom .scroll-instruction { display:none; }
  .journey-flow .scene-bottom .text-button { flex-basis:auto;font-size:14px;min-height:44px;padding:9px 0;line-height:1.45; }
}

@media(max-width:360px) {
  .journey-flow .journey-tab .journey-node-label { font-size:11px; }
  .journey-flow .concept-screen { padding:20px 16px; }
  .journey-flow .concept-screen h4,.journey-flow .concept-screen[data-screen="2"] h4,.journey-flow .concept-screen[data-screen="3"] h4 { font-size:26px; }
  .journey-flow .journey-panel h3 { font-size:22px; }
  .journey-flow .mock-details { grid-template-columns:1fr;gap:10px; }
}

@media(prefers-reduced-motion:reduce) {
  .journey-flow .journey-tab,.journey-flow .journey-tab > span:first-child { transition:none; }
}
@media print {
  .journey-flow .journey-stage { overflow:visible; }
  .journey-flow .journey-tabs { display:none; }
  .journey-flow .concept-device { height:auto;min-height:320px;box-shadow:none; }
  .journey-flow .journey-panel { margin-top:20px; }
}