/* Motion layer. Every effect is scoped to an m-* class on <html>, added by
   motion.js only when the visitor hasn't asked for reduced motion, so the page
   is complete and static without it. */

/* 1. Hero airflow canvas */
.hero-airflow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen;opacity:0;transition:opacity 1.2s ease}
.m-airflow .hero-airflow{opacity:1}

/* 2. Hero entrance */
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.hero h1 .line>span{display:inline-block}
@keyframes m-settle{from{transform:scale(1.14)}to{transform:scale(1)}}
@keyframes m-line{from{transform:translateY(105%)}to{transform:none}}
@keyframes m-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes m-slide{from{opacity:0;transform:translateX(48px)}to{opacity:1;transform:none}}
@keyframes m-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.m-intro .hero-image{animation:m-settle 2.8s cubic-bezier(.16,.8,.24,1) both}
.m-intro .hero h1 .line>span{animation:m-line 1.1s cubic-bezier(.2,.8,.2,1) both}
.m-intro .hero h1 .line:nth-child(1)>span{animation-delay:.25s}
.m-intro .hero h1 .line:nth-child(2)>span{animation-delay:.4s}
.m-intro .hero-content>.eyebrow{animation:m-rise .9s .1s cubic-bezier(.2,.8,.2,1) both}
.m-intro .hero-content>.eyebrow i{transform-origin:left;animation:m-grow .8s .3s cubic-bezier(.2,.8,.2,1) both}
.m-intro .hero-content>p{animation:m-rise 1s .65s cubic-bezier(.2,.8,.2,1) both}
.m-intro .hero-actions{animation:m-rise 1s .8s cubic-bezier(.2,.8,.2,1) both}
.m-intro .hero-note{animation:m-slide 1.1s 1.15s cubic-bezier(.2,.8,.2,1) both}
.m-intro .hero-bottom{animation:m-rise 1s 1.05s cubic-bezier(.2,.8,.2,1) both}
.m-intro .status-dot{animation:m-pulse 2.4s 2.2s ease-out infinite}
@keyframes m-pulse{0%{box-shadow:0 0 0 0 #79c64c99}70%,100%{box-shadow:0 0 0 9px #79c64c00}}

/* 3. Self-drawing service icons; the fan turns on hover */
.m-draw .service-top svg path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s cubic-bezier(.45,.05,.2,1)}
.m-draw .service.in-view .service-top svg path{stroke-dashoffset:0}
.m-draw .service:nth-child(2) .service-top svg path{transition-delay:.15s}
.m-draw .service:nth-child(3) .service-top svg path{transition-delay:.3s}
@keyframes m-spin{to{transform:rotate(360deg)}}
.m-draw .service.featured .service-top svg{transition:transform .6s}
.m-draw .service.featured:hover .service-top svg{animation:m-spin 3.5s linear infinite}

/* 4. Services marquee (replaces the principles strip while on) */
.marquee{display:none;background:var(--paper);border-bottom:1px solid var(--line);overflow:hidden;padding:20px 0}
.m-marquee .marquee{display:block}
.m-marquee .principles{display:none}
.marquee-track{display:flex;width:max-content;animation:m-marquee 48s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee ul{display:flex;align-items:center;margin:0;padding:0;list-style:none}
.marquee li{display:flex;align-items:center;font-family:Manrope,Arial,sans-serif;font-size:22px;font-weight:500;letter-spacing:-.6px;color:var(--ink);white-space:nowrap}
.marquee li::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);margin:0 30px}
.marquee li:nth-child(even){color:var(--blue)}
@keyframes m-marquee{to{transform:translateX(-50%)}}

/* 5. Section reveals, hairlines drawing across, image wipe + parallax */
.m-reveal .rv{opacity:0;transform:translateY(30px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0) * 110ms)}
.m-reveal .rv.in-view{opacity:1;transform:none}
.m-reveal .service.rv.in-view:hover{transform:translateY(-5px);transition-delay:0s}
.m-reveal .rv .eyebrow i,.m-reveal .rv.eyebrow i{transform:scaleX(0);transform-origin:left;transition:transform .8s .3s cubic-bezier(.2,.8,.2,1)}
.m-reveal .rv.in-view .eyebrow i,.m-reveal .rv.eyebrow.in-view i{transform:none}
.m-reveal .approach-list>div{position:relative;border-top-color:transparent}
.m-reveal .approach-list>div::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0) * 110ms)}
.m-reveal .approach-list>div.in-view::before{transform:none}
.m-reveal .approach-visual{overflow:hidden}
.m-reveal .approach-visual>img{clip-path:inset(0 100% 0 0);transform:scale(1.12) translateY(var(--py,0px));transition:clip-path 1.5s cubic-bezier(.7,0,.2,1)}
.m-reveal .approach-visual.in-view>img{clip-path:inset(0 0 0 0)}
.m-reveal .image-caption{opacity:0;transform:translateY(40px);transition:opacity .8s 1s,transform .8s 1s cubic-bezier(.2,.8,.2,1)}
.m-reveal .approach-visual.in-view .image-caption{opacity:1;transform:none}

/* 6. Micro-interactions */
.m-micro .button span,.m-micro .service-foot span,.m-micro .sector-grid a span,.m-micro .inline-link span,.m-micro .caption-arrow,.m-micro .contact-phone span{transition:transform .35s cubic-bezier(.2,.8,.2,1);display:inline-block}
.m-micro .button:hover span,.m-micro .service:hover .service-foot span,.m-micro .sector-grid a:hover span,.m-micro .inline-link:hover span,.m-micro .contact-phone:hover span{transform:translate(4px,-4px)}
.m-micro .text-link span{transition:transform .35s;display:inline-block}
.m-micro .text-link:hover span{transform:translateY(4px)}
.m-micro .contact-phone{background:linear-gradient(#79c64c,#79c64c) left bottom/0 1px no-repeat;transition:background-size .5s cubic-bezier(.2,.8,.2,1);padding-bottom:6px}
.m-micro .contact-phone:hover{background-size:100% 1px}
.m-micro .inline-link{background:linear-gradient(var(--blue),var(--blue)) left bottom/0 1px no-repeat;transition:background-size .5s cubic-bezier(.2,.8,.2,1)}
.m-micro .inline-link:hover{background-size:100% 1px}

@media(max-width:760px){.marquee{padding:16px 0}.marquee li{font-size:22px}.marquee li::after{margin:0 24px;width:7px;height:7px}}
@media(prefers-reduced-motion:reduce){.hero-airflow{display:none}.marquee-track{animation:none}}