/* Animation index page (work/animation.html) — reuses the illustration
   section's styling wholesale (doubled main width, .illustration-hero
   header, .illustration-grid/.illustration-card-* card grid) so this page
   looks exactly like the Illustration index page. */
@import url("illustration.css");

/* Only one showcase card lives on this page so far (Breakfast) — the
   shared 2-column grid from illustration.css (built for the Illustration
   index's real link-cards) would leave it stranded in a half-empty row.
   Drop back to a plain block here instead. */
.illustration-grid {
  display: block;
}

/* .illustration-card-frame/.illustration-card-anim's shared rules
   (box-shadow, hover-dim/title-reveal, magnetic pull — all inherited via
   .illustration-card-link, carried on the same <a> as .illustration-
   card-frame in this page's markup — plus the base shape/background) now
   live in illustration.css. This page only needs its own width: narrower
   than the full doubled main, fixed to exactly as wide as the
   Illustration index's two hero-image cards plus the 1.5rem gap between
   them (main's doubled max-width, 88rem, minus main's own 1.5rem+1.5rem
   side padding = 85rem), rather than the standard single-column reading
   width. */
.illustration-card-frame {
  width: calc(var(--max-width) * 2 - 3rem);
  max-width: 100%;
  margin: 0 auto;
}