
:root {
  --fx-primary: #0d5ba8;
  --fx-primary-dark: #0a4a8a;
  --fx-accent: #ff7a00;
  --fx-bg: #f5f7fa;
  --fx-dark: #16283c;
  --bs-pagination-active-bg: #0d5ba8;
}

body { background: var(--fx-bg); color: #222; }
/* Redaktionelle Überschriften ohne eigene Klassen (CMS-/Feed-Inhalte) auf max. 1.5rem begrenzen,
   mit absteigender Staffelung – Layout-Überschriften (.h3, .section-title usw.) bleiben unberührt */
h1:not([class]), h1.artueber { font-size: 1.5rem; }
h2:not([class]) { font-size: 1.4rem; }
h3:not([class]) { font-size: 1.3rem; }
h4:not([class]) { font-size: 1.2rem; }
h5:not([class]) { font-size: 1.1rem; }

a { color: var(--fx-primary); text-decoration: none; }
a:hover { color: var(--fx-primary-dark); }

.btn-primary { background: var(--fx-primary); border-color: var(--fx-primary); }
.btn-primary:hover { background: var(--fx-primary-dark); border-color: var(--fx-primary-dark); }
.btn-outline-primary { color: var(--fx-primary); border-color: var(--fx-primary); }
.btn-outline-primary:hover { background: var(--fx-primary); border-color: var(--fx-primary); }
.btn-accent { background: var(--fx-accent); border-color: var(--fx-accent); color: #fff; font-weight: 600; }
.btn-accent:hover { background: #e56d00; border-color: #e56d00; color: #fff; }
.text-accent { color: var(--fx-accent) !important; }
.bg-primary { background: var(--fx-primary) !important; }
.nav-tabs .nav-link {isolation: isolate;border-color: var(--bs-nav-tabs-link-hover-border-color) !important;}

 #tech_bartscher {
    margin-top:20px;
}
#tech_bartscher .tech_row {
    display:block;
    padding:8px;
}
#tech_bartscher .tech_header{
    display:inline-block;
    width:30%;
    min-width:200px;
    font-weight:bold;
}
#tech_bartscher .tech_detail {
    display:inline-block;
}
#tech_bartscher .tech_row:nth-child(even) {
    background-color: #f2f2f2; 
}

#tech_bartscher .tech_row:nth-child(odd) {
    background-color: #ffffff; 
}




