/* Handcrafted motion system */
.button,.button span,.services a,.text-link,nav a{transition:transform .25s ease,background-color .25s ease,color .25s ease,box-shadow .25s ease,text-decoration-color .25s ease}
.button:hover{transform:translateY(-2px);box-shadow:0 8px 0 rgba(7,26,45,.12)}
.button:hover span{transform:translate(3px,-3px)}
.services a:hover,.text-link:hover{color:var(--red);text-decoration-color:transparent;transform:translateX(3px)}
nav a{position:relative}
nav a:after{content:'';position:absolute;left:0;right:0;bottom:-5px;height:2px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .3s ease}
nav a:hover:after{transform:scaleX(1);transform-origin:left}

.ribbon{display:block;overflow:hidden;padding:0;white-space:nowrap}
.ribbon-track{display:flex;width:max-content;will-change:transform;animation:ribbon-roll 24s linear infinite}
.ribbon-group{display:flex;align-items:center;justify-content:space-around;gap:52px;min-width:100vw;padding:23px 26px}
.ribbon:hover .ribbon-track{animation-play-state:paused}
@keyframes ribbon-roll{to{transform:translateX(-50%)}}

.motion-enabled header,.motion-enabled .hero-copy>*{opacity:0;transform:translateY(16px)}
.motion-enabled.is-loaded header{animation:rise-in .65s cubic-bezier(.2,.7,.2,1) forwards}
.motion-enabled.is-loaded .hero-copy>*{animation:rise-in .7s cubic-bezier(.2,.7,.2,1) forwards}
.motion-enabled.is-loaded .hero-copy>:nth-child(1){animation-delay:.08s}
.motion-enabled.is-loaded .hero-copy>:nth-child(2){animation-delay:.16s}
.motion-enabled.is-loaded .hero-copy>:nth-child(3){animation-delay:.26s}
.motion-enabled.is-loaded .hero-copy>:nth-child(4){animation-delay:.34s}
.motion-enabled.is-loaded .hero-copy>:nth-child(5){animation-delay:.42s}

.motion-enabled .hero-image{overflow:hidden;opacity:0;transform:translateY(18px)}
.motion-enabled.is-loaded .hero-image{animation:rise-in .75s cubic-bezier(.2,.7,.2,1) .18s forwards}
.hero-image figcaption{z-index:3}
@keyframes rise-in{to{opacity:1;transform:none}}

.motion-enabled .reveal{opacity:0;transform:translateY(28px);transition:opacity .72s cubic-bezier(.2,.7,.2,1),transform .72s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}
.motion-enabled .reveal.is-visible{opacity:1;transform:none}
.motion-enabled .services article.reveal,.motion-enabled .steps article.reveal{transform:translateY(34px)}
.motion-enabled .services article.reveal.is-visible,.motion-enabled .steps article.reveal.is-visible{transform:none}

h1 em,.quote h2 em,.area h2{position:relative;display:inline-block;z-index:0}
h1 em:after,.quote h2 em:after,.area h2:after{content:'';position:absolute;z-index:-1;left:-2%;right:-2%;bottom:.02em;height:.09em;background:#cbaa70;border-radius:100%;transform:scaleX(0) rotate(-1deg);transform-origin:left;opacity:.8}
.area h2:after{background:var(--red)}
.motion-enabled.is-loaded h1 em:after{animation:brush-line .65s cubic-bezier(.2,.7,.2,1) .82s forwards}
.motion-enabled .quote h2 em:after,.motion-enabled .area h2:after{transition:transform .75s cubic-bezier(.2,.7,.2,1) .25s}
.motion-enabled .quote h2.is-visible em:after,.motion-enabled .area h2.is-visible:after{transform:scaleX(1) rotate(-1deg)}
@keyframes brush-line{to{transform:scaleX(1) rotate(-1deg)}}

@media(max-width:800px){.ribbon-group{gap:24px;padding:18px 12px}.ribbon-track{animation-duration:20s}}
@media(prefers-reduced-motion:reduce){.ribbon-track{animation:none;transform:none}.ribbon-group[aria-hidden="true"]{display:none}.motion-enabled header,.motion-enabled .hero-copy>*,.motion-enabled .hero-image,.motion-enabled .reveal{opacity:1;transform:none;clip-path:none;animation:none;transition:none}.motion-enabled .hero-image:after{display:none}.motion-enabled.is-loaded h1 em:after,.motion-enabled .quote h2 em:after,.motion-enabled .area h2:after{animation:none;transition:none;transform:scaleX(1) rotate(-1deg)}.button:hover{transform:none;box-shadow:none}}

.paint-trail{position:fixed;z-index:9998;inset:0;width:100%;height:100%;pointer-events:none}
.paintbrush-cursor{position:fixed;z-index:9999;top:0;left:0;width:58px;height:58px;opacity:0;pointer-events:none;will-change:transform;transition:opacity .18s ease;transform:translate3d(-100px,-100px,0);transform-origin:90% 10%}
.paintbrush-cursor img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 3px rgba(7,26,45,.2));transform-origin:30% 75%;transition:transform .18s ease}
.paintbrush-cursor.is-active{opacity:1}
.paintbrush-cursor.is-hovering img{transform:translateY(-3px) rotate(-5deg) scale(1.08)}
.paintbrush-cursor.is-pressing img{transform:translateY(1px) rotate(3deg) scale(.92)}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.paint-trail,.paintbrush-cursor{display:none}}

html.play-intro,html.play-intro body{overflow:hidden}
.intro-wash{display:none;position:fixed;z-index:10000;inset:0;place-items:center;overflow:hidden;background-color:#071a2d;background-image:repeating-linear-gradient(178deg,rgba(255,255,255,.018) 0 2px,transparent 2px 13px);pointer-events:none;will-change:clip-path}
.play-intro .intro-wash{display:grid;animation:navy-wash 1.65s cubic-bezier(.72,0,.22,1) both}
.intro-mark{width:min(270px,54vw);opacity:0;transform:scale(.92);animation:intro-mark 1.65s ease both}
.intro-mark img{width:100%;filter:drop-shadow(0 12px 22px rgba(0,0,0,.18))}
@keyframes navy-wash{0%{clip-path:polygon(0 0,0 0,0 13%,0 18%,0 32%,0 38%,0 53%,0 59%,0 73%,0 81%,0 100%,0 100%)}43%{clip-path:polygon(0 0,100% 0,100% 13%,97% 18%,100% 32%,98% 38%,100% 53%,97% 59%,100% 73%,98% 81%,100% 100%,0 100%)}68%{clip-path:polygon(0 0,100% 0,100% 13%,100% 18%,100% 32%,100% 38%,100% 53%,100% 59%,100% 73%,100% 81%,100% 100%,0 100%)}100%{clip-path:polygon(100% 0,100% 0,100% 13%,100% 18%,100% 32%,100% 38%,100% 53%,100% 59%,100% 73%,100% 81%,100% 100%,100% 100%)}}
@keyframes intro-mark{0%,34%{opacity:0;transform:scale(.92)}48%,68%{opacity:1;transform:scale(1)}82%,100%{opacity:0;transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){.intro-wash{display:none!important}}