/* ==========================================================================
   DM STUDIO AI
   COMPACT PREMIUM FOOTER
   ========================================================================== */


/* ==========================================================================
   RESET
   ========================================================================== */

.dm-site-footer,
.dm-app-footer {
    display: block !important;

    grid-template-columns: none !important;
    grid-template-rows: none !important;

    width: 100% !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding: 0 !important;

    clear: both !important;

    box-sizing: border-box !important;
}


.dm-site-footer *,
.dm-site-footer *::before,
.dm-site-footer *::after,
.dm-app-footer *,
.dm-app-footer *::before,
.dm-app-footer *::after {
    box-sizing: border-box !important;
}


/* ==========================================================================
   PUBLIC FOOTER
   ========================================================================== */

.dm-site-footer {
    position: relative !important;

    margin-top: 54px !important;

    color: #d6def6 !important;

    background:
        radial-gradient(
            circle at 12% 0%,
            rgba(50, 187, 238, .08),
            transparent 25%
        ),
        radial-gradient(
            circle at 88% 0%,
            rgba(110, 78, 255, .09),
            transparent 27%
        ),
        linear-gradient(
            135deg,
            #07143d 0%,
            #0a194b 100%
        ) !important;

    border: 0 !important;

    overflow: hidden !important;
}


/* Thin premium accent */

.dm-site-footer-accent {
    width: 100% !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7258ff 0%,
            #3d82ff 48%,
            #18cad9 100%
        ) !important;

    box-shadow:
        0 0 18px rgba(68, 139, 255, .38) !important;
}


/* ==========================================================================
   CONTAINER
   ========================================================================== */

.dm-site-footer-container {
    width:
        min(
            calc(100% - 48px),
            1480px
        ) !important;

    margin:
        0 auto !important;
}


/* ==========================================================================
   MAIN ROW
   ========================================================================== */

.dm-site-footer-main {
    display: flex !important;

    align-items: center !important;
    justify-content: space-between !important;

    gap: 38px !important;

    padding:
        28px 0 22px !important;
}


/* ==========================================================================
   BRAND
   ========================================================================== */

.dm-site-footer-brand {
    flex:
        0 1 430px !important;

    min-width:
        250px !important;
}


.dm-site-footer-logo {
    display: inline-flex !important;

    align-items: baseline !important;

    gap: 4px !important;

    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    font-size: 1.28rem !important;
    font-weight: 900 !important;

    line-height: 1 !important;

    letter-spacing: -.04em !important;

    text-decoration: none !important;
}


.dm-footer-logo-dm {
    color: #53c6ef !important;
    -webkit-text-fill-color: transparent !important;

    background:
        linear-gradient(
            135deg,
            #4f8cff,
            #25c4d9
        ) !important;

    -webkit-background-clip: text !important;
    background-clip: text !important;
}


.dm-footer-logo-white {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    background: none !important;
}


.dm-site-footer-brand p {
    margin: 7px 0 0 !important;

    color: #96a5c9 !important;

    font-size: .78rem !important;

    line-height: 1.5 !important;
}


/* ==========================================================================
   MAIN LINKS
   ========================================================================== */

.dm-site-footer-links {
    display: flex !important;

    align-items: center !important;
    justify-content: flex-end !important;

    flex-wrap: wrap !important;

    gap:
        8px 24px !important;

    min-width:
        0 !important;
}


.dm-site-footer-links a,
.dm-site-footer-links a:link,
.dm-site-footer-links a:visited {
    position: relative !important;

    display: inline-flex !important;

    align-items: center !important;

    min-height: 34px !important;

    color: #cdd6f2 !important;
    -webkit-text-fill-color: #cdd6f2 !important;

    font-size: .80rem !important;
    font-weight: 750 !important;

    text-decoration: none !important;

    transition:
        color .18s ease !important;
}


.dm-site-footer-links a::after {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    right: 100% !important;
    bottom: 1px !important;

    height: 2px !important;

    border-radius: 999px !important;

    background:
        linear-gradient(
            90deg,
            #6b5cff,
            #2ac7dc
        ) !important;

    transition:
        right .18s ease !important;
}


