/* ==========================================================
   KCC NEWS – Design & CSS (Publishing Manager 1.2.0)
   Startseite: [custom_newsfeed], [custom_newsfeed_impressionen]
   Nachrichtenseite: [kcc_news]
   Farben & Groessen lassen sich hier zentral anpassen.
   ========================================================== */

/* ===== Gemeinsame Farbwelt ===== */
.kccpm-nv,
.kccpm-nv-archive {
  --nv-navy:#070a14;
  --nv-card:#0c101d;
  --nv-gold:#d6a84f;
  --nv-champagne:#eed6a0;
  --nv-white:#f8f6f1;
  --nv-muted:rgba(248,246,241,.67);
  --nv-outline:rgba(214,168,79,.22);
  --nv-serif:Georgia,"Times New Roman",serif;
  --nv-sans:Arial,Helvetica,sans-serif;
  box-sizing:border-box;
  font-family:var(--nv-sans);
}
.kccpm-nv *, .kccpm-nv *::before, .kccpm-nv *::after,
.kccpm-nv-archive *, .kccpm-nv-archive *::before, .kccpm-nv-archive *::after { box-sizing:border-box; }

/* ===== Startseiten-Sektionen: bewusst transparent, damit sie
   zum dunkel-warmen Verlauf des Seiten-Containers passen. ===== */
