:root {
    --banner-bg:    #A30C01;
    --banner-text:  #F2F2F2;
  }
  
  /* Bandeau */
  #announcement-banner {
    position: fixed;
    top: 0; left: 0; right: 0;
    background: var(--banner-bg);
    color: var(--banner-text);
    z-index: 10000;
    overflow: hidden;
    display: none;
  }
  body.has-announcement {
    padding-top: 3rem;
  }
  #announcement-banner .banner-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0.5rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .banner-text {
    font-size: 1rem;
    line-height: 1.4;
  }
  @media (min-width: 769px) {
    .banner-text {
      white-space: nowrap;
      overflow: hidden;
      display: inline-block;
      animation: marquee 15s linear infinite;
    }
    .banner-text::before,
    .banner-text::after {
      content: '   ';
    }
  }
  @keyframes marquee {
    from { transform: translateX(100%); }
    to   { transform: translateX(-100%); }
  }
  #banner-close {
    background: transparent;
    border: none;
    color: var(--banner-text);
    font-size: 1.25rem;
    cursor: pointer;
  }