.card{position:relative;padding:var(--sp-md);background:var(--bg-card);border:1px solid var(--border);transition:border-color var(--duration-sm) var(--ease-out),box-shadow var(--duration) var(--ease-out),transform var(--duration) var(--ease-out);overflow:hidden}.card:hover{border-color:var(--accent);box-shadow:var(--shadow-lift);transform:translateY(-4px)}.card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--duration-sm) var(--ease-out)}.card:hover::before{transform:scaleX(1)}.card--cyan{border-left:3px solid var(--accent)}.card--blue{border-left:3px solid var(--primary)}.card--green{border-left:3px solid var(--accent)}.card--purple{border-left:3px solid var(--primary-lighter)}.card--cyan:hover,.card--blue:hover,.card--green:hover,.card--purple:hover{border-color:var(--accent);border-left-width:3px}.card__icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--accent-dim);border:1px solid rgb(59 90 192 / .12);margin-bottom:var(--sp-sm);color:var(--primary);flex-shrink:0}.card--cyan .card__icon,.card--green .card__icon{color:var(--accent-hover);background:var(--accent-dim)}.card--blue .card__icon{color:var(--primary);background:rgb(13 59 62 / .06)}.card--purple .card__icon{color:var(--primary-lighter);background:rgb(26 107 111 / .08)}.card__title{font-size:var(--fs-md);font-weight:var(--fw-bold);margin-bottom:var(--sp-2xs);line-height:var(--lh-snug);color:var(--text)}.card__desc{font-size:var(--fs-sm);color:var(--text-dim);line-height:var(--lh-relaxed)}.card__link{display:inline-flex;align-items:center;gap:.4em;margin-top:var(--sp-sm);font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--primary);opacity:0;transform:translateX(-8px);transition:opacity var(--duration-sm) var(--ease-out),transform var(--duration-sm) var(--ease-out)}.card:hover .card__link{opacity:1;transform:translateX(0)}.card__tags{display:flex;flex-wrap:wrap;gap:var(--sp-3xs);margin-top:var(--sp-sm)}.card__tag{padding:.2em .6em;font-size:var(--fs-2xs);color:var(--text-muted);background:var(--bg-alt);border:1px solid var(--border)}.sec--dark .card{background:rgb(255 255 255 / .04);border-color:var(--border-dark)}.sec--dark .card:hover{border-color:var(--accent);background:rgb(255 255 255 / .06)}.sec--dark .card__icon{background:rgb(59 90 192 / .1);color:var(--accent-on-dark)}.sec--dark .card__tag{background:rgb(255 255 255 / .05);border-color:var(--border-dark);color:var(--text-muted-on-dark)}[data-tilt]{will-change:transform}.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-sm)}.bento .card--wide{grid-column:span 2}.bento .card--tall{grid-row:span 2}@media (max-width:1024px){.bento{grid-template-columns:repeat(3,1fr)}}@media (max-width:768px){.bento{grid-template-columns:repeat(2,1fr)}.bento .card--wide{grid-column:span 1}}@media (max-width:480px){.bento{grid-template-columns:1fr}.bento .card--tall{grid-row:span 1}}.card--clickable{cursor:pointer}.card--clickable:active{transform:scale(.99)}a.card{display:flex;flex-direction:column;text-decoration:none;color:inherit}a.card:hover{color:inherit}