New files, optical enhancement, new conten

adventskalender/2025/content/day01.html

@@ -8,20 +8,106 @@
   <div class="popup-body">
     <!-- Linke Spalte: Story (dein bisheriger Text 1:1 übernommen) -->
     <div class="story">
-      <p>Draußen riecht die Luft nach kaltem Holz und ersten Plätzchen.<br>
+      <p>
-      Über den Dächern von Bratonien hängt ein dünner Dunst aus Zucker und Geheimnissen,<br>
+Der erste Dezember begann in Bratonien mit dem Geruch von kaltem Holz und einem Hauch 
-      und im Schloss knistert das Kaminfeuer wie eine Erinnerung daran,<br>
+Plätzchen, der eindeutig nicht aus der Schlossküche kam. Irgendwo im Dorf hatte wieder 
-      dass jeder Anfang ein kleines bisschen Mut braucht.</p>
+jemand zu früh angefangen – wie jedes Jahr.
+</p>
 
-      <p>Erna steht am Fenster, eine Tasse Kaffee in der Hand,<br>
+<p>
-      und beobachtet, wie Barney im Hof versucht, die Lichterkette zu entwirren.<br>
+Im Hof stand Barney mit hochgezogenen Schultern und hielt eine Lichterkette, die aussah, 
-      „Das Jahr geht nie leise zu Ende“, murmelt sie –<br>
+als hätte sie die Nacht damit verbracht, sich selbstständig weiterzuentwickeln. Erna 
-      und er antwortet, ohne aufzusehen: „Dann fangen wir besser laut an.“</p>
+beobachtete ihn vom Fenster aus und nahm einen Schluck Kaffee, als müsse sie sich mental 
+auf das vorbereiten, was gleich passieren würde.
+</p>
 
