.fqf-container,
.fqf-container * {
box-sizing: border-box;
}
.fqf-container {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
font-family: 'Source Sans Pro', sans-serif;
}
.fqf-container .fqf-form-card {
background: #ffffff;
border-radius: 24px;
padding: 25px 40px;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
position: relative;
width: 100%;
max-width: 100%;
margin: 0 auto;
}
.fqf-container .fqf-form-card h2 {
font-size: 41px;
font-weight: 700;
color: #2d3748;
text-align: center;
margin-bottom: 50px;
letter-spacing: -0.5px;
margin-top: 0;
line-height: 1.2em;
font-family: 'Source Sans Pro', sans-serif;
}
.fqf-container .fqf-input-group {
position: relative;
margin-bottom: 24px;
padding: 0;
}
.fqf-container .fqf-input-icon {
position: absolute;
left: 0px;
top: 43%;
transform: translateY(-50%);
color: #4a5568;
width: 22px;
height: 22px;
pointer-events: none;
z-index: 10;
display: flex;
align-items: center;
justify-content: center;
}
.fqf-container .fqf-input-group input,
.fqf-container .fqf-input-group select,
.fqf-container .fqf-input-group textarea {
width: 100%;
padding: 0px 20px 5px 35px !important;
border: none;
border-bottom: 2px solid #e2e8f0;
background: transparent;
border-radius: 0;
font-size: 1rem;
transition: all 0.3s ease;
outline: none;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
box-shadow: none;
margin: 0;
height: auto;
min-height: unset;
}
.fqf-container .fqf-input-group input,
.fqf-container .fqf-input-group textarea {
color: #2d3748;
}
.fqf-container .fqf-input-group textarea {
min-height: 100px;
resize: vertical;
}
.fqf-container .fqf-input-group select {
background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%234a5568' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 20px center;
cursor: pointer;
}
.fqf-container .fqf-input-group input::placeholder,
.fqf-container .fqf-input-group textarea::placeholder {
color: #a0aec0;
}
.fqf-container .fqf-input-group select {
color: #2d3748 !important;
}
.fqf-container .fqf-input-group select:has(option[value=""]:checked) {
color: #a0aec0 !important;
}
.fqf-container .fqf-input-group select option {
color: #2d3748 !important;
}
.fqf-container .fqf-input-group input:hover,
.fqf-container .fqf-input-group select:hover,
.fqf-container .fqf-input-group textarea:hover {
border-bottom-color: #cbd5e0;
}
.fqf-container .fqf-submit-btn {
width: 100%;
padding: 10px 32px;
background: linear-gradient(135deg, #6366F1 0%, #7c3aed 100%);
color: white;
border: none;
border-radius: 50px;
font-size: 1.25rem;
font-weight: 600;
cursor: pointer;
margin-top: 16px;
margin-bottom: 20px;
transition: all 0.3s ease;
box-shadow: 0 10px 30px rgba(99, 102, 241, 0.3);
display: block;
text-transform: none;
}
.fqf-container .fqf-submit-btn:hover {
transform: translateY(-2px);
box-shadow: 0 15px 40px rgba(99, 102, 241, 0.4);
}
.fqf-container .fqf-submit-btn:active {
transform: translateY(0);
}
.fqf-container .fqf-privacy-text {
text-align: center;
font-size: 0.95rem;
color: #4a5568;
font-style: italic;
margin: 0;
}
.fqf-container .fqf-privacy-link {
color: #6366F1;
text-decoration: none;
font-weight: 500;
transition: color 0.3s ease;
}
.fqf-container .fqf-privacy-link:hover {
color: #7c3aed;
text-decoration: underline;
}
.fqf-container .fqf-arrow-decoration {
position: absolute;
bottom: 70px;
left: -40px;
opacity: 0.9;
pointer-events: none;
animation: fqfArrowBounce 2s ease-in-out infinite;
z-index: 5;
}
.fqf-container .fqf-arrow-decoration svg {
height: auto;
width: 60px;
display: block;
}
@keyframes fqfArrowBounce {
0%,
100% {
transform: translateY(0);
}
50% {
transform: translateY(-15px);
}
}
.fqf-container .fqf-message {
margin-top: 20px;
text-align: center;
padding: 10px;
border-radius: 8px;
display: none;
}
.fqf-container .fqf-message.success {
background: #f0fdf4;
color: #166534;
display: block;
}
.fqf-container .fqf-message.error {
background: #fef2f2;
color: #991b1b;
display: block;
}
@media (max-width: 1080px) {
.fqf-container .fqf-arrow-decoration {
display: none;
}
}
@media (max-width: 768px) {
.fqf-container .fqf-form-card {
padding: 40px 30px;
}
.fqf-container .fqf-form-card h2 {
margin-bottom: 40px;
font-size: 36px;
}
.fqf-container .fqf-arrow-decoration {
left: -20px;
bottom: 120px;
transform: scale(0.6);
}
}
@media (max-width: 480px) {
.fqf-container .fqf-form-card {
padding: 30px 20px;
}
.fqf-container .fqf-arrow-decoration {
left: -10px;
bottom: 100px;
transform: scale(0.5);
}
}