/* Columnist identity: band, avatars, cards, sidebar box, vertical A-/A+ layout. */

.avatar { display: inline-block; overflow: hidden; background: var(--surface-soft); flex: none; line-height: 0; position: relative; }
.avatar__img { width: 100%; height: 100%; object-fit: cover; }
.avatar__fallback { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: var(--muted); background: #e3e3e6; }
.avatar--round { border-radius: 50%; width: 74px; height: 74px; }
.avatar--square { width: 138px; height: 138px; border-radius: 6px; }
.avatar--lg { width: 88px; height: 88px; }
.avatar--ring { width: 124px; height: 124px; border-radius: 50%; border: 5px solid var(--col-border, var(--accent)); }

/* Band */
.col-band { --col-bg: #eeeeee; background: var(--col-bg); background-image: linear-gradient(90deg, rgba(0, 0, 0, .03), rgba(255, 255, 255, .4) 60%, rgba(0, 0, 0, .02)); color: var(--col-color, var(--text)); margin: 6px 0 36px; }
.col-band__inner { display: flex; align-items: center; gap: 26px; padding: 14px 58px; }
.col-band__avatar { flex: none; }
.col-band__name { display: inline-block; font-size: 38px; line-height: 1.1; font-weight: 400; letter-spacing: .005em; padding-bottom: 6px; border-bottom: 2px solid var(--col-border, var(--accent)); margin: 0; color: inherit; }
.col-band__name strong { font-weight: 800; }
.col-band__name:hover { text-decoration: none; }
.col-band__person { display: flex; align-items: center; gap: 10px; margin-top: 12px; font-size: 16px; }
.col-band__person .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--col-border, var(--accent)); display: inline-block; }

/* Columnist single layout: A-/A+ in the left gutter, wide image, article + sidebar (measured from the reference) */
.single--columnist { max-width: calc(1084px + 2 * var(--gutter)); padding-top: 0; }
.col-head { position: relative; padding-inline: 80px; }
.col-head__tools { position: absolute; left: 0; top: 8px; }
.col-head .fontctl { flex-direction: column; gap: 0; border: 1px solid var(--border); border-radius: 4px; overflow: hidden; background: var(--surface); }
.col-head .fontctl button { border: 0; border-radius: 0; height: 40px; min-width: 40px; }
.col-head .fontctl button + button { border-top: 1px solid var(--border); }
.col-head .single__title, .col-head .single-meta { max-width: none; }
.single--columnist .single-figure { margin-top: 26px; }
.single--columnist .single__grid { padding-inline: 80px; grid-template-columns: minmax(0, 1fr) var(--sidebar-width); gap: 20px; }
.single--columnist .single__content, .single--columnist .single-foot { max-width: none; }
.single--columnist .entry-content { font-size: var(--pep-fs); line-height: var(--pep-lh); }

/* Cards used by columns */
.col-mini { display: flex; align-items: flex-start; gap: 14px; min-width: 0; }
.col-mini__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.col-mini__headline { font-size: 16px; font-weight: 700; line-height: 1.22; }
.col-mini__headline:hover { text-decoration: underline; text-decoration-color: var(--accent); }
.col-mini .avatar { width: 74px; height: 74px; }
.widget--columns { border: 1px solid var(--border); border-radius: 6px; padding: 18px 20px; }
.widget--columns .widget__title { margin-bottom: 18px; }
.widget-cols { display: grid; gap: 18px; }
.widget--columns .col-mini .avatar { width: 66px; height: 66px; }
.widget--columns .col-mini__headline { font-size: 15px; }

/* Sidebar box */
.col-box { display: flex; align-items: center; gap: 16px; border: 1px solid var(--border); border-radius: 6px; padding: 18px 20px; margin-bottom: 26px; background: var(--surface); }
.col-box__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.col-box__name { font-size: 24px; line-height: 1.15; font-weight: 700; }
.col-box__sub { font-size: 13px; color: var(--muted); }
.col-box__more { font-size: 13px; color: var(--accent-text); margin-top: 6px; display: inline-flex; align-items: center; gap: 4px; }
.single--column-profile .col-bio { margin-bottom: 20px; }
.col-card__avatar, .col-mini__avatar, .col-box__avatar, .col-band__avatar { display: block; flex: none; }