Add Yhteydet (Connectivity) page with pricing and VPN services

New page: yhteydet.html with connection packages (1G-100G),
redundant port options, site-to-site VPN tiers (IPsec/MPLS),
and carrier-neutral peering info. Navigation updated on all pages.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-09 18:57:31 +02:00
parent 440670e830
commit 165bce6f69
3 changed files with 479 additions and 4 deletions

View File

@@ -40,6 +40,7 @@
<a href="#palvelut">Palvelut</a> <a href="#palvelut">Palvelut</a>
<a href="#hinnat">Hinnat</a> <a href="#hinnat">Hinnat</a>
<a href="konesali.html">Konesali</a> <a href="konesali.html">Konesali</a>
<a href="yhteydet.html">Yhteydet</a>
<a href="#yhteystiedot">Yhteystiedot</a> <a href="#yhteystiedot">Yhteystiedot</a>
</nav> </nav>
<button class="nav-toggle" id="nav-toggle" aria-label="Avaa valikko"> <button class="nav-toggle" id="nav-toggle" aria-label="Avaa valikko">
@@ -964,6 +965,7 @@
<h4>Sivusto</h4> <h4>Sivusto</h4>
<a href="#palvelut">Palvelut</a> <a href="#palvelut">Palvelut</a>
<a href="konesali.html">Konesali</a> <a href="konesali.html">Konesali</a>
<a href="yhteydet.html">Yhteydet</a>
<a href="#hinnat">Hinnat</a> <a href="#hinnat">Hinnat</a>
<a href="#yhteystiedot">Yhteystiedot</a> <a href="#yhteystiedot">Yhteystiedot</a>
</div> </div>
@@ -972,7 +974,7 @@
<a href="#hinnat">1U Laitepaikka</a> <a href="#hinnat">1U Laitepaikka</a>
<a href="#hinnat">2U Laitepaikka</a> <a href="#hinnat">2U Laitepaikka</a>
<a href="#hinnat">4U Laitepaikka</a> <a href="#hinnat">4U Laitepaikka</a>
<a href="#hinnat">Kokokaappi</a> <a href="yhteydet.html">Yhteydet</a>
</div> </div>
</div> </div>
<div class="footer-bottom"> <div class="footer-bottom">

View File

@@ -33,8 +33,9 @@
</a> </a>
<nav class="nav" id="nav"> <nav class="nav" id="nav">
<a href="index.html#palvelut">Palvelut</a> <a href="index.html#palvelut">Palvelut</a>
<a href="konesali.html" class="active">Konesali</a>
<a href="index.html#hinnat">Hinnat</a> <a href="index.html#hinnat">Hinnat</a>
<a href="konesali.html" class="active">Konesali</a>
<a href="yhteydet.html">Yhteydet</a>
<a href="index.html#yhteystiedot">Yhteystiedot</a> <a href="index.html#yhteystiedot">Yhteystiedot</a>
</nav> </nav>
<button class="nav-toggle" id="nav-toggle" aria-label="Avaa valikko"> <button class="nav-toggle" id="nav-toggle" aria-label="Avaa valikko">
@@ -418,14 +419,15 @@
<h4>Sivusto</h4> <h4>Sivusto</h4>
<a href="index.html#palvelut">Palvelut</a> <a href="index.html#palvelut">Palvelut</a>
<a href="konesali.html">Konesali</a> <a href="konesali.html">Konesali</a>
<a href="yhteydet.html">Yhteydet</a>
<a href="index.html#hinnat">Hinnat</a> <a href="index.html#hinnat">Hinnat</a>
<a href="index.html#yhteystiedot">Yhteystiedot</a> <a href="index.html#yhteystiedot">Yhteystiedot</a>
</div> </div>
<div class="footer-links"> <div class="footer-links">
<h4>Palvelut</h4> <h4>Palvelut</h4>
<a href="index.html#hinnat">1U Laitepaikka</a> <a href="index.html#hinnat">1U Laitepaikka</a>
<a href="index.html#hinnat">Puolikaappi</a> <a href="index.html#hinnat">2U Laitepaikka</a>
<a href="index.html#hinnat">Kokokaappi</a> <a href="yhteydet.html">Yhteydet</a>
</div> </div>
</div> </div>
<div class="footer-bottom"> <div class="footer-bottom">

