/* Verbesserungen gegenüber dem Original. Schriftgrößen stehen direkt im kopierten main.css (tools/referenz_import.py). */
html{-webkit-text-size-adjust:100%}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--akzentfarbe1);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Kacheln wachsen mit dem Text, statt ihn über das Bild zu legen. */
section.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
section.cats a{display:flex;flex-direction:column;width:auto;padding:0;float:none}
section.cats a picture{position:relative;height:auto;aspect-ratio:4/3;flex:none}
section.cats a div{position:relative;flex:1;bottom:auto;overflow-wrap:break-word;hyphens:auto}

/* Mindestgröße für Klickziele: 24 px, auf Touch-Geräten 44 px. Links im Fließtext ausgenommen. */
section.sitemap ul li a,section.company ul li a,footer ul li a,section.features ul li a{display:flex;align-items:center;min-height:24px}
section.themes .bx-pager .bx-pager-item a{width:24px;height:24px;padding:7px;background-clip:content-box;box-sizing:border-box}
section.themes .bx-pager .bx-pager-item a.active{width:44px}
@media (pointer:coarse),(max-width:719px){
  section.sitemap ul li a,section.company ul li a,footer ul li a,section.features ul li a,section.content .column .cta li a,section.themes .bx-wrapper .bx-viewport .slider .theme div a{min-height:44px;display:flex;align-items:center}
  header .switch b,header .account b,header .cart b{width:44px;height:44px}
  header .switch,header .account,header .cart{min-width:44px;min-height:44px;margin:2px}
  header form input[type=text]{min-height:44px}
  header form input[type=image]{width:44px;height:44px;padding:12px;top:0;right:0}
  ul.panel li a{width:44px;height:44px}
}

