/* ============================================================
   READY-TO-RUN WORKFLOWS, SPLIT (home page, 24 Oct 2026): the
   categories on the left, a line, the workflows on the right (Dom).
     left   the categories as a list under two small labels, By industry
            and By team, then Any custom workflow; the open one magenta
     right  that category's four workflows as a 2 x 2 grid of cards
            (css/packs-cards.css); the packs still slide (js/workflow-packs.js)
   Below 1024px it is the sliding row of categories over the cards again.
   Loaded last.
   ============================================================ */
.wfp-grp, .wfp-sep { display: none; }

@media (min-width: 1024px) {
    .wfs.wfp .wfp-split {
        display: grid; grid-template-columns: 236px minmax(0, 1fr); align-items: start;
        max-width: 1120px; margin: 48px auto 0;
    }
    .wfs.wfp .wfp-split .wfp-tabs {
        display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 4px;
        width: auto; max-width: none; margin: 0; padding: 4px 28px 4px 0; overflow: visible;
        background: none; border: 0; border-radius: 0; box-shadow: none;
        position: sticky; top: 92px;   /* stays in view while the cards scroll by (Dom) */
    }
    /* sticky needs no clipping box around it: clip, not hidden */
    .wfs.wfp { overflow: clip; }
    .wfp-grp {
        display: block; margin: 0 0 4px 12px;
        font-size: .6875rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
    }
    .wfp-grp ~ .wfp-grp { margin-top: 16px; }
    .wfp-sep { display: block; height: 1px; margin: 14px 12px 12px; background: var(--line, #EAE3E1); }
    .wfs.wfp .wfp-split .wfp-tab { justify-content: flex-start; width: 100%; padding: 10px 14px 10px 12px; border-radius: 12px; }
    .wfs.wfp .wfp-split .wfp-stage { max-width: none; margin: 0; padding-left: 32px; border-left: 1px solid var(--line, #EAE3E1); }
    .wfs.wfp .wfp-split .wfp-rows--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* the button under the cards follows the open tab (js/packs-more.js) */
.wfs.wfp .wfp-more-a { display: none; }
.wfs.wfp:not([data-pack]) .wfp-more-a[data-for="estate"],
.wfs.wfp[data-pack="estate"] .wfp-more-a[data-for="estate"],
.wfs.wfp[data-pack="iva"] .wfp-more-a[data-for="iva"],
.wfs.wfp[data-pack="other"] .wfp-more-a[data-for="other"] { display: inline-flex; }
.wfp-more-ico { display: inline-grid; place-items: center; flex: none; width: 18px; height: 18px; margin-right: 2px; }
.wfp-more-ico svg { width: 18px; height: 18px; display: block; }
