@font-face { font-family: "Bratonien2025"; src: url("../fonts/PinyonScript-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; } /* === Adventstürchen – 2025 Look === */ .door { /* Positionierung & Größe */ position: absolute; top: 20%; /* Testposition, später anpassen */ left: 15%; width: 12%; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; /* Typografie */ font-family: "Bratonien2025", cursive; font-size: 2.3vw; font-weight: 400; color: var(--ci-gold); text-shadow: 0 0 12px rgba(200,170,73,0.55); /* Glasoptik & Rahmen */ background-color: rgba(255,255,255,0.16); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); border: 2px solid var(--ci-gold); border-radius: 12px; box-shadow: 0 0 10px rgba(200,170,73,0.25), inset 0 0 6px rgba(255,255,255,0.18); /* Interaktion */ cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease; } .door:hover { background-color: rgba(247,243,232,0.28); box-shadow: 0 0 16px rgba(200,170,73,0.5), inset 0 0 10px rgba(255,255,255,0.35); transform: scale(1.04); }