adventskalender/2025/css/main.css aktualisiert

adventskalender/2025/css/main.css

@@ -127,16 +127,16 @@
   z-index: 5; /* über den Flügeln */
 }
 
-/* === DOPPELTÜR (für 6 und 24) – gleicher Look wie alle Türen, aber zwei Flügel === */
+/* === Doppeltüren (6 & 24) – gleiche Optik, goldene Mittelnaht === */
+
 .door.double {
-  /* Basis wie deine anderen Türen */
+  /* identisch zu normalen Türen */
   position: absolute;
   display: flex;
   justify-content: center;
   align-items: center;
   aspect-ratio: 1 / 1;
 
-  /* gleicher Hintergrund wie alle anderen + goldene Naht in der Mitte */
   background:
     linear-gradient(
       90deg,
@@ -158,51 +158,22 @@
     0 0 10px color-mix(in srgb, var(--ci-gold) 40%, transparent),
     inset 0 0 6px rgba(255,255,255,0.18);
 
-  /* Animation wie bei den anderen */
   transition:
     transform 0.6s ease,
     box-shadow 0.3s ease,
     background 0.25s ease;
 
-  /* damit die Flügel nach außen drehen können */
-  transform-origin: center;
-  overflow: visible;
+  transform-style: preserve-3d;
+  perspective: 800px;
 }
 
-/* Zahl bleibt oben drüber */
+/* Zahl bleibt oben sichtbar */
 .door.double span {
   position: relative;
   z-index: 5;
 }
 
-/* zwei Flügel aus demselben Look wie die Tür */
-.door.double::before,
-.door.double::after {
-  content: "";
-  position: absolute;
-  top: 0;
-  width: 50%;
-  height: 100%;
-  background: inherit;
-  border-radius: inherit;
-  backface-visibility: hidden;
-  transition: transform 0.6s ease;
-  z-index: 1;
-}
-
-/* linker Flügel – Scharnier links */
-.door.double::before {
-  left: 0;
-  transform-origin: left center;
-}
-
-/* rechter Flügel – Scharnier rechts */
-.door.double::after {
-  right: 0;
-  transform-origin: right center;
-}
-
-/* HOVER (geschlossen) – genauso wie bei den anderen, nur mit Naht */
+/* Hover – exakt wie bei den anderen Türen */
 .door.double:hover {
   transform: scale(1.05);
   background:
@@ -222,15 +193,15 @@
     inset 0 0 10px rgba(255,255,255,0.25);
 }
 
-/* GEÖFFNET: beide Flügel klappen nach außen */
-.door.double.open::before {
-  transform: rotateY(-115deg);
-}
-.door.double.open::after {
-  transform: rotateY(115deg);
+/* Öffnen – mittige Bewegung, leicht nach außen geneigt */
+.door.double.open {
+  transform-origin: center;
+  transform: rotateY(-8deg);
+  box-shadow:
+    0 0 14px color-mix(in srgb, var(--ci-gold) 45%, transparent),
+    inset 0 0 10px rgba(255,255,255,0.2);
 }
 
-/* Hover auch im offenen Zustand */
 .door.double.open:hover {
-  transform: scale(1.05);
+  transform: rotateY(-8deg) scale(1.05);
 }