/* Book Demo landing: white hero + video box + animated sticky-note cards (ScaleCraft theme) */
.bdl-hero{position:relative;z-index:1;background:transparent;color:#101827;padding:64px 0 56px;text-align:center}
.bdl-in{max-width:860px}
.bdl-kicker{display:inline-block;font-size:12px;font-weight:900;letter-spacing:.2em;color:#168ec1;background:#fff;border:1px solid rgba(57,168,215,.5);border-radius:999px;padding:8px 16px;margin-bottom:22px}
.bdl-hero h1{font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.015em;font-size:clamp(40px,8vw,76px);line-height:1.02;margin:0 0 22px;color:#101827}
.bdl-hero h1 span{color:#39a8d7}
.bdl-sub{font-size:clamp(16px,2.2vw,20px);line-height:1.7;color:#485364;margin:0 auto 32px;max-width:720px}
.bdl-sub b{color:#101827}

/* video box */
.bdl-video{position:relative;aspect-ratio:16/9;width:100%;border-radius:16px;overflow:hidden;background:#0b1530;border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 60px rgba(16,24,39,.22);margin:0 auto}
.bdl-video iframe,.bdl-video video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;background:#000}
.bdl-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px;background:linear-gradient(145deg,#0d1f45,#0a1633)}
.bdl-ph::before{content:"";width:64px;height:64px;border-radius:50%;background:#ffd21f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%23101827'/%3E%3C/svg%3E") center/30px no-repeat;box-shadow:0 0 0 10px rgba(255,210,31,.14)}
.bdl-up{border:0;cursor:pointer;font:900 14px Inter,sans-serif;letter-spacing:.05em;padding:15px 24px;border-radius:8px;background:#39a8d7;color:#fff;box-shadow:0 12px 25px rgba(57,168,215,.28)}
.bdl-ph small{color:rgba(255,255,255,.6);font-size:13px}
.bdl-listen{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(78%,420px);display:flex;flex-direction:column;align-items:center;gap:14px;padding:26px 20px;border-radius:14px;background:rgba(8,28,64,.93);border:2px solid rgba(57,168,215,.65);color:#fff;font:inherit;cursor:pointer;box-shadow:0 14px 50px rgba(0,0,0,.5)}
.bdl-listen[hidden]{display:none}
.bdl-listen b{font-size:clamp(16px,3.4vw,24px);font-weight:700}
.bdl-listen svg{width:46px;height:46px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bdl-listen span{font-weight:700;font-size:clamp(15px,3vw,20px)}
.bdl-change{margin:12px 0 0;background:none;border:0;color:#6b7684;font:600 13px Inter,sans-serif;text-decoration:underline;cursor:pointer}
.bdl-change[hidden]{display:none}

/* CTA */
.bdl-cta{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;max-width:640px;margin:30px auto 0;padding:22px 24px;border-radius:14px;background:#ffd21f;color:#101827;font-weight:900;font-size:clamp(16px,3.4vw,21px);letter-spacing:.02em;text-decoration:none;box-shadow:0 14px 34px rgba(255,210,31,.3);transition:transform .2s,box-shadow .2s}
.bdl-cta:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(255,210,31,.4)}
.bdl-cta svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.bdl-trust{margin:16px 0 0;font-size:13px;letter-spacing:.06em;color:#5b6673}

/* ===== animated sticky-note cards ===== */
.bsn-wrap{position:relative;z-index:1;padding:70px 0 40px;overflow:hidden}
.bsn-head{text-align:center;padding:0 20px}
.bsn-k{font-size:12px;font-weight:900;letter-spacing:.2em;color:#168ec1}
.bsn-head h2{font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(38px,7vw,64px);line-height:1.02;margin:10px 0 0;color:#101827}
.bsn-head h2 span{color:#39a8d7}
.bsn-list{display:grid;gap:70px;max-width:760px;padding:54px 10px 20px}
.bsn{--rot:-2deg;--tint:#daf6fb;--tape:#38b6c6;--num:#1b97a7;--d:0s;position:relative;background:#fff;border-radius:30px;padding:13px;transform:rotate(var(--rot));box-shadow:0 26px 40px -22px rgba(20,35,50,.32),0 0 0 1px rgba(20,35,50,.05);transition:transform .5s cubic-bezier(.2,.9,.3,1.25),box-shadow .4s}
.bsn1{--rot:-2deg}
.bsn2{--rot:1.8deg;--tint:#fff2c4;--tape:#ffc61a;--num:#b88400;--d:.15s}
.bsn3{--rot:-1.4deg;--tint:#fde6f3;--tape:#f0488a;--num:#d6336f;--d:.3s}
.js .bsn{opacity:0;transform:translateY(110px) rotate(calc(var(--rot)*3)) scale(.88)}
.js .bsn.show{opacity:1;transform:rotate(var(--rot));transition:transform 1s cubic-bezier(.2,.9,.3,1.15) var(--d),opacity .6s ease var(--d),box-shadow .4s}
.js .bsn.show.settled{transition:transform .5s cubic-bezier(.2,.9,.3,1.25),box-shadow .4s}
.bsn.settled:hover{transform:rotate(0deg) translateY(-10px) scale(1.025);box-shadow:0 40px 60px -24px color-mix(in srgb,var(--tape) 60%,transparent),0 0 0 1px rgba(20,35,50,.06)}
.bsn-tape{position:absolute;z-index:2;top:-30px;left:50%;margin-left:-30px;width:60px;height:70px;background:var(--tape);opacity:.92;transform:rotate(-5deg);transform-origin:50% 100%;clip-path:polygon(0 4%,12% 0,26% 5%,42% 1%,58% 5%,74% 0,88% 4%,100% 1%,100% 97%,88% 100%,72% 96%,56% 100%,40% 96%,24% 100%,10% 96%,0 100%);filter:drop-shadow(0 3px 3px rgba(0,0,0,.14))}
.bsn2 .bsn-tape{margin-left:-50px;transform:rotate(4deg)}
.bsn3 .bsn-tape{margin-left:10px;transform:rotate(-3deg)}
.bsn:hover .bsn-tape{animation:bsnWiggle .7s ease}
@keyframes bsnWiggle{0%,100%{rotate:0deg}25%{rotate:9deg}60%{rotate:-7deg}}
.bsn-in{position:relative;overflow:hidden;background:var(--tint);border-radius:20px;padding:26px 26px 30px;animation:bsnFloat 6s ease-in-out infinite alternate;animation-delay:var(--d)}
.bsn-in::after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-80px;bottom:-90px;background:radial-gradient(circle,rgba(255,255,255,.7),rgba(255,255,255,0) 70%);transition:transform .6s;pointer-events:none}
.bsn:hover .bsn-in::after{transform:scale(1.6)}
@keyframes bsnFloat{from{transform:translateY(0)}to{transform:translateY(-5px)}}
.bsn-top{position:relative;display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;margin-bottom:20px;border-bottom:1px dashed rgba(16,24,39,.25)}
.bsn-top span{font:500 15px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.14em;color:var(--num);transition:letter-spacing .4s}
.bsn:hover .bsn-top span{letter-spacing:.22em}
.bsn-top em{font-style:normal;font-family:Anton,Impact,sans-serif;font-size:44px;line-height:1;color:var(--num);opacity:.35;transition:transform .4s,opacity .4s}
.bsn:hover .bsn-top em{transform:scale(1.15);opacity:.55}
.bsn h3{position:relative;font-family:Poppins,Inter,sans-serif;font-size:clamp(23px,4.2vw,30px);line-height:1.2;margin:0 0 14px;color:#0b0f17}
.bsn p{position:relative;font-size:clamp(15px,2.3vw,17px);line-height:1.7;margin:0 0 12px;color:rgba(16,24,39,.78)}
.bsn p b{color:#0b0f17}
.bsn-track{position:relative;display:grid;grid-template-columns:repeat(3,1fr);margin-top:22px;padding-top:22px;border-top:1px dashed rgba(16,24,39,.25)}
.bsn-track div{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.bsn-track div:not(:last-child)::after{content:"";position:absolute;top:11px;left:calc(50% + 16px);right:calc(-50% + 16px);height:2px;background:rgba(16,24,39,.25)}
.bsn-track i{width:22px;height:22px;border-radius:50%;border:2px solid rgba(16,24,39,.5);background:var(--tint);position:relative;z-index:1;animation:bsnDot 4.5s ease-in-out infinite}
.bsn-track div:nth-child(2) i{animation-delay:1.5s}
.bsn-track div:nth-child(3) i{animation-delay:3s}
@keyframes bsnDot{0%,55%,100%{background:var(--tint);border-color:rgba(16,24,39,.5);transform:scale(1)}10%,40%{background:#101827;border-color:#101827;transform:scale(1.25)}}
.bsn-track small{font-size:12px;letter-spacing:.06em;color:rgba(16,24,39,.7)}
@media(max-width:560px){.bsn-list{gap:60px}.bsn-in{padding:22px 18px 24px}}
@media(prefers-reduced-motion:reduce){.bsn,.bsn-in,.bsn-track i,.bsn-tape{animation:none!important;transition:none!important}.js .bsn{opacity:1;transform:rotate(var(--rot))}}

/* form heading */
.bdl-formhead{padding:60px 0 0!important;text-align:center}
.bdl-formhead h2{font-family:Anton,Impact,sans-serif;font-weight:400;font-size:clamp(40px,7vw,64px);margin:0}
.bdl-formhead h2 span{color:#39a8d7}
@media(max-width:700px){.bdl-hero{padding:44px 0 40px}.bdl-in .bdl-sub{font-size:16px}}
