/* about-us */
.about-us { background-color: #F5F5F5; padding: 100px 0; }

.about-us .about-us-wrapper { display: flex; align-items: center; gap: 50px; }

.about-us .about-us-left-desc { width: calc(50% - 25px); }

.about-us .about-us-img-block { width: calc(50% - 25px); position: relative; padding: 0 20px;}

.about-us .about-us-img-block::before { content: ''; width: 80px; height: 80px; border-radius: 10px; background-color: #565A59; position: absolute; right: 90px; top: 20px; transform: skew(9deg, 0deg); z-index: 2; }

.about-us .about-us-img-block::after { content: ''; width: 200px; height: 220px; border-radius: 10px; background-color: var(--color-red); position: absolute; left: 0px; bottom: 20px; transform: skew(6deg, 0deg); z-index: 0; }

.about-us .about-us-img { z-index: 1; position: relative; }
.about-us .about-us-details {
    margin: 24px 0;
}
.about-us iframe.about-us-img , .about-us video.about-us-img{
       z-index: 1;
    position: relative;
    width: 530px;
    border-radius: 10px;
    max-width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width:1280px) {
    .about-us .about-us-img-block::before { width: 60px; height: 60px; right: 50px; top: 20px; }
    .about-us .about-us-img-block::after { width: 100px; height: 120px; }
}

@media (max-width:992px) {
    .about-us { padding: 50px 0; }
    .about-us .about-us-wrapper { gap: 20px; }
    .about-us .about-us-left-desc { width: calc(50% - 10px); }
    .about-us .about-us-img-block { width: calc(50% - 10px); }
}

@media (max-width:767px) {
    .about-us .about-us-wrapper { flex-direction: column; }
    .about-us .about-us-left-desc , .about-us .about-us-img-block { width: 100%; }
}

@media (max-width: 575px) {
    .about-us .about-us-img-block::before { right: 14px; }
}
/* about-us */