.homepage-welcome {
    --font-body: system-ui, -apple-system, "Segoe UI", sans-serif;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    min-height: 100vh;
    z-index: 7000;
    display: grid;
    place-items: center;
    overflow: hidden;
    pointer-events: none;
}

.homepage-welcome__backdrop {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 50% 44%, rgba(48, 104, 143, .34), transparent 31%),
        linear-gradient(135deg, rgba(8, 13, 21, .98), rgba(14, 25, 37, .96));
    background-size: 125% 125%, 100% 100%;
    animation: homepage-welcome-background 12s ease-in-out infinite alternate;
    opacity: 1;
    transition: opacity 1.4s ease;
}

@keyframes homepage-welcome-background {
    from { background-position: 42% 42%, 0 0; }
    to { background-position: 58% 54%, 0 0; }
}

.homepage-welcome__particles {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    transition: opacity 1.4s ease;
}

.homepage-welcome__particles i {
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(212, 175, 55, .68);
    box-shadow: 0 0 12px rgba(64, 214, 248, .72);
    opacity: 0;
    animation: homepage-welcome-particle 7s ease-in-out infinite;
}

.homepage-welcome__particles i:nth-child(1) { left: 9%; top: 78%; animation-delay: -1s; }
.homepage-welcome__particles i:nth-child(2) { left: 17%; top: 26%; animation-delay: -4s; transform: scale(.6); }
.homepage-welcome__particles i:nth-child(3) { left: 28%; top: 88%; animation-delay: -2s; transform: scale(1.3); }
.homepage-welcome__particles i:nth-child(4) { left: 39%; top: 18%; animation-delay: -5s; transform: scale(.7); }
.homepage-welcome__particles i:nth-child(5) { left: 51%; top: 80%; animation-delay: -3s; transform: scale(.9); }
.homepage-welcome__particles i:nth-child(6) { left: 63%; top: 32%; animation-delay: -6s; transform: scale(1.2); }
.homepage-welcome__particles i:nth-child(7) { left: 72%; top: 73%; animation-delay: -2.5s; transform: scale(.6); }
.homepage-welcome__particles i:nth-child(8) { left: 82%; top: 20%; animation-delay: -4.5s; transform: scale(1.1); }
.homepage-welcome__particles i:nth-child(9) { left: 91%; top: 63%; animation-delay: -1.5s; transform: scale(.75); }
.homepage-welcome__particles i:nth-child(10) { left: 46%; top: 45%; animation-delay: -5.5s; transform: scale(.5); }

@keyframes homepage-welcome-particle {
    0%, 100% { opacity: 0; translate: 0 22px; }
    24%, 76% { opacity: .8; }
    50% { translate: 14px -30px; }
}

/* Die Jahreszeit richtet sich nach dem lokalen Kalendermonat; Weihnachten
   überschreibt sie am 24.–26. Dezember mit eigenen Motiven. */
.homepage-welcome--summer .homepage-welcome__backdrop {
    background:
        radial-gradient(circle at 50% 44%, rgba(73, 133, 106, .34), transparent 31%),
        linear-gradient(135deg, rgba(12, 26, 29, .98), rgba(24, 40, 38, .96));
}

.homepage-welcome--summer .homepage-welcome__backdrop::after {
    content: "";
    position: absolute;
    top: 10%;
    right: 12%;
    width: clamp(76px, 9vw, 138px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 231, 143, .76) 0 18%, rgba(238, 182, 66, .24) 43%, transparent 70%);
    box-shadow: 0 0 45px rgba(238, 182, 66, .18);
    opacity: .72;
    animation: homepage-welcome-sun 8s ease-in-out infinite alternate;
}

.homepage-welcome--summer .homepage-welcome__particles i {
    background: rgba(255, 206, 98, .72);
    box-shadow: 0 0 14px rgba(255, 190, 76, .58);
}

@keyframes homepage-welcome-sun {
    from { transform: translateY(0) scale(.96); filter: brightness(.9); }
    to { transform: translateY(10px) scale(1.04); filter: brightness(1.16); }
}

.homepage-welcome--autumn .homepage-welcome__backdrop {
    background:
        radial-gradient(circle at 50% 44%, rgba(122, 64, 35, .34), transparent 31%),
        linear-gradient(135deg, rgba(30, 18, 16, .98), rgba(48, 31, 25, .96));
}

.homepage-welcome--autumn .homepage-welcome__particles i {
    width: 11px;
    height: 8px;
    border-radius: 80% 15% 80% 15%;
    background: #d47737;
    box-shadow: 0 0 10px rgba(201, 82, 34, .28);
    animation: homepage-welcome-falling-leaf 7.5s linear infinite;
}