-      <p>Ein Lächeln huscht über beide Gesichter.<br>
+<p>
-      Denn irgendwo, zwischen goldenen Schleifen und kalten Fingern,<br>
+„Das Jahr geht nie leise zu Ende“, murmelte sie.  
-      beginnt genau jetzt das, worauf ganz Bratonien gewartet hat:<br>
+Barney schaute kurz hoch.  
-      <strong>die Adventszeit.</strong></p>
+„Dann fang ich halt laut an“, sagte er, und in dem Moment wickelte sich ein Teil der 
+Lichterkette um seinen Arm, als wolle sie ihn verhaften.
+</p>
+
+<p>
+Drinnen roch die große Halle nach Tannenzweigen, geöltem Holz und einer deutlichen Spur 
+Falbala. Sie hatte am Vorabend den Boden gebohnert, „weil der erste Dezember das 
+verdient“. Und weil sie heimlich hoffte, dass vielleicht endlich mal jemand darauf 
+ausrutschte und zugab, dass es kein Versehen war.
+</p>
+
+<p>
+Auf der Fensterbank lag der alte Adventskalender. Falbala hatte ihn mehrmals repariert, 
+einmal versehentlich falsch herum zusammengeschraubt und einmal mit einem Glöckchen 
+versehen, „damit er Geräusche macht, wenn er gute Laune hat“. Heute machte er keine.  
+Erna öffnete Türchen Nummer eins. „Schloss bei Nacht“, stellte sie fest. „Unverhofft.“
+</p>
+
+<p>
+In der Küche wartete bereits Kaffee – nicht von Falbala. Sie schlief noch, was selten 
+vorkam und meistens bedeutete, dass sie entweder zu spät ins Bett gegangen war oder 
+einen Traum hatte, der zu gut war, um ihn zu verlassen.
+</p>
+
+<p>
+Als sie schließlich erschien, setzte sie sich schwer auf einen Stuhl.  
+„Ich hab geträumt, dass der Ofen mit mir diskutiert hat.“  
+„Hat er gewonnen?“, fragte Barney.  
+„Er hat angefangen zu singen. Da bin ich gegangen.“
+</p>
+
+<p>
+Hades stimmte im Musikzimmer seine Geige. Wie immer am ersten Dezember – ein Ritual, 
+über das niemand mit ihm sprach, weil es ohnehin keine Wirkung gehabt hätte. Aus dem 
+Gang hörte man Tonfragmente, die sich anhörten, als würde die Geige über den neuen 
+Monat verhandeln.
+</p>
+
+<p>
+Gegen späten Vormittag trafen sie sich alle in der Halle. Barney legte seine halbwegs 
+entwirrte Lichterkette auf den Tisch. „Ich hab gewonnen“, sagte er.  
+„Sieht nicht so aus“, antwortete Falbala.  
+„Sie hat angefangen, beleidigt zu summen.“  
+„Lichterketten summen nicht.“  
+„Diese schon.“
+</p>
+
+<p>
+Erna stellte ihren Kaffee ab. „Gut, Leute. Erster Dezember. Wir nehmen uns nicht zu viel 
+vor.“  
+„Ich nehm mir immer nicht viel vor“, meinte Hades.  
+„Dann bist du heute absolut im Konzept.“
+</p>
+
+<p>
+Der Nachmittag verging ruhig. Falbala verteilte Orangen und Zimtstangen im Schloss, 
+„damit niemand behaupten kann, er rieche den Dezember nicht“. Barney prüfte die 
+Lichterkette erneut und erklärte, sie sei „jetzt nur noch geringfügig unberechenbar“. 
+Hades sortierte Notenblätter und spielte gelegentlich etwas, das Falbala als „den 
+verzweifelten Versuch eines Motivs“ bezeichnete. Erna schrieb und verwarf 
+Podcast-Notizen im Wechsel.
+</p>
+
+<p>
+Beim Abendessen erzählte Falbala, dass der Wasserkocher heute zweimal gepfiffen habe, 
+obwohl niemand ihn benutzt hatte. Barney meinte, Küchengeräte seien im Dezember 
+grundsätzlich übermotiviert. Erna ließ die Diskussion ohne Kommentar durchziehen.
+</p>
+
+<p>
+Später, als alle schon in Richtung ihrer Zimmer gingen, blieb Erna im Gang stehen. Sie war 
+sich nicht sicher, ob sie es gehört hatte: ein sehr leises Summen irgendwo tief im Schloss, 
+kaum mehr als ein Eindruck. Vielleicht die Heizung. Vielleicht der Wind. Vielleicht Barneys 
+Lichterkette mit künstlerischen Ambitionen.
+</p>
+
+<p>
+Sie horchte kurz, dann zuckte sie mit den Schultern. Der erste Dezember war kein Tag für 
+Geräusche, die keine klaren Absichten hatten.
+</p>
+
+<p>
+So endete er – warm, schräg und vielversprechend. Bratonien eben.
+</p>
 
       <p class="note">
         Und wer genau hinsieht, entdeckt: das kleine Daumenkino verändert sich.<br>

adventskalender/2025/content/day02.html

