/* Conduit training content. Shared, unchanged, by the training preview and Conduit's Training screen. Every rule is
   scoped under .training, so nothing else on a page changes. Colours are Conduit's (styles.css tokens). The two
   nav elements set display, margin and gap themselves, because Conduit styles every nav (grid, and flex on phones). */
.training{--t-navy:#050d14;--t-ink:#0d0f15;--t-muted:#626b73;--t-line:#e1e5e8;--t-accent:#ffd200;--t-blue:#0e6aa1;--t-tip:#fff8db;--t-tip-line:#e8c200;max-width:880px;color:var(--t-ink);font-size:16px;line-height:1.6}
.training a{color:var(--t-blue)}
.training .training-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.training .training-crumbs{display:block;margin:0;padding:0 0 6px;font-size:14px;color:var(--t-muted)}
.training .training-crumbs a{color:var(--t-muted)}
.training .training-crumbs span[aria-hidden]{margin:0 8px;color:#bcc6cd}
.training h1{font-size:30px;line-height:1.2;letter-spacing:-.5px;margin:6px 0 10px}
.training .training-lede{font-size:17px;color:#33393f;margin:0 0 6px}
.training .training-facts{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 26px;padding:0;list-style:none}
.training .training-facts li{background:#fff;border:1px solid var(--t-line);border-radius:20px;padding:3px 12px;font-size:13px;color:var(--t-muted)}
.training .training-intro h3{font-size:18px;margin:26px 0 6px}
.training ul{padding-left:22px}
.training .training-intro li,.training .training-extra li{margin:6px 0}
.training .training-tip{background:var(--t-tip);border-left:5px solid var(--t-tip-line);border-radius:6px;padding:12px 16px;margin:14px 0;font-size:15px}
.training .training-step{background:#fff;border:1px solid var(--t-line);border-radius:12px;margin:18px 0;overflow:hidden}
.training .training-step-head{display:flex;align-items:center;gap:14px;padding:18px 20px 4px}
.training .training-step-num{flex:none;width:46px;height:46px;border-radius:50%;background:var(--t-accent);color:var(--t-navy);display:grid;place-items:center;font-size:22px;font-weight:800;border:3px solid var(--t-navy)}
.training .training-step h2{font-size:20px;line-height:1.3;margin:0;font-weight:700}
.training .training-step-body{padding:4px 20px 18px 80px}
.training .training-step-body p{margin:8px 0}
.training .training-shot{margin:14px 0 4px}
.training .training-shot a{display:inline-block;max-width:100%}
.training .training-shot img{display:block;max-width:100%;height:auto;border:1px solid var(--t-line);border-radius:8px;box-shadow:0 2px 10px #10223214}
.training .training-extra{background:#fff;border:1px solid var(--t-line);border-top:4px solid var(--t-blue);border-radius:12px;padding:16px 20px;margin:24px 0}
.training .training-extra h2{font-size:18px;margin:0 0 4px;font-weight:700}
.training .training-pager{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:30px 0 0;justify-content:stretch}
.training .training-pager a{display:block;background:#fff;border:1px solid var(--t-line);border-radius:10px;padding:12px 16px;text-decoration:none;color:var(--t-ink)}
.training .training-pager a:hover{border-color:var(--t-blue)}
.training .training-pager small{display:block;color:var(--t-muted);font-size:13px}
.training .training-pager .training-next{text-align:right;grid-column:2}
.training .training-pager strong{font-size:15px}
.training .training-back{display:inline-block;margin-top:18px;font-size:14px}
.training .training-group{margin:26px 0 8px;font-size:14px;text-transform:uppercase;letter-spacing:.8px;color:var(--t-muted);font-weight:700}
.training .training-cards{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.training .training-card a{display:block;height:100%;background:#fff;border:1px solid var(--t-line);border-left:5px solid var(--t-accent);border-radius:10px;padding:14px 16px;text-decoration:none;color:var(--t-ink)}
.training .training-card a:hover{border-color:var(--t-blue);border-left-color:var(--t-accent)}
.training .training-card strong{display:block;font-size:17px;line-height:1.3}
.training .training-card span{display:block;color:var(--t-muted);font-size:14px;margin-top:4px}
.training .training-card em{display:block;font-style:normal;color:var(--t-blue);font-size:13px;margin-top:8px;font-weight:600}
.training .training-error{background:#fcece8;border:1px solid #f0c4b8;border-radius:8px;padding:14px 16px}
.training .training-loading{color:var(--t-muted)}
@media (max-width:650px){
  .training h1{font-size:25px}
  .training .training-step-head{padding:16px 16px 2px;gap:12px}
  .training .training-step-num{width:40px;height:40px;font-size:19px}
  .training .training-step h2{font-size:18px}
  .training .training-step-body{padding:4px 16px 16px}
  .training .training-cards{grid-template-columns:1fr}
  .training .training-pager{grid-template-columns:1fr}
  .training .training-pager .training-next{grid-column:1}
}
