.bt{--ink:#111820;position:relative;isolation:isolate;overflow:hidden;min-height:950px;padding:112px 24px 68px;background:radial-gradient(ellipse at 50% 35%,#fff 0 34%,#f2f4f6 100%);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;text-align:center}
.bt *{box-sizing:border-box}.bt button{font:inherit}.bt-flow{position:absolute;z-index:-2;pointer-events:none;width:125%;height:540px;left:-12%;border:55px solid rgba(255,255,255,.82);border-radius:50%;filter:drop-shadow(0 6px 23px rgba(137,149,164,.13));transform:rotate(12deg)}.bt-flow-one{top:150px}.bt-flow-two{top:620px;left:-8%;height:330px;transform:rotate(-13deg)}
.bt-orb{position:absolute;z-index:-1;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle at 32% 24%,#fff,rgba(255,255,255,.34) 34%,rgba(172,183,194,.25) 76%,#fff);box-shadow:inset 10px 11px 17px #fff,inset -10px -13px 20px rgba(151,164,178,.2),0 16px 38px rgba(74,91,112,.1)}.bt-orb-one{top:260px;left:7%}.bt-orb-two{right:5%;bottom:150px;width:105px;height:105px}
.bt-heading{position:relative;z-index:3;max-width:880px;margin:auto}.bt-eyebrow{margin:0 0 12px;color:#707784;font-size:12px;font-weight:600;letter-spacing:.3em}.bt-heading h2{margin:0;font-family:'Playfair Display',Georgia,serif;font-size:clamp(42px,4.4vw,66px);font-weight:500;line-height:1.08;letter-spacing:-.045em}.bt-intro{margin:15px 0 0;color:#717986;font-size:clamp(16px,1.35vw,21px)}
.bt-device-switch{display:inline-flex;gap:4px;margin:20px auto 22px;padding:5px;border:1px solid rgba(195,204,214,.85);border-radius:999px;background:rgba(255,255,255,.77);box-shadow:0 9px 25px rgba(27,47,76,.07);backdrop-filter:blur(12px)}.bt-device-option{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:110px;min-height:42px;padding:7px 16px;border:0;border-radius:999px;background:transparent;color:#687587;font-size:13px;font-weight:600;cursor:pointer;transition:.2s}.bt-device-option svg{width:20px;height:20px}.bt-device-option.is-active{background:#111820;color:#fff;box-shadow:0 4px 12px rgba(17,24,32,.17)}
.bt-viewport,.bt-track{direction:ltr}
.bt-viewport{-webkit-user-select:none}.bt-viewport:active,.bt.is-dragging .bt-viewport{cursor:grabbing}.bt-track{transition-duration:.48s;transition-timing-function:cubic-bezier(.22,.82,.3,1)}.bt.is-dragging .bt-track{transition:none!important}.bt-slide a,.bt-slide img{-webkit-user-drag:none}.bt-slide img{pointer-events:none}
.bt-stage{position:relative;display:flex;align-items:center;justify-content:center;height:570px;max-width:1380px;margin:30px auto 0}.bt-device-frame{position:relative;z-index:4;width:278px;height:540px;outline:none;transition:width .42s ease,height .42s ease}.bt-device-frame:focus-visible{outline:3px solid #3183e7;outline-offset:8px;border-radius:42px}.bt-device-bezel{position:absolute;inset:0;padding:11px;border:5px solid #171b20;border-radius:45px;background:#11151a;box-shadow:inset 0 0 0 2px #858b91,0 25px 48px rgba(14,25,39,.23)}.bt-device-bezel:before{content:'';position:absolute;inset:-8px;border:2px solid #9ba1a8;border-radius:49px;pointer-events:none}.bt-camera{position:absolute;z-index:3;top:14px;left:50%;width:78px;height:21px;transform:translateX(-50%);border-radius:18px;background:#090b0e;box-shadow:inset -12px 0 #14171c}.bt-camera:after{content:'';position:absolute;right:9px;top:7px;width:6px;height:6px;border-radius:50%;background:#17304a}.bt-viewport{width:100%;height:100%;overflow:hidden;border-radius:31px;background:#eceff2;touch-action:pan-y;cursor:grab;user-select:none}.bt-viewport:active{cursor:grabbing}.bt-track{display:flex;width:100%;height:100%;will-change:transform;transition-property:transform;transition-timing-function:cubic-bezier(.22,.75,.25,1)}.bt-slide{flex:0 0 100%;width:100%;height:100%;overflow:hidden;background:#fff}.bt-slide a,.bt-slide img{display:block;width:100%;height:100%}.bt-slide img{object-fit:cover;object-position:top center}.bt-laptop-base{display:none}
.bt-peek{position:absolute;z-index:1;top:70px;width:310px;height:410px;overflow:hidden;border:1px solid rgba(183,194,206,.72);border-radius:22px;background:#fff;box-shadow:0 22px 48px rgba(34,49,69,.12);opacity:.5;filter:saturate(.72)}.bt-peek img{width:100%;height:100%;object-fit:cover;object-position:top}.bt-peek-prev{right:calc(50% + 210px);transform:perspective(900px) rotateY(10deg) rotate(-2deg)}.bt-peek-next{left:calc(50% + 210px);transform:perspective(900px) rotateY(-10deg) rotate(2deg)}
.bt-arrow{position:absolute;z-index:7;top:50%;display:grid;place-items:center;width:58px;height:58px;transform:translateY(-50%);border:1px solid #d8dde3;border-radius:50%;background:rgba(255,255,255,.93);box-shadow:0 11px 25px rgba(34,48,67,.09);cursor:pointer}.bt-arrow-prev{right:calc(50% + 560px)}.bt-arrow-next{left:calc(50% + 560px)}.bt-arrow svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.bt[dir=rtl] .bt-arrow svg{transform:rotate(180deg)}
.bt-project-copy{position:relative;z-index:4;max-width:660px;min-height:150px;margin:2px auto 0}.bt-project-category{display:inline-flex;padding:5px 13px;border:1px solid #d7dce2;border-radius:999px;background:rgba(255,255,255,.8);color:#586171;font-size:12px}.bt-project-copy h3{margin:9px 0 6px;font-family:'Playfair Display',Georgia,serif;font-size:34px;font-weight:500;letter-spacing:-.035em}.bt-project-copy p{margin:0 auto;color:#707987;font-size:15px;line-height:1.55}.bt-project-link{display:inline-flex;align-items:center;gap:7px;margin-top:14px;padding-bottom:4px;border-bottom:1px solid #aeb6c0;color:#17202b;font-size:14px;text-decoration:none}.bt[dir=rtl] .bt-project-copy h3{font-family:'Segoe UI',Tahoma,Arial,sans-serif;letter-spacing:0}
.bt-footer{position:relative;z-index:4;display:flex;align-items:center;justify-content:center;gap:26px;margin-top:6px}.bt-pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;max-width:300px}.bt-pagination button{width:9px;height:9px;padding:0;border:1px solid #111820;border-radius:50%;background:transparent;cursor:pointer}.bt-pagination button[aria-current=true]{background:#111820}.bt-count{min-width:55px;color:#737c89;font-size:13px;direction:ltr}.bt-swipe-caption{position:relative;z-index:4;margin:11px 0 0;color:#858d98;font-size:13px}
.bt[data-device=laptop] .bt-stage{height:500px}.bt[data-device=laptop] .bt-device-frame{width:min(760px,calc(100vw - 110px));height:auto;aspect-ratio:16/10}.bt[data-device=laptop] .bt-device-bezel{inset:0 0 24px;padding:10px;border-width:9px;border-radius:18px 18px 8px 8px}.bt[data-device=laptop] .bt-device-bezel:before{inset:-11px;border-radius:21px 21px 10px 10px}.bt[data-device=laptop] .bt-camera{top:3px;width:8px;height:8px}.bt[data-device=laptop] .bt-camera:after{display:none}.bt[data-device=laptop] .bt-viewport{border-radius:3px}.bt[data-device=laptop] .bt-laptop-base{position:absolute;z-index:5;bottom:0;left:-5%;display:block;width:110%;height:25px;border:1px solid #abb2ba;border-radius:3px 3px 27px 27px;background:linear-gradient(#f4f5f6,#aeb5bc 46%,#f1f3f5 75%,#8e969e);box-shadow:0 13px 20px rgba(34,47,65,.16)}.bt[data-device=laptop] .bt-laptop-base:after{content:'';position:absolute;left:42%;width:16%;height:5px;border-radius:0 0 7px 7px;background:#8f969d}.bt[data-device=laptop] .bt-peek{top:100px;width:290px;height:270px}.bt[data-device=laptop] .bt-peek-prev{right:calc(50% + 410px)}.bt[data-device=laptop] .bt-peek-next{left:calc(50% + 410px)}
.bt-device-option:focus-visible,.bt-arrow:focus-visible,.bt-pagination button:focus-visible,.bt-project-link:focus-visible{outline:3px solid #3183e7;outline-offset:3px}
@media(max-width:900px){.bt-peek{opacity:.28}.bt-arrow-prev{right:calc(50% + 220px)}.bt-arrow-next{left:calc(50% + 220px)}.bt[data-device=laptop] .bt-peek{display:none}}
@media(max-width:700px){.bt{min-height:0;padding:76px 20px 46px}.bt-flow{width:160%;left:-30%;border-width:36px}.bt-heading h2{font-size:clamp(36px,10vw,46px)}.bt-eyebrow{font-size:10px;letter-spacing:.2em}.bt-intro{font-size:15px;line-height:1.55}.bt-device-switch{margin:17px auto 18px}.bt-device-option{min-width:100px;min-height:40px;padding-inline:12px}.bt-stage{height:500px;margin-top:20px}.bt-device-frame{width:248px;height:480px}.bt-device-bezel{padding:9px;border-width:4px;border-radius:39px}.bt-device-bezel:before{inset:-7px;border-width:1px;border-radius:43px}.bt-viewport{border-radius:29px}.bt-camera{top:12px;width:68px;height:18px}.bt-peek{display:none}.bt-arrow{top:auto;bottom:8px;width:42px;height:42px;transform:none}.bt-arrow-prev{right:auto;left:calc(50% - 158px)}.bt-arrow-next{left:auto;right:calc(50% - 158px)}.bt-project-copy{min-height:165px;margin-top:8px}.bt-project-copy h3{font-size:29px}.bt-project-copy p{font-size:14px}.bt-footer{gap:15px}.bt-pagination{max-width:220px;gap:8px}.bt[data-device=laptop] .bt-stage{height:285px;margin-top:32px}.bt[data-device=laptop] .bt-device-frame{width:min(350px,calc(100vw - 34px))}.bt[data-device=laptop] .bt-device-bezel{inset:0 0 12px;padding:6px;border-width:5px;border-radius:11px 11px 5px 5px}.bt[data-device=laptop] .bt-device-bezel:before{inset:-6px;border-width:1px;border-radius:13px 13px 7px 7px}.bt[data-device=laptop] .bt-laptop-base{height:13px;border-radius:2px 2px 15px 15px}.bt[data-device=laptop] .bt-laptop-base:after{height:3px}.bt[data-device=laptop] .bt-camera{top:2px;width:5px;height:5px}.bt[data-device=laptop] .bt-arrow{bottom:-2px}.bt-orb-one{left:-60px}.bt-orb-two{right:-55px}.bt[dir=rtl] .bt-project-copy p{line-height:1.8}}
@media(prefers-reduced-motion:reduce){.bt-device-frame,.bt-device-option,.bt-track{transition:none!important}}

@media(max-width:700px){
    .bt{width:100%;max-width:100vw;padding:64px 16px 44px;overflow:hidden}
    .bt-heading{width:100%;max-width:520px;padding-inline:2px}
    .bt-heading h2{max-width:12ch;margin-inline:auto;font-size:clamp(33px,9.5vw,43px);line-height:1.08;overflow-wrap:anywhere}
    .bt-intro{max-width:31ch;margin:14px auto 0}
    .bt-device-switch{width:min(100%,236px)}
    .bt-device-option{flex:1;min-width:0;padding-inline:8px}
    .bt-stage{width:100%;max-width:360px;height:472px}
    .bt-device-frame{width:min(238px,calc(100vw - 92px));height:460px}
    .bt-arrow-prev{left:2px}
    .bt-arrow-next{right:2px}
    .bt-project-copy{width:100%;min-height:0;padding-inline:4px;margin-top:16px}
    .bt-project-copy h3{overflow-wrap:anywhere}
    .bt-footer{margin-top:20px;flex-wrap:wrap}
    .bt[data-device=laptop] .bt-stage{width:100%;max-width:390px;height:275px}
    .bt[data-device=laptop] .bt-device-frame{width:min(100%,350px)}
}

@media(max-width:360px){
    .bt{padding-inline:12px}
    .bt-heading h2{font-size:32px}
    .bt-stage{height:440px}
    .bt-device-frame{width:220px;height:426px}
    .bt-device-option{font-size:12px}
}

/* Keep carousel controls reachable on desktop and compact laptop widths. */
@media(min-width:701px){
    .bt-arrow-prev{
        right:auto;
        left:clamp(18px,5vw,82px);
    }
    .bt-arrow-next{
        right:clamp(18px,5vw,82px);
        left:auto;
    }
}