:root{
  --ground:#000;
  --ground-2:#0A0A0A;
  --ink:#EDE6D6;
  --ink-soft:#A9A294;
  --ink-faint:rgba(237,230,214,.42);
  --hair:rgba(237,230,214,.16);
  --hair-soft:rgba(237,230,214,.08);
  --spray:#FF2E7E;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--ground);
  color:var(--ink);
  font-family:"Space Grotesk",sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
a:hover{color:var(--ink)}
.wrap{max-width:1200px;margin:0 auto;padding:0 28px;position:relative}

/* ───── language switch ───── */
.lang-switch{
  position:fixed;top:22px;right:24px;z-index:50;
  display:inline-flex;gap:12px;align-items:center;
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.32em;text-transform:uppercase;
  background:rgba(0,0,0,.6);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  padding:8px 14px;
}
.lang-switch a{color:var(--ink-soft);transition:color .15s}
.lang-switch a:hover{color:var(--ink)}
.lang-switch a.current{color:var(--ink);font-weight:700}
.lang-switch .div{color:var(--ink-faint);font-weight:400}

/* ───── HERO ───── */
header.hero{
  min-height:100svh;
  display:flex;flex-direction:column;justify-content:center;
  padding:96px 0 80px;position:relative;
}
.hero-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:40px}

.wordmark{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:900;font-stretch:condensed;
  font-size:clamp(64px,15vw,210px);line-height:.85;
  letter-spacing:.04em;text-transform:uppercase;color:var(--ink);
  margin:0;
}
.wordmark-tagline{
  font-family:"Space Mono",monospace;
  font-size:clamp(11px,1.4vw,15px);
  letter-spacing:.42em;text-transform:uppercase;color:var(--ink);
  margin-top:6px;
}
.hero-descriptor{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-soft);
  display:inline-flex;align-items:center;flex-wrap:wrap;gap:14px;justify-content:center;
}
.hero-descriptor .sep{color:var(--ink-faint)}

.next-strip{
  display:flex;flex-direction:column;align-items:center;gap:14px;
  margin-top:16px;
}
.next-strip .lbl{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-soft);
}
.next-strip .date{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:clamp(46px,6.4vw,80px);line-height:.95;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink);position:relative;display:inline-block;
}
.next-strip .date::after{
  content:"";position:absolute;left:-3%;right:-3%;bottom:-6px;height:6px;
  background:var(--spray);transform:skewX(-4deg);
  box-shadow:0 0 18px rgba(255,46,126,.35);
}
.next-strip .det{
  font-family:"Space Grotesk",sans-serif;
  font-size:14px;color:var(--ink-soft);font-weight:300;
  margin-top:6px;
}
.next-strip .det b{color:var(--ink);font-weight:500}

.hero-cta{
  display:inline-flex;align-items:center;gap:10px;
  font-family:"Space Mono",monospace;
  font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--ground);
  padding:16px 26px;background:var(--ink);
  transition:background .15s ease,color .15s ease;
}
.hero-cta:hover{background:var(--spray);color:var(--ink)}
.hero-cta .arr{font-family:"Space Grotesk",sans-serif;font-size:14px;letter-spacing:0;text-transform:none}

.scroll-hint{
  position:absolute;bottom:24px;left:50%;transform:translateX(-50%);
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:var(--ink-faint);
}

/* ───── section frame ───── */
section{padding:110px 0 130px;position:relative}
.sec-head{display:flex;align-items:baseline;gap:22px;margin-bottom:54px;flex-wrap:wrap}
.sec-num{
  font-family:"Space Mono",monospace;
  font-size:13px;letter-spacing:.24em;color:var(--ink-soft);
}
.sec-num::before{content:"§ "}
.sec-title{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:clamp(34px,4.6vw,58px);
  line-height:1.02;letter-spacing:.02em;text-transform:uppercase;color:var(--ink);
}
.sec-title em{font-style:normal;color:var(--ink-soft);font-weight:500}

/* ───── 01 · De Nacht ───── */
.text-2col{display:grid;grid-template-columns:1fr 1fr;gap:64px}
.text-2col p{font-size:16px;line-height:1.7;color:var(--ink-soft);font-weight:300;margin-bottom:18px}
.text-2col p:last-child{margin-bottom:0}
.text-2col p b{color:var(--ink);font-weight:500}
.text-2col p em{color:var(--ink);font-style:italic}

