/* Card Components */ /* Download Bundles Section */ .download-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--s-md); @media (max-width: 640px) { grid-template-columns: 1fr; } } .download-card { opacity: 0; transform: translateY(20px); &.animated { animation: fadeInUp var(--duration-slow) var(--ease-out) both; } } .card-inner { height: 100%; padding: var(--s-lg); background: var(--c-paper); border: 1px solid var(--c-mist); display: flex; flex-direction: column; gap: var(--s-md); transition: all var(--duration-base) var(--ease-out); position: relative; overflow: hidden; &::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--c-accent); transform: translateX(-100%); transition: transform 0.4s var(--ease-out); } &:hover { border-color: var(--c-accent); transform: translateY(-4px); &::before { transform: translateX(0); } } } .card-header { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-md); h3 { font-size: 1.375rem; font-weight: 500; margin: 0; } } .badge { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.1em; padding: 0.25em 0.625em; border: 1px solid var(--c-accent); color: var(--c-accent); border-radius: 2px; font-weight: 600; white-space: nowrap; } .card-inner p { color: var(--c-ash); font-size: 0.9375rem; line-height: 1.6; flex-grow: 1; margin: 0; } /* Contribute Section */ .contribute { padding: var(--s-2xl) 0; text-align: center; } .contribute-content { max-width: 480px; margin: 0 auto; } .contribute h2 { font-size: 2rem; font-weight: 600; margin-bottom: var(--s-sm); } .contribute p { font-size: 1.125rem; color: var(--c-ash); margin-bottom: var(--s-lg); line-height: 1.6; }