/* A hand of service cards. Original blocks remain a regular grid without JavaScript. */
.services-section:has(.service-hand){background:radial-gradient(ellipse at 50% 65%,#e9dff2,transparent 65%),#faf8fd;padding-block:70px 55px}
.service-grid.service-hand{position:relative;display:block;height:calc(var(--hand-height,640px) + 200px);margin:0;isolation:isolate;overflow:clip}
.service-hand .service-card{position:absolute;left:50%;padding:40px 28px 28px;background:#713ca5;box-shadow:0 12px 28px #24183130,0 1px 4px #24183125;transform:translate(var(--card-x),var(--card-y)) rotate(var(--card-angle));z-index:var(--card-order);color:white;outline-offset:5px}
.service-hand .service-card h3{font-size:29px;line-height:1.13;font-weight:550;min-height:0;letter-spacing:-.025em;margin:0 0 22px;color:#fff;hyphens:auto;overflow-wrap:anywhere}
.service-hand .service-card p{font-size:16px;line-height:1.65;color:#fff;margin:0 0 18px}
.service-hand .service-card :is(strong,em){color:inherit}.service-hand .service-card strong{font-weight:650}
.service-hand .service-card .service-link{padding-top:20px;margin-top:auto;margin-bottom:0}
.service-hand .service-link a{display:inline-flex;padding:11px 18px;background:#fff;color:#403055;border-radius:999px;font-size:15px;text-decoration:none;box-shadow:0 4px 14px #0001}
.service-hand .service-link a:hover{background:#f1e8fa}.service-hand .service-link a:focus-visible{outline:3px solid #fff;outline-offset:5px}
.service-hand .service-spine{position:absolute;top:85px;left:24px;bottom:30px;writing-mode:vertical-rl;font-size:22px;font-weight:500;line-height:1.2;letter-spacing:-.025em;transition:opacity .16s;overflow:hidden}
.service-hand.has-selection .service-card:not(.is-active){transform:translate(var(--spread-x),var(--card-y)) rotate(var(--card-angle));clip-path:none}
.service-hand .service-card>:not(.service-spine){opacity:0;transition:opacity .16s}
.service-hand .service-card.is-active{z-index:30;transform:translate(var(--card-x),-40px) rotate(0);box-shadow:0 32px 65px #24183140,0 3px 10px #24183125}
.service-hand.has-selection .service-card.is-active{transform:translate(var(--spread-x),-40px) rotate(0);clip-path:none}
.service-hand .service-card.is-active>:not(.service-spine){opacity:1}
.service-hand .service-card.is-active .service-spine{opacity:0}
.service-hand .service-card:focus-visible{outline:3px solid #713ca5}
/* The established fan motion stays; visual treatment matches the violet Metro tiles. */
.service-hand .service-card{top:190px;width:280px;height:450px;min-height:0;margin-left:-140px;overflow:hidden;border:1px solid #ffffff30;border-radius:18px;transform-origin:50% 90%;transition:transform .38s cubic-bezier(.2,.8,.2,1),width .3s,height .3s,top .3s,margin-left .3s,box-shadow .3s}
.service-hand .service-spine{top:34px;left:22px;bottom:26px;font-size:19px;font-weight:500;z-index:2;text-shadow:none}
.service-hand .service-card.is-right .service-spine{left:auto;right:22px}
.service-hand .service-card.is-active{top:75px;width:var(--hand-width,365px);height:var(--hand-height,640px);margin-left:calc(var(--hand-width,365px)/-2);padding-top:40px}
.service-hand.is-measuring .service-card{width:var(--hand-width,365px);height:auto;min-height:0;transition:none}
.service-hand-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin:8px 0 0;color:#665d69;font-size:14px}
.service-hand-controls button{font:inherit;padding:11px 20px;border:1px solid #d9cbe5;border-radius:999px;background:#fff;color:#592b87;cursor:pointer}.service-hand-controls button:hover{background:#eee3f7}.service-hand-controls button:focus-visible{outline:3px solid #713ca5;outline-offset:3px}.service-hand-status{min-width:50px;text-align:center;font-variant-numeric:tabular-nums}
@media(max-width:1000px),(hover:none){
 .service-grid.service-hand{display:flex;height:auto;gap:16px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding:24px;padding:32px 24px 38px;margin-inline:-24px;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#bfa6d6 transparent;isolation:auto;align-items:stretch}
 .service-hand .service-card,.service-hand .service-card.is-active{position:relative;top:auto;left:auto;flex:0 0 min(350px,calc(100% - 24px));width:auto;height:auto;min-height:0;margin:0;padding:32px 25px 26px;transform:none;scroll-snap-align:start;box-shadow:0 12px 24px #24183120}
 .service-hand .service-card.is-active,.service-hand.has-selection .service-card.is-active,.service-hand.has-selection .service-card:not(.is-active){transform:none;clip-path:none;box-shadow:0 12px 24px #24183130}
 .service-hand .service-card>:not(.service-spine){opacity:1}.service-hand .service-spine{display:none}
 .service-hand .service-card h3{font-size:27px}.service-hand .service-card p{font-size:16px}
 .services-section:has(.service-hand){padding-block:30px 45px;overflow:hidden}
}
@media(prefers-reduced-motion:reduce){.service-hand .service-card,.service-hand .service-card>*{transition:none}}
