/*
 * Utilities
 *
 * Layout helpers, accessibility utilities, skip link, focus styles.
 * Dependencies: tokens.css
 */

/* ── Layout ── */
.container { max-width: var(--max-width); margin: 0 auto; width: 100%; }

.page-content,
main.page-content,
main.page-content.wp-block-group {
  display: flex; flex-direction: column; gap: 0;
}
/* Override WP block gap */
.page-content > * + * {
  margin-top: 0;
}

/* Full-width blocks break out of constrained parents */
.page-content > .alignfull,
.page-content > .wp-block-cover.alignfull,
.page-content > .wp-block-group.alignfull {
  width: 100%;
  max-width: none;
}

/* ── Accessibility ── */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ── Skip Link ── */
.skip-link {
  position: absolute; top: -100%; left: 16px; z-index: 10000;
  padding: 12px 24px; background: var(--color-navy); color: #fff;
  font-family: var(--font-heading); font-weight: 600; font-size: 16px;
  border-radius: 0 0 8px 8px;
  transition: top 0.2s ease;
}
.skip-link:focus { top: 0; }

/* ── Text Utilities ── */
.text-balance { text-wrap: balance; }
.text-center  { text-align: center; }
.text-left    { text-align: left; }
.text-right   { text-align: right; }

/* ── Focus Styles ── */
:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .container { padding: 0 24px; }
  .page-content { gap: 0; }
}
@media (max-width: 768px) {
  .container { padding: 0 16px; }
  .page-content { gap: 0; }
}