[Sugestão] Falta código fonte | Layouts Responsivos: trabalhando com layouts mobile

Olá não entendi direito mas o que entendi é que queria o código certo?

 <section class="institucional conteiner">
            <h2 class="institucional__titulo">Institucional</h2>
    <div class="institucional-box">
            <div class="institucional-divisao">
                <P class="institucional__descricao">Um pouco mais sobre a Apeperia</P>
                <address class="institucional__endereco">
                    Rua Vergueiro, 3185 </br>
                    Vila Mariana, São Paulo
                    <article class="institucional__contato">
                        <p> <a href="tel:+551155712751" class="institucional__contato-telefone">(11) 5571-2751</a> ou
                            <a href="mailto:contato@apeperia.com" class="institucional__contato-email">contato@apeperia.com</a>
                        </p>
                    </article>
                </address>
            </div>
        <video src="img\formacao-java.mp4" class="institucional__video" controls></video>
    </div>
        </section>

agora o codigo css

.institucional {
    display: flex;
    flex-direction: column;
    align-items: center;

    color: var(--fonte-cinza);
    text-align: center;

    padding-top: 2rem;
    padding-bottom: 2rem;
}

.institucional__titulo {
    color: var(--cinza-escuro);
    font-weight: 700;
    font-size: 1.5rem;
    font-family: var(--montserrat);
    text-transform: uppercase;
    text-align: center;

    margin-bottom: 2rem;
}

.institucional__descricao {
    margin-bottom: 2rem;
}

.institucional__endereco {
    font-size: 1.5rem;
    line-height: normal;

    margin-bottom: 2rem;
}

.institucional__contato {
    font-size: 1.2rem;
    line-height: 1.8;

    margin-top: 2rem;
}

.institucional__contato-telefone {
    line-height: normal;
}

.institucional__contato-email {
    color: var(--fonte-link);
    text-decoration: underline;
    display: block;
}

.institucional__video {
    width: 100vw;
}

@media screen and (min-width: 768px) {
    .institucional__contato-email{
        display: inline-block;
    }

.institucional__video{
    max-width: 100%
}
}

@media screen and (min-width: 1024px) {


    .institucional__video {
        align-self: flex-end;

        width: 375px;
    }

    .institucional__contato-email {
        display: block;
    }

    .institucional {

    align-items: unset;
    text-align: left;
    }

    .institucional__endereco{
        margin-bottom: 0rem;
    }


    .institucional__titulo {
        font-size: 2rem;
    }

    .institucional-box {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    }
}

seria isso?

espero que ajude!