/* ============================================================================
   ATOMIC LAB — SEARCH PAGE
   ========================================================================== */

.pg-search { --sect-y: clamp(2.5rem, 4vw, 4rem); }

.srch { padding-top: calc(var(--nav-h) + clamp(1.5rem, 3.5vw, 2.75rem)); padding-bottom: clamp(1rem, 2vw, 1.5rem); }
.srch__h { font-family: var(--font-display); font-size: clamp(2rem, 4.5vw, 3.25rem); font-weight: 700; letter-spacing: -0.04em; line-height: 1.05; }
.srch__lede { margin-top: 0.85rem; }
.srch__lede em { color: var(--beam); font-style: normal; }
.srch__form { margin-top: 1.75rem; }
.srch__form .bigfield { padding-left: 1.1rem; }
.srch__quick { margin-top: 0.9rem; }
.srch__quick .chip:hover { color: var(--beam); border-color: rgba(89,230,255,0.4); background: rgba(89,230,255,0.08); }
.srch__count { margin-top: 1.25rem; font-size: var(--t-2xs); letter-spacing: 0.08em; }

.srch__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 0.6rem; }

.hit {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.9rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--edge);
  border-radius: var(--r-3);
  background: linear-gradient(100deg, color-mix(in srgb, var(--fam, var(--beam)) 8%, transparent), rgba(255,255,255,0.012) 55%);
  transition: transform var(--d-2) var(--e-out), border-color var(--d-2), box-shadow var(--d-2);
}
.hit[hidden] { display: none; }
.hit:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--fam, var(--beam)) 45%, transparent);
  box-shadow: var(--lift-1);
}
.hit__sym {
  width: 46px; height: 46px; flex: none;
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 700; font-size: var(--t-md);
  color: #fff;
  background: color-mix(in srgb, var(--fam, var(--beam)) 20%, transparent);
  border: 1px solid color-mix(in srgb, var(--fam, var(--beam)) 40%, transparent);
  border-radius: var(--r-2);
}
.hit__body { min-width: 0; display: flex; flex-direction: column; gap: 0.1rem; }
.hit__name { font-weight: 600; font-size: var(--t-sm); }
.hit__meta { font-size: var(--t-3xs); color: var(--ink-3); letter-spacing: 0.05em; }
.hit__sig {
  font-size: var(--t-3xs); color: var(--ink-2); line-height: 1.5; margin-top: 0.3rem;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.hit__go { color: var(--ink-3); transition: transform var(--d-2) var(--e-out), color var(--d-2); }
.hit:hover .hit__go { transform: translateX(3px); color: var(--fam, var(--beam)); }

.srch__empty { text-align: center; margin-top: 1.5rem; }
.srch__empty code, .card__body code {
  font-family: var(--font-mono); font-size: 0.88em;
  padding: 0.1em 0.4em; border-radius: 3px;
  background: rgba(255,255,255,0.07); color: #cdf6ff;
}
