/* Blog: byline card under the article (cluster bl-). */
:root{
  --bl-ink:#111214;
  --bl-body:rgba(17,18,20,.62);
  --bl-line:#e2ddd4;
  --bl-line-strong:#cfc7b8;
  --bl-milk:#EDE3D5;
  --bl-orange:#FF6A00;
  --bl-orange-hover:#e55e00;
}
.bl-author{
  display:flex;
  gap:24px;
  align-items:flex-start;
  margin:40px 0 0;
  padding:24px;
  border:1px solid var(--bl-line);
  border-radius:4px;
  background:var(--bl-milk);
  font-family:'Roboto',sans-serif;
}
.bl-author__photo{
  flex:0 0 96px;
  width:96px;
  height:96px;
  border-radius:4px;
  overflow:hidden;
  background:#fff;
}
.bl-author__photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.bl-author__body{min-width:0;flex:1 1 auto}
.bl-author__eyebrow{
  display:block;
  margin:0 0 8px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--bl-orange);
}
.bl-author__name{
  margin:0 0 4px;
  font-size:19px;
  font-weight:700;
  line-height:1.3;
  letter-spacing:-.015em;
  color:var(--bl-ink);
}
.bl-author__role{
  margin:0 0 16px;
  font-size:15px;
  line-height:1.6;
  color:var(--bl-body);
}
.bl-author__links{display:flex;flex-wrap:wrap;gap:12px}
.bl-author__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 20px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-decoration:none;
  color:#fff;
  background:var(--bl-orange);
  border:1px solid var(--bl-orange);
  border-radius:4px;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.bl-author__link:hover{background:var(--bl-orange-hover);border-color:var(--bl-orange-hover);color:#fff}
.bl-author__link:focus-visible{outline:2px solid var(--bl-orange);outline-offset:3px}
.bl-author__link--ghost{
  background:transparent;
  color:var(--bl-ink);
  border-color:var(--bl-line-strong);
}
.bl-author__link--ghost:hover{background:var(--bl-ink);border-color:var(--bl-ink);color:#fff}
@media (max-width:600px){
  .bl-author{flex-direction:column;gap:16px;padding:20px}
  .bl-author__link{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .bl-author__link{transition:none}
}
