/* Navigation drawn as the CallNuri voice network. Links remain ordinary anchors. */
.reference-layout .experience-network{position:absolute;z-index:5;right:3%;top:49%;width:46%;height:520px;transform:translateY(-50%);isolation:isolate;color:#fff}
.reference-layout .experience-network::before{content:'';position:absolute;inset:8% 12%;z-index:-1;border-radius:50%;background:radial-gradient(circle,#0649825e 0%,#06385b30 31%,transparent 70%);pointer-events:none}
.reference-layout .network-connections{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.reference-layout .network-wire,.reference-layout .network-wire-pulse{fill:none;stroke-linecap:round;stroke-width:2.5;vector-effect:non-scaling-stroke}
.reference-layout .network-wire{stroke:#63cbed;opacity:.58;filter:drop-shadow(0 0 6px #32b7ef)}
.reference-layout .network-wire-pulse{stroke:#a9f4ff;stroke-width:4;stroke-dasharray:28 360;stroke-dashoffset:350;opacity:0;filter:drop-shadow(0 0 9px #32ccff)}
.reference-layout .experience-network[data-active="store"] [data-wire="store"],.reference-layout .experience-network[data-active="personal"] [data-wire="personal"],.reference-layout .experience-network[data-active="pricing"] [data-wire="pricing"],.reference-layout .experience-network[data-active="features"] [data-wire="features"]{opacity:1;animation:network-travel 1.1s linear infinite}
@keyframes network-travel{to{stroke-dashoffset:0}}
.reference-layout .network-hub{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:210px;height:210px;transform:translate(-50%,-50%);border:1px solid #80e1ff;border-radius:50%;background:radial-gradient(circle at 45% 36%,#166db1 0%,#075388 35%,#062e58 67%,#051d39 100%);box-shadow:0 0 0 11px #148ee535,0 0 0 26px #138de31a,inset 0 0 24px #a2f3ffad,0 0 34px #139efa87;text-align:center;pointer-events:none}
.reference-layout .network-hub-halo{position:absolute;inset:-17px;border:1px solid #6ed5ff9e;border-radius:50%;box-shadow:0 0 18px #22acfa6e}
.reference-layout .network-hub-inner{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%}
.reference-layout .network-wave{height:58px;display:flex;align-items:center;justify-content:center;gap:5px;filter:drop-shadow(0 0 9px #a4eeff)}
.reference-layout .network-wave i{display:block;width:5px;height:var(--bar);border-radius:8px;background:#b9f5ff;box-shadow:0 0 7px #70dcff}
.reference-layout .network-wave i:nth-child(1),.reference-layout .network-wave i:nth-child(9){--bar:11px}.reference-layout .network-wave i:nth-child(2),.reference-layout .network-wave i:nth-child(8){--bar:21px}.reference-layout .network-wave i:nth-child(3),.reference-layout .network-wave i:nth-child(7){--bar:38px}.reference-layout .network-wave i:nth-child(4),.reference-layout .network-wave i:nth-child(6){--bar:28px}.reference-layout .network-wave i:nth-child(5){--bar:54px}
.reference-layout .experience-network.is-engaged .network-wave i{animation:network-voice .55s ease-in-out infinite alternate}.reference-layout .experience-network.is-engaged .network-wave i:nth-child(2n){animation-delay:-.23s}.reference-layout .experience-network.is-engaged .network-wave i:nth-child(3n){animation-delay:-.42s}
@keyframes network-voice{from{height:calc(var(--bar)*.55)}to{height:var(--bar)}}
.reference-layout .network-hub strong{margin-top:7px;font-size:21px;letter-spacing:-.045em;text-shadow:0 0 12px #53cfff}.reference-layout .network-hub small{margin-top:3px;color:#c1eafd;font-size:10px}
.reference-layout .network-node{position:absolute;z-index:2;display:flex;align-items:center;gap:10px;width:205px;min-height:83px;padding:11px 12px;border:1px solid #83c9ebae;border-radius:16px;background:#051c32e8;color:#fff;text-decoration:none;box-shadow:0 9px 24px #0007,inset 0 0 16px #4ab8ed15;transform:translate(-50%,-50%);transition:border-color .2s,background .2s,box-shadow .2s}
.reference-layout .network-node:hover,.reference-layout .network-node:focus-visible,.reference-layout .network-node.is-auto-highlight{border-color:#b7f4ff;background:#06416cee;box-shadow:0 0 22px #16bfff80,0 9px 24px #0007;outline:2px solid #9ee9ff;outline-offset:3px}
.reference-layout .network-store{left:20%;top:20%}.reference-layout .network-personal{left:80%;top:20%}.reference-layout .network-pricing{left:20%;top:80%}.reference-layout .network-features{left:80%;top:80%}
.reference-layout .network-icon{display:grid;place-items:center;flex:0 0 39px;width:39px;height:39px;border:1px solid #7adfff;border-radius:13px;background:#0b5780a8;color:#a1f1ff;box-shadow:inset 0 0 10px #34d3ff30}
.reference-layout .network-icon svg{width:25px;height:25px}.reference-layout .network-label{min-width:0;display:flex;flex-direction:column;gap:4px}.reference-layout .network-label strong{font-size:14px;line-height:1.2;white-space:nowrap}.reference-layout .network-label small{color:#c0d9e8;font-size:10px;line-height:1.25;white-space:nowrap}.reference-layout .network-link-arrow{margin-left:auto;color:#85e6ff;font-size:16px}
.reference-layout .network-node:hover .network-icon,.reference-layout .network-node:focus-visible .network-icon,.reference-layout .network-node.is-auto-highlight .network-icon{background:#118cb8;color:#fff}
@media(min-width:1101px){.reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel{margin-left:4%;width:46%;max-width:660px}.reference-layout .flower-story{padding-top:clamp(130px,18svh,180px)}}
@media(min-width:761px) and (max-width:1100px){.reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel,.reference-layout [data-step="1"] .flower-panel{margin-left:auto;margin-right:auto;width:min(660px,calc(100% - 40px));max-width:none}.reference-layout .experience-network{position:relative;top:auto;right:auto;width:min(700px,calc(100% - 36px));height:445px;margin:23px auto 20px;transform:none}.reference-layout .network-hub{width:172px;height:172px}.reference-layout .network-node{width:184px;min-height:75px}.reference-layout .network-label strong{font-size:13px}.reference-layout .network-label small{font-size:9px}}
@media(min-width:901px) and (max-width:1100px){.reference-layout .nav-wrap{margin-left:2%;width:96%}.reference-layout .flower-story{justify-content:center;padding-top:105px;padding-bottom:105px}.reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel,.reference-layout [data-step="1"] .flower-panel{width:48%;min-height:500px;margin-left:2%;margin-right:0}.reference-layout .experience-network{position:absolute;right:2%;top:49%;width:46%;height:445px;margin:0;transform:translateY(-50%)}.reference-layout .network-hub{width:139px;height:139px}.reference-layout .network-node{width:131px;min-height:69px;gap:6px;padding:8px}.reference-layout .network-icon{flex-basis:29px;width:29px;height:29px;border-radius:9px}.reference-layout .network-icon svg{width:20px;height:20px}.reference-layout .network-label strong{font-size:11px;white-space:normal}.reference-layout .network-label small,.reference-layout .network-link-arrow{display:none}.reference-layout .network-wave{height:41px;gap:3px}.reference-layout .network-wave i{width:4px;max-height:39px}.reference-layout .network-hub strong{font-size:17px;margin-top:3px}.reference-layout .network-hub small{font-size:8px}}
@media(max-width:760px){.reference-layout .experience-network{position:relative;top:auto;right:auto;order:2;width:100%;height:335px;margin:9px 0 0;transform:none}.reference-layout .experience-network::before{inset:15% 14%}.reference-layout .network-hub{width:120px;height:120px;box-shadow:0 0 0 6px #148ee535,0 0 0 14px #138de31a,inset 0 0 20px #a2f3ffad,0 0 25px #139efa87}.reference-layout .network-hub-halo{inset:-9px}.reference-layout .network-wave{height:35px;gap:3px}.reference-layout .network-wave i{width:3px;max-height:33px}.reference-layout .network-hub strong{margin-top:2px;font-size:15px}.reference-layout .network-hub small{font-size:7px}.reference-layout .network-node{width:36%;max-width:137px;min-height:69px;gap:6px;padding:8px;border-radius:12px}.reference-layout .network-icon{flex-basis:28px;width:28px;height:28px;border-radius:9px}.reference-layout .network-icon svg{width:19px;height:19px}.reference-layout .network-label strong{font-size:11px;white-space:normal}.reference-layout .network-label small,.reference-layout .network-link-arrow{display:none}.reference-layout .network-store{left:19%;top:20%}.reference-layout .network-personal{left:81%;top:20%}.reference-layout .network-pricing{left:19%;top:80%}.reference-layout .network-features{left:81%;top:80%}.reference-layout .story-controls{order:3}.reference-layout .story-navigation-hint{order:4}}
@media(max-width:370px){.reference-layout .network-node{width:37%;padding:7px 6px}.reference-layout .network-label strong{font-size:10px}}
@media(prefers-reduced-motion:reduce){.reference-layout .network-wire-pulse,.reference-layout .experience-network.is-engaged .network-wave i{animation:none}.reference-layout .network-node{transition:none}}
/* Place the shortcut network to the left of the story panel on wide screens. */
@media(min-width:1101px){
  .reference-layout .experience-network{left:3%;right:auto}
  .reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel,.reference-layout [data-step="1"] .flower-panel{margin-left:auto;margin-right:4%}
}
@media(min-width:901px) and (max-width:1100px){
  .reference-layout .experience-network{left:2%;right:auto}
  .reference-layout .flower-panel,.reference-layout [data-step="0"] .flower-panel,.reference-layout [data-step="1"] .flower-panel{margin-left:auto;margin-right:2%}
}
@media(min-width:761px) and (max-width:900px){
  .reference-layout .experience-network{order:1}
}
@media(max-width:760px){
  .reference-layout .experience-network{order:0;margin:0 0 18px}
  .reference-layout .flower-panel{order:1}
  .reference-layout .story-demo-pointer .pointer-arrow::after{content:'↑'}
}