/* ============================================================
   OTCFin CMS — public-facing styles (announcements banner).
   Uses the site's existing design tokens (var(--...)) with
   safe fallbacks so it renders correctly on every page.
   ============================================================ */

.cms-announcements {
  position: fixed;
  top: 64px; /* below the fixed 64px nav */
  left: 0;
  right: 0;
  z-index: 45;
  display: flex;
  flex-direction: column;
  pointer-events: none;
}

.cms-ann {
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 11px clamp(16px, 4vw, 40px);
  font-family: var(--font-body, "Inter", system-ui, sans-serif);
  font-size: 0.92rem;
  line-height: 1.45;
  color: var(--abyss-900, #07212e);
  background: var(--signal-200, #9bdcec);
  border-bottom: 1px solid rgba(7, 33, 46, 0.14);
  animation: cms-slide-down 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.cms-ann.level-info {
  background: var(--signal-200, #9bdcec);
  color: var(--abyss-900, #07212e);
}
.cms-ann.level-success {
  background: #d6f5e4;
  color: #0b3d24;
}
.cms-ann.level-warning {
  background: #fbecc9;
  color: #5a3d05;
}

.cms-ann__dot {
  flex: none;
  width: 9px;
  height: 9px;
  margin-top: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.55;
}

.cms-ann__content {
  flex: 1 1 auto;
  min-width: 0;
}
.cms-ann__title {
  font-family: var(--font-display, "Space Grotesk", system-ui, sans-serif);
  font-weight: 600;
  letter-spacing: -0.01em;
}
.cms-ann__body {
  opacity: 0.92;
}
.cms-ann__body a {
  text-decoration: underline;
}

.cms-ann__close {
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  font-size: 1.1rem;
  line-height: 1;
  color: currentColor;
  opacity: 0.6;
  transition: opacity 0.15s, background 0.15s;
}
.cms-ann__close:hover {
  opacity: 1;
  background: rgba(7, 33, 46, 0.1);
}

@keyframes cms-slide-down {
  from { transform: translateY(-100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* When an editable region is empty/being edited, keep layout stable. */
[data-cms] { min-height: 0; }

/* ---- Admin-inserted content blocks ---- */
.cms-block { margin: 22px 0; }
.cms-block h2.display { font-family: var(--font-display, "Space Grotesk", sans-serif); font-weight: 600; letter-spacing: -0.02em; font-size: clamp(1.5rem, 3vw, 2.2rem); margin: 0 0 6px; }
.cms-block h3.display { font-family: var(--font-display, "Space Grotesk", sans-serif); font-weight: 600; font-size: clamp(1.2rem, 2vw, 1.6rem); margin: 0 0 6px; }
.cms-prose { line-height: 1.6; max-width: 70ch; }
.cms-prose p { margin: 0 0 14px; }
.cms-prose a { text-decoration: underline; }
.cms-prose img { max-width: 100%; height: auto; border-radius: 10px; margin: 14px 0; }
.cms-prose ul, .cms-prose ol { margin: 0 0 14px 22px; }
.cms-figure { margin: 20px 0; }
.cms-figure img { max-width: 100%; height: auto; border-radius: 12px; display: block; }
.cms-figure figcaption { font-size: 0.85rem; opacity: 0.7; margin-top: 8px; }
.cms-statband { margin: 18px 0; }
