.how-it-works-video-y-cards {
  background: linear-gradient(#f4f6fb 45%, #ebf7ff 45%);
  padding-bottom: 3.125rem;
}
@media (min-width: 576px) and (max-width: 1023.98px) {
  .how-it-works-video-y-cards {
    background: #ebf7ff;
  }
}
@media (max-width: 480px) {
  .how-it-works-video-y-cards {
    background: linear-gradient(#f4f6fb 35%, #ebf7ff 35%);
  }
}
@media (min-width: 1024px) {
  .how-it-works-video-y-cards .--container-custom2 {
    box-sizing: border-box;
    max-width: 800px;
    border: 1px solid transparent;
  }
}
.how-it-works-video-y-cards .title-red {
  margin-bottom: 1rem;
}
@media (max-width: 480px) {
  .how-it-works-video-y-cards .title-red {
    font-size: clamp(1.375rem, 5.417vw, 1.625rem);
  }
}
.how-it-works-video-y-cards__p {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 100%;
  color: #000000;
  margin-bottom: 3.5rem;
}
.how-it-works-video-y-cards__video_wrapper {
  position: relative;
}
.how-it-works-video-y-cards__video__img {
  border-radius: 48px;
  filter: drop-shadow(0px 21.8695px 58.3187px rgba(0, 0, 0, 0.2));
}
.how-it-works-video-y-cards .mbottom {
  margin-bottom: 3.5rem;
}
@media (min-width: 576px) and (max-width: 1023.98px) {
  .how-it-works-video-y-cards .mbottom {
    margin-bottom: 3.875rem;
  }
}
@media (max-width: 575.98px) {
  .how-it-works-video-y-cards .mbottom {
    margin-bottom: 2.5rem;
  }
}
@media (min-width: 576px) and (max-width: 1023.98px) {
  .how-it-works-video-y-cards__card {
    margin-bottom: 2.5rem;
  }
}
@media (max-width: 575.98px) {
  .how-it-works-video-y-cards__card {
    margin-bottom: 2.1875rem;
  }
}
@media (min-width: 768px) and (max-width: 1023.98px) {
  .how-it-works-video-y-cards__card {
    width: 376px;
    margin: 0 auto;
  }
}
.how-it-works-video-y-cards__card__h3 {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-size: 1.375rem;
  line-height: 100%;
  color: #0078ff;
}
.how-it-works-video-y-cards__card__p {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 130%;
  color: #404e5a;
}
.how-it-works-video-y-cards .icon__play {
  background-image: url("data:image/svg+xml,%3Csvg width='92' height='92' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M46.118.175c8.416.383 16.68 1.992 23.984 6.256 7.56 4.412 14.38 10.378 18.179 18.35 3.844 8.067 4.422 17.311 3.031 26.16-1.376 8.76-5.25 16.824-10.853 23.627-5.672 6.887-12.77 12.538-21.188 15.275-8.541 2.777-17.801 2.909-26.359.184-8.468-2.696-15.53-8.464-21.263-15.346C5.965 67.858 1.694 59.86.415 51.016c-1.282-8.86.499-17.802 4.05-25.998 3.587-8.276 8.57-16.258 16.246-20.836C28.254-.318 37.379-.223 46.118.175Z' fill='%23fff' fill-opacity='.8'/%3E%3Cpath d='M30.782 30.46v31.08c0 2.37 2.61 3.81 4.62 2.52l24.42-15.54c1.86-1.17 1.86-3.87 0-5.07l-24.42-15.51c-2.01-1.29-4.62.15-4.62 2.52Z' fill='%23F60'/%3E%3C/svg%3E");
  width: 92px;
  height: 92px;
  display: block;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media (max-width: 1023.98px) {
  .how-it-works-video-y-cards .icon__play {
    width: 4.5625rem;
    height: 4.5625rem;
    background-size: 4.5625rem;
  }
}
.how-it-works-video-y-cards .icon__lesson {
  background-image: url("data:image/svg+xml,%3Csvg width='56' height='56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='15.313' y='46.813' width='35' height='28' rx='3.5' transform='rotate(-90 15.313 46.813)' fill='%23FD8394'/%3E%3Cpath d='M19.25 33.25h10.5M19.25 28h17.5M19.25 22.75h17.5M19.25 17.5h17.5' stroke='%23000' stroke-width='.875' stroke-linecap='round' stroke-linejoin='round'/%3E%3Crect x='13.563' y='45.938' width='35.875' height='28.875' rx='3.938' transform='rotate(-90 13.563 45.938)' stroke='%23000' stroke-width='.875'/%3E%3C/svg%3E");
  width: 56px;
  height: 56px;
  display: block;
  background-repeat: no-repeat;
}
.how-it-works-video-y-cards .icon__platform {
  background-image: url("data:image/svg+xml,%3Csvg width='56' height='56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.563 14a1.75 1.75 0 0 0-1.75 1.75v17.5c0 .967.783 1.75 1.75 1.75h31.5a1.75 1.75 0 0 0 1.75-1.75v-17.5a1.75 1.75 0 0 0-1.75-1.75h-31.5Zm22.75 15.313a4.812 4.812 0 1 0 0-9.625 4.812 4.812 0 0 0 0 9.625Z' fill='%2318EBE1'/%3E%3Crect x='10.063' y='12.25' width='35.875' height='21.875' rx='2.188' stroke='%23000' stroke-width='.875'/%3E%3Cpath d='m21 34.125-3.5 9.625M35 34.125l3.5 9.625M17.5 43.75h21M28 9.625v2.625' stroke='%23000' stroke-width='.875' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='35' cy='23.188' r='5.25' stroke='%23000' stroke-width='.875'/%3E%3Cpath d='M22.75 28.438v-10.5M19.25 28.438v-7M15.75 28.438v-3.5' stroke='%23000' stroke-width='.875' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  width: 56px;
  height: 56px;
  display: block;
  background-repeat: no-repeat;
}
.how-it-works-video-y-cards .icon__live_classes {
  background-image: url("data:image/svg+xml,%3Csvg width='56' height='56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.252 42.557h32.716c1.268 0 2.296-1.152 2.296-2.573V17.457c0-1.42-1.028-2.572-2.296-2.572H13.25c-1.268 0-2.295 1.151-2.295 2.572v22.527c0 1.421 1.027 2.573 2.296 2.573Zm16.2-13.682a4.022 4.022 0 1 0 0-8.043 4.022 4.022 0 0 0 0 8.043Z' fill='%23FADA76'/%3E%3Cpath d='M44.497 41.125H11.503c-1.28 0-2.316-1.165-2.316-2.603V15.728c0-1.438 1.037-2.603 2.316-2.603h32.994c1.28 0 2.316 1.165 2.316 2.603v22.794c0 1.438-1.037 2.603-2.316 2.603Z' stroke='%23000' stroke-width='.875' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.954 16.389h8.693a2.899 2.899 0 0 1 0 5.795H13.03v1.385l-1.379-1.379h-5.69a2.899 2.899 0 0 1-2.898-2.898 2.891 2.891 0 0 1 2.891-2.903Z' fill='%23fff'/%3E%3Cpath d='M7.088 18.355a.95.95 0 1 1 0 1.9.95.95 0 0 1 0-1.9ZM10.04 18.355a.95.95 0 1 1 0 1.9.95.95 0 0 1 0-1.9ZM12.993 18.355a.95.95 0 1 1 0 1.9.95.95 0 0 1 0-1.9Z' stroke='%23000' stroke-width='.698' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.954 16.389h8.693a2.899 2.899 0 0 1 0 5.795H13.03v1.385l-1.379-1.379h-5.69a2.899 2.899 0 0 1-2.898-2.898 2.891 2.891 0 0 1 2.891-2.903Z' stroke='%23000' stroke-width='.875' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M49.968 27.368h-8.693a2.899 2.899 0 0 0 0 5.795h1.617v1.385l1.38-1.38h5.69c1.6 0 2.898-1.297 2.898-2.897a2.891 2.891 0 0 0-2.892-2.903Z' fill='%23fff'/%3E%3Cpath d='M48.834 29.333a.95.95 0 1 0 0 1.9.95.95 0 0 0 0-1.9ZM45.882 29.333a.95.95 0 1 0 0 1.9.95.95 0 0 0 0-1.9ZM42.93 29.333a.95.95 0 1 0 0 1.9.95.95 0 0 0 0-1.9Z' stroke='%23000' stroke-width='.698' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M49.968 27.368h-8.693a2.899 2.899 0 0 0 0 5.795h1.617v1.385l1.38-1.38h5.69c1.6 0 2.898-1.297 2.898-2.897a2.891 2.891 0 0 0-2.892-2.903Z' stroke='%23000' stroke-width='.875' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M35.816 34.016c0-.78-3.898-2.557-7.597-2.557-3.7 0-7.598 1.777-7.598 2.557v1.339h15.195v-1.34Z' stroke='%23000' stroke-width='.875' stroke-linejoin='round'/%3E%3Ccircle cx='28.13' cy='24.056' r='4.286' stroke='%23000' stroke-width='.875' stroke-linejoin='round'/%3E%3C/svg%3E");
  width: 56px;
  height: 56px;
  display: block;
  background-repeat: no-repeat;
}
.how-it-works-video-y-cards .icon__learn {
  background-image: url("data:image/svg+xml,%3Csvg width='56' height='56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m31.556 29.828 16.368-9.343-16.67-9.099-16.367 9.343 16.67 9.1Z' fill='%237BDF9C'/%3E%3Cpath d='m28.28 30.137 16.983-9.435-16.983-9.435-16.983 9.435 16.983 9.435Zm0 0 11.624-6.458a22.8 22.8 0 0 1 1.255 12.226 22.554 22.554 0 0 0-12.879 5.658 22.555 22.555 0 0 0-12.877-5.658 22.792 22.792 0 0 1 1.255-12.226l11.622 6.458Zm-7.51 16.107-.038-18.938 7.548-4.193' stroke='%23000' stroke-width='1.092' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  width: 56px;
  height: 56px;
  display: block;
  background-repeat: no-repeat;
}
