section#contact { padding: 70px 0; text-align: center; } .contact-container { max-width: 420px; margin: 44px auto 0 auto; background: var(--card-bg) !important; border-radius: 20px; box-shadow: 0 4px 18px var(--shadow-color) !important; padding: 42px 25px 36px 25px; border: 1px solid var(--card-border) !important; color: var(--text-primary) !important; } h2 { color: var(--primary) !important; font-size: 2.2em; margin-top: 0; margin-bottom: 22px; text-align: center; font-weight: 900; letter-spacing: 0.3px; } .contact-label { display: block; font-weight: 700; margin-bottom: 8px; margin-top: 20px; text-align: left; color: var(--text-primary) !important; } .contact-input, .contact-select, .contact-textarea { width: 100%; padding: 12px; border-radius: 9px; border: 1.5px solid var(--primary) !important; background: #101b2b !important; color: var(--text-primary) !important; font-size: 1.07em; margin-bottom: 12px; font-weight: 600; outline: none; resize: none; box-sizing: border-box; transition: border .18s; } .contact-input:focus, .contact-select:focus, .contact-textarea:focus { border-color: var(--primary) !important; background: #16243c !important; color: #fff !important; } .contact-select { appearance: none; } .contact-btn { width: 100%; background: linear-gradient(90deg, var(--primary) 0%, var(--primary-dark) 100%) !important; color: #fff !important; border: none; border-radius: 16px; padding: 14px 0; font-size: 1.13em; font-weight: 800; cursor: pointer; box-shadow: 0 2px 8px var(--primary)22 !important; margin-top: 24px; transition: transform .11s cubic-bezier(.24,.92,.57,1.32); } .contact-btn:active { transform: scale(0.97); } .contact-info { margin-top: 16px; color: var(--primary) !important; font-size: 1.07em; min-height: 22px; text-align: center; } @media (max-width:520px) { .contact-container { max-width: 98vw; padding: 7vw 2vw; } h2 { font-size: 1.35em; } }