.hr {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;

  h3 {
    color: #3b4c6b;
    font-weight: 900;
    margin: 0;
  }

  .first_section {
    width: 100%;
    height: 100vh;

    img {
      width: 100%;
      height: 100%;
    }
  }

  .second_section {
    width: 75%;
    display: flex;
    justify-content: space-between;

    .left {
      width: 40%;
      display: flex;
      flex-direction: column;

      h2 {
        color: #3b4c6b;
        font-weight: 900;
        margin: 0;
      }

      p {
        font-size: 1.1rem;
        font-weight: 600;
        text-align: justify;
      }

      .left_text_one {
        padding-top: 1rem;
      }

      .left_text_two {
        padding-top: 2rem;
      }
    }

    .right {
      width: 30%;
      display: flex;
      flex-direction: column;
      align-items: end;

      ul {
        list-style-type: none;
        padding-left: 0;
        text-align: end;
        font-size: 1.1rem;
        font-weight: 600;

        li {
          padding-top: 0.7rem;
        }
      }
    }
  }

  .third_section {
    .form-group {
      margin-bottom: 15px;
      padding-top: 1rem;

      .cv {
        background-color: #fff;
        border-radius: 0.3rem;
      }
    }

    label {
      display: block;
      margin-bottom: 6px;
      font-weight: bold;
    }

    input[type="text"],
    input[type="tel"],
    input[type="file"] {
      width: 100%;
      padding: 10px;
      border: 1px solid #ccc;
      border-radius: 6px;
      font-size: 16px;
    }

    .form-submit {
      background-color: #3b4c6b;
      border: none;
      padding: 12px 20px;
      font-size: 16px;
      border-radius: 6px;
      cursor: pointer;
      font-weight: bold;
      transition: 0.3s;
    }

    .form-submit:hover {
      background-color: #1a1f36;
      color: #d7c4a3;
    }

    .file-label {
      display: inline-block;
      background-color: #3b4c6b;
      color: #000;
      padding: 10px 16px;
      border-radius: 6px;
      cursor: pointer;
      font-weight: bold;
      transition: background-color 0.3s ease;
      margin-right: 10px;
      margin-bottom: 0;
    }

    .file-label:hover {
      background-color: #1a1f36;
      color: #d7c4a3;
    }

    #file-chosen {
      font-style: italic;
      color: #555;
    }
  }
}

@media (max-width: 1537px) {
  .hr {
    .second_section {
      width: 90%;

      .left,
      .right {
        h2,
        h3 {
          font-size: 1.3rem;
        }

        p,
        ul {
          font-size: 1rem;
        }
      }
    }

    .third_section {
      width: 25%;

      h3 {
        font-size: 1.3rem;
      }
    }
  }
}

@media (max-width: 480px) {
  .hr {
    .first_section {
      height: 40vh;

      img {
        height: 100%;
      }
    }

    .second_section {
      width: 90%;
      flex-direction: column;

      .left {
        h2 {
          text-align: center;
        }
        width: 100%;
      }

      .right {
        width: 100%;
        margin-top: 1rem;
        align-items: center;

        ul {
          text-align: center;
        }
      }
    }

    .third_section {
      width: 90%;

      h3 {
        text-align: center;
      }
    }
  }
}