Jede Fläche in eigenem Grünton

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

tools/build_pages.py

@@ -69,7 +69,7 @@ def header(current=None):
 def contact(photo=KK[46], alt="Schwarze Schäferhündin steht aufmerksam im Wald"):
     go = f'<span>{I["arrow"]}</span>'
     return f'''    <div class="row row--wide" id="kontakt">
-      <div class="panel panel--ink reveal">
+      <div class="panel panel--ink tone-3 reveal">
         <span class="kicker">Kontakt</span>
         <h2 class="display">Lass uns<br>sprechen.</h2>
         <div class="contact-links">
@@ -149,7 +149,7 @@ index = head("Schmacko Napf & Hundetraining by Katha", "Hundetraining, Ernährun
 
   <main class="mosaic">
     <div class="row row--wide-r" id="ueber-mich">
-      <div class="panel panel--cream reveal">
+      <div class="panel panel--ink tone-4 reveal">
         <span class="kicker">Über mich</span>
         <h2 class="display">Hallo,<br>ich bin Katha.</h2>
         <p class="big">Hundetrainerin und Ernährungsberaterin – mit Herz und Verstand. Für beide Seiten der Leine.</p>
@@ -175,9 +175,9 @@ index = head("Schmacko Napf & Hundetraining by Katha", "Hundetraining, Ernährun
     </a>
 
     <div class="row">
-      <div class="panel panel--sage plate-panel reveal"><img src="{BARF}" alt="Teller mit frischem Fleisch, Gemüse und Obst für die Rohfütterung" loading="lazy"></div>
-      <a class="panel panel--cream reveal d1" href="ernaehrung.html">
-        <span class="panel-arrow" style="background:var(--ink);border-color:var(--ink)">{I["arrow"]}</span>
+      <div class="panel panel--sage tone-8 plate-panel reveal"><img src="{BARF}" alt="Teller mit frischem Fleisch, Gemüse und Obst für die Rohfütterung" loading="lazy"></div>
+      <a class="panel panel--ink tone-2 reveal d1" href="ernaehrung.html">
+        <span class="panel-arrow">{I["arrow"]}</span>
         <span class="kicker">Ernährungsberatung</span>
         <h2 class="display">Gesund<br>gefüttert.</h2>
         <p class="big">Individuelle Futterpläne – für jedes Alter, auch bei Magen-Darm- oder Pankreas-Problemen.</p>
@@ -185,12 +185,12 @@ index = head("Schmacko Napf & Hundetraining by Katha", "Hundetraining, Ernährun
       </a>
     </div>
 
-    <div class="panel panel--plain panel--mid panel--center reveal">
+    <div class="panel panel--sage tone-9 panel--mid panel--center reveal">
       <p class="statement">„Futter ist mehr als nur Nahrung – es ist Fürsorge in Napfform.“</p>
       <span class="statement-by">— Katha</span>
     </div>
 
-    <div class="panel panel--ink panel--auto reveal">
+    <div class="panel panel--ink tone-1 panel--auto reveal">
       <span class="kicker">Meine Philosophie · die 5 Säulen</span>
       <ul class="words">
         <li><small>01</small>Respekt<span>Den Hund als eigenständiges Wesen ernst nehmen.</span></li>
@@ -227,7 +227,7 @@ page("hundeschule.html", "Hundetraining – Schmacko Napf",
                "Vertrauen, klare Kommunikation und Training, das im Alltag funktioniert.",
                "Katha mit ihrem Hund auf einer Wiese im Abendlicht") + f'''
     <div class="row row--wide-r">
-      <div class="panel panel--cream reveal">
+      <div class="panel panel--ink tone-4 reveal">
         <span class="kicker">Einzeltraining &amp; Hausbesuch</span>
         <h2 class="title">Individuell.<br>Bei dir zu Hause.</h2>
         <p class="big">Für Grundgehorsam, Unsicherheit, Leinenführigkeit oder einen neuen Hund im Haus.</p>
