.card--layout--wrapper{

    /* --card-box-shadow: 0px 12px 18px 24px rgb(34 56 101 / 4%); */
    --card-box-shadow: 0px 5px 18px 5px rgba(34, 56, 101, 0.04);


    --card-border-radius: 4px;
    --card-margin: 1.45rem 0;
    --card-background: #fff;

    --card-description-color: var(--paletteColor4);

    --card-lineHeight: 1.4;
}

.card--layout {
    box-shadow: 0px 1px 18px -3px rgb(35 42 57 / 15%);
    border-radius: var(--card-border-radius);
    overflow: hidden;
    display: flex;
    align-content: flex-start;
    width: 100%;
    position: relative;
    margin: var(--card-margin);
    background-color: var(--card-background);
}

/* Direction */
.card--layout .__row{
    flex-flow: row;
}

.card--layout .__column{
    flex-flow: column;
}

/* Content wrapping */
.card--layout .__wrap{
    flex-wrap: wrap;
}

/* Flexbox Alignment */

.card--layout .__align_center{
    align-items: center;
}

.card--layout .__align_start{
    align-items: flex-start;
}

.card--layout .__align_end{
    align-items: flex-end;
}

.card--layout .__justify_start{
    justify-content: flex-start;
}

.card--layout .__justify_end{
    justify-content: flex-end;
}

.card--layout .__justify_center{
    justify-content: center;
}

.card--layout .__justify_equal{
    justify-content: space-evenly;
}

.card--layout .__justify_between{
    justify-content: space-between;
}

/* Description */

.card--layout .__description, .card--layout .__label {
    font-size: 14px;
    line-height: var(--card-lineHeight);
    opacity: 0.75;
    color: var(--card-description-color);
}

/* Heading */
.card--layout .__heading{
    font-size: 1.35rem;
    font-weight: 600;
    line-height: var(--card-lineHeight);
}

/* Labels */
.card--layout .__label_focus{
    font-size: 1.75rem;
    line-height: 1;
    font-weight: 600;
}

.card--layout .__label_secondary{
    font-size: 11px;
    text-transform: uppercase;
    line-height: var(--card-lineHeight);
    color: var(--card-description-color);
    font-weight: 500;
    opacity: 0.55;
}