/* Shell */
.credits__top{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px; background:rgba(255,255,255,.03);
  border:1px solid var(--border); border-radius:var(--r-lg); backdrop-filter:blur(10px);
  margin-bottom:12px;
}
.credits{
  display:grid; gap:16px;
}
.section{
  border:1px solid var(--border); background:rgba(255,255,255,.03);
  border-radius:var(--r-lg); padding:16px; display:grid; gap:12px;
}
.hero .title{
  font-size: clamp(1.2rem, 0.9rem + 1.2vw, 1.8rem);
  font-weight: 800; letter-spacing: -.02em;
}
.hero .subtitle{ color:var(--dim); }

/* Grid cards */
.grid3{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:12px;
}
@media (max-width:1000px){ .grid3{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width:640px){ .grid3{ grid-template-columns: 1fr; } }

.creditCard{
  border:1px solid var(--border); background:var(--card);
  border-radius:14px; padding:14px; display:grid; gap:8px;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.creditCard:hover{ transform:translateY(-2px); background:var(--card2); box-shadow:0 30px 80px rgba(0,0,0,.45) }
.creditCard .name{ font-weight:700; letter-spacing:-.01em; }
.creditCard .meta{ color:var(--dim); font-size:12px; }
.creditCard .links{ display:flex; gap:8px; flex-wrap:wrap; }
.creditCard a{ color:var(--sub); text-decoration:none; }
.creditCard a:hover{ text-decoration:underline; }

/* Lists */
.section__title{ font-weight:800; letter-spacing:-.01em; }
.thanks__list{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.thanks__list li{
  border:1px solid var(--border); background:var(--card);
  border-radius:12px; padding:12px; display:flex; justify-content:space-between; gap:8px;
}
.thanks__list .who{ font-weight:600; }
.thanks__list .why{ color:var(--dim); }

/* License & contact */
.bullets{ margin:0; padding-left:18px; }
.contact{ display:flex; gap:8px; flex-wrap:wrap; }

/* Back to top button */
.toTop{
  position:fixed; right:20px; bottom:24px;
  border:1px solid var(--border); background:rgba(255,255,255,.06);
  color:#fff; border-radius:999px; padding:.55rem .8rem; font-weight:800; cursor:pointer;
  opacity:0; transform:translateY(8px); transition:opacity .2s ease, transform .2s ease;
}
.toTop.show{ opacity:1; transform:translateY(0); }
