/* JobTrainingHelp.com — article styles v1
   Paste this entire file into WordPress > Appearance > Customize >
   Additional CSS (or your theme's Custom CSS field). Paste CSS only.
   Designed for the universal article element and Article Details format.
   Standard WordPress themes must have an .entry-content container.
   All rules are scoped inside that container; theme headers and ads are untouched.
   Optional components: .jth-meta, .jth-callout, .jth-toc,
   .jth-table-wrap and .jth-steps. No JavaScript or remote fonts required.
*/

.entry-content article {
  --jth-ink: #223247;
  --jth-muted: #566375;
  --jth-blue: #154c79;
  --jth-link: #125da3;
  --jth-accent: #b95717;
  --jth-line: #d8e2ec;
  --jth-soft: #f3f7fb;
  --jth-warm: #fff7ee;
  color: var(--jth-ink);
  background: transparent;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 18px;
  line-height: 1.78;
  overflow-wrap: anywhere;
}

.entry-content article *,
.entry-content article *::before,
.entry-content article *::after { box-sizing: border-box; }

.entry-content article p { margin: 0 0 1.15em; }
.entry-content article strong { font-weight: 700; }

.entry-content article h2 {
  color: var(--jth-blue);
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 750;
  line-height: 1.3;
  margin: 2.2em 0 .8em;
  padding: 0 0 .45em;
  border-bottom: 2px solid var(--jth-line);
  scroll-margin-top: 5rem;
}

.entry-content article h3 {
  color: var(--jth-ink);
  font-size: clamp(1.1rem, 1.8vw, 1.3rem);
  font-weight: 700;
  line-height: 1.4;
  margin: 1.6em 0 .6em;
  scroll-margin-top: 5rem;
}

.entry-content article a {
  color: var(--jth-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}
.entry-content article a:visited { color: #654582; }
.entry-content article a:hover {
  color: #103d66;
  text-decoration-thickness: 2px;
}
.entry-content article :is(a, summary, button, [tabindex]):focus-visible {
  outline: 3px solid var(--jth-blue);
  outline-offset: 4px;
  border-radius: 3px;
}

.entry-content article :is(ul, ol) { margin: .65em 0 1.3em; padding-left: 1.5em; }
.entry-content article li { padding-left: .15em; margin-bottom: .45em; }
.entry-content article li::marker { color: var(--jth-blue); font-weight: 650; }
.entry-content article li :is(ul, ol) { margin: .45em 0 .5em; }
.entry-content article li > p:last-child { margin-bottom: 0; }

.entry-content article .article-details {
  margin: 0 0 1.2em;
  padding: .8em 1em;
  border: 1px solid var(--jth-line);
  border-radius: 8px;
  background: var(--jth-soft);
  color: var(--jth-muted);
  font-size: .87em;
  line-height: 1.65;
}
.entry-content article .article-details summary {
  cursor: pointer;
  color: var(--jth-blue);
  font-weight: 700;
  min-height: 24px;
}
.entry-content article .article-details[open] summary { margin-bottom: .65em; }
.entry-content article .article-details strong { color: var(--jth-ink); }

.entry-content article .jth-meta {
  color: var(--jth-muted);
  font-size: .84em;
  line-height: 1.6;
  padding-bottom: .8em;
  border-bottom: 1px solid var(--jth-line);
  margin-bottom: 1.3em;
}

.entry-content article .jth-callout {
  margin: 1.4em 0;
  padding: 1em 1.2em;
  border: 1px solid var(--jth-line);
  border-left: 5px solid var(--jth-blue);
  border-radius: 0 8px 8px 0;
  background: var(--jth-soft);
}
.entry-content article .jth-callout--important {
  background: var(--jth-warm);
  border-color: #e8c5a4;
  border-left-color: var(--jth-accent);
}
.entry-content article .jth-callout > :first-child { margin-top: 0; }
.entry-content article .jth-callout > :last-child { margin-bottom: 0; }
.entry-content article .jth-callout h3 { margin: 0 0 .5em; }

.entry-content article .jth-toc {
  margin: 1.4em 0;
  padding: 1em 1.2em;
  border: 1px solid var(--jth-line);
  border-radius: 8px;
  background: #fff;
}
.entry-content article .jth-toc p { margin: 0 0 .5em; }
.entry-content article .jth-toc ul {
  columns: 2;
  column-gap: 2em;
  margin: 0;
  padding-left: 1.2em;
}
.entry-content article .jth-toc li { break-inside: avoid; margin-bottom: .4em; }

.entry-content article .jth-table-wrap {
  margin: 1.3em 0 1.6em;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--jth-line);
  border-radius: 8px;
  scrollbar-color: #8699ad var(--jth-soft);
  -webkit-overflow-scrolling: touch;
}
.entry-content article table {
  width: 100%;
  border-collapse: collapse;
  font-size: .91em;
  line-height: 1.6;
  margin: 1.3em 0;
  background: #fff;
  color: var(--jth-ink);
  border: 1px solid var(--jth-line);
}
.entry-content article .jth-table-wrap table {
  margin: 0;
  border: 0;
  min-width: 520px;
}
.entry-content article caption {
  text-align: left;
  padding: .75em .9em;
  color: var(--jth-muted);
  font-size: .94em;
  font-weight: 600;
  background: #fff;
}
.entry-content article :is(th, td) {
  text-align: left;
  vertical-align: top;
  padding: .8em .9em;
  border: 1px solid var(--jth-line);
}
.entry-content article thead th {
  color: #fff;
  background: var(--jth-blue);
  font-weight: 700;
  border-color: #32688f;
}
.entry-content article tbody tr:nth-child(even) { background: #f7f9fc; }

.entry-content article .jth-steps { padding-left: 1.6em; }
.entry-content article .jth-steps li { margin-bottom: .85em; }
.entry-content article blockquote {
  margin: 1.3em 0;
  padding: .8em 1.1em;
  border-left: 4px solid var(--jth-blue);
  background: var(--jth-soft);
  color: var(--jth-ink);
  font-size: 1em;
  font-style: normal;
}
.entry-content article blockquote > :last-child { margin-bottom: 0; }
.entry-content article img { max-width: 100%; height: auto; }
.entry-content article hr {
  border: 0;
  border-top: 1px solid var(--jth-line);
  margin: 1.8em 0;
}

@media (max-width: 600px) {
  .entry-content article { font-size: 17px; line-height: 1.75; }
  .entry-content article h2 { margin-top: 1.8em; }
  .entry-content article .jth-toc ul { columns: 1; }
  .entry-content article :is(.jth-callout, .jth-toc) { padding: .9em 1em; }
  .entry-content article :is(th, td) { padding: .7em .75em; }
  .entry-content article .article-details { padding: .7em .85em; }
}

@media print {
  .entry-content article { color: #111; font-size: 11pt; line-height: 1.5; }
  .entry-content article :is(.jth-toc, .article-details) { display: none; }
  .entry-content article :is(.jth-callout, blockquote, tr) { break-inside: avoid; }
  .entry-content article .jth-table-wrap { overflow: visible; border-radius: 0; }
  .entry-content article .jth-table-wrap table { min-width: 0; }
  .entry-content article :is(h2, h3) { break-after: avoid; }
  .entry-content article a { color: #111; }
}