.section-one {
      background: url('../images/contactus.png') center/cover no-repeat;
      height: 110vh;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      /* overflow: hidden; */
    }

    section::before {
      content: "";
      position: absolute;
      inset: 0;
      /* background: rgba(0, 0, 0, 0.75);
      backdrop-filter: blur(6px); */
      z-index: 1;
      
    }

    .membership-form {
      position: relative;
      z-index: 2;
      /* width: 100%;
      max-width: 520px; */
      background: rgba(20, 20, 20, 0.7);
      padding: 2.5rem 3rem;
      box-shadow: 0 0 30px rgba(0,0,0,0.6);
      border: 1px solid rgba(255,255,255,0.08);
      margin-top:70px !important;
    }


  @media (max-width: 992px) {
    .membership-form {
      margin-top:100px;

      
    }
  }





/* Tablets */
/* @media (max-width: 992px) {
    .membership-form {
        margin-top: 120px !important;
    }
} */

/* Phones */
@media (max-width: 768px) {
    .membership-form {
        margin-top: 150px !important;
    }
}

/* Small phones */
@media (max-width: 576px) {
    .membership-form {
        margin-top: 90px !important;
    }
}
@media (max-width: 540px) {
    .membership-form {
        margin-top: 190px !important;
    }
    .golf-academy-video {
        margin-top: 120px !important;
    }
}



@media (width: 375px) {
    .membership-form {
        margin-top: 290px !important;
    }
}

@media (width: 375px) {
    .golf-academy-video {
        margin-top: 190px !important;
    }
}


@media (width: 360px) {
    .membership-form {
        margin-top:190px !important;
    }
}

@media (width: 360px) {
    .golf-academy-video {
        margin-top: 190px !important;
    }
}


@media (width: 820px) {
    section {
     height: 80vh !important;
    }
}
  
@media (width: 912px) {
    section {
     height: 80vh !important;
    }
}

@media (width: 853px) {
    section {
     height: 80vh !important;
    }
}
 
 




  @media (width: 540px) {
    .membership-form {
      margin-top: 240px;
    }
    
    footer{
      margin-top: 200px !important;
    }
  }


   @media (width: 375px) {
    .membership-form {
      margin-top: 340px;
    }
    
    footer{
      margin-top: 300px !important;
    }
  }

  @media (width: 360px) {
    .membership-form {
      margin-top: 340px;
    }
    
    footer{
      margin-top: 300px !important;
    }
  }


    .membership-form h2 {
      color: #f5f5f5;
      text-align: center;
      /* margin-bottom: 2rem; */
      font-weight: 500;
      letter-spacing: 3px;
    }

    .form-label {
      color: #ccc;
      font-size: 0.9rem;
      transition: color 0.3s;
    }

    .form-control, .form-select, textarea {
      background: transparent;
      border: none;
      border-bottom: 1px solid rgba(255,255,255,0.2);
      color: #f5f5f5;
      border-radius: 0;
      padding-left: 0;
      transition: border-color 0.3s, background 0.3s;
      box-shadow: none;
    }

    .form-control:focus, .form-select:focus, textarea:focus {
      border-color: #8bc34a;
      background: rgba(255,255,255,0.05);
      color: #fff;
      outline: none;
    }

    .form-control::placeholder, textarea::placeholder {
      color: rgba(255,255,255,0.4);
    }

    select option {
      background-color: #111;
      color: #fff;
    }

    .btn-submit {
      width: 100%;
      background: linear-gradient(90deg, #00000077, #000000);
      color: #fff;
      text-transform: uppercase;
      letter-spacing: 1px;
      border: 1px solid rgba(255,255,255,0.1);
      padding: 0.75rem;
      transition: all 0.3s ease;
    }

    .btn-submit:hover {
      background: #c59d5f;
      border-color: #c59d5f;
      letter-spacing: 2px;
    }

    /* Subtle input animations */
    .form-group {
      position: relative;
      margin-bottom: 1.75rem;
    }

    .form-group input:focus ~ label,
    .form-group textarea:focus ~ label,
    .form-group input:not(:placeholder-shown) ~ label,
    .form-group textarea:not(:placeholder-shown) ~ label {
      transform: translateY(-18px);
      font-size: 0.8rem;
      /* color: #c59d5f; */
    }

    .form-group label {
      position: absolute;
      top: 0.6rem;
      left: 0;
      color: rgba(255,255,255,0.5);
      font-size: 0.95rem;
      pointer-events: none;
      transition: all 0.3s ease;
    }

    textarea {
      resize: none;
    }



.input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2); */
    color: #f5f5f5;
}

       
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select {
     background-color: transparent;
     border: none;
     border-bottom: 1px solid rgba(255, 255, 255, 0.2); */
    color: #f5f5f5;
     }


     .form-control, .form-select, textarea {
  
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
   color: #f5f5f560;
   
    transition: border-color 0.3s, background 0.3s;
    box-shadow: none;
}




input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  box-shadow: none !important;
}

.form-control:focus,
.form-select:focus {
  border: none !important;
  border-bottom: 2px solid #fff !important;
  background: rgba(255, 255, 255, 0);
  color: #fff;
  box-shadow: none !important;
}













.membership-title-header h1{
    
   font-size: clamp(22px, 2vw,70px);
    font-weight: 700;
    letter-spacing: 5px !important;
    margin-bottom: 20px;
    opacity: 0;
    animation: titleRevealheader 1.5s ease forwards 0.8s;
    color: #fff !important;
    text-shadow: 
        0 0 40px rgba(120, 100, 110, 0.5),
        0 5px 20px rgba(0, 0, 0, 0.8);
    position: relative;
	text-transform: uppercase;
}

@keyframes titleRevealheader {
    from {
        opacity: 0;
        transform: translateY(40px);
        letter-spacing: 30px;
    }
    to {
        opacity: 1;
        transform: translateY(0);
        letter-spacing: 18px;
    }
}




.membership-title-header  p {
    
  
    letter-spacing: 1px !important;
    
    opacity: 0;
    animation: titleReveal 2s ease forwards 1s;
    color: #fff;
    
    
}

@keyframes titleReveal {
    from {
        opacity: 0;
        transform: translateY(40px);
        letter-spacing: 30px;
    }
    to {
        opacity: 1;
        transform: translateY(0);
        letter-spacing: 18px;
    }
}