@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";
*{box-sizing:border-box;margin:0;padding:0}body{color:#0f172a;background-color:#f8fafc;flex-direction:column;align-items:center;min-height:100vh;font-family:Outfit,sans-serif;line-height:1.6;display:flex;overflow-x:hidden}.bg-blob{z-index:-1;filter:blur(80px);background:radial-gradient(circle,#4f46e50d 0%,#4f46e500 70%);border-radius:50%;width:600px;height:600px;animation:25s infinite alternate blob-float;position:fixed}.bg-blob.blob-1{top:-150px;left:-150px}.bg-blob.blob-2{background:radial-gradient(circle,#10b9810d 0%,#10b98100 70%);animation-delay:-7s;bottom:-150px;right:-150px}@keyframes blob-float{0%{transform:translate(0)scale(1)}50%{transform:translate(60px,80px)scale(1.1)}to{transform:translate(-40px,40px)scale(.9)}}.container{width:100%;max-width:1200px;padding:60px 24px}@media (max-width:640px){.container{padding:30px 16px}}header{justify-content:space-between;align-items:center;gap:20px;width:100%;margin-bottom:50px;display:flex}@media (max-width:768px){header{flex-direction:column;align-items:flex-start}}header>div:first-child{text-align:left}header h1{letter-spacing:-.02em;-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#4f46e5,#818cf8);-webkit-background-clip:text;margin-bottom:8px;font-size:2.8rem;font-weight:800}@media (max-width:640px){header h1{font-size:2.2rem}}header p{color:#64748b;font-size:1.1rem;font-weight:400}@media (max-width:640px){header p{font-size:1rem}}header .btn-clients-list{color:#0f172a;cursor:pointer;white-space:nowrap;background:#fff;border:1px solid #e2e8f0;border-radius:14px;align-items:center;gap:12px;padding:14px 24px;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 1px 3px #0000001a}@media (max-width:768px){header .btn-clients-list{justify-content:center;width:100%}}header .btn-clients-list i{color:#4f46e5;font-size:1.1rem}header .btn-clients-list:hover{background:#fdfdfd;border-color:#4f46e5;transform:translateY(-2px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.forms-grid{grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:24px;display:grid}@media (max-width:768px){.forms-grid{grid-template-columns:1fr}}.mail-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;flex-direction:column;padding:32px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.mail-card:hover{border-color:#4f46e566;transform:translateY(-6px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.mail-card .card-header{align-items:center;gap:16px;margin-bottom:20px;display:flex}.mail-card .card-header .icon{color:#4f46e5;background:#4f46e514;border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.3rem;display:flex}.mail-card .card-header h2{color:#0f172a;letter-spacing:-.01em;font-size:1.4rem;font-weight:700}.mail-card p{color:#64748b;margin-bottom:24px;font-size:.95rem;line-height:1.5}form{flex-direction:column;flex:1;gap:18px;display:flex}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:#0f172a;text-transform:uppercase;letter-spacing:.05em;font-size:.85rem;font-weight:600}.form-group input,.form-group textarea{color:#0f172a;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;width:100%;padding:12px 16px;font-family:inherit;font-size:1rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.form-group input:focus,.form-group textarea:focus{background:#fff;border-color:#4f46e5;outline:none;box-shadow:0 0 0 4px #4f46e51a}.form-group input::placeholder,.form-group textarea::placeholder{color:#94a3b8}.form-group textarea{resize:vertical;min-height:120px}.form-group .btn-picker{color:#64748b;cursor:pointer;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:10px;justify-content:center;align-items:center;width:46px;height:46px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.form-group .btn-picker:hover{color:#fff;background:#4f46e5;border-color:#4f46e5}.btn-send{color:#fff;cursor:pointer;background:#4f46e5;border:none;border-radius:12px;justify-content:center;align-items:center;gap:12px;margin-top:auto;padding:14px 20px;font-size:1rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 4px 6px #4f46e533}.btn-send:hover:not(:disabled){background:#3730a3;transform:translateY(-2px);box-shadow:0 10px 15px #4f46e54d}.btn-send:disabled{opacity:.6;cursor:not-allowed}.file-upload .file-label{cursor:pointer;color:#64748b;border:2px dashed #e2e8f0;border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:12px;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.file-upload .file-label:hover{color:#4f46e5;background:#4f46e505;border-color:#4f46e5}.file-upload input[type=file]{display:none}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:2000;opacity:0;pointer-events:none;background:#0f172a66;justify-content:center;align-items:center;padding:24px;transition:all .3s;display:flex;position:fixed;inset:0}.modal-overlay.show{opacity:1;pointer-events:auto}.modal-content{background:#fff;border-radius:24px;flex-direction:column;width:100%;max-width:900px;max-height:90vh;transition:all .3s;display:flex;overflow:hidden;transform:scale(.95);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}@media (max-width:640px){.modal-content{border-radius:0;height:100vh;max-height:100vh}}.modal-overlay.show .modal-content{transform:scale(1)}.modal-content .modal-header{border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;padding:24px 32px;display:flex}.modal-content .modal-header h3{color:#0f172a;font-weight:700}.modal-content .modal-header .close-modal{color:#64748b;cursor:pointer;background:0 0;border:none;font-size:1.5rem}.modal-content .modal-header .close-modal:hover{color:#0f172a;transition:all .3s;transform:rotate(90deg)}.modal-content .modal-body{background:#f1f5f9;padding:0;overflow-y:auto}.modal-content .modal-body .preview-info{background:#fff;border-bottom:2px solid #e2e8f0;flex-direction:column;gap:10px;padding:24px 32px;display:flex}.modal-content .modal-body .preview-info .preview-row{gap:15px;font-size:.95rem;display:flex}.modal-content .modal-body .preview-info .preview-row span{color:#64748b;min-width:100px;font-weight:500}.modal-content .modal-body .preview-info .preview-row strong{color:#0f172a}.modal-content .modal-body .mail-render-container{justify-content:center;padding:40px;display:flex}.modal-content .modal-body .client-table-container{background:#fff;padding:24px;overflow-x:auto}@media (max-width:640px){.modal-content .modal-body .client-table-container{padding:16px}}.modal-content .modal-body .client-table{border-collapse:separate;border-spacing:0;width:100%}.modal-content .modal-body .client-table th{text-align:left;color:#64748b;text-transform:uppercase;background:#f8fafc;border-bottom:1px solid #e2e8f0;padding:16px;font-size:.8rem;font-weight:600}.modal-content .modal-body .client-table td{color:#0f172a;border-bottom:1px solid #f1f5f9;padding:16px}.modal-content .modal-body .client-table tr:hover td{background:#f8fafc}.modal-content .modal-footer{border-top:1px solid #e2e8f0;justify-content:flex-end;gap:16px;padding:24px 32px;display:flex}.modal-content .modal-footer .btn-cancel{cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px 24px;font-weight:600}.modal-content .modal-footer .btn-cancel:hover{background:#f8fafc}.modal-content .modal-footer .btn-confirm{color:#fff;cursor:pointer;background:#4f46e5;border:none;border-radius:12px;padding:12px 28px;font-weight:600}.modal-content .modal-footer .btn-confirm:hover{background:#3730a3}.toast{color:#fff;z-index:3000;background:#0f172a;border-radius:50px;align-items:center;gap:12px;padding:16px 32px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;position:fixed;bottom:30px;left:50%;transform:translate(-50%)translateY(100px);box-shadow:0 10px 15px -3px #0003}.toast.show{transform:translate(-50%)translateY(0)}.toast.error{background:#ef4444}.toast.success{background:#0f172a}footer{text-align:center;color:#64748b;padding:60px 0;font-size:.95rem}