/* =========================================================
   PROJETOS — cartões da seção na página inicial e do painel
   projetos/index.html (área com login)
   ========================================================= */
.pj-page { padding-top: 6.5rem; }
.pj-page .ss-hero { padding: 1rem 0 1.75rem; }
.pj-page .ss-hero h1 { font-size: clamp(2.6rem, 6vw, 4.6rem); margin: .25rem 0 .75rem; }
.pj-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 1.25rem; }
.pj-cartao {
  display: flex; flex-direction: column; padding: 1.75rem; border-radius: 1.6rem; color: var(--cream); text-decoration: none;
  background: var(--glass-tint); border: 1px solid var(--glass-line); box-shadow: var(--glass-shine), var(--glass-shadow);
  -webkit-backdrop-filter: blur(26px) saturate(170%); backdrop-filter: blur(26px) saturate(170%);
}
/* na página inicial quem cuida da transição é o .fade-up (css/efeitos.css) */
.pj-cartao:not(.fade-up) { transition: transform .2s var(--ease-out), scale 160ms var(--ease-out), border-color .2s ease; }
.pj-cartao:active { scale: .98; }
.pj-cartao:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pj-arte { display: grid; place-items: center; height: 170px; margin-bottom: 1.4rem; border-radius: 1rem; color: var(--accent); background: color-mix(in srgb, var(--gray) 12%, transparent); }
.pj-arte svg { width: min(100%, 260px); height: 100%; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.pj-cartao h2, .pj-cartao h3 { font-size: 1.45rem; font-weight: 600; letter-spacing: -.024em; margin-bottom: .5rem; }
.pj-status { align-self: flex-start; margin-bottom: .9rem; }
.pj-todos { display: inline-block; margin-top: 1rem; }
#projetos .ferramentas-header p { color: var(--gray); }
.pj-cartao p { color: var(--gray); font-size: 1rem; line-height: 1.5; letter-spacing: -.01em; margin-bottom: 1.1rem; }
.pj-cartao .service-tags { margin-bottom: 1.25rem; }
.pj-abrir { margin-top: auto; color: var(--accent); font-weight: 500; font-size: .95rem; }
html.perf-low .pj-cartao { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--glass-solid); }
@media (hover: hover) and (pointer: fine) {
  .pj-cartao:hover { transform: translateY(-4px); border-color: var(--accent); }
  .pj-cartao:hover .pj-abrir { text-decoration: underline; text-underline-offset: 3px; }
}
@media (max-width: 760px), (pointer: coarse) {
  .pj-cartao { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--glass-solid); }
}
@media (prefers-reduced-motion: reduce) { .pj-cartao { transition: none; } .pj-cartao:active { scale: none; } }