/**
 * DWK Single Wijn – BASE + OVERRIDES (standalone)
 * Alleen voor single wijn: herstelt layout + knop.
 * Marker: DWK_SINGLE_WIJN_BASE_v1
 */

/* ---------
   0) Basis container
--------- */
.single-wijn-page .entry-content-wrap,
body.single-wijn .entry-content-wrap{
  overflow-x: hidden;
}

.single-wijn-page .dwk-section,
body.single-wijn .dwk-section{
  max-width: 1200px;
  margin: 0 auto;
  padding: 26px 22px;
}

/* ---------
   1) Cards / typografie (licht, “Kadence-achtig”)
--------- */
.single-wijn-page .dwk-card,
body.single-wijn .dwk-card{
  background: #fbf8f2;
  border: 1px solid #e6dfd2;
  border-radius: 22px;
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

.single-wijn-page .dwk-card--soft,
body.single-wijn .dwk-card--soft{
  background: #fbf8f2;
}

.single-wijn-page .dwk-h2,
body.single-wijn .dwk-h2{
  font-size: 26px;
  margin: 0 0 14px;
}

.single-wijn-page .dwk-h3,
body.single-wijn .dwk-h3{
  font-size: 18px;
  margin: 0 0 10px;
}

.single-wijn-page .dwk-note,
body.single-wijn .dwk-note{
  opacity: .75;
  font-size: 13px;
}

/* Veiligheid: images nooit “explode” */
.single-wijn-page img,
body.single-wijn img{
  max-width: 100%;
  height: auto;
}

/* ---------
   2) HERO (topbar) – herstel layout + logo sizing + knop stijl
--------- */
.single-wijn-page .dwk-topbar,
body.single-wijn .dwk-topbar{
  max-width: 1200px;
  margin: 22px auto 26px;
  padding: 26px 26px;
  border-radius: 22px;
  background: radial-gradient(120% 140% at 10% 0%, #2a2a2a 0%, #0d0d0d 55%, #000 100%);
  color: #fff;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

.single-wijn-page .dwk-topbar__inner,
body.single-wijn .dwk-topbar__inner{
  display: grid;
  grid-template-columns: 240px 1fr auto;
  gap: 18px;
  align-items: center;
}

.single-wijn-page .dwk-topbar__brand,
body.single-wijn .dwk-topbar__brand{
  display: grid;
  gap: 8px;
  align-content: start;
}

/* logo niet mega */
.single-wijn-page .dwk-topbar__logo,
body.single-wijn .dwk-topbar__logo{
  width: 62px;
  max-width: 62px;
  height: auto;
  display: block;
}

/* Titel gecentreerd en netjes */
.single-wijn-page .dwk-topbar__title,
body.single-wijn .dwk-topbar__title{
  margin: 0;
  text-align: center;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.05;
  font-weight: 700;
}

/* Subtitle onderaan (als aanwezig) */
.single-wijn-page .dwk-topbar__bottom,
body.single-wijn .dwk-topbar__bottom{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  margin-top: 14px;
  align-items: center;
}

.single-wijn-page .dwk-topbar__sub p,
body.single-wijn .dwk-topbar__sub p{
  margin: 0;
  opacity: .9;
}

/* Knop in hero: weer “normaal” */
.single-wijn-page .dwk-topbar__actions .dwk-btn,
body.single-wijn .dwk-topbar__actions .dwk-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.06);
  color: #fff !important;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1;
  text-decoration: none !important;
  box-shadow: none;
}

.single-wijn-page .dwk-topbar__actions .dwk-btn:hover,
body.single-wijn .dwk-topbar__actions .dwk-btn:hover{
  border-color: rgba(255,255,255,.6);
  background: rgba(255,255,255,.10);
}

/* ---------
   3) DETAILS – terug naar 2 kolommen (links foto, rechts details/score)
--------- */
.single-wijn-page .dwk-detailsgrid,
body.single-wijn .dwk-detailsgrid{
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 26px;
  align-items: start;
}

/* Links (foto kaart) */
.single-wijn-page .dwk-detailsmedia,
body.single-wijn .dwk-detailsmedia{
  padding: 18px;
}

.single-wijn-page .dwk-detailsmedia__img,
body.single-wijn .dwk-detailsmedia__img{
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  padding: 14px;
}

.single-wijn-page .dwk-winephoto,
body.single-wijn .dwk-winephoto{
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* Wijnhuis-blok onder foto */
.single-wijn-page .dwk-detailsmedia__origin,
body.single-wijn .dwk-detailsmedia__origin{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(0,0,0,.08);
}

/* Rechts (details+score kaart) */
.single-wijn-page .dwk-detailsdata,
body.single-wijn .dwk-detailsdata{
  padding: 18px 18px 10px;
}

.single-wijn-page .dwk-detailsdata__cols,
body.single-wijn .dwk-detailsdata__cols{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px;
}

/* Details key/value */
.single-wijn-page .dwk-kv > div,
body.single-wijn .dwk-kv > div{
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  padding: 6px 0;
}

.single-wijn-page .dwk-k,
body.single-wijn .dwk-k{
  opacity: .75;
}

/* Wijnhuis knop in details (als jij die class gebruikt) */
.single-wijn-page .dwk-wijnhuis-btn,
body.single-wijn .dwk-wijnhuis-btn{
  border: 1px solid rgba(0,0,0,.15);
  background: #fff;
  color: #111 !important;
  border-radius: 12px;
  padding: 10px 14px;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  text-decoration: none !important;
}

.single-wijn-page .dwk-wijnhuis-btn:hover,
body.single-wijn .dwk-wijnhuis-btn:hover{
  border-color: rgba(0,0,0,.30);
}

/* ---------
   4) Responsive
--------- */
@media (max-width: 980px){
  .single-wijn-page .dwk-topbar__inner,
  body.single-wijn .dwk-topbar__inner{
    grid-template-columns: 1fr;
    text-align: left;
  }

  .single-wijn-page .dwk-topbar__title,
  body.single-wijn .dwk-topbar__title{
    text-align: left;
  }

  .single-wijn-page .dwk-topbar__bottom,
  body.single-wijn .dwk-topbar__bottom{
    grid-template-columns: 1fr;
  }

  .single-wijn-page .dwk-detailsgrid,
  body.single-wijn .dwk-detailsgrid{
    grid-template-columns: 1fr;
  }

  .single-wijn-page .dwk-detailsdata__cols,
  body.single-wijn .dwk-detailsdata__cols{
    grid-template-columns: 1fr;
  }
}
/* === FIX v2: DETAILS weer 2 kolommen zoals vroeger === */
.single-wijn-page .dwk-detailsgrid{
  display: grid !important;
  grid-template-columns: 320px 1fr !important;
  gap: 26px !important;
  align-items: start !important;
}

.single-wijn-page .dwk-detailsdata__cols{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 26px !important;
}

/* Mobile */
@media (max-width: 980px){
  .single-wijn-page .dwk-detailsgrid{ grid-template-columns: 1fr !important; }
  .single-wijn-page .dwk-detailsdata__cols{ grid-template-columns: 1fr !important; }
}
/* === FIX v3: DETAILS grid force (alleen single-wijn) === */
.single-wijn-page section#details .dwk-detailsgrid{
  display: grid !important;
  grid-template-columns: 320px minmax(0, 1fr) !important;
  gap: 26px !important;
  align-items: start !important;
}

/* Zorg dat grid children zich normaal gedragen (soms staat er flex/width:100%) */
.single-wijn-page section#details .dwk-detailsgrid > .dwk-detailsmedia,
.single-wijn-page section#details .dwk-detailsgrid > .dwk-detailsdata{
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  float: none !important;
  clear: none !important;
}

