/* ==========================================================================
   Soft Oceans — base.css
   Extensions to the reset in tokens.css.
   Owns: AA link colors (PLAN.md D-13), focus visibility, skip link, anchor
   offsets under the sticky header, [hidden] hardening, and the .js
   progressive-enhancement scoping for scroll reveal (D-7).
   ========================================================================== */

/* Interactive blue meets 4.5:1 on white; brand blue stays for icons/accents */
a { color: var(--c-link); }
a:hover { color: var(--c-primary-600); }

:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 2px; }

/* Anchor targets clear the 72px sticky header (D-14.2) */
[id] { scroll-margin-top: 84px; }

/* display-mode components (grid/flex) must still respect [hidden] */
[hidden] { display: none !important; }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--c-navy); color: var(--c-white);
  padding: 12px 20px; border-radius: 0 0 var(--radius-sm) 0; font-weight: 600;
}
.skip-link:focus { left: 0; }

/* Scroll reveal exists only when JS runs (D-7); section-level, one stagger max */
.js .reveal {
  opacity: 0; transform: translateY(12px);
  transition: opacity .5s var(--ease), transform .5s var(--ease);
}
.js .reveal.revealed { opacity: 1; transform: none; }

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