@@ -0,0 +1,158 @@
+<section class="popup-day popup-recipe">
+
+  <div class="popup-header">
+ <h2>🎁 2. Dezember – Wenn es still wird</h2>
+  </div>
+
+  <div class="popup-body">
+
+    <div class="story">
+<p>
+  Der zweite Dezember begann mit Zimt.  
+  Nicht mit Glocken, nicht mit Gesang – nur mit dem ehrlichen, klebrigen Versuch, Weihnachten in Blechform zu gießen.  
+  Falbala stand in der Schlossküche, den Ärmel hochgekrempelt, ein Holzlöffel wie ein Marschbefehl in der Hand,  
+  und starrte auf einen Teig, der sich weigerte, sich an irgendetwas zu halten – Regeln, Rezept oder Finger.
+</p>
+
+<p>
+  „Das ist doch nicht dein Ernst“, sagte sie zu niemandem, außer vielleicht zum Teig selbst,  
+  der in zähen Wellen am Rand der Schüssel klebte.  
+  Der Ofen summte leise im Hintergrund, so zuverlässig wie immer. Dachte sie.
+</p>
+
+<p>
+  Das erste Blech verbrannte.  
+  Nicht leicht gebräunt, nicht knusprig – verkohlt.  
+  Und das, obwohl sie exakt die gleiche Zeit genommen hatte wie jedes Jahr.  
+  Der Blick auf die Küchenuhr bestätigte es.  
+  „Also wirklich“, murmelte sie, „wenn du damit anfangen willst, dann mach das gefälligst im Februar.“
+</p>
+
+<p>
+  Zwei Räume weiter versuchte Hades, „Still, still, still“ auf der Geige zu spielen.  
+  Das klang an sich schon nach Selbstüberlistung – aber heute klang es vor allem falsch.  
+  Dumpf, spannungslos. Als würde die Geige mit ihm streiten.  
+  Er setzte dreimal neu an, korrigierte die Stimmung, lauschte –  
+  und hörte nichts als Widerspruch.  
+  Beim vierten Mal legte er den Bogen nieder,  
+  stand auf und verließ den Raum, als hätte ihn etwas beleidigt.
+</p>
+
+<p>
+  Im Innenhof stand Barney mit hochgezogener Kapuze in der Kälte.  
+  Die neue Lichterkette, die er gestern mit beinahe kindlicher Sorgfalt aufgehängt hatte,  
+  flackerte wie ein widerspenstiger Sternenhimmel.  
+  Erst ging sie, dann nicht, dann wieder nur halb – dann leuchtete sie in Farben, die nicht vorgesehen waren.  
+  Barney fluchte nicht. Noch nicht.  
+  Er holte ein Ersatzkabel, prüfte die Verbindungen, tippte gegen das Steuergerät.  
+  Nichts half.
+</p>
+
+<p>
+  „Vielleicht bist du beleidigt, weil ich nicht die aus dem Katalog genommen habe“,  
+  sagte er schließlich zur Kette.  
+  Sie antwortete mit völliger Dunkelheit.
+</p>
+
+<p>
+  Erna stand derweil in der großen Halle, zündete die Kerzen auf dem Kranz erneut an –  
+  und sah zu, wie die mittlere fast sofort wieder verlosch.  
+  Kein Luftzug, kein Knacken, kein sichtbarer Grund.  
+  Nur ein leiser, harmloser Tod der Flamme.  
+  Beim zweiten Versuch blieb sie an.  
+  Aber sie flackerte nervös, als würde sie etwas ahnen.
+</p>
+
+<p>
+  Am Abend saßen alle in der kleinen Speisekammer am Tisch – Falbala mit Mehl in den Haaren,  
+  Hades mit dem Blick ins Nichts, Barney mit den Händen in der Jackentasche.  
+  Niemand sagte etwas.  
+  Niemand wollte anfangen.  
+  Und Erna, die die Stille bemerkte, tat das Einzige, was sie tun konnte:  
+  Sie griff zur Kaffeekanne und schenkte nach.
+</p>
+
+<p>
+  Die Lichterkette blieb dunkel.
+</p>
+    </div>
+
+    <div class="addon popup-recipe-content">
+
+      <!-- Rezeptname -->
+      <h3 class="recipe-title">Bratonischer Tassenkuchen/h3>
+
+       <!-- RESPONSIVES REZEPTBILD -->
+      <picture class="recipe-image-wrapper">
+
+        <!-- AVIF -->
+        <source
+          type="image/avif"
+          srcset="
+            /2025/assets/images/rezepte/480/avif/Basisbild.avif 480w,
+            /2025/assets/images/rezepte/720/avif/Basisbild.avif 720w,
+            /2025/assets/images/rezepte/1024/avif/Basisbild.avif 1024w,
+            /2025/assets/images/rezepte/1366/avif/Basisbild.avif 1366w,
+            /2025/assets/images/rezepte/1600/avif/Basisbild.avif 1600w,
+            /2025/assets/images/rezepte/1920/avif/Basisbild.avif 1920w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+        >
+
+        <!-- WEBP -->
+        <source
+          type="image/webp"
+          srcset="
+            /2025/assets/images/rezepte/480/webp/Basisbild.webp 480w,
+            /2025/assets/images/rezepte/720/webp/Basisbild.webp 720w,
+            /2025/assets/images/rezepte/1024/webp/Basisbild.webp 1024w,
+            /2025/assets/images/rezepte/1366/webp/Basisbild.webp 1366w,
+            /2025/assets/images/rezepte/1600/webp/Basisbild.webp 1600w,
+            /2025/assets/images/rezepte/1920/webp/Basisbild.webp 1920w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+        >
+
+        <!-- JPEG Fallback -->
+        <img
+          src="/2025/assets/images/rezepte/1024/jpeg/Basisbild.jpg"
+          srcset="
+            /2025/assets/images/rezepte/480/jpeg/Basisbild.jpg 480w,
+            /2025/assets/images/rezepte/720/jpeg/Basisbild.jpg 720w,
+            /2025/assets/images/rezepte/1024/jpeg/Basisbild.jpg 1024w,
+            /2025/assets/images/rezepte/1366/jpeg/Basisbild.jpg 1366w,
+            /2025/assets/images/rezepte/1600/jpeg/Basisbild.jpg 1600w,
+            /2025/assets/images/rezepte/1920/jpeg/Basisbild.jpg 1920w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+          alt="Rezeptbild"
+          class="recipe-image"
+          decoding="async"
+          loading="lazy"
+        >
+
+      </picture>
+
+      <!-- Zutaten -->
+      <h4>Zutaten</h4>
+      <li>4 EL Mehl</li>
+      <li>2 EL Zucker</li>
+      <li>1 EL Kakaopulver</li>
+      <li>1/4 TL Zimt</li>
+      <li>1 Ei</li>
+      <li>3 EL Milch</li>
+      <li>2 EL neutrales Öl</li>
+      <li>1 Prise Salz</li>
+      <!-- Zubereitung -->
+      <h4>Zubereitung</h4>
+       <p>Alle Zutaten in einer großen, mikrowellengeeigneten Tasse gut verrühren.  
+    Bei 800 Watt ca. 90 Sekunden in die Mikrowelle stellen – nicht überbacken.  
+    Optional: mit Puderzucker bestäuben oder Schokostückchen eindrücken.</p>
+    <p><em>Hinweis: Funktioniert auch bei Stromausfall nicht schlechter als Falbalas Blech.</em></p>
+  </div>
+
+    </div>
+
+  </div>
+
+</section>

