/* Flex Container for Header, Body, and Footer */
:where([class$="__header"], [class$="__body"], [class$="__footer"]) {
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    gap: 0;
}

/* Component Header Specific Styles */
:where([class$="__header"]) { 
    --flow-space: var(--space-2xs);
    row-gap: var(--flow-space);
}

/* Component Body Specific Styles */
:where([class$="__body"]) {
    gap: var(--space-3xs);
}

/* Component Footer Specific Styles */
:where([class$="__footer"]) {
    --flow-space: var(--space-xs);
    row-gap: var(--flow-space);
}

/* Margin Between Sibling Elements in Component Header, Body, and Footer */
:where([class$="__header"], [class$="__body"], [class$="__footer"]) > * + * {
    margin-block-start: var(--flow-space);
}

/* Visual Element Styles */
:where([class$="__visual"])  {
    width: fit-content;
    height: auto;
}

/* Image and Picture Styles within Visual Elements */
:where([class$="__visual"]) :is(img, picture) {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
}

/* Partner Logo Styles */
.partner-logo {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
    max-width: 100px;
}