.lg-models-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: clamp(40px, 5vw, 56px); align-items: start; }
.lg-model { position: relative; background: #fff; border: 1px solid var(--c-border); border-radius: var(--radius-feature); padding: 28px 24px; box-shadow: var(--shadow-card); }
.lg-model.is-featured { box-shadow: var(--shadow-card-hover); }
.lg-model.is-featured::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; padding: 1px; background: var(--gradient-brand); pointer-events: none; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.lg-model-badge { display: inline-block; margin: 0 0 16px; font-family: var(--font-head); font-size: 12px; font-weight: var(--fw-bold); letter-spacing: 0.01em; color: #fff; background: var(--brand-gradient); border-radius: var(--radius-pill); padding: 6px 14px; box-shadow: 0 7px 16px rgba(168,2,142,0.34); }
.lg-meter-legend { display: flex; gap: 16px; margin-bottom: 11px; }
.lg-meter-tag { display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-head); font-size: 13px; font-weight: var(--fw-semibold); color: var(--c-navy); }
.lg-meter-tag.is-muted { opacity: .5; }
.lg-meter-tag b { font-weight: var(--fw-bold); }
.lg-meter-dot { width: 9px; height: 9px; border-radius: 999px; }
.lg-meter-dot.is-human { background: var(--c-navy); }
.lg-meter-dot.is-ai { background: var(--gradient-brand); }
.lg-meter-bar { height: 8px; border-radius: 999px; background: var(--c-border-soft); overflow: hidden; display: flex; }
.lg-meter-fill { height: 100%; transform-origin: left; will-change: transform; }
.lg-meter-fill.is-human { background: var(--c-navy); }
.lg-meter-fill.is-ai { background: var(--gradient-brand); }
.lg-model-h { font-family: var(--font-head); font-weight: var(--fw-semibold); font-size: 19px; color: var(--c-navy); margin: 18px 0 8px; }
.lg-model-desc { font-size: 14.5px; line-height: 1.5; color: var(--c-text-muted); margin: 0 0 16px; }
.lg-model-when { border-top: 1px solid var(--c-border-soft); padding-top: 14px; }
.lg-model-when-label { display: block; font-family: var(--font-head); font-size: 11px; font-weight: var(--fw-bold); letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-text-soft); margin-bottom: 6px; }
.lg-model-when-text { font-size: 14px; line-height: 1.5; color: var(--c-text-muted); }
.lg-models-foot { text-align: center; margin: clamp(28px, 3vw, 36px) auto 0; font-family: var(--font-head); font-weight: var(--fw-medium); font-size: 16px; color: var(--c-text-muted); }

@media (prefers-reduced-motion: no-preference) {
  .au-sec .lg-meter-fill { transition: transform .8s var(--ease); transition-delay: calc(var(--i,0) * .12s + .2s); }
  .au-sec:not(.is-inview) .lg-meter-fill { transform: scaleX(0); }
  .au-sec.is-settled .lg-meter-fill { transition: none; transform: none; }
}

@media (max-width: 880px) {
  .lg-models-grid { grid-template-columns: 1fr; max-width: 460px; margin-left: auto; margin-right: auto; }
}

.lg-models-grid { align-items: stretch; }
.lg-model { display: flex; flex-direction: column; overflow: visible; padding-bottom: 0; }
.lg-model-badge { position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); margin: 0; z-index: 3; white-space: nowrap; font-size: 14px; padding: 9px 22px; box-shadow: 0 8px 18px rgba(168, 2, 142, 0.30); }
.lg-model-checks { list-style: none; margin: 2px 0 20px; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.lg-model-check { display: grid; grid-template-columns: 20px 1fr; gap: 11px; align-items: start; font-family: var(--font-body); font-size: 14px; line-height: 1.45; color: var(--c-text); }
.lg-model-check-ic { width: 20px; height: 20px; flex: none; margin-top: 1px; border-radius: var(--radius-pill); display: grid; place-items: center; color: #fff; background: rgba(57, 181, 74, 0.95); box-shadow: 0 2px 6px rgba(57, 181, 74, 0.30); }
.lg-model-check-ic svg { width: 12px; height: 12px; }
.lg-model-conv { margin: auto -24px 0; padding: 15px 24px; background: var(--gradient-brand); color: #fff; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; border-bottom-left-radius: var(--radius-feature); border-bottom-right-radius: var(--radius-feature); }
.lg-model-conv-label { font-family: var(--font-head); font-size: 13px; font-weight: var(--fw-semibold); letter-spacing: -0.005em; color: rgba(255, 255, 255, 0.9); }
.lg-model-conv-val { font-family: var(--font-head); font-weight: var(--fw-bold); font-size: 18px; letter-spacing: -0.01em; color: #fff; }
.hm-models .lg-model { padding-bottom: 26px; }
.hm-models .lg-model-checks { margin-bottom: 0; }
.hm-model-prop { align-self: flex-start; margin: 2px 0 10px; padding: 5px 12px; border-radius: var(--radius-pill, 999px); background: rgba(20, 20, 100, 0.06); color: var(--c-navy, #141464); font-family: var(--font-head, system-ui), sans-serif; font-size: 12px; font-weight: var(--fw-semibold, 600); letter-spacing: -0.005em; line-height: 1.2; }

/* ===== HARDENING — gradient/kleur tegen theme-resets ===== */
.elementor-widget-bconnect_models .accent {
	background: linear-gradient(90deg, #2301fb 0%, #a80290 100%) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	color: transparent !important;
	display: inline-block;
}
.elementor-widget-bconnect_models .lg-meter-fill.is-ai {
	background: linear-gradient(90deg, #2301fb 0%, #a80290 100%) !important;
}
.elementor-widget-bconnect_models .lg-model-badge {
	background: linear-gradient(90deg, #2301fb 0%, #a80290 100%) !important;
	color: #fff !important;
}

/* Gradient-haarlijn op de niet-uitgelichte modelkaarten: onzichtbaar in rust,
   verschijnt bij hover (bron: .lg-model:not(.is-featured)::after). */
.lg-model:not(.is-featured)::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(135deg, rgba(35,1,251,.38), rgba(168,2,144,.38));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	        mask-composite: exclude;
	opacity: 0;
	transition: opacity .25s var(--ease);
	pointer-events: none;
	z-index: 2;
}
.lg-model:not(.is-featured):hover::after { opacity: 1; }

/* Kaart-hover uit de bron: 4px omhoog + diepere schaduw (ontbrak). */
.lg-model:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
