adventskalender/2025/css/main.css aktualisiert

adventskalender/2025/css/main.css

@@ -103,29 +103,31 @@
   z-index: 5; /* über den Flügeln */
 }
 
-/* beide Flügel teilen sich die Türhälfte */
-.door.double .door-left,
-.door.double .door-right {
-  z-index: 1; /* unter der Zahl */
+/* === Doppeltür-Optik ohne zwei Flächen === */
+
+/* Grundstil: Mittelnaht sichtbar */
+.door.double {
   position: absolute;
-  top: 0;
-  width: 50%;
-  height: 100%;
-  background: inherit;
-  border: inherit;
-  border-radius: inherit;
-  box-sizing: border-box;
-  backface-visibility: hidden;
+  background: linear-gradient(
+    90deg,
+    color-mix(in srgb, var(--ci-darkgreen) 45%, transparent) 49%,
+    color-mix(in srgb, var(--ci-gold) 60%, transparent) 50%,
+    color-mix(in srgb, var(--ci-blue) 45%, transparent) 51%
+  );
+  backdrop-filter: blur(6px);
+  -webkit-backdrop-filter: blur(6px);
+  border: 2px solid var(--ci-gold);
+  border-radius: 12px;
+  box-shadow:
+    0 0 10px color-mix(in srgb, var(--ci-gold) 40%, transparent),
+    inset 0 0 6px rgba(255,255,255,0.18);
 }
 
-/* linker Flügel auf der linken Seite */
-.door.double .door-left {
-  left: 0;
-  border-right: none; /* keine doppelte Kante in der Mitte */
-}
-
-/* rechter Flügel auf der rechten Seite */
-.door.double .door-right {
-  right: 0;
-  border-left: none;
+/* Öffnungsanimation */
+.door.double.open {
+  transform-origin: center;
+  transform: rotateY(-110deg);
+  box-shadow:
+    0 0 14px color-mix(in srgb, var(--ci-gold) 45%, transparent),
+    inset 0 0 10px rgba(255,255,255,0.2);
 }