/* Homepage hero fill. Added 23 Oct 2026.
   A second box with the five checks sits above the Free checklist box, in the same style,
   and the pair starts level with the headline, so the right side of the hero is no longer empty. */
.hero-split { align-items: start; grid-template-rows: auto 1fr; row-gap: 18px; }
.hero-split > div:first-child { grid-row: 1 / span 2; }
.hero-split > .hero-checks { grid-column: 2; grid-row: 1; padding-bottom: 18px; }
.hero-split > #hero-signup { grid-column: 2; grid-row: 2; align-self: start; }
.hc-list { list-style: none; margin: 0; padding: 0; counter-reset: hc; }
.hc-list li {
  counter-increment: hc; display: grid; grid-template-columns: 22px 1fr auto; align-items: baseline; gap: 8px;
  padding: 9px 0; border-top: 1px solid var(--border); font-size: 15px; line-height: 1.45; color: var(--text-dim);
}
.hc-list li:first-child { border-top: none; padding-top: 0; }
.hc-list li::before { content: counter(hc) "."; font-weight: 700; color: var(--text-dim); }
.hc-list strong { color: var(--text); font-weight: 600; }
.hc-min { font-size: 13px; font-variant-numeric: tabular-nums; color: var(--text-faint); white-space: nowrap; }
@media (max-width: 980px) {
  .hero-split > .hero-checks { display: none; }
  .hero-split > div:first-child, .hero-split > #hero-signup { grid-column: auto; grid-row: auto; }
}

/* Latest news strip at the top of the hero, so readers see there is fresh news */
.hero { padding-top: 28px; }
.hero-news {
  display: flex; align-items: center; gap: 16px; margin: 0 0 44px; padding: 11px 18px;
  border: 1px solid var(--border); border-radius: 12px; background: rgba(18, 26, 41, .7);
}
.hn-tag { display: inline-flex; align-items: center; gap: 8px; flex: none; font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.hn-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 0 rgba(34, 211, 165, .6); animation: hnPulse 2.4s ease-out infinite; }
.hn-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; font-weight: 600; color: var(--text); text-decoration: none; }
.hn-title:hover { color: var(--accent); }
.hn-all { flex: none; font-size: 14px; font-weight: 600; color: var(--accent); text-decoration: none; }
.hn-all:hover { text-decoration: underline; }
@keyframes hnPulse { 0% { box-shadow: 0 0 0 0 rgba(34, 211, 165, .6); } 70%, 100% { box-shadow: 0 0 0 8px rgba(34, 211, 165, 0); } }
@media (prefers-reduced-motion: reduce) { .hn-dot { animation: none; } }
@media (max-width: 720px) {
  .hero-news { flex-wrap: wrap; gap: 6px 12px; margin-bottom: 28px; }
  .hn-title { flex-basis: 100%; order: 3; white-space: normal; }
}