/* Admin-Toolbar (à la WordPress) */
.admin-bar {
  position: fixed; top: 0; left: 0; right: 0; height: 36px; z-index: 2000;
  background: #101a26; color: #cfd8e3; font-size: .82rem;
  border-bottom: 1px solid #000; box-shadow: 0 1px 6px rgba(0,0,0,.3);
  white-space: nowrap; overflow-x: auto;
}
.admin-bar a { color: #cfd8e3; text-decoration: none; padding: 0 .2rem; }
.admin-bar a:hover { color: #fff; }
.admin-bar .admin-bar-edit { color: #ffb26b; font-weight: 600; }
.admin-bar .admin-bar-edit:hover { color: #ffcf9e; }
body.has-adminbar { padding-top: 36px; }
body.has-adminbar .site-header.sticky-top { top: 36px; }

.topbar { background: var(--fx-dark); color: #cfe0f2; }
.topbar-link { color: #fff; text-decoration: none; font-weight: 500; }
.topbar-link:hover { color: #ffb26b; }
.site-header { background: #fff; }
.site-header .container {padding:10px;}
.navbar-brand { color: var(--fx-primary); font-size: 2.5rem; }
.brand-dot { color: var(--fx-accent); }
.catnav { background: var(--fx-primary); }
.catnav .nav-link { color: #fff; font-weight: 500; padding: .6rem 1rem; }
.catnav .nav-link:hover { background: var(--fx-primary-dark); color: #fff; }

/* Topleiste: Unterseiten als Hover-Dropdown */
.topbar-drop { display: inline-block; position: relative; }
.topbar-dropdown {
  display: none; position: absolute; top: 100%; left: 0; z-index: 1060;
  min-width: 220px; background: #fff; border: 1px solid #e6ebf1;
  border-radius: .5rem; padding: .35rem 0;
}
.topbar-drop:hover .topbar-dropdown, .topbar-drop:focus-within .topbar-dropdown { display: block; }
.topbar-dropdown-item { display: block; padding: .3rem .9rem; color: #16283c; white-space: nowrap; }
.topbar-dropdown-item:hover { background: var(--fx-bg); color: var(--fx-primary); }

/* Kategorien horizontal in der blauen Leiste, bei Platzmangel umbrechend */
.catnav .nav { flex-wrap: wrap; }

/* Unterkategorien als Hover-Dropdown (Desktop-Leiste ist nur >=lg sichtbar) */
.catnav .dropdown { position: relative; }
.catnav .dropdown-menu {
  display: none; margin: 0; border: 1px solid #e6ebf1; border-radius: 0 0 .6rem .6rem;
  min-width: 250px; padding: .4rem 0;
}
.catnav .dropdown:hover > .dropdown-menu { display: block; top: 100%; left: 0; }
.catnav .dropdown-item { padding: .45rem 1.1rem; font-size: .93rem; }
.catnav .dropdown-item:hover { background: var(--fx-bg); color: var(--fx-primary); }
.catnav .dropdown-toggle::after { margin-left: .35rem; vertical-align: .12em; }

/* Mobile: Unterkategorien-Aufklapper */
.mobile-catnav .nav-link { color: #16283c; }
.mobile-catnav .btn-link { color: var(--fx-primary); }
.mobile-catnav .btn-link:not(.collapsed) .bi-chevron-down { transform: rotate(180deg); }
.mobile-catnav .bi-chevron-down { transition: transform .2s; display: inline-block; }

/* Unterkategorie-Kacheln (kategorie.php) */
.subcat-card {
  display: flex; flex-direction: column; align-items: center; gap: .35rem;
  background: #fff; border: 1px solid #e3e8ef; border-radius: .75rem;
  padding: 1rem .75rem; text-align: center; height: 100%;
  transition: box-shadow .15s, border-color .15s, transform .15s;
}
.subcat-card:hover {
  border-color: var(--fx-primary);
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);
  transform: translateY(-2px);
}
.subcat-card img { height: 64px; max-width: 100%; object-fit: contain; }
.subcat-icon { height: 64px; display: flex; align-items: center; justify-content: center; font-size: 2rem; color: var(--fx-primary); }
.subcat-name { font-weight: 600; color: var(--fx-dark); line-height: 1.25; }
.subcat-card:hover .subcat-name { color: var(--fx-primary); }

/* Blog-Sidebar: weitere Beiträge */
.blog-side-item .blog-side-title { color: var(--fx-dark); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.blog-side-item:hover .blog-side-title { color: var(--fx-primary); }

/* CMS-/Blog-Titelbild: volle Breite zwischen Überschrift und Inhalt */
.cms-hero { display: block; width: 100%; max-height: 500px; object-fit: cover; }

/* Hero-Slider */
/* Feste Proportion = Bildverhältnis des Zuschnitts (1600x520):
   so wird die Grafik immer KOMPLETT angezeigt, nie erneut beschnitten */
.hero-slide { aspect-ratio: 1600 / 520; border-radius: 1rem; background-size: cover; background-position: center; display: flex; align-items: center; position: relative; overflow: hidden; }
/* Kein flächiger Verdunkelungs-Verlauf mehr – Lesbarkeit kommt vom Panel hinter dem Text */
.hero-content {
  position: relative; z-index: 1; color: #fff;
  margin: 1.5rem 2rem; padding: 1.5rem 2rem; max-width: 560px;
  background: rgba(22, 40, 60, .55);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: .9rem;
  box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .2);
}
.hero-content.text-center { margin-left: auto; margin-right: auto; text-align: center; }
.hero-content.text-end { margin-left: auto; }

/* Produktkarten */
.product-card { background: #fff; border: 1px solid #e6ebf1; border-radius: .9rem; transition: box-shadow .2s, transform .2s; height: 100%; display: flex; flex-direction: column; }
.product-card:hover { box-shadow: 0 .6rem 1.4rem rgba(13,91,168,.14); transform: translateY(-3px); }
.product-card .card-img-wrap { height: 220px; display: flex; align-items: center; justify-content: center; padding: 1rem; background: #fff; border-radius: .9rem .9rem 0 0; }
.product-card .card-img-wrap img { width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 575.98px) { .product-card .card-img-wrap { height: 160px; } }
.product-card .card-body { display: flex; flex-direction: column; flex-grow: 1; }
.product-card .title { font-size: .95rem; font-weight: 600; color: #16283c; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; }
.rate-badge { color: var(--fx-accent); font-weight: 800; font-size: 1.25rem; }
.rate-badge small { color: #6c7a89; font-weight: 400; font-size: .75rem; }
.badge-new { background: var(--fx-accent); }
.badge-top { background: var(--fx-primary); }

/* Kategorie-Kacheln */
.cat-tile { background: #fff; border-radius: .9rem; padding: 1.4rem 1rem; text-align: center; border: 1px solid #e6ebf1; transition: all .2s; display: block; color: #16283c; height: 100%; }
.cat-tile:hover { border-color: var(--fx-primary); box-shadow: 0 .4rem 1rem rgba(13,91,168,.12); color: var(--fx-primary); }
.cat-tile i { font-size: 2rem; color: var(--fx-primary); }
.cat-tile-img { height: 48px; max-width: 90%; object-fit: contain; }

/* Produktdetail */
.product-gallery-main { aspect-ratio: 1/1; background: #fff; border: 1px solid #e6ebf1; border-radius: .9rem; display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.product-gallery-main img { max-width: 100%; max-height: 100%; object-fit: contain; }
.thumb { width: 64px; height: 64px; object-fit: contain; background: #fff; border: 1px solid #e6ebf1; border-radius: .5rem; padding: .3rem; cursor: pointer; }
.thumb.active { border-color: var(--fx-primary); }
.video-thumb { display: inline-flex; align-items: center; justify-content: center; background: #16283c; color: #fff; }
.video-thumb i { font-size: 1.7rem; line-height: 1; }
.video-thumb:hover { color: var(--fx-accent); }
/* Video im Galerie-Hauptbereich: volle Breite ohne Innenabstand */
.product-gallery-main.has-video { padding: 0; overflow: hidden; }
.product-gallery-main.has-video .ratio { width: 100%; }
.product-gallery-main.has-video iframe { border: 0; width: 100%; height: 100%; }
.buy-box { background: #fff; border: 1px solid #e6ebf1; border-radius: .9rem; position: sticky; top: 90px; }
.term-option { border: 2px solid #e6ebf1; border-radius: .7rem; padding: .8rem 1rem; cursor: pointer; transition: all .15s; }
.term-option:hover { border-color: var(--fx-primary); }
.term-option.selected { border-color: var(--fx-accent); background: #fff7f0; }
.term-option .rate { font-weight: 800; font-size: 1.15rem; color: var(--fx-accent); }

/* Bartscher-Feedblöcke (div#desc_bartscher Beschreibung, div#tech_bartscher technische Daten)
   sauber ins Shop-Design einpassen */
#desc_bartscher, #tech_bartscher { font-size: .95rem; line-height: 1.65; color: inherit; }
#desc_bartscher::after, #tech_bartscher::after { content: ""; display: block; clear: both; }   /* Floats einfangen */
#desc_bartscher *, #tech_bartscher * {
  max-width: 100% !important;
  font-family: inherit !important;
  color: inherit !important;
  background-color: transparent;
}
#desc_bartscher div, #desc_bartscher section,
#tech_bartscher div, #tech_bartscher section { margin: 0 0 .75rem; }
#desc_bartscher p, #tech_bartscher p { margin: 0 0 .75rem; }
#desc_bartscher h1, #desc_bartscher h2, #desc_bartscher h3,
#desc_bartscher h4, #desc_bartscher h5, #desc_bartscher h6,
#tech_bartscher h1, #tech_bartscher h2, #tech_bartscher h3,
#tech_bartscher h4, #tech_bartscher h5, #tech_bartscher h6 {
  font-size: 1.05rem !important; font-weight: 700 !important;
  color: var(--fx-dark) !important; margin: 1.25rem 0 .5rem; line-height: 1.3;
}
#desc_bartscher ul, #desc_bartscher ol,
#tech_bartscher ul, #tech_bartscher ol { margin: 0 0 1rem; padding-left: 1.25rem; }
#desc_bartscher li, #tech_bartscher li { margin-bottom: .3rem; }
#desc_bartscher ul li::marker, #tech_bartscher ul li::marker { color: var(--fx-primary); }
#desc_bartscher img, #tech_bartscher img {
  height: auto !important; border-radius: .5rem;
  margin: .35rem 0 .75rem; float: none !important; display: block;
}
#desc_bartscher table, #tech_bartscher table {
  width: 100% !important; border-collapse: collapse; margin: 0 0 1rem;
  font-size: .9rem; background: #fff;
}
#desc_bartscher th, #desc_bartscher td,
#tech_bartscher th, #tech_bartscher td {
  border: 1px solid #e6ebf1 !important; padding: .45rem .65rem !important;
  vertical-align: top; text-align: left;
}
#desc_bartscher th, #desc_bartscher tr:first-child td:only-child,
#tech_bartscher th, #tech_bartscher tr:first-child td:only-child { font-weight: 600; }
#desc_bartscher tr:nth-child(even) td, #tech_bartscher tr:nth-child(even) td { background: #f8fafc; }
#desc_bartscher td:first-child, #tech_bartscher td:first-child { width: 45%; }
/* Technische Daten als Definitionsliste (dl/dt/dd) -> zweispaltige Zebra-Optik */
#desc_bartscher dl, #tech_bartscher dl {
  display: grid; grid-template-columns: minmax(45%, auto) 1fr;
  margin: 0 0 1rem; border: 1px solid #e6ebf1; background: #fff;
}
#desc_bartscher dt, #desc_bartscher dd, #tech_bartscher dt, #tech_bartscher dd {
  padding: .45rem .65rem; margin: 0; border-bottom: 1px solid #e6ebf1;
}
#desc_bartscher dt, #tech_bartscher dt { font-weight: 600; }
#desc_bartscher dt:nth-of-type(even), #desc_bartscher dd:nth-of-type(even),
#tech_bartscher dt:nth-of-type(even), #tech_bartscher dd:nth-of-type(even) { background: #f8fafc; }
#desc_bartscher a, #tech_bartscher a { color: var(--fx-primary) !important; text-decoration: underline; }
#desc_bartscher hr, #tech_bartscher hr { margin: 1rem 0; border-color: #e6ebf1; }
#desc_bartscher iframe, #desc_bartscher video,
#tech_bartscher iframe, #tech_bartscher video { display: none; }   /* Fremd-Einbettungen (DSGVO) ausblenden */
@media (max-width: 575.98px) {
  #desc_bartscher td:first-child, #tech_bartscher td:first-child { width: auto; }
  #desc_bartscher dl, #tech_bartscher dl { grid-template-columns: 1fr; }
}

/* Bartscher: tech_row-Zeilen (tech_header links, tech_detail daneben) als saubere Datentabelle */
#desc_bartscher .tech_row, #tech_bartscher .tech_row {
  display: flex; margin: 0 !important;
  border: 1px solid #e6ebf1; border-top: none; background: #fff;
}
#desc_bartscher .tech_row:first-of-type, #tech_bartscher .tech_row:first-of-type { border-top: 1px solid #e6ebf1; }
#desc_bartscher .tech_row:nth-of-type(even), #tech_bartscher .tech_row:nth-of-type(even) { background: #f8fafc; }
#desc_bartscher .tech_header, #tech_bartscher .tech_header {
  flex: 0 0 45%; margin: 0 !important; padding: .45rem .65rem;
  font-weight: 600; text-align: left !important;
}
#desc_bartscher .tech_detail, #tech_bartscher .tech_detail {
  flex: 1; margin: 0 !important; padding: .45rem .65rem; text-align: left !important;
}
@media (max-width: 575.98px) {
  #desc_bartscher .tech_row, #tech_bartscher .tech_row { flex-direction: column; }
  #desc_bartscher .tech_header, #tech_bartscher .tech_header { flex-basis: auto; padding-bottom: 0; }
}

/* Technische Daten: div#tech_details_table mit tech_row / tech_left / tech_right
   -> gleiche Optik wie die Bartscher-Datentabelle */
#tech_details_table { font-size: .95rem; line-height: 1.65; margin: 0 0 1rem; }
#tech_details_table .tech_row {
  display: flex; margin: 0 !important;
  border: 1px solid #e6ebf1; border-top: none; background: #fff;
}
#tech_details_table .tech_row:first-of-type { border-top: 1px solid #e6ebf1; }
#tech_details_table .tech_row:nth-of-type(even) { background: #f8fafc; }
#tech_details_table .tech_left {
  flex: 0 0 45%; margin: 0 !important; padding: .45rem .65rem;
  font-weight: 600; text-align: left !important;
}
#tech_details_table .tech_right {
  flex: 1; margin: 0 !important; padding: .45rem .65rem; text-align: left !important;
}
@media (max-width: 575.98px) {
  #tech_details_table .tech_row { flex-direction: column; }
  #tech_details_table .tech_left { flex-basis: auto; padding-bottom: 0; }
}

/* idealo-Datenblatt-Tabellen (table.datasheet-list) -> Optik wie die Bartscher-Datentabelle */
.datasheet-list {
  width: 100% !important; border-collapse: collapse; margin: 0 0 1rem;
  font-size: .9rem; line-height: 1.6; background: #fff;
}
.datasheet-list td, .datasheet-list th {
  border: 1px solid #e6ebf1 !important; padding: .45rem .65rem !important;
  vertical-align: top; text-align: left !important; float: none !important;
}
.datasheet-list .datasheet-listItemKey { width: 45% !important; font-weight: 600; }
.datasheet-list td p { margin: 0; }
.datasheet-list td span { color: inherit !important; font-size: inherit !important; font-family: inherit !important; }
.datasheet-list tr:nth-child(even) td { background: #f8fafc; }
/* Gruppen-Überschriften ("Energielabeldaten" usw.) über die volle Breite */
.datasheet-list tr.datasheet-listItem--group,
.datasheet-list tr.datasheet-listItem--group th { display: block; width: 100% !important; }
.datasheet-list tr.datasheet-listItem--group th {
  background: #eef3f9; color: var(--fx-dark); font-weight: 700;
  border-top: 1px solid #e6ebf1 !important;
}
@media (max-width: 575.98px) {
  .datasheet-list tr, .datasheet-list td { display: block; width: 100% !important; }
  .datasheet-list .datasheet-listItemKey { padding-bottom: 0 !important; border-bottom: none !important; }
  .datasheet-list td:not(.datasheet-listItemKey) { border-top: none !important; }
}

/* Spec-Panels (div.spec-panel mit spec-heading / spec-row) -> Optik wie die Datentabellen */
.spec-panel { font-size: .9rem; line-height: 1.6; margin: 0 0 1rem; }
.spec-panel .spec-heading {
  background: #eef3f9; color: var(--fx-dark); font-weight: 700;
  padding: .45rem .65rem; border: 1px solid #e6ebf1;
}
.spec-panel .spec-body > .row {
  display: flex; flex-wrap: nowrap; margin: 0 !important;
  border: 1px solid #e6ebf1; border-top: none; background: #fff;
}
.spec-panel .spec-body > .row:nth-child(even) { background: #f8fafc; }
.spec-panel .spec-body > .row > [class*="col-"] {
  flex: 1 1 auto; width: auto !important; max-width: none !important;
  padding: .45rem .65rem !important;
}
.spec-panel .spec-label { flex: 0 0 45% !important; font-weight: 600; text-align: left !important; }
@media (max-width: 575.98px) {
  .spec-panel .spec-body > .row { flex-direction: column; }
  .spec-panel .spec-label { flex-basis: auto !important; padding-bottom: 0 !important; }
}

/* Generische Datentabellen in den Produkt-Tabs (z.B. Feed-Tabellen mit c1–c4-Spalten):
   einheitliche Optik wie die Bartscher-Datentabelle */
.product-tabs table {
  width: 100% !important; border-collapse: collapse; margin: 0 0 1rem;
  font-size: .9rem; line-height: 1.6; background: #fff;
}
.product-tabs table td, .product-tabs table th {
  border: 1px solid #e6ebf1 !important; padding: .45rem .65rem !important;
  vertical-align: top; text-align: left !important;
}
.product-tabs table tr:nth-child(even) td { background: #f8fafc; }
.product-tabs table span { color: inherit !important; font-size: inherit !important; font-family: inherit !important; }
.product-tabs table p { margin: 0; }
/* Hierarchie-Spalten der Feed-Tabellen */
.product-tabs td.c1 { width: 24%; font-weight: 600; }
.product-tabs td.c2 { width: 18%; font-weight: 600; color: #5a6b7d; }
.product-tabs td.c3 { width: 18%; color: #5a6b7d; }
@media (max-width: 575.98px) {
  .product-tabs table { font-size: .8rem; }
  .product-tabs table td, .product-tabs table th { padding: .3rem .4rem !important; }
}

/* Produktsicherheit: Herstellertexte immer in Standard-Schrift und -Farbe */
.psafe-content, .psafe-content * {
  color: inherit !important;
  font-size: inherit !important;
  font-family: inherit !important;
  background-color: transparent;
}
.psafe-content h1, .psafe-content h2, .psafe-content h3,
.psafe-content h4, .psafe-content h5, .psafe-content h6 {
  font-size: 1rem !important; font-weight: 700; margin: .75rem 0 .35rem;
}

/* Ticket-Kundenansicht (ticket.php) */
.ticket-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem;
  background: #fff; border: 1px solid #e6ebf1; border-radius: .9rem;
  padding: 1.1rem 1.4rem; margin-bottom: 1.25rem;
}
.ticket-thread { display: flex; flex-direction: column; gap: 1rem; }
.tmsg { display: flex; gap: .75rem; align-items: flex-start; }
.tmsg-shop { flex-direction: row; }
.tmsg-kunde { flex-direction: row-reverse; }
.tmsg-avatar {
  width: 40px; height: 40px; flex-shrink: 0; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 1.1rem; color: #fff;
}
.tmsg-shop .tmsg-avatar { background: var(--fx-primary); }
.tmsg-kunde .tmsg-avatar { background: var(--fx-accent); }
.tmsg-bubble {
  max-width: 82%; border: 1px solid #e6ebf1; border-radius: .8rem; padding: .7rem 1rem; background: #fff;
}
.tmsg-kunde .tmsg-bubble { background: #fff6ee; border-color: #f6d9bf; }
.tmsg-meta { display: flex; justify-content: space-between; gap: 1rem; font-size: .78rem; color: #6c7a89; margin-bottom: .35rem; }
.tmsg-meta strong { color: var(--fx-dark); font-weight: 600; }
.tmsg-text { line-height: 1.55; }
.tmsg-file { display: inline-flex; align-items: center; gap: .3rem; margin-top: .5rem; font-size: .85rem; }
.ticket-reply, .ticket-info { background: #fff; border: 1px solid #e6ebf1; border-radius: .9rem; padding: 1.25rem 1.4rem; }
.ticket-info { position: sticky; top: 1rem; }
.ticket-info-list { display: grid; grid-template-columns: auto 1fr; gap: .4rem 1rem; margin: 0; font-size: .9rem; }
.ticket-info-list dt { color: #6c7a89; font-weight: 500; }
.ticket-info-list dd { margin: 0; font-weight: 600; color: var(--fx-dark); text-align: right; }
@media (max-width: 575.98px) {
  .tmsg-bubble { max-width: 100%; }
}

/* FAQ-Akkordeon: geöffnete Frage in Shopblau */
.accordion-button:not(.collapsed) {
  background-color: var(--fx-primary);
  color: #fff;
  box-shadow: none;
}
.accordion-button:not(.collapsed)::after {
  /* Pfeil-Icon in Weiß einfärben */
  filter: brightness(0) invert(1);
}
.accordion-button:focus {
  border-color: var(--fx-primary);
  box-shadow: 0 0 0 .2rem rgba(13, 91, 168, .2);
}

/* Frontend-Hinweisbox (Admin -> Hinweisbox): volle Breite, oben */
.site-notice { border-radius: 0; margin-bottom: 0; border-left: 0; border-right: 0; }
.site-notice p:last-child { margin-bottom: 0; }

/* Downloads-Box auf der Artikelseite */
.downloads-box {
  background: #f8fafc; border: 1px solid #e6ebf1;
  border-radius: .75rem; padding: 1rem;
}
.download-item {
  display: flex; align-items: center; gap: .6rem;
  background: #fff; border: 1px solid #e6ebf1; border-radius: .6rem;
  padding: .2rem .45rem; color: var(--fx-dark);
  font-weight: 600; font-size: .9rem; text-decoration: none;
  transition: border-color .15s, box-shadow .15s, color .15s;
}
.download-item:hover {
  border-color: var(--fx-primary); color: var(--fx-primary);
  box-shadow: 0 .25rem .6rem rgba(0,0,0,.08);
}
.download-ico {
  width: 34px; height: 34px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--fx-primary); color: #fff;
  border-radius: .5rem; font-size: 1.05rem;
}
.download-arrow { color: #9aa8b6; transition: color .15s; }
.download-item:hover .download-arrow { color: var(--fx-primary); }

/* Warenkorb: einheitliche Artikel-Vorschaubilder */
.cart-thumb { width: 100%; height: 90px; object-fit: contain; background: #fff;
  border: 1px solid #e6ebf1; border-radius: .5rem; padding: .3rem; }

/* Echtzeitsuche */
.live-search-results {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 1050;
  background: #fff; border: 1px solid #e6ebf1; border-radius: 0 0 .6rem .6rem;
  box-shadow: 0 .8rem 1.6rem rgba(22,40,60,.15); max-height: 420px; overflow-y: auto;
}
.ls-item { display: flex; gap: .7rem; align-items: center; padding: .55rem .8rem;
  border-bottom: 1px solid #f0f3f8; color: #16283c; text-decoration: none; }
.ls-item:hover { background: var(--fx-bg); }
.ls-item img { width: 44px; height: 44px; object-fit: contain; flex-shrink: 0; }
.ls-title { font-size: .9rem; font-weight: 600; line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ls-rate { font-size: .8rem; color: var(--fx-accent); font-weight: 600; }
.ls-all { display: block; text-align: center; padding: .6rem; font-size: .88rem;
  font-weight: 600; color: var(--fx-primary); text-decoration: none; background: #f8fafc; }
.ls-all:hover { background: var(--fx-bg); }
.ls-empty { padding: .8rem; color: #6c7a89; font-size: .9rem; text-align: center; }

/* Netzteil-Grafiken (Werte werden per CSS auf netzteil.png gelegt) */
.psu-trigger:hover { opacity: .85; }
.psu-box { position: relative; display: inline-block; }
.psu-box img { height: 100%; width: auto; display: block; }
.psu-text {
  position: absolute; left: 6%; right: 6%; top: 36%; bottom: 5%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-weight: 700; font-size: 12px; line-height: 1.15; text-align: center; color: #000;
}
.psu-text-lg { font-size: 16px; }

/* Cookie-Hinweis */
.cookie-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1080;
  background: var(--fx-dark); color: #dbe6f2;
  box-shadow: 0 -4px 16px rgba(0,0,0,.25);
}
.cookie-banner a { color: #fff; text-decoration: underline; }

.usp-bar { background: #fff; border-top: 1px solid #e6ebf1; color: var(--fx-primary); }
.usp-bar .fw-semibold { color: #16283c; }
.site-footer { background: var(--fx-dark); color: #b8c7d9; }
.site-footer a { color: #d7e4f2; }
.site-footer a:hover { color: #fff; }
.site-footer h5, .site-footer h6 { color: #fff; }

/* Pagination in Shopfarben */
.page-link { color: var(--fx-primary); }
.page-link:hover { color: var(--fx-primary-dark); background: var(--fx-bg); border-color: #dee2e6; }
.page-link:focus { box-shadow: 0 0 0 .2rem rgba(13, 91, 168, .2); color: var(--fx-primary-dark); }
.page-item.active .page-link { background: var(--fx-primary); border-color: var(--fx-primary); color: #fff; }

/* Redaktioneller Beitragstext (Blog): Überschriften auf Seiten-Maßstab bringen */
.article-body { line-height: 1.7; }
.article-body h1, .article-body h2, .article-body h3,
.article-body h4, .article-body h5, .article-body h6 {
  font-weight: 700; color: #16283c; line-height: 1.3; margin: 1.4rem 0 .6rem;
}
.article-body h1 { font-size: 1.35rem; }
.article-body h2 { font-size: 1.2rem; }
.article-body h3 { font-size: 1.1rem; }
.article-body h4, .article-body h5, .article-body h6 { font-size: 1rem; }
.article-body > :first-child { margin-top: 0; }
.article-body img { max-width: 100%; height: auto; border-radius: .4rem; }

/* SEO-Optimierungstext unter „Zuletzt angesehen" auf der Artikelseite */
.seo-text { font-size: .9rem; color: #5b6b7c; border-top: 1px solid #e6ebf1; padding-top: 1.2rem; }
.seo-text h1, .seo-text h2, .seo-text h3, .seo-text h4 { color: #16283c; }

/* Seitenleiste einer CMS-Seite (Unterseiten, Tag-Seiten, Hilfe-Box) */
.cms-help-box { position: sticky; top: 1rem; }
.cms-help-box .card-body { background: #f4f8fc; border-radius: .5rem; }
.sidebar-box .card-body { background: #fff; border-radius: .5rem; }
.sidebar-links .list-group-item { border: none; font-size: .92rem; color: #16283c; background: transparent; }
.sidebar-links .list-group-item:hover { color: #0d5ba8; }
.sidebar-links .list-group-item i { color: var(--fx-accent); }

.section-title { font-weight: 700; color: #16283c; position: relative; padding-bottom: .5rem; margin-bottom: 1.5rem; }
.section-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 56px; height: 3px; background: var(--fx-accent); border-radius: 2px; }

@media (max-width: 575px) {
  /* Mobil: 3:1 wäre zu flach für den Textblock -> etwas höher, Bild mittig (leichter Randbeschnitt) */
  .hero-slide { aspect-ratio: auto; min-height: 230px; }
  .hero-content { margin: 1rem; padding: 1rem 1.2rem; }
  .hero-content h2 { font-size: 1.3rem; }
}
