.fn-hub-hero { padding-bottom: 3.5rem; }
.fn-work-section { padding: 3.5rem 0; }
.fn-work-card { min-height: 0; padding: 0; overflow: hidden; }
.fn-card-image { display: block; width: 100%; height: auto; aspect-ratio: 1400 / 934; object-fit: contain; background: #07111f; }
.fn-card-copy { display: flex; flex: 1; flex-direction: column; padding: 1.5rem; }
.fn-card-copy p { flex: 1; }
.fn-work-card:focus-visible,
.fn-details summary:focus-visible { outline: 3px solid #0d5b9f; outline-offset: 5px; }
.fn-context-note { max-width: 800px; margin: 1.5rem 0 0; color: var(--lc-muted); font-size: .95rem; line-height: 1.7; }
.fn-observations { margin: 1.5rem 0 2rem; }
.fn-observations li { line-height: 1.75; }
.fn-observations li + li { margin-top: .5rem; }
.fn-details { margin: 2.5rem 0 0; padding: 1.25rem 1.5rem; color: var(--lc-ink); border: 1px solid var(--lc-line); border-radius: 1rem; background: #f7fbfe; }
.fn-details summary { cursor: pointer; font-weight: 700; line-height: 1.6; }
.fn-details-body { padding-top: 1rem; color: var(--lc-muted); }
.fn-details-body p,
.fn-details-body li { line-height: 1.75; }
.fn-details-body li + li { margin-top: .5rem; }
.fn-details-body > :last-child { margin-bottom: 0; }
.fn-article-note { margin: 0 0 1.5rem; color: var(--lc-muted); font-size: .95rem; line-height: 1.7; }
@media (max-width: 576px) {
  .fn-hub-hero { padding-bottom: 3rem; }
  .fn-work-section { padding: 2.75rem 0; }
  .fn-card-copy,
  .fn-details { padding: 1.2rem; }
}