.home {
    display: flex;
    width: 100vw;
    height: auto;
    padding-block: 3vw 6vw;
}

.home__container {
    display: flex;
    width: 90vw;
    margin-inline: auto;
    align-items: center;
}

.home__images {
    display: flex;
}

.home__images-items {
    display: flex;
    flex-direction: column;
    width: 5vw;
    margin-inline: .8vw;
}

.home__images-span {
    display: block;
    width: 5vw;
    height: 5vw;
    margin-block: .4vw;
}

.home__images-span:nth-of-type(1) {
    margin-block: 0 .4vw;
}

.home__images-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home__images-big {
    display: flex;
    width: 35vw;
    height: 35vw;
    overflow: hidden;
}

.home__images-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home__texts {
    display: flex;
    width: 40vw;
    flex-direction: column;
    margin-inline: 4vw 0;
}

.home__texts-title {
    font-size: 2.4vw;
    line-height: 1.1;
}

.home__stock {
    color: var(--color-white);
    font-size: 1.2vw;
    padding: .2vw 1vw;
    border: 1px solid var(--color-tercery);
    background: rgba(22, 60, 54, .5);
    display: flex;
    width: max-content;
    margin-block: 1vw;
}

.home__prices {
    display: flex;
    align-items: center;
    margin-block: 0 1vw;
}

.home__price {
    color: var(--color-primary);
    font-size: 2vw;
}

.home__texts-description {
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    margin-block: 0 1vw;
}

.home__color {
    display: flex;
    align-items: center;
    margin-block: .5vw;
}

.home__color-text {
    font-size: 1.1vw;
    margin-inline: 0 1vw;
}

.home__color-items {
    display: flex;
    align-items: center;
}

.home__color-item {
    display: flex;
    width: 1.7vw;
    height: 1.7vw;
    border-radius: 50%;
    margin-inline: .2vw;
    background: #db6e3c;
}

