*{ margin: 0; padding: 0; box-sizing: border-box; } body{ font-family: 'Inter', sans-serif; } .page-header{ display: flex; justify-content: center; width: 100%; padding: 28px 0; background-color: #000; } .header-logo{ display: block; } .Banner-principal{ width: 100%; } .Banner-principal-mobile{ display: none; } .top-infocard{ display: flex; align-items: center; justify-content: center; padding: 80px 0 95px; } .top-infocard-text{ max-width: 39%; margin-right: 7%; } .top-infocard-subtitulo{ font-weight: 400; font-size: 32px; text-transform: uppercase;; } .top-infocard-titulo{ font-weight: 500; font-size: 48px; text-transform: uppercase; margin-bottom: 24px; } .top-infocard-descriçao{ font-size: 16px; line-height: 24px; } .top-cards{ display: flex; justify-content: center; gap: 22px; padding: 74px 0; background-color: #F0F0F0; } .top-card{ display: flex; flex-direction: column; align-items: center; justify-content: center; width: 350px; height: 287px; gap: 27px; background-color: #FFFF; box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23); } .top-card p{ text-align: center; } @media screen and (max-width: 414px){ .Banner-principal-desktop{ display: none; } .Banner-principal-mobile{ display: unset; } } @media screen and (max-width: 992px){ .top-infocard{ flex-direction: column; padding: 54px 30px 158px; } .top-infocard-text{ margin: 54px 30px 68px; max-width: unset; } .top-infocard-subtitulo{ font-size: 20px; } .top-infocard-titulo{ font-size: 28px; } .top-infocard-imagem{ width: 100%; max-width: 240px; } .top-cards{ flex-direction: column; align-items: center; padding: 38px 0; } }