/* News page in the Signal Atlas look: loaded after css/blog-atlas.css (palette, fonts, header, footer). */
/* This page does not load the old css/style.css, so the few base rules it relied on are here. */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; color: var(--text-primary); }
a { color: var(--secondary); }
.skip-link { position: absolute; left: -9999px; top: 8px; z-index: 100; padding: 8px 14px; border-radius: 999px; background: #19e68c; color: #04070d;
  font: 600 14px/1 var(--font-body); text-decoration: none; }
.skip-link:focus { left: 12px; }

.nw-page { padding-block: clamp(36px, 6vw, 64px) 8px; }

/* hero */
.nw-hero { max-width: 780px; }
.nw-eyebrow { display: inline-block; margin: 0 0 18px; padding: 6px 9px; border: 1px solid rgba(63,216,232,.4); border-radius: 6px;
  color: var(--secondary); font: 700 11px/1 var(--font-mono); letter-spacing: .18em; text-transform: uppercase; }
.nw-hero h1 { margin: 0 0 16px; font: 800 clamp(42px, 5.4vw, 64px)/1.02 var(--display); letter-spacing: -.025em; color: var(--text-primary); text-wrap: balance; }
.nw-lead { margin: 0; max-width: 36em; color: var(--text-secondary); font-size: 18px; }
.nw-latest { margin: 18px 0 0; color: #56677f; font: 500 13px/1.5 var(--font-mono); }
.nw-latest a { color: var(--text-primary); text-decoration: none; border-bottom: 1px solid var(--border-color); }
.nw-latest a:hover { border-bottom-color: var(--secondary); }
.nw-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.nw-btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border: 1px solid var(--border-color); border-radius: 999px;
  color: var(--text-secondary); font: 600 15px/1 var(--font-body); text-decoration: none; transition: border-color .2s, color .2s, transform .2s; }
