#mkdf-back-to-top>span {
	background:#364A56;
	border-color: #364A56;
}

/* =============================================
   BIEREN VAN DE TAP — Grid fix
   Zorgt voor consistente kaartjes met vaste hoogte
============================================= */

/* Grid-container krijgt consistente kolomindeling */
.page-id-XX .wp-block-gallery,    /* vervang XX door je pagina-ID */
.bieren-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 20px;
}

/* Bierfoto's: vaste verhouding, netjes bijgesneden */
.wp-block-image img,
.bieren-tap img {
  aspect-ratio: 3 / 4;
  object-fit: cover;
  width: 100%;
  border-radius: 8px;
  transition: transform 0.2s ease;
}

.wp-block-image a:hover img {
  transform: scale(1.03);
}

/* =============================================
   TYPOGRAFIE — Betere hiërarchie
============================================= */

/* H6 subtitles groter en minder schreeuwerig */
h6 {
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.65;
  font-weight: 500;
  margin-bottom: 1.2rem;
}

/* Iets meer ruimte na H1 op binnenste pagina's */
.page-title h1,
.entry-title {
  margin-bottom: 0.5rem;
  line-height: 1.15;
}

/* =============================================
   FOOTER — Logo beperken
============================================= */

.footer-widget img,
footer img {
  max-width: 140px;
  height: auto;
}

/* =============================================
   HOMEPAGE — Featured biersectie
   Meer ademruimte, minder hoge afbeeldingen
============================================= */

.featured-beers-section img,
.home .wp-block-image img {
  aspect-ratio: 2 / 3;
  max-height: 420px;
  object-fit: cover;
}

/* =============================================
   ALGEMEEN — Kleine verbeteringen
============================================= */

/* Iets meer witruimte tussen secties */
.wp-block-group,
section {
  margin-bottom: 3rem;
}

/* Links in de tekst iets minder fel, strakker */
a {
  text-decoration: none;
  transition: opacity 0.15s ease;
}

a:hover {
  opacity: 0.75;
}

/* Knoppen consistenter */
.wp-block-button__link {
  border-radius: 4px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-size: 0.85rem;
  padding: 12px 28px;
}

/* Agenda (The Events Calendar) - aangepast sept 2026 */
/* Laat de papierachtergrond van het thema doorschijnen */
/* Huisstijlkleur: #374a58 (donkerblauw uit het thema) */
 
 
/* --------------------------------------------------------------------------
   1. Achtergrond
   Het thema zet de papiertextuur per WPBakery-rij, niet op de body.
   Pagina's die door de plugin worden opgebouwd hebben die rijen niet,
   dus passen we de afbeelding hier zelf toe.
   Twee paginatypes: detailpagina (single) en overzicht (archive).
   -------------------------------------------------------------------------- */
 
.single-tribe_events .mkdf-content,
.post-type-archive-tribe_events .mkdf-content {
  background-image: url('https://proeflokaaldesmokkelaar.com/wp-content/uploads/2018/04/h1-background-img-1.jpg');
  background-repeat: repeat;
  background-color: #faf3e8; /* vangnet als de afbeelding niet laadt */
}
 
/* Wrappers transparant, anders dekken ze het papier af */
.single-tribe_events .mkdf-wrapper,
.post-type-archive-tribe_events .mkdf-wrapper {
  background-color: transparent;
}
 
/* Plugin-eigen containers transparant */
.tribe-events,
.tribe-events-single,
.tribe-common {
  background: transparent;
}
 
 
/* --------------------------------------------------------------------------
   2. Ruimte onder de header
   Zonder dit schuift de titel onder de navigatie.
   -------------------------------------------------------------------------- */
 
.single-tribe_events .mkdf-content,
.post-type-archive-tribe_events .mkdf-content {
  padding-top: 100px;
}
 
 
/* --------------------------------------------------------------------------
   3. Knoppen in de huisstijl
   Geldt voor "Toevoegen aan kalender", "Abonneer op kalender"
   en "Zoek naar Evenementen".
   -------------------------------------------------------------------------- */
 
.tribe-events .tribe-common-c-btn,
.tribe-events .tribe-events-c-search__button,
.tribe-events .tribe-events-c-subscribe-dropdown__button {
  background-color: #374a58;
  border-color: #374a58;
}
 
/* Knoptekst en icoon wit.
   !important is hier nodig: de plugin gebruikt een selectorketen van
   tien niveaus die anders wint. */
.tribe-events .tribe-events-c-subscribe-dropdown__button-text,
.tribe-events .tribe-events-c-subscribe-dropdown__button-text:hover {
  color: #fff !important;
}
 
