.ins-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ins { background: var(--surface-container-low); border-radius: var(--r-xl); padding: 24px; display: flex; flex-direction: column; gap: 14px; transition: background .15s, transform .15s; min-height: 220px; }
.ins:hover { background: var(--surface-container); transform: translateY(-2px); }
.ins-meta { display: flex; gap: 8px; align-items: center; }
.ins-topic { font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; padding: 4px 10px; background: var(--primary-container); color: var(--on-primary-container); border-radius: var(--r-full); }
.ins-read { font-size: 11px; color: var(--on-surface-variant); }
.ins-title { font-family: var(--display); font-size: 20px; font-weight: 500; line-height: 1.25; letter-spacing: -0.01em; }
.ins-arrow { margin-top: auto; align-self: flex-end; width: 40px; height: 40px; border-radius: var(--r-full); background: var(--surface-container-high); display: inline-flex; align-items: center; justify-content: center; font-size: 18px; color: var(--primary); transition: transform .15s, background .15s; }
.ins:hover .ins-arrow { background: var(--primary); color: var(--on-primary); transform: translate(2px, -2px); }