.dm-site-footer-links a:hover,
.dm-site-footer-links a:focus-visible {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


.dm-site-footer-links a:hover::after,
.dm-site-footer-links a:focus-visible::after {
    right: 0 !important;
}


/* ==========================================================================
   COMMUNITY / CONNECT
   ========================================================================== */

.dm-site-footer-community {
    display: flex !important;

    align-items: center !important;

    flex-wrap: wrap !important;

    gap: 10px 18px !important;

    padding:
        15px 0 !important;

    border-top:
        1px solid rgba(255, 255, 255, .07) !important;
}


.dm-site-footer-community-label {
    color: #6f80a8 !important;

    font-size: .65rem !important;
    font-weight: 900 !important;

    letter-spacing: .12em !important;

    text-transform: uppercase !important;
}


.dm-site-footer-community a,
.dm-site-footer-community a:link,
.dm-site-footer-community a:visited {
    display: inline-flex !important;

    align-items: center !important;

    gap: 7px !important;

    color: #b9c4e0 !important;
    -webkit-text-fill-color: #b9c4e0 !important;

    font-size: .76rem !important;
    font-weight: 700 !important;

    text-decoration: none !important;

    transition:
        color .18s ease,
        transform .18s ease !important;
}


.dm-site-footer-community a:hover,
.dm-site-footer-community a:focus-visible {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    transform:
        translateY(-1px) !important;
}


.dm-footer-community-icon,
.dm-site-footer-zerivox-icon {
    display: grid !important;

    place-items: center !important;

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    max-width: 22px !important;
    max-height: 22px !important;

    flex: 0 0 22px !important;

    border-radius: 7px !important;
}


.dm-footer-community-icon {
    background:
        rgba(255, 255, 255, .045) !important;
}


.dm-footer-community-icon img {
    display: block !important;

    width: 16px !important;
    height: 16px !important;

    min-width: 16px !important;
    min-height: 16px !important;

    max-width: 16px !important;
    max-height: 16px !important;

    object-fit: contain !important;
}


.dm-site-footer-zerivox-icon {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #6654f5,
            #12bdd2
        ) !important;

    font-size: .62rem !important;
    font-weight: 900 !important;
}


/* ==========================================================================
   BOTTOM ROW
   ========================================================================== */

.dm-site-footer-bottom {
    display: flex !important;

    align-items: center !important;
    justify-content: space-between !important;

    flex-wrap: wrap !important;

    gap: 9px 22px !important;

    min-height: 52px !important;

    padding:
        13px 0 15px !important;

    border-top:
        1px solid rgba(255, 255, 255, .07) !important;
}


.dm-site-footer-bottom p {
    margin: 0 !important;

    color: #7d8db4 !important;

    font-size: .67rem !important;

    line-height: 1.5 !important;
}


.dm-site-footer-credit {
    display: flex !important;

    align-items: center !important;

    flex-wrap: wrap !important;

    gap: 5px !important;
}


.dm-site-footer-bottom a,
.dm-site-footer-bottom a:link,
.dm-site-footer-bottom a:visited {
    color: #60d3e5 !important;
    -webkit-text-fill-color: #60d3e5 !important;

    font-weight: 850 !important;

    text-decoration: none !important;
}


.dm-site-footer-bottom a:hover,
.dm-site-footer-bottom a:focus-visible {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


.dm-site-footer-send {
    color: #e78bbc !important;
}


.dm-site-footer-divider {
    color: #52618a !important;
}


/* ==========================================================================
   APPLICATION FOOTER
   ========================================================================== */

.dm-app-footer {
    position: relative !important;

    margin:
        30px 0 0 !important;

    background:
        linear-gradient(
            135deg,
            #07143d 0%,
            #091849 100%
        ) !important;

    border-top:
        1px solid rgba(255, 255, 255, .07) !important;

    overflow:
        hidden !important;
}


.dm-app-footer-accent {
    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            #7358ff,
            #3e84ff,
            #18cbd9
        ) !important;
}


.dm-app-footer-inner {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    flex-wrap: wrap !important;

    gap: 12px 22px !important;

    min-height: 54px !important;

    width:
        min(
            calc(100% - 30px),
            1200px
        ) !important;

    margin:
        0 auto !important;

    padding:
        11px 0 !important;
}


.dm-app-footer-logo {
    display: inline-flex !important;

    align-items: baseline !important;

    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    font-size: .76rem !important;
    font-weight: 850 !important;

    text-decoration: none !important;
}


.dm-app-footer-logo span {
    margin-right: 3px !important;

    color: #5ed5e8 !important;
    -webkit-text-fill-color: #5ed5e8 !important;
}


.dm-app-footer p {
    margin: 0 !important;

    color: #7d8db4 !important;

    font-size: .66rem !important;
}


.dm-app-footer-links {
    display: flex !important;

    align-items: center !important;

    gap: 13px !important;
}


.dm-app-footer-links a,
.dm-app-footer-links a:link,
.dm-app-footer-links a:visited {
    color: #9caacf !important;
    -webkit-text-fill-color: #9caacf !important;

    font-size: .68rem !important;
    font-weight: 750 !important;

    text-decoration: none !important;
}


