/*============== CONTACT US CSS ==============*/

.contactus_title {
      text-align: center;
      margin-bottom: 5rem;
      padding-top: 5rem;
}

.contactus_article{
      align-items: center;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
      /* margin-top: 5rem; */
}

.contactus_article h3{
      font-size: 2rem;
      font-weight: 500;
      text-decoration: underline;
      margin-top: 5rem;
      color: var(--color-black);
}

.contactus_article p {
      font-size: 2rem;
      color: black;
      /* margin-bottom: 1rem; */
}

.contactus_article ul {
      font-size: 2rem;
      list-style-type: circle;
      color: black;
      /* margin-bottom: 1rem; */
}

.contactus_article ul li{
      font-size: 1.8rem;
      list-style-type: "• ";
      color: black;
      margin-left: 40px;
      /* margin-bottom: 1rem; */
}

.contactus_article form {
      /* margin: 0 auto; */
      display: flex;
      flex-direction: column;
      align-items: start;
      /* justify-content: start; */
      gap: 50px;
      
}

.contactus_article form  h2 {
      margin-bottom: 10px;
}


.contactus-inputs {
      width: 400px;
      height: 50px;
      border: none;
      background: lightgrey;
      outline: none;
      padding-left: 25px;
      font-weight: 500;
      border-radius: 50px;
}

.contactus-left textarea {
      height: 180px;
      padding-top: 20px;
      border-radius: 30px;
}

.contactus-inputs:focus {
      border: 2px solid --color-primary;
}

.contactus-inputs::placeholder {
      color: var(--color-black);
}

.contactus-left button {
      display: flex;
      align-items: center;
      padding: 15px 30px;
      font-size: 16px;
      color: white;
      gap: 10px;
      border: none;
      border-radius: 50px;
      background: var(--color-primary);
      cursor: pointer;

}

/* .contactus-right img {
      width: 600px;
} */


/*============== MEDIA QUERIES (TABLETS) ==============*/

@media screen and (max-width: 1024px) {

      .contactus_article{
            margin: 0 auto;
            gap: 30px;
            /* align-items: start;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
            margin-top: 5rem; */
      }

      .contactus_article form {
            display: flex;
            flex-direction: column;
            align-items: start;
            /* justify-content: start; */
            gap: 20px;
      }
}


/*=================== MEDIA QUERIES (MOBILE) ====================*/

@media screen and (max-width: 600px) {

      .contactus_article{
            display:inline-block; 
            flex-direction: column;  
            justify-content: center; 
            align-items: center;   
            gap: 3rem;
            /* margin-top: 5rem; */
            /* padding: 20px; */

      }

      .contactus-inputs {
            width: 100%; /* Takes full width of the parent container */
            padding: 10px; /* Adds padding inside the input */
            margin: 5px 0; /* Adds vertical spacing and removes horizontal spacing */
            box-sizing: border-box; /* Includes padding and border in the width calculation */
      }

      .contactus-left button {
            display: flex;
            align-items: center;
            padding: 15px 30px;
            font-size: 16px;
            color: white;
            gap: 10px;
            border: none;
            border-radius: 50px;
            background: var(--color-primary);
            cursor: pointer;
            margin-bottom: 5rem;
      }

}