/* Search results only. The shared form and site shell keep their existing geometry. */
.search-groups { margin-top: 32px; overflow-wrap: anywhere; }
.search-group + .search-group { margin-top: 40px; }
.search-group > h2 { font-size: 22px; line-height: 1.5; margin: 0; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.search-result-list { list-style: none; padding: 0; margin: 0; }
.search-result { padding: 24px 0; border-bottom: 1px solid var(--line); }
.search-result-with-image { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 20px; align-items: start; }
.search-result-thumbnail { display: block; width: 80px; height: 80px; object-fit: contain; }
.search-result-body { min-width: 0; }
.search-result-title { font-size: 18px; line-height: 1.6; margin: 0 0 8px; }
.search-result-title a { color: var(--ink); text-decoration: none; }
.search-result-title a:focus-visible { color: var(--accent); text-decoration: underline; }
@media (hover: hover) and (pointer: fine) { .search-result-title a:hover { color: var(--accent); text-decoration: underline; } }
.search-result-metadata, .search-result-summary { font-size: 14px; line-height: 1.7; margin: 0; }
.search-result-metadata { color: var(--muted); }
.search-result-metadata > span { display: block; }
.search-result-summary { margin-top: 8px; }
@media (max-width: 1023.98px) {
  .search-group > h2 { font-size: 16.5px; }
  .search-result { padding: 20px 0; }
  .search-result-with-image { grid-template-columns: 72px minmax(0, 1fr); gap: 16px; }
  .search-result-thumbnail { width: 72px; height: 72px; }
  .search-result-title { font-size: 17px; }
}
/* Below 1024px the sidebar and footer sit under the results. While the results are still being fetched
   (search.js removes [data-pending]), they stay invisible instead of being painted and then pushed down.
   Only with scripting; a fallback reveals them even if search.js never runs. */
@media (scripting: enabled) and (max-width: 1023.98px) {
  body:has(#search-results[data-pending]) :is(.sidebar, .site-footer) { visibility: hidden; animation: search-reveal 0s 1.5s forwards; }
}
@keyframes search-reveal { to { visibility: visible; } }
