.experience{padding-top:25px;padding-bottom:75px}.experience-body{display:grid;grid-template-columns:.72fr 1.28fr;gap:40px;align-items:center}.experience-controls{padding:14px 0}.tour-tabs{display:flex;flex-direction:column;gap:10px}.tour-tabs>button{display:flex;align-items:center;gap:16px;text-align:left;color:var(--muted);background:none;border:1px solid transparent;border-radius:10px;padding:13px 17px;width:100%}.tour-tabs>button>span{width:34px;height:34px;border:1px solid #c2cce0;border-radius:50%;display:grid;place-items:center;font-size:14px;flex-shrink:0}.tour-tabs b{display:block;font-size:18px;letter-spacing:-.5px}.tour-tabs small{font-size:12px}.tour-tabs>button[aria-selected=true]{background:var(--pale);border-color:#c5d2f3;color:var(--ink)}.tour-tabs>button[aria-selected=true]>span{color:white;background:var(--blue);border-color:var(--blue)}.tour-status{font-size:13px;color:var(--muted);min-height:44px;margin:20px 17px 5px;max-width:310px}.tour-reset{border:0;background:none;color:var(--blue);font-size:12px;padding:7px 17px}.tour-reset>span:first-child{font-size:19px;vertical-align:middle}.tour-note{font-size:10px;color:var(--muted);margin:12px 17px 0;max-width:310px}.tour-stage{min-width:0;position:relative;min-height:440px;border-radius:24px;background:#f7f9fd;border:1px solid #e6ebf5;overflow:hidden}.tour-connector{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.tour-connector path{stroke-dasharray:1400;stroke-dashoffset:1400}.tour-stage.is-seen .tour-connector path{animation:draw-connection 1.6s ease-out both}.tour-panel{position:relative;min-height:440px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;gap:12px}.tour-panel[hidden]{display:none}.qr-drawing{width:100%;max-width:520px}.qr-drawing svg{display:block;width:100%;height:auto}.tour-action{font-size:13px;padding:11px 19px;position:relative;z-index:2;min-width:170px}.tour-panel.is-playing .scan-bar{animation:scan-once 1.25s ease-in-out both}.tour-toast{position:absolute;top:235px;left:50%;transform:translateX(-50%);padding:10px 15px;border:1.5px solid #8cb394;background:white;border-radius:8px;font-size:12px;white-space:nowrap;box-shadow:0 6px 18px #203b2810}.tour-toast[hidden]{display:none}.tour-toast>span{background:#d4edc4;border-radius:50%;display:inline-grid;place-items:center;width:23px;height:23px;margin-right:8px;color:#2e6236}.tour-panel.is-playing .tour-toast{animation:toast-in .4s .7s both}.loyalty-illustration{position:relative;padding:17px 35px 22px;width:100%;max-width:455px}.drawn-card{border:2px solid var(--ink);border-radius:17px;background:#fff;transform:rotate(-3deg);padding:22px 25px;box-shadow:7px 8px 0 #dce6fa}.drawn-card-brand{display:flex;gap:10px;align-items:center;font-size:11px}.drawn-card-brand>span:last-child{margin-left:auto;font-size:24px;color:var(--blue)}.drawn-card h3{font-size:24px;margin:18px 0;letter-spacing:-1px}.tour-stamps{display:flex;justify-content:space-between;gap:8px}.tour-stamps i{width:42px;height:42px;border:1.5px solid #7ca76d;background:var(--sage);border-radius:50%;display:grid;place-items:center;color:#3f6a35;font-style:normal;font-size:24px}.tour-stamps i.last-stamp{background:white;border:1.5px dashed #9eabc0;color:#c7cfdb}.tour-stamps i.last-stamp.filled{border-style:solid;border-color:#7ca76d;background:var(--sage);color:#3f6a35}.tour-panel.is-playing .last-stamp.filled{animation:stamp-in .45s cubic-bezier(.2,.9,.3,1.3) both}.card-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:18px;color:var(--muted);font-size:11px}.reward-seal{position:absolute;right:0;bottom:17px;transform:rotate(5deg);background:#fff0dd;border:1.5px solid #b78d42;border-radius:8px;padding:10px 13px;font-size:12px;color:#735320}.reward-seal[hidden]{display:none}.reward-seal>span{font-size:22px;margin-right:8px}.tour-panel.is-playing .reward-seal{animation:toast-in .45s .35s both}.drawn-chat{width:100%;max-width:405px;background:white;border:2px solid var(--ink);border-radius:19px;overflow:hidden;box-shadow:6px 7px 0 #dce6fa}.drawn-chat-head{display:flex;align-items:center;gap:9px;padding:12px 16px;background:#f8fbf5;border-bottom:1px solid #e3e9df}.drawn-chat-head b{font-size:13px;display:block}.drawn-chat-head small{display:block;color:var(--muted);font-size:9px}.drawn-chat-head>span{margin-left:auto;font-size:12px}.drawn-chat-body{min-height:256px;padding:18px;display:flex;flex-direction:column;gap:9px;background:#f6f5ef}.tour-bubble{max-width:86%;margin:0;padding:9px 12px;border-radius:8px;font-size:11px;line-height:1.5;box-shadow:0 1px 1px #14233e0a}.tour-bubble.out{background:#d9edce;align-self:flex-end}.tour-bubble.in{background:white;align-self:flex-start}.tour-bubble[hidden],.tour-appointment[hidden]{display:none}.tour-appointment{padding:10px 12px;border:1px solid #b3c4a8;border-radius:8px;display:flex;align-items:center;gap:11px;color:#365834;background:white}.tour-appointment b{display:block;font-size:11px}.tour-appointment span{font-size:10px}.tour-panel.is-playing .tour-response{animation:toast-in .4s .25s both}.tour-panel.is-playing .tour-confirm{animation:toast-in .4s .8s both}.tour-panel.is-playing .tour-appointment{animation:toast-in .4s 1.35s both}.feature-stories{padding-top:15px;padding-bottom:65px}.feature-story-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px 42px}.feature-story{border-top:1px solid var(--line);padding:8px 0 15px;min-width:0}.feature-story h3{font-size:24px;margin:10px 0 9px}.feature-story>p{max-width:440px;color:var(--muted);font-size:14px;margin:0}.memory-drawing,.campaign-drawing,.branch-drawing,.consent-drawing{height:190px;position:relative;display:flex;align-items:center;justify-content:center}.memory-drawing svg,.branch-drawing svg,.consent-drawing svg{height:180px;max-width:100%;width:400px}.memory-name{position:absolute;top:136px;left:calc(50% - 110px);font-size:11px;font-weight:bold}.memory-note{position:absolute;top:20px;right:20px;font-size:11px;color:var(--muted)}.campaign-drawing{gap:22px}.campaign-paper{border:1.5px solid var(--ink);border-radius:10px;padding:18px 23px;width:285px;transform:rotate(2deg);background:#f3f8ef;box-shadow:5px 5px 0 #e6eddf}.campaign-paper>span{font-size:13px;font-weight:bold}.campaign-paper>small{display:block;font-size:10px;color:var(--muted);margin-top:11px}#campaign-stamps{display:flex;gap:8px;margin-top:14px}#campaign-stamps>span{border:1px solid #7ca76d;background:var(--sage);color:#3f6a35;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;font-size:18px;flex-shrink:0}#campaign-stamps>span:last-child{background:white;border-style:dashed;color:#b6c3ae}.campaign-options{display:flex;flex-direction:column;gap:7px}.campaign-options button{background:white;border:1px solid var(--line);border-radius:50%;width:30px;height:30px;color:var(--muted);font-size:12px}.campaign-options button[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:white}@keyframes draw-connection{to{stroke-dashoffset:0}}@keyframes scan-once{0%,100%{transform:translateY(0)}50%{transform:translateY(35px)}}@keyframes toast-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}@keyframes stamp-in{from{opacity:0;transform:scale(1.5) rotate(15deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@media(max-width:1000px){.experience-body{grid-template-columns:.85fr 1.15fr;gap:20px}.tour-panel{padding:20px 15px}.tour-tabs b{font-size:16px}.tour-tabs>button{padding:12px 10px}.tour-panel,.tour-stage{min-height:410px}.loyalty-illustration{padding-left:12px;padding-right:12px}.drawn-card{padding:18px}.tour-stamps i{width:36px;height:36px;font-size:21px}.reward-seal{right:0}.feature-story-grid{gap:25px}.campaign-drawing{gap:14px}.campaign-paper{padding:17px;width:260px}}
@media(max-width:800px){.experience-body{grid-template-columns:1fr}.experience-controls{display:grid;grid-template-columns:1fr auto;gap:0}.tour-tabs{grid-column:1/-1;flex-direction:row;gap:7px}.tour-tabs>button{align-items:flex-start;padding:12px;gap:9px;border-color:var(--line);min-width:0}.tour-tabs b{font-size:14px;line-height:1.4}.tour-tabs small{font-size:10px;line-height:1.5;display:block}.tour-tabs>button>span{width:25px;height:25px;font-size:12px}.tour-status{grid-row:2;margin:15px 0 0;min-height:36px;max-width:none;font-size:12px}.tour-reset{grid-row:2;padding:10px 0 0 14px;align-self:start}.tour-note{grid-column:1/-1;margin:7px 0 0;max-width:none}.tour-panel,.tour-stage{min-height:430px}.feature-story h3{font-size:21px}.feature-story>p{font-size:13px}.campaign-paper{width:225px;padding:14px}.campaign-drawing{gap:10px}#campaign-stamps{gap:5px}#campaign-stamps>span{width:25px;height:25px}.memory-note{font-size:9px;right:8px}}
@media(max-width:540px){.experience{padding-top:15px;padding-bottom:40px}.tour-tabs>button{padding:9px 8px;flex-direction:column;gap:7px;border-radius:8px}.tour-tabs b{font-size:12px;line-height:1.35}.tour-tabs small{font-size:9px;margin-top:4px}.tour-tabs>button>span{width:23px;height:23px;font-size:11px}.tour-status{font-size:11px}.tour-reset{font-size:10px}.tour-note{font-size:9px}.experience-body{gap:12px}.tour-stage{border-radius:17px}.tour-panel,.tour-stage{min-height:370px}.tour-panel{padding:20px 12px;gap:17px}.tour-toast{top:186px;font-size:11px;padding:8px 11px}.tour-action{font-size:12px;min-width:160px}.drawn-card h3{font-size:22px}.drawn-card-brand{font-size:9px;gap:6px}.drawn-card-brand img{width:24px;height:24px}.drawn-card{padding:17px}.loyalty-illustration{padding:7px 8px 20px}.tour-stamps{gap:5px}.tour-stamps i{width:34px;height:34px;font-size:21px}.reward-seal{font-size:10px;padding:8px;bottom:6px}.reward-seal>span{font-size:18px;margin-right:5px}.drawn-chat-body{padding:13px;min-height:256px}.drawn-chat-head{padding:11px 13px}.tour-bubble{font-size:10px;max-width:94%}.tour-appointment b{font-size:10px}.feature-stories{padding-top:5px;padding-bottom:35px}.feature-story-grid{grid-template-columns:1fr;gap:12px}.feature-story h3{font-size:22px}.feature-story>p{font-size:13px}.memory-drawing,.campaign-drawing,.branch-drawing,.consent-drawing{height:175px}.feature-story{padding-bottom:16px}.campaign-paper{width:260px;padding:18px}#campaign-stamps{gap:7px}#campaign-stamps>span{width:27px;height:27px}.memory-note{top:12px;right:8px;font-size:10px}.memory-name{top:128px}.campaign-options button{width:29px;height:29px}}
@media(prefers-reduced-motion:reduce){html:not([data-motion=on]) .experience *,html:not([data-motion=on]) .feature-stories *{animation:none!important;transition:none!important}html:not([data-motion=on]) .tour-connector path{stroke-dashoffset:0}}

html[data-motion=off] .experience *,html[data-motion=off] .feature-stories *{animation:none!important;transition:none!important}