.steps {
  padding-top: 96px;
  padding-bottom: 24px; }
  .steps > .text-container {
    max-width: 1008px;
    width: 100%;
    margin: 0 auto;
    text-align: center; }
    .steps > .text-container h3 {
      font-size: 32px;
      color: #2C1E39; }
    .steps > .text-container p {
      margin: 24px auto;
      font-size: 20px;
      font-weight: 300;
      color: #594C65; }
  .steps .steps-container {
    margin-top: 56px;
    display: flex;
    flex-direction: row;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1216px;
    gap: 32px; }
    .steps .steps-container .step {
      padding: 0 24px;
      flex-shrink: 1;
      width: 336px; }
      .steps .steps-container .step .img {
        background-size: cover;
        background-repeat: no-repeat;
        width: 280px;
        height: 272.1088435374px; }
      .steps .steps-container .step .text-container {
        display: flex;
        column-gap: 16px;
        margin-top: 24px; }
        .steps .steps-container .step .text-container .number {
          flex-shrink: 0;
          background-size: cover;
          background-repeat: no-repeat;
          width: 40px;
          height: 40px; }
        .steps .steps-container .step .text-container .text h5 {
          font-size: 24px;
          line-height: 32px;
          font-weight: 500; }
        .steps .steps-container .step .text-container .text p {
          margin-top: 8px;
          font-size: 16px;
          line-height: 24px;
          font-weight: 300; }
    .steps .steps-container .step-1 .img {
      background-image: url("/includes/site/img/steps/step1.svg"); }
    .steps .steps-container .step-1 .text-container .number {
      background-image: url("/includes/site/img/steps/number1.svg"); }
    .steps .steps-container .step-2 .img {
      background-image: url("/includes/site/img/steps/step2.svg"); }
    .steps .steps-container .step-2 .text-container .number {
      background-image: url("/includes/site/img/steps/number2.svg"); }
    .steps .steps-container .step-3 .img {
      background-image: url("/includes/site/img/steps/step3.svg"); }
    .steps .steps-container .step-3 .text-container .number {
      background-image: url("/includes/site/img/steps/number3.svg"); }

@media screen and (max-width: 1279px) and (min-width: 1024px) {
  .steps {
    padding: 72px 40px 24px; }
    .steps > .text-container p {
      margin: 16px auto;
      font-size: 18px; }
    .steps .steps-container {
      gap: 16px;
      margin-top: 40px; }
      .steps .steps-container .step {
        padding: 0 16px; }
        .steps .steps-container .step .img {
          width: 236.29px;
          height: 229.6307094266px; }
        .steps .steps-container .step .text-container {
          margin-top: 16px; } }
@media screen and (max-width: 1023px) and (min-width: 768px) {
  .steps {
    padding: 56px 32px 24px; }
    .steps > .text-container p {
      margin: 16px auto;
      font-size: 18px; }
    .steps > .text-container h3 {
      font-size: 30px; }
    .steps .steps-container {
      gap: 16px;
      margin-top: 40px; }
      .steps .steps-container .step {
        padding: 0 8px; }
        .steps .steps-container .step .img {
          width: 192px;
          height: 186.5889212828px; }
        .steps .steps-container .step .text-container {
          margin-top: 16px;
          flex-direction: column; } }
@media screen and (max-width: 767px) and (min-width: 480px) {
  .steps {
    padding: 48px 24px 24px; }
    .steps > .text-container p {
      margin: 16px auto;
      font-size: 18px; }
    .steps > .text-container h3 {
      font-size: 30px; }
    .steps .steps-container {
      gap: 16px;
      margin-top: 32px;
      flex-direction: column;
      align-items: center; }
      .steps .steps-container .step {
        padding: 0 24px; }
        .steps .steps-container .step .img {
          width: 280px;
          height: 272.1088435374px; }
        .steps .steps-container .step .text-container {
          margin-top: 16px;
          flex-direction: row; } }
@media screen and (max-width: 479px) {
  .steps {
    padding: 40px 16px 16px; }
    .steps > .text-container p {
      margin: 16px auto;
      font-size: 18px; }
    .steps > .text-container h3 {
      font-size: 30px; }
    .steps .steps-container {
      gap: 24px;
      margin-top: 32px;
      flex-direction: column;
      align-items: center; }
      .steps .steps-container .step {
        padding: 0 24px;
        width: 288px; }
        .steps .steps-container .step .img {
          width: 192px;
          height: 186.5889212828px; }
        .steps .steps-container .step .text-container {
          margin-top: 16px;
          flex-direction: column; } }

/*# sourceMappingURL=index.css.map */