/* ================================================================
   Smakelijk Achterhoek — huisstijl stylesheet voor Gebiedonline
   Gebaseerd op de echte broncode (cx_/go_ classes, Bootstrap 5)
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;600;700;800&display=swap');

:root {
  --sa-groen-donker: #154D26;
  --sa-groen-diep:   #103E20;
  --sa-groen-mid:    #3E6B45;
  --sa-groen-licht:  #ACCD63;
  --sa-oker:         #E2A93E;
  --sa-terracotta:   #C2603A;
  --sa-creme:        #FAF6EC;
  --sa-groen-tint:   #EDF3DA;
  --sa-tekst:        #283129;
  --sa-tekst-zacht:  #6E7567;
}

/* --- 1. Basis: lettertype + pagina-achtergrond ------------------- */
body.go_page,
.cx_btn-label,
h1, h2, h3, h4, h5, h6,
.go_row-title,
.go_card-title-wrapper,
.navbar-brand {
  font-family: 'Baloo 2', sans-serif !important;
}

body.go_page {
  background-color: var(--sa-creme) !important;
  color: var(--sa-tekst);
}
/* Fotoslider-rijen (grote carrousel-rijen) hebben geen instelbaar
   achtergrondveld en vallen terug op een vaste witte kleur — dat trekken
   we gelijk met de ingestelde thema-achtergrondkleur (crème) */
.go_row.go_section-slider {
  background-color: var(--sa-creme) !important;
}

.go_row-title {
  font-weight: 800 !important;
  color: var(--sa-tekst);
  letter-spacing: -0.01em;
}

/* --- 2. Topmenu (logo + Over ons / Contact / Iets plaatsen / etc.) */
.go_menu-top-bar {
  background-color: var(--sa-creme) !important;
  border-bottom: 1px solid #E8DFC9;
  padding-top: 28px;
  padding-bottom: 28px;
}
.go_navbar-brand img,
.go_logo img {
  max-height: 108px !important;
  height: auto !important;
  width: auto !important;
}
/* Zoek/filter-balk (bv. op Agenda, Adressen): ronde hoeken, kaart-stijl */
.go_search-wrapper {
  background-color: var(--sa-groen-tint) !important;
  border-radius: 22px !important;
  overflow: hidden;
  border: 1px solid #DCE7C8;
}
.go_top-menu .go_topmenu-button {
  color: var(--sa-tekst) !important;
  font-weight: 600;
  font-size: 14px;   /* tekstgrootte van de items */
  padding: 8px 4px;  /* ruimte rond elk item */
}
.go_top-menu {
  gap: 4px;
}
.go_top-menu .go_topmenu-button i {
  color: var(--sa-groen-donker) !important;
  font-size: 16px;   /* icoongrootte */
}
.go_top-menu .go_topmenu-button:hover {
  color: var(--sa-groen-donker) !important;
}

/* --- 3. Hoofdmenu ------------------------------------------------- */
.go_main-menu-bar,
.go_main-menu-bar .go_main-menu-wrapper,
nav.go_hoofdmenu,
nav.go_hoofdmenu .cx_menu-container {
  background-color: var(--sa-creme) !important;
  background-image: none !important;
}
.go_main-menu-bar {
  border-bottom: 1px solid #E8DFC9;
}
.go_hoofdmenu .nav-link,
.go_hoofdmenu .cx_btn-label {
  font-weight: 700 !important;
  font-size: 16px;
  color: var(--sa-tekst) !important;
}
.go_hoofdmenu .nav-link:hover {
  color: var(--sa-groen-donker) !important;
}
.go_hoofdmenu .nav-link.active:not(.dropdown-toggle),
.go_hoofdmenu .nav-item.active > .nav-link:not(.dropdown-toggle),
nav.go_hoofdmenu .nav-link.active:not(.dropdown-toggle),
html body .go_hoofdmenu.go_hoofdmenu a.nav-link.active.active:not(.dropdown-toggle) {
  color: #ffffff !important;
  background-color: var(--sa-groen-donker) !important;
  border-radius: 999px;
}
html body .go_hoofdmenu.go_hoofdmenu a.nav-link.active.active:not(.dropdown-toggle) span {
  color: #ffffff !important;
}
/* Open dropdownmenu (.show): lichter/omlijnd, zodat het niet identiek oogt
   aan de "huidige pagina"-pil hierboven en er geen twee volle groene
   pillen tegelijk lijken te branden */
