.demo-filters{display:flex;flex-wrap:wrap;gap:8px;margin:34px 0 20px}.demo-filter{padding:9px 12px;border:1px solid rgba(8,10,13,.2);background:transparent;color:#737c82;font:9px var(--label);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .25s,color .25s,border-color .25s}.demo-filter:hover,.demo-filter.is-active{border-color:#142a43;background:#142a43;color:#f5f4f0}.demo-card-list{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;border-top:1px solid rgba(8,10,13,.2)}.demo-card{position:relative;display:grid;grid-template-columns:28px 1fr 22px;grid-template-rows:auto auto;align-items:center;column-gap:10px;width:100%;padding:15px 0;border:0;border-bottom:1px solid rgba(8,10,13,.18);background:transparent;color:#17202a;text-align:left;cursor:pointer;transition:padding-left .25s,background .25s}.demo-card-number{grid-row:1/3;font:9px var(--label);color:#a98f65}.demo-card strong{font:500 18px var(--display);line-height:1.1}.demo-card small{font:8px var(--label);letter-spacing:.05em;text-transform:uppercase;color:#737c82;margin-top:5px}.demo-card b{grid-column:3;grid-row:1/3;font-size:18px;font-weight:400;color:#78838b;transition:transform .25s,color .25s}.demo-card:hover,.demo-card.is-active{padding-left:8px;background:rgba(8,10,13,.035)}.demo-card:hover b,.demo-card.is-active b{color:#a98f65;transform:translate(2px,-2px)}.demo-card[hidden]{display:none!important}@media(max-width:900px){.demo-card-list{grid-template-columns:1fr}}@media(max-width:600px){.demo-filters{gap:6px}.demo-filter{font-size:8px;padding:8px 9px}.demo-card strong{font-size:17px}}