/* ── newsroom section — native to the site ──
   a program monitor (the demo reel) + a terse capability list (reuses .svc-list from styles.css).
   no fixed chrome, no ticker: the site shell (header, nav, globe) frames it like every other section.
   accent comes from body[data-section="newsroom"] (broadcast red). */

.nr-reel {
    position: relative; max-width: 46rem; margin: 0.4rem 0 0.75rem;
    border: 1px solid var(--line); background: #000;
    aspect-ratio: 16 / 9; overflow: hidden;
    transition: border-color 0.15s ease;
}
.nr-reel:hover { border-color: var(--accent); }
.nr-reel video { width: 100%; height: 100%; object-fit: cover; display: block; }
.nr-reel.is-empty { background: var(--panel); }

.nr-reel-tag {
    position: absolute; top: 0.5rem; left: 0.55rem; z-index: 2;
    display: inline-flex; align-items: center; gap: 0.4rem;
    background: rgba(10, 10, 10, 0.6); border: 1px solid var(--line);
    padding: 0.12rem 0.5rem; font-size: 0.7rem; color: var(--dim); letter-spacing: 0.06em;
}
.nr-reel-tag::before { content: ""; width: 0.45rem; height: 0.45rem; border-radius: 50%; background: var(--accent); }

.nr-note { color: var(--dim); font-size: 0.82rem; line-height: 1.6; max-width: 42rem; margin: 0 0 2rem; }
.nr-does { margin-bottom: 2rem; }   /* list rows themselves are styled by .svc-list in styles.css */
.nr-solo { color: var(--c-white); font-size: 1.05rem; margin: 0 0 0.5rem; }
.nr-cta { color: var(--dim); }
.nr-cta a { color: var(--accent); }

@media (max-width: 700px) { .nr-reel { max-width: 100%; } }