.go_hoofdmenu .dropdown-toggle.show,
.go_hoofdmenu .nav-item.show .nav-link,
nav.go_hoofdmenu .dropdown-toggle.show,
html body .go_hoofdmenu.go_hoofdmenu a.dropdown-toggle.show.show {
  color: var(--sa-groen-donker) !important;
  background-color: transparent !important;
  border: 1.5px solid var(--sa-groen-donker);
  border-radius: 999px;
}
html body .go_hoofdmenu.go_hoofdmenu a.dropdown-toggle.show.show span {
  color: var(--sa-groen-donker) !important;
}
/* Dropdown-knop die "actief" is omdat er een kind-pagina open staat: alleen
   de tekst accentueren, geen vaste groene pil (die knop is geen link zelf) */
.go_hoofdmenu .dropdown-toggle.active:not(.show) {
  color: var(--sa-groen-donker) !important;
  background-color: transparent !important;
}
/* Eigen, merk-kleurige focusring in plaats van de standaard blauwe browser-
   focusring (toegankelijkheid blijft behouden, alleen de kleur/stijl wijzigt) */
.go_hoofdmenu .nav-link:focus-visible,
.go_hoofdmenu .dropdown-toggle:focus-visible {
  outline: 2px solid var(--sa-groen-donker) !important;
  outline-offset: 2px;
}
/* Op hover moet de tekst wit blijven zolang de "huidige pagina"-pil groen
   is — anders wordt de tekst onleesbaar (groen op groen) */
.go_hoofdmenu .nav-link.active:not(.dropdown-toggle):hover,
.go_hoofdmenu .nav-item.active > .nav-link:not(.dropdown-toggle):hover,
nav.go_hoofdmenu .nav-link.active:not(.dropdown-toggle):hover {
  color: #ffffff !important;
}
/* Open dropdownmenu blijft op hover ook de omlijnde stijl (niet wit) */
.go_hoofdmenu .dropdown-toggle.show:hover,
.go_hoofdmenu .nav-item.show .nav-link:hover,
nav.go_hoofdmenu .dropdown-toggle.show:hover {
  color: var(--sa-groen-donker) !important;
}
.go_hoofdmenu .dropdown-menu {
  border-radius: 18px;
  border: 1px solid #E8DFC9;
}
/* Huidige pagina binnen het geopende "Meer"-dropdownmenu: donkergroene
   rij met witte tekst (was onleesbaar: donkergroen op donkergroen) */
.go_hoofdmenu .dropdown-item.active,
.go_hoofdmenu .dropdown-item.active:hover,
.go_hoofdmenu .dropdown-item.active:focus {
  background-color: var(--sa-groen-donker) !important;
  color: #ffffff !important;
}
.go_hoofdmenu .dropdown-item:hover {
  background-color: var(--sa-groen-tint);
  color: var(--sa-groen-donker);
}

/* "Word lid"-knop in het hoofdmenu (geel), zodra dit als los menu-item
   op het hoofdniveau staat (bv. link naar /wordlid) */
.go_hoofdmenu .navbar-nav > .nav-item > a.nav-link[href="/wordlid"] {
  background-color: #EBC26B !important;
  color: #283129 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  padding: 8px 18px !important;
}
.go_hoofdmenu .navbar-nav > .nav-item > a.nav-link[href="/wordlid"]:hover {
  background-color: var(--sa-oker) !important;
}
/* Dit menu-item altijd helemaal rechts tonen (vlak voor het vergrootglas),
   ongeacht de volgorde in de menu-instellingen zelf */
