/* Selected CTA design: Capsule. */
.cta{--cta-ink:var(--ink,#201f1c);--cta-paper:var(--paper,#f6f3ea);align-self:start}
:root body .cta{display:inline-flex!important;align-items:center;justify-content:space-between;width:fit-content;max-width:100%;min-width:0;min-height:50px;height:auto;gap:24px;padding:15px 24px!important;border:0 solid var(--cta-ink)!important;border-radius:999px;clip-path:none;overflow:visible;background:var(--cta-ink);color:var(--cta-paper);font-family:var(--sans)!important;font-weight:650!important;font-size:15px!important;line-height:1.15!important;letter-spacing:-.02em!important;text-transform:none;text-decoration:none!important;box-shadow:none;position:relative;isolation:isolate;vertical-align:middle;transition:opacity 160ms ease-out}
:root .cta .cta-label{min-width:0;overflow-wrap:anywhere;text-decoration:none!important}
:root body .cta[hidden]{display:none!important}
:root .cta::before,:root .cta::after{content:none}
:root .cta:active{opacity:.7}
:root .cta:focus-visible{outline:2px solid var(--cta-ink);outline-offset:6px}
:root .cta .cta-arrow{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;line-height:0;overflow:hidden;transition:none}
:root .cta .cta-arrow svg{width:22px;height:22px;display:block}
:root .hero-actions .cta{font-size:14px!important;gap:16px}
:root .hero-actions .hero-secondary{background:transparent;color:var(--cta-ink);border:1.5px solid var(--cta-ink)!important}
:root .index-work .index-cta{font-size:14px!important;margin:0}
.service-body .cta{margin:0!important;justify-self:start}
.studio .cta{margin-top:24px}
.menu-contact.cta{align-self:end}
.case-footer-cta.cta{margin-bottom:30px}
.drawn-arrow{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex-shrink:0}
/* Retain the selected three-second automatic arrow loop. */
.cta .flow-icon,.contact .section-top a .flow-icon,.project-photo-cta .flow-icon{display:inline-block;width:22px;height:22px;flex:0 0 22px;overflow:hidden;line-height:0;vertical-align:middle}
.flow-icon svg{display:block;width:22px;height:22px;overflow:hidden}
.flow-icon path{stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.flow-glyph{transform-origin:12px 12px}
@media(max-width:760px){
 :root .hero-actions{align-items:center;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
 :root .hero-actions .cta{width:100%;min-height:46px;gap:8px;font-size:12px!important;padding:12px 14px!important}
}
@media(max-width:380px){:root .hero-actions .cta{font-size:11px!important}}
@media(prefers-reduced-motion:reduce){:root .cta{transition:none}}
/* Selected hover: text roll. The arrow is never duplicated. */
:root .cta .cta-label{display:block;position:relative;overflow:hidden;line-height:1.15}
:root .cta .cta-roll-track{display:block;position:relative;transition:transform 340ms cubic-bezier(.2,.7,.2,1)}
:root .cta .cta-roll-original{display:block}
:root .cta .cta-roll-copy{display:block;position:absolute;top:100%;left:0;width:100%}
:root .cta:is(:focus-visible,.cta-touch) .cta-roll-track{transform:translateY(-100%)}
@media(hover:hover) and (pointer:fine){:root .cta:hover .cta-roll-track{transform:translateY(-100%)}}
@media(prefers-reduced-motion:reduce){:root .cta .cta-roll-track{transition:none;transform:none!important}}

/* Visible navigation buttons at the top of every project page. */
:root body .case-breadcrumb .cta{font-size:12px!important;gap:16px;padding:14px 22px!important;min-height:48px;border:1.5px solid var(--ink)!important}
:root body .case-breadcrumb .cta:first-child{background:transparent;color:var(--ink)}
:root body .case-breadcrumb .cta:first-child .cta-arrow{order:-1}
@media(max-width:760px){:root body .case-breadcrumb .cta{font-size:10px!important;gap:8px;padding:12px 14px!important;min-height:44px}.case-breadcrumb{column-gap:10px}}