.hs-demo{padding:22px 0!important;min-width:0}.demo-label{display:flex;justify-content:space-between;align-items:center;padding:0 13px 15px;font-size:10px;letter-spacing:1.4px;color:#21845c;font-weight:700}.demo-label small{letter-spacing:0;color:#7a887d;font-weight:400}.demo-window{background:#fff;border:1px solid #dce6dc;border-radius:20px;box-shadow:0 22px 65px #173f3515;overflow:hidden;transform:rotate(-1deg)}.demo-top{display:flex;justify-content:space-between;align-items:center;padding:19px 24px;background:#173f35;color:#d5efaf}.demo-top b{font-size:21px}.demo-top b span{font-size:13px;margin-left:10px;color:white}.demo-top>small{font-size:10px;color:#bed1c4}.demo-content{padding:27px}.demo-step{font-size:9px;letter-spacing:1.8px;font-weight:700;color:#63917b}.demo-title{font-size:26px;letter-spacing:-1px;margin:12px 0 9px;color:#173f35}.demo-caption{font-size:12px;color:#718176;line-height:1.7;margin:0 0 23px}.demo-stage{height:265px}.demo-client,.demo-payment,.demo-document{display:flex;align-items:center;gap:13px;border:1px solid #e1e9de;border-radius:13px;padding:17px}.demo-avatar{display:grid;place-items:center;width:43px;height:43px;border-radius:13px;background:#e7f1df;color:#286449;font-weight:700}.demo-stage b{font-size:13px}.demo-stage small{display:block;font-size:10px;color:#7a887d;margin-top:5px}.demo-check{margin-left:auto;color:#21845c}.demo-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:15px 0}.demo-fields>div{background:#f5f7f2;border-radius:12px;padding:18px 14px}.demo-fields small{margin:0 0 10px}.demo-fields strong{font-size:17px;letter-spacing:-.4px}.demo-fields .demo-mint{background:#e5f3dd}.demo-success{background:#edf7e8;color:#21845c;padding:14px;border-radius:10px;font-size:12px;animation:demo-enter .8s both}.demo-payment{background:#f7faf5}.demo-payment>span{font-size:27px;color:#21845c}.demo-payment>b{margin-left:auto;color:#21845c}.demo-chart{display:flex;gap:13px;align-items:flex-end;height:72px;margin-top:16px;padding:0 12px;border-bottom:1px solid #e1e9de}.demo-chart i{display:block;flex:1;height:var(--bar);background:#b9d4ad;border-radius:4px 4px 0 0;transform-origin:bottom;animation:demo-grow 1.2s both}.demo-chart i:last-child{background:#21845c}.demo-document>span{font-size:12px;background:#e7f1df;color:#286449;padding:15px 9px;border-radius:10px;font-weight:800}.demo-document>b{margin-left:auto;color:#21845c}.demo-transfer{text-align:center;color:#21845c;font-size:26px;margin:6px;animation:demo-enter 1s both}.demo-phone{width:80%;margin:auto;border:1px solid #cbdcc9;border-radius:17px;padding:17px;background:#f7faf5;animation:demo-enter .9s both}.demo-phone>small{font-size:8px;letter-spacing:1px}.demo-phone>b{display:block;margin:9px 0}.demo-phone>div{font-size:11px;background:#fff;padding:12px;border-radius:9px}.demo-phone span{float:right;color:#21845c}.demo-summary{text-align:center;padding:8px 0 18px}.demo-summary>span{display:grid;place-items:center;margin:0 auto 12px;width:50px;height:50px;background:#d5efaf;border-radius:50%;font-size:26px;animation:demo-enter .6s both}.demo-summary strong{display:block;font-size:24px;letter-spacing:-1px}.demo-summary p{font-size:11px;color:#718176;margin:12px 0}.demo-bottom{border-top:1px solid #edf1e9;padding:15px 24px;display:flex;align-items:center;justify-content:space-between}.demo-dots{display:flex;gap:7px}.demo-dots button{border:0;background:#dce7d7;width:24px;height:7px;padding:0;border-radius:5px;cursor:pointer}.demo-dots button[aria-current=step]{background:#21845c}.demo-pause{background:transparent;border:0;color:#607c69;font-size:11px;cursor:pointer;padding:8px}.demo-note{text-align:center;font-size:11px;color:#718176;margin-top:22px}.hs-demo button:focus-visible{outline:3px solid #46ad7c;outline-offset:4px}.demo-paused *{animation-play-state:paused!important}@keyframes demo-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes demo-grow{from{transform:scaleY(.1)}to{transform:scaleY(1)}}@media(max-width:700px){.demo-window{transform:none}.demo-content{padding:22px 17px}.demo-top{padding:17px}.demo-title{font-size:23px}.demo-stage{height:275px}.demo-fields strong{font-size:15px}.demo-top>small{font-size:9px}.demo-phone{width:90%}}@media(prefers-reduced-motion:reduce){.hs-demo *{animation:none!important}}

/* Her sahnede içerik adım adım canlanır. */
.demo-run[data-scene="0"] .demo-client{animation:hs-register .55s both}
.demo-run[data-scene="0"] .demo-fields>div:first-child{animation:hs-reveal .5s .35s both}
.demo-run[data-scene="0"] .demo-fields>div:last-child{animation:hs-reveal .5s .6s both}
.demo-run[data-scene="0"] .demo-success{animation:hs-confirm .55s 1s both}
.demo-run[data-scene="0"] .demo-check{animation:hs-confirm .4s 1s both}
.demo-run[data-scene="1"] .demo-payment{animation:hs-register .5s .4s both}
.demo-run[data-scene="1"] .demo-mint{animation:hs-paid 1.3s .3s both}
.demo-run[data-scene="1"] .demo-chart i{animation:demo-grow .85s .8s both}
.demo-run[data-scene="1"] .demo-chart i:nth-child(2){animation-delay:.9s}
.demo-run[data-scene="1"] .demo-chart i:nth-child(3){animation-delay:1s}
.demo-run[data-scene="1"] .demo-chart i:nth-child(4){animation-delay:1.1s}
.demo-run[data-scene="1"] .demo-chart i:nth-child(5){animation-delay:1.2s}
.demo-run[data-scene="1"] .demo-chart i:nth-child(6){animation-delay:1.3s}
.demo-run[data-scene="2"] .demo-document{animation:hs-register .5s both}
.demo-run[data-scene="2"] .demo-document>span{animation:hs-document-flight 1.2s .3s both;position:relative;z-index:2}
.demo-run[data-scene="2"] .demo-transfer{animation:hs-transfer 1.1s .45s both}
.demo-run[data-scene="2"] .demo-phone{animation:hs-reveal .55s .65s both}
.demo-run[data-scene="2"] .demo-phone>div{animation:hs-confirm .55s 1.3s both}
.demo-run[data-scene="3"] .demo-summary>span{animation:hs-confirm .6s both}
.demo-run[data-scene="3"] .demo-summary strong{animation:hs-reveal .5s .2s both}
.demo-run[data-scene="3"] .demo-fields>div{animation:hs-register .55s .5s both}
.demo-run[data-scene="3"] .demo-fields>div:last-child{animation-delay:.75s}
@keyframes hs-register{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:translateX(0)}}
@keyframes hs-reveal{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes hs-confirm{0%{opacity:0;transform:scale(.8)}70%{opacity:1;transform:scale(1.04)}100%{opacity:1;transform:scale(1)}}
@keyframes hs-paid{0%{background:#f5f7f2}60%{background:#c2e9ad}100%{background:#e5f3dd}}
@keyframes hs-document-flight{0%{transform:translate(0,0);opacity:1}55%{transform:translate(75px,95px) rotate(8deg);opacity:.8}80%{transform:translate(95px,120px) scale(.6);opacity:0}81%{transform:none;opacity:0}100%{transform:none;opacity:1}}
@keyframes hs-transfer{0%{opacity:0;transform:translateY(-12px)}45%{opacity:1}100%{opacity:0;transform:translateY(22px)}}
@media(prefers-reduced-motion:reduce){.hs-demo .demo-run *{animation:none!important}}
