/* ===== CONTACT PAGE STYLES ===== */
.contact-hero { padding:120px 0 60px; background:linear-gradient(180deg,#E8F6FF,#FFF9F0); text-align:center; }
.contact-hero h1 { font-size:2.5rem; color:#3A7BD5; margin-bottom:10px; }
.contact-hero p { color:#777; font-size:1.1rem; }

.contact-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-bottom:50px; }
.contact-card { background:#fff; border-radius:16px; padding:28px; text-align:center; box-shadow:var(--shadow); transition:all .3s; }
.contact-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-hover); }
.contact-card .icon { font-size:2.5rem; margin-bottom:12px; }
.contact-card h3 { font-size:1rem; margin-bottom:8px; color:var(--text); }
.contact-card p,.contact-card a { font-size:.9rem; color:#777; display:block; line-height:1.6; }
.contact-card a:hover { color:var(--sky); }

.contact-main { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
.map-wrapper { border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.map-wrapper iframe { width:100%; height:400px; border:none; }
.contact-form { background:#fff; border-radius:var(--radius); padding:36px; box-shadow:var(--shadow); }
.contact-form h3 { font-family:'Fredoka'; color:#3A7BD5; font-size:1.4rem; margin-bottom:24px; }
.contact-form .form-group { margin-bottom:18px; }

.whatsapp-banner { margin-top:50px; background:linear-gradient(135deg,#25D366,#128C7E); border-radius:var(--radius); padding:40px; text-align:center; color:#fff; }
.whatsapp-banner h3 { font-size:1.5rem; margin-bottom:10px; }
.whatsapp-banner p { opacity:.9; margin-bottom:20px; }
.btn-whatsapp { display:inline-flex; align-items:center; gap:10px; padding:14px 32px; border-radius:50px; background:#fff; color:#25D366; font-weight:700; font-size:1rem; text-decoration:none; transition:all .3s; }
.btn-whatsapp:hover { transform:translateY(-3px); box-shadow:0 8px 25px rgba(0,0,0,.2); }

@media(max-width:768px) {
  .contact-main { grid-template-columns:1fr; }
  .contact-hero h1 { font-size:1.8rem; }
  .map-wrapper iframe { height:280px; }
}
