/* ================================
   Contact Page Layout & Form Styles (Externalized)
   ================================ */

.contact-page-shell {background:linear-gradient(135deg,#d8e3f5 0%, #ffffff 100%); padding:0 0 20px;}
.contact-page-block {max-width:1180px; margin:0 auto; padding:0 20px;}

.contact-wrapper {display:flex; justify-content:center; align-items:flex-start; gap:30px; padding:40px 20px; background:#1a3d7c; border-radius:0; margin:0 0 30px; position:relative; width:100vw; left:50%; transform:translateX(-50%);}
.contact-banner {display:flex; flex-direction:column; align-items:flex-start; width:100%; color:#fff; padding:6px 0 0;}
.banner-sections {display:flex; justify-content:space-between; width:100%; gap:40px; margin-bottom:18px; flex-wrap:wrap;}
.help-section, .contact-section, .location-section {flex:1 1 260px; min-width:250px;}
.help-section h3, .contact-section h3, .location-section h3 {margin:0 0 14px; font-size:1.18rem; font-weight:600;}
.help-section p {margin:0; font-size:.95rem; line-height:1.55;}
.contact-section ul, .location-section ul {list-style:none; padding:0; margin:0; font-size:.95rem;}
.contact-section ul li, .location-section ul li {margin:0 0 10px; line-height:1.4;}
.cta-line {text-align:center; font-weight:900; font-size:1rem; margin:6px 0 0; width:100%;}

/* External Form Area */
.external-form-wrapper {display:flex; justify-content:center; align-items:flex-start; padding:10px 0 10px; margin:0 auto 0;}
.external-form-inner {width:100%; max-width:2000px; padding:0 20px; display:flex; justify-content:center;}
.external-form-inner iframe {width:100%; max-width:750px; height:760px; border:none; border-radius:10px; background:transparent; box-shadow:0 2px 6px rgba(0,0,0,.08); overflow:hidden;}

/* ================================
   Contact Form 7 Custom Styles (Final)
   ================================ */
/* Center the entire form and make it wider */
.wpcf7 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin: 20px auto;
  max-width: 750px; /* widened from 650px */
  background: #1e1d1d;
  padding: 20px 20px 0px 20px; /* further reduced bottom padding */
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
/* Make inputs full width */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  width: 100%;
  padding: 12px;
  margin-bottom: 12px;
  border: 1px solid #bbb;
  border-radius: 6px;
  font-size: 15px;
  background: #fff;
  color: #333;
}
/* Placeholder color for better visibility */
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
  color: #585858;
  opacity: 1;
}
/* Center and style submit button */
.wpcf7 input[type="submit"] {
  display: block;
  width: 100%;
  max-width: 350px;
  margin: 0 auto;
  padding: 12px 20px;
  background: #0073e6;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
  transition: background 0.3s ease;
}
.wpcf7 input[type="submit"]:hover { background: #005bb5; }
/* Remove extra space after submit button */
.wpcf7 p:last-child { margin-bottom: 0; }
/* Optional: adjust form for mobile responsiveness */
@media (max-width: 768px) {
  .wpcf7 { max-width: 90%; padding: 15px; }
}

/* Responsive */
@media (max-width: 992px){
  .contact-wrapper {margin:40px auto 25px; padding:36px 10px;}
}
@media (max-width: 768px){
  .contact-wrapper {flex-direction:column; gap:22px; margin:32px auto 20px; padding:32px 18px;}
  .banner-sections {flex-direction:column; gap:24px;}
}
@media (max-width: 600px){
  .contact-wrapper {padding:28px 16px; border-radius:10px; width:100%; left:0; transform:none;}
  .external-form-inner {padding:0 12px;}
  .external-form-inner iframe {height:1050px;}
  .cta-line {font-size:.95rem;}
  .banner-sections {flex-direction:column; gap:20px;}
  .help-section, .contact-section, .location-section {flex:1 1 100%; min-width:100%;}
}

/* ================================
   NEW MODERN CONTACT REDESIGN
   ================================ */
.contact-modern{padding:90px 0 70px;background:linear-gradient(145deg,#f3f6fb 0%,#ffffff 90%);} 
.contact-modern .contact-head h1{font-size:2.8rem;font-weight:700;color:#f47c2b;letter-spacing:-1px;margin:0 0 12px;} 
.contact-modern .contact-head p{color:#4a5668;font-size:1.05rem;max-width:680px;margin:0 auto 10px;} 

.contact-grid{margin-top:45px;} 
.contact-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:32px 30px 30px;box-shadow:0 10px 28px -10px rgba(20,37,63,0.15);position:relative;overflow:hidden;transition:.35s cubic-bezier(.4,.2,.2,1);} 
.contact-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 18%, rgba(244,124,43,.08), transparent 60%),radial-gradient(circle at 10% 90%, rgba(39,43,145,.08), transparent 65%);pointer-events:none;opacity:.5;transition:.45s;} 
.contact-card.highlight{border:1px solid #d9e2ef;} 
.contact-card.highlight:before{opacity:.65;} 
.contact-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px -12px rgba(20,37,63,0.20);} 
.contact-card:hover:before{opacity:.9;} 

.contact-card h3{font-size:1.05rem;font-weight:600;color:#272b91;display:flex;align-items:center;gap:10px;margin:0 0 18px;letter-spacing:.2px;text-transform:uppercase;} 
.contact-card h3 i{color:#f47c2b;font-size:1.1rem;} 

.contact-info-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:.95rem;color:#32455a;} 
.contact-info-list li span:first-child{font-weight:600;color:#272b91;margin-right:4px;} 
.contact-info-list a{color:#f47c2b;text-decoration:none;font-weight:600;} 
.contact-info-list a:hover{text-decoration:underline;} 

.contact-card p.lead{color:#415163;font-size:1rem;line-height:1.55;margin:0 0 24px;font-weight:500;} 
.btn-contact-form{background:linear-gradient(135deg,#f9a55a 0%,#f47c2b 40%,#d9681f 100%);color:#fff !important;padding:16px 34px;border-radius:40px;font-weight:600;display:inline-flex;align-items:center;gap:10px;box-shadow:0 12px 30px -8px rgba(244,124,43,.4);text-decoration:none;transition:.4s cubic-bezier(.4,.2,.2,1);} 
.btn-contact-form i{font-size:1rem;} 
.btn-contact-form:hover{transform:translateY(-4px);box-shadow:0 18px 44px -10px rgba(244,124,43,.5);} 
.btn-contact-form:active{transform:translateY(-1px);} 
.text-note{color:#5b6678;margin:14px 0 0;font-size:.8rem;} 

.social-block{margin-top:38px;border-top:1px dashed #d8e0ea;padding-top:30px;} 
.follow-label{font-size:.8rem;font-weight:600;color:#6a7685;text-transform:uppercase;letter-spacing:1.1px;margin:0 0 18px;} 
.social-buttons{list-style:none;padding:0;margin:0;display:flex;gap:14px;flex-wrap:wrap;} 
.social-buttons li a{position:relative;display:inline-flex;align-items:center;gap:8px;font-weight:600;padding:13px 22px;border-radius:16px;text-decoration:none;font-size:.9rem;letter-spacing:.2px;line-height:1;box-shadow:0 10px 24px -10px rgba(20,37,63,.25);transition:.4s cubic-bezier(.4,.2,.2,1);color:#fff;} 
.social-buttons li a.fb{background:#4267B2;} 
.social-buttons li a.wa{background:#25D366;} 
.social-buttons li a.tk{background:#272b91;} 
.social-buttons li a:hover{transform:translateY(-4px);box-shadow:0 18px 38px -12px rgba(20,37,63,.30);} 
.social-buttons li a:active{transform:translateY(-1px);} 

@media (max-width:991.98px){
  .contact-modern{padding:70px 0 60px;}
  .contact-modern .contact-head h1{font-size:2.3rem;}
  .contact-card{padding:30px 26px 28px;}
}
@media (max-width:575.98px){
  .contact-modern .contact-head h1{font-size:2rem;}
  .btn-contact-form{width:100%;justify-content:center;}
  .social-buttons{gap:10px;}
  .social-buttons li a{flex:1 1 auto;justify-content:center;}
}
