/* /education/kit — the educator kit page. Tokens only (paper and model spaces). Loads after education.css. */

.page-edkit .page-head .eyebrow a { color: inherit; }
.page-edkit .page-head .hint-line { margin-top: 1.25rem; }

/* Materials: a page thumbnail beside each document. */
.edk-mats { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 992px) { .edk-mats { grid-template-columns: 1fr 1fr; } }
.edk-mat { display: grid; grid-template-columns: 7.5rem 1fr; gap: 1.25rem; padding: 1.25rem; border: var(--pen-1) solid var(--line); border-radius: var(--radius); background: var(--sheet); }
@media (min-width: 576px) { .edk-mat { grid-template-columns: 9.5rem 1fr; } }
.edk-mat-thumb { display: flex; align-items: center; justify-content: center; aspect-ratio: 8.5 / 11; border: var(--pen-1) solid var(--line); border-radius: var(--radius); background: #fff; overflow: hidden; align-self: start; }
.edk-mat-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.edk-mat-thumb.is-empty { background: var(--sheet-2); color: var(--ink-2); font-size: 2.5rem; }
.edk-mat-body > * { margin: 0; }
.edk-mat-h { font-size: var(--fs-md); font-weight: 700; margin-bottom: .35rem; }
.edk-mat .meta-items { margin-bottom: .75rem; font-size: var(--fs-sm); color: var(--ink-2); }
.edk-mat-p { color: var(--ink-2); line-height: 1.55; }
.edk-mat-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem !important; }

.edk-ic { font-size: 1.75rem; color: var(--action); }

/* The eight apps. */
.edk-apps { list-style: none; margin: 1.75rem 0 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 768px) { .edk-apps { grid-template-columns: 1fr 1fr; } }
.edk-app { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.25rem; border: var(--pen-1) solid var(--line); border-left: 4px solid var(--layer); border-radius: var(--radius); background: var(--sheet); }
.edk-app-ic { width: 3rem; height: 3rem; border-radius: var(--radius); }
.edk-app > div > * { margin: 0; }
.edk-app-h { font-size: var(--fs-md); font-weight: 700; margin-bottom: .35rem; }
.edk-app-h a { color: var(--layer); text-decoration: none; }
.edk-app-h a:hover { text-decoration: underline; }
.edk-app-role { display: block; font-size: var(--fs-sm); font-weight: 400; color: var(--ink-2); }
.edk-app-p { color: var(--ink-2); line-height: 1.5; }
.edk-app-c { margin-top: .6rem !important; font-size: var(--fs-sm); }

.edk-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }

/* Setting up a class: numbered steps. */
.edk-steps { list-style: none; margin: 1.75rem 0 0; padding: 0; display: grid; gap: 1rem; }
.edk-step { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.25rem 1.5rem; border: var(--pen-1) solid var(--line); border-radius: var(--radius); background: var(--sheet); }
.edk-step-n { display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border: var(--pen-2, 2px) solid var(--action); border-radius: 50%; color: var(--action); font-weight: 700; font-size: var(--fs-md); }
.edk-step-h { font-size: var(--fs-md); font-weight: 700; margin: 0 0 .35rem; }
.edk-step p { margin: 0; color: var(--ink-2); line-height: 1.55; }

/* Announcement boxes. */
.edk-paste { display: grid; gap: 1.25rem; margin-top: 1.5rem; }
@media (min-width: 992px) { .edk-paste { grid-template-columns: 3fr 2fr; align-items: start; } }
.edk-paste .paste-text-box { width: 100%; font: inherit; font-size: var(--fs-sm); line-height: 1.5; padding: .75rem; margin: .5rem 0; border: var(--pen-1) solid var(--line); border-radius: var(--radius); background: var(--sheet-2); color: var(--ink); resize: vertical; }

/* Questions. */
.edk-faq { margin-top: 1.5rem; border-top: var(--pen-1) solid var(--line); }
.edk-q { border-bottom: var(--pen-1) solid var(--line); }
.edk-q summary { cursor: pointer; padding: 1rem 0; font-weight: 700; font-size: var(--fs-md); }
.edk-q p { margin: 0 0 1.25rem; color: var(--ink-2); line-height: 1.6; }
.edk-next { margin-top: 2.5rem; }
.edk-next .hint { margin-bottom: 0; }

/* Live TeamWork: the two ways to join. */
.edk-live-ways { display: grid; gap: 1rem; margin-top: 1.5rem; }
@media (min-width: 768px) { .edk-live-ways { grid-template-columns: 1fr 1fr; } }
.edk-live-ways p { margin: 0; padding: 1rem 1.25rem; border-left: 4px solid var(--action); background: var(--sheet-2); line-height: 1.55; }
.edk-live-ways .bi { color: var(--action); margin-right: .25rem; }
