/* Harvest-inspired product close-ups, using only KeyCity's own demo surfaces. */
.guided-journey{padding-top:0}
.journey-motion .guided-journey .guided-portal{transform:none;opacity:1}
.guided-portal{border-color:#d6d6d2;border-radius:8px}
.guided-portal .portal-head{padding:16px 22px}
.guided-portal .portal-head>span{background:#fff7ce;border-radius:3px;letter-spacing:.03em}
.tour-viewport{height:365px;overflow:hidden;position:relative;background:#fff}
.tour-camera{height:100%;display:grid;grid-template-columns:132px minmax(0,1fr);transform-origin:50% 50%;transition:transform 460ms cubic-bezier(.2,0,0,1),transform-origin 460ms cubic-bezier(.2,0,0,1)}
.tour-nav{position:relative;background:#f6f6f3;border-right:1px solid #e4e4df;padding:25px 9px 15px}
.tour-nav-label{display:block;color:#72726d;font-size:8px;letter-spacing:.13em;margin:0 10px 19px}
.tour-nav button{border:0;background:none;width:100%;display:flex;align-items:center;gap:8px;text-align:left;padding:12px 8px;margin:4px 0;border-radius:4px;font-size:11px;color:#333;transition:background-color 120ms}
.tour-nav button[aria-pressed=true]{background:var(--yellow);color:#111}
.tour-nav svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.tour-nav-bottom{position:absolute;bottom:22px;left:18px;font-size:8px;color:#666;display:flex;align-items:center;gap:6px}
.tour-nav-bottom span{width:5px;height:5px;background:var(--yellow);border-radius:50%}
.guided-portal .portal-body{padding:25px 22px;min-height:0;background:#fff}
.guided-portal .portal-kicker{font-size:8px;letter-spacing:.06em;gap:12px}
.guided-portal h3{font-size:23px;line-height:1.15;margin:24px 0 10px;max-width:290px}
.tour-section-caption{font-size:11px;color:#666;line-height:1.5;margin-bottom:23px}
.guided-portal .paper{padding:15px 12px;gap:10px}
.guided-portal .paper strong{font-size:12px}
.guided-portal .paper small{font-size:9px;line-height:1.5}
.guided-portal .paper-icon .ui-icon{width:22px;height:22px}
.guided-portal .upload-status{font-size:10px}
.tour-hint{font-size:10px;color:#666;margin-top:26px}
.guided-portal .message{padding:14px}
.guided-portal .message p{font-size:12px;line-height:1.6;margin-top:10px}
.guided-portal .mini-timeline{font-size:9px;gap:8px}
.guided-portal .portal-foot{position:relative;background:#fff;z-index:2;min-height:51px}
.tour-pointer{position:absolute;top:0;left:0;width:30px;height:36px;opacity:0;pointer-events:none;z-index:3;filter:drop-shadow(0 2px 2px #0002)}
.tour-pointer svg{display:block;width:30px;height:36px;fill:#fff;stroke:#111;stroke-width:1.8;stroke-linejoin:round}
.tour-click-ring{position:absolute;left:-9px;top:-9px;width:28px;height:28px;border:2px solid #111;border-radius:50%;opacity:0;transform:scale(.4)}
.tour-pointer.is-clicking .tour-click-ring{animation:tour-click 420ms ease-out both}
.guided-portal[data-tour-view=nav] .tour-camera{transform:scale(1.3);transform-origin:10% 28%}
.guided-portal[data-tour-view=detail] .tour-camera{transform:scale(1.16);transform-origin:85% 50%}
.guided-portal[data-tour-view=overview] .tour-camera{transform:none}
@keyframes tour-click{0%{opacity:.7;transform:scale(.4)}100%{opacity:0;transform:scale(1.7)}}
body.motion-paused .guided-portal .tour-camera{transform:none;transition:none}
body.motion-paused .tour-pointer{display:none}
@media(max-width:800px) and (min-width:561px){.tour-camera{grid-template-columns:104px minmax(0,1fr)}.tour-nav button{font-size:9px;gap:5px;padding-left:4px}.guided-portal .portal-body{padding:20px 14px}.tour-viewport{height:400px}.guided-portal h3{font-size:21px}.guided-portal .portal-kicker{flex-wrap:wrap}.guided-portal .paper{align-items:flex-start}.guided-portal .paper strong{overflow-wrap:anywhere}.tour-nav-bottom{left:12px;font-size:7px}}
@media(max-width:560px){
  .guided-portal .portal-head{padding:12px 15px}
  .tour-viewport{height:375px}
  .tour-camera{display:flex;flex-direction:column;transition:none}
  .tour-nav{display:flex;gap:4px;padding:8px;border-right:0;border-bottom:1px solid #e4e4df}
  .tour-nav-label,.tour-nav-bottom{display:none}
  .tour-nav button{justify-content:center;padding:10px 3px;margin:0;font-size:10px;gap:5px}
  .tour-nav svg{width:14px;height:14px}
  .guided-portal .portal-body{padding:19px 18px}
  .guided-portal h3{font-size:22px;margin:20px 0 9px}
  .tour-section-caption{margin-bottom:17px;font-size:10px}
  .guided-portal .portal-kicker{font-size:7px}
  .guided-portal .tour-camera{transform:none!important}
  .tour-pointer,.tour-pointer svg{width:24px;height:29px}
  .guided-portal .portal-foot{padding:12px;font-size:8px;gap:8px}
  .guided-portal .portal-foot button{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.guided-portal .tour-camera{transform:none!important;transition:none}.tour-pointer{display:none}}
/* Phones show the card at its real size (no camera zoom), so no label goes below 12px. */
@media(max-width:560px){
  .tour-viewport{height:430px}
  .guided-portal .portal-head>span,.tour-nav button,.guided-portal .portal-kicker,.tour-section-caption,
  .guided-portal .paper small,.guided-portal .upload-status,.tour-hint,.guided-portal .message small,
  .guided-portal .mini-timeline,.guided-portal .portal-scene>p,.guided-portal .portal-foot,.guided-portal .portal-foot button{font-size:12px}
  .guided-portal .portal-kicker{letter-spacing:.04em}
  .guided-portal .mini-timeline{gap:6px}
}