.tribe-events .tribe-events-c-subscribe-dropdown__button .tribe-common-c-svgicon {
  fill: #fff;
}
 
 
/* --------------------------------------------------------------------------
   4. Links
   -------------------------------------------------------------------------- */
 
.tribe-events a,
.tribe-events .tribe-common a {
  color: #374a58;
}
 
 
/* --------------------------------------------------------------------------
   5. Verbergen
   Teruglink: overbodig, er komt een menu-item Agenda.
   Weergavekiezer (Lijst/Maand/Dag): niet zinvol bij weinig evenementen.
   De zoekbalk blijft wel staan.
   -------------------------------------------------------------------------- */
 
.tribe-events-back {
  display: none;
}
 
.tribe-events-c-view-selector {
  display: none;
}
/* Tekst wit op blauwe blokken */
.blok-blauw,
.blok-blauw p,
.blok-blauw h1,
.blok-blauw h2,
.blok-blauw h3,
.blok-blauw li {
  color: #fff !important;
}

.blok-blauw a {
  color: #fff;
  text-decoration: underline;
}

.page-id-4127 .mkdf-container-inner {
  padding-top: 0 !important;
}

.tekst-gecentreerd { text-align: center; }

.kaart-feiten {
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #374a58;
  font-weight: 600;
}
.stap-kaart {
  background: rgba(255, 255, 255, 0.06);
  border-radius: 4px;
  padding: 32px 24px !important;
}

.stap-cijfer {
  margin-bottom: -20px;
}

.blok-blauw .vc_icon_element {
  margin-bottom: 12px;
}
.stap-kaart .vc_column-inner {
  background: rgba(255, 255, 255, 0.06);
  border-radius: 4px;
  padding: 32px 24px !important;
}

.stap-cijfer {
  margin-bottom: 4px;
  opacity: 0.5;
}

.blok-blauw .vc_icon_element {
  margin-bottom: 16px;
}

.blok-blauw {
  padding-top: 40px !important;
  padding-bottom: 80px !important;
}

/* ==========================================================================
   Activiteitenpagina's — hub (page-id 4127) en kindpagina's (parent-pageid 4127)
   Hero-beelden zitten per pagina in de rij zelf (css-attribuut), niet hier.
   Staging-URL in dit blok: alleen de papierafbeelding. Bij livegang omzetten.
   ========================================================================== */

/* ==========================================================================
   Activiteitenpagina's — hub (page-id 4127) en kindpagina's (parent-pageid 4127)
   Hero-beelden zitten per pagina in de rij zelf (css-attribuut), niet hier.
   Staging-URL in dit blok: alleen de papierafbeelding. Bij livegang omzetten.
   ========================================================================== */

/* --- Container: geen ruimte boven/onder op hub en alle kindpagina's --- */
.page-id-4127 .mkdf-container-inner,
.parent-pageid-4127 .mkdf-container-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* --- Rijen sluiten op elkaar aan --- */
.blok-hero,
.blok-papier,
.blok-blauw {
  margin-bottom: 0 !important;
}

/* --- Hero (beeld + overlay komen uit de rij zelf) --- */
.blok-hero .wpb_wrapper {
  text-align: center;
}
.hero-tekst p {
  color: #fff;
  font-size: 18px;
  max-width: 640px;
  margin: 0 auto;
}
.hero-knop {
  margin: 0 8px;
}
@media (max-width: 600px) {
  .hero-knop {
    display: block;
    margin: 0 auto 12px;
    max-width: 280px;
  }
}

/* --- Papierblokken --- */
.blok-papier {
  background-image: url('https://proeflokaaldesmokkelaar.com/wp-content/uploads/2018/04/h1-background-img-1.jpg') !important;
  background-repeat: repeat !important;
  padding-top: 90px !important;
  padding-bottom: 90px !important;
}
.tekst-smal .vc_column-inner {
  max-width: 760px;
}
.tekst-gecentreerd {
  text-align: center;
}

/* --- "Wij regelen / partner regelt" --- */
.wie-regelt-wat .vc_column-inner {
  padding-left: 48px;
  border-left: 2px solid rgba(55, 74, 88, 0.2);
}
.lijst-iconen {
  list-style: none;
  padding-left: 0;
}
.lijst-iconen li {
  padding-left: 32px;
  position: relative;
  margin-bottom: 10px;
}
.lijst-iconen li i {
  position: absolute;
  left: 0;
  top: 4px;
  color: #374a58;
  font-size: 16px;
}

