/* Keep the lightbox status available to screen readers without a visible caption. */
.gallery-lightbox__caption {
  display: block !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Make keyboard focus apparent on every form control, including the checkbox. */
.contact-form input:focus-visible,
.contact-form textarea:focus-visible,
.contact-form select:focus-visible {
  outline: 3px solid #ef365f;
  outline-offset: 3px;
}

/* A keyboard target must never remain hidden behind a scroll reveal. */
.js [data-reveal]:focus-within {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

/* Opacity may animate the intro, but visibility:hidden removes its text from
   the accessibility tree before a visitor scrolls there. */
.js .paper-intro__copy > * {
  visibility: visible !important;
}

/* If keyboard focus advances into an unrevealed image, show that target. */
.js .scroll-image:focus-within,
.js .polaroid:focus-within {
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Scrolling galleries remain operable by keyboard, even before reveal motion ends. */
.image-ribbon:focus-visible,
.clients__viewport:focus-visible {
  outline: 3px solid #ef365f;
  outline-offset: 3px;
}
.js .image-ribbon:focus-within .scroll-image {
  visibility: visible !important;
  opacity: 1 !important;
  clip-path: none !important;
}

/* The short first navigation item needs a 24px target at desktop sizes. */
.main-nav a {
  display: inline-flex;
  align-items: center;
  min-width: 28px;
  min-height: 44px;
}

.marcel-menu-toggle { display: none; }
@media (max-width: 1050px) {
  .marcel-menu-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 2.75rem; min-height: 2.75rem;
    color: #fff; background: transparent; border: 1px solid #fff8;
    border-radius: .35rem; font: 700 .75rem/1.2 Poppins, Arial, sans-serif;
    cursor: pointer;
  }
  .marcel-menu-toggle:focus-visible { outline: 3px solid #ef365f; outline-offset: 3px; }
  .site-header.is-menu-open .main-nav {
    display: flex; position: absolute; top: 100%; right: 0; left: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    max-height: calc(100dvh - var(--header-h)); overflow-y: auto;
    padding: .5rem var(--gutter) 1rem;
    background: #190c11; box-shadow: 0 .8rem 1.5rem #0008;
  }
  .site-header.is-menu-open .main-nav a,
  .site-header.is-menu-open .main-nav .nav-placeholder {
    display: block; padding: .65rem 0;
  }
}
@media (max-width: 720px) {
  .header-actions { gap: .3rem !important; }
  .marcel-menu-toggle { margin-top: .05rem; }
}