.header{ display:flex; justify-content:center; align-items:center; padding:29px 0; background:#000 } .header__logo { width: 16%; display: block; } .banner { margin-bottom: 74px; } .banner__img { width: 100%; display: block; } .home-destaque { display: flex; justify-content: center; align-items: center; flex-direction: column; } .home-destaque__text { display: flex; align-items: center; justify-content: center; flex-direction: column; max-width: 766px; } .home-destaque__text__subtitle { font-weight: 400; font-size: 32px; line-height: 39px; text-transform: uppercase; } .home-destaque__text__title { font-weight: 500; font-size: 48px; line-height: 58px; margin-bottom: 28px; text-transform: uppercase; } .home-destaque__text__description { font-weight: 400; font-size: 16px; line-height: 24px; text-align: center; margin-bottom: 74px; } .home-destaque__img { width: 16%; margin-bottom: 180px; } .cards { display: grid; grid-template-columns: repeat(3, max-content); gap: 20px; justify-content: center; } .cards__card{ display: flex; justify-content: center; align-items: center; flex-direction: column; background: #FFFFFF; box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23); padding: 36px 26px 26px; } .card__img { display: block; margin-bottom: 26px; } .card__description { padding: 0 25px 27px; text-align: center; max-width: 300px; } .carousel{ margin-top: 80px; background: #E0E0E0; } .carousel__products { display: grid; grid-template-columns: repeat(3, max-content); gap: 40px; justify-content: center; top: 62px; position: relative; } .carousel__products_img { width: 30vw; max-width: 566px; display: block; } @media screen and (min-width: 769px) and (max-width: 1200px) { .home-destaque__img { width: 58%; max-width: 240px; } .cards { grid-template-columns: repeat(2, max-content); } .card__description { max-width: 230px; } } @media screen and (max-width: 768px) { .header__logo { width: 54%; } .home-destaque__text { padding: 0 28px; } .home-destaque__text__subtitle { font-size: 20px; line-height: 24px; } .home-destaque__text__title{ font-size: 28px; line-height: 34px; } .home-destaque__text__description { text-align: center; } .home-destaque__img { width: 58%; max-width: 240px; } .cards { grid-template-columns: 1fr; padding: 0 28px; } .carousel__products { grid-template-columns: repeat(2, max-content); justify-content: center; column-gap: 14px; row-gap: 24px; padding: 0 26px; } .carousel__products_img { width: 42vw; } .product3 { grid-column: 1/3; width: 88vw; max-width: none; } } @media screen and (min-width: 415px) { .banner__img__mobile { display: none; } } @media screen and (max-width: 414px) { .banner__img__desktop { display: none; } } @media screen and (max-width: 300px) { .home-destaque__text__title{ font-size: 26px; } .cards__card{ max-width: 235px; } }