adventskalender/2025/index.php

@@ -7,7 +7,7 @@
 
   <!-- === Styles === -->
   <link rel="preload" href="/shared/css/style.css" as="style" onload="this.rel='stylesheet'">
-  <link rel="preload" href="/2025/css/popup.css" as="style" onload="this.rel='stylesheet'">
+  <link rel="preload" href="/shares/css/popup.css" as="style" onload="this.rel='stylesheet'">
   <link rel="preload" href="/2025/css/main.css" as="style" onload="this.rel='stylesheet'">
 
   <noscript>

adventskalender/shared/css/popup.css

@@ -204,6 +204,23 @@
   }
 }
 
+/* Rezeptname (z. B. „Vanillekipferl“) */
+.popup-recipe .recipe-title {
+  font-size: clamp(1.3rem, 1.6vw, 2rem);
+  color: var(--ci-darkgreen);
+  margin: 0 0 0.8rem 0;
+  text-align: left;
+  font-weight: 600;
+}
+
+/* Zutaten & Zubereitung kleiner (h4) */
+.popup-recipe .popup-body h4 {
+  font-size: clamp(1rem, 1.2vw, 1.4rem);
+  margin: 1rem 0 0.5rem 0;
+  color: var(--ci-darkgreen);
+  font-weight: 600;
+}
+
 /* ============================================================
    Allgemeine Gestaltung & Animationen
    ============================================================ */
@@ -277,3 +294,45 @@
     transition: none !important;
   }
 }
