.project-card{color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffff08;position:relative}.project-card-spotlight{opacity:0;pointer-events:none;background:radial-gradient(340px circle at var(--spot-x,50%) var(--spot-y,50%), #e83c8ca6, #963fb452 45%, transparent 72%);transition:opacity .3s;position:absolute;inset:0}@media (hover:hover) and (pointer:fine){.project-card:hover .project-card-spotlight{opacity:1}}.project-card .tag-pill{background:#ffffff0d;border-color:#ffffff1f}.project-card-cover{background:radial-gradient(120% 90% at 85% 0%, color-mix(in srgb, var(--accent) 38%, transparent), transparent 60%), linear-gradient(180deg, #ffffff08, transparent);border-bottom:1px solid #ffffff0f;height:11rem;position:relative;overflow:hidden}.project-card-cover:after{content:"";background-image:linear-gradient(#ffffff0a 1px,#0000 1px),linear-gradient(90deg,#ffffff0a 1px,#0000 1px);background-size:24px 24px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000);mask-image:linear-gradient(#000,#0000)}.project-card .project-card-index{color:#ffffff80;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.72rem;position:absolute;top:1rem;left:1rem}.project-card .project-card-monogram{letter-spacing:-.06em;color:#0000;background:linear-gradient(180deg, #fff 10%, color-mix(in srgb, var(--accent) 70%, transparent) 90%);opacity:.9;-webkit-background-clip:text;background-clip:text;font-size:10rem;font-weight:500;line-height:1;transition:transform .5s cubic-bezier(.2,.8,.2,1);position:absolute;bottom:-2.6rem;right:1.25rem}@media (hover:hover) and (pointer:fine){.project-card:hover .project-card-monogram{transform:translateY(-.6rem)}.project-card:hover .project-card-arrow{color:var(--accent);transform:translate(3px)}}.project-card .project-card-category{letter-spacing:.08em;text-transform:uppercase;text-align:left;color:color-mix(in srgb, var(--accent) 80%, #fff);font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.72rem}.project-card-footer{border-top:1px solid #ffffff0f}.project-card .project-card-status{color:#ada1a5;align-items:center;gap:.5rem;font-size:.85rem;display:inline-flex}.project-card .project-card-status--live{color:#fff}.project-card-live-dot{background:#4ee39d;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 3px #4ee39d2e}.project-card-arrow{transition:transform .25s,color .25s;display:inline-flex}
