/* ===================================================
   Contact & Footer Styles
   ================================================== */

.contact{
  background:linear-gradient(135deg, var(--deep) 0%, #1e3d28 100%); 
  color:#fff; 
  padding:60px 0 40px;
  border-top:1px solid #1b2b1f;
  margin-top:60px;
}

.contact-grid{
  display:grid !important; 
  gap:32px; 
  grid-template-columns: 1fr 1fr !important; 
  align-items:start;
}

/* Responsive grid - stack on smaller screens */
@media (max-width: 768px) {
  .contact {
    padding: 40px 0 32px;
    margin-top: 40px;
  }
  
  .contact-grid {
    grid-template-columns: 1fr !important;
    gap: 24px;
  }
  
  form, .wpforms-container {
    padding: 20px 16px;
  }
  
  .contact h2 {
    font-size: 28px;
    margin-bottom: 20px;
  }
  
  .contact h3 {
    font-size: 18px;
  }
  
  .social-links {
    margin: 16px 0 12px;
  }
  
  .social-links a {
    width: 36px;
    height: 36px;
  }
  
  .social-links svg {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 480px) {
  .contact {
    padding: 32px 0 24px;
  }
  
  form, .wpforms-container {
    padding: 16px 12px;
  }
  
  input, textarea {
    padding: 10px 12px;
    font-size: 15px;
  }
  
  textarea {
    min-height: 100px;
  }
  
  .wpforms-container .wpforms-submit,
  .wpforms-container button[type="submit"] {
    width: 100% !important;
    padding: 12px 20px !important;
  }
  
  footer {
    font-size: 12px;
    text-align: center;
  }
}

form, .wpforms-container{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18);
  border-radius:16px; padding:16px
}

label{display:block; font-size:14px; margin:8px 0 4px}

input, textarea{
  width:100%; padding:10px 12px; border-radius:12px; border:1px solid #dfe7de;
  background:#fff; color:#0e1a12; font:inherit
}

textarea{min-height:110px; resize:vertical}

.submit{margin-top:12px; background:#fff; color:#0e1a12; font-weight:700; border:0; padding:12px 16px; border-radius:12px}

/* WPForms styling integration */
.wpforms-container{box-sizing:border-box !important}
.wpforms-container .wpforms-form{background:transparent !important; padding:0 !important; margin:0 !important}
.wpforms-container .wpforms-field-container{margin:0 !important; padding:0 !important}
.wpforms-container .wpforms-field{margin-bottom:20px !important; padding:0 !important}

/* Labels - positioned above inputs with proper spacing */
.wpforms-container .wpforms-field-label{
  display:block !important;
  font-size:13px !important;
  margin:0 0 6px 2px !important;
  color:rgba(255,255,255,0.85) !important;
  font-weight:500 !important;
  font-family:'Montserrat', sans-serif !important;
  line-height:1.3 !important;
}

.wpforms-container .wpforms-field-sublabel{
  display:block !important; 
  font-size:11px !important; 
  margin:6px 0 0 2px !important; 
  color:rgba(255,255,255,0.6) !important;
  font-family:'Montserrat', sans-serif !important;
}

/* All input fields - clean white boxes */
.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="tel"],
.wpforms-container input[type="url"],
.wpforms-container input[type="number"],
.wpforms-container textarea,
.wpforms-container select{
  width:100% !important; 
  padding:12px 14px !important; 
  border-radius:10px !important; 
  border:none !important; 
  background:#fff !important; 
  color:#0e1a12 !important; 
  font-family:'Montserrat', sans-serif !important; 
  font-size:14px !important; 
  margin:0 !important;
  box-sizing:border-box !important;
  box-shadow:0 2px 6px rgba(0,0,0,0.06) !important;
  transition:box-shadow 0.2s !important;
}

.wpforms-container input:focus,
.wpforms-container textarea:focus,
.wpforms-container select:focus{
  outline:none !important;
  box-shadow:0 4px 12px rgba(0,0,0,0.1) !important;
}

.wpforms-container input::placeholder,
.wpforms-container textarea::placeholder{
  color:#9ca3af !important;
  opacity:0.7 !important;
}

.wpforms-container textarea{min-height:130px !important; resize:vertical !important}

/* Mobile responsive for name fields */
@media (max-width: 600px){
  .wpforms-container .wpforms-field-name{grid-template-columns:1fr !important}
  .wpforms-container .wpforms-field-row{grid-template-columns:1fr !important}
}

/* Submit button - green branded button */
.wpforms-container .wpforms-submit-container{margin:20px 0 0 !important; padding:0 !important; text-align:left !important}

.wpforms-container .wpforms-submit,
.wpforms-container button[type="submit"]{
  margin:0 !important; 
  background:#2f5b3e !important; 
  color:#fff !important; 
  font-weight:700 !important; 
  border:0 !important; 
  padding:13px 28px !important; 
  border-radius:10px !important; 
  cursor:pointer !important;
  width:auto !important; 
  font-size:14px !important; 
  font-family:'Montserrat', sans-serif !important;
  transition:all 0.2s ease !important;
  box-shadow:0 3px 10px rgba(47,91,62,0.25) !important;
}

.wpforms-container .wpforms-submit:hover,
.wpforms-container button[type="submit"]:hover{
  background:#254a31 !important;
  transform:translateY(-2px) !important;
  box-shadow:0 5px 15px rgba(47,91,62,0.35) !important;
}

/* Required asterisk */
.wpforms-container .wpforms-required-label{color:rgba(255,255,255,0.9) !important}

/* Error and confirmation messages */
.wpforms-container .wpforms-error{
  color:#fca5a5 !important; 
  font-size:12px !important; 
  margin-top:6px !important;
  background:rgba(239,68,68,0.12) !important;
  padding:6px 10px !important;
  border-radius:6px !important;
}

.wpforms-container .wpforms-confirmation-container-full{
  background:rgba(255,255,255,0.12) !important; 
  color:#fff !important; 
  padding:14px !important; 
  border-radius:10px !important;
  font-weight:500 !important;
  border:1px solid rgba(255,255,255,0.2) !important;
}

/* footer */
footer{font-size:13px; color:#e7efe6; padding-top:6px}

.social-links{display:flex; gap:12px; justify-content:center; margin:20px 0 16px}

.social-links a{
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,0.1); color:#fff;
  transition:all 0.2s; text-decoration:none;
}

.social-links a:hover{background:rgba(255,255,255,0.2); transform:translateY(-2px)}
.social-links a:focus{outline:2px solid #fff; outline-offset:2px}
.social-links svg{width:20px; height:20px; fill:currentColor}