471
yhteydet.html Normal file
View File

@@ -0,0 +1,471 @@
<!DOCTYPE html>
<html lang="fi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Yhteydet & tietoliikenne | Konesali Turku</title>
<meta name="description" content="Nopeat ja varmennetut tietoliikenneyhteydet konesalista. 1G100G yhteydet, varmennetut portit, site-to-site VPN. Carrier-neutral.">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- Header -->
<header class="header" id="header">
<div class="container header-inner">
<a href="/" class="logo">
<svg class="logo-icon" viewBox="0 0 32 38" width="28" height="33" fill="none">
<path d="M12.5 5.5a5.5 5.5 0 017 0" stroke="#f07060" stroke-width="1.6" stroke-linecap="round"/>
<path d="M9.5 2.5a9.5 9.5 0 0113 0" stroke="#f07060" stroke-width="1.4" stroke-linecap="round" opacity="0.4"/>
<rect x="5" y="10" width="22" height="26" rx="3" stroke="currentColor" stroke-width="1.5"/>
<rect x="9" y="14" width="14" height="4.5" rx="1.5" stroke="currentColor" stroke-width="0.8" fill="currentColor" fill-opacity="0.06"/>
<rect x="9" y="21" width="14" height="4.5" rx="1.5" stroke="currentColor" stroke-width="0.8" fill="currentColor" fill-opacity="0.06"/>
<rect x="9" y="28" width="14" height="4.5" rx="1.5" stroke="currentColor" stroke-width="0.8" fill="currentColor" fill-opacity="0.06"/>
<circle cx="12.5" cy="16.25" r="1.4" fill="#f07060"/>
<circle cx="12.5" cy="23.25" r="1.4" fill="#f07060"/>
<circle cx="12.5" cy="30.25" r="1.4" fill="#f07060"/>
<line x1="17" y1="16.25" x2="21" y2="16.25" stroke="currentColor" stroke-width="0.8" opacity="0.3"/>
<line x1="17" y1="23.25" x2="21" y2="23.25" stroke="currentColor" stroke-width="0.8" opacity="0.3"/>
<line x1="17" y1="30.25" x2="21" y2="30.25" stroke="currentColor" stroke-width="0.8" opacity="0.3"/>
</svg>
<span>Konesali<strong>Turku</strong></span>
</a>
<nav class="nav" id="nav">
<a href="index.html#palvelut">Palvelut</a>
<a href="index.html#hinnat">Hinnat</a>
<a href="konesali.html">Konesali</a>
<a href="yhteydet.html" class="active">Yhteydet</a>
<a href="index.html#yhteystiedot">Yhteystiedot</a>
</nav>
<button class="nav-toggle" id="nav-toggle" aria-label="Avaa valikko">
<span></span>
<span></span>
<span></span>
</button>
</div>
</header>
<!-- Page Hero -->
<section class="page-hero">
<div class="container">
<h1>Yhteydet &amp; tietoliikenne</h1>
<p>Nopeat ja varmennetut yhteydet konesalistamme. Carrier-neutral &mdash; valitse itsellesi paras operaattori.</p>
</div>
</section>
<!-- Yhteyspaketit -->
<section class="section" id="yhteyspaketit">
<div class="container">
<h2 class="section-title">Yhteyspaketit</h2>
<p class="section-subtitle">Rajoittamaton liikenne ja IPv4 + IPv6 kaikissa paketeissa. Hinnat alv 0%.</p>
<div class="pricing-grid pricing-grid-4">
<div class="pricing-card fade-in">
<div class="pricing-header">
<h3>1 Gbit/s</h3>
<div class="price">
<span class="price-amount">Sis.</span>
<span class="price-period">hintaan</span>
</div>
</div>
<ul class="pricing-features">
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Jaettu 1 Gbit/s portti
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Rajoittamaton liikenne
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
1x IPv4 + /64 IPv6
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
RJ45 / SFP
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Sisältyy laitepaikkaan
</li>
</ul>
<a href="index.html#hinnat" class="btn btn-outline">Katso laitepaikat</a>
</div>
<div class="pricing-card pricing-featured fade-in">
<div class="pricing-badge">Suosituin</div>
<div class="pricing-header">
<h3>1 Gbit/s Dedicated</h3>
<div class="price">
<span class="price-amount">&euro;99</span>
<span class="price-period">/kk</span>
</div>
</div>
<ul class="pricing-features">
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Oma dedikoitu 1G portti
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Rajoittamaton liikenne
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
1x IPv4 + /48 IPv6
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
SFP / SFP+
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Taattu kaistanleveys
</li>
</ul>
<a href="index.html#yhteystiedot" class="btn btn-primary">Tilaa yhteys</a>
</div>
<div class="pricing-card fade-in">
<div class="pricing-header">
<h3>10 Gbit/s</h3>
<div class="price">
<span class="price-amount">&euro;299</span>
<span class="price-period">/kk</span>
</div>
</div>
<ul class="pricing-features">
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Dedikoitu 10G portti
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Rajoittamaton liikenne
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
/29 IPv4 + /48 IPv6
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
SFP+ / DAC
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
BGP-reititys saatavilla
</li>
</ul>
<a href="index.html#yhteystiedot" class="btn btn-outline">Tilaa yhteys</a>
</div>
<div class="pricing-card pricing-custom fade-in">
<div class="pricing-header">
<h3>100 Gbit/s</h3>
<div class="price">
<span class="price-amount">Räätälöity</span>
</div>
</div>
<ul class="pricing-features">
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Dedikoitu 100G portti
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Rajoittamaton liikenne
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Oma IP-avaruus
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
QSFP28
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Oma AS-numero + BGP
</li>
</ul>
<a href="index.html#yhteystiedot" class="btn btn-outline">Ota yhteyttä</a>
</div>
</div>
<p class="pricing-note">Lisä-IP-osoitteet: &euro;3/kk per IPv4. BGP-reititys: &euro;49/kk. Kaikki hinnat alv 0%.</p>
</div>
</section>
<!-- Varmennetut yhteydet -->
<section class="section section-alt" id="varmennettu">
<div class="container">
<div class="spec-section">
<div class="spec-section-header">
<div class="spec-section-icon">
<svg viewBox="0 0 48 48" width="40" height="40" fill="none" stroke="currentColor" stroke-width="1.5">
<path d="M24 4L6 10v12c0 11.1 7.8 21.5 18 24 10.2-2.5 18-12.9 18-24V10L24 4z"/>
<path d="M16 24l5 5 11-11"/>
</svg>
</div>
<div>
<h2>Varmennetut yhteydet</h2>
<p>Kahdennettu yhteys eri operaattoreilta &mdash; automaattinen failover vikatilanteessa</p>
</div>
</div>
<div class="spec-table">
<table>
<tbody>
<tr>
<td class="spec-label">Toimintaperiaate</td>
<td>Kaksi erillistä uplink-yhteyttä eri operaattoreilta, aktiivinen monitorointi ja automaattinen failover. Vikatilanteessa yhteys siirtyy varayhteydelle sekunneissa.</td>
</tr>
<tr>
<td class="spec-label">Saatavilla</td>
<td>1 Gbit/s Dedicated, 10 Gbit/s</td>
</tr>
<tr>
<td class="spec-label">Hinnoittelu</td>
<td>+50% yhteyspaketin perushinnasta (esim. 1G Dedicated varmennettu: &euro;149/kk, 10G varmennettu: &euro;449/kk)</td>
</tr>
<tr>
<td class="spec-label">SLA</td>
<td>99,99% käytettävyys (varmennettu yhteys)</td>
</tr>
<tr>
<td class="spec-label">Failover-aika</td>
<td>&lt; 5 sekuntia (BGP convergence)</td>
</tr>
<tr>
<td class="spec-label">Monitorointi</td>
<td>24/7 reaaliaikainen yhteyden valvonta, automaattiset hälytykset</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
<!-- Site-to-Site VPN -->
<section class="section section-dark" id="vpn">
<div class="container">
<div class="spec-section">
<div class="spec-section-header">
<div class="spec-section-icon">
<svg viewBox="0 0 48 48" width="40" height="40" fill="none" stroke="currentColor" stroke-width="1.5">
<rect x="4" y="28" width="16" height="12" rx="2"/>
<rect x="28" y="28" width="16" height="12" rx="2"/>
<path d="M12 28v-6a12 12 0 0124 0v6"/>
<circle cx="24" cy="16" r="3"/>
<path d="M24 19v5"/>
</svg>
</div>
<div>
<h2>Site-to-Site VPN</h2>
<p>Turvallinen yhteys konesalin ja toimitilojesi väliin &mdash; kuin olisivat samassa verkossa</p>
</div>
</div>
</div>
<div class="pricing-grid" style="margin-top: 40px;">
<div class="pricing-card fade-in">
<div class="pricing-header">
<h3>IPsec VPN</h3>
<div class="price">
<span class="price-amount">&euro;49</span>
<span class="price-period">/kk</span>
</div>
</div>
<ul class="pricing-features">
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Max 100 Mbit/s
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
AES-256 salaus
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
1 tunneli
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Monitorointi 24/7
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Konfigurointiapu
</li>
</ul>
<a href="index.html#yhteystiedot" class="btn btn-outline">Tilaa VPN</a>
</div>
<div class="pricing-card pricing-featured fade-in">
<div class="pricing-badge">Suosituin</div>
<div class="pricing-header">
<h3>IPsec VPN Pro</h3>
<div class="price">
<span class="price-amount">&euro;99</span>
<span class="price-period">/kk</span>
</div>
</div>
<ul class="pricing-features">
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Max 1 Gbit/s
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
AES-256 salaus
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Useita tunneleita
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Monitorointi + hälytykset
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Failover-tuki
</li>
</ul>
<a href="index.html#yhteystiedot" class="btn btn-primary">Tilaa VPN</a>
</div>
<div class="pricing-card pricing-custom fade-in">
<div class="pricing-header">
<h3>Dedicated L2/MPLS</h3>
<div class="price">
<span class="price-amount">Räätälöity</span>
</div>
</div>
<ul class="pricing-features">
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Oma kuitu / operaattoriyhteys
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Layer 2 -yhteys
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Minimaalinen latenssi
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
Useita toimipaikkoja
</li>
<li>
<svg viewBox="0 0 20 20" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/></svg>
SLA-takuu
</li>
</ul>
<a href="index.html#yhteystiedot" class="btn btn-outline">Pyydä tarjous</a>
</div>
</div>
</div>
</section>
<!-- Operaattorit & peering -->
<section class="section" id="operaattorit">
<div class="container">
<h2 class="section-title">Operaattorit &amp; peering</h2>
<p class="section-subtitle">Carrier-neutral konesali &mdash; valitse itsellesi paras operaattori</p>
<div class="features-grid">
<div class="feature fade-in">
<div class="feature-icon">
<svg viewBox="0 0 48 48" width="40" height="40" fill="none" stroke="currentColor" stroke-width="1.5">
<circle cx="24" cy="24" r="18"/>
<path d="M6 24h36M24 6c-5 5.5-8 11.5-8 18s3 12.5 8 18c5-5.5 8-11.5 8-18s-3-12.5-8-18z"/>
</svg>
</div>
<h3>Carrier-neutral</h3>
<p>Useita operaattoreita saatavilla samassa laitetilassa. Et ole sidottu yhteen operaattoriin vaan voit kilpailuttaa ja valita parhaan vaihtoehdon.</p>
</div>
<div class="feature fade-in">
<div class="feature-icon">
<svg viewBox="0 0 48 48" width="40" height="40" fill="none" stroke="currentColor" stroke-width="1.5">
<path d="M8 24h8m16 0h8M24 8v8m0 16v8"/>
<circle cx="24" cy="24" r="6"/>
<circle cx="8" cy="24" r="3"/>
<circle cx="40" cy="24" r="3"/>
<circle cx="24" cy="8" r="3"/>
<circle cx="24" cy="40" r="3"/>
</svg>
</div>
<h3>BGP-reititys</h3>
<p>Oma AS-numero ja BGP-reititys mahdollinen. Hallinnoi omaa IP-avaruuttasi ja reititystäsi joustavasti usean operaattorin kautta.</p>
</div>
<div class="feature fade-in">
<div class="feature-icon">
<svg viewBox="0 0 48 48" width="40" height="40" fill="none" stroke="currentColor" stroke-width="1.5">
<path d="M4 36h40M12 36V20h8v16m4 0V12h8v24"/>
<path d="M6 12l6-6 6 6 6-6 6 6 6-6 6 6" stroke-dasharray="2 2" opacity="0.5"/>
</svg>
</div>
<h3>FICIX-peering</h3>
<p>Suorat yhteydet FICIX-solmupisteeseen (Finnish Internet Exchange). Pienemmät latenssit ja parempi suorituskyky kotimaiseen liikenteeseen.</p>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="section section-dark">
<div class="container" style="text-align: center;">
<h2 class="section-title">Tarvitsetko räätälöidyn yhteysratkaisun?</h2>
<p class="section-subtitle">Kerro tarpeistasi ja suunnittelemme yhdessä optimaalisen tietoliikenneratkaisun</p>
<div style="display: flex; gap: 16px; justify-content: center; flex-wrap: wrap;">
<a href="index.html#yhteystiedot" class="btn btn-primary">Ota yhteyttä</a>
<a href="index.html#hinnat" class="btn btn-secondary">Katso laitepaikat</a>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="container footer-inner">
<div class="footer-brand">
<a href="/" class="logo">
<svg class="logo-icon" viewBox="0 0 32 38" width="22" height="26" fill="none">
<path d="M12.5 5.5a5.5 5.5 0 017 0" stroke="#f07060" stroke-width="1.6" stroke-linecap="round"/>
<path d="M9.5 2.5a9.5 9.5 0 0113 0" stroke="#f07060" stroke-width="1.4" stroke-linecap="round" opacity="0.4"/>
<rect x="5" y="10" width="22" height="26" rx="3" stroke="currentColor" stroke-width="1.5"/>
<rect x="9" y="14" width="14" height="4.5" rx="1.5" stroke="currentColor" stroke-width="0.8" fill="currentColor" fill-opacity="0.06"/>
<rect x="9" y="21" width="14" height="4.5" rx="1.5" stroke="currentColor" stroke-width="0.8" fill="currentColor" fill-opacity="0.06"/>
<rect x="9" y="28" width="14" height="4.5" rx="1.5" stroke="currentColor" stroke-width="0.8" fill="currentColor" fill-opacity="0.06"/>
<circle cx="12.5" cy="16.25" r="1.4" fill="#f07060"/>
<circle cx="12.5" cy="23.25" r="1.4" fill="#f07060"/>
<circle cx="12.5" cy="30.25" r="1.4" fill="#f07060"/>
<line x1="17" y1="16.25" x2="21" y2="16.25" stroke="currentColor" stroke-width="0.8" opacity="0.3"/>
<line x1="17" y1="23.25" x2="21" y2="23.25" stroke="currentColor" stroke-width="0.8" opacity="0.3"/>
<line x1="17" y1="30.25" x2="21" y2="30.25" stroke="currentColor" stroke-width="0.8" opacity="0.3"/>
</svg>
<span>Konesali<strong>Turku</strong></span>
</a>
<p>Luotettavat konesalipalvelut Turussa.</p>
</div>
<div class="footer-links">
<h4>Sivusto</h4>
<a href="index.html#palvelut">Palvelut</a>
<a href="konesali.html">Konesali</a>
<a href="yhteydet.html">Yhteydet</a>
<a href="index.html#hinnat">Hinnat</a>
<a href="index.html#yhteystiedot">Yhteystiedot</a>
</div>
<div class="footer-links">
<h4>Palvelut</h4>
<a href="index.html#hinnat">1U Laitepaikka</a>
<a href="index.html#hinnat">2U Laitepaikka</a>
<a href="index.html#hinnat">4U Laitepaikka</a>
<a href="#yhteyspaketit">Yhteydet</a>
</div>
</div>
<div class="footer-bottom">
<div class="container">
<p>&copy; 2026 Konesali Turku. Kaikki oikeudet pidätetään.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>