/* ===========================
   Grundlayout & Typo
   =========================== */

.tc-two-col-slider-wrapper { width: 100%; }
.tc-two-col-slider { position: relative; overflow: hidden; } /* Grundbox */

.tc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
}

.tc-left .tc-h2 {
  margin: 0;
  font-size: 50px;       /* gewünscht; ggf. durch clamp() ersetzen */
  line-height: 1.2;
}

.tc-left .tc-text { margin: 0 0 18px; }

.tc-text .checklist.vertical ul {
    margin: 0 0 1.5em 0;
    font-size: 18px;
}

/* Textfarbe im Slider */
.tc-two-col-slider .tc-left,
.tc-two-col-slider .tc-left h2,
.tc-two-col-slider .tc-left .tc-text,
.tc-two-col-slider .tc-left .tc-text p {
  color: #fff !important;
}

/* Buttons */
.tc-buttons {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.tc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  border: 0;
  border-radius: 9999px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  background: rgba(13, 249, 153, 0.15);
  color: #0df699; 
}

.tc-btn.tc-btn-link {
	background: rgba(13, 249, 153, 0.15);
    color: #0df699; 
}

/* Dezenter Ghost-Style für Zurück */
.tc-btn.tc-btn-prev {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255,255,255,0.5);
  opacity: 0.85;
}
.tc-btn.tc-btn-prev:hover {
  opacity: 1;
  border-color: rgba(255,255,255,0.8);
}

/* Bild */
.tc-right .tc-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
  object-fit: cover;
    max-width: 500px;
    margin: 0 auto;
}

/* Spacing im Slide */
.tc-two-col-slider .tc-slide {
  box-sizing: border-box;
  padding: 24px 8px;
}

/* ===========================
   Swiper – Navigation ausblenden
   =========================== */

.tc-two-col-slider .swiper-button-prev,
.tc-two-col-slider .swiper-button-next,
.tc-two-col-slider .swiper-pagination {
  display: none !important;
}

/* Bei Bedarf (falls Pfeile sichtbar sein sollten)
.tc-two-col-slider .swiper-button-prev,
.tc-two-col-slider .swiper-button-next { color: #111; }
.tc-two-col-slider .swiper-pagination-bullet-active { opacity: 1; }
*/

/* ===========================
   Swiper – Safety-Fixes
   (gegen Theme/Plugin-Konflikte)
   =========================== */

.tc-two-col-slider.swiper {
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
}

.tc-two-col-slider .swiper-wrapper {
  display: flex !important;
  flex-wrap: nowrap !important;
  box-sizing: content-box !important;   /* verhindert Breitenadditionen */
  transform: translate3d(0,0,0);        /* Fallback; Swiper überschreibt inline */
  will-change: transform;
}

.tc-two-col-slider .swiper-slide {
  width: 100% !important;   /* exakt ein Slide pro View */
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}

/* Falls globales CSS reinfunkt */
.tc-two-col-slider.swiper-initialized .swiper-wrapper { pointer-events: auto !important; }

/* Nicht initialisiert → untereinander */
.tc-two-col-slider:not(.swiper-initialized) .swiper-wrapper { display: block !important; }
.tc-two-col-slider:not(.swiper-initialized) .swiper-slide   { width: auto !important; }

/* ===========================
   Responsive
   =========================== */

@media (max-width: 980px) {
  .tc-grid { grid-template-columns: 1fr; }
  .tc-right { order: -1; } /* Bild über dem Text auf Mobile */
}

/* ===========================
   Visual Builder – Platzhalter
   =========================== */

.tc-two-col-slider--vb .tc-slide--vb .tc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
}

@media (max-width: 980px) {
  .tc-two-col-slider--vb .tc-slide--vb .tc-grid { grid-template-columns: 1fr; }
  .tc-two-col-slider--vb .tc-slide--vb .tc-right { order: -1; }
}