/* ============================================================
   Gedeelde footer-engine — ÉÉN bron voor ALLE thema's
   (_local_portal-thema's, default en lodewijk). Gescoped op de footer-classes zelf
   (thema-onafhankelijk, geen body[class*="site-theme-"]-prefix nodig). Kleuren
   komen uit de inline --footer-* variabelen in themes/_local_portal/partials/footer.php,
   met --local-* fallbacks voor thema's zonder die tokens.
   ============================================================ */

/* ---------------------------------------------------------------------------
   Schaduw overal uit (verzoek Theo, v014.10.325).
   box-shadow wordt CMS-breed geneutraliseerd voor een vlakke look. Deze regel
   staat hier omdat footer.css het ENIGE stylesheet is dat door álle publieke
   thema's wordt geladen (de _local_portal-portals, het default-thema
   en lodewijk) — zo dekt één regel de hele publieke kant, zonder duplicaat
   per thema. De admin-kant heeft een identieke regel in
   admin-components/98-admin-theme.css.
   Uitzondering: :focus / :focus-visible — daar blijft box-shadow staan zodat de
   toetsenbord-focusringen zichtbaar blijven (toegankelijkheid, CLAUDE.md).
   --------------------------------------------------------------------------- */
/* Uitzondering 2: het julianadorp-portalthema volgt de bindende design-mockups
   (designmap op 21-07-2026 opgeruimd, opvraagbaar via de git-historie), die
   schaduwen expliciet voorschrijven via de --portal-shadow-*-tokens. Daar geldt
   de flat-look-reset dus niet (zie handoff/AFWIJKINGEN.md §5 in die map). */
body:not(.site-theme-julianadorp) *:not(:focus):not(:focus-visible),
body:not(.site-theme-julianadorp) *::before,
body:not(.site-theme-julianadorp) *::after {
    box-shadow: none !important;
}

.site-footer-builder-v14516{
    width:100%;
    padding:0;
    border-top:var(--footer-border-top-width,1px) solid var(--footer-border-top-color,var(--footer-border));
    background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.08)),var(--footer-bg);
    color:var(--footer-text);
    box-shadow:0 -18px 42px rgba(5,13,28,.14);
}
.site-footer-builder-v14516 .site-footer-inner-v10{
    width:100%;
    max-width:none;
    padding:0 clamp(18px,3vw,42px) 18px;
}
/* Volle-breedte grid: fr-tracks (via --footer-cols uit de template) rekken uit om de volle
   breedte te vullen. Het aantal tracks volgt het aantal actieve blokken, dus een afwezig
   blok laat geen lege track/gat achter. Mobiel schakelt terug naar één kolom. */
