/* Career Context Report — screen and print.
 *
 * Grayscale is the design, not a fallback. No figure, label or state is carried
 * by hue anywhere: exit type is a word in the table and an end-cap shape on the
 * bars, and every bar carries its numeric label as text, so the tints are
 * decoration. print-color-adjust is deliberately NOT set — the document must be
 * correct when a browser drops backgrounds, which is the default.
 */

.ccr {
  display: block;
  max-width: 46rem;
  margin: 0 auto;
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.6;
}
.ccr h1 { font-size: clamp(1.9rem, 3vw, 2.5rem); font-weight: 300; line-height: 1.1; margin: 0 0 .5rem; }
.ccr h2 {
  font-size: clamp(1.35rem, 2.2vw, 1.75rem); font-weight: 300; line-height: 1.15;
  margin: 0 0 1rem; padding-top: 1.75rem; border-top: 2px solid var(--navy);
}
.ccr h3 { font-size: 1.05rem; font-weight: 600; margin: 2rem 0 .6rem; }
.ccr p { margin: 0 0 1rem; }
.ccr ul { margin: 0 0 1rem; padding-left: 1.1rem; }
.ccr li { margin-bottom: .5rem; }

.ccr-head { margin-bottom: 2.5rem; }
.ccr-eyebrow {
  font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--teal-ink); margin: 0 0 .5rem;
}
.ccr-meta { font-size: .875rem; color: var(--gray-700); margin-bottom: .5rem; }
.ccr-lede { font-size: 1.0625rem; }
.ccr-note { font-size: .875rem; color: var(--gray-700); margin-top: 1.5rem; }
.ccr-note-inline { font-size: .875rem; color: var(--gray-700); }
.ccr-src { font-size: .8125rem; color: var(--gray-700); margin-top: 2rem; }
.ccr-page { margin-bottom: 3rem; }

/* Tables scroll on screen so the page body never scrolls sideways; in print
   they switch to fixed layout and wrap instead. */
.ccr-tbl { overflow-x: auto; margin: 0 0 1.25rem; }
.ccr table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.ccr th, .ccr td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--gray-300); vertical-align: top; }
.ccr thead th { border-bottom: 2px solid var(--navy); font-weight: 600; white-space: nowrap; }
.ccr tr.ccr-prov td {
  font-size: .6875rem; letter-spacing: .04em; text-transform: uppercase;
  color: var(--gray-700); border-bottom: 1px solid var(--gray-300); padding-top: .2rem; padding-bottom: .3rem;
}
.ccr tr.ccr-sub td { font-size: .8125rem; color: var(--gray-700); border-bottom: 1px solid var(--gray-100); }

/* Departure curve. One ink, three tints; every row carries its number as text. */
.ccr-bars2 { margin: 0 0 1.5rem; }
.ccr-row { display: grid; grid-template-columns: 6.5rem 1fr auto; gap: .5rem; align-items: center; margin-bottom: .3rem; font-size: .8125rem; }
.ccr-row__lbl { color: var(--gray-700); }
.ccr-row__track { background: var(--gray-100); height: .75rem; position: relative; }
.ccr-row__fill { position: absolute; inset: 0 auto 0 0; background: var(--navy); opacity: .55; }
.ccr-row__val { font-variant-numeric: tabular-nums; white-space: nowrap; }
.ccr-row__you { grid-column: 2 / -1; font-size: .75rem; font-weight: 600; color: var(--navy); }

@media (max-width: 639px) {
  .ccr-row { grid-template-columns: 5rem 1fr; }
  .ccr-row__val { grid-column: 2; text-align: right; }
}

/* ------------------------------------------------------------------ print */
@page { size: Letter portrait; margin: 16mm 14mm 18mm; }

@media print {
  /* The printed document begins at the report. Everything the reader used to
     GET here — nav, hero, lookup, the interactive fingerprint, the buttons —
     is not part of what they asked to keep. */
  #header, .mobile-menu, site-footer, #cf-lookup, #cs-results, #cf-method, #cf-faq,
  #cs-closer, .no-print { display: none !important; }

  body { padding-top: 0 !important; background: #fff !important; }
  .ccr {
    display: block !important; position: static !important;
    max-width: none !important; width: auto !important; margin: 0 !important;
    font-size: 10.5pt; line-height: 1.45; color: #000;
  }
  .ccr h1 { font-size: 20pt; }
  .ccr h2 { font-size: 13pt; border-top-color: #000; }
  .ccr h3 { font-size: 11pt; }
  .ccr table { font-size: 9pt; table-layout: fixed; width: 100%; }
  .ccr td { word-break: break-word; }
  .ccr-tbl { overflow: visible !important; }

  /* Repeat table headers on continuation pages. */
  .ccr thead { display: table-header-group; }

  /* ONE deliberate page break, at the move from the reader's own record to
     published figures about other people. A second break before the limits
     page cost a whole sheet to save no confusion - measured at 5 printed pages
     against 3.44 pages of actual content. Everything else flows. */
  /* No forced breaks. One cost a whole sheet - 5 printed pages against 3.8
     pages of content - and the rule above each h2 already separates sections. */

  /* Print spacing is tighter than screen: the rules between sections do the
     separating, so the leading above them does not need to. */
  .ccr-page { margin-bottom: 1.25rem; }
  .ccr h2 { padding-top: .9rem; margin-bottom: .6rem; }
  .ccr h3 { margin: 1rem 0 .4rem; }
  .ccr p { margin-bottom: .6rem; }
  .ccr li { margin-bottom: .3rem; }
  .ccr th, .ccr td { padding: .28rem .45rem; }
  .ccr-head { margin-bottom: 1.2rem; }
  .ccr-bars, .ccr-bars2, .ccr-tbl { margin-bottom: .8rem; }
  .ccr-note { margin-top: .8rem; }

  /* The reader's takeaway artifacts must survive as single objects. */
  .ccr tr, .ccr-row, .ccr figure, .ccr li { break-inside: avoid; }
  .ccr h2, .ccr h3 { break-after: avoid; }
  .ccr p { orphans: 3; widows: 3; }

  /* No URL expansion — the report is read on paper. */
  .ccr a[href]::after { content: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .ccr, .ccr * { transition: none !important; animation: none !important; }
}