/* Scoped to the two requested sections. Three visible cards ensure Services slides. */
#services .service-grid{display:flex;gap:30px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth}
#services .service-card{flex:0 0 calc((100% - 60px)/3);min-width:0;scroll-snap-align:start}
#services .carousel-controls{display:flex;flex-direction:row;gap:12px}
#services .service-nav-button{width:48px;height:48px;min-width:48px;border:1px solid #d5dede;background:#fff;color:#263636;border-radius:50%;display:grid;place-items:center;padding:12px;box-shadow:0 3px 10px #00000005;transition:background .25s,color .25s,border-color .25s,box-shadow .25s}
#services .service-nav-button svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#services [data-carousel-prev] svg{transform:rotate(180deg)}
#services .service-nav-button:hover{background:var(--teal);border-color:var(--teal);color:#153a3a;box-shadow:0 4px 14px #b0101a2b}
.showcase.video-showcase{aspect-ratio:16/9;height:auto;background:#171717;position:relative;overflow:hidden}
.video-showcase video{display:block;width:100%;height:100%;object-fit:contain}
.video-play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:84px;height:84px;border:1px solid #ffffff90;border-radius:50%;display:grid;place-items:center;color:#fff;background:#b0101a;box-shadow:0 0 0 12px #ffffff28,0 8px 30px #0003;padding:24px;transition:background .25s,box-shadow .25s}
.video-play-button[hidden]{display:none}
.video-play-button svg{width:32px;height:32px;fill:currentColor;margin-left:2px}
.video-play-button:hover{background:#031e4d;box-shadow:0 0 0 17px #ffffff24,0 8px 30px #0003}
.video-status{position:absolute;bottom:10px;left:20px;right:20px;color:white;background:#222d;padding:8px 12px;font-size:13px;margin:0}
.video-status:empty{display:none}
@media(max-width:1199px){#services .service-card{flex-basis:calc((100% - 30px)/2)}}
@media(max-width:640px){#services .service-grid{gap:18px}#services .service-card{flex-basis:88%}#services .carousel-controls{gap:9px}#services .service-nav-button{width:40px;height:40px;min-width:40px;padding:9px}#services .service-nav-button svg{width:20px;height:20px}.video-play-button{width:60px;height:60px;padding:15px;box-shadow:0 0 0 8px #ffffff28}.video-play-button svg{width:26px;height:26px}}
@media(prefers-reduced-motion:reduce){#services .service-grid{scroll-behavior:auto}#services .service-nav-button,.video-play-button{transition:none}}

/* Keep the two controls visibly separate at every breakpoint. */
#services .carousel-controls{display:flex!important;align-items:center;gap:16px!important;margin-left:auto}
#services .service-nav-button + .service-nav-button{margin-left:0}
