From d0bea1dffd3a76c8526f0b201bc310461135789a Mon Sep 17 00:00:00 2001
From: Jukka Lampikoski <jukka@lampikoski.com>
Date: Tue, 10 Mar 2026 09:49:13 +0200
Subject: [PATCH] Vaihda kuukausihinnat vuosihinnoiksi ja nosta Mini 100 GB:hen
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Laskutus 12 kk kerrallaan: Mini 29€/v (100GB), Perus 69€/v,
Plus 119€/v, Pro 199€/v, Business 299€/v. Kuukausihinta
näkyy pienellä hinnan alla.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 index.html | 39 ++++++++++++++++++++++-----------------
 style.css  |  7 +++++++
 2 files changed, 29 insertions(+), 17 deletions(-)

diff --git a/index.html b/index.html
index a1aaf92..f1be971 100644
--- a/index.html
+++ b/index.html
@@ -44,17 +44,18 @@
     <!-- Hinnoittelu -->
     <section class="pricing" id="hinnat">
         <div class="container">
-            <p class="section-subtitle" style="margin-bottom: 32px;">Kaikissa paketeissa: Nextcloud-käyttöliittymä, synkronointi, jakaminen ja varmuuskopiot.</p>
+            <p class="section-subtitle" style="margin-bottom: 32px;">Kaikissa paketeissa: Nextcloud-käyttöliittymä, synkronointi, jakaminen ja varmuuskopiot. Laskutus 12 kk kerrallaan.</p>
             <div class="pricing-grid">
 
                 <div class="pricing-card">
                     <div class="pricing-header">
                         <h3>Mini</h3>
                         <div class="pricing-amount">
-                            <span class="price">3€</span>
-                            <span class="period">/kk</span>
+                            <span class="price">29€</span>
+                            <span class="period">/vuosi</span>
                         </div>
-                        <p class="pricing-storage">50 GB tallennustilaa</p>
+                        <p class="pricing-monthly">vain 2,42€/kk</p>
+                        <p class="pricing-storage">100 GB tallennustilaa</p>
                     </div>
                     <ul class="pricing-features">
                         <li>Nextcloud-käyttöliittymä</li>
@@ -70,9 +71,10 @@
                     <div class="pricing-header">
                         <h3>Perus</h3>
                         <div class="pricing-amount">
-                            <span class="price">7€</span>
-                            <span class="period">/kk</span>
+                            <span class="price">69€</span>
+                            <span class="period">/vuosi</span>
                         </div>
+                        <p class="pricing-monthly">vain 5,75€/kk</p>
                         <p class="pricing-storage">200 GB tallennustilaa</p>
                     </div>
                     <ul class="pricing-features">
@@ -90,9 +92,10 @@
                     <div class="pricing-header">
                         <h3>Plus</h3>
                         <div class="pricing-amount">
-                            <span class="price">12€</span>
-                            <span class="period">/kk</span>
+                            <span class="price">119€</span>
+                            <span class="period">/vuosi</span>
                         </div>
+                        <p class="pricing-monthly">vain 9,92€/kk</p>
                         <p class="pricing-storage">500 GB tallennustilaa</p>
                     </div>
                     <ul class="pricing-features">
@@ -110,9 +113,10 @@
                     <div class="pricing-header">
                         <h3>Pro</h3>
                         <div class="pricing-amount">
-                            <span class="price">19€</span>
-                            <span class="period">/kk</span>
+                            <span class="price">199€</span>
+                            <span class="period">/vuosi</span>
                         </div>
+                        <p class="pricing-monthly">vain 16,58€/kk</p>
                         <p class="pricing-storage">1 TB tallennustilaa</p>
                     </div>
                     <ul class="pricing-features">
@@ -130,9 +134,10 @@
                     <div class="pricing-header">
                         <h3>Business</h3>
                         <div class="pricing-amount">
-                            <span class="price">29€</span>
-                            <span class="period">/kk</span>
+                            <span class="price">299€</span>
+                            <span class="period">/vuosi</span>
                         </div>
+                        <p class="pricing-monthly">vain 24,92€/kk</p>
                         <p class="pricing-storage">2 TB tallennustilaa</p>
                     </div>
                     <ul class="pricing-features">
@@ -216,11 +221,11 @@
                         <label for="package">Kiinnostava paketti</label>
                         <select id="package" name="package">
                             <option value="">Valitse paketti (valinnainen)</option>
-                            <option value="mini">Mini — 50 GB — 3€/kk</option>
-                            <option value="perus">Perus — 200 GB — 7€/kk</option>
-                            <option value="plus">Plus — 500 GB — 12€/kk</option>
-                            <option value="pro">Pro — 1 TB — 19€/kk</option>
-                            <option value="business">Business — 2 TB — 29€/kk</option>
+                            <option value="mini">Mini — 100 GB — 29€/v</option>
+                            <option value="perus">Perus — 200 GB — 69€/v</option>
+                            <option value="plus">Plus — 500 GB — 119€/v</option>
+                            <option value="pro">Pro — 1 TB — 199€/v</option>
+                            <option value="business">Business — 2 TB — 299€/v</option>
                         </select>
                     </div>
                     <div class="form-group">
diff --git a/style.css b/style.css
index b7831ba..4e816a8 100644
--- a/style.css
+++ b/style.css
@@ -407,6 +407,13 @@ a {
     color: var(--text-muted);
 }
 
+.pricing-monthly {
+    color: var(--secondary);
+    font-size: 0.85rem;
+    font-weight: 600;
+    margin-bottom: 4px;
+}
+
 .pricing-storage {
     color: var(--text-muted);
     font-size: 0.9rem;