.go_hoofdmenu .navbar-nav > .nav-item > a.nav-link[href="/wordlid"] {
  position: absolute !important;
  right: 60px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
}
.go_hoofdmenu .cx_menu-container {
  position: relative !important;
}
/* Bootstrap's "me-auto" op de menulijst zelf duwt het zoekicoon helemaal
   naar de rand — dat overschrijven we zodat ze dicht bij elkaar komen */
nav.go_hoofdmenu ul.navbar-nav.me-auto {
  margin-right: 0 !important;
  margin-inline-end: 0 !important;
}
.go_hoofdmenu .collapse.navbar-collapse {
  justify-content: flex-start !important;
}

/* --- 4. Knoppen (algemeen: word lid, versturen, bewerken, etc.) -- */
.btn.btn-primary,
.go_button {
  font-family: 'Baloo 2', sans-serif !important;
  font-weight: 800 !important;
  background-color: var(--sa-groen-donker) !important;
  border-color: var(--sa-groen-donker) !important;
  border-radius: 999px !important;
  padding: 10px 22px !important;
}
.btn.btn-primary:hover,
.go_button:hover {
  background-color: #0F3A1D !important;
  border-color: #0F3A1D !important;
}
/* Zoekschermen (classmanager/beheer): knoppen als "Zoeken", "Wissen",
   "Bewaar zoekvraag", "Nieuwe ... invoeren" gebruiken alleen .btn
   zonder .go_button — hier ook afronden en in de huisstijl zetten */
.btn.btn-default,
.btn.btn-secondary:not(.go_button):not(.go_button-secondary) {
  font-family: 'Baloo 2', sans-serif !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  padding: 10px 22px !important;
  background-color: #C3D797 !important;
  border-color: #C3D797 !important;
  color: var(--sa-groen-donker) !important;
}
.btn.btn-default:hover,
.btn.btn-secondary:not(.go_button):not(.go_button-secondary):hover {
  background-color: #B3CB7F !important;
  border-color: #B3CB7F !important;
}

/* Uitzondering: kleine beheer-knoppen (potlood/bewerken) — niet
   meenemen in de pil-stijl, anders wordt de bewerk-UI onleesbaar. */
.go_webpage-controls .btn,
a[href*="cmd=open"].btn {
  border-radius: 4px !important;
  padding: 4px 10px !important;
}

/* --- 5. Homepage-blokken (WORD LID / DOE MEE / NIEUWSBRIEF) ------ */
.go_block.cx_card .go_card.go_block-content {
  /* achtergrondkleur bewust NIET forceren: die stel je zelf per blok in */
  border-radius: 28px !important;
  transition: transform .15s ease;
}
.go_block.cx_card .go_card.go_block-content:hover {
  transform: translateY(-2px);
}
.go_block-text p strong {
  font-family: 'Baloo 2', sans-serif;
  font-weight: 800;
  letter-spacing: 0.02em;
}

/* --- 6. Nieuws-/aanbodkaarten ("Het laatste nieuws") ------------- */
.go_card.go_card-with-border {
  border-radius: 22px !important;
  border-color: #EFE7D4 !important;
  background-color: var(--sa-groen-tint) !important;
}
/* Nieuwskaarten ("Het laatste nieuws"): vaste totaalhoogte zodat alle
   kaarten in de rij gelijk zijn, ongeacht het type bericht (aanbod/
   activiteit/bericht hebben van nature andere inhoud/lengte). We laten
   de eigen overlap-opmaak (negative margin-top op de content-wrapper)
   intact en knippen overtollige tekst af i.p.v. de hoogte te forceren
   via flex, wat botst met die overlap. */
/* Deze vaste hoogte/afkap-regels zijn specifiek voor de "Het laatste
   nieuws"-kaarten op de HOMEPAGE (image-top layout, rij #go_row-10030).
   Zonder deze scope raken ze ook de kaarten op andere pagina's, zoals
   de Actueel-lijst (/berichten), die een ander (image-left) layout
   gebruiken — daar zorgde height:430px voor een groot leeg gat. */
