/**
 * /produkte.html — Kategorie-Buttons (Artikel 182) + Produktkarten (mod_newslist).
 * Design-Tokens wie GBF-Produktdetail: 8px Radius, #e4eaec Rahmen, dezenter Schatten.
 * Scope: body.nav-produkte
 */

/* --- Sprungmarken-Buttons oben (#article-182) --- */
/* Theme: .mod_article[class*=bg-] → padding 30px 30px 10px — hier symmetrisch */
body.nav-produkte #article-182.mod_article.bg-grey {
  padding: 0.75rem 0 !important;
}

body.nav-produkte #article-182.mod_article.bg-grey > .inner {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 0 20px;
  box-sizing: border-box;
}

body.nav-produkte #article-182 .ce_row.bottom0 {
  display: contents;
  margin: 0 !important;
  padding: 0 !important;
}

body.nav-produkte #article-182 a.kat_button {
  display: block;
  float: none;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0 !important;
  border: 0;
  border-right: 0 !important;
  border-radius: 8px;
  padding: 0.65rem 0.75rem;
  font-weight: 500;
  box-sizing: border-box;
  box-shadow: 0 4px 18px rgba(0, 40, 48, 0.08);
  transition: box-shadow 0.15s ease, transform 0.15s ease, opacity 0.15s ease;
}

body.nav-produkte #article-182 a.kat_button:hover {
  opacity: 1;
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(0, 40, 48, 0.12);
}

@media (max-width: 767px) {
  body.nav-produkte #article-182.mod_article.bg-grey > .inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* --- Abschnitts-Überschriften (Bandförderer, …) --- */
body.nav-produkte h3.category {
  border-radius: 8px;
}

/* SEO-Hub-Abschnitte (Band / Richtungswechsel / Strang) */
body.nav-produkte .produkte-hub {
  margin: 0.5rem 0 1.25rem;
  padding: 1rem 1.15rem;
  border: 1px solid #e4eaec;
  border-radius: 8px;
  background: #fafbfc;
  max-width: none;
}

body.nav-produkte .produkte-hub__list {
  margin: 0.75rem 0 0;
  padding-left: 1.2rem;
}

body.nav-produkte .produkte-hub__list li {
  margin-bottom: 0.35rem;
}

body.nav-produkte .produkte-hub p {
  margin: 0;
}

body.nav-produkte .produkte-hub p + p,
body.nav-produkte .produkte-hub__more {
  margin-top: 0.65rem;
}

body.nav-produkte .produkte-hub__more {
  font-size: 0.97rem;
}

body.nav-produkte #produkte-intro-seo.ce_text,
body.nav-produkte .ce_text#produkte-intro-seo {
  margin: 0 0 1.75rem;
  max-width: none;
}

/* Intro links, Sidebox rechts — Artikel 144 ohne .inner-Wrapper (Kinder direkt am Article) */
body.nav-produkte #article-144 {
  --produkte-band-gap: 1.25rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem);
  column-gap: 2.5rem;
  row-gap: 0.75rem;
  align-items: start;
}

body.nav-produkte #article-144 > h1.ce_headline,
body.nav-produkte #article-144 > h2.ce_headline {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  /* SEO-H1, optisch wie früher h2 „Produkte“ (Theme), nicht Default-h1 */
  font-size: 1.6667em;
  line-height: 1.3;
  font-weight: 600;
  color: #009493;
}

body.nav-produkte #article-144 > *:not(#produkte-intro-seo):not(#produkte-montage-service):not(#produkte-page-lead):not(h1.ce_headline):not(h2.ce_headline) {
  grid-column: 1 / -1;
}

body.nav-produkte #produkte-page-lead {
  grid-column: 1;
  grid-row: 2;
  margin: 0.35rem 0 0.75rem;
}

body.nav-produkte #produkte-page-lead .produkte-page__lead {
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.45;
  font-weight: 500;
  color: #2a3a40;
}

body.nav-produkte #produkte-intro-seo {
  grid-column: 1;
  grid-row: 3;
  margin: 0 0 1.75rem;
}

body.nav-produkte #produkte-montage-service {
  grid-column: 2;
  grid-row: 1 / span 3;
  margin: 0 0 1.75rem;
  align-self: start;
}

body.nav-produkte #produkte-montage-service .inner {
  background-color: #f6f6f6;
  border: 1px solid #e4eaec;
  border-radius: 8px;
  padding: 1.25rem 1.15rem;
  box-shadow: 0 4px 18px rgba(0, 40, 48, 0.04);
  box-sizing: border-box;
}

@media (max-width: 991px) {
  body.nav-produkte #article-144 {
    grid-template-columns: 1fr;
  }

  body.nav-produkte #article-144 > h1.ce_headline,
  body.nav-produkte #article-144 > h2.ce_headline,
  body.nav-produkte #produkte-page-lead,
  body.nav-produkte #produkte-intro-seo,
  body.nav-produkte #produkte-montage-service {
    grid-column: 1;
    grid-row: auto;
  }
}

