Add content: 1U/2U/4U pricing, green energy, tech specs
- Replace half-rack with 1U/2U/4U device slots + full rack quote - Add green energy section (100% wind & solar power) - Add technical specs summary on main page - Update connectivity: default 1 Gbit/s, up to 100 Gbit/s - Add environment/sustainability section to datacenter page Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
168
style.css
168
style.css
@@ -681,6 +681,174 @@ a:hover {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* === Services CTA === */
|
||||
.services-cta {
|
||||
text-align: center;
|
||||
margin-top: 32px;
|
||||
padding: 20px;
|
||||
background: var(--color-bg-card);
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--radius);
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.services-cta a {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* === Green Energy === */
|
||||
.section-green {
|
||||
background: linear-gradient(135deg, var(--color-bg) 0%, #0a2418 50%, var(--color-bg) 100%);
|
||||
}
|
||||
|
||||
.green-energy {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.green-energy-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.green-badge {
|
||||
display: inline-block;
|
||||
background: rgba(0, 212, 170, 0.15);
|
||||
color: var(--color-accent);
|
||||
font-size: 0.85rem;
|
||||
font-weight: 700;
|
||||
padding: 6px 18px;
|
||||
border-radius: 20px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid rgba(0, 212, 170, 0.3);
|
||||
}
|
||||
|
||||
.green-energy h2 {
|
||||
font-size: 2.2rem;
|
||||
font-weight: 800;
|
||||
color: var(--color-text-heading);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.green-energy p {
|
||||
color: var(--color-text-muted);
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.7;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.green-stats {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 40px;
|
||||
margin-top: 32px;
|
||||
}
|
||||
|
||||
.green-stat {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
color: var(--color-accent);
|
||||
font-weight: 600;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.green-stat svg {
|
||||
color: var(--color-accent);
|
||||
}
|
||||
|
||||
/* === Tech Grid === */
|
||||
.tech-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.tech-card {
|
||||
background: var(--color-bg-card);
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--radius);
|
||||
padding: 28px 24px;
|
||||
}
|
||||
|
||||
.tech-card h4 {
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
color: var(--color-text-heading);
|
||||
margin-bottom: 16px;
|
||||
padding-bottom: 12px;
|
||||
border-bottom: 2px solid var(--color-primary);
|
||||
}
|
||||
|
||||
.tech-card ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.tech-card li {
|
||||
padding: 5px 0;
|
||||
font-size: 0.9rem;
|
||||
color: var(--color-text-muted);
|
||||
position: relative;
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
.tech-card li::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 12px;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: var(--color-primary-light);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/* === Pricing 4-column === */
|
||||
.pricing-grid-4 {
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
}
|
||||
|
||||
.pricing-custom {
|
||||
border-style: dashed;
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.price-amount-custom {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
color: var(--color-primary-light);
|
||||
display: block;
|
||||
margin: 12px 0 8px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.tech-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
.pricing-grid-4 {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.tech-grid,
|
||||
.pricing-grid-4 {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.green-stats {
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.green-energy h2 {
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* === Konesali Page === */
|
||||
.page-hero {
|
||||
padding: 140px 0 60px;
|
||||
|
||||
Reference in New Issue
Block a user