.resource-eyebrow { display: block; color: var(--color-brand-hover); font-size: var(--text-sm); font-weight: var(--font-weight-semibold); margin-bottom: var(--space-3); }
.resource-hero { padding-block: var(--space-12); background: linear-gradient(120deg, var(--color-brand-subtle), var(--color-bg)); border-bottom: 1px solid var(--color-border); }
.resource-hero h1 { font-size: var(--text-6xl); margin-bottom: var(--space-5); }
.resource-hero p { max-width: 48rem; font-size: var(--text-xl); }
.resource-hero .resource-hero-note { font-size: var(--text-base); margin-top: var(--space-4); max-width: 55rem; }
.resource-section-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); padding-block: var(--space-6); }
.resource-section-nav a { display: flex; align-items: flex-start; gap: var(--space-3); min-width: 0; padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); color: var(--color-text-primary); font-size: var(--text-sm); font-weight: var(--font-weight-medium); line-height: var(--leading-snug); }
.resource-section-nav a:hover { border-color: var(--color-primary-300); background: var(--color-brand-subtle); text-decoration: none; }
.resource-section-nav a > span { color: var(--color-brand); font-variant-numeric: tabular-nums; flex: 0 0 auto; }
.resource-collection { padding-block: var(--space-10); border-top: 1px solid var(--color-border); scroll-margin-top: 6rem; }
.resource-collection-datasheets { background: var(--color-bg-subtle); padding-block: var(--space-12); }
.resource-collection-heading { display: flex; align-items: flex-start; gap: var(--space-5); margin-bottom: var(--space-6); }
.resource-collection-heading > div { min-width: 0; max-width: 65rem; }
.resource-collection-number { display: grid; place-items: center; flex: 0 0 2.75rem; height: 2.75rem; border-radius: var(--radius-md); color: var(--color-brand-hover); background: var(--color-brand-subtle); font-size: var(--text-lg); font-weight: var(--font-weight-semibold); font-variant-numeric: tabular-nums; }
.resource-collection-heading h2 { font-size: var(--text-3xl); margin-bottom: var(--space-4); }
.resource-collection-request { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); padding: var(--space-5) var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-bg-subtle); }
.resource-collection-request p { max-width: 49rem; font-size: var(--text-sm); }
.resource-collection-request a { flex: 0 0 auto; font-size: var(--text-sm); font-weight: var(--font-weight-medium); }
.resource-search { padding: var(--space-6); display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) auto; gap: var(--space-4); align-items: end; border: 1px solid var(--color-border); border-radius: var(--radius-xl); background: var(--color-bg); }
.resource-search-field { display: grid; gap: var(--space-2); min-width: 0; }
.resource-search label { font-size: var(--text-sm); font-weight: var(--font-weight-medium); }
.resource-search input, .resource-search select { width: 100%; min-width: 0; padding: .8rem; border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-bg); }
.resource-search .btn { min-height: 3.1rem; white-space: normal; }
.resource-results-heading { display: flex; justify-content: space-between; gap: var(--space-4); margin-block: var(--space-6); font-size: var(--text-sm); }
.resource-family + .resource-family { margin-top: var(--space-10); }
.resource-family-heading { margin-bottom: var(--space-5); }
.resource-family-heading h3 { font-size: var(--text-2xl); margin-bottom: var(--space-2); }
.resource-family-heading p { max-width: 56rem; font-size: var(--text-sm); }
.resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.resource-card { min-width: 0; display: flex; flex-direction: column; align-items: start; border: 1px solid var(--color-border); border-radius: var(--radius-xl); padding: var(--space-6); background: var(--color-bg); transition: border-color 160ms ease, box-shadow 160ms ease; }
.resource-card:hover { border-color: var(--color-primary-300); box-shadow: var(--shadow-sm); }
.resource-card-top { display: flex; gap: var(--space-3); align-items: center; width: 100%; margin-bottom: var(--space-5); }
.resource-file-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; flex: 0 0 auto; color: var(--color-brand); background: var(--color-brand-subtle); border-radius: var(--radius-md); }
.resource-type { font-size: var(--text-xs); color: var(--color-text-secondary); }
.resource-document-title { font-size: var(--text-xl); line-height: var(--leading-snug); margin-bottom: var(--space-3); }
.resource-card-description { font-size: var(--text-sm); margin-bottom: var(--space-6); }
.resource-download-link { display: inline-flex; align-items: center; justify-content: space-between; gap: var(--space-6); width: 100%; margin-top: auto; padding-top: var(--space-4); border-top: 1px solid var(--color-border); font-weight: var(--font-weight-medium); }
.resource-empty { padding: var(--space-8); background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius-xl); }
.resource-empty h3 { font-size: var(--text-2xl); margin-bottom: var(--space-4); }
.resource-empty p { max-width: 46rem; margin-bottom: var(--space-6); }
.resource-help { padding-block: var(--space-12); background: var(--color-brand-subtle); border-top: 1px solid var(--color-border); }
.resource-help-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-8); }
.resource-help h2 { font-size: var(--text-3xl); margin-bottom: var(--space-4); }
.resource-help p { max-width: 48rem; }
@media (max-width: 62rem) { .resource-section-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); } .resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .resource-search { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .resource-search .btn { grid-column: 1 / -1; justify-self: start; } .resource-collection-request { align-items: flex-start; flex-direction: column; gap: var(--space-3); } .resource-help-inner { grid-template-columns: minmax(0, 1fr); justify-items: start; } }
@media (max-width: 38rem) { .resource-grid, .resource-search { grid-template-columns: minmax(0, 1fr); } .resource-hero, .resource-collection { padding-block: var(--space-8); } .resource-section-nav { gap: var(--space-2); padding-block: var(--space-4); } .resource-section-nav a { flex-direction: column; gap: var(--space-2); padding: var(--space-3); } .resource-collection-heading { flex-direction: column; gap: var(--space-3); } .resource-collection-heading h2 { font-size: var(--text-2xl); } .resource-search { padding: var(--space-4); } .resource-search .btn { width: 100%; } .resource-card, .resource-collection-request { padding: var(--space-5); } .resource-collection-request a { flex-basis: auto; } .resource-empty { padding: var(--space-6); } }
@media (prefers-reduced-motion: reduce) { .resource-card { transition: none; } }