body.nav-produkte .produkte-sidebox__title {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 0.75rem;
  font-size: 1.15rem;
  line-height: 1.35;
  border-bottom: dashed 2px #b4b4b4;
  padding-bottom: 0.65rem;
}

body.nav-produkte .produkte-sidebox__icon {
  flex: 0 0 auto;
  color: #0d948f;
  font-size: 1.05em;
}

body.nav-produkte #produkte-montage-service p {
  margin: 0 0 0.65rem;
  font-size: 0.95rem;
}

body.nav-produkte .produkte-sidebox__list {
  margin: 0 0 0.85rem 1.1rem;
  padding: 0;
  font-size: 0.95rem;
}

body.nav-produkte .produkte-sidebox__list li {
  margin-bottom: 0.35rem;
}

body.nav-produkte .produkte-sidebox__link {
  margin: 0 !important;
}

body.nav-produkte .produkte-sidebox__link a {
  font-weight: 500;
  color: #0d948f;
}

body.nav-produkte .produkte-sidebox__link a:hover {
  color: #0b7a76;
}

body.nav-produkte #produkte-intro-seo p,
body.nav-produkte .ce_text#produkte-intro-seo p {
  margin: 0 0 0.65rem;
}

body.nav-produkte #produkte-intro-seo p:last-child,
body.nav-produkte .ce_text#produkte-intro-seo p:last-child {
  margin-bottom: 0;
}

body.nav-produkte #produkte-ansprechpartner-vor-vertikal,
body.nav-produkte .ce_article#produkte-ansprechpartner-vor-vertikal {
  margin: 0 !important;
  padding: 0;
}

/* Kontakt-Band vor Vertikalförderer (Anker #vertikalfoerderer → section) */
body.nav-produkte #article-144 > .mod_newslist.block:has(+ h3#vertikalfoerderer.sprung + section.ahf-contact-band) {
  margin-bottom: 0 !important;
}

body.nav-produkte
  #article-144
  > .mod_newslist.block:has(+ h3#vertikalfoerderer.sprung + section.ahf-contact-band)
  .layout_latest_cts.block3 {
  margin-bottom: 0.75rem !important;
}

body.nav-produkte #article-144 h3#vertikalfoerderer.sprung {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0;
  line-height: 0;
  font-size: 0;
  border: 0;
}

body.nav-produkte #article-144 h3#vertikalfoerderer.sprung + section.ahf-contact-band {
  margin-top: var(--produkte-band-gap) !important;
  margin-bottom: var(--produkte-band-gap) !important;
}

body.nav-produkte #article-144 h3#vertikalfoerderer.sprung + section.ahf-contact-band + h3.category {
  margin-top: var(--produkte-band-gap) !important;
}

/* --- Produktkarten --- */
body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 .outside.produkt_outer {
  background-color: #f6f6f6 !important;
  border: 1px solid #e4eaec;
  border-radius: 8px;
  box-shadow: 0 4px 18px rgba(0, 40, 48, 0.06);
  overflow: hidden;
  height: 100%;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3:hover .outside.produkt_outer,
body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3:focus-within .outside.produkt_outer,
body.nav-produkte .mod_newslist .layout_latest_cts.block3 .outside.produkt_outer:hover,
body.nav-produkte .mod_newslist .layout_latest_cts.block3 .outside.produkt_outer:focus-within {
  border-color: #1b978d !important;
  box-shadow: 0 4px 18px rgba(27, 151, 141, 0.14) !important;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 .produkt_inner {
  border-bottom: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  height: 100%;
  background-color: transparent;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 .imgtext.frame {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  position: relative;
}

body.nav-produkte #main .mod_newslist .layout_latest_cts.block3 .image_container {
  position: relative;
  border-bottom: 1px solid #e4eaec;
  background-color: #fff;
}

body.nav-produkte #main .mod_newslist .layout_latest_cts.block3 .image_container img {
  display: block;
  width: 100%;
  height: auto;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 .counter {
  margin-left: 0;
  margin-right: 0;
  top: 0;
  left: 0;
  border-radius: 0;
  z-index: 3;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 .text_box {
  padding: 1.25rem 1rem 0;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 .text_box .ce_text {
  flex: 0 0 auto;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 p.more {
  margin: 0;
  flex: 0 0 auto;
  padding: 0 1rem 1rem;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  line-height: 0;
  text-align: right;
  box-sizing: border-box;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 p.more a {
  display: inline-block;
  line-height: 1.25;
  padding: 0.5rem 1rem;
  margin: 0;
  border-radius: 8px;
  background-color: #0d948f;
  color: #fff !important;
  font-weight: 500;
}

body.nav-produkte .mod_newslist .block3 .layout_latest_cts.block3 p.more a:hover {
  background-color: #0b7a76;
  color: #fff !important;
}

body.nav-produkte .produkt_inner figcaption {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
