/* Device search: homepage hero + quote step 1. Results sit in the flow, not
   absolutely positioned, because .lf-hero clips overflow (for the bolt). */
.lf-search { max-width: 520px; margin-top: var(--lf-space-28); }
.lf-search .lf-search-input { /* .lf-search: reset.css input[type=search] (1px #666 border, padding) outranks a single class */
    scroll-margin-top: var(--lf-space-16); /* search.js scrolls it to the top on phones */
    font-family: var(--lf-font-body);
    font-size: var(--lf-text-base); /* 16px stops iOS zooming on focus */
    color: var(--lf-ink);
    background: var(--lf-paper);
    border: var(--lf-border) solid var(--lf-ink);
    border-radius: 0;
    padding: var(--lf-space-16) var(--lf-space-16);
    width: 100%;
    -webkit-appearance: none;
    appearance: none;
}
.lf-search .lf-search-input:focus { outline: none; background: #fff; box-shadow: none; border-color: var(--lf-ink); } /* a third-party focus rule adds a white 4px ring */
.lf-search-input::placeholder { color: var(--lf-muted-on-paper); }
.lf-search-input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.lf-search-results {
    list-style: none;
    margin: 0;
    padding: 0;
    background: var(--lf-paper);
    border: var(--lf-border) solid var(--lf-ink);
    border-top: 0;
}
.lf-search-results[hidden] { display: none; }
.lf-search-results [role="option"] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--lf-space-12);
    padding: var(--lf-space-12) var(--lf-space-16);
    border-bottom: 1px solid var(--lf-muted-on-ink);
    cursor: pointer;
    color: var(--lf-ink);
}
.lf-search-results [role="option"]:last-child { border-bottom: 0; }
.lf-search-results .lf-search-active { background: var(--lf-ink); color: var(--lf-paper); }
.lf-search-name { font-weight: 600; }
.lf-search-meta { font-family: var(--lf-font-mono); font-size: var(--lf-text-xs); opacity: .75; text-align: right; }
.lf-search-empty { padding: var(--lf-space-12) var(--lf-space-16); color: var(--lf-muted-on-paper); font-size: var(--lf-text-sm); }

/* Quote step 1: sits above the category tiles. */
.lq-step .lf-search { margin: 0 0 var(--lf-space-24); max-width: none; }

/* Header strip (every page but home and quote): second row of the nav. Results overlay the
   page here. z-index stays under the mobile burger menu (100) so an open menu covers it. */
.lf-nav-search { background: var(--lf-ink); padding: 0 var(--lf-gutter) var(--lf-space-16); position: relative; z-index: 90; }
.lf-nav-search .lf-search { margin: 0; max-width: 560px; position: relative; }
.lf-nav-search .lf-search-input, .lf-nav-search .lf-search-input:focus { padding: var(--lf-space-12) var(--lf-space-16); border-color: var(--lf-paper); box-shadow: none; }
.lf-nav-search .lf-search-results { position: absolute; top: 100%; left: 0; right: 0; }