/* Header */

.header-container {
    background-image: url("/static/imgs/borsiis_dash/movil/1.1793a91773b6.webp");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    font-size: 1.2rem;
    color: #fff;
    text-align: center;
    padding: 0;
    aspect-ratio: 921/1265;
    width: 100%;
    display: flex;
    align-items: end;
    justify-content: center;
}

.header-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0.6rem;
    padding: 0;
    width: 100%;
    height: 85%;
}

.header-main-title {
    font-size: 2.5rem;
    text-align: center;
    padding-top: 3rem;
}

.header-play-button {
    display: inline-block;
    color: var(--color-dark-green);
    border: none;
    font-size: 1.6rem;
    padding: 1rem 1.2rem;
    background-image: url("/static/imgs/borsiis_dash/movil/boton 3.28e0872c52d8.webp");
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    text-decoration: none;
}


.article-button-pc-tablet {
    display: none;
}


/* Borsiis Dash Edition */

.edition-section {
    background-image: url("/static/imgs/borsiis_dash/movil/2.9791efcc9f47.webp");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    aspect-ratio: 922/1026;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
}

.edition-section,
.edition-article {
    text-align: center;
}

.edition-section-header {
    margin: 10% 0 0 0;
}

.edition-section h2 {
    margin: 10% 0 0 0;
    color: #4a156d;
}

.edition-article {
    margin: 10% 0 10% 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;
    gap: 16px;
}

