/* VF Portfólio – minimalistický tmavý dizajn */
.vfp{--vfp-bg:#050507;--vfp-card:#0b0b0f;--vfp-line:rgba(255,255,255,.07);--vfp-line2:rgba(255,255,255,.14);--vfp-ink:#f2f2f4;--vfp-ink2:#b9b9c2;--vfp-mut:#76767f;--vfp-glow:#8b5cf6;
  font-family:Inter,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--vfp-ink);-webkit-font-smoothing:antialiased}
.vfp *,.vfp *::before,.vfp *::after{box-sizing:border-box}
.vfp a{color:inherit;text-decoration:none}
.vfp-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 28px}
.vfp-chip{appearance:none;background:transparent;border:1px solid var(--vfp-line);color:var(--vfp-mut);font:500 13px/1 inherit;font-family:inherit;padding:9px 15px;border-radius:999px;cursor:pointer;transition:all .25s}
.vfp-chip:hover{color:var(--vfp-ink);border-color:var(--vfp-line2)}
.vfp-chip.on{color:#0a0a0c;background:var(--vfp-ink);border-color:var(--vfp-ink)}
.vfp-grid{display:grid;grid-template-columns:repeat(var(--vfp-cols,3),minmax(0,1fr));gap:20px}
.vfp-card{position:relative;background:var(--vfp-card);border:1px solid var(--vfp-line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;
  transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .35s,box-shadow .45s,opacity .35s}
.vfp-card:hover{transform:translateY(-4px);border-color:var(--vfp-line2);box-shadow:0 30px 60px -30px rgba(0,0,0,.9),0 0 50px -28px var(--vfp-glow)}
.vfp-card.out{display:none}
.vfp-card.in{animation:vfp-in .5s cubic-bezier(.16,1,.3,1) both}
@keyframes vfp-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.vfp-shot{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:#0e0e12;border-bottom:1px solid var(--vfp-line)}
.vfp-shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;filter:grayscale(.55) brightness(.82);transform:scale(1.01);transition:filter .6s,transform 1.2s cubic-bezier(.16,1,.3,1)}
.vfp-card:hover .vfp-shot img{filter:none;transform:scale(1.045)}
.vfp-shot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(11,11,15,.85));pointer-events:none}
.vfp-badge{position:absolute;top:12px;left:12px;z-index:1;display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#e9e9ee;padding:5px 10px;border-radius:999px;background:rgba(5,5,7,.6);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(8px)}
.vfp-badge i{width:6px;height:6px;border-radius:50%;background:#34d399;box-shadow:0 0 8px #34d399}
.vfp-body{padding:20px 20px 18px;display:flex;flex-direction:column;flex:1}
.vfp-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}
.vfp-title{font-size:18px;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.vfp-title:hover{color:#fff}
.vfp-domain{font-size:12px;color:var(--vfp-mut);white-space:nowrap}
.vfp-blurb{margin:0 0 14px;font-size:14px;line-height:1.55;color:var(--vfp-ink2)}
.vfp-case{border-top:1px solid var(--vfp-line);padding-top:12px;margin-bottom:14px}
.vfp-case summary{cursor:pointer;list-style:none;font-size:13px;font-weight:500;color:var(--vfp-mut);display:flex;align-items:center;gap:8px}
.vfp-case summary::-webkit-details-marker{display:none}
.vfp-case summary::after{content:"+";font-size:16px;line-height:1;transition:transform .3s}
.vfp-case[open] summary::after{transform:rotate(45deg)}
.vfp-case summary:hover{color:var(--vfp-ink)}
.vfp-case p{margin:10px 0 0;font-size:13.5px;line-height:1.6;color:var(--vfp-ink2)}
.vfp-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px}
.vfp-tags{display:flex;flex-wrap:wrap;gap:6px}
.vfp-tags span{font-size:11.5px;color:var(--vfp-mut);border:1px solid var(--vfp-line);padding:4px 9px;border-radius:999px}
.vfp-visit{flex:0 0 auto;font-size:13px;font-weight:600;color:var(--vfp-ink);padding:8px 13px;border-radius:10px;border:1px solid var(--vfp-line2);transition:all .25s}
.vfp-visit:hover{background:var(--vfp-ink);color:#0a0a0c}
.vfp-visit span{display:inline-block;transition:transform .25s}
.vfp-visit:hover span{transform:translate(2px,-2px)}
@media (max-width:1024px){.vfp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.vfp-grid{grid-template-columns:1fr;gap:14px}.vfp-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -4px 20px;padding:0 4px}.vfp-chip{flex:0 0 auto}}
@media (prefers-reduced-motion:reduce){.vfp *{transition:none!important;animation:none!important}}
