/* Shared button interactions. Individual translate preserves reveal and carousel transforms. */
:root {
  --button-easing: cubic-bezier(.2, .75, .2, 1);
  --button-transitions:
    color .3s ease,
    background-color .3s ease,
    border-color .3s ease,
    box-shadow .35s ease,
    translate .35s var(--button-easing);
}

.cta,
.contact-btn,
.case-back,
.case-next,
.text-link,
.service,
.lightbox-close,
.lightbox-nav,
.pdf-nav,
.pdf-mobile-controls button {
  transition: var(--button-transitions);
}

/* Keep the entrance animation while giving hover its own immediate transitions. */
html.site-scroll-enabled :is(.cta, .case-back, .case-next, .text-link, .service).site-scroll-reveal {
  transition:
    opacity var(--site-reveal-duration) ease,
    transform var(--site-reveal-duration) var(--site-reveal-easing),
    filter var(--site-reveal-duration) ease,
    var(--button-transitions);
  transition-delay:
    var(--site-reveal-delay, 0ms),
    var(--site-reveal-delay, 0ms),
    var(--site-reveal-delay, 0ms),
    0s, 0s, 0s, 0s, 0s;
}

:is(button, .cta, .contact-btn, .case-back, .case-next, .text-link, .service, .nav-links a, .footer-links a):focus-visible:not(:disabled) {
  outline: 2px solid var(--accent);
  outline-offset: 5px;
}

/* Keyboard focus gets the same visual treatment as pointer hover. */
.button-arrow {
  display: inline-block;
  vertical-align: -1px;
  margin-left: 3px;
}

.cta {
  box-shadow: inset 0 0 0 1px rgba(var(--light-rgb), .14), 0 3px 8px rgba(var(--shadow-rgb), .12);
}

.cta:focus-visible,
.contact-btn:focus-visible {
  box-shadow: inset 0 0 0 1px rgba(var(--light-rgb), .18), 0 8px 24px rgba(var(--shadow-rgb), .18);
  translate: 0 -2px;
}

.cta:focus-visible {
  background-color: color-mix(in srgb, var(--accent) 90%, var(--night));
}

.contact-btn:focus-visible {
  border-color: var(--accent);
  background-color: var(--accent);
  color: var(--accent-contrast);
}

.trajectory-nav .contact-btn:focus-visible {
  color: var(--accent-contrast);
}

.lightbox-close:focus-visible,
.lightbox-nav:focus-visible,
.pdf-nav:focus-visible:not(:disabled) {
  color: var(--accent);
}

.pdf-mobile-controls button:focus-visible:not(:disabled) {
  border-color: var(--accent);
  background-color: color-mix(in srgb, var(--accent) 8%, var(--paper));
}

.trajectory-institution:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 18px 42px rgba(var(--shadow-rgb), .25), inset 0 0 24px rgba(var(--accent-rgb), .08);
}

@media (hover: hover) and (pointer: fine) {
  .cta:hover,
  .contact-btn:hover {
    box-shadow: inset 0 0 0 1px rgba(var(--light-rgb), .18), 0 8px 24px rgba(var(--shadow-rgb), .18);
    translate: 0 -2px;
  }

  .cta:hover {
    opacity: 1;
    background-color: color-mix(in srgb, var(--accent) 90%, var(--night));
  }

  .contact-btn:hover {
    border-color: var(--accent);
    background-color: var(--accent);
    color: var(--accent-contrast);
  }

  .trajectory-nav .contact-btn:hover {
    color: var(--accent-contrast);
  }

  .case-back:hover {
    color: var(--accent);
    translate: -3px 0;
  }

  .case-next:hover,
  .text-link:hover {
    color: var(--accent);
    border-color: var(--accent);
    translate: 3px 0;
  }

  .service:hover,
  .service:hover small {
    color: var(--accent);
  }

  .lightbox-close:hover,
  .lightbox-nav:hover {
    opacity: 1;
    color: var(--accent);
    background-color: rgba(var(--accent-rgb), .1);
    translate: 0 -2px;
  }

  .pdf-nav:hover:not(:disabled) {
    color: var(--accent);
    translate: 0 -2px;
  }

  .pdf-mobile-controls button:hover:not(:disabled) {
    border-color: var(--accent);
    background-color: color-mix(in srgb, var(--accent) 8%, var(--paper));
    box-shadow: 0 5px 16px rgba(var(--shadow-rgb), .06);
    translate: 0 -2px;
  }

  .trajectory-education-carousel:not(.is-dragging) .trajectory-institution:hover {
    border-color: rgba(var(--accent-rgb), .65);
    box-shadow: 0 18px 42px rgba(var(--shadow-rgb), .25), inset 0 0 24px rgba(var(--accent-rgb), .08);
  }

  .nav-links a:hover::after {
    opacity: 1;
    transform: scaleX(1);
  }
}

.nav-links a:focus-visible::after {
  opacity: 1;
  transform: scaleX(1);
}

.footer-links a {
  transition: color .3s ease;
}

.footer-links a:is(:hover, :focus-visible) {
  color: var(--accent);
}

.service small {
  transition: color .3s ease;
}

:is(.case-back, .case-next, .text-link, .service):focus-visible {
  color: var(--accent);
  border-color: var(--accent);
}

.service:focus-visible small {
  color: var(--accent);
}

:is(.cta, .contact-btn, .lightbox-close, .lightbox-nav, .pdf-nav, .pdf-mobile-controls button):active:not(:disabled) {
  translate: 0 0;
  box-shadow: none;
}

/* Disabled controls retain their neutral appearance even under the pointer. */
.pdf-nav:disabled {
  color: var(--muted);
}

@media (prefers-reduced-motion: reduce) {
  :is(.cta, .contact-btn, .case-back, .case-next, .text-link, .service, .service small, .lightbox-close, .lightbox-nav, .pdf-nav, .pdf-mobile-controls button, .trajectory-institution, .footer-links a),
  html.site-scroll-enabled :is(.cta, .case-back, .case-next, .text-link, .service).site-scroll-reveal {
    transition: none !important;
    translate: none !important;
  }
}