/*========================================================================

TENET SOLUTIONS FRAMEWORK

--------------------------------------------------------------------------

Project     : Tenet Solutions Website
File        : footer.css
Author      : Tenet Solutions (Technical Partner & Solutions Architect)
Signature   : Designed & Engineered with Intent.

All Rights Reserved. Copyright 2026

========================================================================*/

.ts-footer{

    position:relative;

    overflow:hidden;

    padding:120px 0 50px;

    background:#010d23;

    color:#ffffff;

}



/*==========================================================
    BACKGROUND DETAILS
==========================================================*/

.ts-footer::before{

    content:"";

    position:absolute;

    inset:0;

    pointer-events:none;

    background:

        radial-gradient(

            circle at top center,

            rgba(146,215,248,.08),

            transparent 48%

        );

}

.ts-footer::after{

    content:"";

    position:absolute;

    width:700px;

    height:700px;

    right:-320px;

    bottom:-320px;

    border-radius:50%;

    background:

        radial-gradient(

            rgba(146,215,248,.05),

            transparent 72%

        );

    pointer-events:none;

}



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

.ts-footer .container{

    position:relative;

    z-index:2;

}



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

.ts-footer-brand{

    max-width:620px;

    margin:0 auto 70px;

}



/*==========================================================
    LOGO
==========================================================*/

.ts-footer-logo{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    width:96px;

    height:96px;

    margin-bottom:30px;

    transition:

        transform .35s ease,

        filter .35s ease;

}

.ts-footer-logo img{

    width:100%;

    height:auto;

    display:block;

}

.ts-footer-logo:hover{

    transform:

        translateY(-3px)

        rotate(2deg);

    filter:

        drop-shadow(

            0 14px 26px

            rgba(146,215,248,.28)

        );

}



/*==========================================================
    INTRODUCTION
==========================================================*/

.ts-footer-intro{

    max-width:560px;

    margin:0 auto;

    color:rgba(255,255,255,.78);

    font-size:1.05rem;

    line-height:1.9;

}



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

.ts-footer-values{

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:18px;

    margin-top:34px;

}

.ts-footer-values span{

    position:relative;

    color:#92d7f8;

    font-weight:600;

    letter-spacing:.05em;

}

.ts-footer-values span:not(:last-child)::after{

    content:"";

    position:absolute;

    top:50%;

    right:-10px;

    width:4px;

    height:4px;

    border-radius:50%;

    background:#92d7f8;

    transform:translateY(-50%);

}



/*==========================================================
    DIVIDER
==========================================================*/

.ts-footer-divider{

    width:100%;

    height:1px;

    margin:0 0 70px;

    background:

        linear-gradient(

            to right,

            transparent,

            rgba(146,215,248,.45),

            transparent

        );

}

/*==========================================================
    FOOTER COLUMNS
==========================================================*/

.ts-footer-column{

    margin-bottom:40px;

}

.ts-footer-column h5{

    position:relative;

    display:inline-block;

    margin-bottom:28px;

    padding-bottom:12px;

    color:#ffffff;

    font-size:1.15rem;

    font-weight:700;

    letter-spacing:.03em;

}

.ts-footer-column h5::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:42px;

    height:3px;

    border-radius:999px;

    background:#92d7f8;

}



/*==========================================================
    FOOTER LISTS
==========================================================*/

.ts-footer-column ul{

    margin:0;

    padding:0;

    list-style:none;

}

.ts-footer-column li{

    margin-bottom:16px;

}

.ts-footer-column li:last-child{

    margin-bottom:0;

}



/*==========================================================
    FOOTER LINKS
==========================================================*/

.ts-footer-column a{

    display:inline-flex;

    align-items:center;

    color:rgba(255,255,255,.72);

    text-decoration:none;

    transition:

        color .30s ease,

        padding-left .30s ease,

        transform .30s ease;

}

.ts-footer-column a::before{

    content:"→";

    margin-right:10px;

    opacity:0;

    transform:translateX(-8px);

    transition:

        opacity .30s ease,

        transform .30s ease;

}

.ts-footer-column a:hover{

    color:#92d7f8;

    padding-left:8px;

}

.ts-footer-column a:hover::before{

    opacity:1;

    transform:translateX(0);

}



/*==========================================================
    CONTACT LIST
==========================================================*/

