.program-page { background: var(--white); }
.program-shell { background: var(--white); }
.program-hero { position: relative; min-height: 245px; overflow: hidden; display: flex; align-items: end; padding: clamp(1.5rem, 3.5vw, 3rem) clamp(1.25rem, 6vw, 6rem); background: #080808 url("../assets/images/programma/programma-sportmix.jpg") center / cover no-repeat; color: #fff; isolation: isolate; }
.program-hero__overlay { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(5 5 5 / .94) 0%, rgb(5 5 5 / .84) 27%, rgb(5 5 5 / .44) 58%, rgb(5 5 5 / .12) 82%, rgb(5 5 5 / 0) 100%); }
.program-hero__copy { position: relative; z-index: 1; }
.program-hero__eyebrow, .program-hero__date { margin: 0; color: var(--gold-light); font: 700 clamp(.85rem, 1.4vw, 1.2rem)/1 var(--display); letter-spacing: .18em; text-transform: uppercase; }
.program-hero h1 { margin: .45rem 0 .55rem; color: var(--pure-white); font: 700 clamp(4rem, 10vw, 8.5rem)/.8 var(--display); letter-spacing: -.025em; text-transform: uppercase; }
.program-hero__date { color: var(--pure-white); font-size: clamp(1.25rem, 2.2vw, 2.1rem); }
.program-hero__mark { align-self: center; margin: 0 0 1rem auto; color: var(--gold-light); font: 700 clamp(1.25rem, 2.4vw, 2.4rem)/.82 var(--display); letter-spacing: .08em; text-align: right; text-transform: uppercase; }
.program-notice { margin: 0; padding: .65rem 1rem; background: var(--white); color: var(--black); font: 700 .78rem/1.2 var(--display); letter-spacing: .14em; text-align: center; text-transform: uppercase; }
.program-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-height: 520px; background: var(--black); }
.program-day { position: relative; min-width: 0; padding: clamp(1.4rem, 3vw, 3rem) clamp(1rem, 3vw, 3rem); overflow: hidden; color: var(--pure-white); isolation: isolate; }
.program-day::before { position: absolute; z-index: -1; inset: 0; background: var(--program-day-image) center / cover no-repeat; content: ""; filter: grayscale(1); opacity: .64; }
.program-day::after { position: absolute; z-index: -1; inset: 0; background: var(--program-day-overlay); content: ""; }
.program-day--friday { --program-day-image: url("../assets/images/programma/achtergronden/vrijdag.jpg"); --program-day-overlay: rgb(93 68 27 / .62); background: #493719; }
.program-day--saturday { --program-day-image: url("../assets/images/programma/achtergronden/zaterdag.jpg"); --program-day-overlay: rgb(213 154 24 / .68); background: var(--gold); color: var(--black); }
.program-day--saturday::before { filter: grayscale(1); opacity: .52; }
.program-day--sunday { --program-day-image: url("../assets/images/programma/achtergronden/zondag.jpg"); --program-day-overlay: rgb(93 68 27 / .62); background: #493719; }
.program-day + .program-day { border-left: 3px solid var(--gold); }
.program-day__header { display: flex; align-items: baseline; gap: 1rem; padding-bottom: 1rem; border-bottom: 2px solid var(--gold); }
.program-day__number { color: var(--gold-light); font: 700 clamp(4.2rem, 7vw, 7rem)/.75 var(--display); letter-spacing: -.04em; }
.program-day--saturday .program-day__number { color: var(--black); }
.program-day__header p { margin: 0; color: var(--pure-white); font: 700 clamp(1.8rem, 3vw, 3.1rem)/.82 var(--display); letter-spacing: .04em; text-transform: uppercase; }
.program-day--saturday .program-day__header p { color: var(--black); }
.program-day__header div span { color: var(--gold-light); font: 700 .9rem/1 var(--display); letter-spacing: .18em; text-transform: uppercase; }
.program-day--saturday .program-day__header div span { color: #806117; }
.program-activity-list { display: grid; gap: 0; margin: 2rem 0 0; padding: 0; list-style: none; }
.program-activity { display: grid; grid-template-columns: 3.45rem minmax(0, 1fr); align-items: center; gap: .9rem; min-width: 0; padding: .9rem 0; border-bottom: 1px solid rgb(255 255 255 / .18); font: 700 clamp(.9rem, 1.35vw, 1.2rem)/1.1 var(--display); letter-spacing: .025em; text-transform: uppercase; }
.program-activity__image { width: 3rem; height: 3rem; object-fit: contain; }
.program-activity small { display: block; margin-top: .28rem; color: var(--gold-light); font: 700 .68rem/1 var(--display); letter-spacing: .16em; text-transform: uppercase; }
.program-activity time { color: var(--gold-light); margin-right: .22rem; font: inherit; }
.program-activity time::after { content: " ·"; }
.program-activity a { display: block; width: max-content; margin-top: .45rem; color: var(--gold-light); font: 700 .72rem/1 var(--display); letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
.program-activity a:hover { text-decoration: underline; }
.program-day--saturday .program-activity { border-bottom-color: rgb(128 97 23 / .28); }
.program-day--saturday .program-activity time,
.program-day--saturday .program-activity a { color: #806117; }
.program-day--saturday .program-activity small { color: #806117; }
.program-day--saturday .program-activity > span { min-width: 0; }
.program-day__status { display: inline-block; margin: 2rem 0 0; padding: .45rem .65rem; border: 1px solid var(--gold-light); color: var(--gold-light); font: 700 .75rem/1 var(--display); letter-spacing: .16em; text-transform: uppercase; }
.program-page .site-footer { background: var(--black); color: var(--pure-white); }
@media (max-width: 767px) {
  .program-shell { position: relative; }
  .program-page .site-header { position: absolute; top: 0; right: 0; left: 0; z-index: 20; height: 0; background: transparent; }
  .program-page .brand__name { display: none; }
  .program-page .brand img { width: 112px; }
  .program-hero { min-height: 230px; padding: 7rem 1.25rem 1.8rem; background-position: right center; }
  .program-hero__overlay { background: linear-gradient(90deg, rgb(5 5 5 / .68) 0%, rgb(5 5 5 / .48) 52%, rgb(5 5 5 / .08) 100%); }
  .program-hero__mark { display: none; }
  .program-board { display: block; }
  .program-day { min-height: 0; padding: 2rem 1.25rem 2.4rem; }
  .program-day + .program-day { border-top: 3px solid var(--gold); border-left: 0; }
  .program-day__header { gap: .7rem; }
  .program-day__number { font-size: 4.7rem; }
  .program-activity { grid-template-columns: 3rem minmax(0, 1fr); gap: .7rem; padding: .8rem 0; }
  .program-activity__image { width: 2.5rem; height: 2.5rem; }
  .program-activity time { display: block; margin: 0 0 .18rem; }
  .program-activity time::after { content: ""; }
}