.homepage-welcome--autumn .homepage-welcome__particles i:nth-child(3n) { background: #b9452c; }
.homepage-welcome--autumn .homepage-welcome__particles i:nth-child(3n + 1) { background: #d7a139; }

@keyframes homepage-welcome-falling-leaf {
    0% { opacity: 0; translate: -5vw -28vh; rotate: -22deg; }
    14% { opacity: .82; }
    86% { opacity: .72; }
    100% { opacity: 0; translate: 10vw 110vh; rotate: 350deg; }
}

.homepage-welcome--winter .homepage-welcome__backdrop {
    background:
        radial-gradient(circle at 50% 44%, rgba(104, 156, 190, .28), transparent 31%),
        linear-gradient(135deg, rgba(8, 17, 28, .99), rgba(20, 35, 53, .97));
}

.homepage-welcome--winter .homepage-welcome__particles i {
    width: 7px;
    height: 7px;
    background: rgba(232, 248, 255, .88);
    box-shadow: 0 0 10px rgba(180, 226, 255, .52);
    animation: homepage-welcome-snowfall 8s linear infinite;
}

@keyframes homepage-welcome-snowfall {
    0% { opacity: 0; translate: -4vw -22vh; }
    16% { opacity: .9; }
    84% { opacity: .82; }
    100% { opacity: 0; translate: 6vw 108vh; }
}

.homepage-welcome--christmas .homepage-welcome__backdrop {
    background:
        radial-gradient(circle at 50% 42%, rgba(149, 41, 48, .32), transparent 34%),
        linear-gradient(135deg, rgba(21, 12, 19, .99), rgba(48, 17, 29, .97));
}

.homepage-welcome--christmas .homepage-welcome__particles i {
    width: 6px;
    height: 6px;
    background: rgba(255, 244, 214, .92);
    box-shadow: 0 0 12px rgba(255, 202, 91, .58);
    animation: homepage-welcome-christmas-snow 8.5s linear infinite;
}

.homepage-welcome--christmas .homepage-welcome__particles i:nth-child(3n) {
    background: rgba(255, 208, 95, .9);
}

@keyframes homepage-welcome-christmas-snow {
    0% { opacity: 0; translate: -4vw -22vh; }
    16% { opacity: .88; }
    84% { opacity: .78; }
    100% { opacity: 0; translate: 7vw 108vh; }
}

.homepage-welcome__lights {
    position: fixed;
    z-index: 4;
    top: 0;
    right: 0;
    left: 0;
    height: clamp(72px, 13vh, 138px);
    pointer-events: none;
    transition: opacity .55s ease;
}

.homepage-welcome__lights--departing {
    opacity: 0;
}

.homepage-welcome__lights::before {
    content: "";
    position: absolute;
    top: -92px;
    right: -4vw;
    left: -4vw;
    height: clamp(132px, 22vh, 224px);
    border-bottom: 2px solid rgba(26, 42, 31, .94);
    border-radius: 0 0 50% 50%;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .45);
}

.homepage-welcome__lights i {
    --bulb-color: #ef5a55;
    position: absolute;
    top: var(--bulb-drop);
    left: var(--bulb-left);
    width: 11px;
    height: 17px;
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 45% 45% 52% 52%;
    background: var(--bulb-color);
    box-shadow: 0 0 8px var(--bulb-color), 0 0 18px color-mix(in srgb, var(--bulb-color) 58%, transparent);
    transform: translateX(-50%);
    animation: homepage-welcome-bulb-pulse 1.9s ease-in-out infinite alternate;
}

.homepage-welcome__lights i::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 50%;
    width: 7px;
    height: 5px;
    border-radius: 2px 2px 0 0;
    background: #1b2920;
    transform: translateX(-50%);
}

