Add soft match for postcodes 20100/20360, split section headers

- Show green 'todennäköisesti saatavuus' for postcodes 20100 and 20360
  even when no exact address match found
- Split section into 'Saatavuuskysely' and 'Yhteydenotto' headers

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

index.html

@@ -225,9 +225,9 @@
     <div class="container">
         <div class="availability-inner">
             <div class="availability-text">
-                <span class="overline">Saatavuuskysely & yhteydenotto</span>
+                <span class="overline">Saatavuuskysely</span>
-                <h2>Ota yhteyttä tai tarkista saatavuus</h2>
+                <h2>Tarkista saatavuus</h2>
-                <p>Tarkista heti onko kuituliittymä saatavilla osoitteessasi, tai täytä lomake niin otamme yhteyttä 1–2 arkipäivässä.</p>
+                <p>Tarkista heti onko kuituliittymä saatavilla osoitteessasi.</p>
 
                 <div class="availability-check">
                     <h3>Pikasaatavuustarkistus</h3>
@@ -242,6 +242,11 @@
                     <div id="check-result" class="check-result" style="display:none;"></div>
                 </div>
             </div>
+            <div class="availability-form-header">
+                <span class="overline">Yhteydenotto</span>
+                <h2>Ota yhteyttä</h2>
+                <p>Täytä lomake niin otamme yhteyttä 1–2 arkipäivässä.</p>
+            </div>
             <form class="form" id="availability-form">
                 <div style="position:absolute;left:-9999px;top:-9999px;">
                     <input type="text" name="website" tabindex="-1" autocomplete="off">
@@ -352,6 +357,9 @@ document.querySelector('.nav-toggle')?.addEventListener('click', function() {
             if (data.saatavilla) {
                 checkResult.className = 'check-result ok';
                 checkResult.innerHTML = '<h4>Kuituliittymä on saatavilla osoitteessasi!</h4><p>Täytä vieressä oleva lomake niin otamme yhteyttä ja kerromme lisää.</p>';
+            } else if (['20100', '20360'].indexOf(postinumero) !== -1) {
+                checkResult.className = 'check-result ok';
+                checkResult.innerHTML = '<h4>Kohteeseen on todennäköisesti saatavuus!</h4><p>Alueellasi on kuituyhteys saatavilla. Täytä lomake niin tarkistamme tarkan saatavuuden ja otamme yhteyttä.</p>';
             } else {
                 checkResult.className = 'check-result nok';
                 checkResult.innerHTML = '<h4>Ei saatavuutta vielä</h4><p>Kuituliittymää ei löytynyt osoitteellasi, mutta verkkomme laajenee jatkuvasti. Täytä lomake niin kerromme kun kuitu tulee saataville!</p>';

style.css

@@ -512,6 +512,23 @@ img {
     line-height: 1.8;
 }
 
+.availability-form-header {
+    margin-bottom: 24px;
+}
+
+.availability-form-header h2 {
+    font-size: 1.6rem;
+    font-weight: 700;
+    color: var(--dark);
+    margin-bottom: 8px;
+}
+
+.availability-form-header p {
+    color: var(--text-light);
+    font-size: 0.95rem;
+    line-height: 1.6;
+}
+
 .form {
     background: var(--bg);
     border: 1px solid var(--border);