#go_row-10030 a.go_card.go_card-with-source {
  height: 430px !important;
  overflow: hidden !important;
  display: block !important;
}
#go_row-10030 a.go_card.go_card-with-source .cx_template-image-wrapper {
  height: 190px !important;
  overflow: hidden !important;
}
#go_row-10030 a.go_card.go_card-with-source .cx_template-image-wrapper img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
/* titel en introtekst afkappen op een vast aantal regels, zodat
   kortere/langere berichten niet meer voor uitschietende kaarten
   zorgen */
#go_row-10030 a.go_card.go_card-with-source .go_card-title-wrapper {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
#go_row-10030 a.go_card.go_card-with-source .go_card-text-intro {
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
/* Gebiedonline zet per berichttype (aanbod/activiteit/bericht) een
   andere margin-top op de content-wrapper (die over de foto overlapt),
   waardoor de categorielabel niet bij elk type op dezelfde hoogte
   begint. Hier op één vaste waarde voor alle typen forceren, met
   verhoogde specificiteit zodat dit zeker boven de eigen regels van
   Gebiedonline uitkomt. */
#go_row-10030 a.go_card.go_card-with-source .cx_template-image-top .cx_template-content-wrapper,
#go_row-10030 a.go_card.go_card-with-source.go_card-activity .cx_template-image-top .cx_template-content-wrapper,
#go_row-10030 a.go_card.go_card-with-source.go_card-service .cx_template-image-top .cx_template-content-wrapper,
#go_row-10030 a.go_card.go_card-with-source.go_card-message .cx_template-image-top .cx_template-content-wrapper {
  margin-top: -2.3rem !important;
  position: relative !important;
}
.go_card .category-wrapper {
  color: var(--sa-oker);
  font-weight: 700;
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.go_card .go_card-title-wrapper {
  font-weight: 700 !important;
  color: var(--sa-tekst);
}
.go_card .go_source-name-wrapper {
  font-weight: 600;
  color: var(--sa-tekst-zacht);
  font-size: 13px;
}
.go_card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}

/* Link "Bekijk al het nieuws" */
.go_link {
  color: var(--sa-groen-donker) !important;
  font-weight: 700;
}
.go_link:hover {
  color: var(--sa-terracotta) !important;
}

/* --- 7. Productgroepen-tegels ("Wat zoek je vandaag?") ----------- */
.go_row.Verkooppunten .go_block.cx_card .go_card {
  border-radius: 20px !important;
  transition: transform .15s ease;
}
.go_row.Verkooppunten .go_block.cx_card .go_card:hover {
  transform: translateY(-2px);
}

/* --- 8. Kaart (Leaflet) — kleine correcties ---------------------- */
.leaflet-popup-content-wrapper {
  border-radius: 18px !important;
  font-family: 'Baloo 2', sans-serif;
}
.go_map-commissaris {
  box-shadow: 0 3px 10px rgba(0,0,0,.25) !important;
}
/* Kaart-embed op de homepage: afgeronde hoeken */
#cxMap,
.leaflet-container {
  border-radius: 20px !important;
  overflow: hidden;
}

/* --- 9. Links algemeen -------------------------------------------- */
.go_container a:not(.btn):not(.go_button):not(.card) {
  color: var(--sa-groen-donker);
}
.go_container a:not(.btn):not(.go_button):not(.card):hover {
  color: var(--sa-terracotta);
}

/* --- 11. Aanbod/zoekpagina (/aanbod) ------------------------------ */
/* "Uitgebreid zoeken" (btn-secondary, niet btn-primary!): witte tekst */
.btn.btn-secondary.go_button {
  background-color: var(--sa-groen-donker) !important;
  border-color: var(--sa-groen-donker) !important;
  color: #ffffff !important;
}
.btn.btn-secondary.go_button:hover {
  background-color: #0F3A1D !important;
  border-color: #0F3A1D !important;
}