/* Rechterkaart weer 2 kolommen (Details | Score) */
.single-wijn-page section#details .dwk-detailsdata__cols{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 26px !important;
}

/* Mobile stack */
@media (max-width: 980px){
  .single-wijn-page section#details .dwk-detailsgrid{
    grid-template-columns: 1fr !important;
  }
  .single-wijn-page section#details .dwk-detailsdata__cols{
    grid-template-columns: 1fr !important;
  }
}
/* Details: foto links, details rechts */
.single-wijn-page .dwk-detailsgrid{
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 24px;
  align-items: start;
}

.single-wijn-page .dwk-detailsmedia{
  min-width: 0;
}

.single-wijn-page .dwk-detailsdata{
  min-width: 0;
}

/* Mobiel: onder elkaar */
@media (max-width: 860px){
  .single-wijn-page .dwk-detailsgrid{
    grid-template-columns: 1fr;
  }
}
/* ===============================
   LAYOUT BASIS – SINGLE WIJN
   =============================== */

.single-wijn-page .dwk-section{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}
.single-wijn-page .dwk-detailsgrid{
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 32px;
  align-items: start;
  margin-bottom: 60px;
}

@media (max-width: 960px){
  .single-wijn-page .dwk-detailsgrid{
    grid-template-columns: 1fr;
  }
}
.single-wijn-page .dwk-card{
  border-radius: 18px;
  padding: 24px;
}

