/* Portfolio-sectie op events-, abonnementen- en freelancepagina (assets/portfolio-teaser.js) */
.pft { padding: 96px 56px; border-top: 1px solid rgba(31,20,22,0.12); }
.pft-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 40px; flex-wrap: wrap; margin-bottom: 48px; }
.pft-head .eyebrow { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; opacity: 0.55; margin-bottom: 20px; }
.pft-head h2 { font-family: 'DM Serif Display', Georgia, serif; font-weight: 400; font-size: 56px; line-height: 1.1; letter-spacing: -0.02em; margin: 0; max-width: 16ch; }
.pft-lede { margin-top: 16px; font-family: 'DM Serif Display', Georgia, serif; font-style: italic; font-size: 20px; line-height: 1.45; color: #6b0f1a; max-width: 48ch; }
.pft-all { display: inline-block; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #6b0f1a;
  border-bottom: 1px solid currentColor; padding-bottom: 4px; white-space: nowrap; transition: color 0.2s ease; }
.pft-all:hover { color: #1f1416; }
.pft-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 28px; }
.pft-card { display: block; color: inherit; text-decoration: none; }
.pft-media { position: relative; aspect-ratio: 4 / 5; background: #3a1418; overflow: hidden; }
.pft-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.8s cubic-bezier(.2,.7,.3,1); }
.pft-card:hover .pft-media img { transform: scale(1.04); }
.pft-ph { position: absolute; left: 18px; bottom: 16px; font-family: 'DM Serif Display', Georgia, serif; font-style: italic; font-size: 17px; color: #e9d4cb; }
.pft-kicker { margin-top: 18px; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; opacity: 0.55; }
.pft-title { margin-top: 8px; font-family: 'DM Serif Display', Georgia, serif; font-size: 26px; line-height: 1.15; letter-spacing: -0.01em; transition: color 0.2s ease; }
.pft-card:hover .pft-title { color: #6b0f1a; }
.pft-loc { margin-top: 6px; font-family: 'DM Serif Display', Georgia, serif; font-style: italic; font-size: 15px; color: #6b0f1a; }
.pft.pft-empty .pft-head { margin-bottom: 0; }
@media (max-width: 1000px) { .pft { padding: 80px 28px; } .pft-grid { grid-template-columns: repeat(2, 1fr); } .pft-head h2 { font-size: 42px; } }
@media (max-width: 768px) { .pft { padding: 72px 24px; } .pft-head h2 { font-size: 34px; } }
@media (max-width: 640px) { .pft-grid { grid-template-columns: 1fr; gap: 32px; } .pft-head h2 { font-size: 30px; } }