.vt-presbyters {
    --vt-presbyters-ink: var(--tc-heading-color, #060606);
    --vt-presbyters-body: var(--tc-body-color, #808080);
    --vt-presbyters-brown: var(--tc-color-brand1-700, #604c33);
    --vt-presbyters-gold: var(--tc-theme-primary, #c09867);
    --vt-presbyters-gold-light: var(--tc-color-brand1-50, #f9f6f1);
    --vt-presbyters-border: var(--tc-color-brand1-100, #e5d6c3);
    display: grid;
    gap: 34px;
    margin: 42px 0 24px;
}

.vt-presbyters__group {
    overflow: hidden;
    border: 1px solid var(--vt-presbyters-border);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(48, 38, 26, .08);
}

.vt-presbyters__group-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 17px;
    min-height: 104px;
    padding: 22px 28px;
    color: var(--vt-presbyters-ink);
    background:
        radial-gradient(circle at 88% 20%, rgba(192, 152, 103, .16), transparent 28%),
        linear-gradient(135deg, #fff, var(--vt-presbyters-gold-light));
}

.vt-presbyters__group-header::after {
    content: '';
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--vt-presbyters-gold), rgba(192, 152, 103, .18));
}

.vt-presbyters__group--substitute .vt-presbyters__group-header {
    background:
        radial-gradient(circle at 88% 20%, rgba(192, 152, 103, .12), transparent 28%),
        linear-gradient(135deg, #fff, #fbfaf8);
}

.vt-presbyters__sort {
    display: grid;
    grid-template-columns: minmax(175px, 1.25fr) repeat(3, minmax(150px, 1fr)) auto;
    gap: 11px;
    align-items: end;
    padding: 18px 24px;
    border-bottom: 1px solid var(--vt-presbyters-border);
    background: #fff;
}

.vt-presbyters__sort-intro {
    display: grid;
    gap: 2px;
    padding-bottom: 2px;
}

.vt-presbyters__sort-intro strong {
    color: var(--vt-presbyters-ink);
    font-size: 14px;
}

.vt-presbyters__sort-intro span {
    color: var(--vt-presbyters-body);
    font-size: 11px;
    line-height: 1.35;
}

.vt-presbyters__sort-field {
    display: grid;
    gap: 5px;
    color: var(--vt-presbyters-brown);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.vt-presbyters__sort-field select {
    width: 100%;
    min-height: 38px;
    padding: 0 30px 0 10px;
    border: 1px solid var(--vt-presbyters-border);
    border-radius: 7px;
    color: var(--vt-presbyters-ink);
    background: #fff;
    font: inherit;
    font-size: 13px;
    letter-spacing: normal;
    text-transform: none;
}

.vt-presbyters__sort-field select:focus {
    border-color: var(--vt-presbyters-gold);
    outline: 2px solid rgba(192, 152, 103, .25);
    outline-offset: 1px;
}

.vt-presbyters__sort-actions {
    display: flex;
    gap: 6px;
}

.vt-presbyters__sort-actions button {
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid var(--vt-presbyters-gold);
    border-radius: 7px;
    color: #fff;
    background: var(--vt-presbyters-brown);
    box-shadow: none;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.vt-presbyters__sort-actions button:hover,
.vt-presbyters__sort-actions button:focus {
    border-color: var(--vt-presbyters-brown);
    background: var(--tc-color-brand1-600, #8f714d);
}

.vt-presbyters__sort-actions button[data-presbyters-sort-reset] {
    color: var(--vt-presbyters-brown);
    background: #fff;
}

.vt-presbyters__sort-actions button[data-presbyters-sort-reset]:hover,
.vt-presbyters__sort-actions button[data-presbyters-sort-reset]:focus {
    background: var(--vt-presbyters-gold-light);
}

.vt-presbyters__emblem {
    display: grid;
    flex: 0 0 54px;
    place-items: center;
    width: 54px;
    height: 54px;
    border: 1px solid rgba(96, 76, 51, .18);
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(145deg, var(--tc-color-brand1-400, #ccac85), var(--tc-color-brand1-600, #8f714d));
    box-shadow: 0 8px 20px rgba(96, 76, 51, .18);
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 25px;
    font-weight: 700;
}

.vt-presbyters__heading {
    display: block;
    min-width: 0;
}

.vt-presbyters__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--tc-color-brand1-600, #8f714d);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    line-height: 1.4;
    text-transform: uppercase;
}

.vt-presbyters .vt-presbyters__group-header h2 {
    margin: 0;
    color: var(--vt-presbyters-ink);
    font-size: clamp(1.45rem, 2.4vw, 2rem);
    line-height: 1.12;
}

.vt-presbyters__count {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    margin-left: auto;
    padding: 7px 12px;
    border: 1px solid var(--vt-presbyters-border);
    border-radius: 999px;
    color: var(--vt-presbyters-brown);
    background: #fff;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.vt-presbyters__table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.vt-presbyters__table {
    width: 100%;
    min-width: 650px;
    margin: 0;
    table-layout: fixed;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
}

.vt-presbyters__table th,
.vt-presbyters__table td {
    height: auto;
    border: 0;
    border-bottom: 1px solid var(--vt-presbyters-border);
    text-align: left;
    vertical-align: middle;
    word-break: normal;
}

.vt-presbyters__table th {
    padding: 13px 24px;
    color: var(--tc-color-neutral-400, #565656);
    background: var(--vt-presbyters-gold-light);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.4;
    text-transform: uppercase;
}

.vt-presbyters__table td {
    padding: 16px 24px;
    color: var(--tc-color-neutral-500, #2c2c2c);
    background: #fff;
    font-size: 15px;
    line-height: 1.45;
    transition: background-color .16s ease;
}

.vt-presbyters__table th:first-child,
.vt-presbyters__table td:first-child {
    width: 48%;
}

.vt-presbyters__table tbody tr:hover td {
    background: #fbfaf8;
}

.vt-presbyters__table tbody tr:last-child td {
    border-bottom: 0;
}

.vt-presbyters__name {
    color: var(--vt-presbyters-ink);
    font-weight: 700;
}

.vt-presbyters__role,
.vt-presbyters__term {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.vt-presbyters__role {
    color: var(--vt-presbyters-brown);
    background: var(--tc-color-yellow-light-3, #f5eacd);
}

.vt-presbyters__group--substitute .vt-presbyters__role,
.vt-presbyters__role--substitute {
    color: var(--tc-color-brand1-600, #8f714d);
    background: var(--vt-presbyters-gold-light);
}

.vt-presbyters__term {
    color: #72532f;
    background: var(--vt-presbyters-gold-light);
    font-variant-numeric: tabular-nums;
}

.vt-presbyters__updated {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: -10px 0 0;
    color: var(--vt-presbyters-body);
    font-size: 12px;
    line-height: 1.5;
}

.vt-presbyters__updated span {
    color: var(--vt-presbyters-gold);
    font-size: 15px;
}

.vt-presbyters__updated time {
    color: var(--vt-presbyters-brown);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 700px) {
    .vt-presbyters {
        gap: 24px;
        margin-top: 30px;
    }

    .vt-presbyters__group {
        border-radius: 13px;
    }

    .vt-presbyters__group-header {
        gap: 13px;
        min-height: 88px;
        padding: 18px;
    }

    .vt-presbyters__emblem {
        flex-basis: 46px;
        width: 46px;
        height: 46px;
        border-radius: 12px;
        font-size: 21px;
    }

    .vt-presbyters__eyebrow {
        font-size: 9px;
    }

    .vt-presbyters__count {
        padding: 5px 9px;
        font-size: 10px;
    }

    .vt-presbyters__table-wrap {
        overflow: visible;
        padding: 10px;
        background: var(--vt-presbyters-gold-light);
    }

    .vt-presbyters__sort {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 15px 18px;
    }

    .vt-presbyters__sort-intro {
        grid-column: 1 / -1;
    }

    .vt-presbyters__sort-actions {
        grid-column: 1 / -1;
    }

    .vt-presbyters__table,
    .vt-presbyters__table tbody,
    .vt-presbyters__table tr,
    .vt-presbyters__table td {
        display: block;
        width: 100%;
        min-width: 0;
    }

    .vt-presbyters__table thead {
        position: absolute;
        overflow: hidden;
        width: 1px;
        height: 1px;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .vt-presbyters__table tbody tr {
        overflow: hidden;
        margin-bottom: 10px;
        border: 1px solid var(--vt-presbyters-border);
        border-left: 3px solid var(--vt-presbyters-gold);
        border-radius: 10px;
        background: #fff;
        box-shadow: 0 4px 12px rgba(48, 38, 26, .05);
    }

    .vt-presbyters__table tbody tr:last-child {
        margin-bottom: 0;
    }

    .vt-presbyters__table td {
        display: grid;
        grid-template-columns: minmax(86px, 34%) 1fr;
        gap: 10px;
        align-items: center;
        padding: 10px 12px;
        border-bottom: 1px solid #eee8df;
        font-size: 14px;
    }

    .vt-presbyters__table td::before {
        content: attr(data-label);
        color: var(--vt-presbyters-body);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .05em;
        text-transform: uppercase;
    }

    .vt-presbyters__table td:last-child {
        border-bottom: 0;
    }

    .vt-presbyters__table tbody tr:hover td {
        background: #fff;
    }

    .vt-presbyters__role,
    .vt-presbyters__term {
        justify-self: start;
    }

    .vt-presbyters__updated {
        margin-top: -4px;
    }
}

@media (max-width: 440px) {
    .vt-presbyters__group-header {
        gap: 10px;
        padding: 16px 14px;
    }

    .vt-presbyters__count {
        padding-right: 7px;
        padding-left: 7px;
    }

    .vt-presbyters__sort {
        grid-template-columns: 1fr;
        padding: 14px;
    }

    .vt-presbyters__sort-intro,
    .vt-presbyters__sort-actions {
        grid-column: auto;
    }

    .vt-presbyters__sort-actions button {
        flex: 1 1 auto;
    }
}