@@ -238,7 +238,7 @@ page("hundeschule.html", "Hundetraining – Schmacko Napf",
 
     <div class="row row--wide">
       <div class="panel panel--photo plain reveal"><img src="{KK[51]}" alt="Schwarzer Schäferhund rennt über einen Feldweg" loading="lazy"></div>
-      <div class="panel panel--ink reveal d1">
+      <div class="panel panel--ink tone-2 reveal d1">
         <span class="kicker">Gruppe &amp; Außentraining</span>
         <h2 class="title">Training da, wo<br>das Leben ist.</h2>
         <p class="big">In der Stadt, im Grünen, in Geschäften – mit max. 6 Mensch-Hund-Teams.</p>
@@ -246,7 +246,7 @@ page("hundeschule.html", "Hundetraining – Schmacko Napf",
       </div>
     </div>
 
-    <div class="panel panel--ink panel--auto reveal">
+    <div class="panel panel--ink tone-1 panel--auto reveal">
       <span class="kicker">Die 5 Säulen</span>
       <ul class="words">
         <li><small>01</small>Respekt<span>Hunde wollen ernst genommen werden.</span></li>
@@ -257,7 +257,7 @@ page("hundeschule.html", "Hundetraining – Schmacko Napf",
       </ul>
     </div>
 
-    <div class="panel panel--cream panel--auto reveal">
+    <div class="panel panel--sage tone-8 panel--auto reveal">
       <span class="kicker">Preise</span>
       <h2 class="title">Fair und klar.</h2>
       <div class="price-rows">
@@ -278,16 +278,16 @@ page("ernaehrung.html", "Ernährungsberatung – Schmacko Napf",
                "Individuelle Futterpläne – gesund, sensibel oder mit Diagnose.",
                "Hund schnuppert an einem Napf mit Trockenfutter") + f'''
     <div class="row">
-      <div class="panel panel--cream reveal">
+      <div class="panel panel--ink tone-4 reveal">
         <span class="kicker">Kennst du das?</span>
         <h2 class="title">Jeder sagt<br>etwas anderes.</h2>
         <p class="big">Ich bringe Klarheit in die Futter-Frage – und erstelle einen Plan, der zu deinem Hund passt.</p>
         <div class="facts"><span class="fact">BARF</span><span class="fact">Teil-BARF</span><span class="fact">Koch-BARF</span><span class="fact">Nassfutter</span><span class="fact">Trockenfutter</span></div>
       </div>
-      <div class="panel panel--sage plate-panel reveal d1"><img src="{BARF}" alt="Teller mit frischem Fleisch, Gemüse und Obst" loading="lazy"></div>
+      <div class="panel panel--sage tone-8 plate-panel reveal d1"><img src="{BARF}" alt="Teller mit frischem Fleisch, Gemüse und Obst" loading="lazy"></div>
     </div>
 
-    <div class="panel panel--ink panel--auto reveal">
+    <div class="panel panel--ink tone-1 panel--auto reveal">
       <span class="kicker">Ablauf</span>
       <h2 class="title">So starten wir.</h2>
       <ol class="steps">
@@ -299,17 +299,17 @@ page("ernaehrung.html", "Ernährungsberatung – Schmacko Napf",
     </div>
 
     <div class="row row--3">
-      <div class="panel panel--cream panel--mid reveal">
+      <div class="panel panel--ink tone-5 panel--mid reveal">
         <span class="kicker">Rationsprüfung</span>
         <h2 class="title">Passt das<br>Futter?</h2>
         <div class="price-big"><strong>kostenlos</strong></div>
       </div>
-      <div class="panel panel--sage panel--mid reveal d1">
+      <div class="panel panel--sage tone-7 panel--mid reveal d1">
         <span class="kicker">Erstgespräch</span>
         <h2 class="title">Kennen&shy;lernen</h2>
         <div class="price-big"><strong>ab 45 €</strong><span>ca. 60 Minuten</span></div>
       </div>
-      <div class="panel panel--ink panel--mid reveal d2">
+      <div class="panel panel--ink tone-2 panel--mid reveal d2">
         <span class="kicker">Futterplan</span>
         <h2 class="title">Dein<br>Plan</h2>
         <div class="price-big"><strong>ab 75 €</strong><span>inkl. Folgegespräch nach 4 Wochen</span></div>
@@ -324,12 +324,12 @@ page("shop.html", "Shop – Schmacko Napf", "Ausgewähltes Futter, Snacks und Zu
                "Futter, Snacks und Zubehör, hinter denen ich stehe.",
                "Hund in einem Laden mit Hundezubehör") + f'''
     <div class="row row--3">
-      <div class="panel panel--cream panel--mid reveal"><div class="panel-icon">{I["bowl"]}</div><h2 class="title">Futter</h2><p class="big">Passend zu deinem Futterplan.</p></div>
-      <div class="panel panel--sage panel--mid reveal d1"><div class="panel-icon">{I["bone"]}</div><h2 class="title">Snacks</h2><p class="big">Natürlich – fürs Training und zum Belohnen.</p></div>
-      <div class="panel panel--ink panel--mid reveal d2"><div class="panel-icon">{I["leash"]}</div><h2 class="title">Zubehör</h2><p class="big">Robust und durchdacht für den Alltag.</p></div>
+      <div class="panel panel--ink tone-4 panel--mid reveal"><div class="panel-icon">{I["bowl"]}</div><h2 class="title">Futter</h2><p class="big">Passend zu deinem Futterplan.</p></div>
+      <div class="panel panel--sage tone-8 panel--mid reveal d1"><div class="panel-icon">{I["bone"]}</div><h2 class="title">Snacks</h2><p class="big">Natürlich – fürs Training und zum Belohnen.</p></div>
+      <div class="panel panel--ink tone-2 panel--mid reveal d2"><div class="panel-icon">{I["leash"]}</div><h2 class="title">Zubehör</h2><p class="big">Robust und durchdacht für den Alltag.</p></div>
     </div>
 
-    <div class="panel panel--cream panel--mid panel--center reveal">
+    <div class="panel panel--sage tone-9 panel--mid panel--center reveal">
       <p class="statement">Der Online-Shop ist bald da.<br>Bis dahin: schreib mir einfach.</p>
     </div>
 
@@ -342,12 +342,12 @@ page("transportboxen.html", "Transportboxen nach Maß – Schmacko Napf",
                "Passgenau für dein Fahrzeug und deinen Hund.",
                "Hund sitzt im offenen Kofferraum hinter einem Trenngitter") + f'''
     <div class="row row--3">
-      <div class="panel panel--cream panel--mid reveal"><div class="panel-icon">{I["car"]}</div><h2 class="title">Passgenau</h2><p class="big">Exakt für deinen Kofferraum gebaut.</p></div>
-      <div class="panel panel--sage panel--mid reveal d1"><div class="panel-icon">{I["shield"]}</div><h2 class="title">Sicher</h2><p class="big">Stabil – für jede Fahrt.</p></div>
-      <div class="panel panel--ink panel--mid reveal d2"><div class="panel-icon">{I["wind"]}</div><h2 class="title">Bequem</h2><p class="big">Luftig und mit genug Platz.</p></div>
+      <div class="panel panel--ink tone-4 panel--mid reveal"><div class="panel-icon">{I["car"]}</div><h2 class="title">Passgenau</h2><p class="big">Exakt für deinen Kofferraum gebaut.</p></div>
+      <div class="panel panel--sage tone-8 panel--mid reveal d1"><div class="panel-icon">{I["shield"]}</div><h2 class="title">Sicher</h2><p class="big">Stabil – für jede Fahrt.</p></div>
+      <div class="panel panel--ink tone-2 panel--mid reveal d2"><div class="panel-icon">{I["wind"]}</div><h2 class="title">Bequem</h2><p class="big">Luftig und mit genug Platz.</p></div>
     </div>
 
-    <div class="panel panel--ink panel--auto reveal">
+    <div class="panel panel--ink tone-1 panel--auto reveal">
       <span class="kicker">Ablauf</span>
       <h2 class="title">In 4 Schritten zur eigenen Box.</h2>
       <ol class="steps">
@@ -361,7 +361,7 @@ page("transportboxen.html", "Transportboxen nach Maß – Schmacko Napf",
 {contact()}''')
 
 # ================================================================ Impressum
-page("impressum.html", "Impressum – Schmacko Napf", "Impressum von Schmacko Napf & Hundetraining by Katha.", None, f'''    <div class="panel panel--cream panel--auto">
+page("impressum.html", "Impressum – Schmacko Napf", "Impressum von Schmacko Napf & Hundetraining by Katha.", None, f'''    <div class="panel panel--sage tone-9 panel--auto">
       <span class="kicker">Rechtliches</span>
       <h1 class="display">Impressum</h1>
       <div class="legal" style="margin-top:48px">