.authorcard {
    --authorcard-ink: #303843;
    --authorcard-muted: #657384;
    --authorcard-accent: #1878b8;
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: clamp(20px, 3vw, 36px);
    clear: both;
    box-sizing: border-box;
    width: 100%;
    margin: 3rem 0 1.5rem;
    padding: 1.5rem 0 0;
    border-top: var(--authorcard-line-height, 1px) solid var(--authorcard-line-color, #d4dce4);
    color: var(--authorcard-ink);
    font-family: inherit;
}

.authorcard__portrait {
    display: grid;
    place-items: center;
    width: 112px;
    height: 112px;
    overflow: hidden;
    border: 1px solid rgba(80, 96, 115, .2);
    border-radius: 50%;
    background: linear-gradient(145deg, #e6f0f6, #dce5ee);
    color: #3d617c;
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: -.03em;
}

.authorcard__portrait img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.authorcard__body { min-width: 0; }
.authorcard--no-image { grid-template-columns: minmax(0, 1fr); }
.authorcard--has-dates { grid-template-columns: 112px minmax(0, 1fr) minmax(190px, max-content); }
.authorcard--no-image.authorcard--has-dates { grid-template-columns: minmax(0, 1fr) minmax(190px, max-content); }
.authorcard__dates { display: none; color: var(--authorcard-muted); font-size: .88rem; line-height: 1.35; }
.authorcard--has-dates .authorcard__dates { display: block; align-self: center; text-align: left; }
.authorcard__dates > * { display: block; margin: 0 0 .12rem; padding: 0; list-style: none; text-align: left; }
.authorcard__dates > *::marker { content: ''; }
.authorcard__dates > *:last-child { margin-bottom: 0; }
.authorcard .authorcard__eyebrow {
    margin: 0 0 .35rem;
    color: var(--authorcard-muted);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.3;
    text-transform: uppercase;
}
.authorcard .authorcard__name {
    margin: 0;
    color: var(--authorcard-ink);
    font-size: clamp(1.18rem, 2vw, 1.4rem);
    font-weight: 700;
    line-height: 1.3;
}
.authorcard .authorcard__role { margin: .18rem 0 .65rem; color: var(--authorcard-ink); font-size: 1rem; line-height: 1.45; }
.authorcard .authorcard__bio { max-width: 65ch; margin: .5rem 0 .8rem; color: var(--authorcard-muted); line-height: 1.55; }
.authorcard .authorcard__link {
    display: flex;
    align-items: center;
    gap: .55rem;
    width: fit-content;
    max-width: 100%;
    margin: .35rem 0;
    color: var(--authorcard-accent);
    text-decoration: none;
    overflow-wrap: anywhere;
    line-height: 1.4;
}
.authorcard .authorcard__link:hover { color: #0c5c96; text-decoration: underline; }
.authorcard__link:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.authorcard__link svg { flex: 0 0 19px; width: 19px; height: 19px; color: #718092; }

@media (max-width: 540px) {
    .authorcard { grid-template-columns: 72px minmax(0, 1fr); align-items: start; gap: 16px; margin-top: 2rem; }
    .authorcard--no-image { grid-template-columns: minmax(0, 1fr); }
    .authorcard--has-dates { grid-template-columns: 72px minmax(0, 1fr); }
    .authorcard--no-image.authorcard--has-dates { grid-template-columns: minmax(0, 1fr); }
    .authorcard--has-dates .authorcard__dates { grid-column: 1 / -1; }
    .authorcard__portrait { width: 72px; height: 72px; font-size: 1.3rem; }
}

@media (min-width: 541px) and (max-width: 800px) {
    .authorcard--has-dates { grid-template-columns: 96px minmax(0, 1fr); }
    .authorcard--no-image.authorcard--has-dates { grid-template-columns: minmax(0, 1fr); }
    .authorcard--has-dates .authorcard__dates { grid-column: 1 / -1; }
}

/* Match YOOtheme's dark sections, independently of the visitor's OS setting. */
.uk-light .authorcard,
.uk-section-secondary .authorcard,
.uk-section-primary .authorcard {
    --authorcard-ink: #edf2f6;
    --authorcard-muted: #bac6d1;
    --authorcard-accent: #7bc5f0;
}

.uk-light .authorcard__link:hover,
.uk-section-secondary .authorcard__link:hover,
.uk-section-primary .authorcard__link:hover { color: #afe0fa; }

/* Article tags in the heading, using the links Joomla/YOOtheme already renders. */
.authorcard-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem .55rem;
    margin: .75rem 0 1.5rem;
    padding: 0;
}
.authorcard-tags__label {
    margin-right: .15rem;
    color: #697789;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.authorcard-tags a.authorcard-tags__link {
    display: inline-flex;
    align-items: center;
    min-height: 1.75rem;
    padding: .22rem .7rem;
    border: 1px solid #d6dce2;
    border-radius: 999px;
    background: #fff;
    color: #3e4854;
    font-size: .78rem;
    font-weight: 500;
    line-height: 1.3;
    text-decoration: none;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}
.authorcard-tags a.authorcard-tags__link:hover {
    border-color: #e40042;
    background: #fff5f8;
    color: #b50037;
    text-decoration: none;
}
.authorcard-tags a.authorcard-tags__link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}
.uk-light .authorcard-tags a.authorcard-tags__link,
.uk-section-secondary .authorcard-tags a.authorcard-tags__link,
.uk-section-primary .authorcard-tags a.authorcard-tags__link {
    border-color: rgba(255, 255, 255, .35);
    background: rgba(255, 255, 255, .12);
    color: #f2f7fb;
}
.uk-light .authorcard-tags__label,
.uk-section-secondary .authorcard-tags__label,
.uk-section-primary .authorcard-tags__label { color: #c6d0db; }
.uk-light .authorcard-tags a.authorcard-tags__link:hover,
.uk-section-secondary .authorcard-tags a.authorcard-tags__link:hover,
.uk-section-primary .authorcard-tags a.authorcard-tags__link:hover {
    background: rgba(255, 255, 255, .22);
}
