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:
2026-03-09 14:47:41 +02:00
parent 1ae342c1f5
commit 0333611037
3 changed files with 399 additions and 58 deletions

168
style.css
View File

@@ -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;