/* Learn library: additions on top of /style.css, using its tokens. */
.subhero h1{hyphens:auto;overflow-wrap:break-word}
.subhero .byline{margin-top:18px;color:var(--muted);font-size:.95rem}
.learn-narrow{max-width:780px}
.wrap.learn-narrow{max-width:none}
.wrap.learn-narrow>*{max-width:780px}
.learn-h2{font-size:1.9rem;margin:0 0 10px}

.learn-list{list-style:none;padding:0;margin:0}
.learn-list li{border-top:1px solid var(--line);padding:22px 0}
.learn-list a{font-size:1.2rem;font-weight:650;color:var(--ink);text-underline-offset:5px}
.learn-list a:hover{text-decoration-thickness:2px}
.learn-list p{margin:8px 0 6px;color:var(--muted)}

.learn-paths{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.learn-path{display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.learn-path h3{margin:0 0 10px}
.learn-path .text-link{margin-top:auto;padding-top:14px}
.learn-path:hover{border-color:var(--ink)}
.featured-path{background:var(--tint);border-color:transparent}

.learn-article{overflow-wrap:anywhere}
.learn-article h2{scroll-margin-top:100px}
.resource-band .actions{min-width:0;max-width:100%}
.resource-band .actions .btn{flex-shrink:1;max-width:100%;text-align:center}
.learn-article code{background:var(--tint);padding:2px 6px;border-radius:6px;font-size:.92em}
.learn-article blockquote{margin:25px 0;padding:20px 24px;border-left:3px solid var(--accent);background:var(--tint);border-radius:0 12px 12px 0}
.learn-article blockquote p{margin:0}

.toc{border:1px solid var(--line);border-radius:16px;padding:22px 26px;margin:0 0 30px}
.toc h2{font-size:.8rem!important;letter-spacing:.13em;text-transform:uppercase;margin:0 0 10px!important}
.toc ol{margin:0;padding-left:20px}
.toc li{margin:6px 0!important;font-size:1rem!important;line-height:1.5!important}

.table-wrap{overflow-x:auto;margin:25px 0;border:1px solid var(--line);border-radius:12px}
.table-wrap:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.table-wrap table{border-collapse:collapse;width:100%;min-width:520px;font-size:.98rem}
.table-wrap th,.table-wrap td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--line);line-height:1.5}
.table-wrap th{background:var(--tint);font-weight:650}
.table-wrap tr:last-child td{border-bottom:0}

.checklist{list-style:none;padding-left:0}
.checklist li{display:flex;gap:12px;align-items:flex-start}
.checklist .box{flex:0 0 18px;height:18px;margin-top:6px;border:1.5px solid var(--ink);border-radius:4px}

.sources{margin-top:50px}
.sources ul{padding-left:20px}

/* Forms: assessment and calculator */
.question{border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin:0 0 18px}
.question legend{font-weight:650;font-size:1.12rem;padding:0 6px}
.question[aria-invalid="true"]{border-color:var(--accent)}
.qnum{color:var(--accent)}
.choice{display:flex;gap:12px;align-items:flex-start;padding:10px 0;cursor:pointer;font-size:1.02rem}
.choice input{width:20px;height:20px;margin:3px 0 0;accent-color:var(--accent);flex:0 0 20px}
.field{margin:0 0 22px}
.field label{display:block;font-weight:650}
.hint{margin:4px 0 8px;color:var(--muted);font-size:.95rem}
.field input,.field select{width:100%;max-width:320px;min-height:48px;padding:10px 14px;border:1px solid var(--muted);border-radius:12px;background:var(--paper);color:var(--ink)}
.field input:focus-visible,.field select:focus-visible,.choice input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.field input[aria-invalid="true"]{border-color:var(--accent);border-width:2px}
.field-error{color:#b3123a;font-weight:650;margin:8px 0 0}
.error-summary{border:2px solid var(--accent);border-radius:16px;padding:20px 24px;margin:0 0 24px}
.error-summary h2{font-size:1.2rem!important;margin:0 0 8px!important}
.error-summary:focus{outline:3px solid var(--accent);outline-offset:3px}
form .actions,.result .actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}
button.btn{cursor:pointer}

.result{margin:40px 0;padding:30px;border-radius:20px;background:var(--tint)}
.result h2{margin-top:0!important}
.result h2:focus{outline:none}
.calc-rows{display:grid;grid-template-columns:1fr auto;gap:0;margin:20px 0}
.calc-rows dt,.calc-rows dd{padding:12px 0;border-bottom:1px solid var(--line);margin:0}
.calc-rows dd{font-weight:650;text-align:right;padding-left:20px}

.resource .actions{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 30px}

@media(max-width:600px){
  .calc-rows{grid-template-columns:1fr}
  .calc-rows dt{border-bottom:0;padding-bottom:2px}
  .calc-rows dd{text-align:left;padding:0 0 12px}
  .question{padding:18px}
  .result{padding:22px}
}

@media print{
  .site-header,footer,.skip,.no-print,.note,.subhero .text-link{display:none!important}
  .subhero{padding:0!important;background:none!important}
  .article{padding:0!important;max-width:none}
  .table-wrap{overflow:visible;border:0}
  .table-wrap table{min-width:0}
  a{color:inherit;text-decoration:none}
}