h1{ color: #29abe2;}
    .container {
      display: flex;
      flex-wrap: wrap;
      max-width: 1200px;
      margin: 50px auto;
      padding: 20px;
      justify-content: space-between;
      gap: 40px;
    }

    .contact-info,
    .contact-form {
      flex: 1;
      min-width: 300px;
      padding: 20px;
    }

    .contact-info {
      max-width: 40%;
    }

    .contact-form {
      max-width: 55%;
    }

    .contact-info h1 {
      font-size: 32px;
      margin-bottom: 10px;
    }

    .contact-info p {
      font-size: 16px;
      margin-bottom: 30px;
      color: #555;
    }

    .contact-info div {
      margin-bottom: 15px;
      display: flex;
      align-items: center;
      font-size: 16px;
    }

    .contact-info div::before {
      content: '';
      display: inline-block;
      width: 20px;
      height: 20px;
      margin-right: 10px;
      background-size: contain;
      background-repeat: no-repeat;
    }

    .contact-info div:nth-child(3)::before {
      background-image: url('data:image/svg+xml;utf8,<svg fill="%2329abe2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.62 10.79a15.055 15.055 0 006.59 6.59l2.2-2.2a1 1 0 011.11-.21c1.21.49 2.53.76 3.88.76a1 1 0 011 1V20a1 1 0 01-1 1C10.61 21 3 13.39 3 4a1 1 0 011-1h3.5a1 1 0 011 1c0 1.35.27 2.67.76 3.88a1 1 0 01-.21 1.11l-2.2 2.2z"/></svg>');
    }

    .contact-info div:nth-child(4)::before {
      background-image: url('data:image/svg+xml;utf8,<svg fill="%2329abe2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 4H4a2 2 0 00-2 2v1.18l10 6.18 10-6.18V6a2 2 0 00-2-2zM2 8.82V18a2 2 0 002 2h16a2 2 0 002-2V8.82l-10 6.18L2 8.82z"/></svg>');
    }

    .contact-info div:nth-child(5)::before {
      background-image: url('data:image/svg+xml;utf8,<svg fill="%2329abe2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C8.13 2 5 5.13 5 9c0 6.08 7 13 7 13s7-6.92 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5S10.62 6.5 12 6.5 14.5 7.62 14.5 9 13.38 11.5 12 11.5z"/></svg>');
    }
	.contact-info div:nth-child(6)::before {
  background-image: url('data:image/svg+xml;utf8,<svg fill="%2329abe2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4.98 3.5C4.98 4.88 3.88 6 2.5 6S0 4.88 0 3.5 1.12 1 2.5 1 4.98 2.12 4.98 3.5zM.5 8h4v13h-4V8zm7.5 0h3.8v2.2h.05C12.5 8.9 14.15 8 16.4 8 21.1 8 22 10.6 22 14.7V21h-4v-6c0-1.9-.03-4.3-2.6-4.3-2.6 0-3 2-3 4.1V21h-4V8z"/></svg>');
}

    .contact-form input,
    .contact-form textarea {
      width: 100%;
      padding: 12px;
      margin-bottom: 15px;
      border: 1px solid #ccc;
      border-radius: 6px;
      font-size: 16px;
    }

    .name-fields {
      display: flex;
      gap: 10px;
    }

    .name-fields input {
      flex: 1;
    }

    .contact-form button {
      background-color: #29abe2;
      color: white;
      padding: 12px 24px;
      border: none;
      border-radius: 25px;
      font-size: 16px;
      cursor: pointer;
      transition: background 0.3s ease;
    }

    .contact-form button:hover {
      background-color: #021823;
    }

    @media (max-width: 768px) {
      .container {
        flex-direction: column;
        padding: 20px;
      }

      .contact-info,
      .contact-form {
        max-width: 100%;
        padding: 0;
      }

      .name-fields {
        flex-direction: column;
      }
    }