/* Oli Projekte 1.0.2 – Kategorien + Kartenraster */

body.oli-projekte-page{
  background:#03040a !important;
  background-image:none !important;
  --theme-palette-color-6:#0a0c12;
  --theme-palette-color-7:#03040a;
  --theme-palette-color-8:#03040a;
  --theme-text-color:#cbd5e1;
  --theme-headings-color:#f8fafc;
  --theme-link-initial-color:#e2e8f0;
  color:#e2e8f0;
}
body.oli-projekte-page #main,
body.oli-projekte-page #main-container,
body.oli-projekte-page .site-main,
body.oli-projekte-page .site-content,
body.oli-projekte-page .ct-container,
body.oli-projekte-page .ct-container-full,
body.oli-projekte-page article,
body.oli-projekte-page .entry-content,
body.oli-projekte-page .hero-section,
body.oli-projekte-page .ct-page-title-container{
  background:#03040a !important;
  background-color:#03040a !important;
}
body.oli-projekte-page .hero-section,
body.oli-projekte-page .page-title-container,
body.oli-projekte-page .entry-header,
body.oli-projekte-page .ct-page-title-container{display:none !important}
body.oli-projekte-page .entry-content{
  padding:0 !important; max-width:none !important; width:100% !important;
}
body.oli-projekte-page .ct-container-full,
body.oli-projekte-page [class*="ct-container"]{
  max-width:none !important; width:100% !important; padding-inline:0 !important;
}

body.oli-projekte-page .ct-header,
body.oli-projekte-page .ct-header [data-row],
body.oli-projekte-page .ct-header [data-row] > div{
  background:#03040a !important;
  background-color:#03040a !important;
  background-image:none !important;
}
body.oli-projekte-page .ct-header .site-title,
body.oli-projekte-page .ct-header .site-title a,
body.oli-projekte-page .ct-header .ct-menu-link,
body.oli-projekte-page .ct-header [data-id="logo"] .site-title{
  color:#f1f5f9 !important;
}
body.oli-projekte-page .ct-header .ct-menu-link:hover,
body.oli-projekte-page .ct-header .ct-menu-link[aria-current="page"]{
  color:#67e8f9 !important;
}
body.oli-projekte-page .ct-header [data-id="trigger"],
body.oli-projekte-page .ct-header .ct-icon{
  color:#f1f5f9 !important; fill:#f1f5f9 !important;
}
body.oli-projekte-page .ct-footer,
body.oli-projekte-page .ct-footer [data-row],
body.oli-projekte-page .ct-footer [data-row] > div,
body.oli-projekte-page footer#footer{
  background:#03040a !important;
  color:#94a3b8 !important;
}
body.oli-projekte-page .ct-footer a{color:#cbd5e1 !important}

.opj{
  --opj-bg:#03040a; --opj-ink:#f8fafc; --opj-muted:#94a3b8;
  color:var(--opj-ink) !important;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  margin:0; width:100%; max-width:100%;
  background:var(--opj-bg); position:relative; overflow:hidden;
}
.opj a{color:inherit; text-decoration:none}

.opj-intro{
  padding:88px clamp(20px,4vw,48px) 48px; position:relative;
  border-bottom:1px solid rgba(255,255,255,.06);
  max-width:1180px; margin:0 auto;
}
.opj-glow{
  position:absolute; width:min(560px,70vw); height:min(560px,70vw); border-radius:50%;
  filter:blur(90px); opacity:.4; right:-6vw; top:0; background:#6366f1; pointer-events:none;
}
.opj-kicker{
  position:relative; margin:0 0 12px; font-size:.78rem; font-weight:800;
  letter-spacing:.12em; text-transform:uppercase; color:#67e8f9;
}
body.oli-projekte-page .opj h1,
body.oli-projekte-page .opj h1.opj-title,
.opj h1.opj-title{
  color:#ffffff !important;
  font-weight:800 !important;
  font-size:clamp(2.4rem,7vw,4.8rem) !important;
  line-height:.95 !important;
  letter-spacing:-.045em !important;
  margin:0 0 16px !important;
  position:relative;
}
.opj-lead{
  margin:0 0 28px; max-width:40rem; color:#94a3b8 !important;
  font-size:clamp(1rem,2vw,1.15rem); line-height:1.55; position:relative;
}

.opj-jump{
  position:relative; display:flex; flex-wrap:wrap; gap:8px;
}
.opj-jump-link{
  display:inline-flex; align-items:center;
  padding:8px 14px; border-radius:999px; font-size:.82rem; font-weight:650;
  color:#e2e8f0 !important; background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.opj-jump-link:hover{
  background:rgba(103,232,249,.12); border-color:rgba(103,232,249,.45); color:#67e8f9 !important;
}

.opj-cat{
  max-width:1180px; margin:0 auto;
  padding:56px clamp(20px,4vw,48px) 24px;
  border-bottom:1px solid rgba(255,255,255,.05);
  scroll-margin-top:88px;
}
.opj-cat:last-child{border-bottom:0; padding-bottom:80px}
.opj-cat-head{margin-bottom:28px; max-width:42rem}
body.oli-projekte-page .opj h2,
body.oli-projekte-page .opj h2.opj-cat-title,
.opj h2.opj-cat-title{
  color:#ffffff !important;
  font-size:clamp(1.55rem,3.2vw,2.15rem) !important;
  letter-spacing:-.03em !important;
  margin:0 0 8px !important;
  line-height:1.15 !important;
  font-weight:800 !important;
}
.opj-cat-lead{margin:0; color:#94a3b8 !important; font-size:.98rem; line-height:1.5}

.opj-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:18px;
}

.opj-card{
  display:flex; flex-direction:column;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px; overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.28);
  position:relative;
  min-height:100%;
}
.opj-card::before{
  content:""; position:absolute; inset:0 0 auto 0; height:2px;
  background:linear-gradient(90deg, transparent, var(--opj-accent), transparent);
  opacity:.7; pointer-events:none;
}
.opj-card-media{
  position:relative; aspect-ratio:16/10; background:#0b0f1a;
  overflow:hidden; border-bottom:1px solid rgba(255,255,255,.06);
}
.opj-card-media--square{aspect-ratio:1/1; max-height:none; margin:16px 16px 0; border-radius:22px; border:none; background:transparent}
.opj-card-media picture, .opj-card-media img{
  display:block; width:100%; height:100%; object-fit:cover; object-position:top center;
  margin:0 !important; border-radius:0 !important; opacity:1 !important;
}
.opj-card-media--square img{object-fit:contain; object-position:center}
.opj-tile{width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:18px; box-sizing:border-box}
.opj-tile svg{width:min(120px,46%); height:auto; display:block}