/* Bewerken / Kopiëren / Verwijderen (go_button-secondary, andere class!) */
.btn.btn-secondary.go_button-secondary {
  background-color: var(--sa-groen-tint) !important;
  border-color: var(--sa-groen-tint) !important;
  color: var(--sa-groen-donker) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}
.btn.btn-secondary.go_button-secondary:hover {
  background-color: #DCE7C8 !important;
  border-color: #DCE7C8 !important;
}

/* Adreskaarten op het /aanbod-overzicht (rasterweergave) */
a.card.go_card.go_card-no-border {
  background-color: var(--sa-groen-tint) !important;
  border-radius: 22px !important;
  overflow: hidden;
}
a.card.go_card.go_card-no-border .card-body {
  background-color: var(--sa-groen-tint) !important;
}

/* Detailpagina van een adres (/aanbod/{id}/...): hoofdkaart + reacties */
.go_wall-wrapper .card.go_card.go_wall-card {
  background-color: var(--sa-groen-tint) !important;
  border-radius: 22px !important;
  overflow: hidden;
}
/* De donkergroene contactstrook onderin de kaart: ronde hoeken onderaan */
.go_contact-wrapper {
  border-radius: 0 0 22px 22px !important;
  overflow: hidden;
}
#comments.card.go_card.go_comments-wrapper {
  background-color: var(--sa-groen-tint) !important;
  border-radius: 22px !important;
}

/* Contactregel op de detailpagina (e-mail/website/telefoon): niet afbreken */
.go_contact-wrapper .go_card-meta-line {
  white-space: nowrap;
}

/* --- 11b. Vangnet: overige blokken/kaarten (bv. Word lid / Doneer-
   pagina) die geen .cx_card of andere specifieke klasse hebben en
   daardoor de gele Gebiedonline-standaardkleur + scherpe hoeken
   behielden i.p.v. de huisstijl-kaartstijl ------------------------- */
.card.go_card,
.go_block .go_card,
.go_block-content {
  /* achtergrondkleur bewust NIET forceren: die vul je zelf per blok in
     via het CMS — hier alleen vormgeving (hoeken/rand) */
  border-radius: 22px !important;
  border-color: #EFE7D4 !important;
}
/* QR-code afbeeldingen: eigen witte kaart binnen het getinte blok,
   zodat de code goed scanbaar blijft (contrast) */
.go_block img,
.go_card img {
  border-radius: 14px !important;
}
/* Titels binnen deze blokken (bv. "Word lid", "Doneer") volgen dezelfde
   Baloo 2 kop-stijl als de rest van de site */
.go_block-title,
.go_block h1, .go_block h2, .go_block h3,
.go_card-title, .go_card .card-title {
  font-family: 'Baloo 2', sans-serif !important;
  font-weight: 800 !important;
  color: var(--sa-tekst) !important;
}

/* --- 9b. QR-code / lidmaatschap-blok (CSS Class: sa-qr-blok)
   Blok heeft een target-url, is dus zelf klikbaar: geef het ook de
   uitstraling van een klikbare kaart (hover-lift + pointer) --------- */
.sa-qr-blok .go_block-content,
.go_block-content.sa-qr-blok,
.sa-qr-blok.go_block-content,
a.sa-qr-blok,
.sa-qr-blok {
  padding: 32px 32px 36px !important;
  cursor: pointer;
  text-align: center !important;
  transition: transform .15s ease, box-shadow .15s ease;
}
.sa-qr-blok .go_block-content:hover,
.go_block-content.sa-qr-blok:hover,
.sa-qr-blok.go_block-content:hover,
a.sa-qr-blok:hover,
.sa-qr-blok:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(21,77,38,.12);
}
.sa-qr-blok img {
  background: #ffffff !important;
  border-radius: 20px !important;
  padding: 20px !important;
  box-shadow: 0 4px 14px rgba(21,77,38,.10) !important;
  display: inline-block !important;
}
/* tekst onder de QR ook centreren, zodat het geheel als één
   gecentreerde kaart oogt */
