.visual-library { padding-top: 56px; }
.library-intro { display: grid; grid-template-columns: 1.3fr 1fr; gap: 72px; align-items: end; margin-bottom: 42px; }
.visual-library h1 { font-size: clamp(42px, 4.5vw, 62px); line-height: 1.08; }
.visual-library .library-lead { max-width: 39ch; margin-top: 20px; font-size: 16px; }
.library-search .search-field { margin: 0; padding: 14px 0; border: 0; border-bottom: 1px solid var(--ink); background: transparent; }
.library-search .search-status { margin: 12px 0 0; min-height: 21px; }
.library-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 48px 28px; }
.library-card { grid-column: span 2; min-width: 0; }
.library-card.library-featured { grid-column: span 3; padding-bottom: 28px; border-bottom: 1px solid var(--line); }
.library-visual { display: block; overflow: hidden; background: var(--surface); aspect-ratio: 1.55; }
.library-visual img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.library-featured .library-visual { aspect-ratio: 1.85; }
.library-card:hover .library-visual img { transform: scale(1.025); }
.library-card-copy { padding-top: 20px; }
.library-card h2 { font-size: 22px; line-height: 1.35; letter-spacing: -.025em; text-wrap: pretty; }
.library-featured h2 { font-size: 29px; line-height: 1.3; }
.library-card-copy > p { font-size: 14px; line-height: 1.75; margin-top: 12px; max-width: 60ch; }
.library-featured .library-card-copy > p { font-size: 15px; }
.library-card-bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 22px; color: var(--accent); font-size: 12px; font-weight: 650; }
.library-card-bottom svg { width: 22px; height: 22px; }
.library-document { height: 100%; padding: 30px; overflow: hidden; background: #e8edf4; display: flex; flex-direction: column; justify-content: space-between; color: var(--ink); }
.library-document strong { font-size: clamp(20px, 2.3vw, 30px); line-height: 1.2; letter-spacing: -.035em; max-width: 13ch; font-weight: 650; }
.document-columns { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid currentColor; padding: 14px 0 8px; gap: 10px; font-size: 10px; }
.document-lines { display: grid; gap: 17px; padding-top: 15px; }
.document-lines i { display: block; border-bottom: 1px solid currentColor; opacity: .2; }
.document-profile { background: #214dd9; color: white; }
.document-profile strong { font-size: clamp(28px, 3vw, 44px); }
.document-profile .document-columns { border-bottom: 0; display: flex; flex-wrap: wrap; font-size: 11px; }
.document-profile .document-lines { display: none; }
.document-comparison { background: #dae6df; }
.document-inventory { background: #f0e8dc; }
.document-worksheet { background: #e1e8f7; }
@media (min-width: 1101px) {
  .library-card.library-featured:first-child { grid-column: span 4; }
  .library-card.library-featured:nth-child(2) { grid-column: span 2; }
  .library-featured .library-visual { height: 340px; aspect-ratio: auto; }
  .library-card.library-featured:nth-child(2) h2 { font-size: 25px; }
}
@media (max-width: 1000px) {
  .library-intro { gap: 36px; }
  .library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; }
  .library-card, .library-card.library-featured { grid-column: span 1; }
  .library-featured h2 { font-size: 24px; }
  .library-document { padding: 24px; }
}
@media (max-width: 700px) {
  .visual-library { padding-top: 36px; }
  .library-intro { grid-template-columns: 1fr; gap: 26px; margin-bottom: 28px; }
  .visual-library h1 { font-size: 42px; }
  .visual-library .library-lead { font-size: 15px; margin-top: 16px; }
  .library-search .search-field { padding-block: 12px; }
  .library-search input { font-size: 14px; }
  .library-grid { grid-template-columns: 1fr; gap: 34px; }
  .library-card.library-featured { padding-bottom: 0; border: 0; }
  .library-visual, .library-featured .library-visual { aspect-ratio: 1.55; }
  .library-card-copy { padding-top: 16px; }
  .library-card h2, .library-featured h2 { font-size: 23px; }
  .library-featured .library-card-copy > p { font-size: 14px; }
  .library-card-bottom { margin-top: 16px; }
  .library-document { padding: 28px; }
  .library-document strong { font-size: 28px; }
  .document-profile strong { font-size: 38px; }
}
