/* Reuses the original Loopi Lab Services component without its Lab chrome. */
.services{padding:clamp(60px,7vw,105px) clamp(20px,6vw,100px) 44px;background:#f0f0ee;overflow:hidden}.section-top,.services-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;font:800 10px Arial;letter-spacing:.13em;color:#444}.services-heading{display:flex;justify-content:space-between;align-items:end;gap:36px;margin:32px 0 55px}.services-heading h2{font:900 clamp(57px,8vw,115px)/.93 Arial;letter-spacing:-.085em;margin:0}.services-heading h2 .asterisk{font-size:.45em;vertical-align:top;padding-left:16px}.services-heading p{font-size:15px;line-height:1.5;color:#777;max-width:235px}.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #111;border-bottom:1px solid #111}.service-card{display:flex;flex-direction:column;padding:28px clamp(22px,2.3vw,38px) 42px;min-height:530px;position:relative;min-width:0}.service-card:first-child{padding-left:0}.service-card:last-child{padding-right:0}.service-card+.service-card{border-left:1px solid #a6a6a4}.service-number{font:900 10px Arial;letter-spacing:.13em;color:#666}.service-divider{height:1px;background:#c6c6c2;margin:28px 0 27px}.service-card h3{font:900 clamp(39px,4vw,68px)/.94 Arial;letter-spacing:-.09em;margin:0 0 24px}.service-card h3 span{color:#aaa}.service-card>p{font:400 14px/1.75 Arial;color:#494949;max-width:410px;margin:0 0 30px}.action-row{margin-top:auto;display:flex;align-items:end;min-height:62px;padding-top:12px;position:relative;isolation:isolate}.learn-more{display:block;position:relative;width:189px;height:48px;background:#151515;color:#fff;border:1px solid #151515;z-index:2;isolation:isolate;overflow:visible;transition:box-shadow .25s ease}.action-idle{position:absolute;inset:0;padding:0 17px;display:flex;align-items:center;justify-content:space-between;gap:12px;font:900 10px Arial;letter-spacing:.07em;transition:opacity .22s,transform .42s cubic-bezier(.18,.8,.2,1),filter .4s}.action-idle b{font-size:18px;font-weight:400}.micro-preview{position:absolute;bottom:-1px;left:-1px;width:244px;height:217px;z-index:5;background:#0e0e0e;border:1px solid #1c1c1c;box-shadow:0 18px 36px #0003;display:block;overflow:hidden;pointer-events:none;opacity:0;transform:translateY(32px) scale(.73,.32);transform-origin:15% 100%;transition:opacity .25s ease,transform .65s cubic-bezier(.17,1.15,.25,1)}.learn-more:is(:hover,:focus-visible,.is-previewing){z-index:10;box-shadow:0 10px 24px #0002}.learn-more:is(:hover,:focus-visible,.is-previewing) .action-idle{opacity:0;transform:translateY(9px) scale(.6);filter:blur(3px)}.learn-more:is(:hover,:focus-visible,.is-previewing) .micro-preview{opacity:1;transform:translateY(0) scale(1)}.preview-footer{position:absolute;bottom:0;left:0;right:0;height:44px;background:#101010;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 13px;font:900 10px Arial;letter-spacing:.06em;z-index:7}.preview-footer b{font-size:19px;font-weight:400}.social-stack{position:absolute;inset:0 0 44px;display:block;background:#222}.social-post{position:absolute;display:block;width:108px;height:137px;top:26px;left:20px;background:#e7e7e7;overflow:hidden;box-shadow:0 6px 10px #0005;transform-origin:50% 90%;transition:transform .8s cubic-bezier(.2,1,.25,1)}.social-post img{width:100%;height:109px;object-fit:cover}.social-post i{display:flex;justify-content:space-between;padding:7px;font:900 7px Arial;color:#222;font-style:normal}.post-a{transform:translate(0,0) rotate(-11deg);z-index:3}.post-b{transform:translate(60px,3px) rotate(6deg) scale(.86);z-index:2}.post-c{transform:translate(85px,-5px) rotate(15deg) scale(.77);z-index:1}.learn-more:is(:hover,:focus-visible,.is-previewing) .post-a{animation:social-swap-a 3s ease-in-out .35s infinite}.learn-more:is(:hover,:focus-visible,.is-previewing) .post-b{animation:social-swap-b 3s ease-in-out .35s infinite}.learn-more:is(:hover,:focus-visible,.is-previewing) .post-c{animation:social-swap-c 3s ease-in-out .35s infinite}@keyframes social-swap-a{0%,100%{transform:translate(0,0) rotate(-11deg)}48%{transform:translate(52px,-5px) rotate(4deg)}}@keyframes social-swap-b{0%,100%{transform:translate(60px,3px) rotate(6deg) scale(.86)}48%{transform:translate(5px,1px) rotate(-8deg) scale(.96)}}@keyframes social-swap-c{0%,100%{transform:translate(85px,-5px) rotate(15deg) scale(.77)}48%{transform:translate(91px,9px) rotate(19deg) scale(.81)}}.content-preview{background:#e2e1dc}.photo-sheet{position:absolute;display:block;width:115px;height:129px;padding:6px 6px 18px;background:#fff;box-shadow:0 8px 14px #0005;transform-origin:50% 80%;transition:transform .7s cubic-bezier(.2,1.2,.25,1)}.photo-sheet img{height:100%;width:100%;object-fit:cover}.shot-one{top:29px;left:42px;transform:rotate(-13deg);z-index:1}.shot-two{top:22px;left:78px;transform:rotate(3deg);z-index:2}.shot-three{top:32px;left:110px;transform:rotate(17deg);z-index:3}.learn-more:is(:hover,:focus-visible,.is-previewing) .shot-one{transform:translate(-25px,2px) rotate(-20deg)}.learn-more:is(:hover,:focus-visible,.is-previewing) .shot-two{transform:translate(0,-13px) rotate(0deg)}.learn-more:is(:hover,:focus-visible,.is-previewing) .shot-three{transform:translate(16px,2px) rotate(22deg)}.content-marker{position:absolute;z-index:4;top:12px;left:12px;color:#191919;font:900 9px/1.2 Arial;letter-spacing:.06em}.video-preview{background:#000}.video-frame{position:absolute;inset:0 0 53px;overflow:hidden;display:block}.video-frame img{height:100%;width:100%;object-fit:cover;filter:brightness(.65);transform:scale(1.06);transition:transform 2.3s ease}.learn-more:is(:hover,:focus-visible,.is-previewing) .video-frame img{transform:scale(1.2)}.film-play{position:absolute;left:50%;top:51%;width:50px;height:50px;border:1px solid #fff9;border-radius:50%;display:grid;place-items:center;transform:translate(-50%,-50%) scale(.65);opacity:.3;font-size:17px;padding-left:3px;transition:transform .6s ease .15s,opacity .4s ease .15s}.learn-more:is(:hover,:focus-visible,.is-previewing) .film-play{transform:translate(-50%,-50%) scale(1);opacity:1}.film-time{position:absolute;right:10px;bottom:11px;background:#0009;color:#fff;font:900 8px Arial;padding:5px}.video-progress{position:absolute;bottom:44px;height:6px;left:0;right:0;background:#666}.video-progress i{display:block;height:100%;width:0;background:#fff;transition:width 2.4s linear .28s}.learn-more:is(:hover,:focus-visible,.is-previewing) .video-progress i{width:62%}.services-bottom{margin-top:26px}
/* Content Creation: a continuous, gently paced three-card carousel. */
.content-preview .photo-sheet{transition:none}
.learn-more:is(:hover,:focus-visible,.is-previewing) .content-preview .shot-one{
 animation:loopi-carousel-one 6.6s cubic-bezier(.42,0,.2,1) infinite
}
.learn-more:is(:hover,:focus-visible,.is-previewing) .content-preview .shot-two{
 animation:loopi-carousel-two 6.6s cubic-bezier(.42,0,.2,1) infinite
}
.learn-more:is(:hover,:focus-visible,.is-previewing) .content-preview .shot-three{
 animation:loopi-carousel-three 6.6s cubic-bezier(.42,0,.2,1) infinite
}
@keyframes loopi-carousel-one{
 0%,13%,100%{transform:translate(-25px,2px) rotate(-18deg) scale(.89);z-index:1}
 20%,45%{transform:translate(21px,-13px) rotate(0deg) scale(1.08);z-index:4}
 53%,78%{transform:translate(85px,7px) rotate(18deg) scale(.87);z-index:2}
 88%{transform:translate(-25px,2px) rotate(-18deg) scale(.89);z-index:1}
}
@keyframes loopi-carousel-two{
 0%,13%,100%{transform:translate(21px,-13px) rotate(0deg) scale(1.08);z-index:4}
 20%,45%{transform:translate(85px,7px) rotate(18deg) scale(.87);z-index:2}
 53%,78%{transform:translate(-25px,2px) rotate(-18deg) scale(.89);z-index:1}
 88%{transform:translate(21px,-13px) rotate(0deg) scale(1.08);z-index:4}
}
@keyframes loopi-carousel-three{
 0%,13%,100%{transform:translate(85px,7px) rotate(18deg) scale(.87);z-index:2}
 20%,45%{transform:translate(-25px,2px) rotate(-18deg) scale(.89);z-index:1}
 53%,78%{transform:translate(21px,-13px) rotate(0deg) scale(1.08);z-index:4}
 88%{transform:translate(85px,7px) rotate(18deg) scale(.87);z-index:2}
}
/* Autoplay video lives inside the existing transformed button preview. */
.video-frame .loopi-actual-video{
 position:absolute;inset:0;width:100%;height:100%;border:0;z-index:2;
 opacity:0;pointer-events:none;transition:opacity .28s ease .35s
}
.video-preview.is-video-playing .loopi-actual-video{opacity:1}
.video-preview.is-video-playing .film-play,
.video-preview.is-video-playing .film-time{opacity:0}
.video-preview.is-video-playing .video-progress{opacity:0}
@media(prefers-reduced-motion:reduce){
 .learn-more:is(:hover,:focus-visible,.is-previewing) .content-preview .photo-sheet{animation:none}
}
/* Homepage integration */ 
.services{padding:clamp(65px,7vw,105px) clamp(20px,6vw,100px) 44px;background:#f0f0ee;color:#111}
.services .services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #111;border-bottom:1px solid #111}
.services .service-card{display:flex;flex-direction:column;border:0;padding:28px clamp(22px,2.3vw,38px) 42px;min-height:530px;transition:none}
.services .service-card:first-child{padding-left:0}
.services .service-card:last-child{padding-right:0}
.services .service-card+.service-card{border-left:1px solid #a6a6a4}
.services .service-card>p{color:#494949;max-width:410px;font:400 14px/1.75 Arial,sans-serif;margin:0 0 30px}
.services .learn-more{display:block;position:relative;height:48px;width:189px;padding:0;background:#151515;color:#fff;border:1px solid #151515}
.services .learn-more:hover{color:#fff;background:#151515}
@media(max-width:1020px){.services .services-grid{grid-template-columns:1fr}.services .service-card,.services .service-card:first-child,.services .service-card:last-child{padding:35px 15px 45px;min-height:320px}.services .service-card+.service-card{border-left:0;border-top:1px solid #aaa}.services .service-card h3{font-size:62px}.services .action-row{margin-top:15px}.services .services-heading{align-items:start}}
@media(max-width:670px){.services .services-heading{display:block}.services .services-heading h2{font-size:clamp(60px,12vw,85px)}.services .services-heading p{margin-top:20px}.services .service-card h3{font-size:clamp(53px,10vw,67px)}.services .section-top span:last-child,.services .services-bottom span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.services .learn-more:is(:hover,:focus-visible,.is-previewing) .micro-preview{opacity:1;transform:none}.services .learn-more:is(:hover,:focus-visible,.is-previewing) .content-preview .photo-sheet{animation:none}}