.opj-card-body{
  display:flex; flex-direction:column; gap:0; padding:18px 18px 20px; flex:1;
}
.opj-badge{
  align-self:flex-start;
  display:inline-flex; font-size:.68rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  padding:5px 10px; border-radius:999px; background:rgba(255,255,255,.08); color:#e2e8f0; margin-bottom:10px;
}
body.oli-projekte-page .opj h3,
body.oli-projekte-page .opj h3.opj-card-title,
.opj h3.opj-card-title{
  color:#ffffff !important;
  font-size:1.15rem !important; font-weight:750 !important;
  letter-spacing:-.02em !important; margin:0 0 8px !important; line-height:1.25 !important;
}
.opj-card-desc{
  color:#94a3b8 !important; font-size:.92rem; line-height:1.5; margin:0 0 12px; flex:1;
}
.opj-card-meta{font-size:.75rem; color:#7c879c; margin-bottom:14px}
.opj-btn{
  align-self:flex-start;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff; color:#0b1020 !important; font-weight:750; padding:10px 16px; border-radius:999px; font-size:.85rem;
}
.opj-btn:hover{filter:brightness(1.05)}
.opj-soon{
  align-self:flex-start;
  display:inline-flex; font-size:.78rem; font-weight:700; color:#c7d2fe; padding:9px 13px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04);
}
.opj-soon--muted{color:#94a3b8}

@media (max-width:960px){
  .opj-grid{grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:14px}
}
@media (max-width:640px){
  .opj-intro{padding:64px 20px 36px}
  .opj-cat{padding:40px 20px 12px; scroll-margin-top:72px}
  .opj-grid{grid-template-columns:1fr}
  .opj-jump{gap:6px}
  .opj-jump-link{font-size:.76rem; padding:7px 12px}
  .opj-card-media--square{max-height:none}
}
@media (prefers-reduced-motion:reduce){
  .opj-jump-link{transition:none}
}


.opj-ctas{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.opj-btn--sm{padding:8px 12px;font-size:.78rem;background:rgba(255,255,255,.92)}
.opj-btn--sm:hover{background:#fff}