#services{display:block!important;padding:64px 0 70px!important;background:#4e666b;overflow:hidden;color:#f3eee5}
#services .services-intro{display:flex!important;aspect-ratio:auto!important;background:none!important;gap:48px;padding:0 5vw 40px!important;width:100%;justify-content:space-between;align-items:start}
#services .services-intro:before{display:none!important}#services .services-intro h2{color:#f3eee5;font-size:clamp(42px,5vw,68px)!important;margin:0!important;line-height:1.05}#services .services-intro p{max-width:490px;color:#e2e8e5;font-size:13px!important;line-height:1.7;margin:0!important}#services .section-kicker{color:#c5d7d9;margin-bottom:18px}
#services .square-stage{position:relative;height:560px;width:100%;margin:0;--big:440px;--small:290px;--shift:395px}
#services .video-square{position:absolute;top:0;left:50%;width:var(--small);margin:0;transform:translateX(calc(-50% - var(--shift)));transition:width .75s ease,transform .75s ease;cursor:pointer}
#services .video-square[data-position=center]{width:var(--big);transform:translateX(-50%);z-index:2}
#services .video-square[data-position=right]{transform:translateX(calc(-50% + var(--shift)))}
#services .square-media{width:100%;aspect-ratio:1;overflow:hidden;background:#3f5a60;position:relative;display:grid;place-items:center}
#services video{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
#services .missing-clip{display:flex;flex-direction:column;align-items:center;gap:10px;color:#c9d6d5;font-size:10px;letter-spacing:.18em;text-transform:uppercase;text-align:center;padding:12px}
#services .missing-clip:before{content:'▷';font-size:36px;font-weight:200;color:#b7ccce}
#services figcaption{margin-top:17px;font:400 24px Italiana,serif;color:#f3eee5}
#services .square-controls{display:flex;justify-content:center;align-items:center;gap:24px;margin:0 6vw;color:#dce5e1;font-size:9px;letter-spacing:.13em;text-transform:uppercase}
#services .square-controls button{border:1px solid #afc3c5;border-radius:30px;background:transparent;color:#f3eee5;padding:8px 15px;font:inherit;cursor:pointer}
#services .square-controls span{min-width:125px;text-align:center}
@media(max-width:700px){#services{padding:40px 0 44px!important}#services .services-intro{display:block!important;padding:0 6vw 32px!important}#services .services-intro h2{font-size:40px!important;margin-bottom:18px!important}#services .services-intro p{font-size:11px!important;line-height:1.65!important}#services .square-stage{--big:260px;--small:160px;--shift:220px;height:330px}#services figcaption{font-size:22px;margin-top:13px}#services .missing-clip{font-size:8px;letter-spacing:.08em}#services .missing-clip:before{font-size:28px}}
@media(prefers-reduced-motion:reduce){#services .video-square{transition:none}}
#services>div.square-controls{aspect-ratio:auto!important;min-height:0!important;width:auto!important;background:transparent!important;padding:0!important;display:flex!important;flex-direction:row!important;justify-content:center!important;height:36px!important}#services>div.square-controls:before{display:none!important}
#services .square-stage{background:transparent!important;padding:0!important;display:block!important;aspect-ratio:auto!important;min-height:0!important}
#services .square-stage{height:515px}
#services figcaption{text-align:center}
#services .services-heading{font:400 clamp(42px,5vw,68px)/1.05 Italiana,serif!important;text-align:center;margin:32px 5vw 0!important;color:#f3eee5}
#services .video-square{cursor:default}
#services .missing-clip:before{content:none}
@media(max-width:700px){#services .square-stage{height:310px}#services .services-heading{font-size:40px!important;margin-top:24px!important}}
#services .square-stage{--shift:calc((var(--big) + var(--small))/2)}

#services .services-heading{white-space:nowrap;font-size:clamp(24px,4.8vw,64px)!important}@media(max-width:700px){#services .services-heading{font-size:clamp(22px,6.1vw,40px)!important}}

#services .services-heading{white-space:normal;font-size:clamp(42px,5vw,68px)!important}@media(max-width:700px){#services .services-heading{font-size:40px!important}}
#services{scroll-margin-top:100px}

/* Reserve complete video and caption space at every viewport width. */
#services .square-stage{height:calc(var(--big) * .5625 + 65px)!important}
#services figcaption{line-height:28px;min-height:28px}