.kccpm-nv {
  position:relative;
  width:min(1130px,calc(100% - 36px));
  margin:0 auto;
  padding:57px 0 70px;
  color:var(--nv-white);
  background:transparent;
}
.kccpm-nv__header { max-width:680px; margin:0 auto 37px; text-align:center; }
.kccpm-nv__eyebrow {
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  color:var(--nv-gold); font-size:10px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
}
.kccpm-nv__eyebrow::before,.kccpm-nv__eyebrow::after {
  content:""; width:28px; height:1px; background:currentColor; opacity:.7;
}
.kccpm-nv__header h2 {
  margin:14px 0 0!important; padding:0!important;
  color:var(--nv-white)!important; background:none!important;
  font-family:var(--nv-serif); font-size:clamp(36px,4.1vw,54px);
  line-height:1.09; font-weight:400; letter-spacing:-.034em;
}
.kccpm-nv__header p {
  max-width:520px; margin:13px auto 0!important; padding:0!important;
  color:var(--nv-muted)!important; background:none!important;
  font-size:14px; line-height:1.7;
}
.kccpm-nv__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.kccpm-nv__card {
  position:relative; min-width:0; overflow:hidden;
  border:1px solid rgba(214,168,79,.19); border-radius:14px;
  background:linear-gradient(155deg,rgba(255,255,255,.048),rgba(255,255,255,.016));
  box-shadow:0 16px 40px rgba(0,0,0,.13);
  transition:transform .22s ease,border-color .22s ease;
}
.kccpm-nv__card:hover { transform:translateY(-4px); border-color:rgba(214,168,79,.50); }
.kccpm-nv__cardlink { display:flex; flex-direction:column; height:100%; text-decoration:none!important; color:inherit!important; }
.kccpm-nv__cardlink:focus-visible { outline:3px solid var(--nv-champagne); outline-offset:-4px; }
.kccpm-nv__image { position:relative; aspect-ratio:1.68/1; overflow:hidden; background:#111523; }
.kccpm-nv__image::after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,transparent 65%,rgba(7,10,20,.25));
}
.kccpm-nv__image img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.kccpm-nv__card:hover .kccpm-nv__image img { transform:scale(1.035); }
.kccpm-nv__imagefallback {
  display:grid; place-items:center; height:100%; width:100%;
  font:400 35px/1 var(--nv-serif); letter-spacing:.15em; color:rgba(238,214,160,.5);
  background:radial-gradient(ellipse at 50% 55%,rgba(214,168,79,.10),transparent 72%),#111523;
}
.kccpm-nv__cardbody { display:flex; flex:1; flex-direction:column; align-items:flex-start; padding:24px 23px 21px; }
.kccpm-nv__meta {
  display:flex; align-items:center; flex-wrap:wrap; gap:9px;
  color:var(--nv-gold); font-size:10px; font-weight:600; letter-spacing:.065em;
}
.kccpm-nv__meta-line { width:14px; height:1px; background:rgba(214,168,79,.55); }
.kccpm-nv__card h3 {
  margin:13px 0 0!important; padding:0!important; color:var(--nv-white)!important;
  background:none!important; font:400 clamp(21px,2vw,26px)/1.22 var(--nv-serif);
  letter-spacing:-.025em; text-wrap:balance; overflow-wrap:anywhere;
}
.kccpm-nv__cardbody > p {
  margin:10px 0 0!important; padding:0!important; color:var(--nv-muted)!important;
  background:none!important; font-size:13px; line-height:1.72;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.kccpm-nv__read {
  display:flex; align-items:center; justify-content:space-between; gap:15px; width:100%;
  margin-top:auto; padding-top:23px;
  color:var(--nv-champagne); font-size:11px; font-weight:700; letter-spacing:.035em;
}
.kccpm-nv__read > span { font-size:20px; font-weight:400; transition:transform .22s ease; }
.kccpm-nv__card:hover .kccpm-nv__read > span { transform:translate(3px,-3px); }
.kccpm-nv__empty {
  max-width:680px; margin:0 auto!important; padding:35px 24px!important;
  border-top:1px solid var(--nv-outline); border-bottom:1px solid var(--nv-outline);
  color:var(--nv-muted)!important; font-size:14px; text-align:center;
}

/* ===== Impressionen: weniger Text, Bilder stehen im Fokus ===== */
.kccpm-nv--impressions .kccpm-nv__image { aspect-ratio:1.3/1; }
.kccpm-nv--impressions .kccpm-nv__cardbody { padding:21px 23px 20px; }

/* ==========================================================
   Vollstaendige News-Seite / [kcc_news]
   Dunkler Hero + warmer heller Hintergrund + dunkle Beitraege
   ========================================================== */
.kccpm-nv-archive {
  width:100%; max-width:100%; margin:0; padding:0 0 82px;
  color:#101826; background:#f7f5f0;
  box-shadow:0 0 0 100vmax #f7f5f0;
  clip-path:inset(0 -100vmax);
}
.kccpm-nv-archive__hero {
  position:relative; margin:0 0 49px; padding:0;
  background:linear-gradient(105deg,#050814,#0b0d18 58%,#1c1913);
  color:var(--nv-white);
  box-shadow:0 0 0 100vmax #080a13;
  clip-path:inset(0 -100vmax);
}
.kccpm-nv-archive__hero-inner { max-width:1200px; margin:0 auto; padding:66px 28px 70px; }
.kccpm-nv-archive__kicker {
  display:inline-flex; align-items:center; gap:9px; color:var(--nv-champagne);
  font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
}
.kccpm-nv-archive__kicker span { width:6px; height:6px; background:var(--nv-gold); border-radius:50%; }
.kccpm-nv-archive__hero h1 {
  margin:18px 0 0!important; padding:0!important; color:#fff!important; background:none!important;
  font:400 clamp(40px,5vw,66px)/1.05 var(--nv-serif); letter-spacing:-.04em;
}
.kccpm-nv-archive__hero p {
  margin:18px 0 0!important; padding:0!important; max-width:650px;
  color:var(--nv-muted)!important; background:none!important; font-size:15px; line-height:1.65;
}
/* Überschrift bildet die erste Zeile, News und Sidebar die zweite.
   So beginnen beide Spalten exakt auf derselben Höhe. */
.kccpm-nv-archive__layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 292px;
  grid-template-areas:"sectionhead ." "main sidebar";
  align-items:start;
  column-gap:32px;
  row-gap:22px;
  width:min(1180px,calc(100% - 44px));
  margin:0 auto;
}
.kccpm-nv-archive__main { grid-area:main; min-width:0; }
.kccpm-nv-archive__sectionhead {
  grid-area:sectionhead;
  min-width:0;
  border-bottom:1px solid #e3ddd0;
  padding:0 0 20px;
  margin:0;
}
.kccpm-nv-archive__sectionhead > span {
  color:#9c7530; font-weight:700; letter-spacing:.16em; font-size:10px; text-transform:uppercase;
}
.kccpm-nv-archive__sectionhead h2 {
  margin:7px 0 0!important; color:#172033!important; background:none!important;
  font:400 clamp(28px,3vw,38px)/1.15 var(--nv-serif);
}
.kccpm-nv-archive__list { display:grid; gap:16px; }
.kccpm-nv-archive__card {
  display:grid; grid-template-columns:minmax(0,42%) minmax(0,1fr);
  min-height:228px; overflow:hidden;
  background:var(--nv-navy); border:1px solid rgba(214,168,79,.18); border-radius:15px;
  box-shadow:0 13px 28px rgba(2,7,18,.09);
}
.kccpm-nv-archive__visual { position:relative; display:block; min-height:228px; overflow:hidden; background:#121723; }
.kccpm-nv-archive__visual img {
  position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover;
  transition:transform .35s ease;
}
.kccpm-nv-archive__card:hover .kccpm-nv-archive__visual img { transform:scale(1.035); }
.kccpm-nv-archive__visual > span { display:grid; place-items:center; height:100%; color:var(--nv-gold); font:400 36px var(--nv-serif); }
.kccpm-nv-archive__copy { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:25px 27px; }
.kccpm-nv-archive__meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px; color:var(--nv-gold); font-size:10px; font-weight:700; letter-spacing:.045em; }
.kccpm-nv-archive__copy h3 {
  margin:12px 0 0!important; color:#fff!important; background:none!important;
  font:400 clamp(22px,2.3vw,29px)/1.19 var(--nv-serif); letter-spacing:-.02em;
  overflow-wrap:anywhere;
}
.kccpm-nv-archive__copy h3 a { color:inherit!important; text-decoration:none!important; }
.kccpm-nv-archive__copy > p { margin:10px 0 0!important; color:var(--nv-muted)!important; font-size:13px; line-height:1.68; }
.kccpm-nv-archive__read { margin-top:auto; padding-top:18px; color:var(--nv-champagne)!important; text-decoration:none!important; font-size:11px; font-weight:700; }
.kccpm-nv-archive__read span { margin-left:9px; font-size:16px; }
/* Sidebar folgt beim Scrollen bis zum Ende der Beitragsliste. Falls die
   Sidebar höher als der Bildschirm ist, bleiben die Einträge intern scrollbar. */
.kccpm-nv-archive__sidebar {
  grid-area:sidebar;
  position:sticky;
  top:24px;
  align-self:start;
  min-width:0;
  max-height:calc(100vh - 48px);
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(214,168,79,.32) transparent;
  background:var(--nv-navy);
  color:var(--nv-white);
  border:1px solid rgba(214,168,79,.22);
  border-radius:15px;
}
.kccpm-nv-archive__sidebar header { padding:25px 21px 20px; border-bottom:1px solid rgba(214,168,79,.15); }
.kccpm-nv-archive__sidebar header > span { color:var(--nv-gold); font-size:9px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.kccpm-nv-archive__sidebar header h2 { margin:9px 0 0!important; color:#fff!important; background:none!important; font:400 27px/1.16 var(--nv-serif); }
.kccpm-nv-archive__side-list { display:flex; flex-direction:column; }
.kccpm-nv-archive__side-item {
  display:grid; grid-template-columns:62px minmax(0,1fr); gap:13px; align-items:center;
  min-width:0; padding:14px; text-decoration:none!important; color:inherit!important;
  border-bottom:1px solid rgba(255,255,255,.07); transition:background .2s ease;
}
.kccpm-nv-archive__side-item:last-child { border-bottom:0; }
.kccpm-nv-archive__side-item:hover { background:rgba(214,168,79,.06); }
.kccpm-nv-archive__thumb { display:grid; place-items:center; width:62px; height:62px; overflow:hidden; border-radius:8px; background:#131724; color:var(--nv-gold); }
.kccpm-nv-archive__thumb img { display:block; width:100%; height:100%; object-fit:cover; }
.kccpm-nv-archive__sidecopy { display:flex; flex-direction:column; gap:6px; min-width:0; }
.kccpm-nv-archive__sidecopy time { color:var(--nv-gold); font-size:9px; }
.kccpm-nv-archive__sidecopy strong { color:rgba(255,255,255,.82); font-size:12px; line-height:1.4; font-weight:600; overflow-wrap:anywhere; }
.kccpm-nv-archive__pagination { display:flex; justify-content:center; flex-wrap:wrap; gap:9px; margin-top:31px; }
.kccpm-nv-archive__pagination .page-numbers {
  display:inline-grid; place-items:center; min-width:39px; min-height:39px; padding:7px 12px;
  background:#fff; color:#172033!important; border:1px solid #dfd9cc;
  border-radius:8px; font-size:12px; text-decoration:none!important;
}
.kccpm-nv-archive__pagination .page-numbers.current,
.kccpm-nv-archive__pagination .page-numbers:hover { background:var(--nv-navy); border-color:var(--nv-gold); color:var(--nv-champagne)!important; }

/* ===== Tablet & Smartphone ===== */
@media(max-width:1020px) {
  .kccpm-nv-archive__layout {
    grid-template-columns:1fr;
    grid-template-areas:"sectionhead" "main" "sidebar";
  }
  .kccpm-nv-archive__sidebar {
    position:static;
    top:auto;
    max-height:none;
    overflow:visible;
  }
  .kccpm-nv-archive__side-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kccpm-nv__grid { gap:14px; }
  .kccpm-nv__cardbody { padding:19px 17px 18px; }
}
@media(max-width:740px) {
  .kccpm-nv { width:calc(100% - 26px); padding:43px 0 51px; }
  .kccpm-nv__header { margin-bottom:25px; }
  .kccpm-nv__header h2 { font-size:36px; }
  .kccpm-nv__header p { font-size:13px; }
  .kccpm-nv__grid { grid-template-columns:1fr; gap:16px; }
  .kccpm-nv__image,.kccpm-nv--impressions .kccpm-nv__image { aspect-ratio:1.75/1; }
  .kccpm-nv__cardbody { padding:19px 21px 18px; }
  .kccpm-nv__card h3 { font-size:23px; }
  .kccpm-nv-archive { padding-bottom:55px; }
  .kccpm-nv-archive__hero { margin-bottom:28px; }
  .kccpm-nv-archive__hero-inner { padding:45px 24px 50px; }
  .kccpm-nv-archive__hero h1 { font-size:40px; }
  .kccpm-nv-archive__hero p { font-size:14px; }
  .kccpm-nv-archive__layout { width:calc(100% - 26px); gap:25px; }
  .kccpm-nv-archive__card { grid-template-columns:1fr; }
  .kccpm-nv-archive__visual { height:210px; min-height:210px; }
  .kccpm-nv-archive__copy { padding:23px; }
  .kccpm-nv-archive__side-list { display:flex; }
}
@media(max-width:390px) {
  .kccpm-nv__eyebrow { font-size:9px; letter-spacing:.13em; }
  .kccpm-nv__eyebrow::before,.kccpm-nv__eyebrow::after { width:19px; }
  .kccpm-nv-archive__hero h1 { font-size:34px; }
  .kccpm-nv-archive__visual { height:182px; min-height:182px; }
}
@media(prefers-reduced-motion:reduce) {
  .kccpm-nv *, .kccpm-nv-archive * { transition:none!important; }
}