.single-wijn-page .dwk-section{
  margin-bottom: 40px;
}

.single-wijn-page h2,
.single-wijn-page h3{
  margin-bottom: 16px;
}
cat >> /var/www/dewijnkaart/wp-content/themes/kadence-child/assets/css/dwk-single-wijn.css <<'CSS'

/* =========================================================
   LAYOUT FIXES (single wijn)
   - Alleen details bovenaan 2 kolommen
   - Proefnotitie: Uiterlijk links, Geur rechts
   ========================================================= */

/* Houd alle secties netjes gecentreerd op dezelfde breedte */
.single-wijn-page .dwk-section{
  width: min(1100px, calc(100% - 40px));
  margin-left: auto;
  margin-right: auto;
}

/* DETAILS: foto links + details rechts (bestaat al, maar borgen we) */
.single-wijn-page #details .dwk-detailsgrid{
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 22px;
  align-items: start;
}

/* Proefnotitie: Uiterlijk + Geur naast elkaar */
.single-wijn-page #proefnotitie .dwk-grid-2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: start;
}

/* Mobiel: alles onder elkaar */
@media (max-width: 900px){
  .single-wijn-page #details .dwk-detailsgrid{
    grid-template-columns: 1fr;
  }
  .single-wijn-page #proefnotitie .dwk-grid-2{
    grid-template-columns: 1fr;
  }
}

/* Veilig: cards mogen niet “uitrekken” door vreemde regels */
.single-wijn-page .dwk-card{
  max-width: 100%;
}

CSS

/* Proefnotitie: 2 kolommen even hoog */
.single-wijn-page #proefnotitie .dwk-grid-2{
  align-items: stretch;
}
.single-wijn-page #proefnotitie .dwk-grid-2 > .dwk-card{
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Optioneel: houdt de inhoud mooi bovenaan */
.single-wijn-page #proefnotitie .dwk-grid-2 > .dwk-card > *{
  flex: 0 0 auto;
}


/* Smaak + Conclusie: 2 kolommen even hoog */
.single-wijn-page #smaak-conclusie .dwk-grid-2{
  align-items: stretch;
}
.single-wijn-page #smaak-conclusie .dwk-grid-2 > .dwk-card{
  height: 100%;
  display: flex;
  flex-direction: column;
}


/* ===============================
   Smaak + Conclusie = 2 kolommen
   =============================== */

.single-wijn-page #smaak-conclusie .dwk-grid-2{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
}