.edition-article-content {
    margin: 0 0 10% 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.edition-article-image {
    max-width: 30%;
    transform: rotate(17deg);
    height: auto;
}

.edition-article-button {
    flex-shrink: 0;
}


/* Borsiis Dash Description */

.description-section {
    background-image: url("/static/imgs/borsiis_dash/movil/3.85d3e64d763c.webp");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    aspect-ratio: 922/1026;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: end;
    justify-content: space-around;
}

.description-section,
.description-article {
    text-align: center;
}

.description-section-header {
    width: 100%;
    margin: 10% 0 0 0;
}

.description-section-header h2 {
    margin: 0;
}

.description-article {
    flex: 1;
    margin: 5% 0 0 0;
    display: flex;
    flex-direction: column;
    align-items: end;
    justify-content: center;
    width: 80%;
    padding-bottom: 30%;
}

.description-article-text p {
    text-align: right;
}

.description-image {
    width: 60%;
    margin: 0 0 10% 0;
}

.description-article-button {
    background-color: var(--color-yellow);
    border: none;
    border-radius: 1.2rem;
    font-size: 1.2rem;
    color: var(--color-darker-green);
    padding: 0.2rem 0.6rem;
    margin: 0;
    text-decoration: none;
    text-transform: uppercase;
}


/* Borsiis Dash Story */

.story-section {
    background-image: url("/static/imgs/borsiis_dash/movil/4.de243d56ef2b.webp");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    aspect-ratio: 922/970;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
}

.story-section,
.story-article {
    text-align: center;
}

.story-section-header {
    margin: 10% 0 0 0;
}

.story-section h2 {
    margin: 0;
}

.story-article {
    margin: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.story-article-content {
    margin: 0;
}

.story-article-image-container {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.story-article-image {
    width: 25%;
    margin: 0;
}

.story-article-button {
    background-color: var(--color-yellow);
    border: none;
    border-radius: 1.2rem;
    font-size: 1.2rem;
    color: var(--color-darker-green);
    padding: 0.2rem 0.6rem;
    margin: 0;
    text-decoration: none;
    text-transform: uppercase;
}


/* Community */

.borsiis-community-section {
    background-image: url("/static/imgs/borsiis_dash/movil/5.f707d908cee9.webp");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    aspect-ratio: 922/929;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    padding-bottom: 45%;
}

.borsiis-community-section,
.borsiis-community-article {
    text-align: center;
}

.borsiis-community-section h2 {
    margin: 8% 0 2% 0;
    padding: 0;
}

.borsiis-community-article-content a {
    background-color: var(--color-yellow);
    border: none;
    border-radius: 1.2rem;
    font-size: 1.5rem;
    color: var(--color-darker-green);
    padding: 0.2rem 0.6rem;
    margin: 0;
    text-decoration: none;
    text-transform: uppercase;
}



/* Social media carousel */

.social-media-section {
    background-image: url("/static/imgs/borsiis_dash/movil/6.1a42b55c0d6d.webp");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    /* aspect-ratio: 922/849; */
    width: 100%;
    text-align: center;
    padding: 0 5% 0 5%;
}

.social-media-section h2 {
    margin: 2rem 0 0 0;
    color: var(--color-green);
}

.social-media-small-links-buttons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;

}

.social-media-small-links-buttons a svg {
    width: 2.5rem;
    padding: 0.4rem;
    fill: var(--color-green)
}

.social-media-carousel {
    position: relative;
    aspect-ratio: 1/1;
    padding: 3rem;
}

.carousel-social-text-container {
    text-decoration: none;
    color: var(--color-dark-green);
    transition: transform 0.3s ease;
}

.carousel-social-text-container:hover {
    color: var(--color-green);
    transform: scale(0.99);
}

.carousel-social-media-container img {
    aspect-ratio: 2780 / 2271;
    display: block;
    width: 100%;
}



/* Media queries */

/* min-width: 534px */
@media (min-width: 534px) {}

/* Tablet: min-width: 768px */
@media (min-width: 768px) {
    .header-container {
        background-image: url("/static/imgs/borsiis_dash/tablet/1.89856cb34929.webp");
        aspect-ratio: 1280 / 777;
    }

    .header-content {
        width: 70%;
        padding: 0;
        height: 55%;
    }

    .header-main-title {
        font-size: 3rem;
        text-align: right;
        padding-top: 0;
    }

    .header-play-button-container {
        margin-top: 0rem;
    }

    .header-play-button {
        font-size: 1.8rem;
    }

    .article-button-movil {
        display: none;
    }

    .article-button-pc-tablet {
        display: initial;
    }

    /* Borsiis Dash Edition */
    .edition-section {
        background-image: url("/static/imgs/borsiis_dash/tablet/2.1a2956c17bf6.webp");
        aspect-ratio: 1281 / 778;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
    }

    .edition-section-header {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: end;
        margin: 5% 0 0 0;
    }

    .edition-section-header h2 {
        font-size: 2.4rem;
    }

    .edition-article {
        flex: 1;
        margin: 0 0 10% 0;
        width: 100%;
    }

    .edition-article-content {
        flex-direction: row;
        align-items: flex-start;
        gap: 24px;
        margin: 5% 0 5% 0;
    }

    .edition-article-text {
        flex: 2;
    }

    .edition-article-text p {
        font-size: 1.8rem !important;
        text-align: justify;
    }

    .edition-article-image-container {
        flex: 1;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .edition-article-button {
        margin-bottom: 16px;
    }

    .edition-article-image {
        max-width: 80%;
    }


    /* Borsiis Dash Description */
    .description-section {
        background-image: url("/static/imgs/borsiis_dash/tablet/3.7dbee03b4ade.webp");
        aspect-ratio: 1281 / 863;
        justify-content: space-around;
    }

    .description-section-header {
        margin: 5% 0 0 0;
    }

    .description-section-header h2 {
        font-size: 3rem;
    }

    .description-article {
        margin: 0 0 10% 0;
        width: 75%;
        padding-bottom: 0;
    }

    .description-article-content {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        margin: 5% 0 5% 0;
    }

    .description-article-image-container {
        width: 100%;
        display: flex;
        justify-content: end;
    }

    .description-image {
        flex: 1;
        margin: 0;
    }

    .description-article-text {
        flex: 1;
    }

    .description-article-text p {
        font-size: 1.8rem !important;
    }

    .description-article-button {
        padding: 1% 2%;
        font-size: 1.8rem !important;
    }


    /* Borsiis Dash Story */
    .story-section {
        background-image: url("/static/imgs/borsiis_dash/tablet/4.78bda716d06b.webp");
        aspect-ratio: 1281 / 688;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
    }

    .story-section-header {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: end;
        margin: 5% 0 0 0;
    }

    .story-section-header h2 {
        font-size: 2.4rem;
    }

    .story-article {
        flex: 1;
        margin: 0 0 10% 0;
        width: 100%;
        align-items: center;
    }

    .story-article-content {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        margin: 5% 0 5% 0;
    }

    .story-article-image-container {
        flex: 0.5;
    }

    .story-article-image {
        width: 60%;;
    }

    .story-article-text {
        flex: 1;
    }

    .story-article-text p {
        font-size: 1.8rem !important;
        text-align: end;
    }

    .story-article-button {
        padding: 1% 2%;
        font-size: 1.8rem !important;
    }


    /* Community */
    .borsiis-community-section {
        background-image: url("/static/imgs/borsiis_dash/tablet/5.f7b559ec4c1e.webp");
        aspect-ratio: 1281 / 803;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        padding-bottom: 10%;
    }

    .borsiis-community-section-header {
        margin-top: 3%;
    }

    .borsiis-community-section-header h2 {
        font-size: 3rem;
    }

    .borsiis-community-article {
        flex: 1;
        margin: 0;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
    }

    .borsiis-community-article-content {
        width: 100%;
    }

    .borsiis-community-article-text {
        display: flex;
        flex-direction: row;
        justify-content: center;
        width: 100%;
    }

    .borsiis-community-article-text p {
        width: 100%;
        font-size: 1.8rem !important;
    }

    .borsiis-community-article-content>a {
        padding: 1% 2%;
        font-size: 1.8rem !important;
    }



    /* Social media carousel */
    .social-media-section {
        background-image: url("/static/imgs/borsiis_dash/tablet/6.83834adfe71f.webp");
        aspect-ratio: 1281 / 771;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: start;
        padding-top: 5%;
    }

    .social-media-small-links-buttons {
        gap: 2%;
        width: 100%;
    }

    .social-media-small-links-buttons a svg {
        width: 3.5rem;
    }

    .social-media-carousel {
        width: 60%;
        aspect-ratio: initial;
    }

    .carousel-social-text-container {
        display: flex;
        flex-direction: row;
        justify-content: end;
        align-items: center;
        gap: 3%;
    }

    .carousel-social-text-container * {
        flex: 1;
    }
}

/* Desktop: min-width: 1024px */
/* @media (min-width: 1024px) {
} */

/* Desktop: min-width: 1524px */
@media (min-width: 1524px) {
    .header-container {
        background-image: url("/static/imgs/borsiis_dash/pc/1.9c497dc6d5c5.webp");
        aspect-ratio: 1920 / 776;
    }

    .header-content {
        width: 70%;
        padding: 0;
        height: 50%;
    }

    .header-main-title {
        font-size: 4.5rem;
        text-align: right;
    }

    .header-play-button-container {}

    .header-play-button {
        font-size: 2.2rem;
        padding: 1.5rem 2rem;
    }

    .header-game-links {}


    /* Borsiis Dash Edition */
    .edition-section {
        background-image: url("/static/imgs/borsiis_dash/pc/2.131352670377.webp");
        aspect-ratio: 1921 / 778;
    }

    .edition-section-header {
        margin: 2% 0 0 0;
    }

    .edition-article {
        display: flex;
        flex-direction: column;
        margin: 0 0 10% 0;
        width: 80%;
    }

    .edition-article-content {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        margin: 5% 0 5% 0;
    }

    .edition-image {
        flex: 2;
        margin: 0;
    }

    .edition-article-text {
        flex: 3;
        padding: 0 5% 0 5%;
    }

    .edition-article-text p {
        font-size: 2rem !important;
    }


    /* Borsiis Dash Description */
    .description-section {
        background-image: url("/static/imgs/borsiis_dash/pc/3.9046f585afde.webp");
        aspect-ratio: 1921 / 862;
    }

    .description-section-header {
        margin: 2% 0 0 0;
    }

    .description-article {
        margin: 0 0 10% 0;
        width: 60%;
    }

    .description-article-content {
        margin: 5% 0 5% 0;
    }

    .description-image {
        flex: 2;
        margin: 0;
    }

    .description-article-text {
        flex: 3;
        padding: 0 5% 0 5%;
    }

    .description-article-text p {
        font-size: 2rem !important;
    }

    .description-article-button {
        padding: 1% 2%;
        font-size: 2rem !important;
        margin: 0 auto;
    }


    /* Borsiis Dash Story */
    .story-section {
        background-image: url("/static/imgs/borsiis_dash/pc/4.b5e4eeb5f165.webp");
        aspect-ratio: 1921 / 686;
    }

    .story-section-header {
        margin: 2% 0 0 0;
    }

    .story-article {
        display: flex;
        flex-direction: column;
        margin: 0 0 10% 0;
        width: 80%;
    }

    .story-article-content {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        margin: 5% 0 5% 0;
    }

    .story-article-image {
        width: 60%;
    }

    .story-article-text {
        flex: 1;
        padding: 0 5% 0 5%;
    }

    .story-article-text p {
        font-size: 2rem !important;
    }

    .story-article-button {
        padding: 1% 2%;
        font-size: 2rem !important;
    }


    /* Community */
    .borsiis-community-section {
        background-image: url("/static/imgs/borsiis_dash/pc/5.77d9e739bccb.webp");
        aspect-ratio: 1921 / 802;
    }

    .borsiis-community-article {
        display: flex;
        flex-direction: column;
    }

    .borsiis-community-article-content>a {
        padding: 1% 2%;
    }

    .borsiis-community-article-text {
        display: flex;
        flex-direction: row;
        justify-content: center;
    }

    .borsiis-community-article-text p {
        width: 40%;
    }

    /* Social media carousel */
    .social-media-section {
        background-image: url("/static/imgs/borsiis_dash/pc/6.ab3c84da26fd.webp");
        aspect-ratio: 1921 / 770;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: start;
    }

    .social-media-small-links-buttons {
        gap: 2.5%;
        width: 100%;
    }

    .social-media-small-links-buttons a svg {
        width: 3.5rem;
    }

    .social-media-carousel {
        width: 40%;
    }

    .carousel-social-text-container {
        display: flex;
        flex-direction: row;
        justify-content: end;
        align-items: center;
        gap: 3%;
    }

    .carousel-social-text-container * {
        flex: 1;
    }
}