diff --git a/backend/app.py b/backend/app.py
index 8dc48fa..d012d8e 100644
--- a/backend/app.py
+++ b/backend/app.py
@@ -72,7 +72,7 @@ class SecurityHeadersMiddleware(BaseHTTPMiddleware):
"connect-src 'self' https://cdn.jsdelivr.net https://*.tile.openstreetmap.org https://unpkg.com https://www.google-analytics.com https://analytics.google.com https://*.google-analytics.com; "
"frame-ancestors 'none'; "
"base-uri 'self'; "
- "form-action 'self';"
+ "form-action 'self' https://formsubmit.co;"
)
# HSTS (only enable if using HTTPS in production)
diff --git a/frontend/index.html b/frontend/index.html
index 8550644..ff68409 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -346,8 +346,26 @@
diff --git a/frontend/styles.css b/frontend/styles.css
index 25b2207..3f56551 100644
--- a/frontend/styles.css
+++ b/frontend/styles.css
@@ -1197,14 +1197,82 @@ body {
/* Footer */
.footer {
- text-align: center;
- padding: 2rem;
margin-top: 3rem;
border-top: 1px solid var(--border-color);
color: var(--text-muted);
font-size: 0.85rem;
}
+.footer-content {
+ max-width: 600px;
+ margin: 0 auto;
+ padding: 2rem;
+}
+
+.footer-contact {
+ margin-bottom: 2rem;
+}
+
+.footer-contact h3 {
+ font-family: 'Playfair Display', serif;
+ font-size: 1.25rem;
+ color: var(--text-primary);
+ margin-bottom: 0.5rem;
+}
+
+.footer-contact > p {
+ color: var(--text-muted);
+ margin-bottom: 1rem;
+}
+
+.contact-form {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.contact-form .form-row {
+ display: flex;
+ gap: 0.75rem;
+}
+
+.contact-form .form-input {
+ flex: 1;
+ padding: 0.75rem 1rem;
+ font-family: inherit;
+ font-size: 0.9rem;
+ border: 1px solid var(--border-color);
+ border-radius: var(--radius-md);
+ background: var(--bg-card);
+ color: var(--text-primary);
+ transition: var(--transition);
+}
+
+.contact-form .form-input:focus {
+ outline: none;
+ border-color: var(--accent-teal);
+ box-shadow: 0 0 0 3px rgba(45, 106, 100, 0.1);
+}
+
+.contact-form .form-input::placeholder {
+ color: var(--text-muted);
+}
+
+.contact-form .form-textarea {
+ min-height: 100px;
+ resize: vertical;
+}
+
+.contact-form .btn {
+ align-self: flex-start;
+}
+
+.footer-source {
+ text-align: center;
+ padding-top: 1.5rem;
+ border-top: 1px solid var(--border-color);
+}
+
.footer a {
color: var(--accent-teal);
text-decoration: none;
@@ -1214,9 +1282,14 @@ body {
text-decoration: underline;
}
-.footer-note {
- margin-top: 0.5rem;
- font-size: 0.75rem;
+@media (max-width: 768px) {
+ .contact-form .form-row {
+ flex-direction: column;
+ }
+
+ .contact-form .btn {
+ align-self: stretch;
+ }
}
/* Loading State */