.ts-footer-contact{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.ts-footer-contact li{

    display:flex;

    align-items:flex-start;

    gap:14px;

    margin:0;

    color:rgba(255,255,255,.72);

    line-height:1.8;

}

.ts-footer-contact i{

    width:42px;

    height:42px;

    flex-shrink:0;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:14px;

    background:rgba(146,215,248,.12);

    color:#92d7f8;

    font-size:1rem;

    transition:

        transform .30s ease,

        background .30s ease;

}

.ts-footer-contact li:hover i{

    transform:translateY(-3px);

    background:rgba(146,215,248,.20);

}

.ts-footer-contact a{

    padding:0 !important;

}

.ts-footer-contact a::before{

    display:none;

}

.ts-footer-contact a:hover{

    color:#92d7f8;

}



/*==========================================================
    FOOTER GRID SPACING
==========================================================*/

.ts-footer .row.gy-5{

    margin-bottom:70px;

}

/*==========================================================
    FOOTER BOTTOM
==========================================================*/

.ts-footer-bottom{

    text-align:center;

}



/*==========================================================
    PHILOSOPHY
==========================================================*/

.ts-footer-philosophy{

    margin:0;

    color:#92d7f8;

    font-size:1.15rem;

    font-weight:600;

    letter-spacing:.04em;

}



/*==========================================================
    COPYRIGHT
==========================================================*/

.ts-footer-copyright{

    margin:22px 0 12px;

    color:rgba(255,255,255,.65);

    font-size:.95rem;

    line-height:1.8;

}



/*==========================================================
    SIGNATURE
==========================================================*/

.ts-footer-signature{

    display:inline-block;

    position:relative;

    margin:0;

    padding-top:22px;

    color:#ffffff;

    font-size:.95rem;

    font-weight:600;

    letter-spacing:.08em;

    text-transform:uppercase;

}

.ts-footer-signature::before{

    content:"";

    position:absolute;

    top:0;

    left:50%;

    width:70px;

    height:2px;

    border-radius:999px;

    transform:translateX(-50%);

    background:

        linear-gradient(

            to right,

            transparent,

            #92d7f8,

            transparent

        );

}



/*==========================================================
    MICRO INTERACTIONS
==========================================================*/

.ts-footer-column a,

.ts-footer-contact a,

.ts-footer-logo{

    will-change:

        transform,

        color;

}

.ts-footer-column a:focus-visible,

.ts-footer-contact a:focus-visible{

    outline:2px solid #92d7f8;

    outline-offset:6px;

    border-radius:6px;

}



/*==========================================================
    FOOTER FADE
==========================================================*/

.ts-footer{

    animation:

        footerFade .8s ease;

}

@keyframes footerFade{

    from{

        opacity:0;

        transform:translateY(20px);

    }

    to{

        opacity:1;

        transform:none;

    }

}



/*==========================================================
    SUBTLE GLOW
==========================================================*/

.ts-footer-logo img{

    transition:

        transform .35s ease,

        filter .35s ease;

}

.ts-footer-logo:hover img{

    filter:

        drop-shadow(

            0 10px 22px

            rgba(146,215,248,.20)

        );

}



/*==========================================================
    SELECTION
==========================================================*/

.ts-footer ::selection{

    background:#92d7f8;

    color:#010d23;

}

/*==========================================================
    RESPONSIVE
==========================================================*/

@media(max-width:991px){

    .ts-footer{

        padding:90px 0 45px;

    }

    .ts-footer-brand{

        margin-bottom:55px;

    }

    .ts-footer-divider{

        margin-bottom:55px;

    }

    .ts-footer .row.gy-5{

        margin-bottom:55px;

    }

    .ts-footer-column{

        text-align:center;

    }

    .ts-footer-column h5::after{

        left:50%;

        transform:translateX(-50%);

    }

    .ts-footer-contact{

        align-items:center;

    }

    .ts-footer-contact li{

        justify-content:center;

        text-align:center;

    }

}



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

@media(max-width:767px){

    .ts-footer{

        padding:75px 0 40px;

    }

    .ts-footer-logo{

        width:82px;

        height:82px;

        margin-bottom:24px;

    }

    .ts-footer-intro{

        font-size:1rem;

        line-height:1.8;

    }

    .ts-footer-values{

        flex-direction:column;

        gap:10px;

    }

    .ts-footer-values span::after{

        display:none;

    }

    .ts-footer-column{

        margin-bottom:35px;

    }

    .ts-footer-column h5{

        margin-bottom:22px;

    }

    .ts-footer-contact li{

        flex-direction:column;

        gap:10px;

    }

    .ts-footer-contact i{

        margin-bottom:2px;

    }

    .ts-footer-philosophy{

        font-size:1rem;

        line-height:1.8;

    }

    .ts-footer-copyright{

        font-size:.90rem;

    }

    .ts-footer-signature{

        font-size:.82rem;

        letter-spacing:.10em;

    }

}



/*==========================================================
    REDUCED MOTION
==========================================================*/

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

    .ts-footer *{

        animation:none !important;

        transition:none !important;

        scroll-behavior:auto !important;

    }

}



/*==========================================================
    FINAL POLISH
==========================================================*/

.ts-footer a{

    -webkit-tap-highlight-color:transparent;

}

.ts-footer img{

    user-select:none;

    -webkit-user-drag:none;

}

.ts-footer *{

    box-sizing:border-box;

}