/* WordPress-specific additions to the original stylesheet. */

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* Keep the sticky navbar below the WordPress toolbar when logged in. */
.admin-bar .navbar {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar .navbar {
    top: 46px;
  }
}

/* Honeypot field of the contact form. */
.hp-field {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Editor content inside articles. */
.prose img,
.prose figure {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius);
}

.prose figure {
  margin: 2rem 0;
}

.prose figcaption {
  margin-top: 0.5rem;
  font-size: 0.85rem;
  color: rgb(var(--muted));
}

.prose blockquote {
  margin: 2rem 0;
  padding-left: 1.25rem;
  border-left: 3px solid rgb(var(--accent));
  color: rgb(var(--muted));
}

.article__hero img {
  width: 100%;
  height: auto;
}

/* Archive pagination. */
.nav-links .page-numbers {
  display: inline-flex;
  min-width: 2.5rem;
  height: 2.5rem;
  align-items: center;
  justify-content: center;
  margin-right: 0.35rem;
  border: 1px solid rgb(var(--border));
  border-radius: 999px;
  font-size: 0.9rem;
}

.nav-links .page-numbers.current {
  color: #fff;
  border-color: transparent;
  background-image: linear-gradient(120deg, rgb(var(--accent)), rgb(var(--accent-2)));
}

/* Buttons inside articles (core Buttons block): same look as the site's primary button. */
.wp-block-buttons {
  margin: 2rem 0;
}

.wp-block-button .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  padding: 0.85rem 1.6rem;
  border-radius: 999px;
  background-color: transparent;
  background-image: linear-gradient(120deg, #0b6a99, #16325c, #0b6a99);
  background-size: 300% 100%;
  animation: gradient-pan 8s linear infinite;
  box-shadow: 0 12px 30px -12px rgb(var(--accent) / 0.6);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
}

.wp-block-button .wp-block-button__link:hover {
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 18px 40px -12px rgb(var(--accent) / 0.7);
}