/* ==========================================================================
   ALBINI E CASTELLI — WordPress-only additions

   Everything else under assets/css is a verbatim copy of the static build, so
   that a diff between the two trees stays meaningful. This file is the one
   place for rules the static build had no need for, because they exist to
   support WordPress chrome rather than the Figma design.
   ========================================================================== */

/* --- Skip link -----------------------------------------------------------
   The static build had no skip link; a keyboard user landing on a WordPress
   site expects one. Hidden using the same technique as .visually-hidden in
   base.css, but it must become visible when focused — that is the entire
   point of it. */
.skip-link {
  position: absolute;
  top: 0;
  left: 0;
  z-index: calc(var(--z-drawer) + 10);
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.skip-link:focus {
  width: auto;
  height: auto;
  margin: 0;
  padding: 12px 20px;
  overflow: visible;
  clip-path: none;
  background: var(--c-surface);
  color: var(--c-accent);
  font-weight: var(--fw-body-sm-med);
  font-size: var(--fs-body-sm-med);
  line-height: var(--lh-body-sm-med);
  outline: 2px solid var(--c-accent);
  outline-offset: -2px;
}

/* --- Admin bar -----------------------------------------------------------
   The bar is position:fixed for logged-in users, and .site-header--over is
   absolutely positioned at top:0, so the two overlap on the home page.
   Front-end only; never applies to a logged-out visitor or a screenshot
   taken by the pixel-diff run. */
body.admin-bar .site-header--over { top: 32px; }
body.admin-bar .site-header--over.is-stuck { top: 32px; }

@media screen and (max-width: 782px) {
  body.admin-bar .site-header--over,
  body.admin-bar .site-header--over.is-stuck { top: 46px; }
}
