/* || Envato Footer Help Centre Stylesheet
Author: Simon Agliati
Version: 1.1
*/

.footer__section {
    background: var(--color-surface-brand-accent);
    padding-top: var(--spacing-7x);
    padding-bottom: var(--spacing-3x);
}

.footer__container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
}

div.menu__column h3.subheading {
    color: var(--color-content-secondary);
}

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

ul.ulfooter__menu > li > a.title4, li.product-link > a {
    line-height: 100%;
    color: var(--color-content-primary);
}

ul.ulfooter__menu > li > a {
    color: var(--color-content-primary);
}

ul.ulfooter__menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-2x);
    padding-right: var(--spacing-3x);
}

.menu__container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-5x);
    width: 100%;
}

.product-link__container {
    gap: 36px;
    flex-direction: row;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-top: var(--spacing-3x);
}

.product-link__wrap::before {
    content: "";
    display: block;
    background-color: var(--color-border-tertiary);
    width: 100%;
    height: 1px;
}

.ulfooter__product-links {
    display: flex;
    align-items: center;
    align-content: center;
    gap: var(--spacing-2x) var(--spacing-3x);
    flex-wrap: wrap;
}

.product-link__wrap {
    width: 100%;
}

.product-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-3x);
}

._2xPnbjvK {
    color: var(--color-content-secondary);
    text-wrap: pretty;
}

div.footer__logo img {
    width: 140px;
}

.product-links li:not(:last-child):after {
    border-right: var(--chunkiness-thin) solid var(--color-border-tertiary);
    content: "";
    margin-right: var(--spacing-3x);
    padding-left: var(--spacing-3x);
    position: relative;
    top: -1px;
}

.social__links_wrap {
    display: inline-flex;
    align-items: flex-start;
}

.links__container {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-3x);
    width: 308px;
    margin-right: var(--spacing-3x);
}

.social__links {
    display: flex;
    height: 48px;
    align-items: center;
}

.social-link__div {
    display: flex;
    width: 24px;
    height: 24px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}

a.social-link__a {
    display: flex;
    width: 48px;
    height: 48px;
    justify-content: space-between;
    align-items: center;
}

.menu__list{
    gap: var(--spacing-2x);
    display: flex;
    flex-direction: column;
}

button#cookie-settings {
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    color: var(--color-content-primary);
}

button#cookie-settings:hover {
    text-decoration: underline;
    color: var(--color-content-primary);
}

button#cookie-settings:active, button#cookie-settings:visited {
    color: var(--color-content-primary);
}

/* || Responsive Text */

/* Break Point: Tablet */

@media (min-width: 1280px) {

    .menu__container {
        display: flex;
        flex-direction: row;
        align-items: stretch;
        width: 100%;
        gap: var(--spacing-6x);
        justify-content: flex-end;
    }

    .menu__column--1, .menu__column--2, .menu__column--3, .menu__column--4 {
        min-width: 200px;
        max-width: 234px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-5x);
    }    

    .menu__container--1, .menu__container--2 {
        display: flex;
        gap: var(--spacing-6x);
    }

    .footer__content {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        align-items: stretch;
    }

}


@media (min-width: 1024px) and (max-width:1279px){

    .menu__container {
        display: flex;
        flex-direction: row;
        width: fit-content;
        gap: var(--spacing-6x);
    }

    .footer__content {
        display: flex;
        flex-direction: row;
        width: 100%;
        justify-content: space-between;
    }

    .menu__container--1, .menu__container--2, .menu__column--3, .menu__column--4 {
        display: flex;
        flex-direction: column;
        gap: var(--spacing-5x);
    }

    .links__container {
        margin-right: var(--spacing-3x);
    }
}

/* Break Point: Mobile */
@media (max-width: 1023px) {

    .product-link__container {
        gap: var(--spacing-3x);
        flex-direction: column;
        display: flex;
        align-items: flex-start;
    }

    .ulfooter__product-links {
        width: auto;
        gap: var(--spacing-2x);
    }

    .product-links {
        gap:var(--spacing-2x);
    }

    .footer__content {
        display: flex;
        flex-direction: column;
        gap: var(--spacing-7x);
    }

    a.social-link__a {
        width: unset;
        height: unset;
        padding: var(--spacing-2x);
    }

    .menu__container--1, .menu__container--2, .menu__column--3, .menu__column--4 {
        display: flex;
        flex-direction: column;
        gap: var(--spacing-5x);
    }

    .social__links {
        margin-left: -8px;
    }

}