/* Catalog icons share consistent optical sizes. */
.role-catalog-icon {
    display: block;
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    background: currentColor;
    -webkit-mask: var(--role-icon) center / contain no-repeat;
    mask: var(--role-icon) center / contain no-repeat;
}
.role-catalog-icon.is-academic-cap { --role-icon: url('/images/icons/heroicons-academic-cap.svg'); }
.role-catalog-icon.is-presentation-chart-line { --role-icon: url('/images/icons/heroicons-presentation-chart-line.svg'); }
.role-catalog-icon.is-user-group { --role-icon: url('/images/icons/heroicons-user-group.svg'); }
.role-catalog-icon.is-chart-bar { --role-icon: url('/images/icons/heroicons-chart-bar.svg'); }
.role-catalog-icon.is-banknotes { --role-icon: url('/images/icons/heroicons-banknotes.svg'); }
.role-catalog-icon.is-arrow-trending-down { --role-icon: url('/images/icons/heroicons-arrow-trending-down.svg'); }
.role-catalog-icon.is-rocket-launch { --role-icon: url('/images/icons/heroicons-rocket-launch.svg'); }
.role-catalog-icon.is-clock { --role-icon: url('/images/icons/heroicons-clock.svg'); }
.role-catalog-icon.is-document-chart-bar { --role-icon: url('/images/icons/heroicons-document-chart-bar.svg'); }
.role-catalog-icon.is-percent-badge { --role-icon: url('/images/icons/heroicons-percent-badge.svg'); }
.role-catalog-icon.is-arrow-trending-up { --role-icon: url('/images/icons/heroicons-arrow-trending-up.svg'); }
.role-catalog-icon.is-bolt { --role-icon: url('/images/icons/heroicons-bolt.svg'); }
.role-catalog-icon.is-shield-check { --role-icon: url('/images/icons/heroicons-shield-check.svg'); }
.role-catalog-icon.is-document-check { --role-icon: url('/images/icons/heroicons-document-check.svg'); }
.role-catalog-icon.is-lock-closed { --role-icon: url('/images/icons/heroicons-lock-closed.svg'); }
.role-catalog-icon.is-check-circle { --role-icon: url('/images/icons/heroicons-check-circle.svg'); }
.role-catalog-icon.is-cpu-chip { --role-icon: url('/images/icons/heroicons-cpu-chip.svg'); }
.role-catalog-icon.is-solid-rocket-launch { --role-icon: url('/images/icons/heroicons-solid-rocket-launch.svg'); }
.role-catalog-icon.is-solid-chart-pie { --role-icon: url('/images/icons/heroicons-solid-chart-pie.svg'); }
.role-catalog-icon.is-solid-users { --role-icon: url('/images/icons/heroicons-solid-users.svg'); }

.case-icon .role-catalog-icon { width: 88px; height: 88px; }
.case-mini { width: 34px; height: 34px; }
.case-mini .role-catalog-icon { width: 100%; height: 100%; }
.case-tag .role-catalog-icon { width: 22px; height: 22px; }
.contact-card-icon .role-catalog-icon { width: 32px; height: 32px; color: #7deeff; }

body:not(.legal-page) .case-check {
    border: 0;
    background: #22ff9c;
    box-shadow: none;
    filter: drop-shadow(0 0 7px rgba(34, 255, 156, .65));
    -webkit-mask: url('/images/icons/heroicons-check-circle.svg') center / contain no-repeat;
    mask: url('/images/icons/heroicons-check-circle.svg') center / contain no-repeat;
}
.case-check::after { content: none; }

/* Shared tracks align every benefit across cards, including wrapped text. */
@supports (grid-template-rows: subgrid) {
    .case-strip { grid-auto-rows: auto; row-gap: 0; }
    .case-strip > .case-card {
        grid-row: span 5;
        grid-template-rows: subgrid;
        margin-bottom: 26px;
    }
    .case-card-head { grid-row: span 1; }
    .case-benefits { grid-row: span 3; grid-template-rows: subgrid; }
    .case-tags { grid-row: span 1; }
}
.case-benefit { grid-template-columns: 28px minmax(0, 1fr) 34px; padding-block: 12px; }
.contact-card.is-bot { border-color: rgba(72, 234, 206, .32); }

@media (max-width: 1100px) {
    .case-icon .role-catalog-icon { width: 76px; height: 76px; }
}
@media (max-width: 780px) {
    body:not(.legal-page) .case-strip {
        display: grid;
        grid-template-columns: none;
        grid-auto-columns: min(82vw, 318px);
        grid-auto-flow: column;
        grid-template-rows: auto repeat(3, auto) auto;
        row-gap: 0;
    }
    body:not(.legal-page) .case-benefit:nth-child(n+3) { display: grid; }
    .case-icon .role-catalog-icon { width: 60px; height: 60px; }
    .case-benefit { grid-template-columns: 28px minmax(0, 1fr); }
}