/* Service scenes are vector images: crisp, small and dependency free. */
.service{overflow:hidden;padding:0}
.service-media{height:180px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:#eef1e8}
.service-media img{width:100%;height:100%;object-fit:contain;transition:transform .55s cubic-bezier(.2,.65,.3,1)}
.service-number{position:absolute;top:14px;left:14px;background:#ffffffc9;border:1px solid #d8dfd1;border-radius:4px;padding:3px 8px;font-size:10px;color:#586151;letter-spacing:.08em}
.service h3{margin:24px 25px 0}
.service p{margin:13px 25px 23px}
.service-cta{margin: auto 25px 24px}
.service-cta b{transition:transform .25s}
@media(hover:hover){.service:hover .service-media img{transform:scale(1.045)}.service:hover .service-cta b{transform:translate(3px,-3px)}.service.reveal.is-visible:hover{transform:translateY(-4px)}}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .55s ease var(--reveal-delay,0ms),transform .55s cubic-bezier(.2,.65,.3,1) var(--reveal-delay,0ms)}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.hero-copy{animation:hero-enter .7s ease both}
.hero-photo{animation:hero-enter .8s ease .12s both}
@keyframes hero-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.service-media{height:140px}.service h3{margin:18px 16px 0}.service p{margin:12px 16px 18px}.service-cta{margin:auto 16px 18px}}
@media(max-width:380px){.service-media{height:190px}}
@media(prefers-reduced-motion:reduce){.hero-copy,.hero-photo{animation:none}.reveal{opacity:1;transform:none}.service-media img,.service-cta b{transition:none}}
