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