/* Shared button geometry: SVG bounds are symmetric around the 24 × 24 centre. */
.action .arrow,.project-arrow,.knob{display:flex;align-items:center;justify-content:center;line-height:0;padding:0;flex-shrink:0}
.action .arrow{position:relative;margin:0}
.ui-arrow{display:block;width:50%;height:50%;flex:none;overflow:visible;transform-box:view-box;transform-origin:50% 50%;pointer-events:none}
.knob{color:#fff}.knob .ui-arrow{width:44%;height:44%}
.action .arrow .ui-arrow,.project-arrow .ui-arrow{width:50%;height:50%}
@media(prefers-reduced-motion:no-preference){
 .action,.cta,.meet,.play,.burger,.close-dialog,.close-project{transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s ease,background-color .3s ease}
 .action .arrow,.knob,.project-arrow{transition:transform .3s cubic-bezier(.2,.7,.3,1),background-color .3s ease}
 .ui-arrow{transition:transform .35s cubic-bezier(.2,.7,.3,1)}
 .action:active,.cta:active,.meet:active,.play:active,.burger:active{scale:.98}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .action:hover,.action:focus-visible,.cta:hover,.cta:focus-visible,.meet:hover,.meet:focus-visible{transform:translateY(-2px);box-shadow:0 12px 25px #0f1b3124}
 .action:hover .arrow,.action:focus-visible .arrow,.cta:hover .knob,.meet:hover .knob{transform:scale(1.07)}
 .play:hover,.burger:hover,.close-dialog:hover,.close-project:hover{transform:scale(1.07);box-shadow:0 5px 18px #0f1b3118}
 .project-card:hover .project-arrow,.project-card:focus-visible .project-arrow{transform:scale(1.06)}
 .action:hover .ui-arrow[data-direction="up-right"],.action:focus-visible .ui-arrow[data-direction="up-right"],.project-card:hover .ui-arrow[data-direction="up-right"],.project-card:focus-visible .ui-arrow[data-direction="up-right"]{transform:rotate(45deg)}
 .page-tile,.work-tile{transition:transform .35s cubic-bezier(.2,.7,.3,1),box-shadow .35s ease}
 .page-tile:hover,.work-tile:hover{transform:translateY(-3px);box-shadow:0 14px 35px #0f1b3110}
}