.okcsd { color: #173d32; }
.okcsd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 24px; margin: 24px 0 36px; }
.okcsd-card { display: flex; flex-direction: column; gap: 12px; padding: 28px; background: #fbf8ee; border: 1px solid #dcded5; border-radius: 12px; color: #173d32; text-decoration: none; }
.okcsd-card h3, .okcsd-card p { margin: 0; }
.okcsd-card h3 { font-size: 1.45rem; }
.okcsd-card p { line-height: 1.6; }
.okcsd-card span { font-size: .9rem; }
.okcsd-card b { color: #b73f22; margin-top: auto; padding-top: 10px; }
.okcsd-card:focus-visible, .okcsd a:focus-visible, .okcsd input:focus-visible, .okcsd select:focus-visible, .okcsd button:focus-visible { outline: 3px solid #b73f22; outline-offset: 4px; }
.okcsd-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 16px; padding: 24px; background: #f2eee2; border-radius: 12px; }
.okcsd-filters label { display: flex; flex: 1 1 180px; flex-direction: column; gap: 8px; font-weight: 600; }
.okcsd-filters input, .okcsd-filters select { box-sizing: border-box; width: 100%; min-height: 48px; padding: 10px; font: inherit; background: white; color: #173d32; border: 1px solid #89948e; border-radius: 5px; }
.okcsd-filters button, .okcsd-button { display: inline-block; padding: 14px 22px; min-height: 48px; box-sizing: border-box; background: #173d32; color: #fff; border: 0; border-radius: 6px; text-decoration: none; font: inherit; cursor: pointer; }
.okcsd-note { background: #f2eee2; padding: 20px; border-left: 3px solid #b73f22; line-height: 1.6; }
.okcsd-home { max-width: 1180px; margin: 48px auto; padding: 0 24px; }
main .okcsd-home { padding: 0; }
.okcsd-heading { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 16px; }
.okcsd-heading h2 { margin-bottom: 12px; }
@media (max-width: 600px) { .okcsd-filters { padding: 16px; } .okcsd-filters label { flex-basis: 100%; } .okcsd-filters button { width: 100%; } .okcsd-card { padding: 22px; } }