/*=========================================
Footer
=========================================*/

.bilin-footer{

    position:relative;

    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(0,143,114,.20),
            transparent 30%
        ),
        radial-gradient(
            circle at 8% 82%,
            rgba(240,90,40,.12),
            transparent 28%
        ),
        #102A43;

    color:#fff;

    padding:58px 0 24px;

}


/*=========================================
Footer Main Grid
=========================================*/

.footer-grid{

    display:grid;

    grid-template-columns:
        1.45fr
        .95fr
        1fr
        2fr;

    gap:32px;

    margin-bottom:40px;

    align-items:start;

}


/*=========================================
Footer Columns
=========================================*/

.footer-column{

    min-width:0;

}

.footer-column h3{

    position:relative;

    margin:0 0 20px;

    padding-bottom:11px;

    font-size:20px;

    line-height:1.5;

    font-weight:700;

    color:#fff;

}

.footer-column h3::after{

    content:"";

    position:absolute;

    right:0;

    bottom:0;

    width:44px;

    height:3px;

    border-radius:4px;

    background:#F05A28;

}


/*=========================================
Brand / Trust Column
=========================================*/

.footer-column:first-child{

    padding:24px;

    border:1px solid rgba(255,255,255,.12);

    border-radius:16px;

    background:
        linear-gradient(
            145deg,
            rgba(0,143,114,.18),
            rgba(255,255,255,.035)
        );

    box-shadow:
        0 14px 35px rgba(0,0,0,.12);

}

.footer-column:first-child h3{

    margin-bottom:17px;

    padding-bottom:13px;

    font-size:23px;

}

.footer-column:first-child h3::after{

    width:55px;

    height:4px;

    background:#008F72;

}

.footer-column:first-child p{

    margin-bottom:0;

    font-size:15.5px;

    line-height:2.05;

    color:rgba(255,255,255,.88);

}


/*=========================================
Footer Text
=========================================*/

.footer-column p{

    margin:0 0 15px;

    font-size:15.5px;

    line-height:2;

    color:rgba(255,255,255,.86);

}

.footer-column strong{

    color:#fff;

    font-weight:700;

}


/*=========================================
Navigation / Services Lists
=========================================*/

.footer-column ul{

    display:grid;

    grid-template-columns:1fr;

    gap:9px;

    margin:0;

    padding:0;

    list-style:none;

}

.footer-column li{

    margin:0;

}


/*=========================================
Navigation Buttons
=========================================*/

.footer-column li a{

    display:flex;

    align-items:center;

    justify-content:flex-start;

    min-height:44px;

    width:100%;

    box-sizing:border-box;

    padding:8px 11px;

    border:1px solid rgba(255,255,255,.12);

    border-radius:9px;

    background:rgba(255,255,255,.055);

    color:rgba(255,255,255,.88);

    text-decoration:none;

    font-size:14.5px;

    line-height:1.5;

    transition:
        background .25s ease,
        border-color .25s ease,
        color .25s ease,
        transform .25s ease,
        box-shadow .25s ease;

}

.footer-column li a::before{

    content:"›";

    flex:0 0 auto;

    display:flex;

    align-items:center;

    justify-content:center;

    width:21px;

    height:21px;

    margin-left:7px;

    border-radius:50%;

    background:rgba(0,143,114,.22);

    color:#66D6C0;

    font-size:15px;

    line-height:1;

    transition:
        background .25s ease,
        color .25s ease;

}

.footer-column li a:hover{

    background:
        linear-gradient(
            135deg,
            rgba(0,143,114,.25),
            rgba(255,255,255,.08)
        );

    border-color:rgba(0,143,114,.55);

    color:#fff;

    transform:translateY(-2px);

    box-shadow:
        0 7px 18px rgba(0,0,0,.12);

}

.footer-column li a:hover::before{

    background:#008F72;

    color:#fff;

}


/*=========================================
Official Translation Button
=========================================*/

.footer-column li a[href*="ترجمه-رسمی"]{

    border-color:rgba(240,90,40,.38);

    background:
        linear-gradient(
            135deg,
            rgba(240,90,40,.15),
            rgba(245,158,11,.08)
        );

}

.footer-column li a[href*="ترجمه-رسمی"]::before{

    background:rgba(240,90,40,.22);

    color:#FF9A7D;

}

.footer-column li a[href*="ترجمه-رسمی"]:hover{

    border-color:#F05A28;

    background:
        linear-gradient(
            135deg,
            rgba(240,90,40,.28),
            rgba(245,158,11,.14)
        );

}

.footer-column li a[href*="ترجمه-رسمی"]:hover::before{

    background:#F05A28;

    color:#fff;

}


/*=========================================
General Footer Links
=========================================*/

