.home-page { display: flex; flex-direction: column; }
.home-canvas { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 24px 40px 40px; min-width: 0; }
.home-gallery { --gap: clamp(24px, 4vw, 70px); position: relative; width: 100%; max-width: 1500px; margin: auto; }
.home-viewport { overflow: hidden; padding: 6px; }
.home-track { display: flex; gap: var(--gap); }
.home-work { flex: 0 0 100%; min-width: 0; color: #111; text-decoration: none; pointer-events: none; }
.home-work-image { display: flex; align-items: center; justify-content: center; height: clamp(300px, 70svh, 900px); }
/* Only the fitted image receives pointer clicks, not the surrounding slide. */
.home-work img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; pointer-events: auto; }
.home-work:focus-visible { outline: none; }
.home-work:focus-visible img { outline: 2px solid #005cff; outline-offset: 5px; }
.home-nav { position: absolute; top: 0; bottom: 0; z-index: 2; display: flex; align-items: center; justify-content: center; width: clamp(48px, 10vw, 120px); padding: 0; border: 0; background: transparent; color: #111; font-size: clamp(28px, 3vw, 44px); font-weight: 300; cursor: pointer; opacity: 0; transition: opacity 200ms ease; }
.home-nav-previous { left: 0; }
.home-nav-next { right: 0; }
.home-nav:hover, .home-nav:active { opacity: .4; }
.home-nav:focus-visible { opacity: .65; outline-offset: -5px; }
.home-nav span { text-shadow: 0 0 6px #fff; }
@media (prefers-reduced-motion: reduce) {
  .home-nav { transition: none; }
}
/* Keep a keyboard-accessible pause control without visible carousel chrome. */
.home-motion-control:not(:focus-visible) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.home-motion-control:focus-visible { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 10; min-height: 44px; padding: 12px 18px; border: 1px solid #005cff; background: #fff; color: #005cff; font-size: 13px; cursor: pointer; }
.home-message { font-size: 14px; line-height: 1.9; color: #686868; }
@media (max-width: 760px) {
  .home-canvas { padding: 24px 24px 40px; }
}
@media (max-width: 600px) {
  .home-gallery { --gap: 24px; }
  .home-canvas { padding: 20px 20px 32px; }
  .home-work-image { height: 65svh; }
}