.header {
  padding-top: 24rem;
  padding-bottom: 24rem;
}
.header-wrap {
  border-top: 1rem solid var(--base-border-color);
  border-bottom: 1rem solid var(--base-border-color);
  padding-bottom: 48rem;
  display: flex;
  flex-direction: column;
  gap: 16rem;
}
.header-logo-wrap {
  display: flex;
  gap: 8rem;
  padding-top: 16rem;
  padding-bottom: 16rem;
}
.header-logo-item {
  width: 50rem;
  height: 50rem;
  --logo-color: #1962e0;
  animation: rotate 20s linear infinite;
}

.header-logo-item:nth-child(1) {
  --logo-color: #1962e0;
}
.header-logo-item:nth-child(2) {
  --logo-color: #334d78;
}
.header-logo-item:nth-child(3) {
  --logo-color: #c6cb8d;
}

.header-logo-item > * {
  width: 100%;
  height: 100%;
}
.header-logo-item svg > * {
  fill: var(--logo-color);
}

@media screen and (min-width: 992px) {
  .header {
    padding-top: 46rem;
    padding-bottom: 32rem;
  }
  .header-logo-item {
    width: 150rem;
    height: 150rem;
  }
  .header-wrap {
    padding-bottom: 210rem;
  }
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
