/* Printer Triage v0.27 — readability, focus, and navigation polish */

/* Keep the existing visual design, but make secondary text easier to read. */
.sub{font-size:15px;line-height:1.6}
.choice-copy,.problem span,.kb-card p{font-size:14px;line-height:1.55}
label{font-size:13px}
.search-result small{font-size:13px;line-height:1.5}
.article{font-size:16px}
.article .lede{line-height:1.6}
.step-item p{font-size:15px;line-height:1.6}
.howto-tip,.help-task-expect,.help-task-tip{font-size:14px}

/* Make important controls easier to hit without making the interface look oversized. */
.choice-card,.problem,.kb-card{min-height:64px}
.btn,.show-how,.answer,.help-answer{min-height:44px}
.help-modal-close,.guide-modal-close{width:44px;height:44px}
nav a{font-size:15px;padding:10px 2px}

/* Clear keyboard focus for links, buttons, cards, and form fields. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible{
  outline:3px solid #8da2fb;
  outline-offset:3px;
  border-radius:8px;
}
.guided-feature:focus-visible,.error-lookup-card:focus-visible,.choice-card:focus-visible{
  outline-color:#7f96ee;
  outline-offset:4px;
}

/* Easier scanning on navigation-heavy pages. */
.browse-jump{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:20px 0 4px;
}
.browse-jump a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:9px 13px;
  border:1px solid #d8deed;
  border-radius:999px;
  background:#fff;
  color:#344054;
  text-decoration:none;
  font-weight:750;
}
.browse-jump a:hover{border-color:#9eade5;color:var(--blue);background:#f8faff}

.category-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.category-card{
  display:block;
  min-height:118px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  color:var(--ink);
  text-decoration:none;
}
.category-card:hover{border-color:#aeb9dc}
.category-card strong{display:block;font-size:17px;margin-bottom:5px}
.category-card span{display:block;color:var(--muted);font-size:14px;line-height:1.55}

.brand-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}
.brand-card{
  display:block;
  min-height:88px;
  padding:17px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  color:var(--ink);
  text-decoration:none;
}
.brand-card:hover{border-color:#aeb9dc}
.brand-card strong{display:block;font-size:16px;margin-bottom:4px}
.brand-card span{display:block;color:var(--muted);font-size:14px;line-height:1.5}

.brand-hero{text-align:left;padding:42px 0 18px}
.brand-hero h1{max-width:none;margin-bottom:10px}
.brand-hero p{margin:0;max-width:760px}
.brand-start{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:22px 0 8px;
  padding:18px 20px;
  border:1px solid #cfd8f5;
  border-radius:14px;
  background:#f8faff;
}
.brand-start p{margin:3px 0 0;color:var(--muted);font-size:14px}
.brand-start .btn{flex:0 0 auto;text-decoration:none;display:inline-flex;align-items:center}
.brand-section{padding:24px 0}
.brand-section h2{margin:0 0 12px;font-size:24px}

.reading-note{
  margin-top:16px;
  padding:13px 15px;
  border-left:4px solid var(--blue);
  border-radius:8px;
  background:#f7f9ff;
  color:#344054;
  font-size:14px;
  line-height:1.6;
}

@media(max-width:900px){
  .category-grid,.brand-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .category-grid,.brand-grid{grid-template-columns:1fr}
  .brand-start{display:block}
  .brand-start .btn{margin-top:14px;width:100%;justify-content:center}
  .category-card,.brand-card{min-height:0}
}