/* Search: Arc search-field + list rows; Praxiom answer card uses Beautiful UI Shimmer while loading. */
.srch-head { background: #fff; border-bottom: 1px solid var(--border); padding: clamp(32px, 6vw, 64px) 0 clamp(24px, 4vw, 40px); }
.srch-form { display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 16px; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px var(--border-strong), 0 8px 24px -12px rgb(7 29 58 / .2); transition: box-shadow 150ms ease-out; }
.srch-form:focus-within { box-shadow: 0 0 0 1px var(--ink), 0 0 0 4px rgb(242 183 5 / .3), 0 8px 24px -12px rgb(7 29 58 / .2); }
.srch-form > i { font-size: 1.25rem; color: var(--text-3); }
.srch-input { flex: 1; min-width: 0; height: 44px; border: 0; outline: 0; background: transparent; font-size: 1.0625rem; color: var(--ink); }
.srch-input::-webkit-search-cancel-button { cursor: pointer; }
.srch-hint { margin: 16px 0 12px; color: var(--text-2); }
.srch-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.srch-chips a { display: inline-block; padding: 8px 12px; border-radius: 999px; background: var(--paper); box-shadow: inset 0 0 0 1px var(--border); text-decoration: none; font-size: var(--text-sm); font-weight: 500; transition: box-shadow 150ms ease-out, background-color 150ms; }
@media (hover: hover) and (pointer: fine) { .srch-chips a:hover { background: #fff; box-shadow: inset 0 0 0 1px var(--border-strong); } }
.srch-body { padding: 32px 0 clamp(48px, 8vw, 96px); }
.srch-answer { display: grid; grid-template-columns: 28px 1fr; gap: 12px; padding: 18px; margin-bottom: 16px; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px var(--border); }
.srch-answer img { border-radius: 8px; }
.srch-answer-label { margin: 0 0 4px; font-size: var(--text-xs); font-weight: 600; color: var(--text-3); }
.srch-answer-text { margin: 0; color: var(--ink); line-height: 1.6; }
.srch-answer.is-empty { display: none; }
.srch-shimmer { display: inline-block; background-image: linear-gradient(90deg, var(--text-3) 35%, var(--ink) 50%, var(--text-3) 65%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: srch-shimmer 1.8s linear infinite; }
@keyframes srch-shimmer { from { background-position: 150% center; } to { background-position: -50% center; } }
.srch-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 14px; margin-bottom: 28px; border-radius: 18px; background: var(--ink); color: #fff; text-decoration: none; transition: transform 200ms var(--ease-standard), box-shadow 200ms; }
.srch-top-img { width: 120px; aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; background: var(--ink-3); }
.srch-top-img img { width: 100%; height: 100%; object-fit: cover; }
.srch-top-body { display: grid; gap: 4px; min-width: 0; }
.srch-top-body small { font-size: var(--text-xs); color: rgb(255 255 255 / .75); }
.srch-top-body b { font: 600 var(--h4)/1.25 var(--f-display); }
.srch-top-body > span { font-size: var(--text-sm); color: rgb(255 255 255 / .82); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.srch-top > i { font-size: 1.25rem; margin-right: 6px; }
@media (hover: hover) and (pointer: fine) { .srch-top:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -14px rgb(7 29 58 / .6); } }
@media (max-width: 560px) { .srch-top { grid-template-columns: 1fr auto; } .srch-top-img { display: none; } }
.srch-group { margin-bottom: 28px; }
.srch-group h2 { font-size: var(--h4); margin-bottom: 8px; }
.srch-group ul { list-style: none; margin: 0; padding: 0; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px var(--border); overflow: hidden; }
.srch-group li + li { border-top: 1px solid #eef0f2; }
.srch-group a { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 18px; text-decoration: none; transition: background-color 150ms; }
.srch-group a span { display: grid; gap: 2px; min-width: 0; }
.srch-group b { font-weight: 600; }
.srch-group small { color: var(--text-2); font-size: var(--text-sm); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.srch-group a > i { color: #8a96a3; transition: transform 160ms var(--ease-standard); }
@media (hover: hover) and (pointer: fine) { .srch-group a:hover { background: #f9faf9; } .srch-group a:hover > i { transform: translateX(2px); color: var(--ink); } }
.srch-meta { font-size: var(--text-xs); color: var(--text-3); }
.srch-empty { text-align: center; padding: 40px 16px; border-radius: 18px; background: #fff; box-shadow: 0 0 0 1px var(--border); }
.srch-empty p { color: var(--text-2); margin: 8px 0 20px; }
@media (prefers-reduced-motion: reduce) { .srch-shimmer { animation: none; color: var(--text-2); background: none; } }