.footer-column a{

    color:rgba(255,255,255,.86);

    text-decoration:none;

    transition:
        color .25s ease,
        opacity .25s ease;

}

.footer-column a:hover{

    color:#F59E0B;

}


/*=========================================
Contact Column
=========================================*/

.footer-column:last-child{

    padding-right:4px;

}

.footer-column:last-child p{

    margin-bottom:12px;

}

.footer-column:last-child strong{

    color:#fff;

}


/*=========================================
Map Route Button
=========================================*/

.footer-column a[href*="maps.app.goo.gl"]{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    margin-top:5px;

    padding:9px 15px;

    border:1px solid rgba(245,158,11,.55);

    border-radius:8px;

    background:
        linear-gradient(
            135deg,
            rgba(245,158,11,.18),
            rgba(240,90,40,.12)
        );

    color:#fff;

    font-size:14.5px;

    font-weight:600;

    box-shadow:
        0 6px 18px rgba(0,0,0,.10);

    transition:
        background .25s ease,
        border-color .25s ease,
        transform .25s ease,
        box-shadow .25s ease;

}

.footer-column a[href*="maps.app.goo.gl"]:hover{

    background:
        linear-gradient(
            135deg,
            rgba(245,158,11,.30),
            rgba(240,90,40,.22)
        );

    border-color:#F59E0B;

    color:#fff;

    transform:translateY(-2px);

    box-shadow:
        0 9px 22px rgba(0,0,0,.18);

}


/*=========================================
Map
=========================================*/

.footer-map{

    position:relative;

    overflow:hidden;

    width:100%;

    margin-top:6px;

    border:1px solid rgba(255,255,255,.16);

    border-radius:16px;

    background:#042F3D;

    box-shadow:
        0 15px 38px rgba(0,0,0,.20);

}

.footer-map::before{

    content:"موقعیت دفتر بیلین";

    position:absolute;

    z-index:2;

    top:14px;

    right:14px;

    padding:7px 12px;

    border:1px solid rgba(255,255,255,.14);

    border-radius:7px;

    background:rgba(6,59,76,.88);

    color:#fff;

    font-size:13px;

    font-weight:600;

    pointer-events:none;

    backdrop-filter:blur(5px);

}

.footer-map iframe{

    display:block;

    width:100%;

    height:230px;

    border:0;

    border-radius:15px;

}


/*=========================================
Footer Bottom
=========================================*/

.footer-bottom{

    width:100%;

    margin-top:34px;

    padding-top:20px;

    border-top:1px solid rgba(255,255,255,.14);

    text-align:center;

}

.footer-bottom p{

    display:block;

    width:100%;

    margin:0;

    padding:0;

    color:rgba(255,255,255,.78);

    font-size:14px;

    line-height:1.9;

    text-align:center;

}


/*=========================================
Tablet
=========================================*/

@media(max-width:1100px){

    .footer-grid{

        grid-template-columns:
            1.3fr
            1fr
            1fr;

        gap:30px;

    }

    .footer-column:last-child{

        grid-column:1 / -1;

    }

    .footer-map iframe{

        height:260px;

    }

}


/*=========================================
Tablet Small
=========================================*/

@media(max-width:992px){

    .bilin-footer{

        padding:48px 0 22px;

    }

    .footer-grid{

        grid-template-columns:1fr 1fr;

        gap:30px;

        margin-bottom:34px;

    }

    .footer-column:last-child{

        grid-column:1 / -1;

    }

    .footer-map iframe{

        height:270px;

    }

}


/*=========================================
Mobile
=========================================*/

@media(max-width:600px){

    .bilin-footer{

        padding:40px 0 18px;

    }

    .footer-grid{

        grid-template-columns:1fr;

        gap:26px;

    }

    .footer-column:last-child{

        grid-column:auto;

    }

    .footer-column:first-child{

        padding:20px;

        border-radius:13px;

    }

    .footer-column:first-child h3{

        font-size:21px;

    }

    .footer-column h3{

        font-size:19px;

        margin-bottom:17px;

    }

    .footer-column p{

        font-size:15px;

        line-height:1.95;

    }

    .footer-column ul{

        grid-template-columns:1fr;

        gap:8px;

    }

    .footer-column li a{

        min-height:43px;

        padding:8px 10px;

        font-size:14px;

    }

    .footer-map{

        margin-top:0;

        border-radius:13px;

    }

    .footer-map::before{

        top:10px;

        right:10px;

        font-size:12px;

        padding:6px 10px;

    }

    .footer-map iframe{

        height:220px;

        border-radius:12px;

    }

    .footer-bottom{

        margin-top:25px;

        padding-top:16px;

    }

    .footer-bottom p{

        font-size:12.5px;

        line-height:1.9;

    }

}