/* Shared navigation and availability for the single rkat.ai site. */
.head .nav { gap: clamp(14px, 1.8vw, 28px); }
.nav a[aria-current="page"] { color: var(--accent-ink); }
.product-parts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.release-status { display: inline-block; width: fit-content; font-size: 11px; font-weight: 500; line-height: 1.5; color: var(--accent-ink); }
.product-parts .release-status { margin-top: 4px; }
.recall-intro { border-top: 1px solid var(--line); }
.recall-intro-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 56px; }
.recall-intro-grid h2 { margin-top: 12px; max-width: 420px; }
.recall-intro-grid .actions { align-items: center; }
.availability-note, .recall-availability { color: var(--ink-2); font-size: 13px; line-height: 1.6; margin-top: 16px; }
.recall-availability .release-status { margin-right: 8px; }
.recall-sections { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-top: 24px; font-size: 13px; }
.recall-sections a { text-underline-offset: 4px; }
.recall-page .foot nav { flex-wrap: wrap; }
.recall-page a:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; border-radius: 2px; }
@media (max-width: 940px) {
  .recall-intro-grid { grid-template-columns: 1fr; gap: 24px; }
  .head .nav a { padding-top: 12px; padding-bottom: 12px; }
  .recall-page .nav { overflow-x: auto; }
}
@media (max-width: 720px) {
  .product-parts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-parts a:nth-child(odd) { border-left: 0; padding-left: 0; }
  .product-parts a:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .head .nav { gap: 20px; }
}

.release-links { color: var(--ink-2); font-size: 13px; line-height: 1.6; margin-top: 20px; }
.release-links a { text-underline-offset: 3px; white-space: nowrap; }

/* Direct reader routes beside the first runnable Core example. */
.start-routes { display: grid; gap: 0; margin: 24px 0 0; border-top: 1px solid var(--line); }
.start-routes a { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 20px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.5; text-decoration: none; }
.start-routes b { font-weight: 500; }
.start-routes span { color: var(--ink-2); }
.start-routes a:hover b { text-decoration: underline; text-underline-offset: 3px; }
.start-routes a:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; }
