/*
|--------------------------------------------------------------------------
| Parham Prism Footer
|--------------------------------------------------------------------------
| Footer Component
|--------------------------------------------------------------------------
*/


/*==========================================================
Footer Wrapper
==========================================================*/


.prism-footer{

    position:relative;

    margin-top:20px;

    overflow:hidden;

    background:
        var(--prism-surface);

    color:
        var(--prism-text);

}



/*==========================================================
Top Decorative Line
==========================================================*/


.prism-footer::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:3px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--prism-primary),
            #d4af37,
            var(--prism-primary),
            transparent
        );

    box-shadow:

        0 0 25px rgba(15,76,58,.45);

}



/*==========================================================
Glow Background
==========================================================*/


.prism-footer::after{

    content:"";

    position:absolute;

    top:-180px;

    right:50%;

    transform:translateX(50%);

    width:700px;

    height:300px;

    background:

        radial-gradient(
            circle,
            rgba(15,76,58,.18),
            transparent 70%
        );

    pointer-events:none;

}



/*==========================================================
Decoration Lines
==========================================================*/


.prism-footer-decoration{

    position:absolute;

    top:0;

    left:50%;

    transform:translateX(-50%);

    width:420px;

    height:60px;

    border-radius:0 0 50% 50%;

    border-bottom:

        1px solid rgba(212,175,55,.35);

    opacity:.8;

}





/*==========================================================
Main Grid
==========================================================*/


.prism-footer-grid{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:

        2fr 1fr 1fr 1fr;

    gap:50px;

    padding-block:80px;

}



/*==========================================================
Brand
==========================================================*/


.prism-footer-brand{

    display:flex;

    flex-direction:column;

    gap:18px;

}



.prism-footer-logo{

    font-family:"Rokh",sans-serif;

    font-size:32px;

    font-weight:700;

    color:

        var(--prism-text);

    text-decoration:none;

}



.prism-footer-description{

    max-width:350px;

    line-height:2;

    color:

        var(--prism-text-soft);

}



/*==========================================================
Columns
==========================================================*/


.prism-footer-column{

    display:flex;

    flex-direction:column;

    gap:15px;

}



.prism-footer-column h3{

    margin-bottom:15px;

    font-size:18px;

    color:

        var(--prism-text);

}



.prism-footer-column a{

    color:

        var(--prism-text-soft);

    text-decoration:none;

    transition:.3s;

}



.prism-footer-column a:hover{

    color:

        var(--prism-primary);

    transform:translateX(-5px);

}



/*==========================================================
Social
==========================================================*/


.prism-footer-social{

    display:flex;

    gap:12px;

}



.prism-footer-social a{

    width:42px;

    height:42px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;


    background:

        var(--prism-surface-soft);


    border:

        1px solid var(--prism-border);


    transition:.3s;

}



.prism-footer-social a:hover{

    background:

        var(--prism-primary);

    color:#fff;

    transform:

        translateY(-5px);

}



/*==========================================================
Bottom
==========================================================*/


.prism-footer-bottom{


    position:relative;

    z-index:2;


    padding-block:25px;


    border-top:

        1px solid var(--prism-border);


    display:flex;

    justify-content:center;


    color:

        var(--prism-text-muted);


    font-size:14px;

}



/*==========================================================
Dark Mode
==========================================================*/


[data-theme="dark"] .prism-footer{

    background:#101615;

}



/*==========================================================
Responsive
==========================================================*/


@media(max-width:1024px){


    .prism-footer-grid{

        grid-template-columns:

            repeat(2,1fr);

    }


}



@media(max-width:768px){


    .prism-footer-grid{

        grid-template-columns:

            1fr;

        padding-block:50px;

    }


    .prism-footer-logo{

        font-size:26px;

    }


}

/* ==========================================
   Footer Social Icons
========================================== */

.prism-footer-social{

    display:flex;

    align-items:center;

    gap:12px;

    margin-top:25px;

}


.prism-footer-social a{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:rgba(15,76,58,.08);

    border:1px solid var(--prism-border);

    color:var(--prism-primary);

    transition:.3s;

}


.prism-footer-social a svg{

    width:20px;

    height:20px;

    fill:none;

    stroke:currentColor;

    stroke-width:2;

    stroke-linecap:round;

    stroke-linejoin:round;

}


.prism-footer-social a:hover{

    transform:translateY(-4px);

    background:var(--prism-primary);

    color:#fff;

    box-shadow:
    0 10px 25px rgba(15,76,58,.25);

}

/* Footer Brand Position */


.prism-footer-logo{

    display:inline-flex;

    align-items:center;

}



.prism-footer-description{

    max-width:340px;

}



@media(max-width:768px){

    .prism-footer-brand{

        transform:none;

        padding-left:0;

    }

}

/* Newsletter */

.prism-footer-newsletter{

    margin-top:50px;

    padding:35px;

    border-radius:28px;

    background:
    linear-gradient(
        135deg,
        rgba(15,76,58,.12),
        rgba(212,175,55,.08)
    );

    border:
    1px solid var(--prism-border);

}



.newsletter-content{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

}



.newsletter-text h3{

    margin:0 0 10px;

    font-size:24px;

}



.newsletter-text p{

    color:
    var(--prism-text-soft);

}



.newsletter-form{

    display:flex;

    gap:12px;

}



.newsletter-form input{

    width:280px;

    height:48px;

    border-radius:14px;

    border:
    1px solid var(--prism-border);

    padding:0 18px;

    background:
    var(--prism-surface);

}



