/* ==========================================================================
   Colentum — znanstveni-kutak.css
   Stranica „Znanstveni kutak” (page-znanstveni-kutak.php).
   ========================================================================== */

.library {
  display: grid;
  gap: 4rem;
}

@media (min-width: 1024px) { .library { gap: 5rem; } }

/* Naslov skupine s brojem dokumenata */
.library-group__head {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  margin-bottom: 1.75rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--c-stone-200);
}

.library-group__title {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--c-stone-900);
}

@media (min-width: 768px) { .library-group__title { font-size: 1.75rem; } }

.library-group__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 1.75rem;
  padding-inline: 0.625rem;
  border-radius: var(--r-full);
  background: var(--c-white);
  box-shadow: inset 0 0 0 1px var(--c-terracotta-200);
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--c-terracotta-700);
}

/* Mreža dokumenata */
.library-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 768px)  { .library-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .library-grid { grid-template-columns: repeat(3, 1fr); } }

/* Kartica dokumenta */
.doc-card {
  display: flex;
  align-items: flex-start;
  gap: 1.125rem;
  padding: 1.5rem;
  border-radius: var(--r-xl);
  background: var(--c-limestone);
  box-shadow: inset 0 0 0 1px rgba(214, 211, 209, 0.6);
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out);
}

.doc-card:hover {
  transform: translateY(-3px);
  box-shadow: inset 0 0 0 1px var(--c-terracotta-200), var(--shadow-hover);
}

.doc-card:hover .doc-card__icon { transform: translateY(-2px) rotate(-6deg); }

.doc-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 100%;
}

.doc-card__title {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--c-stone-900);
}

.doc-card__meta {
  margin-top: 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--c-terracotta-700);
}

.doc-card__link { margin-top: 1rem; }

@media (prefers-reduced-motion: reduce) {
  .doc-card:hover,
  .doc-card:hover .doc-card__icon { transform: none; }
}

.library__extra { padding-top: 1rem; }