@import "_variables.css";

/** Footer styles */
.site-footer {
  background: var(--primary-color);

  .builder-row {
    display: flex;

    &>.column:first-child {
      width: 46%;
      display: flex;
      gap: 2.462rem;
      flex-direction: column;
      padding: 2.846rem 2rem 2.846rem 11.846rem !important;

      .child-row-item button {
        background-color: #ffffff;
        padding: 0.523rem 1.538rem;
        color: #000000;
        font-weight: 500;
        font-size: var(--font-size-16);
      }

      .child-row-text>h3 {
        color: var(--text-gray-50);
        font-size: 1.385rem;
        font-weight: 400;
      }

      .child-row-button-rounded {
        text-transform: inherit;
        font-size: var(--font-size-16);
        padding: 0.462rem 1.538rem;
      }
    }

    &>.column:last-child {
      width: 54%;
      border-top: 0.077rem solid rgba(248, 113, 113, 1);
      border-left: 0.077rem solid rgba(248, 113, 113, 1);
      margin-top: 3rem;
      padding: 2.923rem 0 0 4.923rem;
      border-top-left-radius: 9.846rem;

      .builder-r0-c0-cr1-ccl1 {
        width: 100%;
        margin-top: 3.462rem;

        .child-row-content {
          font-size: 0.923rem;
          color: rgba(255, 255, 255, 0.5);
          padding-bottom: 2.846rem;
        }
      }

      .child-row-item {
        font-size: var(--font-size-16);
        display: flex;
        flex-direction: column;
        gap: 0.538rem;
        color: var(--text-white);

        .child-row-title-icon {
          display: flex;
          flex-direction: row-reverse;
          justify-content: left;
          align-items: center;
          gap: 0.923rem;
          font-weight: 400;
          font-size: var(--font-size-16);

          svg,
          path {
            fill: rgba(255, 255, 255, 1) !important;
            fill-opacity: 1;
          }
        }

        .child-row-title {
          color: var(--text-gray-50);
          font-weight: 700;
          padding-bottom: 1.231rem;
          padding-top: 1.231rem;
          font-size: var(--font-size-16);
        }

        .child-column_text-icon {
          display: flex;
          gap: 0.923rem;
        }

        .child-column_social_buttons {
          display: flex;
          gap: 0.385rem;

          .child-row-button-icon {
            width: 3.846rem;
            height: 3.846rem;
            color: var(--text-white);
            background-color: transparent;
            border: 0.077rem solid var(--text-white);
          }
        }
      }
    }
  }
}

@media (max-width: 1280px) {
  .site-footer .builder-row>.column:first-child {
    padding: 2.846rem 2rem 2.846rem 2.846rem !important;
  }

  .site-footer .builder-row>.column:last-child {
    padding: 2.923rem 2.846rem 0 3.923rem;
    border-top-left-radius: 7.846rem;
  }

}

@media (max-width: 1024px) {
  .site-footer .builder-row {
    flex-direction: column;
  }

  .site-footer .builder-row>.column:first-child {
    width: 100%;
    padding: 3rem 2rem 2rem 2rem !important;
    gap: 1.154rem;
    gap: 1.846rem;
  }

  .site-footer .builder-row>.column:last-child {
    width: 100%;
    margin-top: 0;
    padding: 3rem 2rem;
    border-left: none;
    border-top: 0.077rem solid rgba(248, 113, 113, 1);
    border-top-left-radius: 3rem;
  }

  .site-footer .builder-row>.column:last-child .builder-r0-c0-cr1-ccl0 {
    width: 100%;
    float: none;
  }

  .site-footer .builder-row>.column:last-child .builder-r0-c0-cr1-ccl2 {
    width: 100%;
    margin-top: 1.538rem;
    float: none;
  }
}

@media (max-width: 768px) {
  .site-footer .builder-row>.column:first-child {
    padding: 1.538rem 1.154rem !important;
  }

  .site-footer .builder-row>.column:last-child {
    padding: 1.538rem 1.154rem;
    border-top-left-radius: 1.538rem;
  }

  .site-footer .child-row-title-icon {
    font-size: var(--font-size-14);
    gap: 0.615rem;
  }

  .site-footer .child-row-button-icon {
    width: 2.308rem;
    height: 2.308rem;
  }

    .site-footer .child-row-button-rounded {
        font-size: var(--font-size-14);
        padding: 4px 16px;
    }
}

@media (max-width: 468px) {
    .site-footer .builder-row > .column:last-child .builder-r0-c0-cr1-ccl1 {
        margin-top: 2rem;

        .child-row-content {
            padding-bottom: 1rem;
        }
    }
}