/* Konfigurator */
.konfig{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem 1.25rem;margin-block:.5rem 1rem}
.konfig{min-width:0}
.konfig__feld{min-width:0}
.konfig__feld label{display:block;font-weight:700;margin-bottom:.25rem}
.konfig select,.konfig input[type=number]{width:100%;min-height:48px;padding:.5rem .75rem;border:1px solid #6b7075;border-radius:5px;background-color:#fff;color:#000;font:inherit;line-height:1.3;height:auto}
.menge{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;gap:.25rem}
.menge input{text-align:center}
.menge__knopf{min-height:48px;border:1px solid #6b7075;border-radius:5px;background:var(--grundfarbe_hell);color:#000;font-size:1.5rem;line-height:1;cursor:pointer}
.menge__knopf:hover{background:var(--grundfarbe_mittel)}
.hinweis{margin:.5rem 0 1rem;font-weight:700}
form.article_detail .column.sticky .entry{width:calc(100% - 20px)}
.kauf__titel{margin:0;font-weight:700}
.kauf__preis{margin:.1rem 0;color:var(--akzentfarbe1);font-size:2.25rem;line-height:1.1;font-weight:700}
.kauf__einzel{margin:0 0 .85rem;color:#4d4d4d}
.kauf__knopf{display:block;width:100%;min-height:50px;border:0;border-radius:5px;background:var(--akzentfarbe1);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.kauf__knopf:hover{filter:brightness(.88)}
.kauf__knopf:disabled{background:var(--grundfarbe_mittel);cursor:not-allowed}
.kauf__anfrage{display:flex;align-items:center;justify-content:center;min-height:44px;margin-top:.4rem;color:#000;font-weight:700}
.kauf__fehler{margin:0 0 .75rem;color:#8a1414;font-weight:700}
.kauf__hinweis{margin:.5rem 0 0;color:#4d4d4d;font-size:.9em}
form[aria-busy=true] .kauf__preis{opacity:.5}

form.article_detail .column .entry a.kauf__anfrage{position:static;float:none;width:100%;height:auto;margin:.4rem 0 0;padding:0;background:none;color:#000;line-height:1.25;text-decoration:underline}
.konfig select{padding-right:44px;text-overflow:ellipsis}

/* Bestellseite im Rahmen des Themes */
.bestellseite .content-werbung-bestellung{width:min(760px,100%);margin:0 auto;padding-inline:20px}
.bestellseite h1{color:var(--akzentfarbe1)}
.positionen{list-style:none;margin:1rem 0;padding:0;border-top:2px solid #000}
.positionen>li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.1rem 1rem;padding:.75rem 0;border-bottom:1px solid #cccccc}
.positionen ul{grid-column:1;list-style:none;margin:0;padding:0;color:#4d4d4d}
.positionen__preis{grid-column:2;grid-row:1;font-weight:700;white-space:nowrap}
.summe{text-align:right;font-size:1.25em}
.adresse label{display:block;font-weight:700;margin-bottom:.2rem}
.adresse input:not([type=hidden]){display:block;width:100%;max-width:480px;min-height:48px;padding:.5rem .75rem;border:1px solid #6b7075;border-radius:5px;background:#fff;color:#000;font:inherit}
.adresse button{min-height:50px;padding:.6rem 1.5rem;border:0;border-radius:5px;background:var(--akzentfarbe1);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.bestellseite .error{background:#fdeeee;color:#8a1414;border-left:4px solid #8a1414;padding:.75rem 1rem}

/* Bedienelemente */
nav ul li a{line-height:1.25!important}
div.fileupload{min-height:64px}
div.fileupload input[type=file]{height:64px}
div.fileupload label{line-height:1.3!important;padding-block:10px!important}
div.fileupload label h4{line-height:1.3!important}
button.request{height:auto!important;min-height:44px;line-height:1.25!important;white-space:normal!important;padding-block:.6rem!important}
#configurator1-loader{display:none}
#configurator1::before{content:"Der Konfigurator ist im Nachbau noch nicht aktiv.";display:block;padding:.75rem 0;color:var(--grundfarbe_dunkel)}

/* Mittlere Breiten: Das Original bleibt bei 580 px Inhalt, wir nutzen die Fläche. */
@media only screen and (min-width:720px) and (max-width:1439px){
  :root{--rand:max(20px,calc(50% - 560px))}
  body{padding-top:66px}
  header{padding-block:6px}
  header .logo{top:9px}
  header .cart b,header .account b,header .switch b{width:44px;height:44px;background-size:65%}
  header .cart span,header .account span,header .switch span{padding:15px 8px}
  header form{margin:9px;width:calc(22% - 18px)}
  header form input[type=text]{padding:7px 40px 7px 10px}
  header form input[type=image]{top:7px;right:7px;width:30px;height:30px;padding:6px}
  ul.panel li a{width:44px;height:44px}
  section.content,section.content.dark,section.sitemap,footer{padding-left:var(--rand);padding-right:var(--rand)}
  section.stripe{padding-left:calc(var(--rand) + 17px);padding-right:calc(var(--rand) + 17px)}
  section.cats,section.articles{padding-left:calc(var(--rand) + 15px);padding-right:calc(var(--rand) + 15px)}
  header{padding-left:calc(var(--rand) + 15px);padding-right:calc(var(--rand) + 15px)}
  form.article_detail{padding-left:var(--rand)!important;padding-right:var(--rand)!important}
  footer ul li a{line-height:30px}
  form.article_detail .column.wide{width:calc(100% - 330px)}
  form.article_detail .column.sticky{left:auto!important;right:var(--rand);width:290px}
  nav ul:first-child{padding-top:90px}
  section.company ul{padding-right:var(--rand)}
  section.company ul:first-child{padding-left:calc(var(--rand) + 15px);padding-right:35px}
  section.category{height:340px}
  section.category .cat_short{left:var(--rand);width:min(620px,calc(100% - 40px))}
}

/* Handy: Zähler am Warenkorb bleibt ein Zähler. */
@media only screen and (max-width:719px){
  form.article_detail .column,form.article_detail .column.wide,form.article_detail .column.sticky{position:static!important;width:calc(100% - 20px)!important;left:auto!important;right:auto!important}
  section.category{height:auto!important}
  section.category .cat_short{position:relative!important;top:auto!important;left:0!important;transform:none!important;width:100%!important}
  section.category picture{display:none}
  header .cart span{font-size:11px!important;line-height:14px!important;padding:0 4px!important;min-width:16px;height:16px;text-align:center}
}

/* Produktbild mittig in seiner Spalte. */
form.article_detail .column .bx-wrapper{margin-inline:auto!important;float:none!important}

/* Produktseite aus den Originaldaten: Aufbau des Themes, nur Abweichungen stehen hier. */
form.article_detail .column .pics.pics--einzeln{float:none;margin-inline:auto;max-width:100%}
@media only screen and (max-width:1439px){
  .produkt-galerie{display:flex;flex-wrap:wrap;align-items:flex-start;gap:0 10px}
  form.article_detail .column .thumbs{flex:none}
  form.article_detail .column .pics,form.article_detail .column .pics.pics--einzeln{flex:1 1 0;float:none;width:auto;min-width:0;max-width:560px;height:auto;margin-inline:auto}
  form.article_detail .column .pics ul li{display:flow-root;height:auto}
  .produkt-galerie .produkt-bilder{flex:1 1 100%}
}
.produkt-galerie .produkt-bilder{clear:both;float:left;width:100%}
.produkt-galerie .produkt-bilder:empty{display:none}
.produkt-galerie .produkt-bilder img{display:block;max-width:100%;height:auto;margin:10px auto}
form.article_detail .column .entry a.request{display:flex;align-items:center;animation:none;height:auto;min-height:60px;color:#fff;font-weight:var(--schriftstaerke_fett);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:5px;background-repeat:no-repeat;background-position:20px center;background-size:20px;box-sizing:border-box}
@media only screen and (max-width:1439px){
  form.article_detail .column .entry .acrobat,form.article_detail .column .entry .cart,form.article_detail .column .entry a.request{height:auto;min-height:50px;padding:12px 15px 12px 50px;background-position:15px center;background-size:20px;border-radius:5px;font-size:16px;line-height:1.25;letter-spacing:.06em}
  form.article_detail .column fieldset field .download{height:auto;min-height:60px;padding:10px 15px 10px 60px;line-height:1.25}
}
form.article_detail .column .entry input:disabled{cursor:not-allowed;opacity:.55}
form.article_detail .column .entry table tr td h4{margin:0}
form.article_detail .column.sticky .cfg-hinweis{margin:.75rem 0 0;font-size:.85em;line-height:1.35;color:#555}
form.article_detail .column fieldset field{padding-right:10px}
section.content .column .desc div div{display:block}
section.content .column .desc h3:focus-visible{outline:3px solid var(--akzentfarbe1);outline-offset:2px}

/* Konfigurator im Formularbild des Themes */
form.article_detail .cfg-root{--configento-color-accent:var(--akzentfarbe1);font:inherit;padding-bottom:0;background:none}
form.article_detail .cfg-root .cfg-main{padding:0}
form.article_detail .cfg-root .cfg-group__chars{display:flex;flex-flow:row wrap;gap:20px;margin-top:12px}
form.article_detail .cfg-root .cfg-char{position:relative;flex:1 1 100%;min-width:0;margin:0}
form.article_detail .cfg-root .cfg-char.w-33{flex:1 1 calc(33.333% - 14px)}
form.article_detail .cfg-root .cfg-char.w-50{flex:1 1 calc(50% - 10px)}
form.article_detail .cfg-root .cfg-char__head-row{position:absolute;z-index:1;left:10px;top:-.65em;max-width:calc(100% - 20px);padding:0 8px;background:#fff}
form.article_detail .cfg-root .cfg-char__title{font-size:.82rem;line-height:1.3;font-weight:400;color:#595959}
form.article_detail .cfg-root .cfg-char__required{margin-left:1px;color:inherit}
form.article_detail .cfg-root .cfg-input,form.article_detail .cfg-root .cfg-select{min-height:60px;padding:14px 18px;border:2px solid #7d7d7d;border-radius:5px;background-color:#fff;color:#000;font:inherit}
form.article_detail .cfg-root .cfg-select:not([multiple]){padding-right:52px;background-image:url(referenz/images/layout/select.svg);background-position:right center;background-repeat:no-repeat;background-size:contain;text-overflow:ellipsis}
form.article_detail .cfg-root .cfg-abschnitt{flex:1 1 100%;margin:6px 0 -6px;font-size:1.25rem;line-height:1.3;font-weight:400}
form.article_detail .cfg-root .cfg-input:focus,form.article_detail .cfg-root .cfg-select:focus{border-color:var(--akzentfarbe1);outline:none}
form.article_detail .cfg-root .cfg-char__info{margin-top:2px;font-size:.82rem;color:#595959}
@media (max-width:719px){form.article_detail .cfg-root .cfg-char.w-33,form.article_detail .cfg-root .cfg-char.w-50{flex-basis:100%}}

/* Handy: Das Original lässt nur 320 px Inhalt, wir nutzen die volle Breite. */
@media only screen and (max-width:719px){
  section.content{padding-left:0;padding-right:0}
  form.article_detail{padding-left:10px;padding-right:10px}
  section.features{padding-left:10px;padding-right:10px}
  section.features ul li a{padding-left:30px;background-position:left center;background-size:20px}
}

/* Warenkorb */
.warenkorb__position{clear:both;display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:1rem 1.5rem;padding-block:1.25rem;border-top:1px solid var(--grundfarbe_hell);align-items:start}
.warenkorb__bild img{display:block;width:100%;height:auto}
.warenkorb__text h3{margin:0;font-size:1.25rem;line-height:1.3}
.warenkorb__sku{margin:.15rem 0 .6rem;font-size:.9em;color:#555}
.warenkorb__text dl{display:grid;grid-template-columns:minmax(0,max-content) minmax(0,1fr);gap:.1rem 1rem;margin:0 0 .6rem;font-size:.95em;line-height:1.4}
.warenkorb__text dt{color:#555}
.warenkorb__text dd{margin:0}
form .warenkorb__entfernen,.warenkorb__text button.warenkorb__entfernen{display:inline-block;width:auto;height:auto;min-height:44px;padding:0;background:none;border:0;color:var(--akzentfarbe1);font:inherit;letter-spacing:normal;text-align:left;text-transform:none;text-decoration:underline;cursor:pointer}
.warenkorb__preis{margin:0;font-size:1.25rem;font-weight:var(--schriftstaerke_fett);white-space:nowrap}
.warenkorb__summe{clear:both;width:min(400px,calc(100% - 20px))!important;float:right!important;padding-top:1.25rem;border-top:2px solid #000}
.warenkorb__summe p:first-child{display:flex;justify-content:space-between;gap:1rem;margin:0;font-size:1.25rem}
.warenkorb__zusatz{margin:.25rem 0 .75rem;font-size:.9em;color:#555}
.warenkorb__kasse{display:flex;align-items:center;justify-content:center;width:100%;text-decoration:none;min-height:60px;border:0;border-radius:5px;background:var(--akzentfarbe1);color:#fff;font:inherit;font-weight:var(--schriftstaerke_fett);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
a.warenkorb__kasse,a.warenkorb__kasse:hover{color:#fff}
.warenkorb__kasse:hover{filter:brightness(.88)}
@media (max-width:719px){
  .warenkorb__position{grid-template-columns:72px minmax(0,1fr)}
  .warenkorb__preis{grid-column:2}
  .warenkorb__summe{float:left!important;width:calc(100% - 20px)!important}
}

/* Kasse */
.kasse{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:2.5rem}
.kasse__adresse p{margin:0 0 .75rem}
.kasse__fehler{padding:.75rem 1rem;background:#fdeeee;border-left:4px solid #8a1414;color:#8a1414}
.kasse h3{margin:0 0 1rem;font-size:1.25rem;font-weight:var(--schriftstaerke_fett);text-transform:uppercase}
.kasse.adresse input[type=text],.kasse.adresse input[type=email],.kasse.adresse input[type=tel]{max-width:none;min-height:56px;border:2px solid #7d7d7d}
.kasse__feld--fehler input:not([type=checkbox]){border-color:#8a1414!important}
.kasse__feld--fehler label{color:#8a1414}
.kasse__position{display:flex;justify-content:space-between;gap:1rem;margin:0 0 .5rem}
.kasse__summen,section.content .column .entry table.kasse__summen{display:table;float:none;clear:both;width:100%;margin:1rem 0;border-top:1px solid var(--grundfarbe_hell)}
.warenkorb h3{clear:both;margin-top:1.5rem}
.kasse__summen td,section.content .column .entry table.kasse__summen td{padding:.35rem 0;width:auto}
.kasse__summen .amount{text-align:right;white-space:nowrap}
.kasse .kasse__agb label{display:flex;gap:.6rem;align-items:flex-start;min-height:44px;margin:1rem 0;font-weight:400}
.kasse .kasse__agb input[type=checkbox]{display:inline-block;flex:none;width:20px;min-height:0;height:20px;margin:.2rem 0 0;padding:0;appearance:auto}
.warenkorb .kasse__summen{max-width:440px}
@media (max-width:860px){.kasse{grid-template-columns:minmax(0,1fr);gap:1.5rem}}
@media (max-width:719px){section.content .column .entry table.kasse__summen tbody{display:block}section.content .column .entry table.kasse__summen tr{display:flex;justify-content:space-between;gap:1rem}section.content .column .entry table.kasse__summen td{display:block;width:auto}}