.contact-section { background-color: #f8f9fa; padding: 80px 0; margin-bottom: 4rem; } .section-header { font-size: 14px; color: #6c757d; font-weight: 500; margin-bottom: 20px; } .main-heading { font-size: 3.6rem; font-weight: 700; color: #212529; line-height: 1.2; margin-bottom: 60px; } .form-group label { font-weight: 500; color: #495057; margin-bottom: 10px; } .form-control { border: none; border-bottom: 2px solid #e9ecef; border-radius: 0; padding: 12px 0; background-color: transparent; font-size: 16px; box-shadow: none; } .form-control:focus { border-bottom-color: #2B64F6; box-shadow: none; background-color: transparent; } .message-field { min-height: 120px; resize: vertical; } .btn-submit { background: linear-gradient(135deg, #2B64F6, #0056b3); border: none; padding: 15px 30px; font-weight: 600; border-radius: 50px; color: white; font-size: 16px; margin-top: 30px; transition: all 0.3s ease; } .btn-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(0, 123, 255, 0.3); color: white; } .social-icons { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .social-icon { display: block; width: 45px; height: 45px; border: 1px solid #dee2e6; border-radius: 50%; text-decoration: none; color: #6c757d; text-align: center; line-height: 43px; margin-bottom: 15px; transition: all 0.3s ease; } .social-icon:hover { background-color: #2B64F6; border-color: #2B64F6; color: white; text-decoration: none; } .social-icon:hover svg path { /* stroke: #2B64F6; */ fill: white; } .email-support { justify-content: flex-start; background-color: #ECECEC; background-size: auto; background-image: url('../images/email-support.png'); background-repeat: no-repeat; background-position: bottom 0px right 0px; border-radius: 16px; padding: 2rem; } .live-chat { justify-content: flex-start; background-color: #ECECEC; background-size: auto; background-image: url('../images/email-support.png'); background-repeat: no-repeat; background-position: bottom 0px right 0px; border-radius: 16px; padding: 2rem; } .help-center .card { height: 320px; } .card-content { padding: 1rem 1.5rem; } .card-content h2 { font-size: 38px; font-weight: 600; letter-spacing: -2px; } .card-content p { font-size: 16px; color: #6c757d; line-height: 20px; } .card-content .btn { margin-top: 20px; } @media (max-width: 768px) { .main-heading { font-size: 2.5rem; } .social-icons { position: static; transform: none; display: flex; justify-content: center; margin-top: 30px; width: 100%; } .social-icon { margin-right: 15px; margin-bottom: 0; } }