.site-footer-columns-v20{
    display:grid;
    grid-template-columns:var(--footer-cols,1fr);
    align-items:start;
    gap:clamp(24px,3vw,56px);
    padding:26px 0 20px;
    border-bottom:1px solid var(--footer-border);
}
.site-footer-col-v20{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.site-footer-col-about-v20 .site-footer-logo-v14516{margin-bottom:2px}
/* Merk-rij: logo + titel op één regel, verticaal gecentreerd (titel naast het logo). */
.site-footer-brand-row-v20{display:flex;align-items:center;gap:14px}
.site-footer-brand-row-v20 .site-footer-logo-v14516{flex:0 0 auto;margin-bottom:0}
.site-footer-brand-row-v20 h2{margin:0}
.site-footer-logo-v14516{
    width:var(--footer-logo-size,58px);
    height:var(--footer-logo-size,58px);
    display:grid;
    place-items:center;
    padding:0;
    overflow:hidden;
    border:1px solid var(--footer-logo-frame-color,var(--footer-border));
    border-radius:14px;
    background:rgba(255,255,255,.08);
    box-shadow:none;
}
/* Logo-kader uit (Content → Footer): geen rand, geen vlak en geen thema-hoekjes —
   het logo staat vrij. !important + pseudo-verberging zodat het ook thema's met
   eigen footer-logo-styling (bv. hogerheide's blueprint-hoekjes) verslaat. */
.site-footer-logo-noframe{border:0!important;background:transparent!important}
.site-footer-logo-noframe::before,.site-footer-logo-noframe::after{display:none!important}
.site-footer-logo-v14516 strong{color:var(--footer-link);font-size:1.9rem;font-weight:950;line-height:1}
.site-footer-logo-v14516 img{width:100%;height:100%;object-fit:contain;transform-origin:center;will-change:transform}
.site-footer-builder-v14516 h2{margin:0 0 8px;color:var(--footer-text);font-size:.96rem;font-weight:850}
.site-footer-builder-v14516 p{margin:0;color:color-mix(in srgb,var(--footer-text) 78%,transparent);line-height:1.62}
/* Merk- en nieuwsbrieftekst: begrensde leesbreedte. */
.site-footer-col-about-v20 p,.site-footer-col-newsletter-v20 p{max-width:35ch}
/* Informatie-kolom: op desktop 2 kolommen (column-major, break-inside:avoid). */
.site-footer-legal-items-v20{columns:2;column-gap:28px;font-size:.9rem}
.site-footer-legal-items-v20 a,.site-footer-legal-items-v20 span{display:block;break-inside:avoid;margin-bottom:8px;overflow-wrap:break-word}
.site-footer-legal-v1030 a,.site-footer-legal-v1030 span,.site-footer-bottom-v14516 a{color:var(--footer-link);text-decoration:none;font-weight:760}
.site-footer-legal-v1030 a:hover,.site-footer-bottom-v14516 a:hover{color:var(--footer-link-hover);text-decoration:underline}
/* Bottom-bar: dunne scheiding erboven; copyright links, credit rechts. */
.site-footer-bottom-v14516{
    display:flex!important;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between!important;
    gap:6px 18px;
    margin:16px 0 0!important;
    padding-top:0!important;
    border-top:0!important;
    color:color-mix(in srgb,var(--footer-text) 72%,transparent);
    font-size:.88rem;
}
.site-footer-bottom-v14516 p{flex:0 1 auto;margin:0}
.footer-heart{color:var(--footer-heart,#e5342f)!important;font-size:1.08em;font-weight:950}
/* Nieuwsbrief-kolom: titel, tekst en invoerrij. */
.site-footer-newsletter-v20{display:flex;flex-direction:column;gap:8px}
.site-footer-newsletter-v20 strong{color:var(--footer-text);font-size:.96rem;font-weight:850}
.site-footer-newsletter-row-v20{display:flex;gap:8px;max-width:360px}
.site-footer-newsletter-row-v20 input{flex:1 1 auto;min-width:0;min-height:44px;border-radius:12px}
.site-footer-newsletter-row-v20 button{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:0 16px;
    white-space:nowrap;
    background:#2563eb;
    color:#fff;
    border:1px solid #2563eb;
    border-radius:12px;
    min-height:44px;
    font-weight:800;
}
.site-footer-newsletter-row-v20 button:hover{background:#1e40af;border-color:#1e40af}
/* Volg ons: icoon-knoppen als tap-doel (≥44px). Merkkleuren die soepel in-/uitfaden
   (icoon toont in rust al zijn merktint; bij hover/focus vult de tegel met de merkkleur
   + een zachte gloed en tilt hij licht op). --brand komt per netwerk hieronder. */
.site-footer-social-v20{display:flex;flex-wrap:wrap;gap:10px}
.site-footer-social-v20 a{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:12px;
    border:1px solid color-mix(in srgb,var(--footer-border) 80%,white 20%);
    background:rgba(255,255,255,.08);
    color:var(--brand,var(--footer-link));
    font-size:1.15rem;
    text-decoration:none;
    transition:background .28s ease,border-color .28s ease,color .28s ease,transform .28s ease,box-shadow .28s ease;
}
.site-footer-social-v20 a:hover,.site-footer-social-v20 a:focus-visible{
    color:#fff;
    border-color:var(--brand,#2563eb);
    background:var(--brand-bg,var(--brand,#2563eb));
    transform:translateY(-3px);
    box-shadow:0 10px 22px var(--brand-glow,rgba(37,99,235,.45));
}
.site-footer-social-facebook{--brand:#1877f2;--brand-glow:rgba(24,119,242,.45)}
.site-footer-social-instagram{--brand:#dc2743;--brand-bg:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);--brand-glow:rgba(220,39,67,.45)}
.site-footer-social-youtube{--brand:#ff0000;--brand-glow:rgba(255,0,0,.4)}
.site-footer-social-whatsapp{--brand:#25d366;--brand-glow:rgba(37,211,102,.45)}
/* Merktint moet winnen van de generieke footer-link-kleur (sommige thema's zetten die
   met !important op elke footer-anchor); vandaar deze gerichte, hoger-specifieke override. */
.site-footer-builder-v14516 .site-footer-social-v20 a{color:var(--brand,var(--footer-link))!important}
.site-footer-builder-v14516 .site-footer-social-v20 a:hover,.site-footer-builder-v14516 .site-footer-social-v20 a:focus-visible{color:#fff!important}
@media(prefers-reduced-motion:reduce){.site-footer-social-v20 a{transition:none}.site-footer-social-v20 a:hover,.site-footer-social-v20 a:focus-visible{transform:none}}
/* Contact-links. */
.site-footer-contact-v20{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.site-footer-contact-v20 a{display:inline-flex;align-items:center;gap:8px;min-height:32px;color:var(--footer-link);text-decoration:none;font-weight:700;font-size:.9rem}
.site-footer-contact-v20 a:hover{color:var(--footer-link-hover)}
/* "Volg ons"/"Informatie"-label. */
.site-footer-connect-label-v20{display:block;font-size:.75rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:var(--footer-link);margin-bottom:2px;opacity:.9}
/* Uitlijning (footer-scoped zodat 't ook zonder default/theme.css werkt). */
.site-footer-builder-v14516 .footer-align-left{text-align:left}
.site-footer-builder-v14516 .footer-align-center{text-align:center}
.site-footer-builder-v14516 .footer-align-right{text-align:right}
/* Mobiel: één kolom, pills — goedgekeurde layout, ongewijzigd. */
/* Tablet: in het gedrang tussen de mobiele één-kolom (<=700px) en desktop passen de
   juridische links niet meer in twee smalle subkolommen. Een lang woord als
   "Gebruiksvoorwaarden" liep daardoor buiten de rechterrand (horizontale scroll op 768px).
   Eén kolom houdt ze binnen de footer. */
@media(max-width:860px){
    .site-footer-legal-items-v20{columns:1}
}
@media(max-width:700px){
    .site-footer-columns-v20{display:flex;flex-direction:column;gap:22px;padding:20px 0 16px}
    .site-footer-col-v20{width:100%}
    .site-footer-col-about-v20 p,.site-footer-col-newsletter-v20 p{max-width:none}
    .site-footer-newsletter-row-v20{flex-direction:column;max-width:none}
    .site-footer-newsletter-row-v20 input,.site-footer-newsletter-row-v20 button{width:100%}
    .site-footer-legal-items-v20{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px}
    .site-footer-legal-items-v20 a,.site-footer-legal-items-v20 span{
        display:inline-flex;
        align-items:center;
        min-height:44px;
        margin-bottom:0;
        padding:0 15px;
        border-radius:999px;
        border:1px solid color-mix(in srgb,var(--footer-border) 82%,white 18%);
        background:rgba(255,255,255,.06);
    }
    .site-footer-contact-v20 a{min-height:44px}
    .site-footer-bottom-v14516{flex-direction:column;align-items:flex-start;justify-content:flex-start!important;gap:4px;text-align:left;font-size:.82rem}
    .site-footer-bottom-v14516 p{width:100%}
    .site-footer-builder-v14516 .footer-align-right{text-align:left}
}