.sd-heading { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: space-between; gap: .4rem 1.5rem; margin-bottom: 1.25rem; }
.sd-heading h1 { margin: 0; }
.sd-heading a { font-size: .92rem; }
.sd-search, .sd-card { background: #fff; border: 1px solid #e6e6e6; border-radius: 3px; }
.sd-search { display: grid; gap: .55rem; padding: 1.2rem; margin-bottom: 1.4rem; }
.sd-search label { font-weight: 650; }
.sd-query { display: flex; gap: .5rem; max-width: 48rem; }
.sd-query input { flex: 1; min-width: 0; padding: .6rem .75rem; border: 1px solid #8e989d; border-radius: 3px; font: inherit; }
.sd-query button { border: none; padding: .6rem 1.2rem; border-radius: 3px; background: #a0ce5b; color: #21330c; font: inherit; font-weight: 700; cursor: pointer; }
.sd-query button:hover { background: #b2da77; }
.sd-search > a { justify-self: start; }
.sd-grid { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 1rem; }
.sd-card { padding: 1.15rem; position: relative; }
.sd-card:hover, .sd-card:focus-within { border-color: #659aa4; }
.sd-card :is(h2, h3) { margin: 0; font-size: 1.15rem; }
.sd-card :is(h2, h3) a { display: flex; align-items: center; gap: .8rem; color: #17343c; text-decoration: none; }
.sd-card :is(h2, h3) a::after { content: ""; position: absolute; inset: 0; }
.sd-card :is(h2, h3) a:hover { text-decoration: underline; }
.sd-mark { display: grid; place-items: center; flex: 0 0 56px; height: 56px; color: #155565; background: #edf8fa; font-size: 1.5rem; border-radius: 3px; overflow: hidden; }
.sd-mark img { display: block; object-fit: contain; background: white; }
.sd-card p { margin: .85rem 0 0; color: #50585c; font-size: .94rem; }