/* Container-Styling */
.color-swatch-container {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
}

/* Die Kreise */
.color-dot {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    transition: transform 0.2s, border-color 0.2s;
}

/* Hover-Effekt */
.color-dot:hover {
    transform: scale(1.1);
    border-color: #999;
}

/* Aktive Auswahl markieren */
.color-dot.active {
    border-color: #333;
    box-shadow: 0 0 5px rgba(0,0,0,0.3);
}

.cs-overlayButton.cs-overlayMenuButton {padding: 0.32em 0.5em 0.1em;font-size: 1rem;border: 0;background: #e42910;color: #fff;border: 0;cursor: pointer;width: 160px;border-radius: 250px;padding-left: 13px;}

@media (min-width: 768px){
  .cs-heroPicture .md\:right-8{right:2rem;}
  .cs-heroPicture .md\:h-\[120px\]{height:120px;}
  .cs-heroPicture .md\:h-\[560px\]{height:560px;}
  .cs-heroPicture .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .cs-heroPicture .md\:pb-40{padding-bottom:10rem;}
  .cs-heroPicture .md\:pt-20{padding-top:5rem;}
  .cs-heroPicture .md\:text-7xl{font-size:4rem;line-height:1;margin-bottom: 40px !important;}
}
@media (max-width: 1200px) {
  html body.cs-duck .cs-breadCrumb {margin-top: 1em;}
}
@media (max-width: 1175px) {
  html body.cs-duck .cs-heroPicture .md\:h-\[560px\] {display: none;}
  html body.cs-duck .cs-heroPicture .md\:grid-cols-2 {grid-template-columns: repeat(1,minmax(0,1fr));}
  html body.cs-duck .cs-ducksLogos {max-width: 1360px;margin: -6rem auto 4rem auto;}
}
@media (max-width: 900px) {
  .story-container {flex-direction: column;text-align: center;gap: 40px;}
  .story-container h1 {font-size: 2.2rem;}
  .story-container .features li {padding-left: 0;}
  .story-container .features li::before {display: none;}
  
  html body.cs-duck footer .cs-footerRow.copyright ul {display: block;}
  html body.cs-duck .story-container .content-column {padding: 0 1em;}
  
  html body.cs-duck .cs-ducksLogos {display: none;}
  html body.cs-duck.cs-start section.cs-main {padding-top: 37rem;}
}
@media (max-width: 600px){
  html body.cs-duck header .cs-miniButtons {width: auto;display: inline-block;margin: 1em 0;}
  html body.cs-duck .cs-heroPicture {padding-top: 11em;padding-bottom: 6rem;}
  html body.cs-duck.cs-start section.cs-main {padding-top: 47rem;}
}
@media (max-width: 500px){
  html body.cs-duck .story-container {margin: 7rem auto;}
}
@media (max-width: 1165px) {
  .story-container {margin: 0rem auto;}
  html body.cs-duck.cs-start section.cs-main {padding-top: 42rem;padding-left: 2rem;padding-right: 2rem;}
  .story-container {margin-bottom: 4rem;}
}
@media (max-width: 769px) {
  header .cs-headerContent .cs-container {display: flex;flex-wrap: wrap;background: #f3f5f3;}
  .cs-categoriesTop {display: none !important;}
  html body.cs-duck header .cs-miniButtons {flex: 0 0 100%;margin: 2em 0;display: inline-block;width: auto;}
}