body{
    background-color: #000000; /* fallback */
    background-image: url('images/IMG_20231210_143507.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: rgb(82, 148, 233);
}

.contact-section {
  max-width: 800px;
  margin: 3rem auto;
  padding: 2.5rem;
  background: linear-gradient(180deg, rgba(200, 200, 200, 0.5), rgba(255,255,255,0.1));
  border-radius: 8px;
  color:transparent;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-height: calc(100vh - 220px);
  justify-content: center;
  border: 1px solid rgba(214, 198, 198, 0.689);
  box-shadow: 0 8px 30px rgba(222, 216, 216, 0.5);
}
.contact-section h1 {
  margin-bottom: 0.5rem;
  color: transparent;
  background: linear-gradient(to right, red, cyan);
 background-clip: text;
  -webkit-background-clip: text;
  font-size: 3.4rem;
  line-height: 1.1;
  text-align: center;
}
.contact-intro {
   color: transparent;
  background: linear-gradient(to right, red,black, rgba(255, 29, 48, 0.84),rgb(255, 213, 0));
  background-clip: text;
  -webkit-background-clip: text;
  margin-bottom: 1rem;
  text-align: center;
  font-size: 1.1rem;
}
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  max-width: 600px;
}
.contact-form input,
.contact-form textarea {
  padding: 0.75rem;
  border-radius: 6px;
  border: 1px solid #000000;
  font-size: 1rem;
  width: 100%;
  box-sizing: border-box;
  box-shadow: #ee1c1c;
}
.contact-form .actions { display:flex; align-items:center; gap:0.5rem; justify-content:center; }
.contact-form button {
  padding: 0.75rem 1rem;
  border-radius: 6px;
  border: none;
  background: #ee1c1c;
  color: #fff;
  cursor: pointer;
}
.contact-form a.back-link {
  color: #ddd;
  text-decoration: none;
}
@media (max-width:700px){
  .contact-section{ margin:1.5rem; padding:1rem; }
  .contact-form .actions{ flex-direction:column; align-items:flex-start; gap:0.75rem; }
}