/* ============================================================================
   base.css - element defaults, typography scale, focus, motion.
   ========================================================================== */

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

body{
  font-family:var(--font-body);
  font-size:var(--text-base);
  line-height:1.62;
  color:var(--color-ink);
  background:var(--color-bg);
}

h1,h2{font-family:var(--font-display);font-weight:900;line-height:1.06;letter-spacing:-.02em;text-wrap:balance}
h3,h4,h5,h6{font-family:var(--font-body);font-weight:800;letter-spacing:-.03em;line-height:1.2}

a{color:inherit;text-underline-offset:.18em}
.entry-content a{color:var(--color-accent-deep);text-decoration:underline;text-decoration-thickness:1px}
.entry-content a:hover{text-decoration-thickness:2px}

::selection{background:var(--color-accent-pale);color:var(--color-ink)}

/* ---- FOCUS ---------------------------------------------------------------
   Replaces the old rgba(228,115,142,.55) ring, which was 1.77:1 on white and
   failed WCAG 1.4.11. Ring plus halo so it survives on any surface.
   ------------------------------------------------------------------------ */
:focus{outline:none}
:focus-visible{
  outline:var(--focus-ring-width) solid var(--color-focus-ring);
  outline-offset:var(--focus-ring-offset);
  border-radius:6px;
  box-shadow:0 0 0 calc(var(--focus-ring-offset) + var(--focus-ring-width)) var(--color-focus-halo);
}
.cd-next :focus-visible,
.cd-subs :focus-visible,
.fl:hover :focus-visible,
.fl:focus-within :focus-visible{
  outline-color:var(--color-focus-ring-invert);
  box-shadow:none;
}
@media (forced-colors:active){
  :focus-visible{outline:3px solid Highlight;box-shadow:none}
}

/* ---- SKIP LINK ----------------------------------------------------------- */
.cd-skip{position:absolute;left:-9999px;top:0;z-index:999;background:var(--color-ink);color:var(--color-text-invert);padding:12px 20px;border-radius:0 0 var(--radius-md) 0;font-weight:700}
.cd-skip:focus-visible{left:0}

/* ---- MOTION -------------------------------------------------------------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .55s cubic-bezier(.22,.61,.36,1),transform .55s cubic-bezier(.22,.61,.36,1)}
.rv.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}