body{margin:0;background:#ab4967}
a{color:#0c1713}a:hover{color:#ab4967}
html{scroll-behavior:smooth}
[data-w]{transition:color .35s ease}
.onblue a:hover{color:#f6af84}
.nav a{color:#ffffff;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
@media (prefers-reduced-motion: reduce){[data-sheet]{transform:none!important}[data-w]{color:inherit!important}.projectvel,.projectvel::backdrop{transition:none!important}}

/* Instagram-feed */
.ig-post{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:rgba(255,255,255,0.12)}
.ig-post img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.ig-post:hover img{transform:scale(1.04)}
.ig-video{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;background:rgba(12,23,19,0.65);color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center}

/* Formulier focus */
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #f6af84;outline-offset:2px}

/* Line-up */
.row{display:flex;flex-wrap:wrap;gap:6px 24px;align-items:baseline;width:100%;margin:0;padding:22px 0;border:0;border-top:1px solid rgba(246,175,132,0.35);background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background .3s ease,padding .3s ease}
.row:hover,.row:focus-visible{background:rgba(246,175,132,0.08);padding-left:16px}
.row-label{flex:0 0 120px;font-family:'IBM Plex Mono',monospace;font-size:13px}
.row-titel{flex:1 1 380px;font-weight:600;font-size:clamp(28px,3.4vw,46px);line-height:1.05;letter-spacing:-0.02em}
.row-wat{flex:0 1 300px;color:#e9d6c8;display:flex;justify-content:space-between;gap:16px}
.row-pijl{font-family:'IBM Plex Mono',monospace;transition:transform .3s ease}
.row:hover .row-pijl{transform:translateX(6px)}
.lineup-meer{margin-top:28px;min-height:52px;padding:0 24px;background:transparent;color:#f6af84;border:1.5px solid #f6af84;font:inherit;font-weight:600;font-size:17px;cursor:pointer}
.lineup-meer:hover{background:#f6af84;color:#0c1713}

/* Partnerlogo's: vaste vakken, logo's later als <img> erin */
.partners{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.partner-slot{aspect-ratio:3/1;border:1.5px dashed rgba(246,175,132,0.6);display:flex;align-items:center;justify-content:center;padding:12px;box-sizing:border-box;font-family:'IBM Plex Mono',monospace;font-size:12px;text-align:center}
.partner-slot img{max-width:100%;max-height:100%;object-fit:contain;display:block}

/* Projectpaneel: een vel dat van rechts binnenschuift */
.projectvel{position:fixed;inset:18px 0 0 auto;margin:0;width:min(640px,100vw);max-width:100vw;height:calc(100dvh - 18px);max-height:none;padding:0;border:0;background:#f3ece4;color:#0c1713;overflow:visible;box-shadow:-24px 0 60px rgba(0,0,0,0.35);transform:translateX(105%) rotate(0deg);transform-origin:100% 0;transition:transform .5s cubic-bezier(.2,.8,.2,1),display .5s allow-discrete,overlay .5s allow-discrete}
.projectvel.is-in{transform:translateX(0) rotate(-0.6deg)}
.projectvel::backdrop{background:rgba(12,23,19,0);transition:background .4s ease,display .4s allow-discrete,overlay .4s allow-discrete}
.projectvel.is-in::backdrop{background:rgba(12,23,19,0.55)}
.pv-tape{position:absolute;top:-14px;width:110px;height:30px;background:rgba(171,73,103,0.7)}
.pv-tape-1{left:12%;transform:rotate(-4deg)}
.pv-tape-2{right:14%;transform:rotate(3deg)}
.pv-binnen{height:100%;overflow-y:auto;padding:48px 40px 56px;box-sizing:border-box;font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:18px;line-height:1.55}
.pv-kop{display:flex;justify-content:space-between;align-items:center;gap:16px}
.pv-mono{font-family:'IBM Plex Mono',monospace;font-size:13px;text-transform:uppercase;letter-spacing:0.08em;color:#ab4967}
.pv-sluit{min-height:44px;padding:0 16px;background:transparent;border:1.5px solid #0c1713;color:#0c1713;font-family:'IBM Plex Mono',monospace;font-size:13px;text-transform:uppercase;letter-spacing:0.08em;cursor:pointer}
.pv-sluit:hover{background:#0c1713;color:#f3ece4}
.projectvel h2{margin:28px 0 0;font-weight:800;font-size:clamp(40px,6vw,64px);line-height:0.92;letter-spacing:-0.04em;text-transform:uppercase}
.pv-zin{margin:16px 0 0;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:28px;line-height:1.2}
.pv-blok{margin-top:32px;padding-top:16px;border-top:1px solid rgba(12,23,19,0.25)}
.pv-blok h3{margin:0 0 8px;font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:0.08em;color:#ab4967}
.pv-blok p{margin:0}
.pv-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.pv-tags li{padding:6px 12px;background:#0c1713;color:#f6af84;font-size:15px;font-weight:600}
.pv-quote{margin:32px 0 0;padding:24px;background:#485fa5;color:#ffffff}
.pv-quote p{margin:0;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500;font-size:26px;line-height:1.25}
.pv-quote footer{margin-top:12px;font-family:'IBM Plex Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:0.08em}
.pv-fotos{margin-top:32px;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.pv-foto{aspect-ratio:4/3;margin:0;overflow:hidden;background:#e4d9cc}
.pv-foto img{width:100%;height:100%;object-fit:cover;display:block}
.pv-foto.leeg{background:transparent;border:1.5px dashed #0c1713;display:flex;align-items:flex-end;padding:12px;box-sizing:border-box;font-family:'IBM Plex Mono',monospace;font-size:11px}
.pv-link{display:inline-flex;align-items:center;min-height:48px;margin-top:24px;font-weight:600}
.pv-leeg{margin-top:32px;font-family:'IBM Plex Mono',monospace;font-size:13px;color:#4a4f4c}
.pv-cta{margin-top:48px;padding:28px;background:#f6af84}
.pv-cta p{margin:0 0 16px;font-weight:800;font-size:28px;line-height:1.05;letter-spacing:-0.02em}
.pv-cta a{display:inline-flex;align-items:center;min-height:52px;padding:0 24px;background:#0c1713;color:#f6af84;text-decoration:none;font-weight:600}
.pv-cta a:hover{color:#ffffff}
@media (max-width:600px){.projectvel{inset:14px 0 0 auto}.projectvel.is-in{transform:none}.pv-binnen{padding:40px 20px 48px}}

/* Hero-fotostrip: vaste 3:4-vakken, positie per foto via object-position */
.hero-foto{aspect-ratio:3/4;margin:0;overflow:hidden;background:#0c1713}
.hero-foto img{width:100%;height:100%;object-fit:cover;display:block}

/* Spamval in het formulier: onzichtbaar voor mensen */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}