.sa-qr-blok .go_block-text,
.sa-qr-blok p {
  text-align: center !important;
}

/* --- 9c. Blokken zonder QR maar wél met een target-url (CSS Class:
   sa-link-blok) — zelfde klikbare kaart-uitstraling, zonder de
   beeld-specifieke styling van sa-qr-blok --------------------------- */
.sa-link-blok .go_block-content,
.go_block-content.sa-link-blok,
.sa-link-blok.go_block-content,
a.sa-link-blok,
.sa-link-blok {
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
}
.sa-link-blok .go_block-content:hover,
.go_block-content.sa-link-blok:hover,
.sa-link-blok.go_block-content:hover,
a.sa-link-blok:hover,
.sa-link-blok:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(21,77,38,.12);
}

/* --- 10. Footer ---------------------------------------------------
   Let op: de footer-classes stonden niet in de aangeleverde bron-HTML
   (die liep af bij het laatste kaart-icoon). Zodra je de footer-HTML
   erbij plakt, vul ik dit blok exact aan. Als voorlopige gok (te
   verifiëren): */
footer,
.go_footer,
.go_footer-web {
  background-color: var(--sa-groen-diep) !important;
  color: #CFE3BE !important;
}
footer a,
.go_footer a,
.go_footer-web a {
  color: #CFE3BE !important;
}
footer a:hover,
.go_footer a:hover,
.go_footer-web a:hover {
  color: var(--sa-groen-licht) !important;
}
/* Regels in de footer-kolommen (Terug naar homepage / Volg ons.../
   Over Slow Food...) staan te ver uit elkaar — compacter maken */
footer li,
.go_footer li,
.go_footer-web li,
footer ul,
.go_footer ul,
.go_footer-web ul {
  margin-bottom: 0 !important;
  line-height: 1.3 !important;
}
footer p,
.go_footer p,
.go_footer-web p,
footer .nav-item,
.go_footer .nav-item,
.go_footer-web .nav-item {
  margin-bottom: 4px !important;
  line-height: 1.3 !important;
}

/* "Blijf op de hoogte!" kop (in go_footer-default-wrapper) heeft nu te
   weinig contrast — naar crème, ongeacht of het een h2/h3/h4/div is */
.go_footer-web h1,
.go_footer-web h2,
.go_footer-web h3,
.go_footer-web h4,
.go_footer-default-wrapper h1,
.go_footer-default-wrapper h2,
.go_footer-default-wrapper h3,
.go_footer-default-wrapper h4 {
  color: #FAF6EC !important;
}
/* Inschrijf-knop: gele/oker pil met donkere tekst, ongeacht of het
   element een button, input of link is */
.go_footer-web button,
.go_footer-web input[type="submit"],
.go_footer-web .btn,
.go_footer-default-wrapper button,
.go_footer-default-wrapper input[type="submit"],
.go_footer-default-wrapper .btn {
  background-color: var(--sa-oker) !important;
  border-color: var(--sa-oker) !important;
  color: var(--sa-groen-diep) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 10px 20px !important;
}
.go_footer-web input[type="email"],
.go_footer-web input[type="text"],
.go_footer-default-wrapper input[type="email"],
.go_footer-default-wrapper input[type="text"] {
  border-radius: 999px !important;
}

/* --- 10b. Nieuwsbrief-blok: kop/tekst/formulier op één regel, in
   plaats van onder elkaar — op basis van de echte classnamen ---- */
