:root{
  --ink-deep:   #0e2b33;
  --ink-deep-2: #123640;
  --paper:      #ede4cf;
  --paper-2:    #e3d8bd;
  --ink-text:   #2a2015;
  --ink-faint:  #6b5c46;
  --stamp-red:  #a3341f;
  --brass:      #b6883f;
  --brass-soft: #d8b877;
  --teal-line:  #3f7a80;
  --unsure:     #8a4a2b;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink-deep);
  color:var(--paper);
  font-family:'Source Serif 4', serif;
  font-size:17px;
  line-height:1.6;
}
h1,h2,h3,.display{
  font-family:'Fraunces', serif;
  font-weight:700;
  letter-spacing:-0.01em;
}
.mono{ font-family:'Courier Prime', monospace; }
a{color:inherit;}
img{max-width:100%;display:block;}

.dark-bg{
  background:
    radial-gradient(ellipse at 20% -10%, rgba(182,136,63,0.10), transparent 45%),
    radial-gradient(ellipse at 90% 110%, rgba(63,122,128,0.18), transparent 50%),
    var(--ink-deep);
}

/* ---------- TOP NAV ---------- */
.topnav{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem;
  padding:1rem 6vw;
  background:rgba(14,43,51,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(237,228,207,0.12);
  flex-wrap:wrap;
}
.topnav .brand{
  font-family:'Fraunces',serif; font-style:italic; font-weight:600;
  font-size:1.15rem; color:var(--paper); text-decoration:none;
  white-space:nowrap;
}
.topnav .brand span{color:var(--brass-soft); font-family:'Courier Prime',monospace; font-style:normal; font-size:0.7rem; letter-spacing:0.08em; display:block; margin-top:0.15rem;}
.topnav nav{
  display:flex; gap:0.3rem; flex-wrap:wrap;
}
.topnav nav a{
  font-family:'Courier Prime',monospace;
  font-size:0.78rem;
  letter-spacing:0.03em;
  text-decoration:none;
  color:#cdc2a6;
  padding:0.45rem 0.75rem;
  border-radius:3px;
  border:1px solid transparent;
  white-space:nowrap;
}
.topnav nav a:hover{color:var(--paper); border-color:rgba(182,136,63,0.35);}
.topnav nav a.active{color:var(--ink-deep); background:var(--brass-soft);}

/* ---------- PAGE HEADER (non-hero pages) ---------- */
.page-header{
  padding:5rem 6vw 3rem;
  max-width:900px;
}
.page-eyebrow{
  font-family:'Courier Prime',monospace;
  font-size:0.78rem; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--brass-soft); margin-bottom:1rem;
  border-left:2px solid var(--brass); padding-left:0.7rem;
}
.page-header h1{
  font-size:clamp(2.4rem, 6vw, 4.2rem);
  margin:0 0 1.2rem; color:var(--paper); line-height:1.02;
}
.page-header p{color:#cdc2a6; font-size:1.05rem; max-width:680px;}

/* ---------- HERO (home only) ---------- */
.hero{
  position:relative;
  min-height:80vh;
  display:flex; flex-direction:column; justify-content:center;
  padding:6vh 6vw 6vh;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  background-image:url('images/curated/ye14-feest.jpg');
  background-size:cover; background-position:center 30%;
  opacity:0.16; filter:grayscale(60%) contrast(1.1);
  mask-image:linear-gradient(to bottom, black 0%, black 55%, transparent 100%);
}
.hero-content{position:relative; z-index:1; max-width:900px;}
.hero-eyebrow{
  font-family:'Courier Prime',monospace; letter-spacing:0.14em; text-transform:uppercase;
  font-size:0.78rem; color:var(--brass-soft); margin-bottom:1.4rem;
  border-left:2px solid var(--brass); padding-left:0.7rem;
}
.hero h1{ font-size:clamp(3rem, 10vw, 6.6rem); line-height:0.92; margin:0 0 1.1rem; color:var(--paper); }
.hero h1 em{ font-style:italic; font-weight:500; color:var(--brass-soft); }
.hero-names{ font-family:'Courier Prime', monospace; font-size:0.9rem; color:#c9bfa4; line-height:2; margin-top:1.4rem; }
.hero-names .sep{color:var(--stamp-red); margin:0 0.5em;}
.hero-sub{ max-width:620px; color:#d8cdb2; font-size:1.05rem; margin-top:1.6rem; }

/* ---------- SECTIONS ---------- */
section{padding:5rem 6vw;}
.section-head{max-width:760px; margin-bottom:3rem;}
.section-eyebrow{
  font-family:'Courier Prime',monospace; font-size:0.75rem; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--brass-soft); margin-bottom:0.8rem;
}
.section-head h2{ font-size:clamp(1.8rem, 3.6vw, 2.7rem); margin:0 0 1rem; color:var(--paper); }
.section-head p{color:#cdc2a6; max-width:640px;}

/* ---------- TIMELINE ---------- */
.timeline{ position:relative; max-width:920px; margin:0 auto; padding-left:2.6rem; }
.timeline::before{
  content:""; position:absolute; left:0.55rem; top:0.4rem; bottom:0.4rem; width:2px;
  background:repeating-linear-gradient(to bottom, var(--teal-line) 0 6px, transparent 6px 11px);
}
.t-entry{ position:relative; padding:0 0 3rem 1.6rem; }
.t-entry:last-child{padding-bottom:0;}
.t-stamp{
  position:absolute; left:-2.6rem; top:0.15rem; width:1.9rem; height:1.9rem; border-radius:50%;
  border:2px solid var(--brass); background:var(--ink-deep-2); display:flex; align-items:center; justify-content:center;
}
.t-stamp.uncertain{border-color:var(--unsure); border-style:dashed;}
.t-stamp::after{ content:""; width:0.5rem; height:0.5rem; border-radius:50%; background:var(--brass); }
.t-stamp.uncertain::after{background:var(--unsure);}
.t-date{ font-family:'Courier Prime',monospace; font-size:0.8rem; color:var(--brass-soft); margin-bottom:0.3rem; }
.t-name{ font-family:'Fraunces',serif; font-weight:600; font-style:italic; font-size:1.55rem; color:var(--paper); margin:0 0 0.3rem; }
.t-tag{
  display:inline-block; font-family:'Courier Prime',monospace; font-size:0.7rem; color:var(--ink-deep);
  background:var(--brass-soft); padding:0.12rem 0.5rem; border-radius:2px; margin-left:0.6rem; vertical-align:middle;
}
.t-body{color:#cdc2a6; max-width:640px; font-size:0.96rem;}
.t-body .src{ display:block; margin-top:0.5rem; font-family:'Courier Prime',monospace; font-size:0.75rem; color:#8fa8ab; }

/* ---------- CARDS ---------- */
.paper-card{ background:var(--paper); color:var(--ink-text); border-radius:2px; box-shadow:0 18px 40px -18px rgba(0,0,0,0.55); }
.evidence-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); gap:1.5rem; max-width:1180px; margin:0 auto; }
.ev-card{overflow:hidden;}
.ev-card img{width:100%; height:225px; object-fit:cover; object-position:center;}
.ev-card-body{padding:1.15rem 1.25rem 1.4rem;}
.ev-card-body h3{font-size:1.1rem; margin:0 0 0.5rem; font-style:italic; font-weight:600;}
.ev-card-body p{margin:0; font-size:0.9rem; color:var(--ink-faint);}
.ev-tag{
  font-family:'Courier Prime',monospace; font-size:0.66rem; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--stamp-red); display:block; margin-bottom:0.4rem;
}

/* ---------- CASE FILE ---------- */
.casefile{ max-width:980px; margin:0 auto; }
.verdict-row{ display:grid; grid-template-columns:1fr; gap:1.4rem; }
.yard-card{
  background:var(--ink-deep-2); border:1px solid rgba(182,136,63,0.25); border-radius:3px;
  padding:1.7rem 1.8rem; position:relative;
}
.yard-card.leading{border-color:var(--brass);}
.yard-card.conclusion{
  border:2px solid var(--brass);
  background:linear-gradient(180deg, rgba(182,136,63,0.13), var(--ink-deep-2) 55%);
  box-shadow:0 0 0 1px rgba(182,136,63,0.18), 0 10px 28px rgba(0,0,0,0.28);
  margin-top:1.9rem !important;
}
.yard-card.conclusion::before{
  content:"Tussenconclusie";
  position:absolute; top:-0.8rem; left:1.6rem;
  background:var(--brass); color:var(--ink-deep);
  font-family:'Courier Prime',monospace; font-size:0.68rem; letter-spacing:0.09em; text-transform:uppercase;
  padding:0.32rem 0.75rem; border-radius:2px; font-weight:700;
}
.yard-name{ font-family:'Fraunces',serif; font-style:italic; font-weight:600; font-size:1.45rem; margin:0 0 0.2rem; }
.yard-loc{ font-family:'Courier Prime',monospace; font-size:0.76rem; color:var(--brass-soft); margin-bottom:1rem; display:block; }
.yard-verdict{
  display:inline-block; font-family:'Courier Prime',monospace; font-size:0.68rem; letter-spacing:0.08em;
  text-transform:uppercase; padding:0.25rem 0.65rem; border-radius:2px; margin-bottom:1rem;
}
.verdict-weak{background:rgba(163,52,31,0.18); color:#e79a86; border:1px solid rgba(163,52,31,0.4);}
.verdict-strong{background:rgba(182,136,63,0.18); color:var(--brass-soft); border:1px solid rgba(182,136,63,0.4);}
.verdict-open{background:rgba(63,122,128,0.2); color:#9fd2d6; border:1px solid rgba(63,122,128,0.45);}
.verdict-conclusion{background:var(--brass); color:var(--ink-deep); border:1px solid var(--brass); font-weight:700;}
.yard-card ul{margin:0; padding-left:1.1rem; color:#cdc2a6; font-size:0.9rem;}
.yard-card li{margin-bottom:0.45rem;}

.flag-box{
  margin-top:2.2rem; background:rgba(163,52,31,0.12); border:1px dashed rgba(163,52,31,0.5);
  border-radius:3px; padding:1.5rem 1.7rem;
}
.flag-box h4{ margin:0 0 0.6rem; font-family:'Fraunces',serif; font-size:1.02rem; color:#e79a86; font-weight:600; }
.flag-box p{margin:0 0 0.6rem; color:#cdc2a6; font-size:0.92rem;}
.flag-box p:last-child{margin-bottom:0;}

.proof-box{
  margin-top:1.4rem; background:rgba(182,136,63,0.1); border:1px solid rgba(182,136,63,0.35);
  border-radius:3px; padding:1.5rem 1.7rem;
}
.proof-box h4{ margin:0 0 0.6rem; font-family:'Fraunces',serif; font-size:1.02rem; color:var(--brass-soft); font-weight:600; }
.proof-box p{margin:0 0 0.6rem; color:#cdc2a6; font-size:0.92rem;}
.proof-box p:last-child{margin-bottom:0;}

/* ---------- LEADS ---------- */
.leads{ max-width:900px; margin:0 auto; display:grid; gap:1rem; }
.lead{ display:grid; grid-template-columns:200px 1fr; gap:1.4rem; padding:1.1rem 0; border-bottom:1px solid rgba(237,228,207,0.12); align-items:start; }
.lead-what{ font-family:'Courier Prime',monospace; font-size:0.78rem; color:var(--brass-soft); }
.lead-detail p{margin:0 0 0.5rem; color:#cdc2a6; font-size:0.94rem;}
.lead-detail .term{
  display:inline-block; font-family:'Courier Prime',monospace; font-size:0.76rem; background:rgba(182,136,63,0.14);
  border:1px solid rgba(182,136,63,0.3); color:var(--brass-soft); padding:0.15rem 0.5rem; border-radius:2px; margin:0.15rem 0.3rem 0.15rem 0;
}

/* ---------- CONTACT CALLOUT ---------- */
.contact-callout{
  max-width:900px; margin:0 auto;
  background:linear-gradient(135deg, rgba(182,136,63,0.14), rgba(63,122,128,0.14));
  border:1px solid rgba(182,136,63,0.35);
  border-radius:4px;
  padding:2.4rem 2.6rem;
  text-align:left;
}
.contact-callout h3{ font-size:1.5rem; margin:0 0 0.8rem; color:var(--paper); font-style:italic; }
.contact-callout p{color:#d8cdb2; margin:0 0 1.3rem; max-width:600px;}
.contact-callout a.email-btn{
  display:inline-block; font-family:'Courier Prime',monospace; font-size:0.95rem;
  background:var(--brass-soft); color:var(--ink-deep); padding:0.75rem 1.4rem; border-radius:3px;
  text-decoration:none; font-weight:700; letter-spacing:0.01em;
}
.contact-callout a.email-btn:hover{background:#eccf94;}

.archive-thumb:target{
  outline:3px solid var(--brass);
  outline-offset:2px;
  animation:archive-flash 2s ease-out 1;
}
@keyframes archive-flash{
  0%{box-shadow:0 0 0 6px rgba(182,136,63,0.5);}
  100%{box-shadow:0 0 0 0 rgba(182,136,63,0);}
}

/* ---------- ARCHIVE GRID ---------- */
.archive-source-block{ max-width:1180px; margin:0 auto 4rem; }
.archive-source-block h3{
  font-family:'Fraunces',serif; font-style:italic; font-weight:600; font-size:1.4rem;
  color:var(--paper); margin:0 0 0.4rem;
}
.archive-source-block .src-meta{ font-family:'Courier Prime',monospace; font-size:0.78rem; color:var(--brass-soft); margin-bottom:1.6rem; display:block; }
.archive-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:0.9rem;
}
.archive-thumb{
  scroll-margin-top:5.5rem;
  position:relative; cursor:pointer; background:var(--paper-2); border-radius:2px; overflow:hidden;
  border:1px solid rgba(237,228,207,0.15); transition:transform 0.15s ease, border-color 0.15s ease;
}
.archive-thumb:hover{ transform:translateY(-3px); border-color:var(--brass); }
.archive-thumb img{ width:100%; height:150px; object-fit:cover; display:block; }
.archive-thumb .num{
  position:absolute; top:0.4rem; left:0.4rem; background:rgba(14,43,51,0.85); color:var(--brass-soft);
  font-family:'Courier Prime',monospace; font-size:0.68rem; padding:0.15rem 0.4rem; border-radius:2px;
}
.archive-thumb .cap{
  padding:0.5rem 0.6rem 0.7rem; font-family:'Courier Prime',monospace; font-size:0.7rem; color:var(--ink-faint); line-height:1.35;
}

/* lightbox */
.lightbox{
  position:fixed; inset:0; background:rgba(8,20,24,0.94); z-index:200;
  display:none; align-items:center; justify-content:center; flex-direction:column; padding:4vh 4vw;
}
.lightbox.open{display:flex;}
.lightbox img{ max-width:92vw; max-height:78vh; object-fit:contain; border-radius:2px; box-shadow:0 20px 60px rgba(0,0,0,0.6); }
.lightbox .lb-cap{ color:#d8cdb2; font-family:'Courier Prime',monospace; font-size:0.85rem; margin-top:1.2rem; text-align:center; max-width:700px; }
.lightbox .lb-close{
  position:absolute; top:1.5rem; right:2rem; font-family:'Courier Prime',monospace; color:var(--paper);
  font-size:1.6rem; cursor:pointer; background:none; border:none; line-height:1;
}
.lightbox .lb-nav{
  position:absolute; top:50%; transform:translateY(-50%); background:rgba(237,228,207,0.1); border:1px solid rgba(237,228,207,0.3);
  color:var(--paper); font-family:'Courier Prime',monospace; font-size:1.4rem; padding:0.6rem 0.9rem; cursor:pointer; border-radius:3px;
}
.lightbox .lb-prev{left:2rem;} .lightbox .lb-next{right:2rem;}
.lightbox .lb-download{
  margin-top:1rem; font-family:'Courier Prime',monospace; font-size:0.8rem; color:var(--brass-soft);
  text-decoration:underline;
}

/* ---------- COLOR PAGE ---------- */
.palette-row{ display:flex; flex-wrap:wrap; gap:0; border-radius:3px; overflow:hidden; margin-bottom:1rem; box-shadow:0 12px 30px -14px rgba(0,0,0,0.5); }
.swatch{ flex:1 1 120px; height:130px; position:relative; display:flex; align-items:flex-end; padding:0.7rem; }
.swatch .hex{ font-family:'Courier Prime',monospace; font-size:0.72rem; background:rgba(0,0,0,0.35); color:#fff; padding:0.15rem 0.4rem; border-radius:2px; }
.palette-meta{ max-width:900px; margin:0 auto 3rem; }
.palette-meta h3{font-family:'Fraunces',serif; font-style:italic; font-size:1.3rem; margin:0 0 0.5rem; color:var(--paper);}
.palette-meta p{color:#cdc2a6; font-size:0.94rem; max-width:680px;}
.palette-block{max-width:900px;margin:0 auto 3.5rem;}

/* ---------- CHECKLIST (droogstand) ---------- */
.checklist{ max-width:900px; margin:0 auto; display:grid; gap:1.2rem; }
.check-item{
  background:var(--ink-deep-2); border:1px solid rgba(182,136,63,0.22); border-radius:3px; padding:1.5rem 1.7rem;
}
.check-item h4{ font-family:'Fraunces',serif; font-style:italic; font-size:1.2rem; color:var(--paper); margin:0 0 0.5rem; }
.check-item .why{ font-size:0.9rem; color:#cdc2a6; margin:0 0 0.8rem; }
.check-item .how{ font-size:0.86rem; color:#9fd2d6; margin:0; font-family:'Courier Prime',monospace; }
.check-item .priority{
  display:inline-block; font-family:'Courier Prime',monospace; font-size:0.65rem; letter-spacing:0.08em; text-transform:uppercase;
  padding:0.2rem 0.55rem; border-radius:2px; margin-bottom:0.7rem;
}
.p-high{background:rgba(163,52,31,0.18); color:#e79a86; border:1px solid rgba(163,52,31,0.4);}
.p-medium{background:rgba(182,136,63,0.18); color:var(--brass-soft); border:1px solid rgba(182,136,63,0.4);}

.brand-badge{
  display:inline-block;
  font-family:'Courier Prime',monospace;
  font-weight:700;
  font-style:normal;
  font-size:0.68rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  padding:0.22rem 0.55rem;
  border-radius:2px;
  margin-left:0.6rem;
  vertical-align:middle;
  border:1px solid;
}
.brand-kromhout{ background:#e8dcc0; color:#5c1f18; border-color:#5c1f18; }
.brand-deutz{ background:#c23b2c; color:#fbe9e4; border-color:#7a2018; }
.brand-cummins{ background:#8a1112; color:#f5e2e2; border-color:#3d0708; }
.brand-johndeere{ background:#367c33; color:#ffde00; border-color:#1f4a1d; }

/* ---------- FOOTER ---------- */
footer{
  padding:3.5rem 6vw 2.5rem; border-top:1px solid rgba(237,228,207,0.12);
  font-family:'Courier Prime',monospace; font-size:0.78rem; color:#8fa8ab;
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem;
}
footer a{color:var(--brass-soft); text-decoration:none;}
footer a:hover{text-decoration:underline;}

@media (max-width:640px){
  section{padding:3.5rem 5vw;}
  .page-header{padding:4rem 5vw 2.5rem;}
  .lead{grid-template-columns:1fr;}
  .t-entry{padding-left:1rem;}
  .lightbox .lb-nav{padding:0.4rem 0.6rem; font-size:1.1rem;}
  .lightbox .lb-prev{left:0.6rem;} .lightbox .lb-next{right:0.6rem;}
}

.reveal{opacity:0; transform:translateY(14px); transition:opacity 0.7s ease, transform 0.7s ease;}
.reveal.in{opacity:1; transform:none;}

@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
