.sp-search {
    --sp-ink: #172b35;
    --sp-muted: #5c6c73;
    --sp-line: #dce5e7;
    --sp-paper: #ffffff;
    --sp-soft: #f3f7f6;
    --sp-accent: #176b63;
    --sp-accent-dark: #0e514c;
    --sp-warm: #d9934f;
    color: var(--sp-ink);
    font-family: inherit;
    margin: 0 auto;
    max-width: 1180px;
    padding: clamp(24px, 5vw, 64px) clamp(16px, 3vw, 36px) 72px;
}

.socrapedia-search-page .entry-header { display: none; }
.socrapedia-search-page .site-main { padding-top: 0; }

.sp-search *, .sp-search *::before, .sp-search *::after { box-sizing: border-box; }

.sp-search__hero {
    background: #fff;
    border: 0;
    border-radius: 0;
    overflow: visible;
    padding: clamp(28px, 6vw, 68px);
    position: relative;
}

.sp-search__alpha {
    color: #1467c8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    margin: 0 0 14px;
    text-transform: uppercase;
}

.sp-search__eyebrow {
    color: var(--sp-accent);
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .16em;
    margin: 0 0 12px;
    text-transform: uppercase;
}

.sp-search__title {
    color: var(--sp-ink);
    font-size: clamp(36px, 6vw, 58px);
    letter-spacing: -.045em;
    line-height: 1.05;
    margin: 0;
    max-width: 780px;
}

.sp-search__description {
    color: var(--sp-muted);
    font-size: clamp(17px, 2vw, 21px);
    line-height: 1.55;
    margin: 20px 0 34px;
    max-width: 680px;
}

.sp-search__access-status {
    background: #f4f7fb;
    border-left: 3px solid #9eb7cc;
    color: #435c6b;
    font-size: 14px;
    line-height: 1.45;
    margin: -14px 0 24px;
    max-width: 680px;
    padding: 10px 13px;
}

.sp-search__form { margin: 0; max-width: 850px; position: relative; z-index: 4; }
.sp-search__label { display: block; font-size: 14px; font-weight: 700; margin: 0 0 9px; }
.sp-search__input-row { align-items: stretch; display: flex; gap: 10px; }
.sp-search__input-wrap { flex: 1; min-width: 0; position: relative; }
.sp-search__input-icon {
    fill: none;
    height: 22px;
    left: 19px;
    pointer-events: none;
    position: absolute;
    stroke: #718087;
    stroke-linecap: round;
    stroke-width: 1.8;
    top: 18px;
    width: 22px;
    z-index: 2;
}

.sp-search__input {
    appearance: none;
    background: var(--sp-paper);
    border: 1px solid #c8d5d7;
    border-radius: 14px;
    box-shadow: 0 8px 30px rgba(30, 63, 72, .08);
    color: var(--sp-ink);
    font: inherit;
    font-size: 17px;
    height: 58px;
    outline: none;
    padding: 0 20px;
    transition: border-color .18s, box-shadow .18s;
    width: 100%;
}

.sp-search__input:focus {
    border-color: var(--sp-accent);
    box-shadow: 0 0 0 4px rgba(23, 107, 99, .13), 0 10px 32px rgba(30, 63, 72, .11);
}

.sp-search .sp-search__submit {
    align-items: center;
    background: var(--sp-accent);
    border: 0;
    border-radius: 14px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 750;
    gap: 10px;
    justify-content: center;
    min-height: 58px;
    padding: 0 26px;
    transition: background .18s, transform .18s;
}

