/*
Theme Name: Ascent People Development
Theme URI: https://ascentdevelopment.co.uk
Author: Chiltern
Description: Block theme for Ascent People Development. Design tokens live in theme.json — do not hardcode colours, spacing or type here. Reference implementation for the design is in /mockups at the project root.
Version: 0.2.2
Update URI: https://ascentdevelopment.co.uk/themes/ascent-people-development/
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ascent
Tags: block-theme, accessibility-ready, full-site-editing
*/

/*
 * Global styles are in theme.json.
 * Component CSS that blocks genuinely cannot express is in assets/css/.
 * Enqueued per-pattern from functions.php — see wp_enqueue_block_style().
 *
 * Only three things belong in this file:
 *   1. The theme header above
 *   2. Accessibility primitives that must load on every page
 *   3. Reduced-motion overrides
 */

/* ---------- Accessibility primitives ---------- */

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  background: var(--wp--preset--color--ink);
  color: #fff;
  padding: 14px 22px;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Photography slots keep their approved geometry when an editor supplies an image. */
.ph.has-ascent-image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.ph.has-ascent-image::before,
.ph.has-ascent-image::after {
  display: none;
}
.skip-link:focus {
  left: 0;
}

:focus-visible {
  outline: 2px solid var(--wp--preset--color--ochre);
  outline-offset: 3px;
}

/* The site header is position:fixed — anchor targets must clear it. */
:where([id]) {
  scroll-margin-top: 110px;
}

/* ---------- Motion ---------- */

.ascent-reveal {
  opacity: 0;
  transform: translateY(26px);
  transition:
    opacity 0.9s var(--wp--custom--ease),
    transform 0.9s var(--wp--custom--ease);
}
.ascent-reveal.is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .ascent-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
