/* ============================================================
   news-style.css — öffentliche News-Seiten (Archiv + Artikel)
   Design-Tokens identisch zum Ticker-Modul.
   Hinweis: Dies sind EIGENSTÄNDIGE Seiten unter /neuigkeiten/,
   kein Shop-Content-Container -> hier ist eine Lesespalten-Breite
   (max-width) korrekt und erwünscht. Die "kein max-width"-Regel
   gilt nur für Module IM Shop-Content-Bereich (news-ticker.tpl).
   ============================================================ */

/* Red Hat Display – selbst gehostet (identisch zum Shop-Template, kein Google-CDN).
   Absolute Pfade, damit die Standalone-Seiten unter /neuigkeiten/ die Schrift laden. */
@font-face{font-display:swap;font-family:'Red Hat Display';font-style:normal;font-weight:400;
  src:url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-regular.woff2') format('woff2'),
      url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-regular.ttf') format('truetype');}
@font-face{font-display:swap;font-family:'Red Hat Display';font-style:normal;font-weight:600;
  src:url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-600.woff2') format('woff2'),
      url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-600.ttf') format('truetype');}
@font-face{font-display:swap;font-family:'Red Hat Display';font-style:normal;font-weight:700;
  src:url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-700.woff2') format('woff2'),
      url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-700.ttf') format('truetype');}
@font-face{font-display:swap;font-family:'Red Hat Display';font-style:normal;font-weight:900;
  src:url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-900.woff2') format('woff2'),
      url('/templates/metalldetektor/css/fonts/red-hat-display-v14-latin-900.ttf') format('truetype');}

:root{
  --nx-navy:#163e7c; --nx-navy-d:#163e7c; --nx-red:#dc143c;
  --nx-grey:#6a7885; --nx-line:#e7ebef; --nx-border:#e3e8ed;
  --nx-tint:#f2f6fa; --nx-bg:#f4f6f8; --nx-card:#fff;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--nx-bg); color:#1f2d3a;
  font-family:'Red Hat Display',-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.6; -webkit-font-smoothing:antialiased;
}
a{color:var(--nx-red); text-decoration:none}
a:hover{text-decoration:underline}
.nx-wrap{max-width:820px; margin:0 auto; padding:0 22px} /* Lesespalte */

/* ---- Kopf / Fuß --------------------------------------------------------- */
.nx-top{background:#fff; border-bottom:1px solid var(--nx-border)}
.nx-top__in{display:flex; align-items:center; justify-content:space-between; height:60px}
.nx-logo img{display:block}
.nx-topnav{display:flex; align-items:center; gap:20px; font-weight:700; font-size:14px}
.nx-topnav a{color:var(--nx-navy-d)}
.nx-back{color:var(--nx-red)}
.nx-foot{background:#fff; border-top:1px solid var(--nx-border); margin-top:48px}
.nx-foot__in{display:flex; align-items:center; justify-content:space-between;
  gap:12px; min-height:56px; font-size:13px; color:var(--nx-grey); flex-wrap:wrap}
.nx-foot__links a{color:var(--nx-grey); margin-left:16px}

/* ---- Kategorie-Badges (wie im Ticker) ----------------------------------- */
.nx-tag{display:inline-block; font-size:11px; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase; padding:3px 9px; border-radius:4px}
.nx-tag--firmware{color:#1466b8; background:#e8f1fb}
.nx-tag--shop{color:#dc143c; background:#fdeaeb}
.nx-tag--fund{color:#a86400; background:#fbf1df}
.nx-tag--termin{color:#0a8f7a; background:#e2f6f1}
.nx-tag--allgemein{color:#163e7c; background:#eaf0f6}

/* ---- Breadcrumb --------------------------------------------------------- */
.nx-crumb{font-size:13px; color:var(--nx-grey); padding:18px 0 0}
.nx-crumb a{color:var(--nx-grey)}
.nx-crumb span{margin:0 6px}

/* ---- Artikel ------------------------------------------------------------ */
.nx-article{background:transparent; padding:8px 0 0}
.nx-article__meta{display:flex; align-items:center; gap:12px; margin:16px 0 10px; flex-wrap:wrap}
.nx-article__date{font-size:13px; color:var(--nx-grey)}
.nx-h1{font-size:33px; line-height:1.18; font-weight:800; color:var(--nx-navy-d); margin:6px 0 14px}
.nx-byline{font-size:13.5px; color:var(--nx-grey); margin:0 0 20px}
.nx-byline strong{color:var(--nx-navy)}
.nx-hero{width:100%; height:auto; border-radius:14px; margin:0 0 26px; display:block}

/* GEO-Kurzfassung: klar abgesetzter, zitierfähiger Kasten */
.nx-summary{background:#fff; border:1px solid var(--nx-border);
  border-left:4px solid var(--nx-red); border-radius:10px;
  padding:16px 20px; margin:0 0 28px; box-shadow:0 6px 18px rgba(22,62,124,.04)}
.nx-summary__label{font-size:11px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color:var(--nx-red); margin:0 0 6px}
.nx-summary p{margin:0; font-size:16px; color:var(--nx-navy-d)}

.nx-body{font-size:17px; color:#243342}
.nx-body h2{font-size:23px; color:var(--nx-navy-d); font-weight:800; margin:34px 0 12px}
.nx-body h3{font-size:19px; color:var(--nx-navy-d); font-weight:700; margin:26px 0 10px}
.nx-body p{margin:0 0 16px}
.nx-body ul,.nx-body ol{margin:0 0 18px; padding-left:22px}
.nx-body li{margin:0 0 8px}
.nx-body img{max-width:100%; height:auto; border-radius:10px}
.nx-body a{font-weight:600}

/* Quelle / Attribution */
.nx-source{font-size:13.5px; color:var(--nx-grey); border-top:1px solid var(--nx-line);
  margin-top:26px; padding-top:16px}

/* FAQ (sichtbar, zusätzlich zum FAQPage-Schema) */
.nx-faq{margin:34px 0 0}
.nx-faq h2{font-size:22px; color:var(--nx-navy-d); font-weight:800; margin:0 0 14px}
.nx-faq details{background:#fff; border:1px solid var(--nx-border); border-radius:10px;
  padding:12px 18px; margin:0 0 10px}
.nx-faq summary{font-weight:700; color:var(--nx-navy-d); cursor:pointer; list-style:none}
.nx-faq summary::-webkit-details-marker{display:none}
.nx-faq details[open] summary{margin-bottom:8px}
.nx-faq p{margin:0; color:#243342}

/* CTA zum Shop */
.nx-cta{display:inline-flex; align-items:center; gap:8px; background:var(--nx-red);
  color:#fff; font-weight:800; padding:12px 22px; border-radius:6px; margin:26px 0 0}
.nx-cta:hover{filter:brightness(1.07); text-decoration:none}

/* Weitere Meldungen */
.nx-more{border-top:1px solid var(--nx-line); margin-top:40px; padding-top:22px}
.nx-more h2{font-size:16px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--nx-navy-d); margin:0 0 14px}
.nx-more a{display:flex; gap:12px; align-items:baseline; padding:10px 0;
  border-top:1px solid var(--nx-line); color:var(--nx-navy-d); font-weight:600}
.nx-more a:first-of-type{border-top:none}
.nx-more time{font-size:12px; color:var(--nx-grey); flex:0 0 92px}

/* ---- Archiv-Übersicht --------------------------------------------------- */
.nx-page-h1{font-size:30px; font-weight:800; color:var(--nx-navy-d); margin:20px 0 4px}
.nx-page-sub{color:var(--nx-grey); margin:0 0 26px}
.nx-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.nx-cardl{background:#fff; border:1px solid var(--nx-border); border-radius:12px;
  overflow:hidden; display:flex; flex-direction:column; transition:transform .15s, box-shadow .15s}
.nx-cardl:hover{transform:translateY(-2px); box-shadow:0 12px 26px rgba(22,62,124,.08); text-decoration:none}
.nx-cardl__img{aspect-ratio:16/9; background:var(--nx-tint); object-fit:cover; width:100%}
.nx-cardl__b{padding:16px 18px 18px; display:flex; flex-direction:column; align-items:flex-start; gap:6px}
.nx-cardl__date{font-size:12px; color:var(--nx-grey); margin:2px 0 0}
.nx-cardl__t{font-size:17px; font-weight:700; color:var(--nx-navy-d); margin:0; line-height:1.28}
.nx-cardl__x{font-size:13.5px; color:var(--nx-grey); margin:0; line-height:1.45}
.nx-pager{display:flex; justify-content:center; gap:10px; margin:32px 0 0}
.nx-pager a,.nx-pager span{padding:8px 14px; border:1px solid var(--nx-border);
  border-radius:6px; color:var(--nx-navy-d); font-weight:700; font-size:14px; background:#fff}
.nx-pager .is-off{color:#b7c0c9; background:var(--nx-bg)}

@media (max-width:640px){
  .nx-h1{font-size:26px}
  .nx-body{font-size:16px}
  .nx-grid{grid-template-columns:1fr}
}