.tech-badge{border-radius:var(--radius-full);color:var(--badge-color);background:color-mix(in srgb, var(--badge-color) 12%, transparent);border:1px solid color-mix(in srgb, var(--badge-color) 28%, transparent);font-family:var(--font-mono);align-items:center;padding:4px 12px;font-size:.75rem;line-height:1.4;display:inline-flex}.project-card{border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);transition:border-color var(--dur) ease, box-shadow var(--dur) ease;background:#1e2030d9;overflow:hidden}.project-card:hover{box-shadow:var(--shadow-card-hover);border-color:#b7bdf859}.project-card:target{border-color:var(--color-accent);box-shadow:var(--glow-accent)}.project-card__media{border-bottom:1px solid var(--color-border);background:var(--color-bg-code);overflow:hidden}.project-card__image{width:100%;transition:transform var(--dur-slow) var(--ease-out)}.project-card:hover .project-card__image{transform:scale(1.025)}.project-card__placeholder{place-content:center;gap:var(--space-2);min-height:13rem;padding:var(--space-6);text-align:center;background:radial-gradient(28rem 14rem at 20% 0%, #8bd5ca29, transparent 70%), radial-gradient(28rem 14rem at 85% 100%, #c6a0f62e, transparent 70%), linear-gradient(#cad3f50a 1px, transparent 1px) 0 0 / 24px 24px, linear-gradient(90deg, #cad3f50a 1px, transparent 1px) 0 0 / 24px 24px, var(--color-bg-code);display:grid;position:relative}.project-card__placeholder-title{color:var(--color-text);font-family:var(--font-mono);font-size:1.25rem;font-weight:700}.project-card__placeholder-note{color:var(--color-text-subtle);font-family:var(--font-mono);font-size:.8125rem}.project-card__body{gap:var(--space-6);padding:var(--space-8);flex-direction:column;display:flex}.project-card__header{gap:var(--space-1);flex-direction:column;display:flex}.project-card__subtitle{color:var(--color-accent);font-family:var(--font-mono);font-size:.8125rem;font-weight:500}.project-card__title{color:var(--color-text);letter-spacing:-.02em;font-size:clamp(1.375rem,1.1rem + 1vw,1.75rem);font-weight:700}.project-card__description{max-width:70ch;color:var(--color-text-secondary)}.project-card__architecture{align-items:baseline;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--color-bg-code);border:1px solid var(--color-border);border-left:3px solid var(--ctp-teal);border-radius:var(--radius-sm);color:var(--ctp-teal);font-size:.8125rem;line-height:1.6;display:flex}.project-card__architecture-label{color:var(--color-text-subtle);text-transform:uppercase;letter-spacing:.08em;flex:none;font-size:.75rem}.project-card__section-title{margin:0 0 var(--space-3);color:var(--color-text-subtle);font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;font-size:.75rem;font-weight:500}.project-card__tech-list{gap:var(--space-2);flex-wrap:wrap;list-style:none;display:flex}.project-card__features{gap:var(--space-2) var(--space-6);grid-template-columns:repeat(2,minmax(0,1fr));list-style:none;display:grid}.project-card__features li{padding-left:var(--space-6);color:var(--color-text-secondary);font-size:.9375rem;position:relative}.project-card__features li:before{content:"";border-left:2px solid var(--ctp-green);border-bottom:2px solid var(--ctp-green);width:12px;height:7px;position:absolute;top:.45em;left:2px;transform:rotate(-45deg)}.project-card__links{gap:var(--space-3);padding-top:var(--space-6);border-top:1px solid var(--color-border);flex-wrap:wrap;display:flex}.project-card__demo:hover{color:var(--ctp-red)}@media (width<=767px){.project-card__body{padding:var(--space-6) var(--space-5);gap:var(--space-5)}.project-card__features{grid-template-columns:1fr}.project-card__architecture{gap:var(--space-1);flex-direction:column}.project-card__links .btn{flex:auto}}.projects{padding-top:var(--space-16)}.projects__header{gap:var(--space-2);margin-bottom:var(--space-10);flex-direction:column;display:flex}.projects__list{gap:var(--space-10);flex-direction:column;display:flex}@media (width<=767px){.projects{padding-top:var(--space-10)}.projects__header{margin-bottom:var(--space-8)}.projects__list{gap:var(--space-6)}}
