.resources-section { background: color-mix(in oklch, var(--sky) 35%, var(--bg)); padding-block: 5rem; }
.resources-grid { display: grid; grid-template-columns: 1.1fr 1.4fr; gap: 3.5rem; align-items: start; }
.resources-grid img { border-radius: 10px; border: 1px solid var(--border); }
.resource-groups { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 2.5rem; margin-top: 2.5rem; }
.resource-group h3 { font-size: 1.15rem; margin-bottom: 0.75rem; }
.resource-group ul { list-style: none; }
.resource-group li { padding-block: 0.4rem; border-bottom: 1px solid var(--border); }
.resource-group li a { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.95rem; text-decoration: none; }
.resource-group li a svg { flex: 0 0 auto; transition: transform 0.15s ease-out; }
.resource-group li a:hover svg { transform: translateX(4px); }
.resource-group li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.resources-section .fine-print { margin-top: 2.5rem; max-width: 68ch; }
.resources-section .fine-print p { margin-top: 0.85rem; }
.resources-section .fine-print p:first-child { margin-top: 0; }

@media (max-width: 900px) {
  .resources-grid { grid-template-columns: 1fr; }
  .resource-groups { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .resource-groups { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .resource-group li a svg { transition: none; }
}
