/* Block 12 — b6.aktion.cta.v3 (scoped) */

#block12_v3{
  margin: 0;
  font-family: var(--wbs-font-sans);
  background: var(--wbs-bg);
  padding: var(--wbs-section-pad) 0;
}

#block12_v3 .container{
  width: var(--wbs-wrap);
  max-width: none;
  margin: 0 auto;
  display: flex;
  gap: var(--wbs-space-20);
  align-items: center;
  background: transparent;
}

#block12_v3 .left{ flex: 1; }

#block12_v3 .right{
  flex: 1;
  display: flex;
  justify-content: center;
}

#block12_v3 h2{
  font-family: var(--wbs-font-serif);
  font-weight: 400;
  font-size: var(--wbs-type-h2);
  line-height: 1.18;
  letter-spacing: -0.005em;
  margin-bottom: 20px;
}

#block12_v3 .sub{
  font-size: var(--wbs-type-body);
  line-height: var(--wbs-leading-body);
  color: var(--wbs-muted);
  margin-bottom: 30px;
  font-weight: 400;
}

#block12_v3 .features{
  list-style: none;
  padding: 0;
  margin-bottom: 35px;
}

#block12_v3 .features li{
  margin-bottom: 14px;
  font-size: 17px;
  display: flex;
  align-items: center;
  gap: var(--wbs-space-3);
}

#block12_v3 .check{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--wbs-space-5-5);
  height: var(--wbs-space-5-5);
  /* slightly softer, less "neon" than pure magenta */
  background: var(--wbs-magenta-soft);
  /* overlay layer (without affecting the white checkmark) */
  box-shadow: inset 0 0 0 999px rgba(var(--wbs-white-rgb), .28);
  color: white;
  border-radius: 50%;
  font-size: var(--wbs-type-micro);
  font-weight: bold;
}

/* CTA: uses global .btn styles (Hero canonical) */
#block12_v3 .btn{ margin-bottom: 25px; }



#block12_v3 .image-placeholder{
  position: relative;
  width: 100%;
  max-width: 450px;
  height: 400px;
  border-radius: var(--wbs-radius-card);
  background: transparent;
  border: none;
  overflow: hidden;
}

#block12_v3 .image-placeholder::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: url("../images/block12-illustration-soft.svg");
  background-repeat:no-repeat;
  background-position:center;
  background-size: 118%;

  /* Controlled via site-polish illustration profiles */
  opacity: var(--wbs-illu-opacity, .88);
  filter: contrast(var(--wbs-illu-contrast, 1)) brightness(var(--wbs-illu-brightness, 1));
  /* v98: illustration uses transparency; avoid background blending */
}


@media (max-width: 900px){
  #block12_v3 .container{
    flex-direction: column;
    gap: var(--wbs-space-10);
  }
  #block12_v3 h2{ font-size: var(--wbs-type-h2); }

  #block12_v3 .image-placeholder{ height: 300px; }
}