/* ========================================================
   Bande d'annonce (patron documenté dans docs/DESIGN_CONTRACT.md).
   Partagée : header canonique public + aperçu admin. Zéro rotation (chrome).
   ======================================================== */
.annonce-band { width: 100%; border-bottom: 2.5px solid var(--ink-warm, #241F17); }
.annonce-band .annonce-inner { max-width: 1100px; margin: 0 auto; padding: .7rem clamp(16px, 4vw, 28px); display: flex; align-items: center; gap: .8rem; }
.annonce-band .annonce-glyphe { flex-shrink: 0; width: 30px; height: 30px; display: grid; place-items: center; }
.annonce-band .annonce-glyphe .g-cercle,
.annonce-band .annonce-glyphe .g-triangle { width: 26px; height: 26px; display: grid; place-items: center; border: 2px solid var(--ink-warm, #241F17); font-family: var(--font-serif-v5, 'Young Serif', Georgia, serif); font-size: 14px; line-height: 1; color: var(--ink-warm, #241F17); }
.annonce-band .annonce-glyphe .g-cercle { border-radius: 50%; }
.annonce-band .annonce-glyphe .g-triangle { border: none; }
.annonce-band .annonce-glyphe svg { width: 24px; height: 24px; }
.annonce-band .annonce-texte { flex: 1 1 auto; margin: 0; font-family: var(--font-sans-v5, 'Instrument Sans', system-ui, sans-serif); font-size: .95rem; line-height: 1.45; color: var(--ink-warm, #241F17); word-break: break-word; }
.annonce-band .annonce-lien { color: var(--accent, #1C7A53); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.annonce-band .annonce-lien:hover { color: var(--accent-deep, #12523A); }
.annonce-band .annonce-fermer { flex-shrink: 0; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; border: 2px solid var(--ink-warm, #241F17); background: var(--white-warm, #FFFDF8); color: var(--ink-warm, #241F17); cursor: pointer; font-size: 1.05rem; line-height: 1; }
.annonce-band .annonce-fermer:hover { transform: translate(1px, 1px); }
.annonce-band a:focus-visible, .annonce-band button:focus-visible { outline: 3px solid var(--rouge, #C25438); outline-offset: 2px; border-radius: 8px; }

/* Styles par type */
.annonce-band.annonce-info { background: var(--neutre, #EAE2D0); }
.annonce-band.annonce-evenement { background: var(--jaune-soft, #F6E7C4); }
.annonce-band.annonce-urgent { background: var(--rouge-soft, #F3E0D4); }
.annonce-band.annonce-urgent .annonce-texte { font-weight: 700; }
.annonce-band.annonce-urgent .g-triangle { color: var(--rouge, #C25438); }

@media (max-width: 520px) {
  .annonce-band .annonce-inner { align-items: flex-start; }
  .annonce-band .annonce-glyphe { margin-top: 2px; }
}