.sp-search .sp-search__submit:hover { background: var(--sp-accent-dark); transform: translateY(-1px); }
.sp-search__submit:focus-visible, .sp-search__more:focus-visible { outline: 3px solid rgba(23, 107, 99, .3); outline-offset: 3px; }
.sp-search__submit svg { fill: none; height: 20px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; width: 20px; }
.sp-search__hint { color: #718087; font-size: 13px; margin: 9px 0 0; }

.sp-search__autocomplete {
    background: #fff;
    border: 1px solid var(--sp-line);
    border-radius: 12px;
    box-shadow: 0 18px 44px rgba(25, 51, 60, .18);
    left: 0;
    max-height: 330px;
    overflow: auto;
    padding: 7px;
    position: absolute;
    right: 0;
    top: calc(100% + 7px);
    z-index: 20;
}

.sp-search__autocomplete-option {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: var(--sp-ink);
    cursor: pointer;
    display: flex;
    font: inherit;
    gap: 10px;
    padding: 11px 12px;
    text-align: left;
    width: 100%;
}

.sp-search__autocomplete-option::before { background: var(--sp-warm); border-radius: 50%; content: ""; height: 7px; width: 7px; }
.sp-search__autocomplete-option:hover, .sp-search__autocomplete-option[aria-selected="true"] { background: var(--sp-soft); }

.sp-search__workspace { margin-top: 38px; }
.sp-search__status { border-bottom: 1px solid var(--sp-line); font-size: 17px; font-weight: 700; margin-bottom: 24px; padding: 0 2px 16px; }
.sp-search__status small { color: var(--sp-muted); display: block; font-size: 13px; font-weight: 500; margin-top: 4px; }
.sp-search__categories { border-bottom: 1px solid var(--sp-line); display: flex; gap: 6px; margin: -8px 0 24px; overflow-x: auto; padding: 0 0 10px; }
.sp-search__category { background: transparent; border: 0; border-radius: 999px; color: #40586c; cursor: pointer; flex: 0 0 auto; font: inherit; font-size: 14px; font-weight: 700; min-height: 44px; padding: 9px 15px; }
.sp-search__category:hover { background: #edf4f7; color: #082b40; }
.sp-search__category[aria-pressed="true"] { background: #082b40; color: #fff; }
.sp-search__category:focus-visible, .sp-search-candidate a:focus-visible { outline: 3px solid rgba(23, 107, 99, .3); outline-offset: 2px; }
.sp-search__layout { display: grid; gap: 34px; grid-template-columns: minmax(0, 1fr); }
.sp-search__layout:has(.sp-search__facets:not([hidden])) { grid-template-columns: 220px minmax(0, 1fr); }
.sp-search__facets { align-self: start; background: var(--sp-soft); border-radius: 16px; padding: 18px; position: sticky; top: 24px; }
.sp-search__facet + .sp-search__facet { border-top: 1px solid var(--sp-line); margin-top: 16px; padding-top: 16px; }
.sp-search__facet h3 { font-size: 13px; letter-spacing: .08em; margin: 0 0 8px; text-transform: uppercase; }
.sp-search__facet p { color: var(--sp-muted); font-size: 13px; margin: 4px 0; }
.sp-search__results { display: grid; gap: 15px; }

.sp-search-result {
    background: var(--sp-paper);
    border: 1px solid var(--sp-line);
    border-radius: 17px;
    box-shadow: 0 6px 24px rgba(29, 58, 66, .045);
    padding: clamp(20px, 3vw, 28px);
    transition: border-color .18s, box-shadow .18s, transform .18s;
}

.sp-search-result:hover { border-color: #b9ceca; box-shadow: 0 12px 34px rgba(29, 58, 66, .09); }
.sp-search-result__meta { align-items: center; color: var(--sp-accent); display: flex; font-size: 12px; font-weight: 750; gap: 8px; letter-spacing: .07em; text-transform: uppercase; }
.sp-search-result__title { font-size: clamp(21px, 3vw, 28px); letter-spacing: -.025em; line-height: 1.15; margin: 10px 0 9px; }
.sp-search-result__title a { color: var(--sp-ink); text-decoration: none; }
.sp-search-result__title a:hover { color: var(--sp-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.sp-search-result__excerpt { color: var(--sp-muted); font-size: 16px; line-height: 1.62; margin: 0; }
.sp-search-result__explanation { border-top: 1px solid #edf1f2; color: var(--sp-muted); font-size: 13px; margin-top: 18px; padding-top: 12px; }
.sp-search-result__explanation summary { color: var(--sp-accent); cursor: pointer; font-weight: 700; }
.sp-search-result__explanation div { line-height: 1.55; padding-top: 9px; }

.sp-search__candidates { border-top: 1px solid var(--sp-line); margin-top: 34px; padding-top: 28px; }
.sp-search__candidate-eyebrow { color: var(--sp-warm); font-size: 12px; font-weight: 800; letter-spacing: .12em; margin: 0 0 7px; text-transform: uppercase; }
.sp-search__candidates > h2 { font-size: clamp(23px, 3vw, 30px); margin: 0 0 8px; }
.sp-search__candidates > p:not(.sp-search__candidate-eyebrow) { color: var(--sp-muted); margin: 0 0 18px; }
.sp-search__candidate-results { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sp-search-candidate { background: #fffaf3; border: 1px solid #ecd9bd; border-radius: 15px; padding: 20px; }
.sp-search-candidate__meta { color: #9a632d; font-size: 12px; font-weight: 800; letter-spacing: .06em; margin: 0 0 8px; text-transform: uppercase; }
.sp-search-candidate h3 { font-size: 21px; margin: 0 0 7px; }
.sp-search-candidate > p:not(.sp-search-candidate__meta) { color: var(--sp-muted); line-height: 1.5; margin: 0 0 13px; }
.sp-search-candidate a { color: var(--sp-accent); font-weight: 750; }
.sp-search-candidate__state { color: #7b5129 !important; font-size: 13px; font-weight: 700; margin: 12px 0 0 !important; }

.sp-search__missing-subject { background: #fffaf3; border: 1px solid #e4cda9; border-radius: 17px; margin-top: 34px; padding: clamp(22px, 4vw, 34px); }
.sp-search__missing-subject > h2 { color: #082b40; font-size: clamp(23px, 3vw, 30px); margin: 0 0 8px; }
.sp-search__missing-subject > p:not(.sp-search__candidate-eyebrow) { color: #40586c; line-height: 1.6; margin: 0 0 22px; }
.sp-search__missing-form { display: grid; gap: 17px; }
.sp-search__missing-form label { color: #082b40; display: grid; font-weight: 700; gap: 7px; }
.sp-search__missing-form input, .sp-search__missing-form textarea { background: #fff; border: 1px solid #b9c9d2; border-radius: 10px; color: #082b40; font: inherit; line-height: 1.5; padding: 12px 14px; width: 100%; }
.sp-search__missing-form textarea { resize: vertical; }
.sp-search__missing-form button { background: #082b40; border: 0; border-radius: 11px; color: #fff; cursor: pointer; font: inherit; font-weight: 750; justify-self: start; padding: 13px 20px; }
.sp-search__notice { background: #fff8e7; border-left: 4px solid #c58a12; color: #543b0e; margin-bottom: 20px; padding: 14px 16px; }
.sp-search__notice--success { background: #edf8f0; border-left-color: #268453; color: #174d32; }
.sp-search__notice--error { background: #fff1ef; border-left-color: #b64035; color: #732820; }

.sp-search__more {
    background: transparent;
    border: 1px solid var(--sp-accent);
    border-radius: 12px;
    color: var(--sp-accent);
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    margin: 24px auto 0;
    padding: 12px 22px;
}

.sp-search__more:hover { background: var(--sp-soft); }
.sp-search__empty, .sp-search__error { background: var(--sp-soft); border-radius: 16px; color: var(--sp-muted); padding: 28px; }
.sp-search__error { background: #fff4f1; color: #8d3b2f; }
.sp-search.is-searching .sp-search__results { opacity: .45; }
.sp-search.is-searching .sp-search__submit { cursor: wait; opacity: .75; }
.sp-search__noscript { background: #fff4f1; border-radius: 12px; padding: 16px; }

@media (max-width: 760px) {
    .sp-search { padding-left: 12px; padding-right: 12px; }
    .sp-search__hero { border-radius: 20px; padding: 28px 20px; }
    .sp-search__input-row { align-items: stretch; flex-direction: column; }
    .sp-search__submit { width: 100%; }
    .sp-search__layout:has(.sp-search__facets:not([hidden])) { grid-template-columns: 1fr; }
    .sp-search__facets { position: static; }
    .sp-search__candidate-results { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .sp-search *, .sp-search *::before, .sp-search *::after { scroll-behavior: auto !important; transition: none !important; }
}
