/* ============================================================================
   INR ARTIKEL-ENGINE - KAARTEN (Model-A shortcode)
   De kaarten van de inspiratiepagina's, exact in de use-cases kaartstijl.
   Scoped onder .inr-art-kaarten, Elementor-proof. Elke kaart draagt
   data-dienst en de kleurvariabelen --c/--csh/--cbg, zodat de bestaande
   filter-logica van de use-cases pagina er meteen op werkt.
   ============================================================================ */

.inr-art-kaarten{
  box-sizing:border-box !important; width:100% !important; max-width:100% !important;
  overflow-x:hidden !important; color:#0E0B1C !important; text-align:left !important;
}
.inr-art-kaarten, .inr-art-kaarten *, .inr-art-kaarten *::before, .inr-art-kaarten *::after{
  box-sizing:border-box !important;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;
}
.inr-art-kaarten a{text-decoration:none !important;color:inherit !important;}

.inr-art-kaarten-grid{display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:24px !important;align-items:stretch !important;}

.inr-art-kaart{--c:#7448FD;position:relative !important;display:flex !important;flex-direction:column !important;height:100% !important;
  background:rgba(255,255,255,.72) !important;-webkit-backdrop-filter:blur(20px) !important;backdrop-filter:blur(20px) !important;
  border:1px solid rgba(14,11,28,.09) !important;border-radius:24px !important;padding:0 !important;overflow:hidden !important;
  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s,border-color .45s,opacity .4s !important;}
.inr-art-kaart::before{content:'' !important;position:absolute !important;top:0 !important;left:0 !important;right:0 !important;height:4px !important;z-index:2 !important;
  background:var(--c) !important;transform:scaleX(0) !important;transform-origin:left !important;transition:transform .5s cubic-bezier(.2,.7,.2,1) !important;}
.inr-art-kaart:hover{transform:translateY(-8px) !important;border-color:var(--c) !important;box-shadow:0 34px 70px -36px var(--csh) !important;}
.inr-art-kaart:hover::before{transform:scaleX(1) !important;}

/* De hoofdfoto bovenaan de kaart (uitgelichte afbeelding). */
.inr-art-kaart-beeld{display:block !important;position:relative !important;width:100% !important;aspect-ratio:16 / 9 !important;overflow:hidden !important;background:var(--cbg) !important;}
.inr-art-kaart-beeld img{width:100% !important;height:100% !important;object-fit:cover !important;display:block !important;transition:transform .6s cubic-bezier(.2,.7,.2,1) !important;}
.inr-art-kaart:hover .inr-art-kaart-beeld img{transform:scale(1.05) !important;}

/* De tekstinhoud van de kaart krijgt zelf de padding (zo kan het beeld edge-to-edge). */
.inr-art-kaart-body{display:flex !important;flex-direction:column !important;flex:1 1 auto !important;padding:32px 30px 30px !important;box-sizing:border-box !important;}
/* Kaart zonder beeld: iets meer lucht bovenaan, zodat hij naast een beeldkaart in balans oogt. */
.inr-art-kaart:not(.heeft-beeld) .inr-art-kaart-body{padding-top:38px !important;}

.inr-art-kaart-tag{display:inline-flex !important;align-items:center !important;gap:8px !important;align-self:flex-start !important;
  font-size:12px !important;font-weight:600 !important;letter-spacing:.04em !important;text-transform:uppercase !important;
  color:var(--c) !important;background:var(--cbg) !important;padding:6px 13px !important;border-radius:99px !important;margin-bottom:20px !important;}
.inr-art-kaart-tag .td{width:7px !important;height:7px !important;border-radius:50% !important;background:var(--c) !important;}

.inr-art-kaart-titel{font-weight:600 !important;font-size:21px !important;letter-spacing:-.018em !important;line-height:1.22 !important;color:#0E0B1C !important;margin-bottom:12px !important;}
.inr-art-kaart-oms{font-size:14.5px !important;font-weight:300 !important;color:#6B6480 !important;line-height:1.62 !important;margin-bottom:26px !important;flex:1 1 auto !important;}

.inr-art-kaart-cta{display:inline-flex !important;align-items:center !important;gap:9px !important;align-self:flex-start !important;
  font-weight:600 !important;font-size:14px !important;color:#fff !important;background:var(--c) !important;
  padding:11px 20px !important;border-radius:99px !important;
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,filter .35s !important;}
.inr-art-kaart-cta svg{width:16px !important;height:16px !important;transition:transform .35s cubic-bezier(.2,.7,.2,1) !important;}
.inr-art-kaart:hover .inr-art-kaart-cta{transform:translateY(-2px) !important;box-shadow:0 14px 30px -14px var(--csh) !important;filter:brightness(1.05) !important;}
.inr-art-kaart:hover .inr-art-kaart-cta svg{transform:translateX(4px) !important;}

/* Uitgefilterd (de maker kan deze klasse toggelen met de bestaande filter-logica). */
.inr-art-kaart.uit{display:none !important;}

.inr-art-kaarten-leeg{font-size:15px !important;font-weight:300 !important;color:#6B6480 !important;}

@media(max-width:980px){.inr-art-kaarten-grid{grid-template-columns:repeat(2,1fr) !important;}}
@media(max-width:600px){.inr-art-kaarten-grid{grid-template-columns:1fr !important;}}
