/* Educator kit print documents (/education/kit/<key>, education/print.php). Paper space only; sized in inches and points for US Letter.
   On screen each .edp-page is a sheet on a grey desk; in print each is one page. Line work and the title block follow the site's
   drawing style. Colors come from tokens.css (paper values) so the eight layer colors match the site. */

@page { size: letter; margin: 0; }
* { box-sizing: border-box; }
html, body { margin: 0; }
body.edp { background: #D9DEE3; color: var(--ink); font-family: 'Archivo', system-ui, sans-serif; font-size: 10pt; line-height: 1.45; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.edp h1, .edp h2, .edp h3, .edp p, .edp ul, .edp ol, .edp dl, .edp figure { margin: 0; }
.edp ul, .edp ol { padding: 0; list-style: none; }
.edp img { display: block; max-width: 100%; }

/* Screen bar (never printed). */
.edp-bar { position: sticky; top: 0; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; padding: .6rem 1rem; background: var(--ink); color: #fff; font-size: 15px; }
.edp-bar a { color: #fff; }
.edp-bar-t { flex: 1; opacity: .8; }
.edp-bar-a { display: flex; flex-wrap: wrap; gap: .5rem; }
.edp-btn { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.25rem; padding: .35rem .9rem; border: 1px solid #fff; border-radius: 2px; background: transparent; color: #fff; font: inherit; text-decoration: none; cursor: pointer; }
.edp-btn.is-main { background: #fff; color: var(--ink); font-weight: 700; }

/* The sheet. */
.edp main { display: flex; flex-direction: column; align-items: center; gap: .4in; padding: .4in 16px; }
.edp-page { position: relative; display: flex; flex-direction: column; gap: .16in; width: 8.5in; height: 11in; padding: .55in .6in .4in; overflow: hidden; background: #fff; box-shadow: 0 2px 18px rgba(23, 32, 43, .18); }
@media screen and (max-width: 860px) {
  .edp main { padding: 16px; gap: 16px; }
  .edp-page { width: 100%; height: auto; min-height: 0; aspect-ratio: auto; padding: 24px 20px; }
}
@media print {
  body.edp { background: #fff; }
  .edp-bar { display: none; }
  .edp main { display: block; padding: 0; }
  .edp-page { box-shadow: none; break-after: page; page-break-after: always; }
  .edp-page:last-child { break-after: auto; page-break-after: auto; }
}

/* Type. */
.edp-cover-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.edp-logo { width: 2.1in; height: auto; }
.edp-kicker { font-size: 9pt; font-weight: 700; letter-spacing: .02em; color: var(--action); }
.edp-h1 { font-size: 30pt; font-weight: 800; line-height: 1.05; font-stretch: 92%; }
.edp-h1.is-xl { font-size: 46pt; margin-top: .06in; }
.edp-h2 { font-size: 22pt; font-weight: 800; line-height: 1.1; font-stretch: 92%; }
.edp-h3 { font-size: 12pt; font-weight: 700; margin-top: .04in; }
.edp-lede { font-size: 13pt; line-height: 1.4; color: var(--ink-2); }
.edp-p { font-size: 10.5pt; color: var(--ink-2); }
.edp-note { padding: .1in .14in; border-left: 3px solid var(--action); background: var(--sheet); font-size: 9pt; color: var(--ink-2); }
.edp-fine { font-size: 8pt; color: var(--ink-2); }

/* The eight layer colors. */
.edp-strip { display: flex; height: 6px; }
.edp-strip i { flex: 1; background: var(--layer); }

/* Cover. */
.edp-shot { border: 1px solid var(--line); }
.edp-shot img { width: 100%; height: auto; }
.edp-shot figcaption { padding: .04in .08in; font-size: 7.5pt; color: var(--ink-2); border-top: 1px solid var(--line); }
.edp-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .14in; margin-top: auto; }
.edp-facts li { padding: .12in .14in; border: 1px solid var(--ink); }
.edp-facts b { display: block; font-size: 18pt; font-weight: 800; line-height: 1.1; color: var(--action); }
.edp-facts span { font-size: 9pt; color: var(--ink-2); }

/* Points in two columns. */
.edp-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: .18in .26in; }
.edp-grid2.is-tight { gap: .1in .22in; }
.edp-point { display: grid; grid-template-columns: .34in 1fr; column-gap: .1in; align-content: start; }
.edp-point .bi { grid-row: span 2; font-size: 18pt; line-height: 1; color: var(--action); }
.edp-point h3 { font-size: 11pt; font-weight: 700; margin-bottom: .03in; }
.edp-point p { font-size: 9pt; color: var(--ink-2); }
.edp-point.is-plain { display: block; padding-left: .1in; border-left: 2px solid var(--line); }
.edp-point.is-plain h3 { font-size: 10pt; }
.edp-point.is-plain p { font-size: 8.5pt; }

.edp-band { padding: .16in .18in; border: 1px solid var(--ink); background: var(--sheet); }
.edp-band h3 { font-size: 12pt; font-weight: 700; margin-bottom: .08in; }
.edp-band p { font-size: 9pt; color: var(--ink-2); margin-top: .08in; }
.edp-chips { display: flex; flex-wrap: wrap; gap: .06in; }
.edp-chips li { padding: .02in .1in; border: 1px solid var(--ink); background: #fff; font-weight: 700; font-size: 9pt; }

/* The eight apps. */
.edp-apps { display: grid; grid-template-columns: 1fr 1fr; gap: .12in .16in; }
.edp-app { display: grid; grid-template-columns: .4in 1fr; gap: .1in; padding: .1in .12in; border: 1px solid var(--line); border-left: 4px solid var(--layer); }
.edp-app img { width: .4in; height: .4in; }
.edp-app h3 { font-size: 11pt; font-weight: 700; color: var(--layer); }
.edp-app h3 span { display: block; font-size: 8pt; font-weight: 400; color: var(--ink-2); }
.edp-app p { font-size: 8pt; line-height: 1.35; color: var(--ink-2); margin-top: .03in; }
.edp-app .edp-app-c { color: var(--ink); }

/* Student path. */
.edp-path { display: grid; grid-template-columns: repeat(4, 1fr); gap: .1in; }
.edp-path li { padding: .08in .1in; border: 1px solid var(--line); }
.edp-path li.is-first { border: 2px solid var(--action); }
.edp-path b { display: block; font-size: 16pt; font-weight: 800; line-height: 1.1; }
.edp-path li.is-first b { color: var(--action); }
.edp-path span { font-size: 8pt; color: var(--ink-2); }

/* Call to action with a QR code. */
.edp-cta { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .2in; padding: .14in .18in; border: 2px solid var(--action); }
.edp-cta img { width: 1.15in; height: 1.15in; }
.edp-cta h3 { font-size: 13pt; font-weight: 800; margin-bottom: .04in; }
.edp-cta p { font-size: 9.5pt; color: var(--ink-2); }

/* Numbered steps (handout, guide). */
.edp-steps { display: grid; gap: .1in; }
.edp-steps li { display: grid; grid-template-columns: .38in 1fr; gap: .1in; align-items: start; }
.edp-n { display: flex; align-items: center; justify-content: center; width: .34in; height: .34in; border: 2px solid var(--action); border-radius: 50%; color: var(--action); font-weight: 800; font-size: 12pt; }
.edp-steps h3 { font-size: 11pt; font-weight: 700; }
.edp-steps p { font-size: 9pt; color: var(--ink-2); }
.edp-steps.is-row { grid-template-columns: repeat(3, 1fr); gap: .16in; }

/* Flyer. */
.edp-flyer { gap: .17in; }
.edp-flyer .edp-lede { font-size: 15pt; }
.edp-flyer-apps { display: grid; grid-template-columns: repeat(2, 1fr); gap: .08in .2in; }
.edp-flyer-apps li { display: flex; align-items: center; gap: .1in; padding: .05in 0; border-bottom: 2px solid var(--layer); }
.edp-flyer-apps img { width: .36in; height: .36in; }
.edp-flyer-apps span { font-size: 8.5pt; color: var(--ink-2); }
.edp-flyer-apps b { display: block; font-size: 12pt; color: var(--layer); }
.edp-flyer-box { display: grid; grid-template-columns: 1fr auto; gap: .25in; align-items: center; padding: .22in .26in; background: var(--ink); color: #fff; }
.edp-flyer-box .edp-kicker { color: #9CC3FF; }
.edp-flyer-box h2 { font-size: 22pt; font-weight: 800; line-height: 1.1; margin: .04in 0 .08in; }
.edp-flyer-box p { font-size: 10pt; opacity: .9; }
.edp-qr { text-align: center; }
.edp-qr img { width: 1.7in; height: 1.7in; }
.edp-qr figcaption { margin-top: .05in; font-size: 9pt; font-weight: 700; }
.edp-flyer-how { display: grid; grid-template-columns: repeat(3, 1fr); gap: .12in; }
.edp-flyer-how li { padding: .08in .1in; border: 1px solid var(--ink); font-size: 10pt; }
.edp-flyer-how b { display: block; color: var(--action); }

/* Handout. */
.edp-blanks { display: grid; grid-template-columns: 1fr 1fr; gap: .12in .3in; }
.edp-blanks p { display: flex; align-items: flex-end; gap: .1in; font-size: 9pt; font-weight: 700; }
.edp-blanks i { flex: 1; height: .26in; border-bottom: 1px solid var(--ink); }
.edp-tips { padding: .12in .16in; background: var(--sheet); }
.edp-tips h3 { font-size: 11pt; font-weight: 700; margin-bottom: .05in; }
.edp-tips ul { list-style: disc; padding-left: .2in; }
.edp-tips li { font-size: 9pt; color: var(--ink-2); margin-bottom: .03in; }

/* Guide. */
.edp-table { width: 100%; border-collapse: collapse; font-size: 9pt; }
.edp-table th, .edp-table td { padding: .05in .08in; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.edp-table thead th { border-bottom: 2px solid var(--ink); }
.edp-table tbody th { width: 1in; }
.edp-faq dt { font-size: 9.5pt; font-weight: 700; margin-top: .06in; }
.edp-faq dd { margin: .01in 0 0; font-size: 8.5pt; line-height: 1.35; color: var(--ink-2); }

/* Title block, at the foot of every sheet. */
.edp-tb { display: grid; grid-template-columns: 1.6in 1.6fr 1fr 1fr 2fr; margin-top: auto; border: 1.5px solid var(--ink); font-size: 8pt; }
.edp-tb > * { padding: .06in .09in; border-left: 1px solid var(--ink); }
.edp-tb > img { border-left: 0; width: 100%; height: auto; align-self: center; padding: .06in .1in; }
.edp-tb-c b { display: block; font-size: 6.5pt; font-weight: 400; color: var(--ink-2); }
@media screen and (max-width: 860px) {
  .edp-grid2, .edp-apps, .edp-flyer-apps, .edp-blanks, .edp-steps.is-row { grid-template-columns: 1fr; }
  .edp-path, .edp-facts, .edp-flyer-how { grid-template-columns: 1fr 1fr; }
  .edp-flyer-box, .edp-cta { grid-template-columns: 1fr; }
  .edp-tb { grid-template-columns: 1fr 1fr; }
  .edp-tb > img { grid-column: span 2; border-bottom: 1px solid var(--ink); }
  .edp-h1.is-xl { font-size: 34pt; }
}

/* Brochure page 2: Live TeamWork. */
.edp-live { display: grid; gap: 8pt; padding: 12pt 14pt; border: 2pt solid var(--action); border-radius: var(--radius); }
.edp-live > h3 { font-size: 15pt; font-weight: 800; margin-top: -4pt; }
