.banner-image{
background: #fff;
padding: 100px 0 0 0;
max-width: 100% !important;
overflow: hidden;
}

.banner-image.banner-image--large{
padding-top: 32px; //64px
}

.banner-image__splide{
margin: 0;
}

.banner-image__splide .splide__arrows{
display: flex;
gap: 12px;
position: absolute;
bottom: 38px;
left: 48px;
}

.banner-image__splide .splide__arrows .splide__arrow{
background: url("../../../dist/img/splide-arrow.svg") no-repeat center center #fff;
position: relative;
top: initial;
bottom: initial;
left: initial;
right: initial;
transform: none;
border-radius: 100px;
width: 56px;
height: 56px;
}

.banner-image__splide .splide__arrows .splide__arrow--prev{
transform: scaleX(-1);
}

.banner-image__inner{
border-radius: 16px;
box-shadow: 0px 6px 16px rgba(65, 88, 206, 0.1);
color: currentColor;
padding: 48px 48px 130px 48px;
position: relative;
min-height: 525px;
}

.banner-image__image{
position: absolute;
right: 120px;
bottom: 0;
max-height: 96%;
font-size: 0;
}

.banner-image__image img{
max-width: 407px;
max-height: 561px;
}

.banner-image__title{
max-width: 540px;
line-height: 1.2em;
text-align: left;
margin: 0 0 16px 0;
color: currentcolor;
}

@media(min-width: 1200px){
.banner-image__title.banner-image__title--large{
  font-size: 48px;
  max-width: 640px;
  line-height: 1.25;
}
}

.banner-image .splide__track{
overflow: visible;
}

#primary .banner-image__text{
max-width: 600px;
}
@media (max-width: 991px){
#primary .banner-image__text{
  min-height: 200px
}

}

#primary .banner-image__text p{
font-size: 18px;
color: currentColor !important;
}

#primary .banner-image__text ul{
margin: 0;
padding: 0 0 0 25px;
font-size: 18px;
}

.banner-image__content{
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 30px;
}

.banner-image__btn .btn{
min-width: 240px;
}

.banner-image__btn .btn.btn--white{
color: #fff;
background: transparent;
}

.banner-image__btn .btn:hover{
background: #fff;
color: #4158ce;
}
.banner-image__btn .btn.btn--darkbluephantom{
color: #0c1c4d;
background: transparent;
border: 2px solid #0c1c4d;
}

.banner-image__btn .btn.btn--darkbluephantom:hover{
background: #0c1c4d;
color: #fff;
}




.banner-image.banner-image--boxes{
padding-top: 64px;
}

.banner-image.banner-image--boxes .banner-image__inner{
min-height: 516px;
height: 100%;
}

@media(min-width: 1199px){
.banner-image.banner-image--boxes .banner-image__title{
  font-size: 48px;
  line-height: 1.25;
}
}

.banner-image.banner-image--boxes .banner-image__title{
max-width: 580px;
margin: 0 0 32px 0;
}

.banner-image__list{
display: flex;
flex-direction: column;
gap: 12px;
margin: 0 0 24px 0;
padding: 0;
max-width: 495px;
}

.banner-image__list li{
margin: 0 !important;
line-height: 1.4;
list-style-type: none;
padding-left: 32px;
background: url('https://dev.centropol.cz//wp-content/uploads//2025/12/chevron-right-white.svg') no-repeat left top;
}

.banner-image__list li p{
margin: 0;
font-size: 18px !important;
color: currentColor !important;
}

@media(max-width: 1200px){
.banner-image__image{
  right: 20px;
}

.banner-image__content{
  max-width: 480px;
}
}

@media(max-width: 991px){
.banner-image{
  padding: 60px 0 0 0;
}

.banner-image__inner{
  padding: 32px 32px 150px 32px;
}

.banner-image__image img,
.banner-image__image{
  pointer-events: none;
  max-width: 300px;
}

.banner-image__content{
  max-width: 400px;
  gap: 30px;
}
}

