Salve, Miriam! Tudo bem com você?

Olha, o CSS da forma que fizemos é exatemente como ele funciona tradicionalmente.

O do Banner ficou assim:

.banner {
    background-color: #6278F7;
    text-align: center;
}

.banner img {
    max-width: 100%;
}

E o JSX do componente:

import './Banner.css'

export const Banner = () => {
    // JSX
    return (
        <header className="banner">
            <img src="/imagens/banner.png" alt="O banner principal da página do Organo"/>
        </header>
    )
}

Repara que o header ficou com a classe css banner (no JSX, usamos className ao invés de class como no HTML normal). Logo, o header ficou com a cor de fundo e o texto alinhado ao centro e a tag img dentro dele ficou com a largura máxima de 100%, assim evitamos que ela seja maior do que a tela em dispositivos menores :)