.single-wijn-page #smaak-conclusie .dwk-grid-2 > .dwk-card{
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Responsive: onder 900px weer 1 kolom */
@media (max-width: 900px){
  .single-wijn-page #smaak-conclusie .dwk-grid-2{
    grid-template-columns: 1fr;
  }
}


/* ===============================
   DETAILS: linker + rechter even hoog
   =============================== */

.single-wijn-page #details .dwk-detailsgrid{
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 32px;
  align-items: stretch; /* BELANGRIJK */
}

.single-wijn-page #details .dwk-detailsgrid > .dwk-card{
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Responsive */
@media (max-width: 1024px){
  .single-wijn-page #details .dwk-detailsgrid{
    grid-template-columns: 1fr;
  }
}


/* =================================
   WSET RADAR – meer ruimte
   ================================= */

.single-wijn-page #proefnotitie .dwk-radarcard{
  padding: 40px 48px;
  margin-top: 40px;
}

.single-wijn-page #proefnotitie .dwk-radargrid{
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  align-items: center;
  gap: 32px;
}

.single-wijn-page #proefnotitie .dwk-radar{
  width: 100%;
  max-width: 680px;
}

.single-wijn-page #proefnotitie canvas{
  width: 100% !important;
  height: auto !important;
  max-height: 480px;
}

/* Extra ruimte onder uitlegtekst */
.single-wijn-page #proefnotitie .dwk-note{
  margin-top: 24px;
}

/* =================================
   SPACING tussen Proefnotitie grid en Radar
   ================================= */

.single-wijn-page #proefnotitie .dwk-grid-2{
  margin-bottom: 80px;
}

/* Extra zekerheid */
.single-wijn-page #proefnotitie .dwk-radarcard{
  margin-top: 70px;
}
/* =================================
   Extra ruimte boven PROEFNOTITIE AI
   ================================= */

.single-wijn-page #smaak-conclusie{
  margin-bottom: 10px;
}

/* Extra zekerheid */
.single-wijn-page #proefnotitie-ai{
  margin-top: 1O
0px;
}
/* ======================================
   WSET Radar – 2 kolommen layout
   ====================================== */

.single-wijn-page .dwk-radargrid{
  display: flex;
  gap: 60px;
  align-items: center;
  margin-top: 30px;
}

.single-wijn-page .dwk-radartext{
  flex: 1;
  font-size: 15px;
  line-height: 1.6;
  color: #444;
}

.single-wijn-page .dwk-radar{
  flex: 1;
  display: flex;
  justify-content: center;
}

.single-wijn-page .dwk-radar canvas{
  max-width: 420px;
  height: auto;
}

/* Responsive */
@media (max-width: 900px){
  .single-wijn-page .dwk-radargrid{
    flex-direction: column;
    gap: 25px;
  }
}
/* ===============================
   WSET Radar – compact maken
   =============================== */

.single-wijn-page .dwk-radarcard{
  padding: 28px 32px;
}

.single-wijn-page .dwk-radar{
  margin-top: 10px;
}

.single-wijn-page .dwk-radar canvas{
  max-width: 360px;
  height: auto;
}
/* ===============================
   Forceer 2-koloms layout radar
   =============================== */

.single-wijn-page .dwk-radarcard{
  display: flex;
  flex-direction: column;
}

.single-wijn-page .dwk-radarcard > p{
  max-width: 600px;
  margin-bottom: 25px;
  align-self: center;
}

.single-wijn-page .dwk-radarcard canvas{
  align-self: center;
}
/* ===================================
   WSET Radar – tekst links / radar rechts
   =================================== */

.single-wijn-page .dwk-radargrid{
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 40px;
  align-items: center;
  margin-top: 20px;
}

.single-wijn-page .dwk-radartext{
  font-size: 15px;
  line-height: 1.6;
  color: #444;
}

.single-wijn-page .dwk-radar{
  display: flex;
  justify-content: center;
}