@media(max-width: 767px){
.banner-image__image{
  max-width: 100%;
      bottom: 148px;
      z-index: 1;
      width: 100%;
      right: 0;
      text-align: center;
}

.banner-image__image:after{
  content: "";
    height: 360px;
    width: calc(100% - 1px);
    position: absolute;
    bottom: -148px;
    left: 1px;
    z-index: 1;
    backdrop-filter: blur(10px);

    border-radius: 0 0 16px 16px;
    overflow: hidden;

}

.banner-image__content{
  position: relative;
  z-index: 2;
  gap: 24px;
  max-width: 100%;
  height: 100%;
}

.banner-image__btn{
  width: 100%;
}

.banner-image--hero .banner-image__title{
  font-size: 36px;
  line-height: 1.1;
  margin: 0 0 8px 0;
}

.banner-image__btn .btn{
  min-width: 100%;
}

.banner-image__splide{
  padding: 0;
}

.banner-image__inner{
  padding: 280px 24px 24px 24px;
  background: radial-gradient(127% 63% at 67% 37%, #7286df 0%, #3446a5 100%);
  min-height: 610px;
}

@media (max-width: 991px){
.banner-image__inner{
  padding: 280px 24px 54px 24px;
}
}
.banner-image.banner-image--mobile{
  padding: 0 ;
}

.banner-image.banner-image--mobile .in{
  width: 100% !important;
}

.banner-image.banner-image--mobile .banner-image__inner{
  border-radius: 0;
  padding-bottom: 160px;
}

.banner-image.banner-image--mobile .banner-image__image{
/*bottom: 256px;*/
  top: 30px
}

 .banner-image__image:after,
 .banner-image__image:before{
  display: none;
}

.banner-image--arrows .banner-image__inner{
  padding-bottom: 94px !important;
}

.banner-image--hero .banner-image__mhelp1{
  width: calc(100% + 48px);
  position: absolute;
  bottom: -115px;
  height: calc(100% + 130px);
  left: -24px;
  z-index: 1;
  border-radius: 0 0 16px 16px;
}

.banner-image--hero .banner-image__mhelp2{
  bottom: -115px;
  height: calc(100% + 130px);
  width: calc(100% + 48px);
  position: absolute;
  left: -24px;
  z-index: 1;
  backdrop-filter: blur(10px);
   mask-image: linear-gradient(to bottom, transparent 0px, black 40px);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0px, black 40px);
  overflow: hidden!important;
  border-radius: 0 0 16px 16px;
}

.banner-image__inner{
  border-radius: 16px;
}

.banner-image__helper{
  position: relative;
  z-index: 2;
}

.banner-image__splide .splide__arrows{
  left: 24px;
}

.banner-image.banner-image--noarrows.banner-image--large .banner-image__inner{
  padding-bottom: 30px !important;
}




.banner-image.banner-image--mobile .banner-image__list{
  margin: 0;
}

.banner-image.banner-image--mobile .banner-image__image:before{
  background: linear-gradient(180.17deg, rgba(52, 70, 165, 0) 0%, #3446a5 50%);
}

}

@media(max-width: 767px){
.banner-image--large.banner-image--hero .banner-image__inner{
  padding-bottom: 30px !important;
}

.banner-image.banner-image--mobile .banner-image__inner,
.banner-image.banner-image--mobile .banner-image__mhelp1,
.banner-image.banner-image--mobile .banner-image__mhelp2{
  border-radius: 0 !important;
}
}
/*kdyz ma pretekat img*/
.overBox .banner-image__inner{	min-height: 450px; }
@media(min-width: 992px){
.overBox .banner-image__image{	max-height: 120%; height: calc(100% + 45px); }
.overBox .banner-image__image img{	height: 100%; }
}
@media(min-width: 768px) and (max-width: 991px){
.overBox .banner-image__inner{	min-height: 590px; height: 640px; }
}

@media(max-width: 767px){
.overBox .banner-image__inner{	min-height: 590px; height: 740px; }
.overBox .banner-image__image{	max-height: 120%; height: calc(100% + 45px); bottom: auto; top: -45px }

}

@media(min-width: 768px){
.banner-image__mhelp1,
.banner-image__mhelp2{
  display: none;
}
}