/* sparkerLX portfolio v1 — print rules for the two tear sheets.
   10-build-brief.md §4.6 and 09-design-brief.md §9: linked after site.css with
   media="print", so everything here refines the screen rules for paper.
   Tear sheet 1 is Home (the profile); tear sheet 2 is each AI case page.
   tools/export_tearsheets.py opens every <details> before printing, since CSS
   cannot. No !important. */

@page { margin: 18mm; }

/* ---------- tokens and base (09 §9) ---------- */

:root {
  /* brand blue printed as link-blue for legibility; orange kept (it prints) */
  --brand-blue: #0b5fd1;
  --paper-2: #ffffff;
  --gutter: 0px;
  --section-gap: 18pt;
}

/* the same swap where brand blue is an SVG attribute: the lockup's "scott" and
   the diagrams' gate frames and icons (presentation attributes yield to CSS) */
svg [fill="#1b82f7" i] { fill: var(--link-blue); }
svg [stroke="#1b82f7" i] { stroke: var(--link-blue); }

html { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* the screen's min-height flex column (footer at the viewport bottom) has no
   meaning on paper and fragments badly across pages; a plain block flows */
body { display: block; min-height: 0; font-size: 11pt; line-height: 1.38; }

h1 { font-size: 22pt; line-height: 1.15; }
h2 { font-size: 13.5pt; line-height: 1.25; margin-top: 12pt; margin-bottom: 3pt; }
h3 { font-size: 12pt; line-height: 1.3; margin-top: 10pt; margin-bottom: 3pt; }
h4 { font-size: 11pt; margin-top: 8pt; }
h2, h3, h4 { break-after: avoid; page-break-after: avoid; }
p, li { orphans: 3; widows: 3; }
p { margin-bottom: 5pt; }
ul, ol { margin-bottom: 6pt; }
li { margin-bottom: 2pt; }
figcaption, .caption { font-size: 9pt; }

/* links print as text: no color, no underline, no URL (09 §9) */
a, a:hover { color: inherit; text-decoration: none; }

img { max-width: 60%; }

.wrap { max-width: none; padding: 0; }
main > .wrap { padding-bottom: 0; }

/* ---------- what never prints (§4.6) ---------- */

header.site nav,
header.site .nav-toggle,
header.site.has-js .nav-toggle,
footer.site,
.skip-link,
.next-case,
.build-note,
dialog.lightbox { display: none; }

/* the header keeps the lockup as the sheet's masthead, over a hairline */
header.site { padding-bottom: 6pt; margin-bottom: 10pt; }
header.site .wrap { min-height: 0; }

/* paper-2 bands become white with a hairline (09 §9) */
.band { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

/* ---------- tear sheet 1: Home ---------- */

.print-only { display: block; }

.t1 section { padding: 6pt 0; }
.t1 .featured, .t1 .what-i-do { border-top: 1px solid var(--line); }
.t1 .band + .what-i-do { border-top: 0; }
.t1 section h2 { font-size: 13pt; }

/* the hero as the sheet's opening: headline and sub, no visual, no buttons */
.hero { padding: 0 0 6pt; }
.hero .wrap { display: block; }
.hero h1 { font-size: 22pt; line-height: 1.12; margin-bottom: 5pt; }
.hero-sub { font-size: 11pt; margin-bottom: 0; }
.hero-visual, .hero-ctas { display: none; }

/* the three featured cards as three short columns, text only */
.featured .kicker { font-size: 9pt; margin-bottom: 2pt; }
.featured h2 { margin-bottom: 4pt; }
.cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14pt; }
a.card { border: 0; border-radius: 0; box-shadow: none; }
.card-visual, .card-more { display: none; }
.card-body { padding: 0; }
.card .card-title { font-size: 11.5pt; margin: 0 0 2pt; }
.card-sub { font-size: 9.5pt; margin-bottom: 3pt; }
.card-desc { font-size: 9.5pt; line-height: 1.35; margin: 0; }

.split { display: block; }
.split > h2 { margin-bottom: 4pt; }
.split > p { font-size: 10pt; max-width: none; }
/* "More →" leads nowhere on paper (Scott's B5 fix before merge) */
.how-i-work p a { display: none; }

/* "What I do": the heading stays; the tiles give way to the print-only lines */
.what-i-do { padding-bottom: 0; }
.what-i-do h2 { margin-bottom: 4pt; }
.tiles, .earlier { display: none; }

.t1 section.print-only { padding-top: 0; }
.print-capabilities {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5pt 16pt;
  list-style: none;
  padding: 0;
  margin: 0 0 8pt;
}
.print-capabilities li { font-size: 9.5pt; line-height: 1.35; margin: 0; }
.print-capabilities strong { display: block; font-family: var(--font-display); font-size: 10pt; }
.print-certs {
  border-top: 1px solid var(--line);
  padding-top: 6pt;
  font-size: 8.5pt;
  line-height: 1.4;
  color: var(--ink-2);
  margin-bottom: 4pt;
}
.print-contact { font-size: 9.5pt; font-weight: 700; margin: 0; }

/* ---------- tear sheet 2: case pages ---------- */

.masthead { padding-top: 0; margin-bottom: 10pt; }
.breadcrumb { font-size: 9pt; margin-bottom: 4pt; }
.masthead h1 { margin-bottom: 4pt; }
.masthead .subtitle { font-size: 12pt; margin-bottom: 5pt; }
ul.meta { gap: 3pt 5pt; }
ul.meta li { font-size: 8.5pt; padding: 1pt 7pt; border: 1px solid var(--line); }

/* the lead diagram prints as vector at the full text width */
.lead figure { margin: 0 0 6pt; }
figure.diagram { break-inside: avoid; page-break-inside: avoid; }
figure.diagram .frame { padding: 0; border: 0; }

.case-body > :where(p, ul, ol, h2, h3, h4) { max-width: none; }
.case-body > h2:first-child { margin-top: 8pt; }

/* Case sheets set their text at 10.5 pt and leave out "How it works": at
   11 pt with the panel open, Content Garden runs to 2.4 Letter pages and the
   sheet's target is one to two (Scott's B5 ruling, over §4.6's 11 pt body and
   open details). */
.t3 main { font-size: 10.5pt; }
.t3 details.how { display: none; }

/* the contact line closes each case sheet: a hairline above it, at the
   profile's .print-contact size (DL-PF-078) */
.t3 section.print-only { border-top: 1px solid var(--line); margin-top: 12pt; padding-top: 6pt;
  break-inside: avoid; page-break-inside: avoid; }

/* every image figure and figure row after the lead figure (§4.6); the
   Methodology decision-log excerpt is text and prints (Scott's B5 ruling) */
.case-body figure:not(.quote-block),
.case-body .figrow,
.case-body .sixup { display: none; }

figure.quote-block { margin: 8pt 0; break-inside: avoid; page-break-inside: avoid; }
figure.quote-block blockquote { padding: 8pt 10pt; font-size: 8.5pt; line-height: 1.45; }

/* any other <details> prints open (the export script opens them): no chevron,
   no button chrome */
details.how { border: 0; border-top: 1px solid var(--line); border-radius: 0; margin: 10pt 0 0; }
details.how summary { display: block; min-height: 0; padding: 6pt 0 0; font-size: 12pt; }
details.how summary::after { display: none; }
.details-body { padding: 0; }

.table-wrap { overflow: visible; margin: 6pt 0; }
.table-wrap table { font-size: 8.5pt; line-height: 1.35; }
.table-wrap th, .table-wrap td { padding: 3pt 5pt; }
.table-wrap thead th { border-bottom: 1px solid var(--ink-2); }
tr { break-inside: avoid; page-break-inside: avoid; }
thead { display: table-header-group; }

ul.stat-strip { break-inside: avoid; page-break-inside: avoid; }