.bkbg-okr-wrap { box-sizing: border-box; } /* ── Title ──────────────────────────────────────────────────── */ .bkbg-okr-wrap h3.bkbg-okr-title, .bkbg-okr-wrap .bkbg-okr-title { font-size: var(--bkbg-okr-tt-font-size-d, 18px); font-weight: var(--bkbg-okr-tt-font-weight, 700); line-height: var(--bkbg-okr-tt-line-height-d, var(--bkbg-okr-tt-line-height, 1.4)); font-style: var(--bkbg-okr-tt-font-style); text-decoration: var(--bkbg-okr-tt-text-decoration); text-transform: var(--bkbg-okr-tt-text-transform); letter-spacing: var(--bkbg-okr-tt-letter-spacing-d, var(--bkbg-okr-tt-letter-spacing)); font-family: var(--bkbg-okr-tt-font-family); margin: 0 0 4px; } /* ── Period ──────────────────────────────────────────────────── */ .bkbg-okr-period { font-size: 13px; line-height: 1.4; } /* ── Objective label & percentage ────────────────────────────── */ .bkbg-okr-obj-label, .bkbg-okr-obj-pct { font-size: var(--bkbg-okr-ol-font-size-d, 14px); font-weight: var(--bkbg-okr-ol-font-weight, 700); line-height: var(--bkbg-okr-ol-line-height-d, var(--bkbg-okr-ol-line-height, 1.4)); font-style: var(--bkbg-okr-ol-font-style); text-decoration: var(--bkbg-okr-ol-text-decoration); text-transform: var(--bkbg-okr-ol-text-transform); letter-spacing: var(--bkbg-okr-ol-letter-spacing-d, var(--bkbg-okr-ol-letter-spacing)); font-family: var(--bkbg-okr-ol-font-family); } /* ── Key Result label ────────────────────────────────────────── */ .bkbg-okr-kr-label { font-size: var(--bkbg-okr-kr-font-size-d, 13px); font-weight: var(--bkbg-okr-kr-font-weight, 400); line-height: var(--bkbg-okr-kr-line-height-d, var(--bkbg-okr-kr-line-height, 1.4)); font-style: var(--bkbg-okr-kr-font-style); text-decoration: var(--bkbg-okr-kr-text-decoration); text-transform: var(--bkbg-okr-kr-text-transform); letter-spacing: var(--bkbg-okr-kr-letter-spacing-d, var(--bkbg-okr-kr-letter-spacing)); font-family: var(--bkbg-okr-kr-font-family); } .bkbg-okr-objective { box-sizing: border-box; } /* ── Responsive typography ──────────────────────────────────── */ @media (max-width: 1024px) { .bkbg-okr-wrap h3.bkbg-okr-title, .bkbg-okr-wrap .bkbg-okr-title { font-size: var(--bkbg-okr-tt-font-size-t, var(--bkbg-okr-tt-font-size-d, 18px)); line-height: var(--bkbg-okr-tt-line-height-t, var(--bkbg-okr-tt-line-height-d, var(--bkbg-okr-tt-line-height, 1.4))); letter-spacing: var(--bkbg-okr-tt-letter-spacing-t, var(--bkbg-okr-tt-letter-spacing-d, var(--bkbg-okr-tt-letter-spacing))); } .bkbg-okr-obj-label, .bkbg-okr-obj-pct { font-size: var(--bkbg-okr-ol-font-size-t, var(--bkbg-okr-ol-font-size-d, 14px)); line-height: var(--bkbg-okr-ol-line-height-t, var(--bkbg-okr-ol-line-height-d, var(--bkbg-okr-ol-line-height, 1.4))); letter-spacing: var(--bkbg-okr-ol-letter-spacing-t, var(--bkbg-okr-ol-letter-spacing-d, var(--bkbg-okr-ol-letter-spacing))); } .bkbg-okr-kr-label { font-size: var(--bkbg-okr-kr-font-size-t, var(--bkbg-okr-kr-font-size-d, 13px)); line-height: var(--bkbg-okr-kr-line-height-t, var(--bkbg-okr-kr-line-height-d, var(--bkbg-okr-kr-line-height, 1.4))); letter-spacing: var(--bkbg-okr-kr-letter-spacing-t, var(--bkbg-okr-kr-letter-spacing-d, var(--bkbg-okr-kr-letter-spacing))); } } @media (max-width: 767px) { .bkbg-okr-wrap h3.bkbg-okr-title, .bkbg-okr-wrap .bkbg-okr-title { font-size: var(--bkbg-okr-tt-font-size-m, 16px); line-height: var(--bkbg-okr-tt-line-height-m, var(--bkbg-okr-tt-line-height-t, var(--bkbg-okr-tt-line-height-d, var(--bkbg-okr-tt-line-height, 1.4)))); letter-spacing: var(--bkbg-okr-tt-letter-spacing-m, var(--bkbg-okr-tt-letter-spacing-t, var(--bkbg-okr-tt-letter-spacing-d, var(--bkbg-okr-tt-letter-spacing)))); } .bkbg-okr-obj-label, .bkbg-okr-obj-pct { font-size: var(--bkbg-okr-ol-font-size-m, 13px); line-height: var(--bkbg-okr-ol-line-height-m, var(--bkbg-okr-ol-line-height-t, var(--bkbg-okr-ol-line-height-d, var(--bkbg-okr-ol-line-height, 1.4)))); letter-spacing: var(--bkbg-okr-ol-letter-spacing-m, var(--bkbg-okr-ol-letter-spacing-t, var(--bkbg-okr-ol-letter-spacing-d, var(--bkbg-okr-ol-letter-spacing)))); } .bkbg-okr-kr-label { font-size: var(--bkbg-okr-kr-font-size-m, 12px); line-height: var(--bkbg-okr-kr-line-height-m, var(--bkbg-okr-kr-line-height-t, var(--bkbg-okr-kr-line-height-d, var(--bkbg-okr-kr-line-height, 1.4)))); letter-spacing: var(--bkbg-okr-kr-letter-spacing-m, var(--bkbg-okr-kr-letter-spacing-t, var(--bkbg-okr-kr-letter-spacing-d, var(--bkbg-okr-kr-letter-spacing)))); } }