/* Un unico dispositivo per servizio; stessa costruzione della hero. */
.service-device-stage { display:flex; position:relative; justify-content:center; align-items:center; min-width:0; aspect-ratio:1.25; perspective:1400px; text-decoration:none; isolation:isolate; }
.service-device-stage::after { content:""; position:absolute; width:75%; height:8%; bottom:8%; background:#19344e1c; border-radius:50%; filter:blur(17px); z-index:-1; }
.service-device-stage .device-laptop { position:relative; inset:auto; width:88%; transform:rotateY(-12deg) rotateZ(-3deg); }
.service-device-stage .laptop-display img { aspect-ratio:16/10; object-fit:cover; object-position:top; }
.device-tablet { display:block; width:92%; padding:16px 20px; border:2px solid #89939e; border-radius:24px; background:#171d25; position:relative; transform:rotateY(-13deg) rotateX(4deg) rotateZ(-4deg); box-shadow:6px 5px 0 #707b88,10px 9px 0 #333d48,16px 27px 28px -15px #18314f66; transition:transform .65s var(--ease); }
.device-tablet::before { content:""; position:absolute; top:calc(50% - 3px); left:7px; width:5px; height:5px; background:#536172; border-radius:50%; }
.tablet-display { display:block; overflow:hidden; border-radius:9px; }
.service-device-stage .tablet-display img { width:100%; aspect-ratio:1.4; object-fit:cover; object-position:top; }
.service-device-stage .device-phone { position:relative; inset:auto; width:43%; max-width:240px; padding:7px; border-radius:31px; transform:rotateY(-16deg) rotateZ(5deg); box-shadow:5px 2px 0 #586675,9px 5px 0 #222e3a,19px 23px 28px -13px #18314f70; }
.service-device-stage .phone-display { position:relative; aspect-ratio:9/19; border-radius:22px; background:#f1f5f9; }
.service-device-stage .phone-display img { position:absolute; width:340%; max-width:none; height:auto; aspect-ratio:auto; left:-63%; top:7%; }
.phone-camera { position:absolute; top:13px; left:42%; width:20%; height:9px; border-radius:8px; background:#151b22; }
.service-device-stage:focus-visible { outline:3px solid var(--blue); outline-offset:6px; border-radius:8px; }
@media (hover:hover) and (pointer:fine) {
 .service-device-stage:hover .device-laptop { transform:rotateY(-5deg) rotateZ(-1deg) translateY(-6px); }
 .service-device-stage:hover .device-tablet { transform:rotateY(-6deg) rotateX(2deg) rotateZ(-2deg) translateY(-6px); }
 .service-device-stage:hover .device-phone { transform:rotateY(-7deg) rotateZ(2deg) translateY(-6px); }
}
@media(max-width:760px) {
 .service-device-stage { width:100%; max-width:540px; margin:12px auto; }
 .service-device-stage .device-laptop { width:81%; }
 .device-tablet { padding:9px 13px; border-radius:17px; box-shadow:4px 3px 0 #707b88,7px 6px 0 #333d48,12px 20px 24px -14px #18314f66; }
 .device-tablet::before { left:4px; width:4px; height:4px; }
 .tablet-display { border-radius:6px; }
 .service-device-stage .device-phone { width:49%; padding:5px; border-radius:22px; }
 .service-device-stage .phone-display { border-radius:15px; }
 .phone-camera { top:9px; height:6px; }
}
@media(prefers-reduced-motion:reduce) { .service-device-stage * { transition:none!important; } }
html[data-motion="off"] .service-device-stage * { transition:none!important; }