.services-grid__section {
  padding-top: 53px; }
.services-grid__body {
  display: grid;
  grid-gap: 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr)); }
.services-grid__title {
  margin-bottom: 0.15em; }
.services-grid__header {
  margin-bottom: 54px; }
.services-grid-item {
  aspect-ratio: 332/223;
  padding: 27px 36px;
  cursor: pointer;
  transition: var(--transition-delay);
  position: relative; }
  .services-grid-item__icon {
    width: 46px;
    height: 46px;
    object-fit: contain; }
    .services-grid-item__icon-wrap {
      width: 104px;
      height: 104px;
      border: 1px dashed #FFFFFF;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: var(--border-radius);
      margin-bottom: 36px;
      transition: var(--transition-delay); }
  .services-grid-item__title {
    font-size: 22px;
    transition: var(--transition-delay); }
  .services-grid-item__menu {
    position: absolute;
    background: #fff;
    padding: 29px 39px;
    left: 0;
    width: 100%;
    bottom: 50px;
    box-shadow: 0px 10px 25px 6px #70778A1A;
    opacity: 0;
    pointer-events: none;
    transition: var(--transition-delay); }
    .services-grid-item__menu-item {
      display: block;
      font-size: 19px;
      font-weight: 600;
      line-height: 39px;
      color: var(--color-title); }
    .services-grid-item__menu:after {
      content: '';
      position: absolute;
      display: block;
      background: #fff;
      width: 20px;
      height: 20px;
      transform: rotate(45deg);
      bottom: -9px;
      left: 42px; }
  .services-grid-item:hover {
    background: var(--color-accent); }
    .services-grid-item:hover .services-grid-item__icon-wrap {
      filter: brightness(3); }
    .services-grid-item:hover .services-grid-item__title {
      color: #fff; }
    .services-grid-item:hover .services-grid-item__menu {
      bottom: 90px;
      opacity: 1;
      pointer-events: all; }

@media (max-width: 1399px) {
  .services-grid-item__title {
    font-size: 20px; } }
@media (max-width: 1199px) {
  .services-grid__body {
    grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) {
  .services-grid__section {
    padding-top: 40px;
    padding-bottom: 40px; }
  .services-grid__body {
    grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) {
  .services-grid__section {
    padding-top: 20px;
    padding-bottom: 20px; }
  .services-grid__body {
    display: block; }
  .services-grid__header {
    margin-bottom: 20px; }
  .services-grid-item {
    margin-bottom: 15px;
    display: flex;
    aspect-ratio: auto;
    padding: 20px 20px;
    align-items: center; }
    .services-grid-item__icon-wrap {
      margin-bottom: 0;
      margin-right: 20px;
      width: 75px;
      height: 75px;
      flex-shrink: 0; }
    .services-grid-item__menu {
      padding: 20px 30px; }
      .services-grid-item__menu-item {
        line-height: 35px; } }

/*# sourceMappingURL=services-grid.css.map */