/* ============================================================
   SHARED BUTTONS — single source of truth for every page.

   .pillbtn   the standard outline pill: chrome only, no behaviour.
   .wipebtn   FILL WIPE. The accent floods in from the left edge.
              Directional without an arrow — the motion does the
              pointing. Behaviour only: it never sets size or type,
              so it layers onto a page's own sizing class.

   No eased onset: the fill moves the instant you arrive and decelerates
   into place, on the site's standard cubic-bezier(.22,1,.36,1). The
   slow-start curve carried over from the ink-bloom tuning read as a
   beat of hesitation before anything happened. Release stays quick, so
   leaving a button never feels sticky; the base rule carries the
   RELEASE timing and :hover carries the arrival.

   Deliberately NOT wiped: Ready to deploy (solid orange — it is a
   status), Drop us in (Release, where the dot is the payload) and
   Start a project on contact. Those three carry meaning a generic
   fill would flatten.
   ============================================================ */
.pillbtn{display:inline-flex;align-items:center;gap:14px;
  font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink);background:transparent;
  border:1px solid var(--line);border-radius:100px;padding:15px 28px}

.wipebtn{position:relative;isolation:isolate;overflow:hidden;
  transition:color .18s ease,border-color .18s ease}
.wipebtn::before{content:"";position:absolute;inset:0;z-index:-1;
  background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform .18s cubic-bezier(.4,0,.7,.2)}
.wipebtn:hover{color:#fff;border-color:var(--accent);
  transition:color .22s ease-out,border-color .22s ease-out}
.wipebtn:hover::before{transform:scaleX(1);
  transition:transform .42s cubic-bezier(.22,1,.36,1)}
@media (prefers-reduced-motion:reduce){
  .wipebtn::before,.wipebtn:hover::before{transition:none}
}

/* centred closing CTA, shared by About / Work / Stills */
.closing{display:flex;justify-content:center;padding:86px 56px 96px}
@media(max-width:1024px){.closing{padding:64px 32px 72px}}
@media(max-width:600px){
  .closing{padding:48px 20px 56px}
  .pillbtn{font-size:11px;padding:14px 24px}
}