/*
Theme Name: Divi Child Theme
Theme URI: https://divireadythemes.com/
Description: Divi Child Theme
Author: Divi Ready Themes
Author URI: https://divireadythemes.com/
Template: Divi
Version: Updated for Divi 3+
*/



/*------------------------------------------------*/
/*-------------------[GENERAL]--------------------*/

/* Bebas Neue Pro – basisfamilie */
@font-face {
  font-family: "Bebas Neue Pro";
  src: url("/wp-content/uploads/fonts/BebasNeuePro-Regular.woff2") format("woff2"),
       url("/wp-content/uploads/fonts/BebasNeuePro-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Bebas Neue Pro";
  src: url("/wp-content/uploads/fonts/BebasNeuePro-Middle.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Bebas Neue Pro";
  src: url("/wp-content/uploads/fonts/BebasNeuePro-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Bebas Neue Pro";
  src: url("/wp-content/uploads/fonts/BebasNeuePro-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/*------------------------------------------------*/
/* ---------- Variant 1: mockup-stijl ---------- */
.tracks-gallery.variant-1 .track-card{
  background:#fff; border-radius:0px; box-shadow:0 8px 30px rgba(0,0,0,.08);
  overflow:hidden; display:flex; flex-direction:column;
}
.tracks-gallery.variant-1 .track-card__media{
  position:relative; aspect-ratio:1/1; overflow:hidden;
}
.tracks-gallery.variant-1 .track-card__media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.001); /* anti hairline */
}
.tracks-gallery.variant-1 .track-card__play{
  position:absolute; left:12px; bottom:12px;
  width:44px; height:44px; border-radius:999px;
  background:#000; color:#fff; border:none; display:grid; place-items:center;
  cursor:pointer; opacity:.95;
}
.tracks-gallery.variant-1 .track-card__play:hover{ transform:translateY(-1px); }

.tracks-gallery.variant-1 .track-card__content{ padding:14px; display:grid; gap:10px; }
.tracks-gallery.variant-1 .track-card__title{ margin:0; line-height:1.2; }
.tracks-gallery.variant-1 .track-card__title a{
  color:#111; text-decoration:none; font-weight:600; font-size:1rem;
}
.tracks-gallery.variant-1 .track-card__subtitle{
  margin-top:2px; font-size:.9rem; font-weight:600; color:#111; opacity:.9;
}
.tracks-gallery.variant-1 .track-card__rule{
  border:0; border-top:1px solid #e5e5e5; margin:6px 0 4px;
}
.tracks-gallery.variant-1 .track-card__meta{
  display:flex; justify-content:space-between; align-items:center; gap:8px;
  font-size:.8rem;
}
.tracks-gallery.variant-1 .track-card__label{ color:#444; opacity:.9; white-space:nowrap; }
.tracks-gallery.variant-1 .track-card__formats{ color:#111; }
.tracks-gallery.variant-1 .track-card__formats a{ color:#111; text-decoration:none; }
.tracks-gallery.variant-1 .track-card__formats a:hover{ text-decoration:underline; }

/* Grid spacing zoals in de mockup */
.tracks-gallery.variant-1 .tracks-grid{ gap:24px; }

/* =========================================================
   VARIANT 2 & 3 — Packshot-style (albums / physical)
   ========================================================= */
.tracks-gallery.variant-2 .tracks-grid,
.tracks-gallery.variant-3 .tracks-grid { gap:48px; }

/* grote witte mat met schaduw en packshot in het midden */
.tracks-gallery.variant-2 .pack-card__shot,
.tracks-gallery.variant-3 .pack-card__shot{
  position:relative;
  background:#fff;
  border-radius:0px;
  padding:34px;
  box-shadow:0 18px 40px rgba(0,0,0,.14);
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:1/1;
}
.tracks-gallery.variant-2 .pack-card__shot img,
.tracks-gallery.variant-3 .pack-card__shot img{
  max-width:82%; height:auto; display:block;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}

/* badge linksboven (variant 3 zichtbaar) */
.tracks-gallery.variant-2 .pack-card__badge{ display:none; }
.tracks-gallery.variant-3 .pack-card__badge{
  position:absolute; left:14px; top:14px;
  background:#111; color:#fff; padding:6px 10px; border-radius:3px;
  font-weight:800; font-size:.8rem; text-transform:uppercase; letter-spacing:.3px;
}

/* content onder packshot */
.tracks-gallery.variant-2 .pack-card__content,
.tracks-gallery.variant-3 .pack-card__content{ padding:14px 0 0; }

.pack-card__top{ display:flex; align-items:flex-start; gap:16px; justify-content:space-between; }
.pack-card__titles{ min-width:0; }
.pack-card__title{ margin:0; }
.pack-card__title a{
  color:#111; text-decoration:none; font-weight:800; text-transform:uppercase;
  letter-spacing:.3px; font-size:1.05rem; line-height:1.2;
}
.pack-card__subtitle{
  margin-top:3px; color:#111; font-size:.85rem; text-transform:uppercase; letter-spacing:.3px;
}

/* rechterkant: preorder/prijs/plus */
.pack-card__cta{ display:flex; align-items:center; gap:10px; }
.tracks-gallery.variant-2 .pack-card__pill{ display:none; }
.tracks-gallery.variant-3 .pack-card__pill{
  background:#111; color:#fff; padding:4px 10px; border-radius:4px; font-weight:800; font-size:.75rem;
}
.tracks-gallery.variant-2 .pack-card__price{ display:none; }
.tracks-gallery.variant-3 .pack-card__price{
  font-weight:800; font-size:1rem; white-space:nowrap;
}
.tracks-gallery.variant-2 .pack-card__add{ display:none; }
.tracks-gallery.variant-3 .pack-card__add{
  display:inline-grid; place-items:center;
  width:28px; height:28px; border-radius:999px; border:1px solid #111; line-height:1; text-decoration:none;
  color:#111; font-weight:800;
}

.pack-card__rule{ border:0; border-top:2px solid #111; margin:14px 0 10px; }

.pack-card__bottom{
  display:flex; justify-content:space-between; align-items:center; font-size:.85rem;
}
.pack-card__label{ color:#111; opacity:.9; }
.pack-card__formats{ text-transform:uppercase; letter-spacing:.3px; color:#111; }

/* titel boven de gallery */
.tracks-gallery.variant-2 .tracks-gallery__title,
.tracks-gallery.variant-3 .tracks-gallery__title{
  margin:0 0 28px; font-size:2.25rem; line-height:1.1; font-weight:800; text-transform:uppercase;
}
/* ===== Badge op alle varianten ===== */
.card-badge{
  position:absolute; left:12px; top:12px;
  background:#111; color:#fff; padding:6px 10px; border-radius:0px;
  font-weight:800; font-size:.8rem; text-transform:uppercase; letter-spacing:.3px;
  z-index:2;
}
.tracks-gallery.variant-3 .track-card__play{ display:none !important; }

/* ===== VARIANT 5 — packshot met CTA rechtsboven ===== */
.tracks-gallery.variant-5 .tracks-grid{ gap:48px; }

.tracks-gallery.variant-5 .pack-card__shot{
  position:relative; background:#fff; border-radius:0px; padding:34px;
  box-shadow:0 18px 40px rgba(0,0,0,.14);
  display:flex; align-items:center; justify-content:center; aspect-ratio:1/1;
}
.tracks-gallery.variant-5 .pack-card__shot img{
  max-width:82%; height:auto; display:block;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}

.tracks-gallery.variant-5 .pack-card__content{ padding:14px 0 0; }
.tracks-gallery.variant-5 .pack-card__top{
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
}
.tracks-gallery.variant-5 .pack-card__title{ margin:0; }
.tracks-gallery.variant-5 .pack-card__title a{
  color:#111; text-decoration:none; font-weight:800; text-transform:uppercase;
  letter-spacing:.3px; font-size:1.05rem; line-height:1.2;
}
.tracks-gallery.variant-5 .pack-card__subtitle{
  margin-top:3px; color:#111; font-size:.85rem; text-transform:uppercase; letter-spacing:.3px;
}

/* CTA: PRE–ORDER knop of prijs + plus of SOLD OUT */
.tracks-gallery.variant-5 .pack-card__cta{ display:flex; align-items:center; gap:10px; }
.tracks-gallery.variant-5 .pack-card__btn{
  display:inline-block; padding:6px 12px; border-radius:Opx; font-weight:800; font-size:.8rem;
  text-decoration:none; line-height:1; text-transform:uppercase; letter-spacing:.3px;
}
.tracks-gallery.variant-5 .pack-card__btn.is-preorder{ background:#111; color:#fff; }
.tracks-gallery.variant-5 .pack-card__btn.is-soldout{ background:#bdbdbd; color:#fff; }

.tracks-gallery.variant-5 .pack-card__price{ font-weight:800; font-size:1rem; white-space:nowrap; }

.tracks-gallery.variant-5 .pack-card__plus{
  display:inline-grid; place-items:center; width:28px; height:28px;
  border:1px solid #111; border-radius:999px; color:#111; text-decoration:none; font-weight:800;
}

/* Onderste lijn */
.tracks-gallery.variant-5 .pack-card__rule{ border:0; border-top:2px solid #111; margin:14px 0 10px; }
.tracks-gallery.variant-5 .pack-card__bottom{
  display:flex; justify-content:space-between; align-items:center; font-size:.85rem;
}
.tracks-gallery.variant-5 .pack-card__label{ color:#111; opacity:.9; }
.tracks-gallery.variant-5 .pack-card__formats{ text-transform:uppercase; letter-spacing:.3px; color:#111; }

/* (Optioneel) Beige achtergrond zoals je voorbeeld */
.tracks-gallery.variant-5 { /* background:#e9decc; padding:24px; border-radius:8px; */ }


/*------------------------------------------------*/
/*-----------------[HEADER-MENU]------------------*/
/*------------------------------------------------*/


/*------------------------------------------------*/
/*------------------[HOMEPAGE]--------------------*/
/*------------------------------------------------*/


/*------------------------------------------------*/
/*------------------[SUBPAGES]--------------------*/
/*------------------------------------------------*/


/*------------------------------------------------*/
/*-------------------[Footer]---------------------*/
/*------------------------------------------------*/


/*------------------------------------------------*/
/*--------------------[RWD]-----------------------*/
/*------------------------------------------------*/


/*------------------------------------------------*/
/*------------------------------------------------*/
/*------------------------------------------------*/
/*--[ADD TUTORIAL CUSTOMIZATION BELOW THIS LINE]--*/
/*------------------------------------------------*/
/*------------------------------------------------*/
/*------------------------------------------------*/

/* =============================================================
   EF TRACKS GALLERY — FIXED OVERRIDES (2025-08-18)
   - Unify badge to .card-badge (with fallback .pack-card__badge)
   - Add missing row grid for Variant 1
   - Ensure Variant 3 hides play button
   - Ensure Variant 2 & 5 packshot styles + CTA (v5) are present
   - Normalize gallery title styling for v1/v2/v3/v5
   - Keep existing rules; these override where selectors match
   ============================================================= */

/* 0) Global badge (works on all variants) */
.card-badge,
.pack-card__badge{
  position:absolute; left:12px; top:12px;
  background:#111; color:#fff; padding:6px 10px; border-radius:0px;
  font-weight:800; font-size:.8rem; text-transform:uppercase; letter-spacing:.3px;
  z-index:2;
}

/* 1) Variant 1 — layout row: play + text */
.tracks-gallery.variant-1 .track-card__row{
  display:grid; grid-template-columns:40px 1fr;
  align-items:center; column-gap:12px;
}

/* 1b) Variant 1 — optional: clean card chrome (uncomment to remove shadows) */
/*
.tracks-gallery.variant-1 .track-card{ background:transparent; box-shadow:none; border-radius:0; }
*/

/* 2) Variant 3 — same as v1 but without play */
.tracks-gallery.variant-3 .track-card__play{ display:none !important; }

/* 3) Variant 2 & 5 — packshot base */
.tracks-gallery.variant-2 .tracks-grid,
.tracks-gallery.variant-5 .tracks-grid{ gap:48px; }

.tracks-gallery.variant-2 .pack-card__shot,
.tracks-gallery.variant-5 .pack-card__shot{
  position:relative; background:#fff; border-radius:6px; padding:34px;
  box-shadow:0 18px 40px rgba(0,0,0,.14);
  display:flex; align-items:center; justify-content:center; aspect-ratio:1/1;
}
.tracks-gallery.variant-2 .pack-card__shot img,
.tracks-gallery.variant-5 .pack-card__shot img{
  max-width:82%; height:auto; display:block;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}

.tracks-gallery.variant-2 .pack-card__content,
.tracks-gallery.variant-5 .pack-card__content{ padding:14px 0 0; }

.pack-card__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.pack-card__titles{ min-width:0; }
.pack-card__title{ margin:0; }
.pack-card__title a{
  color:#111; text-decoration:none; font-weight:800; text-transform:uppercase;
  letter-spacing:.3px; font-size:1.05rem; line-height:1.2;
}
.pack-card__subtitle{
  margin-top:3px; color:#111; font-size:.85rem; text-transform:uppercase; letter-spacing:.3px;
}

.pack-card__rule{ border:0; border-top:2px solid #111; margin:14px 0 10px; }
.pack-card__bottom{ display:flex; justify-content:space-between; align-items:center; font-size:.85rem; }
.pack-card__label{ color:#111; opacity:.9; }
.pack-card__formats{ text-transform:uppercase; letter-spacing:.3px; color:#111; }

/* 4) Variant 5 — CTA zone (PRE-ORDER / price + plus / SOLD OUT) */
.tracks-gallery.variant-5 .pack-card__cta{ display:flex; align-items:center; gap:10px; }
.tracks-gallery.variant-5 .pack-card__btn{
  display:inline-block; padding:6px 12px; border-radius:4px; font-weight:800; font-size:.8rem;
  text-decoration:none; line-height:1; text-transform:uppercase; letter-spacing:.3px;
}
.tracks-gallery.variant-5 .pack-card__btn.is-preorder{ background:#111; color:#fff; }
.tracks-gallery.variant-5 .pack-card__btn.is-soldout{ background:#bdbdbd; color:#fff; }
.tracks-gallery.variant-5 .pack-card__price{ font-weight:800; font-size:1rem; white-space:nowrap; }
.tracks-gallery.variant-5 .pack-card__plus{
  display:inline-grid; place-items:center; width:28px; height:28px;
  border:1px solid #111; border-radius:999px; color:#111; text-decoration:none; font-weight:800;
}

/* 5) Gallery title — consistent across variants */
.tracks-gallery.variant-1 .tracks-gallery__title,
.tracks-gallery.variant-2 .tracks-gallery__title,
.tracks-gallery.variant-3 .tracks-gallery__title,
.tracks-gallery.variant-5 .tracks-gallery__title{
  margin:0 0 28px; font-size:2.25rem; line-height:1.1; font-weight:800; text-transform:uppercase;
}

/* 6) Optional background for packshot variants (commented)
.tracks-gallery.variant-2, .tracks-gallery.variant-5{ background:#e9decc; padding:24px; border-radius:8px; }
*/
/* Variant 1: strakke randen + padding rond de gallery */
.tracks-gallery.variant-1{
  padding: 40px 40px;           /* wil je 20px? -> 20px 20px */
}
.tracks-gallery.variant-1 .tracks-grid{
  gap: 24px;                    /* kaart-ruimte onderling */
}
.tracks-gallery.variant-1 .track-card{
  background: transparent;
  border-radius: 0;             /* rechte hoeken */
  box-shadow: none;             /* geen schaduw */
}
.tracks-gallery.variant-1 .track-card__media img{
  border-radius: 0;             /* rechte hoeken op de cover zelf */
}

/* (mocht er elders een radius/shadow blijven hangen) */
.tracks-gallery.variant-1 .track-card *{
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* ============================================================
   VARIANT 1 — clean layout + exact mockup look
   ============================================================ */

/* ruimte rond de hele gallery */
.tracks-gallery.variant-1{
  padding:40px !important;          /* wil je 20px? zet 20px */
  margin:0 auto 20px !important;
}

/* onderlinge tegelafstand */
.tracks-gallery.variant-1 .tracks-grid{ gap:24px !important; }

/* alle afrondingen/schaduwen weg, ook als een theme ze toevoegt */
.tracks-gallery.variant-1 .track-card,
.tracks-gallery.variant-1 .track-card * ,
.tracks-gallery.variant-1 img,
.tracks-gallery.variant-1 .track-card__media{
  border-radius:0 !important;
  box-shadow:none !important;
  background:none;
}

/* COVER: op witte mat, kleiner en gecentreerd */
.tracks-gallery.variant-1 .track-card__media{
  background:#fff !important;       /* witte mat */
  padding:40px !important;          /* ruimte rond afbeelding */
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.tracks-gallery.variant-1 .track-card__media img{
  max-width:78% !important;         /* maak de cover bewust kleiner */
  height:auto !important;
  object-fit:contain !important;    /* nooit bijsnijden */
}

/* rij: play links + titel rechts */
.tracks-gallery.variant-1 .track-card__content{ padding:16px 0 0 !important; }
.tracks-gallery.variant-1 .track-card__row{
  display:grid !important;
  grid-template-columns:44px 1fr !important;
  align-items:center !important;
  column-gap:12px !important;
}

/* PLAY: zwarte cirkel met wit icoon; disabled als geen preview */
.tracks-gallery.variant-1 .track-card__play{
  position:static !important;
  width:44px; height:44px; border-radius:999px !important;
  background:#000 !important; color:#fff !important; border:none !important;
  display:grid; place-items:center; cursor:pointer;
}
.tracks-gallery.variant-1 .track-card__play svg{ width:18px; height:18px; }
.tracks-gallery.variant-1 .track-card__play svg path{ fill:currentColor; }
.tracks-gallery.variant-1 .track-card__play.is-disabled{
  opacity:.35; pointer-events:none; cursor:default;
}

/* TITELS: uppercase, titel groter/vetter dan album/label */
.tracks-gallery.variant-1 .track-card__title{ margin:0 !important; line-height:1.2; }
.tracks-gallery.variant-1 .track-card__title a{
  text-transform:uppercase; letter-spacing:.3px;
  font-weight:800; font-size:1.05rem; color:#111; text-decoration:none;
}
.tracks-gallery.variant-1 .track-card__subtitle{
  margin-top:2px; text-transform:uppercase; letter-spacing:.3px;
  font-size:.85rem; color:#111; font-weight:600;
}

/* scheidingslijn: ZWART */
.tracks-gallery.variant-1 .track-card__rule{
  border:0 !important; background:transparent !important;
  border-top:1px solid #111 !important;
  margin:14px 0 10px !important;
}

/* onderste regel (label links / formats rechts) */
.tracks-gallery.variant-1 .track-card__meta{
  display:flex; justify-content:space-between; align-items:center;
  font-size:.85rem; color:#111;
}
.tracks-gallery.variant-1 .track-card__label{ opacity:.9; }
.tracks-gallery.variant-1 .track-card__formats{
  text-transform:uppercase; letter-spacing:.3px;
}
.tracks-gallery.variant-1 .track-card__formats a{ color:#111; text-decoration:none; }
.tracks-gallery.variant-1 .track-card__formats a:hover{ text-decoration:underline; }

/* gallery-koptitel in uppercase */
.tracks-gallery.variant-1 .tracks-gallery__title{
  margin:0 0 28px; font-size:2.25rem; line-height:1.1; font-weight:800; text-transform:uppercase;
}

/* === VARIANT 1: override van de basisregels === */

/* witte mat + kleinere cover, nooit bijsnijden */
.tracks-gallery.variant-1 .track-card__media{
  background:#fff !important;
  padding:40px !important;                    /* ruimte rond de cover */
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:0 !important;                 /* rechte hoeken */
  box-shadow:none !important;
}
.tracks-gallery.variant-1 .track-card__media img{
  width:auto !important;
  height:auto !important;
  max-width:78% !important;                   /* cover bewust kleiner */
  object-fit:contain !important;              /* NIET croppen */
  border-radius:0 !important;
}

/* meer ruimte onder de cover vóór titel/knoppen */
.tracks-gallery.variant-1 .track-card__content{
  padding:16px 0 0 !important;
}

/* play-knop + titel in 1 rij, nette bol */
.tracks-gallery.variant-1 .track-card__row{
  display:grid !important;
  grid-template-columns:44px 1fr !important;
  align-items:center !important;
  column-gap:12px !important;
}
.tracks-gallery.variant-1 .track-card__play{
  position:static !important;
  width:44px;height:44px;border-radius:999px !important;
  background:#000 !important;color:#fff !important;border:none !important;
  display:grid;place-items:center;cursor:pointer;
}
.tracks-gallery.variant-1 .track-card__play.is-disabled{opacity:.35;pointer-events:none;}

/* typografie + zwarte scheidingslijn */
.tracks-gallery.variant-1 .track-card__title{margin:0 !important;line-height:1.2;}
.tracks-gallery.variant-1 .track-card__title a{
  text-transform:uppercase;letter-spacing:.3px;font-weight:800;font-size:1.05rem;color:#111;text-decoration:none;
}
.tracks-gallery.variant-1 .track-card__subtitle{
  margin-top:2px;text-transform:uppercase;letter-spacing:.3px;font-size:.85rem;color:#111;font-weight:600;
}
.tracks-gallery.variant-1 .track-card__rule{
  border:0 !important;border-top:1px solid #111 !important;background:transparent !important;margin:14px 0 10px !important;
}
.tracks-gallery.variant-1 .track-card__meta{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:#111;}
.tracks-gallery.variant-1 .track-card__formats{ text-transform:uppercase;letter-spacing:.3px; }
.tracks-gallery.variant-1 .track-card__formats a{color:#111;text-decoration:none;}
.tracks-gallery.variant-1 .track-card__formats a:hover{text-decoration:underline;}