.single-wijn-page .dwk-radar canvas{
  max-width: 100%;
  height: auto;
}
/* ===================================
   WSET Radar: 2 kolommen (tekst links, radar rechts)
   =================================== */

.single-wijn-page .dwk-radarcard .dwk-radarrow{
  display: grid !important;
  grid-template-columns: 1fr 420px !important;
  gap: 32px !important;
  align-items: center !important;
  margin-top: 18px !important;
}

/* Linkerkolom: uitleg */
.single-wijn-page .dwk-radarcard .dwk-radarlegend{
  margin: 0 !important;
  padding-left: 0 !important;
  list-style: none !important;
  font-size: 15px;
  line-height: 1.7;
  color: #2b2b2b;
}

.single-wijn-page .dwk-radarcard .dwk-radarlegend li{
  margin: 0 0 8px 0 !important;
}

.single-wijn-page .dwk-radarcard .dwk-radarlegend strong{
  display: inline-block;
  min-width: 110px; /* zorgt dat alles netjes uitlijnt */
}

/* Rechterkolom: canvas */
.single-wijn-page .dwk-radarcard .dwk-radarrow__chart{
  display: flex !important;
  justify-content: center !important;
}

.single-wijn-page .dwk-radarcard canvas{
  max-width: 100% !important;
  height: auto !important;
}

/* Responsive: onder 900px stapelen */
@media (max-width: 900px){
  .single-wijn-page .dwk-radarcard .dwk-radarrow{
    grid-template-columns: 1fr !important;
  }
  .single-wijn-page .dwk-radarcard .dwk-radarrow__chart{
    justify-content: flex-start !important;
  }
}
/* ===================================
   WSET Radar – compacter maken
   =================================== */

.single-wijn-page .dwk-radarcard{
  padding: 24px 28px !important;   /* was ruimer */
}

.single-wijn-page .dwk-radarcard .dwk-h3{
  margin-bottom: 12px !important;  /* minder ruimte onder titel */
}

.single-wijn-page .dwk-radarcard .dwk-radarrow{
  margin-top: 10px !important;     /* minder ruimte boven grid */
  gap: 24px !important;            /* iets compacter tussen kolommen */
  align-items: center !important;  /* mooi verticaal gecentreerd */
}

/* Tekst iets compacter */
.single-wijn-page .dwk-radarlegend{
  font-size: 14px;
  line-height: 1.55;
}

.single-wijn-page .dwk-radarlegend li{
  margin-bottom: 6px !important;
}

/* Radar iets kleiner */
.single-wijn-page .dwk-radarcard canvas{
  max-width: 360px !important;   /* kleiner dan 420 */
}
/*==================================
  Alle Kaarten visueel gelijk trekken
  ==================================*/

.single-wijn-page .dwk-card{
  background: #f3efe6 !important;  /* zelfde warme tint*/
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 18px !important;
  padding: 28px 32px !important;
  box- shaduw: 0 6px 18px rgba(0,0,0,.06) !important;
}

/* Titels in kaarten */
.single-wijn-page .dwk-card h3{
 margin-bottom: 16px;
}
/* Vertacle spacing tussen kaarten */
.single-wijn-page .dwk-section .dwk-card{
 margin-bottom: 24px;
}
/* =====================================
   Uniforme card styling (alle blokken)
   ===================================== */

.single-wijn-page .dwk-card{
  background: #f4f1e9;
  border: 1px solid rgba(120,95,60,.15);
  border-radius: 20px;
  padding: 32px 36px;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
}

/* Consistente titel spacing */
.single-wijn-page .dwk-card h3{
  margin-bottom: 18px;
}

/* Verticale spacing tussen blokken */
.single-wijn-page .dwk-card + .dwk-card{
  margin-top: 0px;
}

/* Binnenruimte bij key/value rijen */
.single-wijn-page .dwk-kv > div{
  margin-bottom: 12px;
}