adventskalender/2025/css/main.css aktualisiert

adventskalender/2025/css/main.css

@@ -14,7 +14,6 @@
   align-items: center;
   justify-content: center;
   aspect-ratio: 1 / 1;
-
   background: linear-gradient(
     180deg,
     color-mix(in srgb, var(--ci-darkgreen) 35%, transparent),
@@ -22,31 +21,26 @@
   );
   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);
-
   font-family: "Bratonien2025", cursive;
   font-size: 2.3vw;
   color: var(--ci-gold);
   text-shadow:
     0 0 3px rgba(0,0,0,0.6),
     0 0 8px rgba(0,0,0,0.4);
-
   cursor: pointer;
   transition:
     transform 0.6s ease,
     box-shadow 0.3s ease,
     background 0.25s ease;
-
   transform-style: preserve-3d;
   perspective: 800px;
 }
 
-/* === Hover (Glitzer/Glow) === */
 .door:hover,
 .door.hover-proxy {
   transform: scale(1.05);
@@ -60,12 +54,10 @@
     inset 0 0 10px rgba(255,255,255,0.25);
 }
 
-/* === Scharniere === */
 .door.hinge-left  { transform-origin: left center; }
 .door.hinge-right { transform-origin: right center; }
 .door.double      { transform-origin: center; }
 
-/* === Tür öffnen (Scharnierseitig) === */
 .door.open.hinge-left {
   --door-rotation: -115deg;
   transform: rotateY(var(--door-rotation));
@@ -82,7 +74,6 @@
     inset 0 0 10px rgba(255,255,255,0.2);
 }
 
-/* === Hover über geöffnete Tür: bleibt offen, leuchtet nur === */
 .door.open:hover,
 .door.open.hover-proxy {
   transform: rotateY(var(--door-rotation)) scale(1.05);
@@ -91,57 +82,14 @@
     inset 0 0 10px rgba(255,255,255,0.25);
 }
 
-/* === Doppeltüren (6 & 24) === */
 .door.double {
-  justify-content: center;
-  align-items: center;
-  background:
-    linear-gradient(
-      90deg,
-      transparent 49.5%,
-      color-mix(in srgb, var(--ci-gold) 80%, transparent) 50%,
-      transparent 50.5%
-    ),
-    linear-gradient(
-      180deg,
-      color-mix(in srgb, var(--ci-darkgreen) 35%, transparent),
-      color-mix(in srgb, var(--ci-blue) 35%, transparent)
-    );
-}
-
-.door.double:hover,
-.door.double.hover-proxy {
-  transform: scale(1.05);
-  background:
-    linear-gradient(
-      90deg,
-      transparent 49.5%,
-      color-mix(in srgb, var(--ci-gold) 80%, transparent) 50%,
-      transparent 50.5%
-    ),
-    linear-gradient(
-      180deg,
-      color-mix(in srgb, var(--ci-gold) 20%, var(--ci-darkgreen)),
-      color-mix(in srgb, var(--ci-creamwhite) 15%, var(--ci-blue))
-    );
-  box-shadow:
-    0 0 18px color-mix(in srgb, var(--ci-gold) 50%, transparent),
-    inset 0 0 10px rgba(255,255,255,0.25);
-}
-
-.door.double.open {
-  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);
-}
-
-.door.double.open:hover,
-.door.double.open.hover-proxy {
-  transform: rotateY(-8deg) scale(1.05);
-  box-shadow:
-    0 0 18px color-mix(in srgb, var(--ci-gold) 50%, transparent),
-    inset 0 0 10px rgba(255,255,255,0.25);
+  position: absolute;
+  display: flex;
+  align-items: stretch;
+  justify-content: space-between;
+  perspective: 800px;
+  border-radius: 12px;
+  overflow: visible;
 }
 
 .door.double .door-number {
@@ -159,7 +107,6 @@
     0 0 8px rgba(0, 0, 0, 0.4);
 }
 
-/* === Offenes Türchen – realistische Folie === */
 .openfield {
   position: absolute;
   display: block;
@@ -175,7 +122,6 @@
     background 0.4s ease;
 }
 
-/* Sichtbar, wenn Tür offen */
 .door.open + .openfield {
   opacity: 1;
   pointer-events: auto;
@@ -200,7 +146,6 @@
   transform: translateZ(-1px);
 }
 
-/* Hover über offene Felder */
 .door.open + .openfield:hover,
 .openfield.hover-proxy {
   transform: scale(1.05);
@@ -217,7 +162,6 @@
     inset 0 0 10px rgba(255,255,255,0.25);
 }
 
-/* wenn die geöffnete Tür selbst gehovered wird, soll das offene Feld mitziehen */
 .door.open:hover + .openfield {
   transform: scale(1.05);
   background:
@@ -280,14 +224,4 @@
 }
 
 .fluegel.open.left  { --fluegel: -115deg; }
-.fluegel.open.right { --fluegel: 115deg; }
-
-.door.double {
-  position: absolute;
-  display: flex;
-  align-items: stretch;
-  justify-content: space-between;
-  perspective: 800px;
-  border-radius: 12px;
-  overflow: visible;
-}
+.fluegel.open.right { --fluegel: 115deg; }