/* Anpassbare Bildmaße. */
.ssk-campaign {
  z-index: 2147483001 !important;
  visibility: hidden;
  pointer-events: none;
}

.ssk-campaign[hidden] {
  display: none !important;
}

.ssk-campaign.ssk-visible:not([hidden]) {
  visibility: visible;
  pointer-events: auto;
}

.ssk-campaign .ssk-image {
  width: var(--ssk-image-width, 35%);
}

.ssk-campaign.ssk-img-top .ssk-image {
  width: 100%;
  height: var(--ssk-image-height, 210px);
}

.ssk-campaign.ssk-img-background .ssk-image {
  width: auto;
}

.ssk-campaign .ssk-copy {
  padding: var(--ssk-copy-padding, 30px);
}

.ssk-campaign.ssk-modal {
  width: min(var(--ssk-popup-width, 560px), calc(100vw - 40px));
  max-width: none;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  box-sizing: border-box;
}

/* Die sichtbare Animation darf die eigentliche Zentrierung nicht aufheben. */
.ssk-campaign.ssk-pos-center.ssk-visible {
  transform: translate(-50%, -50%) !important;
}

.ssk-campaign.ssk-pos-top-center.ssk-visible,
.ssk-campaign.ssk-pos-bottom-center.ssk-visible {
  transform: translateX(-50%) !important;
}

.ssk-campaign.ssk-pos-center.ssk-anim-slide:not(.ssk-visible) {
  transform: translate(-50%, calc(-50% + 30px));
}

.ssk-campaign.ssk-pos-center.ssk-anim-zoom:not(.ssk-visible) {
  transform: translate(-50%, -50%) scale(0.9);
}

.ssk-campaign.ssk-pos-top-center.ssk-anim-slide:not(.ssk-visible),
.ssk-campaign.ssk-pos-bottom-center.ssk-anim-slide:not(.ssk-visible) {
  transform: translate(-50%, 30px);
}

/* Separate Lightbox-Ebene, damit sie nicht vom Popup abgeschnitten wird. */
.ssk-campaign.ssk-modal::before {
  display: none;
}

.ssk-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483000 !important;
  display: block;
  background: rgba(24, 12, 11, 0.76) !important;
  background: rgb(24 12 11 / var(--ssk-overlay-opacity, 76%)) !important;
  backdrop-filter: blur(var(--ssk-overlay-blur, 6px));
  -webkit-backdrop-filter: blur(var(--ssk-overlay-blur, 6px));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease;
  cursor: pointer;
}

.ssk-overlay[hidden] {
  display: none !important;
}

