/* Transparent, projected SVG objects share one measured transfer scene. */
.hero-journey{position:relative;width:100%;max-width:1280px;min-width:0;margin-inline:auto;line-height:1;font-family:var(--sans);isolation:isolate}
.hero-journey .yb-board{position:relative;width:100%;height:760px;min-width:0;background:none}
.hero-journey .yb-node{position:absolute;z-index:2;min-width:0}
.hero-journey .yb-device-art{display:block;width:100%;height:auto;overflow:visible}
.hero-journey .yb-source-node{left:25%;top:0;width:205px;transform:translateX(-50%)}
.hero-journey .yb-server-node{left:65%;top:135px;width:440px;transform:translateX(-50%)}
.hero-journey .yb-endpoints{position:absolute;z-index:2;left:50%;bottom:18px;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:1%;transform:translateX(-50%)}
.hero-journey .yb-endpoint{position:relative;flex:none;transform-origin:50% 85%;transition:filter .65s ease}
.hero-journey .yb-endpoint-phone{width:12%}
.hero-journey .yb-endpoint-tablet{width:17%}
.hero-journey .yb-endpoint-desktop{width:23%}
.hero-journey .yb-endpoint-tv{width:25%}
.hero-journey .yb-endpoint-watch{width:13%;margin-bottom:4px}
.hero-journey .yb-flow{position:absolute;inset:0;z-index:3;width:100%;height:100%;overflow:visible;pointer-events:none}
.hero-journey .yb-route{stroke:#93BDE7;stroke-width:1.1;stroke-dasharray:2 7;stroke-linecap:round;opacity:.34}
.hero-journey .yb-flight{opacity:0;filter:drop-shadow(3px 9px 7px #487AC532);will-change:opacity}
.hero-journey .yb-new-image,.hero-journey .yb-source-app,.hero-journey .yb-camera-flash,.hero-journey .yb-launch-identity{opacity:0}
.hero-journey .yb-slot-outline{transition:stroke .45s ease,stroke-width .45s ease}
.hero-journey .yb-new-slot.is-filled>.yb-slot-outline{stroke:#6B9FEF;stroke-width:1.65}
.hero-journey .yb-server-rack .yb-rack-led{transition:fill .4s ease,opacity .4s ease}
.hero-journey .yb-server-rack.is-receiving .yb-rack-led{fill:#B9F8FF;opacity:1}
.hero-journey .yb-endpoint.is-complete{filter:drop-shadow(0 0 8px #A0C8FF2A)}
.hero-journey .yb-description{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.hero-journey .yb-motion-marker{position:absolute;top:0;right:0;width:1px;height:1px;visibility:hidden;pointer-events:none}
@media(min-width:1100px){
  .hero-layout .hero-journey{max-width:none}
  .hero-layout .yb-board{height:clamp(650px,45vw,760px)}
  .hero-layout .yb-source-node{left:23%;width:clamp(160px,27%,215px)}
  .hero-layout .yb-server-node{left:66%;top:16%;width:clamp(310px,60%,460px)}
  .hero-layout .yb-endpoints{bottom:24px}
}
@media(min-width:681px) and (max-width:900px){
  .hero-journey .yb-board{height:690px}
  .hero-journey .yb-source-node{width:185px;left:24%}
  .hero-journey .yb-server-node{top:155px;width:385px;left:64%}
}
@media(max-width:680px){
  .hero-journey .yb-board{height:820px}
  .hero-journey .yb-source-node{width:153px;left:28%;top:0}
  .hero-journey .yb-server-node{top:221px;width:min(100%,325px);left:54%}
  .hero-journey .yb-endpoints{bottom:2px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:6px;row-gap:12px;align-items:end;justify-items:center}
  .hero-journey .yb-endpoint{grid-column:span 2}
  .hero-journey .yb-endpoint-phone{width:83px}
  .hero-journey .yb-endpoint-tablet{width:108px}
  .hero-journey .yb-endpoint-desktop{width:126px}
  .hero-journey .yb-endpoint-tv{grid-column:span 3;width:174px}
  .hero-journey .yb-endpoint-watch{grid-column:span 3;width:91px;margin-bottom:0}
  .hero-journey .yb-route{stroke-width:1;opacity:.34}
}
@media(max-width:370px){
  .hero-journey .yb-board{height:770px}
  .hero-journey .yb-source-node{width:140px}
  .hero-journey .yb-server-node{top:218px;width:280px;left:51%}
  .hero-journey .yb-endpoint-phone{width:72px}
  .hero-journey .yb-endpoint-tablet{width:89px}
  .hero-journey .yb-endpoint-desktop{width:103px}
  .hero-journey .yb-endpoint-tv{width:151px}
  .hero-journey .yb-endpoint-watch{width:81px}
}
@media(prefers-reduced-motion:reduce){
  .hero-journey .yb-motion-marker{width:2px}
  .hero-journey .yb-flight,.hero-journey .yb-camera-flash,.hero-journey .yb-launch-identity{display:none}
  .hero-journey .yb-source-camera{opacity:0!important}
  .hero-journey .yb-source-app,.hero-journey .yb-new-image{opacity:1!important}
  .hero-journey .yb-endpoint,.hero-journey .yb-slot-outline,.hero-journey .yb-rack-led{transition:none}
}