/* --- Kaarten: titel over het beeld --- */
.kaart .kaart-beeld {
  position: relative;
  margin-bottom: 0;
}
.kaart .kaart-beeld img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}
.kaart .kaart-beeld::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(55, 74, 88, 0.85), rgba(55, 74, 88, 0) 55%);
  pointer-events: none;
}
.kaart h3.kaart-titel {
  position: relative;
  z-index: 1;
  margin: -64px 0 16px;
  padding: 0 20px;
  color: #fff !important;
}
.kaart-feiten {
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #374a58;
  font-weight: 600;
}

/* --- "Voor wie"-kaart naast de omschrijving --- */
.voorwie-kaart .vc_column-inner {
  background: rgba(55, 74, 88, 0.06);
  border-left: 3px solid #374a58;
  padding: 32px 28px !important;
}

/* --- Accordeontitels: thema zet hier de handgeschreven h4-font op --- */
.vc_tta.vc_general .vc_tta-panel-title {
  font-family: inherit !important;
  text-transform: none !important;
  letter-spacing: 0;
}
.vc_tta.vc_general .vc_tta-panel-title > a {
  font-weight: 600;
}

/* --- FAQ-blok: knop links, accordeon rechts, alles wit op blauw --- */
.blok-faq .wpb_wrapper {
  text-align: left;
}
.blok-faq .vc_tta.vc_general .vc_tta-panel-title > a {
  color: #fff !important;
  font-size: 17px;
  padding: 16px 0 16px 28px !important;
}
.blok-faq .vc_tta-controls-icon {
  left: 0 !important;
}
.blok-faq .vc_tta.vc_general .vc_tta-panel-heading {
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.blok-faq .vc_tta.vc_tta-style-flat .vc_tta-panel .vc_tta-panel-body,
.blok-faq .vc_tta.vc_tta-style-flat .vc_tta-panel .vc_tta-panel-heading {
  background: transparent !important;
}
.blok-faq .vc_tta-panel-body,
.blok-faq .vc_tta-panel-body * {
  color: #e6ebef !important;
}
.blok-faq .vc_tta-controls-icon::before,
.blok-faq .vc_tta-controls-icon::after {
  border-color: #fff !important;
}
@media (max-width: 767px) {
  .voorwie-kaart .vc_column-inner {
    margin-top: 24px;
  }
}

/* --- "Geschikt voor"-iconen in de Voor wie-kaart --- */
.geschikt-voor {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
}
.geschikt-voor li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #374a58;
  font-weight: 600;
  min-width: 70px;
  text-align: center;
}
.geschikt-voor li i {
  font-size: 22px;
  color: #374a58;
}

/* --- Kaarten komen omhoog bij hover --- */
.kaart .vc_column-inner {
  transition: transform .25s ease, box-shadow .25s ease;
}
.kaart:hover .vc_column-inner {
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(55, 74, 88, 0.15);
}

.tegels-home { margin-bottom: 0 !important; }
.tegel .vc_column-inner {
  min-height: 460px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 48px !important;
}
/* --- Beeldtegels homepage (activiteiten + agenda) --- */
.tegels-home {
  margin-bottom: 0 !important;
}
.tegel .vc_column-inner {
  background-size: cover !important;
  background-position: center !important;
  box-shadow: inset 0 0 0 100vmax rgba(55, 74, 88, 0.6);
  min-height: 460px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 48px !important;
}
.tegel-label {
  font-size: 12px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #c9d3da;
  margin-bottom: 8px;
}
.tegel-tekst p {
  color: #e6ebef;
  max-width: 420px;
}
@media (max-width: 767px) {
  .tegel .vc_column-inner {
    min-height: 340px;
    padding: 32px !important;
  }
}


.tegel .vc_column-inner {
  background-size: cover !important;
  background-position: center !important;
  box-shadow: inset 0 0 0 100vmax rgba(55, 74, 88, 0.6);
  min-height: 460px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 48px !important;
}
/* --- Aanvraagformulier --- */
.formulier-kolom .vc_column-inner {
  max-width: 720px;
  margin: 0 auto;
}
.fluentform .ff-el-form-control {
  background: #fff;
  border: 1px solid rgba(55, 74, 88, 0.25);
  border-radius: 3px;
  padding: 12px 14px;
}
.fluentform .ff-el-form-control:focus {
  border-color: #374a58;
  box-shadow: none;
}
.fluentform .ff-el-input--label label {
  color: #374a58;
  font-weight: 600;
}
.fluentform .ff-btn-submit {
  background: #374a58 !important;
  border: 2px solid #374a58 !important;
  color: #fff !important;
  font-family: inherit;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 16px 30px !important;
  border-radius: 0 !important;
}
.fluentform .ff-btn-submit:hover {
  background: #2a3a45 !important;
}
.page-id-4132 .mkdf-container-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}