.website-announcement{box-sizing:border-box;width:min(540px,calc(100% - 24px));max-height:min(92dvh,760px);padding:0;border:1px solid rgba(255,244,229,.25);border-radius:18px;background:#1d252c;color:#fff4e5;box-shadow:0 24px 75px #0008;overflow:auto;font:400 14px/1.5 'Avenir Next','Segoe UI',sans-serif;overscroll-behavior:contain}
.website-announcement::backdrop{background:#0c1019a6;backdrop-filter:blur(3px)}
.website-announcement-close{position:absolute;z-index:1;top:8px;right:8px;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:#141c21b8;color:#fff4e5;font:400 27px/1 'Segoe UI',sans-serif;cursor:pointer}
.website-announcement-close:hover{background:#141c21}
.website-announcement-phones{position:relative;height:210px;overflow:hidden;background:linear-gradient(135deg,#20313b,#35414a 48%,#402d31);border-bottom:1px solid #fff2}
.website-announcement-phones:after{content:'';position:absolute;inset:auto 0 0;height:30px;background:linear-gradient(transparent,#1d252c)}
.website-announcement-phone{position:absolute;box-sizing:border-box;width:112px;aspect-ratio:.47;padding:5px;border:1px solid #b6b9b9;border-radius:23px;background:linear-gradient(110deg,#0a0b0e,#7c8183 6%,#1a1c1f 15%,#363b3e 89%,#a9aca9 97%,#151718);box-shadow:inset 0 0 0 2px #07090b,0 18px 33px #0009,2px 2px 0 #fff3;transform-origin:bottom center}
.website-announcement-phone:before{content:'';position:absolute;z-index:2;top:8px;left:50%;width:37%;height:9px;transform:translateX(-50%);border-radius:20px;background:#07090b;box-shadow:0 1px 1px #fff3}
.website-announcement-phone:after{content:'';position:absolute;top:25%;left:-3px;width:2px;height:22px;border-radius:2px;background:#a6a9a9;box-shadow:0 22px 0 #818585}
.website-announcement-phone-screen{height:100%;overflow:hidden;border-radius:18px;background:#101317}
.website-announcement-phone-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.website-announcement-phone-galerie{left:calc(50% - 150px);top:34px;transform:rotate(-13deg) scale(.86)}
.website-announcement-phone-start{z-index:2;left:calc(50% - 56px);top:13px;width:126px;transform:rotate(1deg)}
.website-announcement-phone-challenges{left:calc(50% + 71px);top:32px;transform:rotate(12deg) scale(.86)}
.website-announcement-content{padding:20px 24px 22px}
.website-announcement h2{margin:0 0 12px;color:inherit;font:500 23px/1.2 'Avenir Next','Segoe UI',sans-serif;letter-spacing:-.025em}
.website-announcement-copy p{margin:0 0 9px;color:#eee5db;font:inherit;white-space:pre-line}
.website-announcement-copy p:last-child{margin-bottom:0}
.website-announcement-note{margin:14px 0 0;color:#fff4e5;font-weight:500}
.website-announcement-actions{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;margin-top:17px}
.website-announcement-actions :is(button,a){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 13px;border-radius:8px;font:500 13px/1.3 'Avenir Next','Segoe UI',sans-serif;text-decoration:none;cursor:pointer}
.website-announcement .website-announcement-primary{border:1px solid #ebc59b!important;background:#ebc59b!important;color:#24201b!important}
.website-announcement-secondary{border:1px solid transparent;background:transparent;color:#f2d0ac}
.website-announcement-secondary:hover{text-decoration:underline}
.website-announcement :focus-visible{outline:2px solid #f4d19d;outline-offset:2px}
@media(max-width:420px){.website-announcement{width:calc(100% - 16px)}.website-announcement-phones{height:168px}.website-announcement-phone-start{left:calc(50% - 25px);top:8px;transform:scale(.78)}.website-announcement-phone-galerie{left:calc(50% - 118px);top:30px;transform:rotate(-12deg) scale(.68)}.website-announcement-phone-challenges{display:none}.website-announcement-content{padding:15px 17px 17px}.website-announcement h2{font-size:20px;margin-bottom:9px}.website-announcement-copy p{margin-bottom:6px}.website-announcement-note{margin-top:10px}.website-announcement-actions{margin-top:12px}}
@media(max-height:640px){.website-announcement-phones{height:130px}.website-announcement-phone{top:6px}}
@media(max-width:360px) and (max-height:620px){.website-announcement-phones{height:104px}.website-announcement-content{padding:13px 15px}.website-announcement-copy p{margin-bottom:5px}.website-announcement-note{margin-top:8px}.website-announcement-actions{gap:6px;margin-top:10px}.website-announcement-actions :is(button,a){padding-inline:9px;font-size:12px}}
/* Startseite: schmale, nicht blockierende Hinweiszeile (W3) – themenneutral, eine Zeile, Link und ×. */
.website-announcement-bar{position:relative;z-index:30;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;min-height:40px;margin:0;padding:4px 44px 4px 16px;background:#1d252c;border-bottom:1px solid rgba(255,244,229,.16);color:#fff4e5;font:400 13px/1.35 'Avenir Next','Segoe UI',sans-serif;text-align:center}
.website-announcement-bar p{margin:0;color:inherit;font:inherit}
.website-announcement-bar a{color:#f2d0ac;font-weight:500;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.website-announcement-bar a:hover{color:#fff4e5}
html .website-announcement-bar .website-announcement-bar-close{position:absolute;top:50%;right:2px;display:grid;place-items:center;width:40px;height:40px;min-height:40px;margin:0;padding:0;border:0!important;border-radius:50%;background:transparent!important;color:#fff4e5;font:400 22px/1 'Segoe UI',sans-serif;box-shadow:none;transform:translateY(-50%);cursor:pointer}
html .website-announcement-bar .website-announcement-bar-close:hover{background:#ffffff1a!important}
.website-announcement-bar :focus-visible{outline:2px solid #f4d19d;outline-offset:2px}
@media(max-width:420px){.website-announcement-bar{font-size:12px;padding-left:12px}}
@media(prefers-reduced-motion:no-preference){.website-announcement[open]{animation:website-announcement-in .18s ease-out}@keyframes website-announcement-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}
.website-announcement-bar p{text-wrap:balance}
/* F3: Zeile steht im Server-HTML; ausgeblendet, wenn schon gesehen oder Gästelink. */
html.announcement-hidden .website-announcement-bar{display:none}