/* Merk-home /{merk} (publiek): statische component-CSS. */
    .ohero {
        position: relative; min-height: 100svh; color: #fff; overflow: hidden; isolation: isolate;
        background: linear-gradient(160deg, var(--brand-2) 0%, #0a0a0a 95%);
    }
    .oblob {
        position: absolute; border-radius: 50%; filter: blur(85px); z-index: 0;
        animation: oblobFloat 16s var(--sjk-ease-inout, ease-in-out) infinite alternate;
    }
    .oblob-1 { width: 440px; height: 440px; background: var(--brand); opacity: .40; top: -90px; right: -70px; }
    .oblob-2 { width: 380px; height: 380px; background: var(--brand-2); opacity: .30; bottom: -120px; left: -80px; animation-delay: -6s; }
    @keyframes oblobFloat { from { transform: translate3d(0,0,0) scale(1); } to { transform: translate3d(3%,-2%,0) scale(1.08); } }
    .ohero::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
        background-image: var(--sjk-noise); background-size: 180px; opacity: .05; mix-blend-mode: overlay; }
    .ohero > * { position: relative; z-index: 1; }
    .ocard {
        background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16);
        border-radius: 1.25rem; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
        transition: transform .25s var(--sjk-ease-out, ease), box-shadow .25s ease, border-color .25s ease; height: 100%;
    }
    .ocard:hover { transform: translateY(-6px); border-color: rgba(255,255,255,.3); box-shadow: 0 22px 44px -18px rgba(0,0,0,.6); }
    .octa { display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; color: var(--brand); transition: gap .2s ease; }
    .ocard:hover .octa { gap: .7rem; }
    .text-dim { color: rgba(255,255,255,.72); }
    @media (prefers-reduced-motion: reduce) { .oblob { animation: none; } }