.homepage-welcome__lights i:nth-child(1) { --bulb-left: 3%; --bulb-drop: 22px; --bulb-color: #e95050; animation-delay: -.2s; }
.homepage-welcome__lights i:nth-child(2) { --bulb-left: 10%; --bulb-drop: 43px; --bulb-color: #4ccf82; animation-delay: -1s; }
.homepage-welcome__lights i:nth-child(3) { --bulb-left: 17%; --bulb-drop: 60px; --bulb-color: #5ea8f7; animation-delay: -.5s; }
.homepage-welcome__lights i:nth-child(4) { --bulb-left: 24%; --bulb-drop: 75px; --bulb-color: #f5c84b; animation-delay: -1.4s; }
.homepage-welcome__lights i:nth-child(5) { --bulb-left: 31%; --bulb-drop: 86px; --bulb-color: #e95050; animation-delay: -.8s; }
.homepage-welcome__lights i:nth-child(6) { --bulb-left: 38%; --bulb-drop: 94px; --bulb-color: #4ccf82; animation-delay: -1.6s; }
.homepage-welcome__lights i:nth-child(7) { --bulb-left: 45%; --bulb-drop: 99px; --bulb-color: #5ea8f7; animation-delay: -.35s; }
.homepage-welcome__lights i:nth-child(8) { --bulb-left: 52%; --bulb-drop: 101px; --bulb-color: #f5c84b; animation-delay: -1.1s; }
.homepage-welcome__lights i:nth-child(9) { --bulb-left: 59%; --bulb-drop: 99px; --bulb-color: #e95050; animation-delay: -.7s; }
.homepage-welcome__lights i:nth-child(10) { --bulb-left: 66%; --bulb-drop: 94px; --bulb-color: #4ccf82; animation-delay: -1.5s; }
.homepage-welcome__lights i:nth-child(11) { --bulb-left: 73%; --bulb-drop: 86px; --bulb-color: #5ea8f7; animation-delay: -.1s; }
.homepage-welcome__lights i:nth-child(12) { --bulb-left: 80%; --bulb-drop: 75px; --bulb-color: #f5c84b; animation-delay: -1.25s; }
.homepage-welcome__lights i:nth-child(13) { --bulb-left: 87%; --bulb-drop: 60px; --bulb-color: #e95050; animation-delay: -.6s; }
.homepage-welcome__lights i:nth-child(14) { --bulb-left: 94%; --bulb-drop: 42px; --bulb-color: #4ccf82; animation-delay: -1.7s; }

@keyframes homepage-welcome-bulb-pulse {
    from { opacity: .58; filter: brightness(.75); transform: translateX(-50%) scale(.92); }
    to { opacity: 1; filter: brightness(1.28); transform: translateX(-50%) scale(1.08); }
}

.homepage-welcome__tree {
    position: fixed;
    z-index: 2;
    right: clamp(18px, 6vw, 110px);
    bottom: clamp(18px, 5vh, 74px);
    width: clamp(120px, 17vw, 270px);
    max-height: 42vh;
    object-fit: contain;
    object-position: bottom right;
    filter: drop-shadow(0 18px 26px rgba(0, 0, 0, .52));
    pointer-events: none;
    animation: homepage-welcome-tree-glow 3.8s ease-in-out infinite alternate;
    transition: opacity .6s ease, transform .7s ease;
}

.homepage-welcome__tree--departing {
    opacity: 0;
    transform: translateY(16px) scale(.96);
}

@keyframes homepage-welcome-tree-glow {
    from { filter: drop-shadow(0 18px 26px rgba(0, 0, 0, .52)) brightness(.92); }
    to { filter: drop-shadow(0 18px 32px rgba(255, 190, 84, .24)) brightness(1.08); }
}

.homepage-welcome--spring .homepage-welcome__backdrop {
    background:
        radial-gradient(circle at 50% 44%, rgba(129, 115, 162, .3), transparent 31%),
        linear-gradient(135deg, rgba(17, 20, 34, .98), rgba(37, 34, 57, .96));
}

.homepage-welcome--spring .homepage-welcome__particles i {
    width: 10px;
    height: 7px;
    border-radius: 75% 20% 75% 20%;
    background: rgba(255, 185, 212, .9);
    box-shadow: 0 0 10px rgba(255, 158, 203, .34);
    animation: homepage-welcome-blossom 8.5s ease-in-out infinite;
}

.homepage-welcome--spring .homepage-welcome__particles i:nth-child(3n) { background: rgba(222, 183, 255, .88); }

@keyframes homepage-welcome-blossom {
    0% { opacity: 0; translate: -8vw -18vh; rotate: -18deg; }
    15% { opacity: .78; }
    82% { opacity: .72; }
    100% { opacity: 0; translate: 12vw 104vh; rotate: 210deg; }
}

.homepage-welcome__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 210px 32px 32px;
    text-align: center;
    color: var(--text);
    opacity: 0;
    transform: translateY(14px) scale(.97);
    transition: opacity .55s ease, transform .7s cubic-bezier(.2, .8, .2, 1);
}

.homepage-welcome--visible .homepage-welcome__content {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.homepage-welcome__logo {
    position: fixed;
    z-index: 3;
    left: 50%;
    top: calc(50% - 150px);
    width: 154px;
    height: 154px;
    object-fit: cover;
    border: 0;
    border-radius: 30px;
    box-shadow: 0 0 0 7px rgba(64, 214, 248, .05), 0 18px 52px rgba(0, 0, 0, .48);
    transform: translate(-50%, -50%);
    transform-origin: center;
}

.homepage-welcome__season {
    position: fixed;
    z-index: 3;
    top: calc(50% - 254px);
    left: 50%;
    margin: 0;
    color: #f2c94c;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .22em;
    line-height: 1;
    text-shadow: 0 2px 14px rgba(0, 0, 0, .72);
    text-transform: uppercase;
    transform: translate(-50%, -50%) translateY(8px);
    opacity: 0;
    transition: opacity .22s ease, transform .28s ease;
}

.homepage-welcome--visible .homepage-welcome__season {
    animation: homepage-welcome-season-enter .65s .2s ease forwards;
}

.homepage-welcome__season--departing {
    animation: none !important;
    opacity: 0;
    transform: translate(-50%, -50%) translateY(-4px);
}

@keyframes homepage-welcome-season-enter {
    to {
        opacity: .92;
        transform: translate(-50%, -50%) translateY(0);
    }
}

.homepage-welcome__logo--departing {
    animation: homepage-welcome-logo-depart 1.15s cubic-bezier(.35, 0, .2, 1) forwards;
}

@keyframes homepage-welcome-logo-depart {
    to {
        transform: translate(
            calc(-50% + var(--welcome-logo-move-x)),
            calc(-50% + var(--welcome-logo-move-y))
        ) scale(var(--welcome-logo-scale));
    }
}

.homepage-welcome__kicker {
    margin: 0 0 11px;
    color: var(--gold);
    font: 800 11px/1.2 var(--font-body);
    letter-spacing: .24em;
}

.homepage-welcome h1 {
    margin: 0;
    color: var(--text);
    font: 800 clamp(30px, 5vw, 58px)/1.06 var(--font-body);
    letter-spacing: -.035em;
    text-shadow: 0 4px 24px rgba(0, 0, 0, .42);
}

.homepage-welcome__meta {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-top: 20px;
    color: #b8c5d3;
    font: 700 12px/1.2 var(--font-body);
    letter-spacing: .04em;
}

.homepage-welcome__meta i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--gold);
}

.homepage-welcome--visible .homepage-welcome__content--departing {
    opacity: 0;
    transform: translateY(6px) scale(.96);
    transition-duration: .35s;
}

.homepage-welcome__backdrop--departing {
    opacity: 0;
}

.homepage-welcome__particles--departing {
    opacity: 0;
}

@media (max-width: 560px) {
    .homepage-welcome__content { padding: 165px 22px 22px; }
    .homepage-welcome__logo { width: 118px; height: 118px; border-radius: 24px; top: calc(50% - 125px); }
    .homepage-welcome__season { top: calc(50% - 210px); font-size: 9px; }
    .homepage-welcome__lights { height: 98px; }
    .homepage-welcome__lights::before { top: -72px; height: 145px; }
    .homepage-welcome__lights i { width: 8px; height: 13px; }
    .homepage-welcome__lights i::before { top: -4px; width: 5px; height: 4px; }
    .homepage-welcome__lights i:nth-child(n) { --bulb-drop: clamp(17px, 12vw, 52px); }
    .homepage-welcome__tree { right: 12px; bottom: 20px; width: clamp(92px, 30vw, 150px); max-height: 28vh; }
    .homepage-welcome__kicker { margin-top: 0; font-size: 9px; }
    .homepage-welcome__meta { flex-direction: column; gap: 6px; font-size: 11px; }
    .homepage-welcome__meta i { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .homepage-welcome { display: none; }
}

.homepage-welcome__logo--fading { opacity: 0; transition: opacity .55s ease; }
.public-nav a.public-nav__welcome-wave { animation: public-welcome-wave var(--welcome-wave-duration, 1s) ease-out both; }
.public-header.public-header--welcome-focus { z-index: 7001; }
.public-portal.public-portal--welcome-focus { animation: public-welcome-wave 2.5s ease-in-out both; }
@keyframes public-welcome-wave {
    0%, 100% { color: inherit; box-shadow: none; }
    40% { color: #dfbc67; box-shadow: inset 0 -2px #dfbc67, 0 0 18px #dfbc6726; }
}
@media (prefers-reduced-motion: reduce) {
    .public-nav a.public-nav__welcome-wave, .public-portal.public-portal--welcome-focus { animation: none; }
}
