/* Participant UI — explicit brutalist layer loaded after subpages.css */

/* Listing cards */
.people-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:20px!important;
}
.person-card{
  min-height:168px!important;
  padding:22px!important;
  border:3px solid var(--bond-ink)!important;
  border-radius:14px!important;
  background:#fffdf7!important;
  box-shadow:8px 8px 0 var(--bond-ink)!important;
  overflow:hidden!important;
  transform:none!important;
}
.person-card::before,.person-card::after{content:none!important;display:none!important}
.person-card:hover{
  transform:translate(-2px,-2px)!important;
  border-color:var(--bond-ink)!important;
  box-shadow:11px 11px 0 var(--bond-ink)!important;
}
.person-card:active{transform:translate(3px,3px)!important;box-shadow:4px 4px 0 var(--bond-ink)!important}
.person-top{display:grid!important;grid-template-columns:112px minmax(0,1fr)!important;gap:20px!important;align-items:center!important}
.person-avatar{
  width:112px!important;height:112px!important;flex:0 0 112px!important;
  border:3px solid var(--bond-ink)!important;border-radius:12px!important;
  box-shadow:4px 4px 0 var(--bond-ink)!important;
  background:#111720!important;
}
.person-card__info{min-width:0;display:flex;flex-direction:column;justify-content:center}
.person-card h3{font-size:31px!important;line-height:.92!important;margin:0 0 8px!important}
.person-card p{font-size:14px!important;line-height:1.35!important;color:#6d6861!important;margin:0!important}
.person-card .badges{margin-top:14px!important;gap:8px!important;align-items:flex-start!important}
.person-card .badge{font-size:10px!important;padding:7px 9px!important;border:2px solid var(--bond-ink)!important;border-radius:7px!important;box-shadow:2px 2px 0 var(--bond-ink)!important}

/* Search + filters: one coherent brutalist control panel */
.toolbar{
  position:relative!important;
  z-index:3!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:16px!important;
  margin:30px 0 30px!important;
  padding:18px!important;
  border:3px solid var(--bond-ink)!important;
  border-radius:14px!important;
  background:#fffdf7!important;
  box-shadow:8px 8px 0 var(--bond-ink)!important;
}
.search-large{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:0 16px!important;
  min-height:58px!important;
  border:3px solid var(--bond-ink)!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:4px 4px 0 var(--bond-ink)!important;
}
.search-large .bf-icon{flex:0 0 22px!important;width:22px!important;height:22px!important;color:#ec4b2b!important}
.search-large input{
  flex:1 1 auto!important;
  width:100%!important;
  min-width:0!important;
  padding:15px 0!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:var(--bond-ink)!important;
  font:800 16px/1.2 Inter,system-ui,sans-serif!important;
}
.search-large:focus-within{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--bond-ink)!important}
.filters{display:flex!important;gap:12px!important;flex-wrap:wrap!important}
.filter{
  min-height:46px!important;
  border:3px solid var(--bond-ink)!important;
  border-radius:9px!important;
  padding:10px 16px!important;
  background:#fff!important;
  color:var(--bond-ink)!important;
  box-shadow:3px 3px 0 var(--bond-ink)!important;
  font:800 13px/1 Inter,system-ui,sans-serif!important;
}
.filter.active{background:var(--bond-ink)!important;color:#fff!important}
.filter:active{transform:translate(2px,2px)!important;box-shadow:1px 1px 0 var(--bond-ink)!important}
.people-meta{margin-bottom:20px!important}

/* Profile hero */
.profile-hero{
  display:flex!important;
  align-items:flex-end!important;
  min-height:520px!important;
  padding:34px!important;
  border:3px solid var(--bond-ink)!important;
  border-radius:16px!important;
  box-shadow:9px 9px 0 var(--bond-ink)!important;
  background:#111720!important;
  background-size:cover!important;
  background-position:center 24%!important;
  isolation:isolate;
}
.profile-hero::before{
  content:""!important;display:block!important;position:absolute!important;inset:0!important;z-index:-1!important;
  background:linear-gradient(180deg,rgba(5,7,10,.08) 15%,rgba(5,7,10,.42) 54%,rgba(5,7,10,.92) 100%)!important;
}
.profile-hero:not(.has-photo)::before{
  background:radial-gradient(circle at 88% 20%,rgba(246,191,36,.17),transparent 28%),repeating-linear-gradient(120deg,rgba(255,255,255,.028) 0 1px,transparent 1px 18px)!important;
}
.profile-hero__content{position:relative!important;z-index:2!important;max-width:760px}
.profile-hero.has-photo .profile-avatar{display:none!important}
.profile-hero h1{text-shadow:0 3px 18px rgba(0,0,0,.45)}
.profile-hero .section-kicker,.profile-hero .profile-sub,.profile-hero .profile-badges{position:relative;z-index:2}

/* Timeline: remove duplicate/technical wording */
.timeline-row{border:2px solid rgba(10,13,18,.12)!important;border-radius:12px!important}
.timeline-row b{font-weight:900!important}
.timeline-row small:empty{display:none!important}

/* Winner result: deliberate large separation between title and prize */
.winner-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:28px!important;
  min-height:112px!important;
  padding:20px 22px!important;
  border:3px solid #d4ad1e!important;
  border-radius:10px!important;
  box-shadow:5px 5px 0 var(--bond-ink)!important;
  background:#fff0a7!important;
}
.winner-row b{font-size:22px!important;line-height:1.05!important}
.winner-row span{font:900 30px/1 'Barlow Condensed',Inter,sans-serif!important;color:#111720!important;white-space:nowrap!important}

/* Footer slogan replaces the old tiny label above the logo */
footer .footer-brand{position:relative!important;margin-bottom:50px!important;overflow:visible!important}
footer .footer-brand::before{content:none!important;display:none!important}
footer .footer-brand::after{
  content:"De soap met echte verhalen en echte emoties"!important;
  position:absolute!important;
  top:calc(100% + 12px)!important;
  left:0!important;
  display:block!important;
  width:min(520px,88vw)!important;
  color:#f4f1ea!important;
  font:700 14px/1.35 Inter,system-ui,sans-serif!important;
  letter-spacing:.01em!important;
  text-transform:none!important;
  text-shadow:none!important;
}

@media(max-width:900px){
  .people-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  .people-grid{grid-template-columns:1fr!important;gap:18px!important}
  .person-card{min-height:160px!important;padding:18px!important;box-shadow:6px 6px 0 var(--bond-ink)!important}
  .person-top{grid-template-columns:104px minmax(0,1fr)!important;gap:17px!important}
  .person-avatar{width:104px!important;height:104px!important;flex-basis:104px!important}
  .person-card h3{font-size:29px!important}
  .person-card p{font-size:13px!important}
  .toolbar{padding:14px!important;gap:14px!important;margin:24px 0 28px!important;box-shadow:6px 6px 0 var(--bond-ink)!important}
  .search-large{min-height:56px!important;padding:0 14px!important;box-shadow:3px 3px 0 var(--bond-ink)!important}
  .filters{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .filter{width:100%!important;padding:10px 8px!important;font-size:12px!important}
  .profile-hero{min-height:500px!important;padding:28px 24px!important;background-position:center 20%!important;box-shadow:6px 6px 0 var(--bond-ink)!important}
  .profile-hero h1{font-size:clamp(58px,17vw,88px)!important}
  .winner-row{grid-template-columns:1fr!important;gap:14px!important}
  .winner-row span{font-size:34px!important}
  footer .footer-brand::after{left:50%!important;transform:translateX(-50%)!important;text-align:center!important}
}
