.two-principles {
  margin-top: clamp(55px, 6vw, 84px);
  padding-bottom: clamp(28px, 3.5vw, 50px);
  background: var(--color-bg-accent1);
  position: relative;
}
.two-principles:before {
  content: "";
  border-radius: var(--radius-4xl);
  background: var(--color-bg-section);
  position: absolute;
  top: -84px;
  width: 100%;
  height: 80%;
}
.two-principles__inner {
  position: relative;
  z-index: 2;
}
.two-principles__title {
  margin: 0 0 clamp(17px, 3vw, 44px);
  max-width: 793px;
}
.two-principles__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 3vw, 42px);
}
.two-principles__card {
  background: var(--color-bg-white);
  border-radius: var(--radius-3xl);
  overflow: hidden;
}
.two-principles__media {
  background: var(--color-bg-light2);
  height: clamp(200px, 20vw, 284px);
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.two-principles__body {
  padding: clamp(32px, 3vw, 37px) clamp(24px, 4vw, 60px) clamp(24px, 4vw, 52px);
}
.two-principles__card-title {
  margin-bottom: clamp(9px, 1.5vw, 12px);
}
.two-principles__card-text {
  max-width: 493px;
}
@media (width < 1520px) {
  .two-principles:before {
    border-radius: var(--radius-3xl);
  }
  .two-principles__card {
    border-radius: var(--radius-2xl);
  }
}
@media (width < 1440px) {
  .two-principles:before {
    border-radius: var(--radius-2xl);
  }
  .two-principles__card {
    border-radius: var(--radius-xl);
  }
}
@media (width < 1280px) {
  .two-principles__card {
    border-radius: var(--radius-lg);
  }
}
@media (width < 992px) {
  .two-principles:before {
    height: 100%;
  }
  .two-principles__card {
    border-radius: var(--radius-md);
  }
  .two-principles__media {
    display: none;
  }
}
@media (width < 768px) {
  .two-principles {
    background: var(--color-bg-section);
    border-radius: 0 0 var(--radius-2xl) var(--radius-2xl);
    z-index: 6;
  }
  .two-principles:before {
    border-radius: 0;
  }
  .two-principles__card {
    border-radius: var(--radius-sm);
  }
  .two-principles__grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}