/* Gestaltung 2026 – Suche, Zufallsimpuls und Fehlerseiten (Zitatblock in Impuls.css) */

.suchseite, .impulsseite { width: min(100% - 4rem, 52rem); margin-top: 3.5rem; margin-bottom: 4rem; }
.suchseite h1 { font-family: var(--schrift-text); font-size: clamp(1.8rem, 4vw, 2.4rem); margin: 0 0 1.2rem; }

.suchfeld { display: flex; gap: .5rem; }
.suchfeld input {
	flex: 1; min-width: 0; font: inherit; font-family: var(--schrift-ui); font-size: 1.1rem; padding: .65rem .85rem;
	color: var(--tinte); background: var(--karte); border: 1px solid var(--linie); border-radius: 6px;
}
.suchseite .hinweis { font-family: var(--schrift-ui); color: var(--leise); font-size: .95rem; margin: .8rem 0 0; }
.suchseite .seitenkopf { margin-bottom: 2.5rem; }

/* Ergebnis */
.suchseite .ergebnis { font-family: var(--schrift-ui); font-size: 1.1rem; margin: 0 0 1rem; }
.filter { display: flex; flex-wrap: wrap; gap: .4rem; font-family: var(--schrift-ui); border-bottom: 1px solid var(--linie); padding-bottom: 1rem; }
.filter a, .filter .leer { padding: .35rem .8rem; border-radius: 6px; text-decoration: none; }
.filter a { color: var(--link); }
.filter a:hover { background: var(--flaeche); color: var(--link-hover); }
.filter a[aria-current] { background: var(--flaeche); color: var(--tinte); font-weight: 600; }
.filter .leer { color: var(--leise); }
.filter .zahl { color: var(--leise); font-weight: 400; margin-left: .15rem; }

.funde { list-style: none; margin: 0; padding: 0; }
.fund { border-bottom: 1px solid var(--linie); padding: 1.5rem 0 1.2rem; }
.fund h2 { font-family: var(--schrift-text); font-size: 1.3rem; font-weight: 600; margin: 0 0 .6rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .8rem; }
.fund h2 a { color: var(--tinte); text-decoration: none; }
.fund h2 a:hover { color: var(--link); text-decoration: underline; }
.fund .anzahl { font-family: var(--schrift-ui); font-size: .9rem; font-weight: 400; color: var(--leise); }

.stellen { list-style: none; margin: 0; padding: 0; }
.stellen a {
	display: block; padding: .55rem .75rem; margin: 0 -.75rem; border-radius: 6px;
	font-family: var(--schrift-text); line-height: 1.55; color: var(--tinte); text-decoration: none;
}
.stellen a:hover { background: var(--flaeche); }
.stellen mark { background: color-mix(in srgb, var(--gold) 32%, transparent); color: inherit; border-radius: 2px; padding: 0 .1em; }

.fund details summary { font-family: var(--schrift-ui); font-size: .95rem; color: var(--link); cursor: pointer; padding: .4rem 0; width: max-content; }
.fund details summary:hover { color: var(--link-hover); }

.seiten { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; font-family: var(--schrift-ui); color: var(--leise); }

/* Leere Suche, Fehlerseiten */
.suchseite > .impuls { margin-top: 1rem; }
.bereiche { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }

/* Impulsseite */
.impulsseite h1 { font-family: var(--schrift-text); }
.impulsseite .weitersuchen { margin-top: 3rem; }
.impulsseite .weitersuchen h2 { font-size: 1.3rem; margin: 0 0 .8rem; }

@media (max-width: 600px) {
	.suchseite, .impulsseite { width: min(100% - 2rem, 52rem); margin-top: 2rem; }
	.suchfeld .knopf { padding-inline: .8rem; }
	.stellen a { margin: 0 -.5rem; padding: .5rem; }
}
.suchseite .hinweis + .suchfeld { margin-top: 1.2rem; }
