contact İletişim - Bize Ulaşın | Dodo Bilişim

Hesabım

.contact-hero-section { background: linear-gradient(135deg, #1e3c72 0%, #2a5298 50%, #4a90e2 100%); padding: 100px 0 80px; color: white; position: relative; overflow: hidden; } .contact-hero-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/svg+xml,'); opacity: 0.3; } .contact-hero-content { position: relative; z-index: 1; } .contact-hero-title { font-size: 3.5rem; font-weight: 800; margin-bottom: 20px; line-height: 1.2; text-shadow: 0 2px 10px rgba(0,0,0,0.2); } .contact-hero-subtitle { font-size: 1.3rem; font-weight: 300; margin-bottom: 30px; opacity: 0.95; } .contact-section { position: relative; padding: 80px 0; background: #ffffff; } .contact-form-card { background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%); border-radius: 20px; padding: 50px; border: 2px solid #e8ecf1; box-shadow: 0 5px 20px rgba(30, 60, 114, 0.08); margin-bottom: 30px; } .contact-form-card h2 { color: #1e3c72; font-weight: 700; font-size: 2rem; margin-bottom: 30px; border-bottom: 3px solid #2a5298; padding-bottom: 15px; } .contact-form .form-group { margin-bottom: 25px; } .contact-form .form-control { border-radius: 12px; box-shadow: none; font-size: 16px; height: 55px; border: 2px solid #e8ecf1; padding: 15px 20px; background-color: #ffffff; transition: all 0.3s ease; color: #4b5563; } .contact-form .form-control:focus { border-color: #2a5298; box-shadow: 0 0 0 3px rgba(42, 82, 152, 0.1); outline: none; } .contact-form textarea.form-control { height: 150px; resize: vertical; } .contact-form .btn-submit { background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%); border: none; border-radius: 12px; color: white; font-weight: 600; font-size: 16px; padding: 15px 40px; min-width: 200px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(30, 60, 114, 0.3); } .contact-form .btn-submit:hover { background: linear-gradient(135deg, #2a5298 0%, #4a90e2 100%); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(30, 60, 114, 0.4); } .contact-form .btn-submit:active { transform: translateY(0); } .contact-form .btn-submit:disabled { opacity: 0.6; cursor: not-allowed; transform: none; } .contact-info-card { background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%); border-radius: 20px; padding: 50px; border: 2px solid #e8ecf1; box-shadow: 0 5px 20px rgba(30, 60, 114, 0.08); height: 100%; } .contact-info-card h2 { color: #1e3c72; font-weight: 700; font-size: 2rem; margin-bottom: 30px; border-bottom: 3px solid #2a5298; padding-bottom: 15px; } .contact-info-item { margin-bottom: 30px; padding: 20px; background: linear-gradient(135deg, #f8f9ff 0%, #ffffff 100%); border-radius: 15px; border: 2px solid #e8ecf1; transition: all 0.3s ease; } .contact-info-item:hover { border-color: #2a5298; box-shadow: 0 5px 15px rgba(30, 60, 114, 0.1); transform: translateY(-3px); } .contact-info-item h6 { color: #1e3c72; font-weight: 700; font-size: 1.3rem; margin-bottom: 15px; position: relative; padding-left: 30px; } .contact-info-item h6::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 70%; background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%); border-radius: 2px; } .contact-info-item .info { font-size: 16px; color: #4b5563; line-height: 1.8; padding-left: 30px; } .contact-info-item .info a { color: #2a5298; text-decoration: none; font-weight: 600; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 10px; } .contact-info-item .info a:hover { color: #1e3c72; transform: translateX(5px); } .contact-info-item .info a img { width: 18px; height: 18px; } .whatsapp-button { background: linear-gradient(135deg, #25D366 0%, #128C7E 100%); color: white; border: none; border-radius: 12px; padding: 15px 30px; font-weight: 600; font-size: 16px; display: inline-flex; align-items: center; gap: 12px; text-decoration: none; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3); margin-top: 10px; } .whatsapp-button:hover { background: linear-gradient(135deg, #128C7E 0%, #25D366 100%); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4); color: white; text-decoration: none; } .whatsapp-button svg { width: 24px; height: 24px; fill: white; } .contact-map { position: relative; width: 100%; height: 450px; border-radius: 20px; overflow: hidden; box-shadow: 0 5px 20px rgba(30, 60, 114, 0.1); margin-bottom: 50px; } .contact-map iframe { width: 100%; height: 100%; border: none; } .alert { padding: 15px 20px; border-radius: 12px; margin-bottom: 20px; border: 2px solid; } .alert-success { background-color: #d1fae5; border-color: #10b981; color: #065f46; } .alert-danger { background-color: #fee2e2; border-color: #ef4444; color: #991b1b; } @media (max-width: 768px) { .contact-hero-title { font-size: 2.5rem; } .contact-hero-subtitle { font-size: 1.1rem; } .contact-form-card, .contact-info-card { padding: 30px; } .contact-section { padding: 50px 0; } }