/* Portfolio + case studies */

.pf-grid { display: grid; gap: var(--space-6); }
.pf-case {
  background: var(--bg-1); border: 1px solid var(--border-0);
  border-radius: var(--r-4); overflow: hidden;
  display: grid; grid-template-columns: 1.1fr 1fr;
}
.pf-case:nth-child(even) { grid-template-columns: 1fr 1.1fr; }
.pf-case:nth-child(even) .pf-case__art { order: 2; }
@media (max-width: 860px) { .pf-case, .pf-case:nth-child(even) { grid-template-columns: 1fr; } .pf-case:nth-child(even) .pf-case__art { order: 0; } }

.pf-case__art { min-height: 280px; position: relative; }
.pf-case__art--ddr5 {
  background:
    radial-gradient(circle at 60% 45%, rgba(34,211,238,.45), transparent 55%),
    radial-gradient(circle at 30% 70%, rgba(91,228,155,.35), transparent 55%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 22px),
    var(--bg-2);
}
.pf-case__art--ev {
  background:
    radial-gradient(circle at 55% 50%, rgba(255,106,44,.6), transparent 55%),
    radial-gradient(circle at 50% 20%, rgba(232,168,107,.4), transparent 55%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 1px, transparent 1px 22px),
    var(--bg-2);
}
.pf-case__art--rf {
  background:
    radial-gradient(circle at 25% 35%, rgba(91,228,155,.4), transparent 55%),
    radial-gradient(circle at 75% 65%, rgba(109,40,217,.5), transparent 55%),
    repeating-linear-gradient(45deg, rgba(255,255,255,.05) 0 1px, transparent 1px 22px),
    var(--bg-2);
}
.pf-case__art-label {
  position: absolute; left: var(--space-4); bottom: var(--space-4);
  background: rgba(10,14,26,.7); backdrop-filter: blur(6px);
  border: 1px solid var(--border-1); border-radius: var(--r-2);
  padding: var(--space-2) var(--space-3); font-family: var(--font-mono); font-size: var(--fs-12); color: var(--fg-0);
}

.pf-case__body { padding: clamp(1.5rem, 3vw, 2.5rem); }
.pf-case__body h3 { margin: var(--space-3) 0 var(--space-3); }
.pf-case__stats { list-style: none; padding: 0; margin: 0 0 var(--space-4); display: flex; flex-wrap: wrap; gap: var(--space-2); }
.pf-case__stats li { background: var(--bg-2); border: 1px solid var(--border-0); border-radius: var(--r-full); padding: 4px 10px; color: var(--fg-1); font-size: var(--fs-12); font-family: var(--font-mono); }
.pf-case__row { margin: 0 0 var(--space-3); }
.pf-case__row b { color: var(--fg-0); display: block; font-size: var(--fs-14); margin-bottom: 2px; }
.pf-case__row span { color: var(--fg-1); font-size: var(--fs-14); }
.pf-result { background: rgba(52,211,153,.08); border: 1px solid var(--good); border-radius: var(--r-2); padding: var(--space-3) var(--space-4); color: var(--fg-0); font-size: var(--fs-14); margin-top: var(--space-3); }
.pf-result b { color: var(--good); }
.pf-note { text-align: center; color: var(--fg-2); font-size: var(--fs-13); margin-top: var(--space-6); }
