/* Ogólne ustawienia Swipera */
.carousel-discover {
  padding-left: 15px;
  padding-right: 15px;
}

.carousel-discover .swiper-wrapper {
  display: flex;
  align-items: stretch;
}

.carousel-discover .swiper-slide {
  background: #000;
  border-radius: 40px;
  overflow: clip; /* FIX: zamiana z 'hidden' na 'clip' zmniejsza repainty */
  position: relative;
  height: 400px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;

  /* FIX: płynniejsze renderowanie na iOS */
  transform: translate3d(0, 0, 0);
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.carousel-discover .slide-background {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.carousel-discover .slide-background video,
.carousel-discover .slide-background img {
  width: 100%;
  height: 100%;
  object-fit: cover;

  /* FIX: unikanie błysków/migotania */
  transform: none;
  will-change: auto;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.carousel-discover .slide-content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 20px;
  background: rgba(0, 0, 0, 0.4);
  padding: 20px;
  color: #fff;
  height: 100%;

  /* FIX: płynność w renderowaniu */
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

.carousel-discover .left-column .label {
  display: inline-flex;
  padding: 3px 15px 2px;
  border-radius: 100px;
  font-size: 15px;
  font-weight: 700;
  color: #13100B;
  border: solid 1px;
  height: 30px;
  align-items: center;
  cursor: default;
}

.carousel-discover .left-column .left-title {
  font-size: 39px;
  text-transform: uppercase;
}

.carousel-discover .right-column {
  padding: 30px 10%;
  border-left: solid 1px;
  margin-left: 5px;
}

.carousel-discover .right-column .right-title {
  font-size: 25px;
}

.carousel-discover .right-column .right-desc {
  font-size: 15px;
}

/* Dekoracyjne pseudo-elementy */
.carousel-discover .slide-content:before {
  content: "";
  position: absolute;
  top: 0;
  left: 33%;
  width: 75px;
  height: 35px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 77 38' fill='none'><path d='M76.3027 -1.72455e-08L76.5 0L76.4981 0.00292969C76.433 0.00260162 76.3679 -1.15501e-08 76.3027 -1.72455e-08ZM38.4961 37.9971C38.4964 37.932 38.499 37.8669 38.499 37.8018C38.499 16.9243 21.5748 -4.80172e-06 0.697269 -6.62689e-06L76.3027 -1.72455e-08C55.4252 -1.84241e-06 38.501 16.9243 38.501 37.8018C38.501 37.8669 38.5036 37.932 38.5039 37.9971L38.5 38L38.4961 37.9971ZM0.500003 -6.64413e-06L0.697269 -6.62689e-06C0.632122 -6.63258e-06 0.567028 0.00259499 0.501956 0.00292304L0.500003 -6.64413e-06Z' fill='%23ffffff'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1;
}

.carousel-discover .slide-content:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 33%;
  width: 75px;
  height: 35px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 80'><path fill='%23ffffff' d='M.4,80h-.4,0c.1,0,.3,0,.4,0ZM80,0c0,.1,0,.3,0,.4,0,44,35.6,79.6,79.6,79.6H.4c44,0,79.6-35.6,79.6-79.6,0-.1,0-.3,0-.4h0s0,0,0,0ZM160,80h-.4c.1,0,.3,0,.4,0h0Z'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1;
}

/* Responsywność */
@media (max-width: 768px) {
  .carousel-discover .slide-content {
    display: block;
    text-align: center;
    padding: 40px 15px;
  }

  .carousel-discover .swiper-slide {
    height: auto;
    min-height: 500px;
    border-radius: 20px;
  }

  .carousel-discover .slide-content:before {
    content: "";
    position: absolute;
    top: 30%;
    left: 0;
    width: 20px;
    height: 40px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35 70' fill='none'><path d='M-8.62276e-09 0.697264L0 0.499998L0.00292969 0.501951C0.00260162 0.567021 -5.77507e-09 0.632117 -8.62276e-09 0.697264ZM37.9971 38.5039C37.932 38.5036 37.8669 38.501 37.8018 38.501C16.9243 38.501 -2.40086e-06 55.4252 -3.31344e-06 76.3027L-8.62276e-09 0.697264C-9.21207e-07 21.5748 16.9243 38.499 37.8018 38.499C37.8669 38.499 37.932 38.4964 37.9971 38.4961L38 38.5L37.9971 38.5039ZM-3.32207e-06 76.5L-3.31344e-06 76.3027C-3.31629e-06 76.3679 0.0025983 76.433 0.00292637 76.498L-3.32207e-06 76.5Z' fill='white'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 1;
  }

  .carousel-discover .slide-content:after {
    content: "";
    position: absolute;
    top: 30%;
    right: 0;
    left: auto;
    width: 20px;
    height: 40px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35 70' fill='none'><path d='M38 76.3027L38 76.5L37.9971 76.498C37.9974 76.433 38 76.3679 38 76.3027ZM0.00292803 38.4961C0.0679889 38.4964 0.133102 38.499 0.198241 38.499C21.0757 38.499 38 21.5748 38 0.697264L38 76.3027C38 55.4252 21.0757 38.501 0.198241 38.501C0.133102 38.501 0.0679893 38.5036 0.00292803 38.5039L-1.66103e-06 38.5L0.00292803 38.4961ZM38 0.499998L38 0.697264C38 0.632117 37.9974 0.567023 37.9971 0.501951L38 0.499998Z' fill='%23ffffff'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 1;
  }
  

  .carousel-discover .left-column {
    height: 30%;
  }

  .carousel-discover .left-column .left-title {
    font-size: 25px;
  }

  .carousel-discover .right-column {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 70%;
    padding: 0;
    border-left: 0;
    margin-left: 0;
  }

  .carousel-discover .right-column .right-title {
    font-size: 20px;
  }

  .carousel-discover .right-column hr {
    margin: 4px 30px 30px;
    opacity: 1;
  }
}

@media (min-width: 768px) {
  .carousel-discover {
    padding-left: 2%;
    padding-right: 2%;
  }

  .carousel-discover .swiper-pagination-progressbar {
    max-width: 230px;
  }
}

@media (min-width: 1200px) {
  .carousel-discover {
    padding-left: calc((100% - 1110px) / 2);
  }
}

@media (min-width: 1400px) {
  .carousel-discover {
    padding-left: calc((100% - 1255px) / 2);
  }
}