.home__color-item:nth-of-type(2) { background: #4bce1f; }
.home__color-item:nth-of-type(3) { background: #1f4ece; }
.home__color-item:nth-of-type(4) { background: #ce1f1f; }

.home__cart {
    display: flex;
    align-items: center;
    margin-block: 2vw 0;
}

.home__cart-btn {
    display: flex;
    border: 2px solid var(--color-tercery);
}

.home__cart-more {
    color: var(--color-tercery);
    font-size: 1.6vw;
    display: flex;
    width: 2.5vw;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    transition: .3s all ease;
}

.home__cart-more:hover {
    color: var(--color-white);
    transform: scale(1.1);
    background: var(--color-tercery);
    opacity: .6;
}

.home__cart-input {
    font-size: 1.4vw;
    padding-block: .3vw;
    text-align: center;
    display: flex;
    width: 5vw;
    height: 100%;
    border-block: none;
    border-inline: 2px solid var(--color-tercery)
}

.home__cart-cart {
    color: var(--color-white);
    font-size: 1.1vw;
    text-decoration: none;
    display: flex;
    margin-inline: 1vw;
    padding: .6vw 2vw;
    border-radius: .2vw;
    background: var(--color-secundary);
    cursor: pointer;
    transition: .3s all ease;
}

.home__cart-cart:hover {
    transform: scale(1.05);
}

.home__actions {
    display: flex;
    align-items: center;
    margin-block: 2vw 0;
    padding-block: .6vw 0;
    padding-inline: .5vw;
    border-top: 2px solid var(--color-secundary);
    width: max-content;
    position: relative;
}

.home__actions-color {
    display: flex;
    width: 6vw;
    height: .3vw;
    background: var(--color-back-sec);
    position: absolute;
    left: 0;
    top: 0;
}

.home__carts-favs {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline: .5vw;
    position: relative;
    cursor: pointer;
}

.home__carts-favs:hover .home__carts-fav2 {
    opacity: 1;
    transform: scale(1.1);
}

.home__carts-fav {
    fill: var(--color-dark);
    width: 1.5vw;
    height: auto;
}

.home__carts-fav2 {
    fill: var(--color-secundary);
    width: 1.5vw;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: .3s all ease;
}

.home__carts-shares {
    display: flex;
    margin-inline: .5vw;
}

.home__carts-share {
    fill: var(--color-dark);
    width: 1.5vw;
    height: auto;
}

/* Descrpition */
.description {
    display: block;
    padding-block: 0;
    border-top: 3px solid var(--color-secundary);
    width: 80vw;
    margin-inline: auto;
    border-radius: 1.5px;
}

.description__color {
    display: block;
    width: 100%;
    height: 1vw;
    background: var(--color-back-sec);
    margin-block: 0 1vw;
}

.description__title {
    color: var(--color-dark);
    font-family: var(--font-family-bold);
    font-size: 1.5vw;
    width: max-content;
    margin-inline: 10% 0;
    margin-block: 0 1vw;
    position: relative;
}

.description__text {
    color: var(--color-dark);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    width: 80%;
    margin-inline: auto;
    margin-block: 0 3vw;
    line-height: 1.5;
}

/* Specs */
.specs {
    width: 80%;
    display: flex;
    margin-inline: auto;
    margin-block: 0 3vw;
}

.specs__color {
    display: block;
    width: 100%;
    height: 1vw;
    background: var(--color-back-sec);
    margin-block: 0 1vw;
}

.specs__content {
    display: flex;
    flex-direction: column;
    width: 46%;
    border-top: 3px solid var(--color-secundary);
    border-radius: 1.5px;
}

.specs__content:nth-of-type(1) {
    margin-inline: 0 auto;
}

.specs__content:nth-of-type(2) {
    margin-inline: auto 0;
}

.specs__title {
    color: var(--color-dark);
    font-family: var(--font-family-bold);
    text-align: start;
    font-size: 1.5vw;
    width: max-content;
    margin-inline: 0;
    margin-block: 0 1vw;
    position: relative;
}

.specs__text {
    color: var(--color-dark);
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    width: 100%;
    margin-inline: auto;
    margin-block: 0 1vw;
    line-height: 1.5;
}

.specs__tables {
    display: flex;
    width: 30vw;
    border-radius: .3vw;
    border: 2px solid var(--color-tercery);
    overflow: hidden;
}

.specs__table {
    width: 100%;
    border-collapse: collapse;
}
  
.specs__table th {
    text-align: left;
    background-color: var(--color-back-sec);
    padding: .5vw 1vw .5vw 1.3vw;
    width: 40%;
    font-family: var(--font-family-bold);
    border-bottom: 1px solid #d1ccc5;
    font-size: 1.1vw;
}
  
.specs__table td {
    padding: .5vw 1vw;
    border-bottom: 1px solid #d1ccc5;
    font-family: var(--font-family-light);
    font-size: 1.1vw;
}

.specs__faqs {
    display: flex;
    flex-direction: column;
}

.specs__faqs-item {
    display: flex;
    flex-direction: column;
    border: 2px solid var(--color-tercery);
    border-radius: .3vw;
    overflow: hidden;
    width: auto;
    height: auto;
    margin-block: .4vw;
}

.specs__faqs-question {
    background-color: var(--color-back-sec);
    padding: .5vw 1vw;
    font-family: var(--font-family-bold);
    text-align: center;
    border-bottom: 1px solid #d1ccc5;
    font-size: 1.1vw;
}

.specs__faqs-answer {
    padding: .5vw 1vw;
    font-family: var(--font-family-light);
    font-size: 1.2vw;
    line-height: 1.4;
}

@media (max-width: 768px) {
    /* Home */
    .home__container { flex-direction: column; }
    .home__images { flex-direction: column-reverse; }
    .home__images-big { width: 90vw; height: 90vw; margin-block: 0 2vw; }
    .home__images-items { flex-direction: row; width: 90vw; margin-inline: 0; }
    .home__images-span:nth-of-type(1) { margin-block: 0; margin-inline: 0 1vw; }
    .home__images-span { margin-block: 0; margin-inline: 1vw; width: 16vw; height: 16vw; }
    .home__texts { margin-inline: 0; margin-block: 4vw 0; width: 80vw; }
    .home__texts-title { font-size: 4.5vw; }
    .home__stock { margin-block: 2vw; font-size: 2.6vw; padding: .6vw 3vw; }
    .home__prices { margin-block: 0 2vw; }
    .home__price { font-size: 5vw; }
    .home__texts-description { margin-block: 0 2vw; font-size: 3vw; }
    .home__color { margin-block: 1.2vw; }
    .home__color-text { font-size: 3vw; margin-inline: 0 2vw; }
    .home__color-item { width: 4vw; height: 4vw; margin-inline: .7vw; }
    .home__cart { margin-block: 4vw 0; }
    .home__cart-more { width: 4.5vw; font-size: 4vw; }
    .home__cart-input { font-size: 4vw; width: 10vw; }
    .home__cart-cart { margin-inline: 4vw 0; padding: 1vw 4vw; font-size: 3.3vw; }
    .home__actions { margin-block: 4vw 0; padding-block: 2vw 0; padding-inline: 2vw; }
    .home__actions-color { height: 1vw; width: 19vw; }
    .home__carts-favs { margin-inline: 1.5vw; }
    .home__carts-fav { width: 4.5vw; }
    .home__carts-shares { margin-inline: 1.5vw; }
    .home__carts-share { width: 4.5vw; }
    /* Description */
    .description { border-top: 2px solid var(--color-secundary); }
    .description__title { font-size: 4vw; margin-block: 2vw 3vw; margin-inline: 5%; width: 90%; }
    .description__title:before { height: 2px; bottom: -1.5px; left: 15%; }
    .description__text { font-size: 3.6vw; margin-inline: 5%; width: 90%; margin-block: 0 5vw; }
    /* Specs */
    .specs { flex-direction: column; width: 90%; margin-block: 0 7vw; }
    .specs__content { width: 100%; margin-block: 1vw; border-top: 2px solid var(--color-secundary); }
    .specs__title { font-size: 4vw; text-align: center; margin-block: 2vw 4vw; margin-inline: 5%; width: 90%; }
    .specs__title:before { height: 2px; bottom: -1.5px; }
    .specs__text { font-size: 3.2vw; width: 100%; }
    .specs__tables { width: 80vw; border: 1px solid var(--color-tercery); border-radius: 1vw; margin-inline: auto; margin-block: 2vw; }
    .specs__table th { padding: 1.5vw 2vw 1.5vw 4vw; font-size: 3.2vw; }
    .specs__table td { padding: 1.5vw 2vw 1.5vw 4vw; font-size: 3.2vw; }
    .specs__faqs-item { border: 1px solid var(--color-tercery); border-radius: 1vw; margin-block: 1.2vw; }
    .specs__faqs-question { padding: 1vw 3vw; font-size: 3.2vw; }
    .specs__faqs-answer { padding: 1vw 3vw; font-size: 3.2vw; }
}