/* Mechanics page styles (kept minimal, leveraging base.css) */
.hero {
  padding: var(--space-12) 0 var(--space-10);
  background:
    radial-gradient(1000px 600px at 10% -10%, rgba(224,177,92,0.06), transparent 60%),
    radial-gradient(900px 600px at 110% 20%, rgba(142,34,48,0.06), transparent 65%);
}
.hero__inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: var(--space-10);
  align-items: center;
}
.hero__copy p { color: var(--color-muted); }
.hero__search { margin-top: var(--space-6); }
.hero__search-meta { margin-top: var(--space-3); color: var(--gray-300); font-size: var(--fs-sm); }
.hero__media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }

.toc { margin-top: var(--space-6); }
.toc__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-3); }
.toc__list a { display: block; padding: var(--space-4) var(--space-6); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-md); background: linear-gradient(180deg, rgba(224,177,92,0.05), transparent 40%); }
.toc__list a:hover { border-color: color-mix(in srgb, var(--color-primary) 50%, #000 50%); }

.section { padding: var(--space-12) 0; }

/* Responsive */
@media (max-width: 960px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero { padding-top: var(--space-10); }
}

/* Subtle highlight for filtered state */
[data-filtered="true"] { outline: 2px dashed rgba(224,177,92,0.25); outline-offset: 6px; border-radius: var(--radius-md); }

/* Hide helper */
.is-hidden { display: none !important; }