/* Estilos EXCLUSIVOS dos projetos. Menu, footer, botoes e identidade vem de style.css. */
.portfolio-page .nav [aria-current="page"] {color:var(--lime);opacity:1}
.portfolio-page .portfolio-intro {
  padding:190px 0 100px;
  min-height: min(74vh, 700px);
  display:flex;
  align-items:center;
  border-bottom:1px solid var(--line);
  background:var(--bg);
}
.portfolio-page .portfolio-intro h1 {
  max-width:1000px;
  margin:22px 0 26px;
  font-size:clamp(52px,8vw,104px);
}
.portfolio-page .portfolio-lead {max-width:700px;color:#c7c7c7;font-size:18px;line-height:1.7;margin:0}
.portfolio-page .portfolio-work {background:#0f0f0f;min-height:55vh}
.portfolio-page .portfolio-work .section-head {margin-bottom:46px}
.portfolio-page .portfolio-work .section-head p {margin:0;font-size:13px;color:var(--muted)}
.portfolio-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.portfolio-card {
  display:flex;
  min-width:0;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(160deg,#1b1b1b,#151515);
  transition:opacity .75s ease,transform .75s ease,border-color .3s ease,box-shadow .3s ease;
}
.portfolio-card.visible:hover {transform:translateY(-6px);border-color:rgba(195,245,0,.32);box-shadow:0 20px 55px rgba(0,0,0,.3)}
.portfolio-cover {position:relative;aspect-ratio:4/3;overflow:hidden;background:#222;display:grid;place-items:center}
.portfolio-cover img {width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease}
.portfolio-card:hover .portfolio-cover img {transform:scale(1.04)}
.portfolio-fallback {font:700 clamp(24px,3vw,40px) "Space Grotesk",sans-serif;letter-spacing:-.055em;color:var(--lime);opacity:.45}
.portfolio-card-body {padding:27px;display:flex;flex:1;flex-direction:column;gap:12px}
.portfolio-category {font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--lime)}
.portfolio-card h3 {font:700 25px/1.16 "Space Grotesk",sans-serif;letter-spacing:-.04em;margin:0}
.portfolio-description {font-size:13px;line-height:1.7;color:#aaa;margin:0 0 12px}
.portfolio-link {display:inline-flex;align-items:center;gap:10px;align-self:flex-start;margin-top:auto;color:var(--lime);font-size:12px;font-weight:800;border-bottom:1px solid rgba(195,245,0,.45);padding-bottom:5px;transition:color .2s,border-color .2s}
.portfolio-link:hover {color:#fff;border-color:#fff}
.portfolio-status {border:1px dashed var(--line);border-radius:18px;padding:28px;color:var(--muted);text-align:center;font-size:14px}
.portfolio-status[hidden] {display:none}
.portfolio-page .footer-meta {display:flex;flex-direction:column;gap:4px}
@media (max-width:1000px) {.portfolio-grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px) {
  .portfolio-page .portfolio-intro {min-height:auto;padding:146px 0 84px}
  .portfolio-page .portfolio-intro h1 {font-size:clamp(45px,10vw,68px)}
  .portfolio-page .portfolio-lead {font-size:16px}
  .portfolio-page .portfolio-work .section-head {margin-bottom:28px}
  .portfolio-grid {grid-template-columns:1fr}
  .portfolio-card-body {padding:23px}
}
@media (prefers-reduced-motion:reduce) {
  .portfolio-card,.portfolio-cover img,.portfolio-link {transition:none!important;animation:none!important}
}