/* ===== Reset ============================================================== */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body { margin: 0; }

img,
svg,
video,
canvas { display: block; max-width: 100%; }

img { height: auto; }

button,
input,
select,
textarea { font: inherit; color: inherit; }

button { cursor: pointer; }

/* ===== Media frames =========================================================*/
.media { position: relative; overflow: hidden; }

.media > img,
.media > iframe {                /* iframe = embedded video filling the frame */
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
}

.media--contain > img { object-fit: contain; }

/* ===== Accessibility helpers ============================================== */

/* Visually hidden, still read by screen readers */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* "Skip to content" link — appears on the first Tab press */
.skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  z-index: 1000;
  padding: 10px 14px;
  background: var(--ink-dark);
  color: var(--ink-paper);
  text-decoration: none;
}

.skip-link:focus { top: 16px; }

:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* ===== Scroll reveal ======================================================== */
[data-reveal].reveal-init {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .62s cubic-bezier(.16, 1, .3, 1), transform .62s cubic-bezier(.16, 1, .3, 1);
}

[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal].reveal-init { opacity: 1; transform: none; transition: none; }

  /* The one deliberate !important: kill every animation for people who asked for less motion. */
  *,
  *::before,
  *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media print {
  [data-reveal].reveal-init { opacity: 1; transform: none; }
}
