
        .mlp-bento-grid {
          display: grid;
          grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
          gap: clamp(16px, 2vw, 24px);
          grid-auto-flow: dense;
          width: 100%;
        }
        .mlp-bento-cell {
          display: flex;
          min-width: 0;
        }
        .mlp-bento-cell--featured { grid-column: span 2; }
        @media (max-width: 720px) {
          .mlp-bento-cell--featured { grid-column: span 1; }
          /* Mobile bento card adjustments — no hover means the
             workflow preview must render inline, the subhead
             can't sit clamped to 3 lines when the column is
             this narrow, and the card height should grow with
             content instead of forcing a 320 px floor. */
          .mlp-bento-card {
            min-height: 0 !important;
          }
          .mlp-bento-subhead {
            -webkit-line-clamp: 6 !important;
          }
          /* Promote the hover-reveal layer to a regular inline
             section on mobile — strip the absolute positioning
             and glass surface so it just reads as part of the
             card body. The desktop hover effect stays untouched
             via the per-card style block below. */
          .mlp-bento-reveal {
            position: static !important;
            transform: none !important;
            opacity: 1 !important;
            pointer-events: auto !important;
            background: transparent !important;
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
            box-shadow: none !important;
            padding: 14px 0 0 !important;
            margin-top: 14px;
            border-top: 1px dashed var(--mel-border-subtle) !important;
          }
          /* The "Open use case →" footer no longer needs to be
             below the absolute reveal layer — push it BELOW the
             inline reveal section so the tap target stays at
             the bottom of the visible card body. */
          .mlp-bento-card { padding-bottom: clamp(20px, 4vw, 28px) !important; }
        }
        /* Hover-reveal surface, matched to the card per theme. */
        html:not(.dark) .mel-uc-reveal {
          background: rgba(255,255,255,0.96);
          border-top: 1px solid rgba(15,23,42,0.07);
          box-shadow: 0 -12px 24px -16px rgba(15,23,42,0.18);
        }
        html.dark .mel-uc-reveal {
          background: rgba(14,18,28,0.94);
          border-top: 1px solid rgba(255,255,255,0.08);
          box-shadow: 0 -12px 24px -14px rgba(0,0,0,0.55);
        }
        .mlp-bento-card:hover .mlp-bento-reveal,
        .mlp-bento-card:focus-visible .mlp-bento-reveal {
          transform: translateY(0%) !important;
          opacity: 1 !important;
        }
        .mlp-bento-card:hover .mlp-bento-arrow { transform: translateX(4px); }
        @media (prefers-reduced-motion: reduce) {
          .mlp-bento-reveal, .mlp-bento-arrow { transition: none !important; }
        }
      