/* ============================================================
   ARTICLE CONTENT  ·  Blake's blocks
   Scoped to .nrh-article so it never restyles job or
   scholarship pages. Zero !important.
   ============================================================ */

.nrh-article {
  font-family: var(--nrh-font);
  color: var(--nrh-ink-body);
  font-size: var(--nrh-text-base);
  line-height: 1.75;
}

.nrh-article h2 {
  color: var(--nrh-primary);
  font-size: 1.55rem;
  margin: var(--nrh-gap-lg) 0 12px;
  padding-left: 12px;
  border-left: 5px solid var(--nrh-apply);
}
.nrh-article h3 {
  color: var(--nrh-secondary);
  font-size: 1.2rem;
  margin-top: 18px;
}
.nrh-article p  { margin-bottom: 12px; }
.nrh-article ul { list-style: disc outside; padding-left: 22px; margin: 8px 0 12px; }
.nrh-article ol { list-style: decimal outside; padding-left: 22px; margin: 8px 0 12px; }
.nrh-article li::marker { color: var(--nrh-secondary); }
.nrh-article li { margin-bottom: 8px; }
.nrh-article img { max-width: 100%; height: auto; border-radius: 15px; }

.nrh-article table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 20px 0;
  font-size: 15px;
  background: #fff;
  border: 1px solid var(--nrh-line);
  border-radius: var(--nrh-radius-lg);
  overflow: hidden;
  box-shadow: var(--nrh-shadow);
}
.nrh-article th {
  background: var(--nrh-primary);
  color: #fff;
  padding: 12px 16px;
  text-align: left;
  font-weight: 700;
}
.nrh-article td { padding: 12px 16px; border-top: 1px solid var(--nrh-line); vertical-align: top; }
.nrh-article tbody tr:nth-child(even) td { background: var(--nrh-bg); }

/* ---- hero -------------------------------------------------- */
.article-hero {
  background: linear-gradient(135deg, var(--nrh-primary), var(--nrh-secondary));
  color: #fff;
  padding: 28px 22px;
  margin: 18px 0;
  border-radius: 18px;
  box-shadow: var(--nrh-shadow-lg);
}
.article-hero h1,
.article-hero h2,
.article-hero p,
.article-hero strong { color: #fff; }
/* the hero owns its heading; no accent bar inside it */
.article-hero h2 { border-left: none; padding-left: 0; }

/* ---- blocks ------------------------------------------------ */
.article-card {
  background: var(--nrh-surface);
  padding: 20px;
  margin: 18px 0;
  border-radius: var(--nrh-radius-lg);
  box-shadow: var(--nrh-shadow);
}
.highlight-box {
  background: var(--nrh-info-bg);
  border-left: 5px solid var(--nrh-info-accent);
  padding: 20px;
  margin: 18px 0;
  border-radius: var(--nrh-radius);
}
.tip-box {
  background: var(--nrh-ok-bg);
  border-left: 5px solid var(--nrh-apply);
  padding: 20px;
  margin: 18px 0;
  border-radius: var(--nrh-radius);
}
/* Table of contents: a numbered GRID of cards, not a bulleted list.
   The browser counters number the cards 01, 02, 03 automatically. */
.toc-box {
  background: var(--nrh-surface);
  border: 1px solid var(--nrh-line);
  padding: 20px;
  margin: 22px 0;
  border-radius: var(--nrh-radius-lg);
  box-shadow: var(--nrh-shadow);
}
.toc-box > strong:first-child,
.toc-box > p:first-child,
.toc-box .toc-title {
  display: block;
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--nrh-ink-soft);
}
.toc-box ol,
.toc-box ul {
  list-style: none;
  counter-reset: nrh-toc;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width: 700px)  { .toc-box ol, .toc-box ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .toc-box ol, .toc-box ul { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.toc-box li { margin: 0; }
.toc-box li::before {
  counter-increment: nrh-toc;
  content: counter(nrh-toc, decimal-leading-zero);
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  color: var(--nrh-primary);
  opacity: .35;
  margin-bottom: 8px;
  transition: opacity .15s ease;
}
.toc-box li {
  background: var(--nrh-bg);
  border: 1px solid var(--nrh-line);
  border-radius: 12px;
  padding: 12px;
  transition: border-color .15s ease, background-color .15s ease;
}
.toc-box li:hover { border-color: var(--nrh-primary); background: #fff; }
.toc-box li:hover::before { opacity: 1; }
.toc-box a {
  color: var(--nrh-ink);
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.35;
  display: block;
}
.toc-box a:hover { color: var(--nrh-primary); text-decoration: none; }

.faq-box {
  background: transparent;
  padding: 0;
  margin: 22px 0;
  border-radius: 0;
}
/* Plain h3/p fallback keeps Blake's current output tidy. */
.faq-box h3 { color: var(--nrh-primary); font-size: 16.5px; margin: 16px 0 6px; }
.faq-box p  { margin: 0 0 6px; }
/* Accordion rows when Blake emits <details><summary>. */
.faq-box details {
  background: #fff;
  border: 1px solid var(--nrh-line);
  border-radius: 12px;
  padding: 14px 16px;
  margin: 0 0 10px;
  transition: border-color .15s ease, background-color .15s ease;
}
.faq-box details[open] { border-color: var(--nrh-primary); background: var(--nrh-bg); }
.faq-box summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-weight: 700;
  font-size: 15.5px;
  color: var(--nrh-ink);
}
.faq-box summary::-webkit-details-marker { display: none; }
.faq-box summary::after {
  content: "+";
  flex-shrink: 0;
  font-size: 20px;
  font-weight: 400;
  color: var(--nrh-primary);
  transition: transform .18s ease;
}
.faq-box details[open] summary::after { transform: rotate(45deg); }
.faq-box details p { margin: 10px 0 0; font-size: 15px; }

/* Answer cards: for numbered Q&A guides. Blake wraps each sample answer in
   .answer-card (or keeps the "Sample answer" label) so it reads as a chunk. */
.answer-card {
  background: var(--nrh-ok-bg);
  border-left: 5px solid var(--nrh-apply);
  border-radius: var(--nrh-radius);
  padding: 16px 18px;
  margin: 12px 0 20px;
}
.answer-card .answer-label,
.answer-card > strong:first-child {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--nrh-apply-ink);
  margin: 0 0 6px;
}
.answer-card p { margin: 6px 0 0; }

.author-box {
  background: var(--nrh-line-soft);
  padding: 20px;
  margin: 25px 0;
  border-radius: var(--nrh-radius-lg);
  border-top: 5px solid var(--nrh-secondary);
}

/* ---- CTA --------------------------------------------------- */
.cta-box {
  background: var(--nrh-ok-bg);
  border: 2px solid var(--nrh-apply);
  padding: 22px;
  margin: 22px 0;
  text-align: center;
  border-radius: var(--nrh-radius-lg);
}
.cta-button {
  display: inline-block;
  background: var(--nrh-apply-ink);
  color: #fff;
  padding: 12px 25px;
  border-radius: 25px;
  font-weight: 700;
  text-decoration: none;
  transition: background-color .2s ease;
}
.cta-button:hover,
.cta-button:visited,
.cta-button:focus { color: #fff; }
.cta-button:hover { background: var(--nrh-apply-hover); }

@media (max-width: 768px) {
  .nrh-article { font-size: 0.94rem; }
  .nrh-article h2 { font-size: 1.35rem; }
  .article-card,
  .article-hero,
  .highlight-box,
  .tip-box,
  .toc-box,
  .cta-box,
  .faq-box,
  .author-box { padding: 15px; margin: 14px 0; }
}
