@import url(./styles/breadcrumb.css);

.produto > img {
    width: 100%;
    height: 380px;
    object-fit: cover;
}

.produto .container {
    padding-top: 48px;
    padding-bottom: 64px;
    display: flex;
    align-items: center;
    gap: 80px;
}

.produto .container img {
    width: 50%;
}

.produto .container .produto-info {
    flex: 1;
}

.produto .container .produto-info h1 {
    color: var(--principal);
}

.produto .container .produto-info p {
    margin-bottom: 16px;
}

.produto .container .produto-info .default-button {
    border-radius: 5px 30px 30px 20px;
}

@media only screen and (max-width: 1023px) {
    .produto .container {
        flex-direction: column;
    }
    .produto .container img {
        width: 100%;
    }
}