/* Figma navigation 155:10242: white 52px circles and 24px arrows. */
@font-face{font-family:Inter;src:url('assets/inter-semibold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
.case-switch{position:fixed;top:calc(50% - 26px);z-index:11;display:flex;flex-direction:column;align-items:center;justify-content:center;width:52px;height:52px;padding:10px 14px 14px;border-radius:26px;background:#fff;color:#1a1a1a;box-shadow:0 2px 4px #00000014;font-family:Inter,Arial,sans-serif;font-size:24px;font-weight:600;line-height:28px;text-align:center;text-decoration:none;transition:transform 160ms ease-out,background-color 180ms ease}
.case-switch-prev{left:32px}
.case-switch-next{right:32px}
.case-switch:active{transform:scale(.97)}
.case-switch:focus-visible{background-color:#f0f0ee;outline:2px solid var(--ink);outline-offset:4px}
@media(max-width:1300px) and (min-width:1101px){.case-switch-prev{left:8px}.case-switch-next{right:8px}}
/* Fixed case arrows obscure long-form content once the viewport becomes
   narrower than the full desktop composition. Browser back and the Work links
   remain available, so remove the floating controls at that point. */
@media(max-width:1100px){.case-switch{display:none}}
@media(prefers-reduced-motion:reduce){.case-switch{transition:none}.case-switch:active{transform:none}}

/* Destination keywords appear without moving the arrow or surrounding layout. */
.case-switch-word{position:absolute;top:calc(100% + 10px);width:max-content;padding:12px 20px;border-radius:20px 0 20px 20px;background:#f0f0ee;color:#1a1a1a;font-family:Inter,Arial,sans-serif;font-size:16px;font-weight:600;line-height:20px;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(-4px);transition:opacity 180ms cubic-bezier(.23,1,.32,1),transform 180ms cubic-bezier(.23,1,.32,1)}
.case-switch-prev .case-switch-word{left:0;border-radius:0 20px 20px 20px}
.case-switch-next .case-switch-word{right:0}
@media(hover:hover) and (pointer:fine){.case-switch:hover{background-color:#f0f0ee;transform:scale(.97)}.case-switch:hover .case-switch-word{opacity:1;transform:none}}
.case-switch:focus-visible .case-switch-word{opacity:1;transform:none;transition:none}
@media(prefers-reduced-motion:reduce){.case-switch-word{transform:none;transition:opacity 150ms ease}}

/* Gentle press feedback, with no spring or overshoot. */
.case-switch:active{transform:scale(.94)}
@media(prefers-reduced-motion:reduce){.case-switch:hover,.case-switch:active{transform:none}}