/* v2 extras on original palette — min 12px */
html { font-size: 16px; }
body, button, input, select, textarea, label, span, p, a, small { font-size: inherit; }
small, .library-note, .catalogue-footer span, .contact-direct span { font-size: 12px !important; }

.lib-filter { display: inline-flex; align-items: center; gap: .4rem; font-size: 12px; }
.lib-filter select { font: inherit; }

.extras-block { padding: 4rem 1.25rem; max-width: 1120px; margin: 0 auto; }
.factory-wall {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-top: 1.5rem;
}
.factory-wall img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 4px; background: #e8e4dc;
}
.certs-grid, .cases-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1rem; margin-top: 1.5rem;
}
.certs-grid article, .cases-grid article {
  background: #fff; border: 1px solid #e4dfd4; border-radius: 6px; overflow: hidden;
}
.certs-grid img, .cases-grid img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.certs-grid h3, .cases-grid h3 { font-size: 14px; margin: .75rem .9rem .35rem; font-family: "Playfair Display", serif; }
.certs-grid p, .cases-grid p { font-size: 12px; margin: 0 .9rem 1rem; color: #5a5e58; }

/* Modal title wrap on mobile */
#product-modal .modal-content h2,
#product-modal .product-title,
.modal-content h2 {
  overflow-wrap: anywhere; word-break: break-word; font-size: clamp(1.1rem, 4vw, 1.75rem);
}

@media (max-width: 720px) {
  .factory-wall { grid-template-columns: 1fr 1fr; }
  .library-tools { flex-wrap: wrap; gap: .5rem; }
}