/* ==================================================================
   Projektübersicht, Kategorien, Suche
   ================================================================== */

.hero{min-height:300px}
.hero .inner{padding:52px 44px 44px}
.hero .lead{max-width:620px}

/* ---------- Suchleiste ---------- */
.searchwrap{position:sticky;top:0;z-index:20;background:var(--w);border-top:1px solid var(--ink)}
.searchwrap .in{max-width:1240px;margin:0 auto;padding:22px 44px 0}
.search{position:relative;display:flex;align-items:center;gap:18px;border-bottom:2px solid var(--ink);transition:border-color .2s}
.search:focus-within{border-color:var(--red)}
.search input{flex:1;min-width:0;font-family:var(--sans);font-weight:300;font-size:clamp(16px,1.5vw,19px);color:var(--ink);background:transparent;border:0;padding:16px 0;letter-spacing:-.01em;-webkit-appearance:none;appearance:none}
.search input:focus{outline:none}
.search input::placeholder{color:var(--g400);font-weight:300}
.search input::-webkit-search-cancel-button{display:none}
.search .clr{flex-shrink:0;width:30px;height:30px;border:1px solid var(--g300);background:none;color:var(--g500);font-size:17px;cursor:pointer;display:none;line-height:1;border-radius:50%;transition:.15s}
.search .clr:hover{color:var(--red);border-color:var(--red)}
.search.has .clr{display:block}
.count{flex-shrink:0;font-size:15px;color:var(--g500);white-space:nowrap}
.count b{color:var(--ink);font-weight:700}

/* ---------- Kartenraster ---------- */
.grid{max-width:1240px;margin:0 auto;padding:36px 44px 0}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 24px}
.pcard{display:flex;flex-direction:column}
.pcard .imw{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--g100)}
.pcard .im{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .55s cubic-bezier(.16,1,.3,1)}
.pcard:hover .im{transform:scale(1.06)}
.pcard .imw::after{content:"";position:absolute;left:0;right:0;bottom:0;height:44%;background:linear-gradient(to top,rgba(10,10,11,.55),transparent);z-index:1;pointer-events:none}
.pcard .imw .view{position:absolute;right:0;bottom:0;z-index:2;background:var(--red);color:#fff;font-size:13px;font-weight:700;padding:8px 14px;transform:translateY(100%);transition:transform .25s}
.pcard:hover .imw .view{transform:translateY(0)}
.pcard .mk{margin-top:14px;font-size:13px;line-height:1.2;color:var(--red);font-weight:700}
.pcard h3{font-weight:900;font-size:21px;letter-spacing:-.01em;line-height:1.1;margin-top:4px}
/* Ohne Marken-Zeile würde der Titel hochrutschen — Abstand nachbilden
   (14px Abstand + 15.6px Zeilenhöhe + 4px = 34px). */
.pcard .imw + h3{margin-top:34px}
.pcard p{font-size:15px;color:var(--g500);margin-top:6px;line-height:1.4}
.noresult{grid-column:1/-1;padding:70px 0;text-align:center;font-size:17px;color:var(--g500)}
.noresult a{color:var(--red);font-weight:700}

/* ---------- Blättern ---------- */
.pagination{max-width:1240px;margin:56px auto 0;border-top:1px solid var(--g200);padding-top:24px}
.pagination .nav-links{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:15px}
.pagination .page-numbers{padding:8px 13px;color:var(--g700);border:1px solid transparent;font-variant-numeric:tabular-nums}
.pagination .page-numbers:hover{color:var(--red);border-color:var(--g200)}
.pagination .page-numbers.current{background:var(--red);color:#fff;font-weight:700}
.pagination .page-numbers.dots{color:var(--g400)}
.pagination .prev,.pagination .next{font-weight:700}
.pagination .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.contact{margin-top:72px}

@media(max-width:1000px){.pgrid{grid-template-columns:1fr 1fr}}
@media(max-width:900px){
  .grid,.searchwrap .in{padding-left:24px;padding-right:24px}
  .hero .inner{padding:44px 24px}
  .pagination{padding-left:24px;padding-right:24px}
}
@media(max-width:600px){.pgrid{grid-template-columns:1fr}}