.nw-btn:hover { border-color: var(--text-secondary); color: var(--text-primary); transform: translateY(-1px); }
.nw-btn--solid { border-color: #19e68c; background: #19e68c; color: #04070d; box-shadow: 0 10px 40px -12px rgba(25,230,140,.7); }
.nw-btn--solid:hover { border-color: #4ff0a8; background: #4ff0a8; color: #04070d; }

/* filters (shown by news.js; without JS every entry is simply listed) */
.nw-filters { position: sticky; top: 68px; z-index: 5; display: flex; flex-wrap: wrap; gap: 8px; margin: 30px 0 0; padding: 12px 0;
  background: linear-gradient(var(--bg-primary) 72%, rgba(4,7,13,0)); }
.nw-filters[hidden] { display: none; }
.nw-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 14px; border: 1px solid var(--border-color); border-radius: 999px;
  background: transparent; color: var(--text-secondary); font: 600 12px/1 var(--font-mono); letter-spacing: .06em; cursor: pointer; transition: border-color .2s, color .2s, background .2s; }
.nw-chip span { color: #56677f; font-weight: 500; }
.nw-chip:hover { border-color: var(--text-secondary); color: var(--text-primary); }
.nw-chip.is-on { border-color: #2b4565; background: rgba(255,255,255,.04); color: var(--text-primary); }
.nw-chip--app.is-on { border-color: rgba(63,216,232,.55); background: rgba(63,216,232,.08); }
.nw-chip--agent.is-on { border-color: rgba(167,139,250,.55); background: rgba(167,139,250,.08); }
.nw-chip--strategy.is-on { border-color: rgba(25,230,140,.55); background: rgba(25,230,140,.08); }
.nw-chip--site.is-on { border-color: rgba(255,181,71,.55); background: rgba(255,181,71,.08); }

/* the timeline */
.nw-feed { max-width: 900px; margin-top: 6px; }
.nw-month { margin-top: 26px; }
.nw-month[hidden] { display: none; }
.nw-month-title { margin: 0 0 14px; color: #56677f; font: 700 12px/1 var(--font-mono); letter-spacing: .16em; text-transform: uppercase; }
.nw-item { position: relative; display: grid; grid-template-columns: 112px 1fr; column-gap: 22px; padding-bottom: 16px; scroll-margin-top: 130px; }
.nw-item[hidden] { display: none; }
.nw-item::before { content: ""; position: absolute; left: 122px; top: 0; bottom: 0; width: 1px; background: var(--border-color); }
.nw-date { padding-top: 22px; text-align: right; color: #56677f; font: 500 12px/1.4 var(--font-mono); }
.nw-card { position: relative; padding: 20px 22px 18px; border: 1px solid var(--border-color); border-radius: 18px; background: var(--bg-card);
  transition: border-color .2s; }
.nw-card:hover { border-color: #2b4565; }
.nw-card::before { content: ""; position: absolute; left: -17px; top: 26px; width: 10px; height: 10px; border-radius: 50%;
  background: var(--dot, var(--secondary)); box-shadow: 0 0 0 4px var(--bg-primary); }
.nw-item[data-kind="app"] { --dot: #3fd8e8; }
.nw-item[data-kind="agent"] { --dot: #a78bfa; }
.nw-item[data-kind="strategy"] { --dot: #19e68c; }
.nw-item[data-kind="site"] { --dot: #ffb547; }
.nw-item:target .nw-card { border-color: var(--dot); box-shadow: 0 0 0 1px color-mix(in srgb, var(--dot) 40%, transparent); }

.nw-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; }
.nw-kind { padding: 5px 8px; border: 1px solid; border-radius: 6px; font: 700 11px/1 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.nw-kind--app { color: #3fd8e8; border-color: rgba(63,216,232,.45); }
.nw-kind--agent { color: #a78bfa; border-color: rgba(167,139,250,.45); }
.nw-kind--strategy { color: #19e68c; border-color: rgba(25,230,140,.45); }
.nw-kind--site { color: #ffb547; border-color: rgba(255,181,71,.45); }
.nw-ver { color: var(--text-secondary); font: 500 12px/1 var(--font-mono); }

.nw-card h3 { margin: 0 0 8px; font: 700 21px/1.22 var(--display); letter-spacing: -.01em; text-wrap: balance; }
.nw-card h3 a { color: var(--text-primary); text-decoration: none; }
.nw-card h3 a:hover { text-decoration: underline; text-decoration-color: var(--border-color); }
.nw-summary { margin: 0; color: #a9bad0; font-size: 15.5px; line-height: 1.6; }

.nw-more { margin-top: 12px; }
.nw-more summary { display: inline-flex; align-items: center; gap: 8px; color: var(--text-secondary); font: 600 12px/1 var(--font-mono); letter-spacing: .06em;
  cursor: pointer; list-style: none; }
.nw-more summary::-webkit-details-marker { display: none; }
.nw-more summary::before { content: "▸"; display: inline-block; transition: transform .2s; color: var(--secondary); }
.nw-more[open] summary::before { transform: rotate(90deg); }
.nw-more summary span { color: #56677f; font-weight: 500; }
.nw-more summary:hover { color: var(--text-primary); }
.nw-more ul { margin: 10px 0 0; padding-left: 20px; color: #a9bad0; font-size: 14.5px; line-height: 1.55; }
.nw-more li { margin: 5px 0; }
.nw-more li::marker { color: #2b4565; }

.nw-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; color: var(--secondary); font: 600 14px/1 var(--font-body); text-decoration: none; }
.nw-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.nw-empty { max-width: 900px; margin: 30px 0 0; color: var(--text-secondary); }

@media (max-width: 720px) {
  .nw-item { grid-template-columns: 1fr; }
  .nw-item::before, .nw-card::before { display: none; }
  .nw-date { padding: 0 0 8px 2px; text-align: left; }
  .nw-card { padding: 18px 18px 16px; }
  .nw-card h3 { font-size: 19px; }
  .nw-filters { top: 64px; }
}
@media (prefers-reduced-motion: reduce) { .nw-btn, .nw-chip, .nw-card, .nw-more summary::before { transition: none; } }