/* ───── 02 · De Zaak ───── */
.manifesto{display:grid;grid-template-columns:1fr 1fr;gap:64px}
.manifesto .pane{display:flex;flex-direction:column}
.pane .ptag{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:16px;
}
.pane h3{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:32px;line-height:1.05;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);margin-bottom:14px;
}
.pane p{color:var(--ink-soft);font-weight:300;font-size:15px;line-height:1.7}
.manifesto-line{
  margin-top:64px;
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:500;font-stretch:condensed;
  font-size:clamp(24px,3.2vw,38px);line-height:1.2;letter-spacing:.03em;
  text-transform:uppercase;color:var(--ink);max-width:36ch;
}
.manifesto-line .dim{color:var(--ink-soft)}

/* ───── 03 · Volgende editie ───── */
.next-card{
  display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:start;
}
.next-card .stamp{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-soft);
  margin-bottom:22px;
}
.next-card .when{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:clamp(64px,9vw,124px);line-height:.9;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);
}
.next-card .where{
  font-family:"Space Mono",monospace;
  font-size:13px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink);margin-top:24px;
}
.next-card .where .sub{display:block;color:var(--ink-soft);margin-top:6px;font-size:11px}
.next-card .meta-list{display:flex;flex-direction:column}
.next-card .meta-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:18px;
  padding:18px 0;
}
.next-card .meta-row + .meta-row{border-top:1px solid var(--hair-soft)}
.next-card .meta-row .k{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft);
}
.next-card .meta-row .v{
  font-family:"Space Grotesk",sans-serif;
  font-size:14px;color:var(--ink);font-weight:400;
}
.next-card .meta-row .v.dim{color:var(--ink-soft)}
.next-card .cta-row{margin-top:24px;display:flex;flex-wrap:wrap;gap:16px}
.btn-solid{
  display:inline-flex;align-items:center;gap:10px;
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--ground);
  padding:14px 22px;background:var(--ink);
  transition:background .15s,color .15s;
}
.btn-solid:hover{background:var(--spray);color:var(--ink)}
.btn-text{
  display:inline-flex;align-items:center;gap:10px;
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft);
  padding:14px 0;
  transition:color .15s;
}
.btn-text:hover{color:var(--ink)}

/* ───── 04 · Agenda ───── */
.agenda{display:flex;flex-direction:column}
.agenda-row{
  display:grid;grid-template-columns:140px 1fr 200px 140px;gap:24px;align-items:baseline;
  padding:24px 0;
}
.agenda-row + .agenda-row{border-top:1px solid var(--hair-soft)}
.agenda-row .date{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:32px;line-height:1;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);
}
.agenda-row .title{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:500;font-stretch:condensed;
  font-size:22px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);
}
.agenda-row .title .sub{
  display:block;font-family:"Space Grotesk",sans-serif;font-weight:300;font-size:13px;
  letter-spacing:.04em;text-transform:none;color:var(--ink-soft);margin-top:5px;
}
.agenda-row .venue{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-soft);
}
.agenda-row .status{
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft);
  text-align:right;
}
.agenda-row .status.live{color:var(--ink)}

/* ───── 05 · Residents ───── */
.grid-residents{display:grid;grid-template-columns:repeat(4,1fr);gap:48px 32px}
.resident{display:flex;flex-direction:column;gap:18px}
.resident .tag{
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-soft);
}
.resident .name{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:38px;line-height:.95;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);
}
.resident .role{
  font-family:"Space Grotesk",sans-serif;
  font-size:14px;color:var(--ink-soft);font-weight:300;font-style:italic;
}

/* ───── 06 · Gasten ───── */
.grid-gasten{display:grid;grid-template-columns:repeat(4,1fr);gap:36px 28px}
.gast{display:flex;flex-direction:column;gap:8px}
.gast .tag{
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-soft);
}
.gast .name{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:30px;line-height:1;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);
}
.gast .meta{
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-soft);
}

/* ───── 07 · Archief ───── */
.archief-empty{
  color:var(--ink-soft);font-size:16px;font-weight:300;font-style:italic;line-height:1.6;
  max-width:54ch;
}