.ssk-overlay.ssk-visible:not([hidden]) {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

html.ssk-modal-open,
html.ssk-modal-open body {
  overflow: hidden;
}

/* Der rechtlich notwendige Complianz-Dialog hat immer Vorrang. */
#cmplz-cookiebanner-container,
#cmplz-cookiebanner-container .cmplz-cookiebanner,
.cmplz-cookiebanner.cmplz-show {
  z-index: 2147483646 !important;
}

.ssk-campaign .ssk-button {
  color: var(--ssk-btn-color) !important;
}

/* Eigener, theme-unabhängiger Schließen-Button. */
.ssk-campaign button.ssk-close {
  appearance: none !important;
  position: absolute !important;
  right: 14px !important;
  top: 14px !important;
  z-index: 5 !important;
  display: grid !important;
  place-items: center !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #5a302d !important;
  color: #fff !important;
  box-shadow: 0 5px 16px rgb(55 31 28 / 24%) !important;
  cursor: pointer !important;
}

.ssk-campaign button.ssk-close span,
.ssk-campaign button.ssk-close span::before {
  display: block;
  width: 15px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  content: "";
}

.ssk-campaign button.ssk-close span {
  transform: rotate(45deg);
}

.ssk-campaign button.ssk-close span::before {
  transform: rotate(90deg);
}

.ssk-campaign button.ssk-close:hover {
  background: #9a3f38 !important;
  transform: scale(1.06);
}

@media (max-width: 782px) {
  .ssk-campaign .ssk-image {
    width: var(--ssk-image-width, 42%);
  }

  .ssk-campaign.ssk-img-top .ssk-image {
    width: 100%;
    height: min(var(--ssk-image-height, 210px), 260px);
  }

  .ssk-campaign .ssk-copy {
    padding: min(var(--ssk-copy-padding, 30px), 28px);
  }

  .ssk-campaign.ssk-pos-center.ssk-visible,
  .ssk-campaign.ssk-pos-top-center.ssk-visible,
  .ssk-campaign.ssk-pos-bottom-center.ssk-visible {
    left: 15px !important;
    right: 15px !important;
    transform: none !important;
  }

  .ssk-campaign.ssk-modal.ssk-pos-center,
  .ssk-campaign.ssk-modal.ssk-pos-center.ssk-visible {
    left: 50% !important;
    right: auto !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
  }
}

/* Auf schmalen Bildschirmen wird das Bild vollständig und platzsparend gezeigt. */
@media (max-width: 620px) {
  .ssk-campaign.ssk-modal.ssk-img-side-left,
  .ssk-campaign.ssk-modal.ssk-img-side-right {
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .ssk-campaign.ssk-modal.ssk-img-side-left .ssk-image,
  .ssk-campaign.ssk-modal.ssk-img-side-right .ssk-image {
    width: 100% !important;
    height: clamp(110px, 24vh, 165px);
    height: clamp(110px, 24dvh, 165px);
    min-height: 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }

  .ssk-campaign.ssk-modal .ssk-copy {
    padding: 20px 22px 22px;
  }

  .ssk-campaign.ssk-modal .ssk-copy h2 {
    font-size: 21px !important;
  }
}

/* Auch bei niedrigen Desktopfenstern darf das Bild das Popup nicht sprengen. */
@media (max-height: 700px) and (min-width: 621px) {
  .ssk-campaign.ssk-modal {
    overflow-y: auto;
  }

  .ssk-campaign.ssk-modal.ssk-img-side-left .ssk-image,
  .ssk-campaign.ssk-modal.ssk-img-side-right .ssk-image {
    width: clamp(105px, 28%, 145px) !important;
    min-height: 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }

  .ssk-campaign.ssk-modal .ssk-copy {
    padding: 20px 22px;
  }
}

/* Motive bei jeder Fenstergröße vollständig und proportional einpassen. */
.ssk-campaign .ssk-image {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Suite 0.7.2: erweiterte Gestaltung */
.ssk-campaign{
  border:var(--ssk-border-width,0) solid var(--ssk-border-color,#ded7d3);
  border-left:7px solid var(--ssk-accent);
  border-radius:var(--ssk-radius,14px);
}
.ssk-campaign.ssk-type-top,.ssk-campaign.ssk-type-bottom{
  border:var(--ssk-border-width,0) solid var(--ssk-border-color,#ded7d3);
  border-top:6px solid var(--ssk-accent);
}
.ssk-campaign.ssk-shadow{box-shadow:0 var(--ssk-shadow-y,18px) var(--ssk-shadow-blur,54px) rgb(55 31 28 / var(--ssk-shadow-opacity,.25))}
.ssk-campaign .ssk-copy{padding:var(--ssk-copy-padding,30px);text-align:var(--ssk-text-align,left)}
.ssk-campaign .ssk-copy small{font-size:var(--ssk-eyebrow-size,12px)}
.ssk-campaign .ssk-copy h2{color:var(--ssk-headline,var(--ssk-color))!important;font-size:var(--ssk-headline-size,24px)!important;font-weight:var(--ssk-headline-weight,800)!important}
.ssk-campaign .ssk-text,.ssk-campaign .ssk-text p{font-size:var(--ssk-text-size,16px);line-height:var(--ssk-line-height,1.5)}
.ssk-campaign .ssk-text a{color:var(--ssk-link,var(--ssk-accent))!important}
.ssk-campaign .ssk-button{font-size:var(--ssk-button-size,15px);padding:var(--ssk-button-py,10px) var(--ssk-button-px,16px);border-radius:var(--ssk-button-radius,6px);background:var(--ssk-btn)}
.ssk-campaign .ssk-button:hover,.ssk-campaign .ssk-button:focus{background:var(--ssk-btn-hover,var(--ssk-accent));color:var(--ssk-btn-color)!important}
.ssk-campaign.ssk-button-align-center .ssk-button{display:block;width:max-content;margin-left:auto;margin-right:auto}
.ssk-campaign.ssk-button-align-right .ssk-button{display:block;width:max-content;margin-left:auto}
.ssk-campaign.ssk-button-full .ssk-button{display:block!important;width:100%!important;text-align:center;margin-left:0!important;margin-right:0!important}
.ssk-campaign .ssk-image{background-size:var(--ssk-image-fit,contain);background-position:var(--ssk-image-focus,center center);border-radius:var(--ssk-image-radius,0);opacity:var(--ssk-image-opacity,100%)}
.ssk-campaign.ssk-img-background .ssk-image{opacity:var(--ssk-bg-image-opacity,18%)}
.ssk-overlay{background:var(--ssk-overlay-background,rgba(24,12,11,.76))!important}

.ssk-campaign button.ssk-close{
  right:var(--ssk-close-offset,14px)!important;
  top:var(--ssk-close-offset,14px)!important;
  width:var(--ssk-close-size,34px)!important;
  min-width:var(--ssk-close-size,34px)!important;
  height:var(--ssk-close-size,34px)!important;
  min-height:var(--ssk-close-size,34px)!important;
  background:var(--ssk-close-bg,#5a302d)!important;
  color:var(--ssk-close-color,#fff)!important;
}
.ssk-campaign button.ssk-close:hover{background:var(--ssk-close-hover,#9a3f38)!important}
.ssk-campaign.ssk-close-style-rounded button.ssk-close{border-radius:9px!important}
.ssk-campaign.ssk-close-style-plain button.ssk-close{background:transparent!important;box-shadow:none!important;border-radius:0!important}

@media (min-width:783px) and (max-width:1100px){
  .ssk-campaign.ssk-modal{width:min(var(--ssk-popup-width-tablet,520px),calc(100vw - 32px))}
  .ssk-campaign .ssk-copy{padding:var(--ssk-copy-padding-tablet,26px)}
  .ssk-campaign .ssk-image{width:var(--ssk-image-width-tablet,38%)}
  .ssk-campaign.ssk-img-tablet-top{display:block!important}
  .ssk-campaign.ssk-img-tablet-top .ssk-image{position:relative!important;inset:auto!important;width:100%!important;height:var(--ssk-image-height-tablet,190px)!important;min-height:0!important;opacity:var(--ssk-image-opacity,100%)}
  .ssk-campaign.ssk-img-tablet-side-left{display:flex!important;flex-direction:row!important}
  .ssk-campaign.ssk-img-tablet-side-right{display:flex!important;flex-direction:row-reverse!important}
  .ssk-campaign.ssk-img-tablet-side-left .ssk-image,.ssk-campaign.ssk-img-tablet-side-right .ssk-image{position:relative!important;inset:auto!important;width:var(--ssk-image-width-tablet,38%)!important;height:auto!important;min-height:160px!important;opacity:var(--ssk-image-opacity,100%)}
  .ssk-campaign.ssk-img-tablet-none .ssk-image{display:none!important}
  .ssk-campaign.ssk-img-tablet-background{display:flex!important}
  .ssk-campaign.ssk-img-tablet-background .ssk-image{display:block!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;opacity:var(--ssk-bg-image-opacity,18%)!important}
}

@media (max-width:782px){
  .ssk-campaign.ssk-modal{width:min(var(--ssk-popup-width-mobile,92vw),calc(100vw - 30px))!important}
  .ssk-campaign .ssk-copy{padding:var(--ssk-copy-padding-mobile,22px)!important}
  .ssk-campaign .ssk-image{width:var(--ssk-image-width-mobile,100%)}
  .ssk-campaign.ssk-img-mobile-top{display:block!important;overflow-y:auto}
  .ssk-campaign.ssk-img-mobile-top .ssk-image{display:block!important;position:relative!important;inset:auto!important;width:100%!important;height:var(--ssk-image-height-mobile,150px)!important;min-height:0!important;opacity:var(--ssk-image-opacity,100%);background-size:var(--ssk-image-fit,contain)!important;background-position:var(--ssk-image-focus,center center)!important}
  .ssk-campaign.ssk-img-mobile-side-left{display:flex!important;flex-direction:row!important}
  .ssk-campaign.ssk-img-mobile-side-right{display:flex!important;flex-direction:row-reverse!important}
  .ssk-campaign.ssk-img-mobile-side-left .ssk-image,.ssk-campaign.ssk-img-mobile-side-right .ssk-image{display:block!important;position:relative!important;inset:auto!important;width:var(--ssk-image-width-mobile,42%)!important;height:auto!important;min-height:120px!important;opacity:var(--ssk-image-opacity,100%);background-size:var(--ssk-image-fit,contain)!important;background-position:var(--ssk-image-focus,center center)!important}
  .ssk-campaign.ssk-img-mobile-none .ssk-image{display:none!important}
  .ssk-campaign.ssk-img-mobile-background{display:flex!important}
  .ssk-campaign.ssk-img-mobile-background .ssk-image{display:block!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;opacity:var(--ssk-bg-image-opacity,18%)!important;background-size:var(--ssk-image-fit,cover)!important;background-position:var(--ssk-image-focus,center center)!important}
}

/* Modal-spezifische Overrides schlagen die älteren Mobile-Fallbacks sicher. */
@media (max-width:620px){
  .ssk-campaign.ssk-modal.ssk-img-mobile-top .ssk-image{width:100%!important;height:var(--ssk-image-height-mobile,150px)!important;min-height:0!important}
  .ssk-campaign.ssk-modal.ssk-img-mobile-side-left,.ssk-campaign.ssk-modal.ssk-img-mobile-side-right{display:flex!important;overflow-y:auto}
  .ssk-campaign.ssk-modal.ssk-img-mobile-side-left .ssk-image,.ssk-campaign.ssk-modal.ssk-img-mobile-side-right .ssk-image{width:var(--ssk-image-width-mobile,42%)!important;height:auto!important;min-height:120px!important}
  .ssk-campaign.ssk-modal.ssk-img-mobile-none .ssk-image{display:none!important}
  .ssk-campaign.ssk-modal.ssk-img-mobile-background .ssk-image{display:block!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;min-height:0!important;opacity:var(--ssk-bg-image-opacity,18%)!important}
  .ssk-campaign.ssk-modal.ssk-img-mobile-inherit.ssk-img-top .ssk-image{width:100%!important;height:var(--ssk-image-height-mobile,150px)!important;min-height:0!important}
  .ssk-campaign.ssk-modal.ssk-img-mobile-inherit.ssk-img-none .ssk-image{display:none!important}
}