.newsletter-form button{

    height:48px;

    padding:0 28px;

    border:none;

    border-radius:14px;

    background:
    var(--prism-primary);

    color:white;

    cursor:pointer;

}



.newsletter-form button:hover{

    opacity:.9;

}



@media(max-width:768px){

    .newsletter-content{

        flex-direction:column;

        align-items:stretch;

    }


    .newsletter-form{

        flex-direction:column;

    }


    .newsletter-form input{

        width:100%;

    }

}

/* Footer Brand Link */

.prism-footer-brand-link{

    color:
        var(--prism-primary);

    font-weight:800;

    text-decoration:none;

    transition:.3s;

}



.prism-footer-brand-link:hover{

    color:
        var(--prism-accent);

    text-decoration:underline;

}

/* ==================================================
   Scroll To Top Button
================================================== */


.prism-scroll-top{

    position:fixed;

    left:32px;

    bottom:32px;


    width:52px;

    height:52px;


    display:flex;

    align-items:center;

    justify-content:center;


    border-radius:50%;


    background:
        var(--prism-surface);


    color:
        var(--prism-primary);


    border:
        1px solid var(--prism-border);


    box-shadow:
        0 20px 50px rgba(0,0,0,.18);


    cursor:pointer;


    opacity:0;

    visibility:hidden;


    transform:
        translateY(20px);


    transition:
        .35s ease;


    z-index:9999;

}



.prism-scroll-top svg{

    width:24px;

    height:24px;


    fill:none;

    stroke:currentColor;

    stroke-width:2;

    stroke-linecap:round;

    stroke-linejoin:round;

}



.prism-scroll-top:hover{

    background:
        var(--prism-primary);


    color:#fff;


    transform:
        translateY(-4px);

}



.prism-scroll-top.show{

    opacity:1;

    visibility:visible;


    transform:
        translateY(0);

}





/* Mobile */

@media(max-width:768px){


    .prism-scroll-top{

        left:20px;

        bottom:20px;


        width:46px;

        height:46px;

    }


    .prism-scroll-top svg{

        width:21px;

        height:21px;

    }


}

/* ==================================================
   Footer Brand Social Layout
   Social icons beside description
================================================== */


.prism-footer-brand{

    display:grid;

    grid-template-columns:
        1fr auto;

    align-items:center;

    column-gap:35px;

}


/* Logo stays on top */

.prism-footer-logo{

    grid-column:1 / -1;

}



/* Description */

.prism-footer-description{

    grid-column:1;

    margin:0;

}



/* Social */

.prism-footer-social{

    grid-column:2;

    grid-row:2;

    display:flex;

    flex-direction:column;

    gap:14px;

    margin-top:0;

}



/* Icons */

.prism-footer-social a{

    width:42px;

    height:42px;

}



/* SVG */

.prism-footer-social svg{

    width:20px;

    height:20px;

}



/* Mobile */

@media(max-width:768px){

    .prism-footer-brand{

        display:flex;

        flex-direction:column;

        align-items:flex-start;

    }


    .prism-footer-social{

        flex-direction:row;

        margin-top:20px;

    }

}

/* ==================================================
   Footer Brand Fine Tune
================================================== */


/* Move text slightly left */

.prism-footer-description{

    transform:translateX(-25px);

}



/* Move social icons upward */

.prism-footer-social{

    transform:translateY(-18px);

}


/* Keep alignment clean */

.prism-footer-brand{

    column-gap:25px;

}



@media(max-width:768px){

    .prism-footer-description{

        transform:none;

    }


    .prism-footer-social{

        transform:none;

    }

}

/* ==================================================
   Footer Brand Final Layout
================================================== */


.prism-footer-brand{

    display:grid;

    grid-template-columns: 1fr 60px;

    align-items:start;

    gap:25px;

}


/* Logo + Text Area */

.prism-footer-brand > a,
.prism-footer-description{

    grid-column:1;

}


/* Logo Position Fix */

.prism-footer-brand > a{

    display:flex;

    justify-content:flex-start;

    width:100%;

}


.prism-footer-logo-image{

    width:150px;

    height:auto;

    object-fit:contain;

    transform:translateX(-30px);

}



/* Description */

.prism-footer-description{

    margin-top:10px;

    text-align:right;

    max-width:340px;

}



/* Social Right Side */

.prism-footer-social{

    grid-column:2;

    grid-row:1 / span 2;


    display:flex;

    flex-direction:column;

    align-items:center;

    gap:14px;


    margin-top:5px;

}



/* Social Buttons */

.prism-footer-social a{

    width:40px;

    height:40px;

}



/* Move brand slightly left */

@media(min-width:1025px){

    .prism-footer-brand{

        transform:translateX(-40px);

    }

}



/* Mobile */

@media(max-width:768px){

    .prism-footer-brand{

        display:flex;

        flex-direction:column;

        align-items:center;

        transform:none;

    }


    .prism-footer-social{

        flex-direction:row;

        margin-top:20px;

    }


    .prism-footer-description{

        text-align:center;

    }

}


/* ==================================================
   Footer Newsletter Spacing Fix
================================================== */


/* کاهش فاصله ستون های فوتر با خبرنامه */

.prism-footer-grid{

    padding-bottom:35px;

}



/* نزدیک شدن خبرنامه به منوها */

.prism-footer-newsletter{

    margin-top:15px;

}