/*
 * WordPress-specific additions on top of the approved design.
 * Keep this file small: design lives in the component stylesheets.
 */

/* Gallery items hidden by the "show more" / filter logic. */
.work-gallery__item[hidden] {
  display: none;
}

/* Admin bar: keep the fixed sticky header below it. */
.admin-bar .site-header.is-sticky .header-main {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar .site-header.is-sticky .header-main {
    top: 46px;
  }
}

/* Form status messages. */
.contact-form__status.is-error,
.course-modal__status.is-error {
  color: var(--color-accent);
}

/* Honeypot field: invisible for people, present for bots. */
input[name="website"].visually-hidden {
  position: absolute;
  left: -9999px;
}

/* Pagination (blog). */
.oxy-pagination,
.blog-index .page-numbers {
  font-size: var(--text-sm);
}

.oxy-pagination .nav-links,
.blog-index ul.page-numbers {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  justify-content: center;
  margin: var(--space-6) 0 0;
  padding: 0;
  list-style: none;
}

.oxy-pagination .page-numbers,
.blog-index ul.page-numbers .page-numbers {
  display: inline-flex;
  min-width: 2.5rem;
  min-height: 2.5rem;
  align-items: center;
  justify-content: center;
  padding: 0 var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  color: var(--color-text);
  text-decoration: none;
  transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

.oxy-pagination .page-numbers.current,
.oxy-pagination .page-numbers:hover,
.blog-index ul.page-numbers .page-numbers.current,
.blog-index ul.page-numbers .page-numbers:hover {
  border-color: var(--color-accent);
  background: var(--color-accent);
  color: var(--color-white);
}

.oxy-pagination .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

/* Reviews module: let embedded widgets use the full width. */
.reviews-placeholder > * {
  max-width: 100%;
}

/* Blog posts keep core block styles (tables, quotes…), whose unlayered `figure { margin }`
   beats the layered .container rule: restore centering for the cover figure. */
.blog-post__cover.container {
  margin-inline: auto;
}

/* Embed module (third-party widgets such as online booking). */
.embed-block {
  padding-block: clamp(1.5rem, 3vw, 3rem) var(--section-space);
}

.embed-block__header {
  margin-bottom: clamp(1.25rem, 2.5vw, 2.25rem);
}

.embed-block__header h2 {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--section-title-size);
  font-weight: var(--font-weight-medium);
  line-height: 0.95;
  letter-spacing: -0.06em;
}

.embed-block__header h2 span {
  display: block;
  margin-top: 0.4em;
  color: var(--color-accent);
}

.embed-block__header p {
  max-width: 40rem;
  margin: 1rem 0 0;
}

.embed-block--center .embed-block__body {
  display: flex;
  max-width: 40rem;
  margin-inline: auto;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  flex-direction: column;
  align-items: center;
  background: var(--color-block);
  border-radius: clamp(1.25rem, 2vw, 1.75rem);
}

.embed-block__body iframe {
  max-width: 100%;
}