/* ───── 08 · Beelden ───── */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.photo{
  aspect-ratio:1/1;background:var(--ground-2);
  position:relative;overflow:hidden;
}
.photo::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 30% 20%, rgba(237,230,214,.05), transparent 60%),
    radial-gradient(circle at 70% 80%, rgba(237,230,214,.04), transparent 55%);
}
.photo.wide{grid-column:span 2}
.photo .tag{
  position:absolute;bottom:14px;left:16px;z-index:1;
  font-family:"Space Mono",monospace;
  font-size:9px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-faint);
}
.photo .tag.live{color:var(--ink-soft)}

/* ───── 09 · Newsletter ───── */
.newsletter{
  display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:end;
}
.newsletter h3{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:clamp(34px,4.6vw,54px);line-height:1;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);
  margin-bottom:18px;
}
.newsletter p{
  color:var(--ink-soft);font-weight:300;font-size:15px;line-height:1.65;max-width:38ch;
}
.nl-form{display:flex;flex-direction:column;gap:14px}
.nl-form .row{
  display:flex;gap:0;
  border-bottom:1px solid var(--hair);
  transition:border-color .15s;
}
.nl-form .row:focus-within{border-color:var(--ink)}
.nl-form input[type=email]{
  flex:1;background:transparent;border:none;outline:none;
  padding:14px 0;
  color:var(--ink);font-family:"Space Grotesk",sans-serif;font-size:18px;font-weight:400;
}
.nl-form input[type=email]::placeholder{color:var(--ink-faint)}
.nl-form button{
  background:transparent;color:var(--ink);border:none;cursor:pointer;
  padding:14px 0 14px 18px;
  font-family:"Space Mono",monospace;font-size:11px;letter-spacing:.28em;text-transform:uppercase;
  transition:color .15s;
}
.nl-form button:hover{color:var(--spray)}
.nl-form .note{
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-faint);
}

/* ───── 10 · Volg ───── */
.volg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:48px}
.volg-card{
  display:flex;flex-direction:column;gap:14px;
}
.volg-card .tag{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-soft);
}
.volg-card .h{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:700;font-stretch:condensed;
  font-size:32px;line-height:1.05;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);
}
.volg-card .h .sub{display:block;font-family:"Space Grotesk",sans-serif;font-weight:300;font-size:14px;
  letter-spacing:.04em;text-transform:none;color:var(--ink-soft);margin-top:10px;line-height:1.55;max-width:32ch}
.volg-card .link{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink);
  margin-top:6px;
  transition:color .15s;
}
.volg-card:hover .link{color:var(--spray)}
.volg-card .draft{
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-faint);
  margin-top:6px;
}

/* ───── footer ───── */
footer{padding:90px 0 60px;margin-top:60px}
.foot-grid{
  display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;
}
.foot-col h4{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-soft);
  margin-bottom:14px;font-weight:500;
}
.foot-col p,.foot-col a{
  display:block;font-size:13px;color:var(--ink-soft);font-weight:300;line-height:1.85;
}
.foot-col a:hover{color:var(--ink)}
.foot-wm{
  font-family:"Big Shoulders Stencil",sans-serif;
  font-weight:900;font-stretch:condensed;
  font-size:48px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);line-height:1;
}
.foot-tag{
  font-family:"Space Mono",monospace;
  font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-soft);
  margin-top:14px;
}
.foot-bottom{
  margin-top:72px;padding-top:28px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
  font-family:"Space Mono",monospace;
  font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-faint);
}

/* ───── responsive ───── */
@media (max-width:920px){
  section{padding:80px 0 100px}
  .lang-switch{top:14px;right:14px;padding:6px 10px;font-size:10px;gap:10px}
  .text-2col,.manifesto{grid-template-columns:1fr;gap:36px}
  .next-card{grid-template-columns:1fr;gap:40px}
  .newsletter{grid-template-columns:1fr;gap:30px}
  .agenda-row{grid-template-columns:1fr;gap:8px;padding:22px 0}
  .agenda-row .date{font-size:24px}
  .agenda-row .status{text-align:left}
  .grid-residents{grid-template-columns:repeat(2,1fr);gap:36px 24px}
  .grid-gasten{grid-template-columns:repeat(2,1fr);gap:28px 20px}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .photo.wide{grid-column:span 2}
  .volg{grid-template-columns:1fr;gap:36px}
  .foot-grid{grid-template-columns:1fr;gap:36px}
  .foot-bottom{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .next-strip .date::after{box-shadow:none}
}