.zakres-block {
    display: flex;
    padding: 100px;
    flex-direction: column;
    align-items: center;
    gap: 100px;
    align-self: stretch;
}
.zakres-block .zakres-item {    
    flex: 0 0 calc(100%);
    display: flex ;
    max-width: 1240px;
    margin: auto;
    flex-direction: column;
    width: 100%;
}
 
.zakres-block .zakres-item .content{    
    flex: 0 0 100%;
    display: flex; 
    gap: 20px;
    padding: 80px 20px;
    justify-content: space-evenly;
    margin: auto;
    align-items: center; flex-wrap: wrap;
    width: 100%;
} 
.zakres-block .zakres-item .content .punkt {
position: relative;
flex: 0 0 20%;
color: var(--Color-Base-White, #FFF);
text-align: center;
font-family: Tomorrow;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 25.2px */
letter-spacing: 0.36px;
text-transform: uppercase;
}
.zakres-block .zakres-item .content .punkt::before {
    content: "";
    display: flex;width: 53.5px;
    height: 60px;
    padding: var(--Spacing-4, 16px) var(--Spacing-System-spacing-16, 16px);
    align-items: center;
    gap: 8px;
    aspect-ratio: 11/10;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: -90px;
    transform: translateX(-50%);
    left: 50%;
    background-image: url('data:image/svg+xml,<svg width="57" height="62" viewBox="0 0 57 62" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.75 30.3333L24.5338 39L40.75 23" stroke="%23D8F2D9" stroke-width="4" stroke-linecap="round"/><path d="M49.25 1H11.25L1.75 10.5V54" stroke="%23D8F2D9" stroke-width="2" stroke-linecap="round"/><path d="M7.75 61L45.75 61L55.25 51.5L55.25 8" stroke="%23D8F2D9" stroke-width="2" stroke-linecap="round"/></svg>');
}
.zakres-block .zakres-item .content .punkt:not(:last-of-type)::after {
    content: "";
    display: flex;
    width: 7px;
    height: 100px;
    padding: var(--Spacing-4, 16px) var(--Spacing-System-spacing-16, 16px);
    align-items: center;
    gap: 8px;
    aspect-ratio: 11/10;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    bottom: -15px;
    right: -60px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="6" height="101" viewBox="0 0 6 101" fill="none"><path d="M3.5 5L5.88675 0H0.113249L2.5 5H3.5ZM2.5 96L0.113249 101H5.88675L3.5 96H2.5ZM3 5.82692H2.5V9.71154H3H3.5V5.82692H3ZM3 13.5962H2.5V17.4808H3H3.5V13.5962H3ZM3 21.3654H2.5V25.25H3H3.5V21.3654H3ZM3 29.1346H2.5V33.0192H3H3.5V29.1346H3ZM3 36.9038H2.5V40.7885H3H3.5V36.9038H3ZM3 44.6731H2.5V48.5577H3H3.5V44.6731H3ZM3 52.4423H2.5V56.3269H3H3.5V52.4423H3ZM3 60.2115H2.5V64.0962H3H3.5V60.2115H3ZM3 67.9808H2.5V71.8654H3H3.5V67.9808H3ZM3 75.75H2.5V79.6346H3H3.5V75.75H3ZM3 83.5192H2.5V87.4038H3H3.5V83.5192H3ZM3 91.2885H2.5V95.1731H3H3.5V91.2885H3Z" fill="%23D8F2D9"/></svg>');
}
.zakres-block .zakres-item h3 {
    color: var(--Color-Base-White, #FFF);
text-align: center;
font-family: Tomorrow;
font-size: 32px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 44.8px */
letter-spacing: 0.64px;
text-transform: uppercase;
margin-top: 0px;
}
.zakres-block .zakres-item .cta {
display: flex;
max-width: 1240px;
padding: 50px 100px;
justify-content: space-between;
align-items: center;
background: var(--Color-Hardware-Mist-2-HM-3, #475347);
--cut: 62px;
clip-path: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));
}

.zakres-block .zakres-item .cta .ctaContent {
padding-left: 150px;
display: flex;
flex-direction: column;
gap: 8px;
position: relative;
}
.zakres-block .zakres-item .cta .ctaContent h3 {
    color: var(--Color-Base-White, #FFF);
    leading-trim: both;
    text-edge: cap;
    font-family: Tomorrow;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 32px */
    text-transform: none;
    margin-bottom: 0px;
}
.zakres-block .zakres-item .cta .ctaContent p {
    color: var(--Color-Base-Cool-Surface, #D8F2D9);
    leading-trim: both;
    text-edge: cap;
    font-family: Inter;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%; /* 25.2px */
    margin-top: 0px;
}

.zakres-block .zakres-item .cta .ctaContent::before {
    content: "";
    display: flex;
    width: 89px;
    height: 100px;
    padding: var(--Spacing-4, 16px) var(--Spacing-System-spacing-16, 16px);
    align-items: center;
    gap: 8px;
    aspect-ratio: 11/10;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="91" height="102" viewBox="0 0 91 102" fill="none"><path d="M80.0187 1H16.8037L1 16.8333V89.3333" stroke="%2392A693" stroke-width="2" stroke-linecap="round"/><path d="M10.9813 101L74.1963 101L90 85.1667L90 12.6667" stroke="%2392A693" stroke-width="2" stroke-linecap="round"/><path d="M26.7103 33C23.5552 33 21 35.4968 21 38.5798V63.4202C21 66.5002 23.5552 69 26.7103 69H65.2897C68.4417 69 71 66.5032 71 63.4202V38.5798C71 35.4998 68.4448 33 65.2897 33H26.7103ZM68.8209 63.4202C68.8209 65.3247 67.2356 66.8738 65.2866 66.8738H26.7103C24.7613 66.8738 23.1759 65.3247 23.1759 63.4202V38.5798C23.1759 36.6753 24.7613 35.1262 26.7103 35.1262H65.2897C67.2387 35.1262 68.8241 36.6753 68.8241 38.5798V63.4202H68.8209Z" fill="%2392A693"/><path d="M61.2984 39.57L46.0762 54.4445L30.6985 39.4182C30.2726 39.002 29.5856 39.002 29.1598 39.4182C28.7339 39.8343 28.7339 40.5056 29.1598 40.9217L45.3084 56.7013C45.5135 56.9018 45.7902 57.0142 46.0793 57.0142C46.3684 57.0142 46.645 56.9018 46.8502 56.7013L62.8433 41.0736C63.2692 40.6574 63.2692 39.9862 62.8433 39.57C62.4175 39.1539 61.7305 39.1539 61.3046 39.57H61.2984Z" fill="%2392A693"/></svg>');
}
  

@media (max-width: 781px) { 
    .zakres-block {
        padding: 20px 0px;
    }
    .zakres-block .zakres-item .content .punkt {
        
    flex: 0 0 45%;
    min-height: 130px;
    }
    .zakres-block .zakres-item .content .punkt:not(:last-of-type)::after {
        display: none;
    }
    .zakres-block .zakres-item .content { 
        padding: 80px 0px 20px;
    }
    .zakres-block .zakres-item .cta { 
        max-width: calc(100% - 40px);
        flex-direction: column;
        padding: 0px 20px 40px;
    }
    .zakres-block .zakres-item .cta .ctaContent {
        padding: 0px; 
        padding-top: 150px; 
    }
    .zakres-block .zakres-item .cta .ctaContent::before {
        width: 54px;
        height: 60px;
        top: 30px;
        transform: translateX(-50%);
        left: 50%;
        background-size: contain;
    }
    .zakres-block .zakres-item .cta .ctaContent h3 {
        color: var(--Color-Base-White, #FFF);
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Tomorrow;
font-size: 32px;
font-style: normal;
font-weight: 700;
line-height: normal;
    }
    .zakres-block .zakres-item .cta .ctaContent p {
        color: var(--Color-Base-Cool-Surface, #D8F2D9);
        text-align: center;
        leading-trim: both;
        text-edge: cap;
        font-family: Inter;
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 140%; /* 25.2px */
    }
    .zakres-block .zakres-item .cta { 
        --cut: 40px;
        clip-path: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));
        }
}