/* Services — Figma 684:443. Existing studio chrome is deliberately shared. */
.services-page{background:#fff;color:var(--ink)}
.services-page .header{color:var(--ink)}
.services-page .header:before{background:#fff;opacity:.97;border-bottom:1px solid #10141910}
.services-header-actions{display:flex;align-items:center;gap:34px}
.services-page .header .menu-toggle{position:relative;inset:auto;width:44px;height:44px;transform:none}
.services-page .header .menu-toggle>span{background:var(--ink)}
.services-page .footer{color:var(--paper);background:var(--ink)}
.expertise{padding:clamp(180px,17.8vw,256px) 14.45% 75px;max-width:1800px;margin:auto}
.expertise-heading{display:flex;align-items:center;gap:35px}
.expertise-heading h1{font-size:clamp(38px,3.9vw,56px);color:var(--blue);white-space:nowrap;letter-spacing:-.025em;font-weight:700}
.expertise-heading>span{height:1px;background:#10141950;flex:1}
.expertise-intro{margin:94px 0 0 25%;font-size:clamp(24px,2.52vw,36px);font-weight:300;line-height:1.48;letter-spacing:-.02em}
.expertise-intro a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:#10141970;transition:color .25s}
.expertise-intro a:hover{color:var(--blue)}
.expertise-index{display:flex;justify-content:space-between;gap:16px;margin-top:90px;padding-top:25px;border-top:1px solid #10141918;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#576571}
.expertise-index a{padding:8px 0}.expertise-index a:hover{color:var(--blue)}
.service-band{position:relative;isolation:isolate;min-height:640px;height:47.37vw;max-height:850px;overflow:hidden;color:#fff;background:var(--blue);margin-bottom:8.54vw;scroll-margin-top:0}
.service-visual{position:absolute;inset:0 0 0 35.08%;overflow:hidden;will-change:transform}
.service-visual>img{width:100%;height:100%;object-fit:cover;transform:translateY(var(--art-y,0px)) scale(1.07);transition:transform .25s ease-out}
.service-plane{position:absolute;inset:0 auto 0 0;width:64.925%;background:var(--blue);clip-path:polygon(0 0,63.5% 0,100% 50%,63.5% 100%,0 100%);z-index:1}
.service-copy{position:relative;z-index:2;margin-left:4.45%;width:28%;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding-block:60px}
.service-number{font-size:9px;letter-spacing:.17em;color:#e3effa;margin-bottom:20px}
.service-copy h2{font-size:clamp(48px,4.03vw,68px);font-weight:500;letter-spacing:-.035em;margin-bottom:auto}
.service-copy p{font-size:clamp(17px,1.517vw,23px);line-height:1.45;max-width:400px;margin-top:50px}
.service-more{display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:left;font-size:clamp(11px,1.18vw,18px);text-transform:uppercase;margin-top:42px;padding:0 0 9px;border-bottom:1px solid #fffa;line-height:1.5}
.service-more span{transition:transform .3s}.service-more:hover span{transform:translate(3px,-3px)}
.service-band :focus-visible{outline-color:#fff}
.service-reverse .service-visual{inset:0 35.08% 0 0;clip-path:polygon(0 0,63.5% 0,100% 50%,63.5% 100%,0 100%);z-index:1}
.service-reverse .service-plane{display:none}
.service-reverse .service-copy{margin-left:66.74%}
.service-digital .digital-backdrop{filter:brightness(.4)}
.service-digital .digital-screen{position:absolute;width:46%;height:auto;max-width:none;top:0;right:6.4%;transform:translateY(var(--screen-y,0px));box-shadow:0 0 70px #0006;object-fit:initial;transition:transform .35s ease-out}
.success-stories{padding:0 14.45% 95px;text-align:center;max-width:1800px;margin:auto}
.success-stories h2{font-size:clamp(38px,4.03vw,58px);font-weight:500;text-transform:uppercase;letter-spacing:-.025em}
.client-logos{display:grid;grid-template-columns:repeat(4,1fr);align-items:center;gap:30px;margin:100px 0 88px;min-height:163px}
.client-logos>div{display:flex;align-items:center;justify-content:center;min-width:0}
.client-logos .client-pegasus{width:116px;height:163px;object-fit:contain;filter:grayscale(1)}
.client-logos .client-josh{width:116px;height:98px;object-fit:contain}
.client-logos .client-ozithy{flex-direction:column;gap:8px}
.client-list summary{display:inline-flex;gap:24px;align-items:center;font-size:18px;border-bottom:1px solid;padding:6px 0;cursor:pointer;list-style:none}
.client-list summary::-webkit-details-marker{display:none}.client-list summary span{transition:transform .3s}.client-list[open] summary span{transform:rotate(45deg)}
.client-list summary:focus-visible{outline:2px solid var(--blue);outline-offset:8px}
.client-list ul{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 30px;text-align:left;list-style:none;padding:45px 0 0;margin:0;font-size:14px;color:#52606b;line-height:1.6}
.testimonials{margin:0 4.45%;padding:80px 0 100px;border-top:1px solid #10141930;display:grid;grid-template-columns:30% 1fr;gap:3%}
.testimonials h2{font-size:clamp(25px,2.02vw,34px);font-weight:500;line-height:1.35;text-transform:uppercase;letter-spacing:-.025em}
.testimonials figure{margin:0;max-width:820px}.testimonials blockquote{margin:0;columns:3;column-gap:35px;color:#5c6065;font-size:14px;line-height:1.8}.testimonials blockquote p{margin-bottom:18px}
.testimonials figcaption{margin-top:30px;font-family:var(--serif);font-size:22px}.testimonials figcaption span{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.12em;margin-top:10px;color:#68717a}
.services-page .contact{border-top:1px solid #10141910}
.service-detail-topics{display:flex;flex-wrap:wrap;gap:10px;margin:25px 0}.service-detail-topics span{border:1px solid #ffffff30;padding:8px 12px;font-size:12px;color:#c3d4e0}
@media(min-width:1700px){.service-copy{padding-block:95px}.service-copy p{max-width:480px}}
@media(max-width:1000px){.expertise{padding-inline:8%}.expertise-intro{margin-left:15%}.service-band{min-height:590px}.service-copy{width:30%;margin-left:4%}.service-copy p{font-size:17px}.service-reverse .service-copy{margin-left:66%}.service-more{font-size:12px}.client-logos{gap:15px}.success-stories{padding-inline:8%}.testimonials blockquote{columns:2}}
@media(max-width:700px){.services-header-actions{gap:12px}.services-page .header{padding-inline:5%}.expertise{padding:160px 7% 45px}.expertise-heading{gap:20px}.expertise-heading h1{font-size:38px}.expertise-intro{margin:45px 0 0;font-size:26px;line-height:1.5}.expertise-index{margin-top:45px;display:grid;grid-template-columns:1fr 1fr;gap:10px;font-size:9px}.service-band{height:auto;min-height:0;max-height:none;display:flex;flex-direction:column;margin-bottom:52px}.service-visual,.service-reverse .service-visual{position:relative;inset:auto;order:2;width:100%;height:350px;clip-path:none;z-index:0}.service-plane{display:none}.service-copy,.service-reverse .service-copy{width:auto;height:auto;margin:0;padding:45px 8% 55px}.service-copy h2{font-size:49px;margin-bottom:0}.service-copy p{margin-top:25px;max-width:none;font-size:18px;line-height:1.55}.service-more{margin-top:28px;font-size:13px}.service-number{margin-bottom:15px}.service-digital .digital-screen{width:48%;right:12%}.success-stories{padding:15px 7% 65px}.success-stories h2{font-size:36px}.client-logos{grid-template-columns:1fr 1fr;gap:45px 20px;margin:55px 0}.client-list ul{grid-template-columns:1fr 1fr;gap:18px;font-size:12px}.testimonials{margin-inline:7%;padding:50px 0 65px;grid-template-columns:1fr;gap:30px}.testimonials h2{font-size:29px}.testimonials blockquote{columns:1;font-size:15px}.services-page .contact h2{font-size:clamp(34px,8.5vw,46px)}}
@media(prefers-reduced-motion:reduce){.service-visual>img,.service-digital .digital-screen{transform:none;will-change:auto}}
/* Intro shares the rule's right edge; typography follows the annotated reference. */
/* Pull the blue chevron back to the centre, opening up the adjacent artwork. */
@media(min-width:701px){.service-band:not(.service-reverse) .service-plane{width:49%;clip-path:polygon(0 0,72% 0,100% 50%,72% 100%,0 100%)}}
/* Recede the image-filled points and recentre the artwork within the smaller frame. */
@media(min-width:701px){.service-reverse .service-visual{right:51%;clip-path:polygon(0 0,72% 0,100% 50%,72% 100%,0 100%)}}
.expertise-heading{gap:clamp(30px,3.5vw,54px)}
.expertise-intro{margin:72px 0 0 27%;font-weight:400;line-height:1.3;letter-spacing:0}
.expertise-intro a{text-decoration-color:#8bbfe9;text-decoration-thickness:2px;text-underline-offset:4px}
/* Zoom the media inside its stationary, clipped frame, retaining scroll parallax. */
.service-visual>img{scale:1;transition:scale 1.2s cubic-bezier(.2,.7,.2,1),transform .25s ease-out}
.service-band:hover .service-visual>img,.service-band:focus-within .service-visual>img{scale:1.09}
.service-visual>video{width:100%;height:100%;object-fit:cover;display:block}
.client-carousel{overflow:hidden;margin:80px 0 15px;padding:22px 0;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.client-track{display:flex;width:max-content;animation:client-drift 28s linear infinite}
.client-track .client-logos{display:flex;flex:none;gap:0;margin:0;min-height:190px}
.client-track .client-logos>div{flex:0 0 auto;width:clamp(170px,17.8vw,320px);height:190px;filter:grayscale(1);transform:scale(1);transition:filter .4s,transform .45s}
.client-logos .client-pegasus{filter:none}
.client-carousel:hover .client-track,.client-carousel:focus-within .client-track,.client-carousel.is-paused .client-track{animation-play-state:paused}
.client-track .client-logos>div:hover,.client-track .client-logos>div:focus-visible{filter:grayscale(0);transform:scale(1.07);animation:client-wiggle .65s ease-in-out}
.client-track .client-logos>div:focus-visible{outline:2px solid var(--blue);outline-offset:-7px}
.client-list{margin-top:40px}.client-list summary{font-size:15px;gap:18px;padding:5px 0}
@keyframes client-drift{to{transform:translateX(-50%)}}
@keyframes client-wiggle{0%,100%{transform:scale(1.07) rotate(0)}30%{transform:scale(1.07) rotate(-3deg)}65%{transform:scale(1.07) rotate(3deg)}}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px}
.testimonials .testimonial-grid blockquote{columns:auto;font-size:14px;line-height:1.65}
.testimonials .testimonial-grid figure{display:flex;flex-direction:column;min-width:0;border-top:1px solid #10141922;padding-top:20px;gap:20px}
.testimonial-grid figure>.eyebrow{color:#7b858d;font-size:10px;line-height:1.7;letter-spacing:.16em}
.testimonials .testimonial-grid figcaption{margin-top:auto;padding-top:25px;font-size:20px}
.testimonials .testimonial-placeholder{border-top:1px solid #10141922;padding-top:20px;color:#7b858d;gap:20px;font-size:16px;line-height:1.7}
.testimonials .testimonial-placeholder figcaption{font-family:var(--sans);font-size:11px;color:#7b858d}
@media(max-width:1000px) and (min-width:701px){.testimonials{grid-template-columns:1fr;gap:40px}}
@media(max-width:700px){.expertise-intro{margin:45px 0 0;line-height:1.4}.expertise-heading{gap:20px}.client-carousel{margin-top:45px}.testimonial-grid{grid-template-columns:1fr;gap:40px}.service-band:hover .service-visual>img{scale:1}}
@media(prefers-reduced-motion:reduce){.client-track{animation:none}.client-carousel{overflow-x:auto;mask-image:none}.client-track .client-logos[aria-hidden]{display:none}.client-track .client-logos>div:hover{animation:none;transform:none}.service-band:hover .service-visual>img,.service-band:focus-within .service-visual>img{scale:1}}