/* D&S v11.3: original D&S website screenshots in realistic responsive devices.
   Static assets are supplied by website owner; no third-party creative art. */
.ds-vector-arrow{display:inline-block;vertical-align:-.14em;flex:none;margin-inline-start:.17em;color:inherit;stroke:currentColor;overflow:visible}
.ds-about-email .ds-vector-arrow{width:1em;height:1em}
.ds-has-devices{height:auto!important;max-height:none!important;min-height:clamp(440px,55vw,750px);border:1px solid rgba(240,242,236,.16);background:#0b0d0d;overflow:hidden;isolation:isolate}
.ds-device-visual{--device-surface:#0c0e0e;box-sizing:border-box;width:100%;min-height:clamp(440px,55vw,750px);position:relative;display:flex;align-items:center;justify-content:center;padding:clamp(45px,6vw,92px) clamp(32px,6vw,96px) clamp(80px,6vw,100px);background:radial-gradient(ellipse at 45% 45%,#292d2b,#111413 55%,#090c0a 100%);overflow:hidden}
.ds-device-visual::before{content:"";position:absolute;inset:8%;background:linear-gradient(115deg,transparent,rgba(225,244,143,.025),transparent);pointer-events:none}
.ds-device-environment{position:absolute;bottom:5%;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#444b42,transparent);opacity:.6}
.ds-device-monitor{width:min(100%,970px);position:relative;margin-right:clamp(18px,3vw,42px);z-index:1;filter:drop-shadow(0 26px 22px rgba(0,0,0,.55));min-width:0}
.ds-device-bezel{background:#181b19;padding:clamp(6px,1vw,12px);border:1px solid #5b625c;border-bottom-color:#292f2b;border-radius:clamp(8px,1.2vw,16px);box-shadow:inset 0 1px 2px #858983,0 12px 24px #060706}
.ds-device-screen{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#070909;border-radius:clamp(2px,.4vw,5px)}
.ds-device-screen img{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center!important;filter:none!important;transform:none!important;opacity:1!important}
.ds-device-stand{width:16%;height:clamp(20px,4vw,58px);margin:-2px auto 0;background:linear-gradient(90deg,#242827,#646c69 48%,#202522);clip-path:polygon(24% 0,76% 0,88% 100%,12% 100%);position:relative;z-index:-1}
.ds-device-foot{height:clamp(4px,.8vw,9px);width:27%;margin:0 auto;border-radius:60% 60% 3px 3px;background:linear-gradient(90deg,#191d1b,#8a928c 49%,#141714)}
.ds-device-phone{width:clamp(115px,18vw,230px);aspect-ratio:0.50;position:absolute;right:clamp(20px,3.5vw,70px);bottom:clamp(34px,5vw,80px);z-index:3;background:#111411;padding:clamp(5px,.65vw,9px);border:2px solid #545b54;border-radius:clamp(19px,2.7vw,34px);box-shadow:0 20px 35px rgba(0,0,0,.84),inset 0 1px 1px #8c958b;transform:rotate(3deg)}
.ds-device-phone-screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:clamp(14px,2vw,28px);background:#121414}
.ds-device-phone-screen img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:top center!important;max-width:none!important;filter:none!important;opacity:1!important}
.ds-device-phone-camera{height:clamp(8px,1.2vw,14px);width:35%;border-radius:0 0 11px 11px;background:#111411;position:absolute;z-index:4;top:clamp(3px,.5vw,6px);left:32.5%}
.ds-device-signature{position:absolute;bottom:18px;left:clamp(18px,3vw,50px);font:600 clamp(11px,1vw,15px)/1.4 Manrope,Arial,sans-serif;letter-spacing:.12em;color:#c0c8bd}
.ds-device-signature span{margin-left:14px;font:10px/1.3 'DM Mono',monospace;letter-spacing:.08em;color:#9ca59d}
/* Reuse the same visual in the homepage services preview, without enlarging the container. */
.service-screen:has(.ds-device-visual){background:#0a0c0b;overflow:hidden}
.ds-device-visual.is-compact{min-height:0;height:100%;padding:clamp(24px,3vw,46px) clamp(24px,3vw,50px) clamp(35px,3vw,56px)}
.ds-device-visual.is-compact .ds-device-monitor{max-width:760px;margin-right:10px}
.ds-device-visual.is-compact .ds-device-phone{width:clamp(72px,10vw,145px);right:4%;bottom:9%;padding:5px;border-width:1px;border-radius:18px}
.ds-device-visual.is-compact .ds-device-phone-screen{border-radius:13px}
.ds-device-visual.is-compact .ds-device-phone-camera{height:7px;top:3px}
.ds-device-visual.is-compact .ds-device-signature{font-size:10px;bottom:10px}
@media(max-width:760px){
 .ds-has-devices{min-height:380px}
 .ds-device-visual{min-height:380px;padding:40px 22px 100px}
 .ds-device-monitor{margin-right:0;width:100%}
 .ds-device-phone{width:clamp(106px,26vw,168px);right:4%;bottom:23px;border-radius:22px;transform:rotate(2deg)}
 .ds-device-phone-screen{border-radius:17px}
 .ds-device-signature{left:18px;bottom:19px;font-size:11px}
 .ds-device-signature span{font-size:8px;margin-left:7px}
 .ds-device-visual.is-compact{padding:18px 15px 55px}
 .ds-device-visual.is-compact .ds-device-phone{width:clamp(60px,19vw,105px);bottom:12%;right:4%}
}
@media(max-width:420px){
 .ds-device-visual{min-height:340px;padding:32px 12px 112px}
 .ds-device-phone{width:106px;right:4%;bottom:32px}
 .ds-device-stand{height:26px}.ds-device-foot{height:5px}
 .ds-device-signature{bottom:12px;left:13px;font-size:10px}
 .ds-device-signature span{display:none}
 .ds-device-visual.is-compact .ds-device-phone{width:68px}
}
@media(prefers-reduced-motion:reduce){.ds-device-visual *, .ds-vector-arrow{animation:none!important;transition:none!important}}
