:root{font-family:Arial,sans-serif;line-height:1.5}body{margin:0}.container{position:relative;width:100%;height:100%;overflow:hidden}::-webkit-scrollbar{display:none}.container{position:relative;height:100dvh;width:100%}.contact-container{min-height:100dvh;background:linear-gradient(to bottom,#eef2ff,#fff);display:flex;align-items:center;justify-content:center;padding:2rem 1rem;transition:background .3s ease;overflow-y:auto}.contact-container.dark{background:linear-gradient(to bottom,#1f2937,#111827)}.form-wrapper{max-width:42rem;width:100%;margin:auto}.form-content{background:#fff;border-radius:.75rem;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;padding:2rem;position:relative;transition:all .3s ease;margin:1rem 0}.dark .form-content{background:#374151;box-shadow:0 20px 25px -5px #0000004d,0 10px 10px -5px #0003}.theme-toggle{position:absolute;top:1rem;right:1rem}.theme-button{background:none;border:none;cursor:pointer;padding:.5rem;border-radius:.375rem;color:#6b7280;transition:color .2s ease}.dark .theme-button{color:#e5e7eb}.theme-button:hover{color:#374151}.dark .theme-button:hover{color:#f3f4f6}.theme-icon{width:1.5rem;height:1.5rem}.form-header{text-align:center;margin-bottom:2rem}.form-header h2{font-size:1.5rem;font-weight:700;color:#1f2937;margin:0 0 .5rem}.dark .form-header h2{color:#f9fafb}.form-header p{color:#6b7280;margin:0}.dark .form-header p{color:#d1d5db}.error-alert{display:flex;align-items:center;gap:.5rem;background:#fee2e2;color:#991b1b;padding:1rem;border-radius:.375rem;margin-bottom:1.5rem}.dark .error-alert{background:#7f1d1d;color:#fca5a5}.alert-icon{width:1rem;height:1rem;flex-shrink:0}.contact-form{display:flex;flex-direction:column;gap:1.5rem}.form-row{display:flex;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.25rem;flex:1}.message-group{margin-top:.5rem}.form-group label{font-size:.875rem;font-weight:500;color:#374151}.dark .form-group label{color:#e5e7eb}.form-group input,.form-group textarea{padding:.75rem 1rem;border:1px solid #D1D5DB;border-radius:.375rem;outline:none;transition:all .2s;background:#fff;color:#1f2937}.dark .form-group input,.dark .form-group textarea{background:#1f2937;border-color:#4b5563;color:#f9fafb}.form-group input:focus,.form-group textarea:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f633}.dark .form-group input:focus,.dark .form-group textarea:focus{border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa33}.form-group textarea{resize:none;min-height:12rem}.submit-button{display:flex;align-items:center;justify-content:center;gap:.5rem;background:#2563eb;color:#fff;padding:.75rem 1.5rem;border:none;border-radius:.375rem;font-weight:500;cursor:pointer;transition:all .2s}.submit-button:hover:not(:disabled){background:#1d4ed8}.dark .submit-button{background:#3b82f6}.dark .submit-button:hover:not(:disabled){background:#2563eb}.submit-button:focus{outline:none;box-shadow:0 0 0 3px #3b82f680}.submit-button:disabled{opacity:.5;cursor:not-allowed}.send-icon{width:1rem;height:1rem}.contact-container.success-container{min-height:100dvh;display:flex;align-items:center;justify-content:center}.success-content{background:#fff;padding:2rem;border-radius:.75rem;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;max-width:20rem;width:100%;margin:auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.dark .success-content{background:#374151}.success-icon{width:4rem;height:4rem;color:#10b981;margin-bottom:1rem}.success-content h2{font-size:1.5rem;font-weight:700;color:#1f2937;margin:0 0 .5rem}.dark .success-content h2{color:#f9fafb}.success-content p{color:#6b7280;margin:0}.dark .success-content p{color:#d1d5db}.hidden-iframe{display:none}@media (max-width: 640px){.contact-container,.contact-container.success-container{padding:1rem}.success-content{padding:1.25rem}.form-content{padding:1.5rem;margin:.5rem 0}.form-header h2{font-size:1.25rem}.form-row{flex-direction:column;gap:1rem}.form-group textarea{min-height:10rem}.success-container{padding:1rem;min-height:100dvh;align-items:center}}@media (max-height: 800px){.contact-container,.contact-container.success-container{align-items:center;padding:1.5rem 1rem}.form-group textarea{min-height:8rem}}@media (max-height: 600px){.contact-container{padding:1rem}.form-content{padding:1.25rem}.form-header{margin-bottom:1rem}.contact-form{gap:1rem}}
