/* ============================================================
   busca.css — Página de busca interna
   ============================================================ */

html, body { height: 100%; }
body { display: flex; flex-direction: column; min-height: 100vh; }
#site-header ~ * { flex: none; }
.results-wrap { flex: 1; }
.search-hero { max-width: 720px; margin: 0 auto; padding: 5rem 1.5rem 2rem; text-align: center; }
.search-hero h1 { font-family: var(--font-display); font-size: clamp(2rem, 5vw, 3rem); font-weight: 700; margin-bottom: 0.5rem; }
.search-hero h1 em { color: var(--green); font-style: italic; }
.search-hero p { color: var(--muted-1); font-size: 1rem; margin-bottom: 2rem; }

.search-box-wrap { max-width: 960px; width: 90%; margin: 0 auto 3rem; padding: 0 1.5rem; }
.search-box { display: flex; align-items: center; gap: 0.75rem; background: var(--bg-card); border: 1px solid var(--muted-3); border-radius: 16px; padding: 1.2rem 1.75rem; transition: border-color 0.2s; }
.search-box:focus-within { border-color: var(--green-border); }
.search-box svg { flex-shrink: 0; color: var(--muted-2); }
.search-box input { flex: 1; background: none; border: none; outline: none; font-family: var(--font-body); font-size: 1.1rem; color: var(--text); }
.search-box input::placeholder { color: var(--muted-2); }
.search-clear { background: none; border: none; cursor: pointer; color: var(--muted-2); padding: 0; display: none; }
.search-clear:hover { color: var(--text); }

.results-wrap { max-width: 720px; margin: 0 auto; padding: 0 1.5rem 4rem; }

.results-count { font-size: 0.82rem; color: var(--muted-2); margin-bottom: 1.5rem; }

.results-group { margin-bottom: 2.5rem; }
.results-group-title { font-size: 0.68rem; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--muted-2); margin-bottom: 0.75rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--muted-3); }

.result-item { display: flex; align-items: flex-start; gap: 1rem; padding: 1rem 1.1rem; background: var(--bg-card); border: 1px solid var(--muted-3); border-radius: 14px; text-decoration: none; color: inherit; margin-bottom: 0.5rem; transition: border-color 0.2s, background 0.2s; }
.result-item:hover { border-color: var(--green-border); background: var(--bg-hover); }
.result-icon { width: 36px; height: 36px; border-radius: 10px; background: var(--green-glow); border: 1px solid var(--green-border); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
.result-icon svg { color: var(--green); }
.result-body { flex: 1; min-width: 0; }
.result-title { font-size: 0.95rem; font-weight: 600; color: var(--text); margin-bottom: 0.2rem; }
.result-title mark { background: none; color: var(--green); font-weight: 700; }
.result-desc { font-size: 0.82rem; color: var(--muted-1); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.result-tag { font-size: 0.68rem; color: var(--muted-2); margin-top: 0.3rem; }

.empty-state { text-align: center; padding: 3rem 0; color: var(--muted-2); }
.empty-state svg { margin-bottom: 1rem; color: var(--muted-3); }
.empty-state p { font-size: 0.95rem; }

.initial-state { text-align: center; padding: 2rem 0; color: var(--muted-2); font-size: 0.9rem; }
.initial-state a { color: var(--green); text-decoration: none; }
.initial-state a:hover { text-decoration: underline; }