.go_footer-newsletter-subscription-wrapper .row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 16px !important;
}
.go_footer-newsletter-subscription-wrapper .col {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 16px !important;
  width: auto !important;
}.go_footer-newsletter-subscription-wrapper h3,
.go_footer-newsletter-subscription-wrapper p {
  white-space: nowrap !important;
  flex: 0 0 auto !important;
}
.go_footer-newsletter-subscription-wrapper h3 {
  display: none !important;
}
.go_footer-newsletter-subscription-wrapper p {
  font-size: 13px !important;
  margin: 0 !important;
  color: #CFE3BE !important;
  align-self: center !important;
}
.go_footer-newsletter-subscription-wrapper form {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}
.go_footer-newsletter-subscription-wrapper .cx_grid-row,
.go_footer-newsletter-subscription-wrapper .cx_btn-toolbar {
  margin: 0 !important;
  width: auto !important;
  display: flex !important;
  align-items: center !important;
  height: 48px !important;
}
.go_footer-newsletter-subscription-wrapper .cx_grid-col {
  padding: 0 !important;
}

/* --- 11. Organisatie-tegels (ledenlijst): gelijke hoogte per rij,
   ongeacht of een organisatie SDG-iconen/foto's toont ------------- */
.cx_grid-row.cx_paragraph-wrapper:has(.go_card-organization) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
}
.cx_grid-row.cx_paragraph-wrapper:has(.go_card-organization) > .cx_grid-col {
  display: flex !important;
}
.cx_grid-col a.go_card.go_card-organization {
  height: 220px !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
a.go_card.go_card-organization,
a.card.go_card.go_card-organization {
  height: 220px !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
/* SDG-iconenrij (varieert sterk in aantal/hoogte per organisatie) —
   verkleinen en op minder rijen tonen i.p.v. verbergen. Dit zijn losse
   <img>-tags zonder eigen class, dus op de src herkennen. Let op: de
   organisatie-tegel gebruikt go_card-organization (niet
   go_card-with-source), dus breed targeten. */
a.go_card img[src*="SDG-icon"],
a.card img[src*="SDG-icon"] {
  width: 32px !important;
  height: 32px !important;
  margin: 0 4px 4px 0 !important;
  display: inline-block !important;
}
/* Harde reset: Bootstrap .row/.col/toolbar-wrappers binnen dit blok
   hebben standaard marges/padding die de uitlijning verstoren */
.go_footer-newsletter-subscription-wrapper .row,
.go_footer-newsletter-subscription-wrapper [class*="col"],
.go_footer-newsletter-subscription-wrapper .cx_fieldlines,
.go_footer-newsletter-subscription-wrapper .cx_fieldline,
.go_footer-newsletter-subscription-wrapper .cx_fieldline-content,
.go_footer-newsletter-subscription-wrapper .cx_widget,
.go_footer-newsletter-subscription-wrapper .btn-toolbar,
.go_footer-newsletter-subscription-wrapper .cx_paragraph-wrapper {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
}
/* De knop-toolbar (#cxs_1193) heeft Bootstrap d-table + w-100 die
   'm laten uitrekken/anders gedragen dan het e-mailveld — expliciet
   defeaten zodat beide even hoog en verticaal gelijk uitlijnen */
.go_footer-newsletter-subscription-wrapper .cx_btn-toolbar.d-table {
  display: flex !important;
  align-items: center !important;
  width: auto !important;
  table-layout: auto !important;
}
/* cx_form-group-lg reserveert normaliter ruimte voor een label boven
   het veld — hier is geen label, dus die ruimte duwt het veld
   onnodig naar beneden t.o.v. de knop */
.go_footer-newsletter-subscription-wrapper .cx_form-group-lg {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.go_footer-newsletter-subscription-wrapper input#E_mail {
  border-radius: 999px !important;
  padding: 0 16px !important;
  width: 220px !important;
  height: 48px !important;
  box-sizing: border-box !important;
  border: none !important;
  vertical-align: middle !important;
  line-height: 48px !important;
  margin-top: 0 !important;
  align-self: center !important;
}
.go_footer-newsletter-subscription-wrapper .btn.btn-primary.cx_btn {
  background-color: var(--sa-oker) !important;
  border-color: var(--sa-oker) !important;
  color: var(--sa-groen-diep) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  white-space: nowrap;
  height: 48px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 22px !important;
  margin: 0 !important;
}

/* Onderste regel (Privacy / Beveiligingsprobleem / Gebiedonline) iets
   kleiner */
.go_footer-default-wrapper a {
  font-size: 12px !important;
}

/* Logo + korte tekst bovenaan het footer-menu (echte, al gehoste
   SA-woordmerk-afbeelding — de transparante witte SF Achterhoek-slak
   staat niet op de Gebiedonline-mediaserver, dus die kan niet via
   CSS content:url() worden ingeladen zonder eerst als webafbeelding
   te zijn geüpload) */
.go_footer-menuwrapper {
  display: flex !important;
  flex-direction: column !important;
  padding-top: 0 !important;
}
.go_footer-menuwrapper .go_container.d-table {
  display: flex !important;
  justify-content: space-between !important;
  width: 100% !important;
}
.go_footer-menuwrapper::before {
  content: "" !important;
  display: block !important;
  order: -2 !important;
  width: 220px !important;
  height: 64px !important;
  background-image: url('https://smakelijkachterhoek.nl/engine/download/blob/gebiedsplatform/99678/2026/29/Community_Achterhoek_600_Wit_Trans_1.png?app=gebiedsplatform&class=11534&id=185&field=99678');
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: contain !important;
  margin: 0 0 8px 79px !important;
}
.go_footer-menuwrapper::after {
  content: "De voedselcommunity voor de Achterhoek, Twente & Liemers. Een initiatief van Slow Food Achterhoek." !important;
  display: block !important;
  order: -1 !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: #CFE3BE !important;
  max-width: 460px !important;
  margin: 0 0 24px 79px !important;
}

/* --- 10c. Social-media icoontjes vóór de tekstlinks (Font Awesome
   is al geladen op de site) — geen los icoon-element in de HTML,
   dus via ::before op de links zelf. Tekst wordt onderdrukt en de
   li's naast elkaar gezet. Kolom-onafhankelijk: werkt in welke
   kolom van het footer-menu de social-links ook staan. */
.go_footer-menuwrapper li:has(> a[href*="instagram.com"]),
.go_footer-menuwrapper li:has(> a[href*="facebook.com"]),
.go_footer-menuwrapper li:has(> a[href*="youtube.com"]),
.go_footer-menuwrapper li:has(> a[href*="linkedin.com"]) {
  display: inline-flex !important;
  margin: 0 8px 0 0 !important;
}
.go_footer-menuwrapper a[href*="instagram.com"],
.go_footer-menuwrapper a[href*="facebook.com"],
.go_footer-menuwrapper a[href*="youtube.com"],
.go_footer-menuwrapper a[href*="linkedin.com"] {
  font-size: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: #1F5630 !important;
}
.go_footer-menuwrapper a[href*="instagram.com"]::before,
.go_footer-menuwrapper a[href*="facebook.com"]::before,
.go_footer-menuwrapper a[href*="youtube.com"]::before,
.go_footer-menuwrapper a[href*="linkedin.com"]::before {
  font-weight: 900;
  font-size: 15px !important;
  margin-right: 0 !important;
  color: #CFE3BE;
}
.go_footer-menuwrapper a[href*="instagram.com"]::before,
.go_footer-menuwrapper a[href*="facebook.com"]::before,
.go_footer-menuwrapper a[href*="youtube.com"]::before {
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Free", FontAwesome !important;
}
.go_footer-menuwrapper a[href*="linkedin.com"]::before {
  font-family: "Font Awesome 6 Brands", FontAwesome !important;
}
.go_footer-menuwrapper a[href*="instagram.com"]::before {
  content: "\f16d";
}
.go_footer-menuwrapper a[href*="facebook.com"]::before {
  content: "\f39e";
}
.go_footer-menuwrapper a[href*="youtube.com"]::before {
  content: "\f167";
}
.go_footer-menuwrapper a[href*="linkedin.com"]::before {
  content: "\f0e1";
}