/*
 * OKR card component — a simple objective + key-results box shown on an
 * OKR example detail page, in place of letter/'s printed-letter-styled
 * .ltr-card (an OKR isn't a document you fill in and send, so that visual
 * treatment doesn't fit here). Everything else on these pages reuses
 * job-descriptions/style.css's .jd-* classes, loaded alongside this file —
 * see the comment atop okr/detail.php.
 *
 * Built 2026-10-01.
 */

.okr-card {
    background: #fff;
    border: 1px solid #e7e5e4;
    border-left: 4px solid #2563eb;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    padding: 20px 24px;
    margin: 0 0 20px;
}
.okr-card__objective {
    font-size: 1rem;
    line-height: 1.6;
    color: #1c1917;
    margin: 0 0 10px;
}
.okr-card__label {
    font-weight: 700;
    color: #2563eb;
}
.okr-card__krs {
    margin: 0;
    padding-left: 22px;
}
.okr-card__krs li {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #44403c;
    margin-bottom: 6px;
}
.okr-card__krs li:last-child {
    margin-bottom: 0;
}

/* Role heading above a run of okr-cards, when an example's OKRs are grouped
   by job role (e.g. "Chief Technical Officer", "Software Engineer") rather
   than presented as one flat list — see the 'role' key on okrs[] entries,
   documented atop okr/detail.php. */
.okr-role {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1c1917;
    margin: 28px 0 10px;
}
.okr-role:first-of-type {
    margin-top: 4px;
}

/* Optional short blurb under a role heading, giving context before its
   run of okr-cards (e.g. why that HR function's OKRs look the way they
   do) — see the 'role_intro' key documented atop okr/detail.php. */
.okr-role-intro {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #57534e;
    margin: 0 0 14px;
}