body {
    display: flex;
    /* grid-template-columns: auto auto; */
    justify-content: center;
    gap: 1rem;
}

section {
    background: yellow;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    padding: 5px;
    gap: 5px;
}

div {
    min-width: 35px;
    aspect-ratio: 1;
    background: red;
}

section:nth-of-type(2) div:nth-of-type(3),
section:nth-of-type(2) div:nth-of-type(4) {
    width: 75px;
    grid-column: span 2;
    grid-row: span 2;
    background: blue;
}

section:nth-of-type(3) div:nth-of-type(5) {
    width: 75px;
    grid-column: span 2;
    grid-row: span 2;
    background: blue;
}

section:nth-of-type(3) div:nth-of-type(3),
section:nth-of-type(3) div:nth-of-type(6) {
    height: 75px;
    grid-row: span 2;
    aspect-ratio: auto;
    background: green;
}

section:nth-of-type(3) div:nth-of-type(1),
section:nth-of-type(3) div:nth-of-type(9) {
    width: 75px;
    grid-column: span 2;
    aspect-ratio: auto;
    background: green;
}