+
+/* ============================================================
+   Edel-bretonischer Audio-Player
+   ============================================================ */
+
+.addon-audio {
+  width: 100%;
+  max-width: 420px;
+  margin: 0 auto;
+  display: block;
+
+  /* Hintergrund & Rahmen */
+  background: color-mix(in srgb, var(--ci-creamwhite) 85%, #ffffff);
+  border: 2px solid var(--ci-gold);
+  border-radius: 12px;
+
+  padding: 0.6rem 0.8rem;
+
+  /* leichter Schimmer */
+  box-shadow:
+    0 0 10px color-mix(in srgb, var(--ci-gold) 35%, transparent),
+    inset 0 0 5px rgba(255, 255, 255, 0.4);
+}
+
+/* Browser-spezifische Feinanpassungen */
+.addon-audio::-webkit-media-controls-panel {
+  background: color-mix(in srgb, var(--ci-creamwhite) 92%, #ffffff) !important;
+  border-radius: 10px;
+}
+
+.addon-audio::-webkit-media-controls-play-button,
+.addon-audio::-webkit-media-controls-volume-slider,
+.addon-audio::-webkit-media-controls-timeline,
+.addon-audio::-webkit-media-controls-current-time-display,
+.addon-audio::-webkit-media-controls-time-remaining-display {
+  filter: hue-rotate(-5deg) saturate(1.15);
+}
+
+.addon-audio::-webkit-media-controls-enclosure {
+  border-radius: 10px;
+  overflow: hidden;
+}

templates/audio.txt

@@ -0,0 +1,32 @@
+<section class="popup-day popup-3part">
+
+  <!-- TITEL -->
+  <div class="popup-header">
+    <h2><!-- TITEL DES TAGES --></h2>
+  </div>
+
+  <!-- 2 SPALTEN -->
+  <div class="popup-body">
+
+    <!-- ================================
+         LINKE SPALTE – TEXT
+         ================================ -->
+    <div class="story">
+      <!-- DEIN TEXT HIER -->
+    </div>
+
+    <!-- ================================
+         RECHTE SPALTE – SOUND
+         ================================ -->
+    <div class="addon">
+
+      <audio controls preload="auto" class="addon-audio">
+        <source src="/2025/assets/sounds/SOUND.mp3" type="audio/mpeg">
+        Dein Browser unterstützt Audio nicht.
+      </audio>
+
+    </div>
+
+  </div>
+
+</section>

templates/picture.txt

@@ -0,0 +1,86 @@
+<!-- ============================================
+     POPUP: STANDARD TAG — TEXT + BILD
+     ============================================ -->
+<section class="popup-day popup-3part">
+
+  <!-- TITEL -->
+  <div class="popup-header">
+    <h2><!-- TITEL DES TAGES --></h2>
+  </div>
+
+  <!-- 2 SPALTEN -->
+  <div class="popup-body">
+
+    <!-- ================================
+         LINKE SPALTE – DEIN TEXT
+         ================================ -->
+    <div class="story">
+      <!-- HIER DEIN TEXT -->
+    </div>
+
+    <!-- ================================
+         RECHTE SPALTE – BILD (RESPONSIV)
+         ================================ -->
+    <div class="addon">
+
+      <!-- RESPONSIVES BILD -->
+      <picture>
+
+        <!-- AVIF -->
+        <source
+          type="image/avif"
+          srcset="
+            /2025/assets/images/dayXX/480/avif/BILD.avif 480w,
+            /2025/assets/images/dayXX/720/avif/BILD.avif 720w,
+            /2025/assets/images/dayXX/1024/avif/BILD.avif 1024w,
+            /2025/assets/images/dayXX/1366/avif/BILD.avif 1366w,
+            /2025/assets/images/dayXX/1600/avif/BILD.avif 1600w,
+            /2025/assets/images/dayXX/1920/avif/BILD.avif 1920w,
+            /2025/assets/images/dayXX/2560/avif/BILD.avif 2560w,
+            /2025/assets/images/dayXX/3840/avif/BILD.avif 3840w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+        >
+
+        <!-- WEBP -->
+        <source
+          type="image/webp"
+          srcset="
+            /2025/assets/images/dayXX/480/webp/BILD.webp 480w,
+            /2025/assets/images/dayXX/720/webp/BILD.webp 720w,
+            /2025/assets/images/dayXX/1024/webp/BILD.webp 1024w,
+            /2025/assets/images/dayXX/1366/webp/BILD.webp 1366w,
+            /2025/assets/images/dayXX/1600/webp/BILD.webp 1600w,
+            /2025/assets/images/dayXX/1920/webp/BILD.webp 1920w,
+            /2025/assets/images/dayXX/2560/webp/BILD.webp 2560w,
+            /2025/assets/images/dayXX/3840/webp/BILD.webp 3840w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+        >
+
+        <!-- JPEG -->
+        <img
+          src="/2025/assets/images/dayXX/1024/jpeg/BILD.jpg"
+          srcset="
+            /2025/assets/images/dayXX/480/jpeg/BILD.jpg 480w,
+            /2025/assets/images/dayXX/720/jpeg/BILD.jpg 720w,
+            /2025/assets/images/dayXX/1024/jpeg/BILD.jpg 1024w,
+            /2025/assets/images/dayXX/1366/jpeg/BILD.jpg 1366w,
+            /2025/assets/images/dayXX/1600/jpeg/BILD.jpg 1600w,
+            /2025/assets/images/dayXX/1920/jpeg/BILD.jpg 1920w,
+            /2025/assets/images/dayXX/2560/jpeg/BILD.jpg 2560w,
+            /2025/assets/images/dayXX/3840/jpeg/BILD.jpg 3840w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+          alt="Bild zum Tag"
+          class="addon-image"
+          decoding="async"
+          loading="lazy"
+        >
+
+      </picture>
+
+    </div>
+  </div>
+
+</section>

templates/recipe.txt

@@ -0,0 +1,95 @@
+<section class="popup-day popup-recipe">
+
+  <!-- TITEL -->
+  <div class="popup-header">
+    <h2><!-- TITEL HIER --></h2>
+  </div>
+
+  <!-- HAUPTBEREICH -->
+  <div class="popup-body">
+
+    <!-- =====================================
+         LINKE SPALTE – STORYTEXT
+         ===================================== -->
+    <div class="story">
+      <!-- DEIN STORYTEXT HIER REIN -->
+    </div>
+
+
+    <!-- =====================================
+         RECHTE SPALTE – REZEPT (mit responsivem Bild)
+         ===================================== -->
+    <div class="addon popup-recipe-content">
+
+      <!-- REZEPTNAME -->
+      <h3 class="recipe-title"><!-- Rezeptname --></h3>
+
+      <!-- RESPONSIVES REZEPTBILD -->
+      <picture class="recipe-image-wrapper">
+
+        <!-- AVIF -->
+        <source
+          type="image/avif"
+          srcset="
+            /2025/assets/images/rezepte/480/avif/REZEPT.avif 480w,
+            /2025/assets/images/rezepte/720/avif/REZEPT.avif 720w,
+            /2025/assets/images/rezepte/1024/avif/REZEPT.avif 1024w,
+            /2025/assets/images/rezepte/1366/avif/REZEPT.avif 1366w,
+            /2025/assets/images/rezepte/1600/avif/REZEPT.avif 1600w,
+            /2025/assets/images/rezepte/1920/avif/REZEPT.avif 1920w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+        >
+
+        <!-- WEBP -->
+        <source
+          type="image/webp"
+          srcset="
+            /2025/assets/images/rezepte/480/webp/REZEPT.webp 480w,
+            /2025/assets/images/rezepte/720/webp/REZEPT.webp 720w,
+            /2025/assets/images/rezepte/1024/webp/REZEPT.webp 1024w,
+            /2025/assets/images/rezepte/1366/webp/REZEPT.webp 1366w,
+            /2025/assets/images/rezepte/1600/webp/REZEPT.webp 1600w,
+            /2025/assets/images/rezepte/1920/webp/REZEPT.webp 1920w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+        >
+
+        <!-- JPEG Fallback -->
+        <img
+          src="/2025/assets/images/rezepte/1024/jpeg/REZEPT.jpg"
+          srcset="
+            /2025/assets/images/rezepte/480/jpeg/REZEPT.jpg 480w,
+            /2025/assets/images/rezepte/720/jpeg/REZEPT.jpg 720w,
+            /2025/assets/images/rezepte/1024/jpeg/REZEPT.jpg 1024w,
+            /2025/assets/images/rezepte/1366/jpeg/REZEPT.jpg 1366w,
+            /2025/assets/images/rezepte/1600/jpeg/REZEPT.jpg 1600w,
+            /2025/assets/images/rezepte/1920/jpeg/REZEPT.jpg 1920w
+          "
+          sizes="(max-width: 900px) 100vw, 40vw"
+          alt="Rezeptbild"
+          class="recipe-image"
+          decoding="async"
+          loading="lazy"
+        >
+
+      </picture>
+
+
+      <!-- Zutaten -->
+      <h4>Zutaten</h4>
+      <ul>
+        <!-- Zutaten -->
+      </ul>
+
+      <!-- Zubereitung -->
+      <h4>Zubereitung</h4>
+      <p>
+        <!-- Zubereitung -->
+      </p>
+
+    </div>
+
+  </div>
+
+</section>

templates/video.txt

@@ -0,0 +1,54 @@
+<!-- ============================================
+     POPUP: STANDARD TAG — TEXT + VIDEO
+     ============================================ -->
+<section class="popup-day popup-3part">
+
+  <div class="popup-header">
+    <h2><!-- TITEL DES TAGES --></h2>
+  </div>
+
+  <div class="popup-body">
+
+    <!-- TEXT -->
+    <div class="story">
+      <!-- DEIN TEXT -->
+    </div>
+
+    <!-- VIDEO -->
+    <div class="addon">
+      <video
+        autoplay
+        playsinline
+        muted
+        loop
+        preload="auto"
+        class="addon-video"
+        poster="/2025/assets/images/dayXX/1024/jpeg/BILD.jpg"
+      >
+
+        <!-- WEBM -->
+        <source src="/2025/assets/videos/nHD/webm/VID.webm" type="video/webm" media="(max-width: 640px)">
+        <source src="/2025/assets/videos/FWVGA/webm/VID.webm" type="video/webm" media="(max-width: 854px)">
+        <source src="/2025/assets/videos/qHD/webm/VID.webm" type="video/webm" media="(max-width: 960px)">
+        <source src="/2025/assets/videos/HD/webm/VID.webm" type="video/webm" media="(max-width: 1280px)">
+        <source src="/2025/assets/videos/HDplus/webm/VID.webm" type="video/webm" media="(max-width: 1600px)">
+        <source src="/2025/assets/videos/FullHD/webm/VID.webm" type="video/webm" media="(max-width: 1920px)">
+        <source src="/2025/assets/videos/1440p/webm/VID.webm" type="video/webm" media="(max-width: 2560px)">
+        <source src="/2025/assets/videos/4K/webm/VID.webm" type="video/webm" media="(min-width: 2561px)">
+
+        <!-- MP4 -->
+        <source src="/2025/assets/videos/nHD/mp4/VID.mp4" type="video/mp4" media="(max-width: 640px)">
+        <source src="/2025/assets/videos/FWVGA/mp4/VID.mp4" type="video/mp4" media="(max-width: 854px)">
+        <source src="/2025/assets/videos/qHD/mp4/VID.mp4" type="video/mp4" media="(max-width: 960px)">
+        <source src="/2025/assets/videos/HD/mp4/VID.mp4" type="video/mp4" media="(max-width: 1280px)">
+        <source src="/2025/assets/videos/HDplus/mp4/VID.mp4" type="video/mp4" media="(max-width: 1600px)">
+        <source src="/2025/assets/videos/FullHD/mp4/VID.mp4" type="video/mp4" media="(max-width: 1920px)">
+        <source src="/2025/assets/videos/1440p/mp4/VID.mp4" type="video/mp4" media="(max-width: 2560px)">
+        <source src="/2025/assets/videos/4K/mp4/VID.mp4" type="video/mp4" media="(min-width: 2561px)">
+
+        Dein Browser unterstützt dieses Video nicht.
+      </video>
+    </div>
+
+  </div>
+</section>