/* ===== Layout basis ===== */
.bm-home { background:#fff; color:#0b0f1a; }
.bm-wrap { max-width:1280px; margin:0 auto; padding:20px 24px 40px; }
@media(max-width:768px){ .bm-wrap{ padding:16px 12px 28px; } }

.bm-section { margin:28px 0; }
.bm-section-head { margin:0 0 10px; }
.bm-h2 { margin:0 0 4px; font-weight:900; font-size:clamp(1.5rem, 1.1rem + 1.2vw, 2.0rem); }
.bm-h3 { margin:0; font-weight:800; font-size:1.1rem; }
.bm-sub { margin:0; color:#4b5563; }

/* ===== Hero ===== */
.bm-hero { background:#f8fafc; border:1px solid #e5e7eb; border-left:4px solid #0a66c2; border-radius:14px; padding:20px; margin:6px 0 18px; }
.bm-hero__title { margin:0 0 6px; font-weight:900; font-size:clamp(1.6rem, 1.1rem + 1.4vw, 2.2rem); }
.bm-hero__sub { margin:0 0 10px; color:#374151; }
.bm-hero__ctas { display:flex; gap:10px; flex-wrap:wrap; }
.bm-btn { display:inline-block; padding:.6rem 1rem; border-radius:999px; text-decoration:none; font-weight:800; }
.bm-btn--primary { background:#0a66c2; color:#fff; border:1px solid #0a66c2; }
.bm-btn--ghost { background:#fff; color:#0a66c2; border:1px solid #cfe2f8; }
.bm-btn--ghost:hover { border-color:#0a66c2; }

/* ===== Today strip ===== */
.bm-today { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; margin:10px 0 18px; }
@media(max-width:860px){ .bm-today{ grid-template-columns:repeat(2,1fr); } }
.bm-today__item { background:#f8fafc; border:1px solid #e5e7eb; border-radius:12px; padding:10px 12px; }
.bm-today__item a { color:#0b0f1a; font-weight:700; text-decoration:none; }
.bm-today__item a:hover { text-decoration:underline; text-decoration-color:#0a66c2; }
.bm-pill { display:inline-block; padding:.22rem .55rem; border-radius:999px; background:#0a66c2; color:#fff; font-size:.72rem; font-weight:900; margin-right:6px; }

/* ===== Grid cards ===== */
.bm-grid { display:grid; gap:16px; }
.bm-grid--2col { grid-template-columns:repeat(2, minmax(0,1fr)); }
.bm-grid--4up { grid-template-columns:repeat(4, minmax(0,1fr)); }
@media(max-width:1024px){ .bm-grid--4up{ grid-template-columns:repeat(2, 1fr);} }
@media(max-width:640px){ .bm-grid--2col, .bm-grid--4up, .bm-grid--stack{ grid-template-columns:1fr; } }
.bm-card { background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:14px; }

/* ===== Lijstjes ===== */
.bm-block__head { display:flex; align-items:center; justify-content:space-between; margin:0 0 8px; }
.bm-more { color:#0a66c2; font-weight:800; text-decoration:none; }
.bm-more:hover { text-decoration:underline; }

.bm-list-compact { list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.bm-list-compact li a { display:flex; align-items:center; justify-content:space-between; gap:12px; text-decoration:none; padding:8px 10px; border-radius:10px; }
.bm-list-compact li a:hover { background:#f8fafc; }
.bm-list-compact__title { font-weight:700; color:#0b0f1a; }
.bm-list-compact__meta { color:#6b7280; font-size:.9rem; }

.bm-list-ranked { counter-reset: rank; list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.bm-list-ranked li a { display:flex; gap:10px; align-items:center; text-decoration:none; padding:8px 10px; border-radius:10px; }
.bm-list-ranked li a:hover { background:#f8fafc; }
.bm-rank { display:inline-block; min-width:34px; text-align:center; font-weight:900; color:#fff; background:#0a66c2; border-radius:10px; padding:.25rem .5rem; }

/* ===== Feature ===== */
.bm-feature { display:grid; grid-template-columns: min(420px, 42%) 1fr; gap:16px; align-items:start; }
@media(max-width:900px){ .bm-feature { grid-template-columns:1fr; } }
.bm-feature__thumb{ display:block; border-radius:14px; overflow:hidden; }
.bm-feature__body .bm-feature__title{ margin:.2rem 0 .6rem; font-size:clamp(1.3rem, 1rem + 1vw, 1.8rem); font-weight:900; }
.bm-feature__excerpt{ margin:0 0 .8rem; color:#1f2937; }

/* ===== Releases strip (scroll-snap) ===== */
.bm-strip { display:flex; gap:12px; overflow:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
.bm-strip__card { flex:0 0 164px; scroll-snap-align:start; text-decoration:none; color:#0b0f1a; }
.bm-strip__thumb { aspect-ratio:1/1; background:#f3f4f6; border-radius:12px; overflow:hidden; }
.bm-strip__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.bm-strip__title { display:block; margin:.35rem 0 0; font-weight:800; font-size:.95rem; }

/* ===== Lens (foto) ===== */
.bm-lens { position:relative; display:block; border-radius:14px; overflow:hidden; }
.bm-lens__title { position:absolute; left:12px; bottom:12px; background:rgba(0,0,0,.55); color:#fff; padding:.35rem .6rem; border-radius:10px; font-weight:900; }

/* ===== Newsletter ===== */
.bm-newsletter { background:#0a66c2; color:#fff; border-radius:14px; }
.bm-newsletter__inner { padding:18px; }
.bm-newsletter .bm-sub { color:#eaf2ff; }
.bm-newsletter__form { display:flex; gap:10px; margin-top:10px; }
.bm-newsletter__form input[type="email"]{
  flex:1; border-radius:12px; border:1px solid #eaf2ff; padding:.6rem .8rem; font-weight:600;
}
.bm-newsletter .bm-btn--primary{ background:#fff; color:#0a66c2; border-color:#fff; }

/* helpers */
.sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }









/* Homepage hero finetunes */
.home .bm-arch-head--home{
  margin-top: 10px !important;   /* was ~64px */
  margin-bottom: 20px;
}
@media (max-width: 768px){
  .home .bm-arch-head--home{ margin-top:5px !important; margin-bottom:16px; }
}

/* optisch iets slanker accentbalkje (mag je weglaten) */
.home .bm-arch-head--home .bm-arch-h1{ padding-left:18px; }
.home .bm-arch-head--home .bm-arch-h1::before{ width:8px; }

/* Subtekst: niet te smal laten afbreken + minder ruimte eronder */
.home .bm-arch-head--home .bm-arch-sub{
  max-width: 100%;               /* was ~850px → geef 'm de ruimte */
  margin: 8px 0 10px;            /* compacter naar CTA's */
  line-height: 1.55;
}

/* CTA-blok spacing-finetune */
.bm-home-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;              /* was 10px → meer lucht tussen knoppen */
  margin: 12px 0 40px;    /* iets meer boven en onder */
}

/* Mobiel iets compacter maar wel ruimte tussen knoppen */
@media (max-width: 640px){
  .bm-home-cta {
    gap: 12px;
    margin: 10px 0 18px;
  }
}


/* Knoppen: hover blijft goed leesbaar (tekst wit), blauw net iets donkerder */
.bm-btn--primary{
  background: #0a66c2;
  border: 1px solid #0a66c2;
  color: #fff;
}
.bm-btn--primary:hover,
.bm-btn--primary:focus{
  background: #0857a6;           /* iets donkerder blauw */
  border-color: #0857a6;
  color: #fff;                    /* tekst blijft wit → leesbaar */
}

/* Ghost-button: subtiele hover zonder contrastverlies */
.bm-btn--ghost:hover,
.bm-btn--ghost:focus{
  background: #f6f9ff;
  border-color: #0a66c2;
  color: #0a66c2;
}






/* ===== Blues Today – statusbar ===== */
.bm-todaybar{
  display:grid;
  grid-template-columns: 1.6fr repeat(3, 1fr);
  gap:12px;
  margin:22px 0 8px;
}

.bm-todaybar a{
  text-decoration:none;
}

.bm-todaybar__spot{
  position:relative;
  background:#0b1220;
  color:#fff;
  border-radius:14px;
  padding:14px 16px;
  overflow:hidden;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:72px;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
}

.bm-todaybar__thumb{
  position:absolute;
  right:0; top:0; bottom:0;
  width:36%;
  background-size:cover;
  background-position:center;
  opacity:.35;
  filter:grayscale(10%) contrast(105%);
}

.bm-chip{
  background:#1e63ff;
  color:#fff;
  border-radius:999px;
  padding:4px 10px;
  font-weight:800;
  font-size:.8rem;
  z-index:1;
}

.bm-todaybar__title{
  font-weight:800;
  font-size:1.05rem;
  line-height:1.2;
  z-index:1;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.bm-todaybar__stat{
  background:#f9fafb;
  border:1px solid rgba(30,99,255,.08);
  border-radius:14px;
  padding:14px 16px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:10px;
  color:#0b1220;
  box-shadow:0 1px 3px rgba(0,0,0,.05);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  min-height:72px;
}

.bm-todaybar__stat:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  border-color:rgba(30,99,255,.22);
}

.bm-todaybar__stat svg{
  width:22px;height:22px;opacity:.45;fill:#0b1220;
}

.bm-todaybar__label{
  font-weight:700; font-size:.95rem; color:#0b1220;
}

.bm-todaybar__count{
  font-weight:900; font-size:1.15rem;
}

@media (max-width: 1024px){
  .bm-todaybar{ grid-template-columns: 1fr 1fr; }
  .bm-todaybar__spot{ grid-column: 1 / -1; }
}
@media (max-width: 640px){
  .bm-todaybar{ grid-template-columns: 1fr; }
}


















/* ====== Nieuw-blok (magazine 2×3) – namespaced, no conflicts ====== */
.bm-latest-news { /* optionele wrapper if needed */ }
.bm-latest-news__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 22px;
}

.bm-ln-card {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 14px;
  align-items: center;
  background: transparent;   /* geen card look */
  border: 0;                 /* geen randen */
  box-shadow: none;
  padding: 0;
  transition: transform .15s ease, box-shadow .15s ease;
}

.bm-ln-card__thumb {
  width: 92px;
  border-radius: 10px;
  overflow: hidden;
  background: #e8ecf5;
  display: block;
}
.bm-ln-card__thumb img,
.bm-ln-card__thumbph {
  width: 100%; height: 100%;
  object-fit: cover; aspect-ratio: 1 / 1; display: block;
}
.bm-ln-card__thumb:hover img { transform: scale(1.02); transition: transform .2s ease; }

.bm-ln-card__body { display: flex; flex-direction: column; gap: 3px; }

.bm-ln-catlink {
  color: #1e63ff; font-weight: 700; font-size: .9rem;
  text-decoration: none; letter-spacing: .01em;
}
.bm-ln-catlink:hover { text-decoration: underline; }

.bm-ln-card__title {
  margin: 0; font-size: 1.1rem; line-height: 1.25; font-weight: 900;
}
.bm-ln-card__title a { color:#0b1220; text-decoration:none; }
.bm-ln-card__title a:hover { text-decoration:underline; }

.bm-latest-news__foot { text-align: right; margin-top: 8px; }
.bm-ln-more {
  color: #1e63ff; font-weight: 800; font-size: .95rem; text-decoration: none;
}
.bm-ln-more:hover { text-decoration: underline; }

/* Hover schaduw? heel subtiel, of zet 'm op none als je 100% vlak wil */
.bm-ln-card:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,.05); }

/* Tablet → 1 kolom onder 860px */
@media (max-width: 860px){
  .bm-latest-news__grid { grid-template-columns: 1fr; gap: 14px; }
  .bm-ln-card { grid-template-columns: 84px 1fr; }
  .bm-ln-card__thumb { width: 84px; }
  .bm-ln-card__title { font-size: 1.05rem; }
}

/* ====== Agenda side – (zonder tijd/city) netjes naast nieuw-blok ====== */
.bm-agenda-side { background:#f9fafb; border:1px solid rgba(30,99,255,.08); border-radius:12px; padding:12px; }
.bm-side-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.bm-side-title { font-size:1.05rem; font-weight:900; margin:0; }
.bm-side-link, .bm-side-cta { color:#1e63ff; font-weight:800; text-decoration:none; }
.bm-side-link:hover, .bm-side-cta:hover { text-decoration:underline; }
.bm-agenda-list { list-style:none; margin:0; padding:0; }
.bm-agenda-row { display:grid; grid-template-columns:84px 1fr; gap:8px; padding:8px 0; border-bottom:1px dashed rgba(0,0,0,.06); }
.bm-agenda-row:last-child { border-bottom:0; }
.bm-agenda-date { font-weight:800; color:#0b1220; }
.bm-agenda-title { font-weight:800; color:#0b1220; text-decoration:none; display:inline-block; }
.bm-agenda-title:hover { text-decoration:underline; }
.bm-agenda-meta { color:#586174; display:block; margin-top:2px; }
.bm-agenda-empty { color:#7a8699; font-style:italic; }
.bm-side-foot { margin-top:6px; text-align:right; }



/* ===== Forceer Blues Today layout (2/3 | 1/3) ===== */
.bm-23 {
  display: grid !important;
  grid-template-columns: 2fr 1fr !important;
  gap: 16px !important;
  align-items: start;
}
@media (max-width: 820px){
  .bm-23 {
    grid-template-columns: 1fr !important;
  }
  .bm-23__right { order: 2; }
}



/* ===== 2×3 Nieuw-blok – extra verticale lucht ===== */
.bm-latest-news__grid {
  row-gap: 28px !important; /* was 20px → iets luchtiger */
}

.bm-ln-card {
  padding-block: 6px; /* subtiele ruimte binnen elk item */
}

@media (max-width: 860px){
  .bm-latest-news__grid { row-gap: 20px !important; } /* mobiel compacter */
}




/* === Concertagenda: vlak & editorial (blend met links) === */
.bm-23__right .bm-agenda-side{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Kopje: zelfde ritme als links */
.bm-23__right .bm-side-head{
  margin-bottom: 10px;
}
.bm-23__right .bm-side-title{
  font-size: 1.15rem;
  font-weight: 900;
  margin: 0;
}
.bm-23__right .bm-side-link{
  color:#1e63ff; font-weight:800; text-decoration:none;
}
.bm-23__right .bm-side-link:hover{ text-decoration:underline; }

/* Lijsten: geen kaartjes/borders; alleen ruimte zoals links */
.bm-23__right .bm-agenda-list{
  list-style:none; margin:0; padding:0;
  display:grid; row-gap: 16px; /* meer lucht */
}
.bm-23__right .bm-agenda-row{
  display:grid;
  grid-template-columns: 84px 1fr;
  align-items:start;
  gap: 10px;
  padding: 0;            /* geen binnenpadding */
  border: 0 !important;  /* geen stippel-lijn */
}

/* Datum wat rustiger (zoals een meta-regel links) */
.bm-23__right .bm-agenda-date{
  color:#6b7280; font-weight:800; font-size:.95rem;
}

/* Titel/venue gelijk aan links */
.bm-23__right .bm-agenda-title{
  font-weight:900; color:#0b1220; text-decoration:none; line-height:1.25;
}
.bm-23__right .bm-agenda-title:hover{ text-decoration:underline; }
.bm-23__right .bm-agenda-meta{
  color:#586174; margin-top: 2px; display:block;
}

/* CTA identiek aan 'Meer nieuws ›' link links */
.bm-23__right .bm-side-foot{
  margin-top: 10px; text-align: right;
}
.bm-23__right .bm-side-cta{
  color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none;
}
.bm-23__right .bm-side-cta:hover{ text-decoration:underline; }

/* Mobiel: netjes onder elkaar */
@media (max-width: 820px){
  .bm-23__right .bm-agenda-row{ grid-template-columns: 84px 1fr; }
}




/* === Blues Today – Agenda stijl gelijk aan /concertagenda/ sidebar === */
.bm-23__right .bm-agenda-side{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Kopje */
.bm-23__right .bm-side-head{
  margin-bottom: 12px;
}
.bm-23__right .bm-side-title{
  font-size: 1.15rem;
  font-weight: 900;
  margin: 0;
}

/* Lijst: nette spacing */
.bm-23__right .bm-agenda-list{
  list-style:none; margin:0; padding:0;
  display:grid; row-gap: 16px;
}
.bm-23__right .bm-agenda-row{
  display:grid;
  grid-template-columns: 1fr;
  gap: 6px;
}

/* Datum zoals op /concertagenda/: kleine capsule + uppercase dag */
.bm-23__right .bm-agenda-date{
  display:inline-block;
  background:#f2f5fb;
  border-radius:6px;
  padding:2px 8px 3px;
  font-size:.82rem;
  font-weight:800;
  color:#1e63ff;
  letter-spacing:.03em;
  text-transform:uppercase;
}

/* Titel en venue op één regel */
.bm-23__right .bm-agenda-title{
  font-weight:900;
  color:#0b1220;
  text-decoration:none;
}
.bm-23__right .bm-agenda-title:hover{ text-decoration:underline; }

.bm-23__right .bm-agenda-meta{
  display:inline;
  color:#586174;
  font-weight:600;
  font-size:.95rem;
}

/* "Bekijk concertagenda ›" */
.bm-23__right .bm-side-foot{
  margin-top: 10px;
  text-align: right;
}
.bm-23__right .bm-side-cta{
  color:#1e63ff;
  font-weight:800;
  font-size:.95rem;
  text-decoration:none;
}
.bm-23__right .bm-side-cta:hover{ text-decoration:underline; }

/* Mobiel */
@media (max-width:820px){
  .bm-23__right .bm-agenda-list{ row-gap: 12px; }
}




/* ===== Blues Today – Concertagenda in 'card + date pill' stijl ===== */
.bm-23__right .bm-agenda-side{
  background: transparent; border: 0; padding: 0; box-shadow: none;
}

.bm-23__right .bm-agenda-list{
  list-style: none; margin: 0; padding: 0;
  display: grid; row-gap: 14px;
}

/* Kaart */
.bm-23__right .bm-ag-card{
  margin: 0; padding: 0;
}
.bm-23__right .bm-ag-card__link{
  display: grid; grid-template-columns: 76px 1fr; gap: 14px;
  align-items: center;
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  padding: 14px;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.bm-23__right .bm-ag-card__link:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  border-color: rgba(30,99,255,.18);
}

/* Datum-pill links (dag groot, maand klein) */
.bm-23__right .bm-ag-datepill{
  display: grid; place-items: center;
  width: 76px; height: 76px;
  background: #0b1220;  /* donkerblauw zoals sidebar */
  color: #fff;
  border-radius: 12px;
}
.bm-23__right .bm-ag-datepill__day{
  font-weight: 900; font-size: 1.35rem; line-height: 1; margin-bottom: 4px;
}
.bm-23__right .bm-ag-datepill__mon{
  font-weight: 800; font-size: .80rem; letter-spacing: .06em;
}

/* Tekst rechts (titel + venue) */
.bm-23__right .bm-ag-card__body{
  display: grid; gap: 4px;
}
.bm-23__right .bm-ag-card__title{
  color:#0b1220; font-weight: 900; font-size: 1.05rem; line-height: 1.25;
}
.bm-23__right .bm-ag-card__venue{
  color:#586174; font-weight: 600; font-size: .96rem;
}

/* Onderste CTA gelijk aan 'Meer nieuws ›' links */
.bm-23__right .bm-side-foot{ margin-top: 10px; text-align: right; }
.bm-23__right .bm-side-cta{
  color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none;
}
.bm-23__right .bm-side-cta:hover{ text-decoration:underline; }

/* Mobiel compacter */
@media (max-width: 820px){
  .bm-23__right .bm-agenda-list{ row-gap: 12px; }
  .bm-23__right .bm-ag-card__link{ grid-template-columns: 70px 1fr; padding: 12px; }
  .bm-23__right .bm-ag-datepill{ width: 70px; height: 70px; }
  .bm-23__right .bm-ag-card__title{ font-size: 1.02rem; }
}




/* === Home Concertagenda — match single-event sidebar === */
.bm-23__right .bm-agenda-side{ background:transparent; border:0; padding:0; box-shadow:none; }

.bm-23__right .bm-agenda-list{
  list-style:none; margin:0; padding:0;
  display:grid; row-gap:18px;
}

.bm-23__right .bm-ag-card__link{
  display:grid; grid-template-columns:88px 1fr; gap:16px; align-items:center;
  background:#fff;
  border:1px solid #e9edf3;
  border-radius:22px;
  padding:18px;
  text-decoration:none;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.bm-23__right .bm-ag-card__link:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(0,0,0,.08);
  border-color:rgba(30,99,255,.20);
}

/* Zwarte datum-pill */
.bm-23__right .bm-ag-datepill{
  width:88px; height:88px; border-radius:18px;
  background:#0b1220; color:#fff;
  display:grid; place-items:center;
}
.bm-23__right .bm-ag-datepill__day{
  font-weight:900; font-size:1.6rem; line-height:1; margin-bottom:4px;
}
.bm-23__right .bm-ag-datepill__mon{
  font-weight:800; font-size:.8rem; letter-spacing:.08em;
}

/* Tekst rechts */
.bm-23__right .bm-ag-card__body{ display:grid; gap:6px; }
.bm-23__right .bm-ag-card__title{ color:#0b1220; font-weight:900; font-size:1.15rem; line-height:1.25; }
.bm-23__right .bm-ag-card__venue{ color:#586174; font-weight:600; font-size:1rem; }

/* CTA onderaan */
.bm-23__right .bm-side-foot{ margin-top:10px; text-align:right; }
.bm-23__right .bm-side-cta{ color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none; }
.bm-23__right .bm-side-cta:hover{ text-decoration:underline; }

@media (max-width:820px){
  .bm-23__right .bm-ag-card__link{ grid-template-columns:78px 1fr; padding:14px; }
  .bm-23__right .bm-ag-datepill{ width:78px; height:78px; border-radius:16px; }
  .bm-23__right .bm-ag-datepill__day{ font-size:1.45rem; }
}






/* === Home: "Nieuw in de agenda" – match /concertagenda/ blok === */
.bm-23__right .bm-new-events-block { padding: 0; background: transparent; }
.bm-23__right .bm-block-title { margin: 0 0 10px; }
.bm-23__right .bm-block-title--highlight{
  font-weight: 900; font-size: 1.35rem; line-height: 1.2; margin: 0;
  position: relative; padding-bottom: 8px;
}
.bm-23__right .bm-block-title--highlight::after{
  content:""; display:block; height:3px; background:#1e63ff; margin-top:10px; border-radius:2px;
}

.bm-23__right .bm-new-events-list{
  display:flex; flex-direction:column; gap:12px; margin:0; padding:0;
}

.bm-23__right .bm-new-event-item{
  display:flex; align-items:center; gap:14px;
  text-decoration:none;
  background:#fff;
  border:1px solid #e7ebf2;
  border-radius:18px;
  padding:14px 16px;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
.bm-23__right .bm-new-event-item:hover{
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
  border-color: rgba(30,99,255,.18);
}

/* Mini date pill (dag + maand) */
.bm-23__right .bm-mini-date{
  display:grid; place-items:center;
  width:64px; height:64px;
  background:#0b1220; color:#fff;
  border-radius:12px;
  flex:0 0 64px;
}
.bm-23__right .bm-mini-day{
  font-weight:900; font-size:1.2rem; line-height:1; margin-bottom:2px;
}
.bm-23__right .bm-mini-mon{
  font-weight:800; font-size:.78rem; line-height:1; letter-spacing:.08em; text-transform:uppercase;
}

/* Eén-regel titel — stad */
.bm-23__right .bm-new-event-line{
  color:#0b1220; font-weight:900; font-size:1.06rem; line-height:1.25;
}

/* Onderste CTA */
.bm-23__right .bm-side-foot{ margin-top:10px; text-align:right; }
.bm-23__right .bm-side-cta{ color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none; }
.bm-23__right .bm-side-cta:hover{ text-decoration:underline; }

@media (max-width:820px){
  .bm-23__right .bm-new-event-item{ padding:12px 14px; }
  .bm-23__right .bm-mini-date{ width:58px; height:58px; border-radius:10px; flex-basis:58px; }
  .bm-23__right .bm-new-event-line{ font-size:1.02rem; }
}



/* === Concertagenda (home) fine-tune === */

/* Titel: één onderlijn, geen tweede lijn */
.bm-23__right .bm-block-title--highlight{
  margin: 0;
  padding-bottom: 6px;
  border: 0;
}
.bm-23__right .bm-block-title--highlight::after{
  content:"";
  display:block;
  height: 2px;                 /* dunner */
  background:#1e63ff;          /* jouw accentblauw */
  border-radius:2px;
  margin-top: 10px;
}
/* ruimte tussen titel en eerste kaart voorkomt ‘2e lijn’-illusie */
.bm-23__right .bm-new-events-list{ margin-top: 8px; }

/* Kaartjes blijven gelijk; geen extra lijnen onder CTA */
.bm-23__right .bm-side-foot{
  margin-top: 10px;
  text-align: right;
  border: 0;                   /* zeker geen lijn */
}
.bm-23__right .bm-side-cta{
  text-decoration: none;
  border: 0;
}
.bm-23__right .bm-side-cta:hover{ text-decoration: underline; }

/* Mini-date pill: kleiner + exact blauw (#003366) */
.bm-23__right .bm-mini-date{
  width: 56px;
  height: 56px;
  border-radius: 10px;
  background: #003366;         /* zelfde als sidebar-blok */
  color: #fff;
  display: grid;
  place-items: center;
  flex: 0 0 56px;
}
.bm-23__right .bm-mini-day{
  font-weight: 900;
  font-size: 1.05rem;
  line-height: 1;
  margin-bottom: 2px;
}
.bm-23__right .bm-mini-mon{
  font-weight: 800;
  font-size: .72rem;
  letter-spacing: .08em;
  line-height: 1;
}

/* Typografie: city lichter dan titel */
.bm-23__right .bm-new-event-line{
  color:#0b1220;
  font-size: 1.06rem;
  line-height: 1.25;
  font-weight: 900;            /* default: voor .bm-title */
}
.bm-23__right .bm-title{ font-weight: 900; }
.bm-23__right .bm-sep{ opacity: .9; }
.bm-23__right .bm-city{
  font-weight: 700;            /* lichter gewicht */
  color: #586174;              /* zachter grijs/blauw */
}

/* Kaartjes zelf iets compacter en neutrale rand */
.bm-23__right .bm-new-event-item{
  padding: 12px 14px;
  border-color: #e7ebf2;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}



/* === Concertagenda mini-date pill: compact badge look === */
.bm-23__right .bm-mini-date{
  /* formaat + shape */
  width: 58px; height: 58px; flex: 0 0 58px;
  border-radius: 12px;

  /* donkerblauw + zachte glans en diepte */
  background: linear-gradient(180deg, #0B2E5A 0%, #123D72 100%);
  color: #fff;
  display: grid; place-items: center;

  /* diepte zoals screenshot */
  box-shadow:
    0 6px 18px rgba(18, 61, 114, .18),   /* outer glow */
    inset 0 1px 0 rgba(255,255,255,.18), /* top highlight */
    inset 0 -3px 8px rgba(0,0,0,.25);    /* bottom inner shadow */
}

.bm-23__right .bm-mini-day{
  font-weight: 900;
  font-size: 1.18rem;   /* ≈ 19px */
  line-height: 1;
  margin-bottom: 2px;
  letter-spacing: .01em;
}

.bm-23__right .bm-mini-mon{
  font-weight: 800;
  font-size: .74rem;    /* ≈ 12px */
  line-height: 1;
  letter-spacing: .10em;
  text-transform: uppercase;
  opacity: .95;
}

/* Kaart een tikje compacter zodat de pill mooi proportioneert */
.bm-23__right .bm-new-event-item{
  padding: 12px 14px;
  border-radius: 18px;
}



/* ===== Concertagenda (home) – vlakke lijst, compactere pill ===== */

/* 1) Geen card look */
.bm-23__right .bm-new-event-item{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 8px 0 !important;     /* alleen verticale spacing */
  gap: 12px !important;
}
.bm-23__right .bm-new-event-item:hover{
  transform: none !important;
  box-shadow: none !important;
  border-color: transparent !important;
}
.bm-23__right .bm-new-events-list{ row-gap: 10px !important; }

/* 2) Datum-badge: compacter (minder ruimte tussen dag en maand) */
.bm-23__right .bm-mini-date{
  width: 56px; height: 56px; flex: 0 0 56px;
  border-radius: 10px;
  background: #003366;           /* zelfde blauw als agenda-blok */
  color:#fff;
  display:grid; place-items:center;
  box-shadow:none;               /* geen extra diepte nodig */
}
.bm-23__right .bm-mini-day{
  font-weight:900; font-size:1.06rem; line-height:1;
  margin-bottom: 0;              /* <-- ruimte tussen dag/maand weg */
  letter-spacing:.01em;
}
.bm-23__right .bm-mini-mon{
  font-weight:800; font-size:.72rem; line-height:1;
  letter-spacing:.08em; text-transform:uppercase;
  margin-top: 1px;               /* mini adempauze i.p.v. grote gap */
}

/* 3) Titel — City: city lichter, separator zelfde stijl als city */
.bm-23__right .bm-new-event-line{ font-weight:900; font-size:1.06rem; }
.bm-23__right .bm-city{
  font-weight:700; color:#586174;
}
.bm-23__right .bm-sep{
  color:#586174; font-weight:700; /* zelfde als city */
}

/* 4) Footerlink als 'Meer nieuws ›' */
.bm-23__right .bm-latest-foot{ margin-top:8px; text-align:right; }
.bm-23__right .bm-more-link{
  color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none;
}
.bm-23__right .bm-more-link:hover{ text-decoration:underline; }




/* ===== Home: Concertagenda compacte lijst ===== */
.bm-agenda-compact { padding:0; }
.bm-agenda-ttl {
  margin:0 0 8px;
  font-size:1.35rem; font-weight:900; line-height:1.2;
  position:relative; padding-bottom:6px;
}
.bm-agenda-ttl::after{
  content:""; display:block; height:2px; background:#1e63ff; border-radius:2px; margin-top:10px;
}
.bm-agenda-ul{ list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }

.bm-agenda-li{}
.bm-agenda-a{
  display:grid; grid-template-columns:58px 1fr; gap:12px;
  align-items:center; text-decoration:none; padding:6px 0;
  border-radius:10px;
}
.bm-agenda-a:hover{ background:rgba(30,99,255,.06); }

/* Datum badge — compact, weinig ruimte tussen dag en maand */
.bm-agenda-date{
  width:58px; height:58px; border-radius:12px; flex:0 0 58px;
  background:#003366; color:#fff; display:grid; place-items:center;
}
.bm-agenda-date .d{ display:block; font-weight:900; font-size:1.1rem; line-height:1; margin-bottom:1px; letter-spacing:.01em; }
.bm-agenda-date .m{ display:block; font-weight:800; font-size:.72rem; line-height:1; letter-spacing:.08em; }

/* Tekst: titel zwaar, city lichter; separator volgt city-stijl */
.bm-agenda-line{ color:#0b1220; font-size:1.06rem; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bm-agenda-line .t{ font-weight:900; }
.bm-agenda-line .c,
.bm-agenda-line .sep{ font-weight:700; color:#586174; }

/* Footer-link zoals “Meer nieuws ›” */
.bm-agenda-foot{ margin-top:8px; text-align:right; }
.bm-agenda-more{ color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none; }
.bm-agenda-more:hover{ text-decoration:underline; }

/* Responsief */
@media (max-width: 820px){
  .bm-agenda-a{ grid-template-columns:54px 1fr; gap:10px; }
  .bm-agenda-date{ width:54px; height:54px; border-radius:10px; }
  .bm-agenda-line{ font-size:1.02rem; }
}




/* ===== Home: Concertagenda – dag-groepering ===== */
.bm-agenda-group { padding:0; }
.bm-agenda-ttl{
  margin:0 0 8px; font-size:1.35rem; font-weight:900; line-height:1.2;
  position:relative; padding-bottom:6px;
}
.bm-agenda-ttl::after{
  content:""; display:block; height:2px; background:#1e63ff; border-radius:2px; margin-top:10px;
}

.bm-agenda-days{ display:flex; flex-direction:column; gap:12px; }

/* Een dag: badge links, lijst rechts */
.bm-agenda-day{
  display:grid; grid-template-columns:58px 1fr; gap:12px; align-items:start;
}

/* Datum-badge (compact, zoals sidebar) */
.bm-agenda-date{
  width:58px; height:58px; border-radius:12px; background:#003366; color:#fff;
  display:grid; place-items:center; flex:0 0 58px;
}
.bm-agenda-date .d{ display:block; font-weight:900; font-size:1.1rem; line-height:1; margin-bottom:1px; letter-spacing:.01em; }
.bm-agenda-date .m{ display:block; font-weight:800; font-size:.72rem; line-height:1; letter-spacing:.08em; }

/* Lijst met items van die dag */
.bm-agenda-day__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.bm-agenda-item{
  display:inline-block; text-decoration:none; padding:6px 8px; border-radius:8px;
  color:#0b1220; font-size:1.06rem; line-height:1.25;
}
.bm-agenda-item:hover{ background:rgba(30,99,255,.06); }
.bm-agenda-item .t{ font-weight:900; }
.bm-agenda-item .c,
.bm-agenda-item .sep{ font-weight:500; color:#586174; }

/* Footer link zoals “Meer nieuws ›” */
.bm-agenda-foot{ margin-top:8px; text-align:right; }
.bm-agenda-more{ color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none; }
.bm-agenda-more:hover{ text-decoration:underline; }

/* Responsief */
@media (max-width: 820px){
  .bm-agenda-day{ grid-template-columns:54px 1fr; gap:10px; }
  .bm-agenda-date{ width:54px; height:54px; border-radius:10px; }
  .bm-agenda-item{ font-size:1.02rem; padding:6px; }
}



/* ====== Concertagenda datum-blok – stijl conform agenda-pagina ====== */
.bm-agenda-date {
  display: grid;
  place-items: center;
  background: #0a2458;      /* diep marineblauw */
  color: #fff;
  border-radius: 8px;
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  text-align: center;
  padding: 0;
}

.bm-agenda-date .d {
  display: block;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.05;
  margin-bottom: 2px;
}

.bm-agenda-date .m {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0.04em;
}

/* Responsief */
@media (max-width: 820px){
  .bm-agenda-date {
    width: 46px;
    height: 46px;
  }
}



/* ===== Concertagenda: datumblok (hard override) ===== */
.bm-agenda-group .bm-agenda-date{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:52px !important;
  height:52px !important;
  flex:0 0 52px !important;

  background:#0a2458 !important;   /* donker marineblauw */
  color:#fff !important;
  border-radius:8px !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  text-align:center !important;
}

.bm-agenda-group .bm-agenda-date .d{
  display:block !important;
  font-weight:900 !important;
  font-size:1.12rem !important;
  line-height:1.05 !important;
  margin-bottom:2px !important;
  color:#fff !important;
}

.bm-agenda-group .bm-agenda-date .m{
  display:block !important;
  font-weight:800 !important;
  font-size:.75rem !important;
  line-height:1 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
  color:#fff !important;
}



/* ===== Compactere spacing tussen datumblok en titel ===== */
.bm-agenda-group .bm-agenda-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;   /* was waarschijnlijk 16px+ → nu strakker */
  padding: 6px 0 !important;
}


/* Titel + city netjes door laten lopen zonder grote gaten */
.bm-agenda-group .bm-agenda-item{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:baseline !important;
  justify-content:flex-start !important;  /* niets uit elkaar drukken */
  // gap:6px !important;                      /* klein tussenruimtetje */
  // padding:6px 8px !important;              /* mag je aanpassen of weghalen */
  border-radius:8px !important;
}

.bm-agenda-group .bm-agenda-item .t,
.bm-agenda-group .bm-agenda-item .sep,
.bm-agenda-group .bm-agenda-item .c{
  flex:0 0 auto !important;                /* niet oprekken */
  white-space:normal !important;           /* mag gewoon wrappen */
}

.bm-agenda-group .bm-agenda-item .t{ font-weight:900 !important; }
.bm-agenda-group .bm-agenda-item .sep{
  color:#8a93a3 !important;
  margin:0 2px !important;                 /* compact streepje */
}
.bm-agenda-group .bm-agenda-item .c{ color:#586174 !important; font-weight:700 !important; }

/* subtiele hover over de hele regel (optioneel) */
.bm-agenda-group .bm-agenda-item:hover{
  background:rgba(30,99,255,.06) !important;
}


/* ==== Forceer bredere horizontale ruimte tussen Nieuw & Concertagenda ==== */
.bm-23 {
  display: grid !important;
  grid-template-columns: 2fr 1fr !important;
  column-gap: 20px !important;  /* expliciet kolomafstand */
  align-items: start !important;
}

.bm-23__right {
  border-left: 1px solid rgba(0,0,0,.06);
  padding-left: 20px;
}


/* ==== Responsive fix: onder elkaar op mobiel ==== */
@media (max-width: 860px) {
  .bm-23 {
    grid-template-columns: 1fr !important;
    column-gap: 0 !important;
  }

  .bm-23__right {
    border-left: 0 !important;
    padding-left: 0 !important;
    margin-top: 24px; /* lucht tussen blokken op mobiel */
  }
}







/* ===== Topverhalen – Featured 2×2 (links) ===== */
.bm-featured-2x2{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:16px 18px;
}
@media (max-width:860px){
  .bm-featured-2x2{ grid-template-columns:1fr; }
}
.bm-fcard{ display:grid; gap:8px; }
.bm-fthumb{ display:block; border-radius:14px; overflow:hidden; background:#e8ecf5; }
.bm-fthumb img{ width:100%; height:100%; object-fit:cover; aspect-ratio: 3 / 2; display:block; transition:transform .2s ease; }
.bm-fthumb:hover img{ transform:scale(1.02); }
.bm-fmeta{ margin-top:2px; }
.bm-catlink{ color:#1e63ff; font-weight:800; font-size:.9rem; text-decoration:none; }
.bm-catlink:hover{ text-decoration:underline; }
.bm-ftitle{ margin:0; font-size:1.15rem; line-height:1.28; font-weight:900; }
.bm-ftitle a{ color:#0b1220; text-decoration:none; }
.bm-ftitle a:hover{ text-decoration:underline; }
.bm-featured-foot{ text-align:right; margin-top:8px; }

/* ===== Topverhalen – Best gelezen 24u (rechts) ===== */
.bm-side-head .bm-side-note{
  color:#586174; font-weight:700; font-size:.9rem;
}
.bm-hotlist{
  list-style:none; margin:0; padding:0;
  display:grid; gap:8px;
  counter-reset: hotrank;
}
.bm-hotitem{ }
.bm-hotlink{
  display:grid; grid-template-columns:auto 1fr; align-items:center; gap:10px;
  text-decoration:none; padding:8px 10px; border-radius:10px;
}
.bm-hotlink:hover{ background:#f8fafc; }
.bm-hotlink .bm-rank{
  counter-increment: hotrank;
  display:inline-block; min-width:34px; text-align:center;
  font-weight:900; color:#fff; background:#0a66c2; border-radius:10px; padding:.25rem .5rem;
}
.bm-hottitle{ color:#0b1220; font-weight:800; }
.bm-popular-foot{ text-align:right; margin-top:6px; }


/* Best gelezen: blauwe underline onder titel */
.bm-side-head .bm-block-title--highlight{
  margin:0;
  padding-bottom:6px;
  position:relative;
}
.bm-side-head .bm-block-title--highlight::after{
  content:"";
  display:block;
  height:2px;
  background:#1e63ff;
  border-radius:2px;
  margin-top:10px;
}

/* Uitgelicht: 'Meer ›' consistent met overige bloklinks */
.bm-featured-foot .bm-more-link,
.bm-featured-foot .bm-more-link:visited{
  color:#1e63ff;
  font-weight:800;
  text-decoration:none;
}
.bm-featured-foot .bm-more-link:hover{ text-decoration:underline; }



/* ==== BEST GELEZEN – uniform met Concertagenda ==== */
.bm-popular-24h .bm-side-title {
  color: #0b1220;              /* zelfde donkere titel-kleur */
  margin: 0;
  padding-bottom: 6px;
  position: relative;
  font-weight: 900;
  font-size: 1.15rem;
}
.bm-popular-24h .bm-side-title::after {
  content: "";
  display: block;
  height: 2px;
  background: #1e63ff;         /* dezelfde blauwe underline */
  border-radius: 2px;
  margin-top: 10px;
}

/* lijst zonder blauwe bars / borders; met nette counters */
.bm-popular-24h .bm-pop-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
  counter-reset: rank;
}

/* kill eventuele bestaande 'rank' UI (blauwe balkjes e.d.) */
.bm-popular-24h .bm-rank,
.bm-popular-24h .bm-pop-item::before {
  display: none !important;
}

/* titelrij */
.bm-popular-24h .bm-pop-item {
  display: block;
}

/* klikbare rij met links en nummering */
.bm-popular-24h .bm-pop-link {
  display: grid;
  grid-template-columns: 1.8em 1fr; /* ruimte voor nummer */
  align-items: baseline;
  gap: 8px;
  text-decoration: none;
  padding: 6px 4px;
  border-radius: 8px;
  color: #0b1220;
  line-height: 1.25;
  font-weight: 800;              /* stevige kop */
  position: relative;
}

/* nummering: lichtgrijs → donker op hover (Volkskrant-achtig) */
.bm-popular-24h .bm-pop-link::before {
  counter-increment: rank;
  content: counter(rank);
  font-weight: 900;
  color: #c5cbd6;               /* lichtgrijs */
  text-align: right;
  transition: color .15s ease;
}

/* hover: nummer zwart, link underline */
.bm-popular-24h .bm-pop-link:hover::before {
  color: #0b1220;
}
.bm-popular-24h .bm-pop-link:hover {
  text-decoration: underline;
  text-decoration-thickness: .06em;
}

/* footer-link identiek aan andere 'Meer ›' */
.bm-popular-24h .bm-popular-foot {
  margin-top: 8px;
  text-align: right;
}
.bm-popular-24h .bm-more-link,
.bm-popular-24h .bm-more-link:visited {
  color: #1e63ff;
  font-weight: 800;
  font-size: .95rem;
  text-decoration: none;
}
.bm-popular-24h .bm-more-link:hover { text-decoration: underline; }



/* === Best gelezen: kop-underline over volledige blokbreedte === */
.bm-popular-24h .bm-side-head{ 
  position: relative;
  padding-bottom: 6px; /* ruimte voor de lijn */
}
.bm-popular-24h .bm-side-head::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;   /* volle breedte */
  height:2px;
  background:#1e63ff;
  border-radius:2px;
}
/* titelkleur/gewicht consistent */
.bm-popular-24h .bm-side-title{
  margin:0;
  color:#0b1220;
  font-weight:900;
  font-size:1.15rem;
}

/* === Best gelezen: lijst strak onder kop, links uitlijnen === */
.bm-popular-24h .bm-pop-list{
  margin:10px 0 0;   /* direct onder de underline */
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
  counter-reset: rank;
}

/* rij: nummer + titel netjes links onder de kop uitlijnen */
.bm-popular-24h .bm-pop-link{
  display:grid;
  grid-template-columns: 2.2em 1fr; /* ruimte voor groter nummer */
  align-items: baseline;
  gap:8px;
  text-decoration:none;          /* geen underline op de hele rij */
  color:#0b1220;
  line-height:1.25;
  padding:4px 0;                 /* geen extra linker padding */
  border-radius:8px;
  font-weight:800;
}

/* nummer: groter, lichtgrijs → donker op hover; nooit onderstreep */
.bm-popular-24h .bm-pop-link::before{
  counter-increment: rank;
  content: counter(rank);
  font-weight:900;
  font-size:1.15rem;             /* groter nummer */
  color:#c5cbd6;
  line-height:1;
}
.bm-popular-24h .bm-pop-link:hover::before{ color:#0b1220; }

/* link-hover alleen titel onderstrepen (niet het nummer) → via child */
.bm-popular-24h .bm-pop-link:hover span{ text-decoration: underline; }
.bm-popular-24h .bm-pop-link span{ text-decoration: none; }

/* zorg dat eventuele oude rank/balkjes verdwijnen */
.bm-popular-24h .bm-rank{ display:none !important; }

/* footer-link uniform */
.bm-popular-24h .bm-popular-foot{ margin-top:8px; text-align:right; }
.bm-popular-24h .bm-more-link{ color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none; }
.bm-popular-24h .bm-more-link:hover{ text-decoration:underline; }


/* === Best gelezen — fix underline & left align === */

/* 1) Schakel eventuele "extra" decoratieve lijn(en) uit in dit blok */
.bm-popular-24h .bm-section-head::before,
.bm-popular-24h .bm-section-head::after,
.bm-popular-24h .bm-side-head::before,
.bm-popular-24h .bm-side-title::before,
.bm-popular-24h .bm-side-title::after{
  display:none !important;
}

/* 2) Eén doorlopende blauwe lijn onder de titel (zoals Concertagenda) */
.bm-popular-24h .bm-side-head{
  position:relative;
  padding-bottom:6px; /* ruimte voor de lijn */
}
.bm-popular-24h .bm-side-head::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;        /* volle breedte */
  height:2px;
  background:#1e63ff;
  border-radius:2px;
}

/* 3) Lijst exact links laten starten onder de kop */
.bm-popular-24h .bm-pop-list{
  margin:10px 0 0 !important;
  padding-left:0 !important;         /* geen extra inspringing */
  list-style:none;
  display:grid;
  gap:10px;
  counter-reset:rank;
}

/* 4) Rij: vaste smalle kolom voor nummer + titel, geen extra padding links */
.bm-popular-24h .bm-pop-link{
  display:grid;
  grid-template-columns: 2.1em 1fr;  /* ruimte voor groter nummer */
  align-items:baseline;
  gap:10px;
  padding-left:0 !important;
  text-decoration:none;
  color:#0b1220;
  line-height:1.25;
}

/* 5) Nummer-stijl (groter, lichtgrijs → donker op hover), nooit underline */
.bm-popular-24h .bm-pop-link::before{
  counter-increment:rank;
  content: counter(rank);
  font-weight:900;
  font-size:1.2rem;
  color:#c5cbd6;
}
.bm-popular-24h .bm-pop-link:hover::before{ color:#0b1220; }

/* Alleen de titel (span) onderstrepen op hover, niet het cijfer */
.bm-popular-24h .bm-pop-link span{ text-decoration:none; }
.bm-popular-24h .bm-pop-link:hover span{ text-decoration:underline; }



/* === Best gelezen — exact links uitlijnen + geen underline op cijfer === */

/* 1) Nul-inspringing overal in dit blok */
.bm-popular-24h,
.bm-popular-24h .bm-side-head,
.bm-popular-24h .bm-pop-list{
  margin-left:0 !important;
  padding-left:0 !important;
}

/* 2) Rij zonder extra left-padding; grid start op kolom 0 */
.bm-popular-24h .bm-pop-link{
  display:grid;
  grid-template-columns: 2.1em 1fr;
  gap:10px;
  align-items:baseline;
  padding-left:0 !important;
  text-decoration:none !important;              /* voorkomt globale underline */
}

/* 3) Cijfer: nooit onderstrepen, ook niet via de anchor */
.bm-popular-24h .bm-pop-link::before{
  counter-increment: rank;
  content: counter(rank);
  font: 900 1.3rem/1 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:#c5cbd6;
  text-decoration:none !important;              /* kill inherit underline */
}

/* Hover: alleen de tekst onderstrepen en cijfer donkerder maken */
.bm-popular-24h .bm-pop-link span{ text-decoration:none; }
.bm-popular-24h .bm-pop-link:hover span{ text-decoration:underline; }
.bm-popular-24h .bm-pop-link:hover::before{ color:#0b1220; }



/* === Best gelezen — nummer echt volledig links uitlijnen === */

.bm-popular-24h .bm-pop-list {
  position: relative;
  margin: 10px 0 0 !important;
  padding-left: 0 !important;
  list-style: none;
  counter-reset: rank;
}

.bm-popular-24h .bm-pop-link {
  position: relative;                 /* basis voor absoluut nummer */
  display: block;
  padding-left: 1.8em;                /* ruimte voor cijfer links */
  text-decoration: none;
  color: #0b1220;
  line-height: 1.25;
  font-weight: 800;
}

/* Nummer nu absoluut aan uiterste linkerkant */
.bm-popular-24h .bm-pop-link::before {
  counter-increment: rank;
  content: counter(rank);
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 900;
  font-size: 1.25rem;
  line-height: 1.25;
  color: #c5cbd6;
  text-decoration: none !important;   /* nooit underline */
}

/* Hover: cijfer donkerder, tekst underline */
.bm-popular-24h .bm-pop-link:hover::before { color: #0b1220; }
.bm-popular-24h .bm-pop-link span { text-decoration: none; }
.bm-popular-24h .bm-pop-link:hover span { text-decoration: underline; }

/* Footer link gelijk aan andere blokken */
.bm-popular-24h .bm-popular-foot {
  margin-top: 8px;
  text-align: right;
}
.bm-popular-24h .bm-more-link {
  color: #1e63ff;
  font-weight: 800;
  font-size: 0.95rem;
  text-decoration: none;
}
.bm-popular-24h .bm-more-link:hover {
  text-decoration: underline;
}







/* Vervangt padding/absolute: echte kolom voor het nummer */
.bm-popular-24h { --rank-width: 12px; }

.bm-popular-24h .bm-pop-link{
  display: grid !important;
  grid-template-columns: var(--rank-width) 1fr !important;
  column-gap: 12px !important;
  align-items: center !important;   /* baseline alignment */
  padding-left: 0 !important;
  position: relative !important;
}

.bm-popular-24h .bm-pop-link::before{
  position: static !important;   /* wordt grid item in kolom 1 */
  justify-self: start !important;
  align-self: first baseline !important;
  text-decoration: none !important;
}


/* Best gelezen — grotere, duidelijkere rangnummers */
.bm-popular-24h .bm-pop-link::before {
  font-size: 1.25rem !important;   /* iets groter, ca. +10–15% */
  font-weight: 900 !important;     /* vetter voor contrast */
  color: #b3bac7 !important;       /* iets donkerder grijs, beter leesbaar */
  opacity: 1 !important;           /* zeker geen transparantie */
}

/* Hover: alleen nummer donkerder maken */
.bm-popular-24h .bm-pop-link:hover::before {
  color: #0b1220 !important;
}







/* ===== Release Radar (1×4) ===== */
.bm-rr-head .bm-rr-title{
  position:relative; padding-bottom:8px;
}
.bm-rr-head .bm-rr-title::after{
  content:""; display:block; height:2px; background:#1e63ff;
  margin-top:10px; border-radius:2px;
}

.bm-rr-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:16px;
}
@media (max-width: 960px){ .bm-rr-grid{ grid-template-columns:repeat(3, 1fr); } }
@media (max-width: 700px){ .bm-rr-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width: 420px){ .bm-rr-grid{ grid-template-columns:1fr; } }

.bm-rr-card{
  display:grid; gap:8px; text-decoration:none;
}
.bm-rr-cover{
  display:block; border-radius:12px; overflow:hidden; background:#e8ecf5;
  aspect-ratio:1/1; /* 1:1 covers */
}
.bm-rr-cover img{ width:100%; height:100%; object-fit:cover; display:block; }

.bm-rr-meta{
  font-size:.9rem; color:#586174; font-weight:700;
}
.bm-rr-title{
  color:#0b1220; font-weight:900; line-height:1.25;
}
.bm-rr-card:hover .bm-rr-title{ text-decoration:underline; }

.bm-rr-foot{ margin-top:10px; text-align:right; }
.bm-rr-foot .bm-more-link{
  color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none;
}
.bm-rr-foot .bm-more-link:hover{ text-decoration:underline; }



/* ===== Release Radar – mobiel: thumb + datum + titel in 1 rij ===== */
@media (max-width: 640px){
  .bm-rr-grid{
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .bm-rr-card{
    display: grid;
    grid-template-columns: 84px 1fr;
    grid-template-areas:
      "cover meta"
      "cover title";
    align-items: center;
    gap: 10px;
    text-decoration: none;
  }
  .bm-rr-cover{
    grid-area: cover;
    width: 84px;
    aspect-ratio: 1 / 1;
    border-radius: 10px;
    overflow: hidden;
  }
  .bm-rr-cover img{ width:100%; height:100%; object-fit:cover; display:block; }

  .bm-rr-meta{
    grid-area: meta;
    font-size: .88rem;
    line-height: 1.1;
    color: #586174;
    font-weight: 700;
    margin: 0; /* compacter */
  }
  .bm-rr-title{
    grid-area: title;
    font-size: 1.05rem;
    line-height: 1.25;
    font-weight: 900;
    margin: 0;
  }
}







/* === Blues Alive (wrap on desktop, full-bleed on mobile) === */
.bm-bluesalive--wrap{
  position: relative;
  width: 100%;
  margin: 28px 0;
  overflow: hidden;
}

/* Desktop/tablet layout: 4:3 beeld */
.bm-bluesalive__figure{
  position:relative;
  margin:0;
  width:100%;
  aspect-ratio: 4 / 3;
  border-radius: 16px;
  overflow:hidden;
  background:#0b0f1a;
  isolation:isolate;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

.bm-bluesalive__media{
  position:absolute; inset:0;
  background-image: var(--ba-img);
  background-size: cover;
  background-position: center;
  transform: scale(1.02);
  transition: transform .35s ease, filter .35s ease;
}
.bm-bluesalive__figure::after{
  content: "";
  position: absolute;
  inset: 0;
  /* Nieuwe, zachtere gradient */
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.04) 0%,     /* bijna transparant bovenaan */
    rgba(0, 0, 0, 0.08) 40%,    /* lichte sluier halverwege */
    rgba(0, 0, 0, 0.65) 100%    /* donkerder onderaan voor leesbaarheid */
  );
  z-index: 1;
}


.bm-bluesalive__caption{
  position:absolute; z-index:2;
  left: clamp(14px, 3vw, 32px);
  right: clamp(14px, 3vw, 32px);
  bottom: clamp(18px, 3vw, 42px);
  display:grid; gap:8px;
}
.bm-bluesalive__kicker{
  display:inline-block;
  background:rgba(255,255,255,.16);
  color:#fff; font-weight:900; font-size:.78rem;
  letter-spacing:.08em; text-transform:uppercase;
  padding:.32rem .6rem; border-radius:999px;
  backdrop-filter: blur(2px);
}
.bm-bluesalive__title{
  margin:0; color:#fff; font-weight:900; line-height:1.12;
  font-size: clamp(1.25rem, 0.9rem + 1.6vw, 2.1rem);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}

@media (hover:hover){
  .bm-bluesalive__link:hover .bm-bluesalive__media{
    transform: scale(1.06);
    filter: saturate(1.06) contrast(1.02);
  }
}

/* === Mobile: full-bleed + kleinere typografie === */
@media (max-width: 780px){
  .bm-bluesalive--wrap{
    width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
  }

  .bm-bluesalive__figure{
    aspect-ratio: 4 / 3;
    border-radius: 0;
    box-shadow: none;
  }

  .bm-bluesalive__title{
    font-size: clamp(0.95rem, 0.8rem + 1.3vw, 1.35rem);
    line-height: 1.15;
    -webkit-line-clamp: 2;
  }

  .bm-bluesalive__caption{
    left: clamp(10px, 4vw, 20px);
    right: clamp(10px, 4vw, 20px);
    bottom: clamp(12px, 4vw, 24px);
    gap: 6px;
  }
}


/* === Blues Alive gradient + tekstschaduw update === */
.bm-bluesalive__figure::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.03) 0%,     /* bijna transparant bovenaan */
    rgba(0,0,0,0.07) 45%,    /* lichte sluier midden */
    rgba(0,0,0,0.60) 100%    /* donkerder onderaan */
  );
  z-index:1;
}

/* Zachte tekstschaduw voor leesbaarheid */
.bm-bluesalive__title{
  margin:0;
  color:#fff;
  font-weight:900;
  line-height:1.12;
  font-size:clamp(1.25rem, 0.9rem + 1.6vw, 2.1rem);
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-shadow:
    0 2px 4px rgba(0,0,0,0.45),
    0 4px 10px rgba(0,0,0,0.25);  /* subtiel diffuus effect */
}

/* Mobiel iets kleinere tekst maar zelfde schaduw */
@media (max-width: 780px){
  .bm-bluesalive__title{
    font-size: clamp(0.95rem, 0.8rem + 1.3vw, 1.35rem);
    line-height: 1.15;
    -webkit-line-clamp: 2;
    text-shadow:
      0 1px 3px rgba(0,0,0,0.4),
      0 3px 6px rgba(0,0,0,0.2);
  }
}


@media (min-width: 960px){
  .bm-bluesalive__figure{
    aspect-ratio: 16 / 9; /* was 4/3 */
  }
}





/* === Blues Magazine Nieuwsbrief – Donkere variant (fix) === */
.bm-section.bm-newsletter--dark {
  background-color: #0a2458 !important; /* hard override, BM-donkerblauw */
  color: #fff !important;
  border: 0;
  border-radius: 18px;
  margin-top: 48px;
}

.bm-section.bm-newsletter--dark .bm-newsletter__inner {
  padding: 36px 20px;
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.bm-section.bm-newsletter--dark h2 {
  color: #fff;
  font-weight: 900;
  margin: 0 0 8px;
}

.bm-section.bm-newsletter--dark .bm-sub {
  color: #e3eaf7;
  margin-bottom: 20px;
  font-weight: 500;
}

.bm-section.bm-newsletter--dark .bm-newsletter__form {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.bm-section.bm-newsletter--dark input[type="email"] {
  flex: 1;
  min-width: 260px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08);
  color: #fff;
  padding: 0.7rem 1rem;
  font-weight: 600;
}

.bm-section.bm-newsletter--dark input[type="email"]::placeholder {
  color: rgba(255,255,255,.65);
}

/* CTA-knop: lichtblauw met hover */
.bm-section.bm-newsletter--dark .bm-btn--lightblue {
  background: #1e63ff;
  border: 1px solid #1e63ff;
  color: #fff;
  font-weight: 800;
  border-radius: 999px;
  padding: 0.7rem 1.4rem;
  transition: background 0.2s ease, transform 0.15s ease;
}

.bm-section.bm-newsletter--dark .bm-btn--lightblue:hover,
.bm-section.bm-newsletter--dark .bm-btn--lightblue:focus {
  background: #3b7aff;
  transform: translateY(-1px);
}

/* Mobiel: zelfde donkere tint behouden */
@media (max-width: 640px){
  .bm-section.bm-newsletter--dark {
    background-color: #0a2458 !important;
  }
  .bm-section.bm-newsletter--dark .bm-newsletter__inner {
    padding: 28px 14px;
  }
  .bm-section.bm-newsletter--dark .bm-btn--lightblue {
    width: 100%;
  }
}










/* === Home: Uit het Archief === */
.bm-archive {
  margin-top: 50px;
}

.bm-h2--underline {
  position: relative;
  padding-bottom: 6px;
}
.bm-h2--underline::after {
  content: "";
  display: block;
  height: 2px;
  background: #1e63ff;
  border-radius: 2px;
  margin-top: 10px;
}

.bm-archive-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 18px;
  margin-top: 16px;
}

.bm-archive-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: #0b1220;
  border-radius: 14px;
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}

.bm-archive-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}

.bm-archive-thumb {
  display: block;
  aspect-ratio: 4/3;
  background-size: cover;
  background-position: center;
}

.bm-archive-title {
  display: block;
  font-weight: 900;
  font-size: 1.05rem;
  padding: 10px 6px 8px;
}

.bm-archive-foot {
  text-align: right;
  margin-top: 10px;
}
.bm-archive-more {
  color: #1e63ff;
  font-weight: 800;
  font-size: .95rem;
  text-decoration: none;
}
.bm-archive-more:hover { text-decoration: underline; }

/* Mobiel: alles onder elkaar */
@media (max-width: 820px) {
  .bm-archive-grid {
    grid-template-columns: 1fr;
  }
  .bm-archive-title {
    font-size: 1rem;
  }
}



/* === Home: Uit het Archief (4-up layout) === */
.bm-archive-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 16px;
}

.bm-archive-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: #0b1220;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(38,38,38,.08);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.bm-archive-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.10);
}

.bm-archive-thumb {
  aspect-ratio: 4/3;
  background-size: cover;
  background-position: center;
  filter: sepia(.12) saturate(1.05) contrast(.98);
  position: relative;
}

.bm-archive-thumb::after {
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(120% 60% at 30% -10%, rgba(255,255,255,.15) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, rgba(0,0,0,.03), rgba(0,0,0,.00) 60%);
  pointer-events:none;
}

.bm-archive-card:hover .bm-archive-thumb {
  filter: sepia(.04) saturate(1.06) contrast(1.0);
}

.bm-archive-title {
  display: block;
  font-weight: 900;
  font-size: 1.05rem;
  line-height: 1.25;
  padding: 10px 8px 12px;
  letter-spacing: .005em;
}

/* Mobiel */
@media (max-width: 900px) {
  .bm-archive-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
}
@media (max-width: 640px) {
  .bm-archive-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .bm-archive-title {
    font-size: 1rem;
  }
}

/* Vintage variant */
.bm-archive--vintage {
  background: #f7f3ea;
  border-radius: 14px;
  padding: 16px 18px 14px;
}
.bm-archive--vintage .bm-archive-card {
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.05);
}
.bm-archive--vintage .bm-archive-card:hover {
  box-shadow: 0 8px 22px rgba(0,0,0,.12);
}


/* === Home: Uit het archief – cards als Release Radar, 4:3 === */
.bm-archive-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:18px;
  margin-top:14px;
}

.bm-archive-card{
  display:flex;
  flex-direction:column;
  text-decoration:none;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:14px;
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  color:#0b1220;
}
.bm-archive-card:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(0,0,0,.10);
  border-color:rgba(30,99,255,.18);
}

/* 4:3 cover */
.bm-archive-thumb{
  position:relative;
  width:100%;
  aspect-ratio:4/3;
  background:#e8ecf5;
  overflow:hidden;
}
.bm-archive-thumb img{
  width:100%; height:100%;
  object-fit:cover; display:block;
}

/* Meta: rubriek + datum op één regel */
.bm-archive-meta{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px 0;
}
.bm-chip--cat{
  background:#1e63ff;
  color:#fff;
  border-radius:999px;
  padding:4px 10px;
  font-weight:800;
  font-size:.78rem;
  line-height:1;
}
.bm-archive-date{
  color:#586174;
  font-size:.85rem;         /* iets kleiner */
  font-weight:600;
  white-space:nowrap;       /* bij elkaar houden: niet op 2 regels */
}

/* Titel */
.bm-archive-title{
  display:block;
  padding:8px 12px 12px;
  font-weight:900;
  font-size:1.05rem;
  line-height:1.25;
}

/* Footer link consistent met overige blokken */
.bm-archive-foot{ margin-top:8px; text-align:right; }
.bm-archive-more{
  color:#1e63ff; font-weight:800; font-size:.95rem; text-decoration:none;
}
.bm-archive-more:hover{ text-decoration:underline; }

/* Responsive */
@media (max-width: 1024px){
  .bm-archive-grid{ grid-template-columns:repeat(2, 1fr); gap:16px; }
}
@media (max-width: 640px){
  .bm-archive-grid{ grid-template-columns:1fr; gap:12px; }
  .bm-archive-title{ font-size:1rem; }
}