/* ==========================================================================
   CAPPS Brand-First Enterprise Dark Footer
   File: assets/css/portages/footer_global.css
   ========================================================================== */

:root {
    --capps-light: #7ec8e3;
    --capps-primary: #3a9bdc;
    --capps-dark: #1f6fa5;
    --capps-gradient: linear-gradient(135deg, #7ec8e3 0%, #3a9bdc 100%);
    --capps-bg-deep: #070e17;
    --capps-bg-card: rgba(15, 30, 48, 0.75);
    --capps-border-subtle: rgba(126, 200, 227, 0.18);
    --capps-border-glow: rgba(58, 155, 220, 0.5);
    --capps-text-head: #ffffff;
    --capps-text-body: #94a3b8;
    --capps-text-muted: #64748b;
    --capps-transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Base Canvas */
html body #footer_div,
html body #footer_div.section,
html body #footer_div.section-shaped,
div#footer_div {
    position: relative !important;
    isolation: isolate !important;
    background: var(--capps-bg-deep) !important;
    background-image: radial-gradient(ellipse at 15% 0%, rgba(126, 200, 227, 0.12) 0%, transparent 60%), radial-gradient(ellipse at 85% 100%, rgba(58, 155, 220, 0.15) 0%, transparent 60%) !important;
    color: var(--capps-text-body) !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-top: 1px solid var(--capps-border-subtle) !important;
    box-shadow: 0 -25px 50px rgba(0, 0, 0, 0.7) !important;
}

    /* Remove legacy background shape */
    html body #footer_div > .shape,
    html body #footer_div .shape {
        display: none !important;
    }

    /* CAPPS Cyan-Blue Top Accent Beam */
    html body #footer_div::before {
        content: "" !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        height: 3px !important;
        background: var(--capps-gradient) !important;
        z-index: 10 !important;
        box-shadow: 0 0 15px rgba(126, 200, 227, 0.6) !important;
    }

    /* Inner Container */
    html body #footer_div .container.portages_footer_bloc {
        position: relative !important;
        z-index: 2 !important;
        max-width: 1280px !important;
        width: 100% !important;
        margin: 0 auto !important;
        padding: 80px 32px 32px !important;
    }

        /* Column Grid */
        html body #footer_div .container.portages_footer_bloc > .row:first-of-type {
            display: grid !important;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
            gap: 48px 36px !important;
            margin: 0 0 48px !important;
            padding-bottom: 48px !important;
            border-bottom: 1px solid var(--capps-border-subtle) !important;
        }

    html body #footer_div .portages_footer_bloc_8 {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
    }

    /* Column Titles */
    html body #footer_div p.portages_footer_bloc_20 {
        font-family: "Inter", system-ui, -apple-system, sans-serif !important;
        font-size: 0.8125rem !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.14em !important;
        color: var(--capps-light) !important;
        margin: 0 0 24px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

        html body #footer_div p.portages_footer_bloc_20::after {
            content: "" !important;
            display: block !important;
            width: 20px !important;
            height: 2px !important;
            background: var(--capps-gradient) !important;
            border-radius: 2px !important;
        }

    /* Navigation Links */
    html body #footer_div p.portages_footer_bloc_14 {
        font-family: "Inter", system-ui, -apple-system, sans-serif !important;
        font-size: 0.9375rem !important;
        font-weight: 400 !important;
        color: var(--capps-text-body) !important;
        margin: 0 !important;
        padding: 8px 0 !important;
        transition: var(--capps-transition) !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    html body #footer_div a {
        text-decoration: none !important;
    }

        html body #footer_div a:hover p.portages_footer_bloc_14 {
            color: var(--capps-text-head) !important;
            transform: translateX(6px) !important;
            text-shadow: 0 0 10px rgba(126, 200, 227, 0.4) !important;
        }

    /* CAPPS Glassmorphic Contact Card */
    html body #footer_div section.portages_footer_bloc_9 {
        background: var(--capps-bg-card) !important;
        border: 1px solid var(--capps-border-subtle) !important;
        border-radius: 24px !important;
        padding: 36px !important;
        margin-bottom: 40px !important;
        backdrop-filter: blur(16px) !important;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4) !important;
        transition: var(--capps-transition) !important;
    }

        html body #footer_div section.portages_footer_bloc_9:hover {
            border-color: var(--capps-border-glow) !important;
            box-shadow: 0 24px 48px -10px rgba(58, 155, 220, 0.3) !important;
        }

    /* CAPPS Branding Custom Styling */
    html body #footer_div .capps-footer-brand {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
        margin-bottom: 24px !important;
        text-decoration: none !important;
    }

    html body #footer_div img.capps-logo-main {
        width: auto !important;
        height: 42px !important;
        max-width: 100% !important;
        filter: drop-shadow(0 0 12px rgba(126, 200, 227, 0.3)) !important;
    }

    html body #footer_div .capps-footer-tagline {
        font-size: 0.85rem !important;
        color: var(--capps-text-body) !important;
        line-height: 1.4 !important;
    }

        html body #footer_div .capps-footer-tagline strong {
            color: var(--capps-light) !important;
            font-weight: 600 !important;
        }

    /* Contact Info Items */
    html body #footer_div .portages_footer_bloc_17,
    html body #footer_div .portages_footer_bloc_16 {
        font-size: 0.95rem !important;
        color: var(--capps-text-body) !important;
        display: flex !important;
        align-items: center !important;
        gap: 16px !important;
        margin-bottom: 14px !important;
    }

        html body #footer_div .portages_footer_bloc_17 a,
        html body #footer_div .portages_footer_bloc_16 a,
        html body #footer_div .portages_footer_bloc_16 span {
            color: var(--capps-text-head) !important;
            transition: var(--capps-transition) !important;
        }

            html body #footer_div .portages_footer_bloc_17 a:hover,
            html body #footer_div .portages_footer_bloc_16 a:hover {
                color: var(--capps-light) !important;
                text-decoration: none !important;
            }

    /* Icon Badges */
    html body #footer_div img.portages_footer_bloc_6,
    html body #footer_div img.portages_footer_bloc_7 {
        width: 18px !important;
        height: 18px !important;
        padding: 8px !important;
        box-sizing: content-box !important;
        background: rgba(126, 200, 227, 0.08) !important;
        border: 1px solid rgba(126, 200, 227, 0.2) !important;
        border-radius: 10px !important;
        filter: brightness(0) saturate(100%) invert(80%) sepia(30%) saturate(1000%) hue-rotate(160deg) !important;
        transition: var(--capps-transition) !important;
    }

    html body #footer_div .portages_footer_bloc_17:hover img.portages_footer_bloc_6,
    html body #footer_div .portages_footer_bloc_16:hover img.portages_footer_bloc_7 {
        filter: brightness(0) invert(1) !important;
        border-color: transparent !important;
        box-shadow: 0 0 14px rgba(58, 155, 220, 0.6) !important;
        transform: scale(1.1) !important;
    }

    /* Bottom Bar */
    html body #footer_div .container.portages_footer_bloc > .row.items-center.mt-4 {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 20px !important;
        margin-top: 24px !important;
        padding: 20px 24px !important;
        background: rgba(255, 255, 255, 0.02) !important;
        border: 1px solid var(--capps-border-subtle) !important;
        border-radius: 14px !important;
    }

    html body #footer_div .portages_footer_bloc_2 p {
        font-size: 0.875rem !important;
        color: var(--capps-text-muted) !important;
        margin: 0 !important;
    }

    html body #footer_div .portages_footer_bloc_13 {
        display: flex !important;
        gap: 24px !important;
        flex-wrap: wrap !important;
    }

        html body #footer_div .portages_footer_bloc_13 a {
            font-size: 0.875rem !important;
            color: var(--capps-text-body) !important;
            transition: var(--capps-transition) !important;
        }

            html body #footer_div .portages_footer_bloc_13 a:hover {
                color: var(--capps-light) !important;
                text-decoration: none !important;
            }

/* Responsive Rules */
@media (max-width: 768px) {
    html body #footer_div .container.portages_footer_bloc {
        padding: 60px 20px 24px !important;
    }

        html body #footer_div .container.portages_footer_bloc > .row.items-center.mt-4 {
            flex-direction: column !important;
            align-items: flex-start !important;
        }

    html body #footer_div .portages_footer_bloc_13 {
        flex-direction: column !important;
        gap: 12px !important;
    }
}