.contact-hero { background: var(--color-primary); color: #fff; padding: 120px 0 60px; text-align: center; }
.contact-hero h1 { font-size: 3.5rem; }

.contact-cards { padding: 60px 0; background: var(--color-bg-light); }
.contact-card-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.contact-card { background: #fff; padding: 24px; border-radius: 12px; text-align: center; font-weight: 600; box-shadow: 0 4px 12px rgba(0,0,0,0.04); }

.contact-form-section { padding: 60px 0; background: #fff; text-align: center; }
.contact-form-section form { max-width: 500px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
.contact-form-section input, .contact-form-section select, .contact-form-section textarea { padding: 12px; border: 2px solid #ddd; border-radius: 8px; font-family: inherit; }

.social-contact { padding: 60px 0; background: var(--color-bg-light); text-align: center; }
.social-links { display: flex; justify-content: center; gap: 24px; flex-wrap: wrap; margin-top: 20px; }
.social-links a { color: var(--color-primary); font-weight: 600; text-decoration: none; }

.office-info { padding: 40px 0; background: var(--color-primary); color: #fff; text-align: center; font-size: 1.3rem; }

@media (max-width: 768px) {
  .contact-card-grid { grid-template-columns: 1fr 1fr; }
}