.c-form-section {
  background-color: #9a1b1d;
  padding-block: calc(40 * var(--etest-section-unit));
  margin-block-start: calc(40 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    padding-block: calc(80 * var(--etest-section-unit));
    margin-block-start: calc(80 * var(--etest-section-unit));
  }
}

.c-form-section p,
.c-form-section h2,
.c-form-section input,
.c-form-section select,
.c-form-section button {
  margin-bottom: 0;
}

.c-form-section button {
  margin-right: 0;
}

.c-form-section .c-form-section__container {
  display: grid;
  grid-template-columns: 1fr;
  position: relative;
  max-width: var(--etest-content-max-width, 1440px);
  margin-inline: auto;
  overflow: hidden;
  border-radius: calc(16 * var(--etest-section-unit));
  width: calc(100% - 32px);
  gap: calc(16 * var(--etest-section-unit));

  @media (767px < width) {
    grid-template-columns: 612fr 804fr;
    border-radius: calc(20 * var(--etest-section-unit));
    width: calc(100% - 48px);
    gap: calc(24 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__picture {
  aspect-ratio: 1 / 1;
  border-radius: calc(16 * var(--etest-section-unit));
  overflow: hidden;

  @media (min-width: 1024px) {
    border-radius: calc(20 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.c-form-section .c-form-section__form-container {
  background-color: #fff;
  display: flex;
  flex-direction: column;
  padding: calc(32 * var(--etest-section-unit)) calc(16 * var(--etest-section-unit));
  row-gap: calc(16 * var(--etest-section-unit));
  border-radius: calc(16 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    padding: calc(40 * var(--etest-section-unit));
    row-gap: calc(30 * var(--etest-section-unit));
    border-radius: calc(20 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__heading {
  display: flex;
  flex-direction: column;
  row-gap: calc(8 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    row-gap: calc(20 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__title {
  font-weight: 700;
  font-size: calc(20 * var(--etest-section-unit));
  color: #0e0e0e;

  @media (min-width: 1024px) {
    font-size: calc(36 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__description {
  font-size: calc(15 * var(--etest-section-unit));
  line-height: 1.5;
  color: #0e0e0e;

  @media (min-width: 1024px) {
    font-size: calc(16 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__form {
  display: flex;
  flex-direction: column;
  row-gap: calc(16 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    row-gap: calc(30 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__form-input {
  display: flex;
  flex-direction: column;
  row-gap: calc(8 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    row-gap: calc(16 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__form-group {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: calc(8 * var(--etest-section-unit));
  column-gap: calc(20 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    grid-template-columns: repeat(2, 1fr);
  }
}

.c-form-section .c-form-section__form-group .c-form-section__input-container p:has(:is(input, select, textarea)) {
  width: 100%;
}

.c-form-section .c-form-section__form-group .c-form-section__input-container input,
.c-form-section .c-form-section__form-group .c-form-section__input-container select,
.c-form-section .c-form-section__input-container textarea {
  background-image: none;
  background-color: transparent;
  box-shadow: none;
  padding: 0;
  margin: 0;
  height: auto;
  border: none;
  line-height: calc(19 * var(--etest-section-unit)) !important;
  font-size: calc(16 * var(--etest-section-unit));
  min-height: 0;
  width: 100%;

  &:focus {
    box-shadow: none;
  }
}

.c-form-section .c-form-section__input-container {
  border: calc(1 * var(--etest-section-unit)) solid #d6d6d6;
  border-radius: calc(9999 * var(--etest-section-unit));
  color: #68686d;
  line-height: 1.5;
  height: auto;
  display: flex;
  align-items: center;
  font-size: calc(14 * var(--etest-section-unit));
  padding: calc(12.5 * var(--etest-section-unit)) calc(16 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    font-size: calc(16 * var(--etest-section-unit));
    padding: calc(13.5 * var(--etest-section-unit)) calc(20 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__input-container.c-form-section__input-container--textarea {
  border-radius: calc(12 * var(--etest-section-unit));
  padding: calc(16 * var(--etest-section-unit));
  
  @media (min-width: 1024px) {
    padding: calc(21 * var(--etest-section-unit));
    height: 3lh !important;
  }
}

.c-form-section .c-form-section__input-container.c-form-section__input-container--textarea p {
  width: 100%;
}

.c-form-section .c-form-section__input-container.c-form-section__input-container--textarea textarea {
  height: 3lh !important;
}

.c-form-section .c-form-section__submit-button {
  border-radius: calc(9999 * var(--etest-section-unit));
  display: flex;
  align-items: center;
  column-gap: calc(4 * var(--etest-section-unit));
  padding: calc(12 * var(--etest-section-unit)) calc(24 * var(--etest-section-unit));
  background-color: #9a1b1d;
  width: fit-content;
  color: #fff;
  text-transform: none;
  line-height: 1.5;
  font-weight: 600;
  font-size: calc(14 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    font-size: calc(16 * var(--etest-section-unit));
  }
}

.c-form-section .c-form-section__input-container p:has(svg) {
  display: flex;
  align-items: center;
}

.c-form-section .c-form-section__submit-icon {
  width: calc(20 * var(--etest-section-unit));
  height: calc(20 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    width: calc(24 * var(--etest-section-unit));
    height: calc(24 * var(--etest-section-unit));
  }
}