/* Place this stylesheet AFTER mainpage.css. Keeps the existing fixed header unchanged. */
:root { --pm-announcement-height: 0px; }
.pm-announcement-bar {
    position: fixed;
    top: 123px; left: 0; right: 0;
    z-index: 9998;
    padding: 8px 20px;
    min-height: 42px;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 2px 5px rgba(0,0,0,.12);
}
.pm-announcement-content {
    display: flex; flex-wrap: wrap; gap: 8px 12px;
    align-items: center; justify-content: center;
    font-size: 14px; line-height: 1.4; text-align: center;
}
.pm-announcement-content a { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.pm-announcement-content a:hover { color: #173b60; }
.pm-announcement-content a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
/* Existing site body has desktop padding-top:150px, mobile:182px. */
body { padding-top: calc(150px + var(--pm-announcement-height)); }
html { scroll-padding-top: calc(200px + var(--pm-announcement-height)); }
@media (max-width: 991.98px) {
    .pm-announcement-bar { top: 182px; padding: 9px 12px; }
    .pm-announcement-content { font-size: 12px; gap: 6px; }
    body { padding-top: calc(182px + var(--pm-announcement-height)); }
    html { scroll-padding-top: calc(220px + var(--pm-announcement-height)); }
}