.dm-app-footer-links a:hover,
.dm-app-footer-links a:focus-visible {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 820px) {

    .dm-site-footer-main {
        align-items: flex-start !important;

        flex-direction: column !important;

        gap: 18px !important;

        padding:
            24px 0 18px !important;
    }


    .dm-site-footer-brand {
        min-width: 0 !important;
    }


    .dm-site-footer-links {
        justify-content: flex-start !important;
    }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    .dm-site-footer {
        margin-top: 40px !important;
    }


    .dm-site-footer-container {
        width:
            calc(100% - 28px) !important;
    }


    .dm-site-footer-main {
        gap: 17px !important;

        padding:
            22px 0 17px !important;
    }


    .dm-site-footer-logo {
        font-size: 1.20rem !important;
    }


    .dm-site-footer-brand p {
        max-width: 330px !important;

        font-size: .75rem !important;
    }


    .dm-site-footer-links {
        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        width: 100% !important;

        gap:
            4px 24px !important;
    }


    .dm-site-footer-links a {
        min-height:
            32px !important;
    }


    .dm-site-footer-community {
        gap:
            9px 14px !important;

        padding:
            13px 0 !important;
    }


    .dm-site-footer-community-label {
        width:
            100% !important;
    }


    .dm-site-footer-bottom {
        align-items:
            flex-start !important;

        flex-direction:
            column !important;

        gap:
            6px !important;

        padding:
            13px 0 16px !important;
    }


    .dm-site-footer-credit {
        align-items:
            flex-start !important;

        flex-direction:
            column !important;

        gap:
            2px !important;
    }


    .dm-site-footer-divider {
        display: none !important;
    }


    .dm-app-footer-inner {
        flex-direction:
            column !important;

        gap:
            5px !important;

        padding:
            12px 0 !important;
    }

}


/* ==========================================================================
   VERY SMALL MOBILE
   ========================================================================== */

@media (max-width: 380px) {

    .dm-site-footer-container {
        width:
            calc(100% - 22px) !important;
    }


    .dm-site-footer-links {
        gap:
            4px 18px !important;
    }

}


/* ==========================================================================
   ACCESSIBILITY
   ========================================================================== */

.dm-site-footer a:focus-visible,
.dm-app-footer a:focus-visible {
    outline:
        3px solid rgba(103, 232, 249, .72) !important;

    outline-offset:
        3px !important;
}


@media (prefers-reduced-motion: reduce) {

    .dm-site-footer *,
    .dm-site-footer *::before,
    .dm-site-footer *::after,
    .dm-app-footer *,
    .dm-app-footer *::before,
    .dm-app-footer *::after {
        transition:
            none !important;
    }

}

/* ==========================================================================
   FINAL MOBILE FOOTER HEIGHT FIX
   Prevents legacy/global footer rules from creating a large empty area
   between the brand and the navigation links.
   ========================================================================== */

@media (max-width: 820px) {

    html body .dm-site-footer {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body .dm-site-footer-container {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body .dm-site-footer-main {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        gap: 18px !important;

        margin: 0 !important;
        padding: 24px 0 18px !important;
    }

    html body .dm-site-footer-brand {
        display: block !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    html body .dm-site-footer-links {
        display: grid !important;

        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;

        align-content: start !important;
        justify-content: start !important;
    }

    html body .dm-site-footer-community,
    html body .dm-site-footer-bottom {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
}


@media (max-width: 600px) {

    html body .dm-site-footer-main {
        gap: 16px !important;
        padding-top: 22px !important;
        padding-bottom: 16px !important;
    }

    html body .dm-site-footer-links {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 4px 24px !important;
    }

    html body .dm-site-footer-community {
        margin: 0 !important;
        padding: 13px 0 !important;
    }

    html body .dm-site-footer-bottom {
        margin: 0 !important;
        padding: 13px 0 16px !important;
    }
}

/* ==========================================================================
   CRITICAL MOBILE FLEX-BASIS FIX
   The desktop brand uses flex-basis: 430px. When the footer switches to
   flex-direction: column on mobile, that 430px becomes vertical space.
   Reset it here so the footer collapses to its real content height.
   ========================================================================== */

@media (max-width: 820px) {

    html body .dm-site-footer .dm-site-footer-brand {
        flex: 0 0 auto !important;
        flex-basis: auto !important;

        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    html body .dm-site-footer .dm-site-footer-main {
        height: auto !important;
        min-height: 0 !important;

        justify-content: flex-start !important;
        align-content: flex-start !important;
    }

    html body .dm-site-footer .dm-site-footer-links {
        flex: 0 0 auto !important;
        flex-basis: auto !important;
    }
}

/* ==========================================================================
   ALVARO DE BARTOLO FOOTER BRAND LINK
   ========================================================================== */

.dm-footer-alvaro-link,
.dm-footer-alvaro-link:link,
.dm-footer-alvaro-link:visited {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    padding: 3px 4px !important;

    border-radius: 10px !important;

    background: rgba(255, 255, 255, .025) !important;

    border: 1px solid rgba(255, 255, 255, .06) !important;

    text-decoration: none !important;

    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease !important;
}

.dm-footer-alvaro-link:hover,
.dm-footer-alvaro-link:focus-visible {
    transform: translateY(-1px) !important;

    border-color: rgba(110, 125, 255, .22) !important;

    background: rgba(93, 83, 230, .06) !important;
}

.dm-footer-alvaro-logo {
    display: block !important;

    width: auto !important;
    height: 28px !important;

    min-width: 0 !important;
    min-height: 0 !important;

    max-width: 150px !important;
    max-height: 28px !important;

    object-fit: contain !important;
}


/* The bottom row now contains copyright only. */
.dm-site-footer-bottom {
    justify-content: flex-start !important;
}


@media (max-width: 600px) {

    .dm-footer-alvaro-logo {
        height: 26px !important;
        max-height: 26px !important;
        max-width: 142px !important;
    }

}