:root{--bg:#f7f6f2;--surface:#fff;--text:#211f1a;--muted:#6b6963;--border:#dedbd4;--primary:#026b72;--soft:#e6f0ef}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}.wrap{width:min(1160px,calc(100% - 36px));margin:auto}.site-header{padding:22px 0;border-bottom:1px solid var(--border);background:rgba(247,246,242,.92);position:sticky;top:0;backdrop-filter:blur(10px);z-index:5}.brand{font-weight:850}.hero{padding:72px 0 36px}.eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--primary)}h1{font-size:clamp(2.4rem,6vw,5.3rem);letter-spacing:-.055em;line-height:.95;margin:12px 0 20px}.lead{font-size:1.08rem;line-height:1.7;color:var(--muted);max-width:760px}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0}.filter{border:1px solid var(--border);background:var(--surface);padding:9px 13px;border-radius:999px;cursor:pointer;font-weight:700}.filter.active{background:var(--text);color:#fff}.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  padding-bottom:80px;
}

/* Artifact Card */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:20px;
  padding:22px;

  min-height:250px;

  display:grid;
  grid-template-columns:minmax(0,1fr) 240px;
  gap:30px;

  overflow:hidden;
  cursor:pointer;

  transition:.2s transform,.2s box-shadow;
}

.card:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 34px rgba(0,0,0,.08);
}


/* LEFT CONTENT */

.card-content{
  display:flex;
  flex-direction:column;
  min-width:0;
}

.badge{
  font-size:.72rem;
  font-weight:800;
  color:var(--primary);
  background:var(--soft);
  padding:6px 9px;
  border-radius:999px;
  width:max-content;
}

.card h2{
  font-size:1.4rem;
  margin:20px 0 8px;
}

.card p{
  color:var(--muted);
  line-height:1.6;
  margin:0;
}

.meta{
  font-size:.78rem;
  color:var(--muted);

  margin-top:auto;
  padding-top:22px;

  display:flex;
  justify-content:space-between;
  gap:12px;
}


/* RIGHT THUMBNAIL */

.card-thumb{
  width:100%;
  height:205px;

  border-radius:14px;
  overflow:hidden;

  background:#f0eee8;

  align-self:center;
}

.card-thumb img{
  display:block;

  width:100%;
  height:100%;

  object-fit:cover;
  object-position:center;
}


/* MOBILE */

@media(max-width:760px){

  .card{
    grid-template-columns:1fr;
  }

  .card-thumb{
    height:220px;
    order:-1;
  }

  .meta{
    flex-direction:column;
  }
}





.empty{display:none;color:var(--muted);padding-bottom:80px}footer{border-top:1px solid var(--border);padding:28px 0;color:var(--muted);font-size:.85rem}

.tech{margin-top:4px}.artifact-link{color:var(--primary);font-weight:800;white-space:nowrap}.card-thumb-placeholder{display:flex;align-items:center;justify-content:center;font-size:3rem;color:var(--primary)}
@media(max-width:520px){.hero{padding-top:48px}.card{padding:16px}.card-thumb{height:190px}}