.container{
display:flex;
flex-direction:column;
gap:15px;
padding:20px;
width:min(100%, 1100px); /* modificado: largura fluida com limite máximo */
max-width:1100px;
margin-inline:auto;
background:#93c6f0;
border-radius:10px;
box-shadow:2px 4px 8px rgba(0,0,0,0.2);
}

.div1{
display:flex;
flex-direction:column;
gap:10px;
padding:15px;
background:white;
border-radius:10px;
box-shadow:2px 4px 8px rgba(0,0,0,0.2);
}

.div2{
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
padding:15px;
background:#87c2f1;
color:white;
border-radius:10px;
box-shadow:2px 4px 8px rgba(0,0,0,0.2);
}

.div3{
display:flex;
justify-content:center;
gap:10px;
padding:10px;
background:#f3f6f8;
border-radius:10px;
box-shadow:2px 4px 8px rgba(0,0,0,0.2);
}

@media(max-width:900px){

.div1,
.div2,
.div3{
flex-direction:column;
align-items:center;
}

}

@media(max-width:500px){
    .div3{
        flex-direction:column; /* modificado: botões empilhados em telas pequenas */
        gap:8px;
    }

    .div3 button{
        width:100%;
    }
}