:root {
    --cb-disruptor-spacing: 1rem;
}

.cb-disruptor {
    width: 100%;
    max-width: calc((100% / 3) * 2);
}

.cb-disruptor__container {
    container: cb-disruptor / inline-size;
}

.cb-disruptor__wrapper {
    display: inline-flex;
    flex-flow: row wrap;
    align-items: center;
    gap: var(--cb-disruptor-spacing);

    background-color: var(--cb-bg-color, lightgrey);
    border-radius: 100vmax;
    border: var(--cb-disruptor-border-width, 2px) var(--cb-disruptor-border-style, solid) var(--cb-disruptor-border-color, lightgrey);
    padding: var(--cb-disruptor-spacing);
    overflow: clip;
    margin-block: 2rem;
}

.cb-disruptor__img {
    display: grid;
    place-content: center;
    flex: 1 1 auto;
    max-width: 100px;
    border-radius: 100vw;
    overflow: clip;
    aspect-ratio: 1;
}

.cb-disruptor__img:is(a):where(:hover, :focus) img {
    scale: 1.1;
}

    .cb-disruptor__img img {
        width: 85%;
        height: 85%;
        object-position: center;
        transition: scale .25s ease-in-out;
    }

.cb-disruptor__text {
    flex: 1;
    margin-right: var(--cb-disruptor-spacing);
    padding-inline-end: calc(var(--cb-disruptor-spacing) * 2);
}

.cb-disruptor__headline {
    margin-block-end: calc(var(--cb-disruptor-spacing) / 2);
}

.cb-disruptor__body > *:last-child {
    margin-block-end: 0;
}