.differentials{background:var(--black);padding:72px 0}.diff-grid{display:grid;grid-template-columns:1fr;gap:16px;align-items:stretch}@media (min-width:640px){.diff-grid{grid-template-columns:1fr 1fr}}@media (min-width:1024px){.diff-grid{grid-template-columns:repeat(4,1fr)}}.diff-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px 24px;transition:all .4s;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:200px;height:100%}.diff-card:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--card-gradient);transform:scaleX(0);transition:transform .4s;border-radius:0 0 var(--radius-lg) var(--radius-lg)}.diff-card:hover{transform:translateY(-6px);border-color:#ffffff1f}.diff-card:hover:after{transform:scaleX(1)}.diff-card[data-color=gold]{--card-gradient:linear-gradient(90deg,var(--gem-gold),var(--gem-orange))}.diff-card[data-color=blue]{--card-gradient:linear-gradient(90deg,var(--gem-blue),var(--gem-purple))}.diff-card[data-color=pink]{--card-gradient:linear-gradient(90deg,var(--gem-pink),var(--gem-red))}.diff-card[data-color=green]{--card-gradient:linear-gradient(90deg,#22c55e,#16a34a)}.diff-card[data-color=orange]{--card-gradient:linear-gradient(90deg,var(--gem-orange),var(--gem-red))}.diff-card[data-color=purple]{--card-gradient:linear-gradient(90deg,var(--gem-purple),var(--gem-pink))}.diff-card[data-color=amber]{--card-gradient:linear-gradient(90deg,var(--gem-gold),#f59e0b)}.diff-icon{font-size:2rem;margin-bottom:16px;display:block;color:var(--text)}.diff-icon svg{width:2rem;height:2rem}.diff-card[data-color=gold] .diff-icon svg{color:var(--gem-gold)}.diff-card[data-color=blue] .diff-icon svg{color:var(--gem-blue)}.diff-card[data-color=pink] .diff-icon svg{color:var(--gem-pink)}.diff-card[data-color=green] .diff-icon svg{color:#22c55e}.diff-card[data-color=orange] .diff-icon svg{color:var(--gem-orange)}.diff-card[data-color=purple] .diff-icon svg{color:var(--gem-purple)}.diff-card[data-color=amber] .diff-icon svg{color:var(--gem-gold)}.diff-title{font-family:Space Grotesk,sans-serif;font-size:1rem;font-weight:700;margin-bottom:8px}.diff-desc{font-size:.875rem;color:var(--muted);line-height:1.6;flex:1}
