V2
This commit is contained in:
@ -12,7 +12,7 @@ html {
|
||||
body {
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
line-height: 1.6;
|
||||
color: #333;
|
||||
color: #1f2937;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
@ -35,7 +35,7 @@ h3 { font-size: 1.5rem; }
|
||||
|
||||
p {
|
||||
margin-bottom: 1rem;
|
||||
color: #666;
|
||||
color: #4b5563;
|
||||
}
|
||||
|
||||
/* Navigation */
|
||||
@ -57,7 +57,7 @@ p {
|
||||
}
|
||||
|
||||
.nav-logo h1 {
|
||||
color: #2563eb;
|
||||
color: #059669;
|
||||
font-size: 1.8rem;
|
||||
margin: 0;
|
||||
}
|
||||
@ -75,19 +75,19 @@ p {
|
||||
|
||||
.nav-links a {
|
||||
text-decoration: none;
|
||||
color: #666;
|
||||
color: #4b5563;
|
||||
font-weight: 500;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.nav-links a:hover,
|
||||
.nav-links a.active {
|
||||
color: #2563eb;
|
||||
color: #059669;
|
||||
}
|
||||
|
||||
/* Hero Section */
|
||||
.hero {
|
||||
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
|
||||
background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
|
||||
padding: 4rem 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -106,13 +106,13 @@ p {
|
||||
|
||||
.hero-content h2 {
|
||||
font-size: 3rem;
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.hero-subtitle {
|
||||
font-size: 1.25rem;
|
||||
color: #64748b;
|
||||
color: #374151;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
@ -146,23 +146,23 @@ p {
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #2563eb;
|
||||
background: #059669;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: #1d4ed8;
|
||||
background: #047857;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: transparent;
|
||||
color: #2563eb;
|
||||
border-color: #2563eb;
|
||||
color: #059669;
|
||||
border-color: #059669;
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: #2563eb;
|
||||
background: #059669;
|
||||
color: white;
|
||||
}
|
||||
|
||||
@ -180,7 +180,7 @@ p {
|
||||
.benefits h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
}
|
||||
|
||||
.benefits-grid {
|
||||
@ -190,16 +190,18 @@ p {
|
||||
}
|
||||
|
||||
.benefit-card {
|
||||
background: #f8fafc;
|
||||
background: #f0fdf4;
|
||||
padding: 2rem;
|
||||
border-radius: 12px;
|
||||
text-align: center;
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
border: 1px solid #bbf7d0;
|
||||
}
|
||||
|
||||
.benefit-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
|
||||
box-shadow: 0 10px 30px rgba(5, 150, 105, 0.15);
|
||||
border-color: #34d399;
|
||||
}
|
||||
|
||||
.benefit-icon {
|
||||
@ -208,20 +210,20 @@ p {
|
||||
}
|
||||
|
||||
.benefit-card h3 {
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Windows EOL Section */
|
||||
.windows-eol {
|
||||
padding: 5rem 0;
|
||||
background: #fef2f2;
|
||||
background: #fffbeb;
|
||||
}
|
||||
|
||||
.windows-eol h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
color: #dc2626;
|
||||
color: #d97706;
|
||||
}
|
||||
|
||||
.eol-content {
|
||||
@ -266,7 +268,7 @@ p {
|
||||
|
||||
.stat h3 {
|
||||
font-size: 2rem;
|
||||
color: #dc2626;
|
||||
color: #d97706;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
@ -279,7 +281,7 @@ p {
|
||||
.services h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
}
|
||||
|
||||
.services-grid {
|
||||
@ -289,10 +291,10 @@ p {
|
||||
}
|
||||
|
||||
.service-card {
|
||||
background: #f1f5f9;
|
||||
background: #f0fdf4;
|
||||
padding: 2rem;
|
||||
border-radius: 12px;
|
||||
border-left: 4px solid #2563eb;
|
||||
border-left: 4px solid #059669;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
@ -301,14 +303,14 @@ p {
|
||||
}
|
||||
|
||||
.service-card h3 {
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* CTA Section */
|
||||
.cta {
|
||||
padding: 5rem 0;
|
||||
background: #2563eb;
|
||||
background: linear-gradient(135deg, #059669 0%, #047857 100%);
|
||||
color: white;
|
||||
text-align: center;
|
||||
}
|
||||
@ -319,20 +321,20 @@ p {
|
||||
}
|
||||
|
||||
.cta p {
|
||||
color: #bfdbfe;
|
||||
color: #a7f3d0;
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
/* Contact Page Styles */
|
||||
.contact-hero {
|
||||
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
|
||||
background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
|
||||
padding: 3rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.contact-hero h1 {
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
@ -347,9 +349,10 @@ p {
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
background: #f8fafc;
|
||||
background: #f0fdf4;
|
||||
padding: 2rem;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #bbf7d0;
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
@ -366,11 +369,11 @@ p {
|
||||
|
||||
.contact-item h3 {
|
||||
margin-bottom: 0.5rem;
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
}
|
||||
|
||||
.contact-item a {
|
||||
color: #2563eb;
|
||||
color: #059669;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@ -385,7 +388,7 @@ p {
|
||||
}
|
||||
|
||||
.contact-hours h3 {
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
@ -423,8 +426,8 @@ p {
|
||||
.form-group select:focus,
|
||||
.form-group textarea:focus {
|
||||
outline: none;
|
||||
border-color: #2563eb;
|
||||
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
|
||||
border-color: #059669;
|
||||
box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.1);
|
||||
}
|
||||
|
||||
.form-group textarea {
|
||||
@ -434,13 +437,13 @@ p {
|
||||
|
||||
.contact-cta {
|
||||
padding: 4rem 0;
|
||||
background: #f8fafc;
|
||||
background: #f0fdf4;
|
||||
}
|
||||
|
||||
.contact-cta h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
}
|
||||
|
||||
.cta-benefits {
|
||||
@ -463,14 +466,14 @@ p {
|
||||
}
|
||||
|
||||
.cta-benefit h3 {
|
||||
color: #1e293b;
|
||||
color: #047857;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
footer {
|
||||
background: #1e293b;
|
||||
color: #94a3b8;
|
||||
background: #374151;
|
||||
color: #9ca3af;
|
||||
padding: 3rem 0 1rem;
|
||||
}
|
||||
|
||||
@ -487,19 +490,19 @@ footer {
|
||||
}
|
||||
|
||||
.footer-section a {
|
||||
color: #94a3b8;
|
||||
color: #9ca3af;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-section a:hover {
|
||||
color: #2563eb;
|
||||
color: #10b981;
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
text-align: center;
|
||||
padding-top: 2rem;
|
||||
border-top: 1px solid #334155;
|
||||
color: #64748b;
|
||||
border-top: 1px solid #4b5563;
|
||||
color: #6b7280;
|
||||
}
|
||||
|
||||
/* Responsive Design */
|
||||
|
||||
Reference in New Issue
Block a user