/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Description: Custom V2K Media child theme for Astra
Author: V2K Media
Version: 1.0.0
Template: astra
Text Domain: astra-child
*/

/* Add child-theme-specific styles here. */


a {
    text-decoration: none;
}
/* =========================================================
   V2K MEDIA - PREMIUM FOOTER
   Brand Colors: Red #ED1C24 + Black + White
========================================================= */

.v2k-footer {
    position: relative;

    background:
        radial-gradient(
            circle at 85% 10%,
            rgba(237, 28, 36, 0.12),
            transparent 30%
        ),
        radial-gradient(
            circle at 10% 90%,
            rgba(237, 28, 36, 0.06),
            transparent 30%
        ),
        #0b0b0b;

    color: #ffffff;

    padding: 80px 0 30px;

    overflow: hidden;
}


/* Subtle background overlay */

.v2k-footer-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.015),
            transparent 50%
        );

    pointer-events: none;
}


/* Container */

.v2k-container {
    max-width: 1280px;

    margin: auto;

    padding: 0 25px;

    position: relative;

    z-index: 2;
}


/* =========================================================
   MAIN FOOTER GRID
========================================================= */

.v2k-footer-grid {

    display: grid;

    grid-template-columns:
        2fr
        1fr
        1fr
        1.3fr;

    gap: 55px;
}


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

.footer-logo img {

    max-width: 180px;

    margin-bottom: 20px;

    display: block;
}


.footer-about p {

    max-width: 430px;

    color: #fff;

    line-height: 1.8;

    font-size: 14px;

    margin: 0 0 25px;
}


/* =========================================================
   SOCIAL ICONS
========================================================= */

.footer-social {

    display: flex;

    gap: 10px;
}


.footer-social a {

    width: 40px;
    height: 40px;

    border-radius: 50%;

    display: flex;

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

    background: rgba(255,255,255,0.07);

    border: 1px solid rgba(255,255,255,0.10);

    color: #ffffff;

    text-decoration: none;

    transition:
        transform .3s ease,
        background .3s ease,
        border-color .3s ease,
        color .3s ease;
}


.footer-social a:hover {

    background: #ed1c24;

    border-color: #ed1c24;

    color: #ffffff;

    transform: translateY(-4px);
}


/* =========================================================
   HEADINGS
========================================================= */

.footer-links h3,
.footer-services h3,
.footer-contact h3 {

    margin: 0 0 22px;

    font-size: 15px;

    font-weight: 600;

    color: #ffffff;

    position: relative;
}


/* Small red line */

.footer-links h3::after,
.footer-services h3::after,
.footer-contact h3::after {

    content: "";

    display: block;

    width: 25px;
    height: 2px;

    background: #ed1c24;

    margin-top: 9px;
}


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

.footer-links ul,
.footer-services ul,
.footer-contact ul {

    list-style: none;

    padding: 0;

    margin: 0;
}


.footer-links li,
.footer-services li,
.footer-contact li {

    margin-bottom: 13px;
}


/* Links */

.footer-links a,
.footer-services a,
.footer-contact a,
.footer-contact span {

    color: #aaaaaa;

    text-decoration: none;

    font-size: 13px;

    transition:
        color .3s ease,
        padding-left .3s ease;
}


.footer-links a:hover,
.footer-services a:hover {

    color: #ed1c24;

    padding-left: 5px;
}


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

.footer-contact li {

    display: flex;

    gap: 12px;

    align-items: flex-start;
}


.footer-contact i {

    color: #ed1c24;

    margin-top: 3px;

    min-width: 15px;
}


.footer-contact a:hover {

    color: #ed1c24;
}


/* =========================================================
   CTA
========================================================= */

.footer-cta {

    margin: 70px 0 40px;

    padding: 32px 35px;

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 30px;

    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            rgba(237,28,36,0.10),
            rgba(255,255,255,0.035)
        );

    border: 1px solid rgba(237,28,36,0.25);

    position: relative;

    overflow: hidden;
}


/* Red glow */

.footer-cta::before {

    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    right: -70px;
    top: -100px;

    border-radius: 50%;

    background: #ed1c24;

    opacity: .08;

    filter: blur(20px);
}


.footer-cta h2 {

    margin: 0 0 8px;

    color: #ffffff;

    font-size: 28px;

    line-height: 1.3;
}


.footer-cta p {

    margin: 0;

    color: #a8a8a8;

    font-size: 13px;
}


/* =========================================================
   CTA BUTTON
========================================================= */

.footer-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    white-space: nowrap;

    padding: 14px 28px;

    border-radius: 50px;

    background: #ed1c24;

    color: #ffffff;

    font-size: 13px;

    font-weight: 600;

    text-decoration: none;

    box-shadow:
        0 10px 30px rgba(237,28,36,.18);

    transition:
        transform .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}


.footer-btn:hover {

    background: #ffffff;

    color: #111111;

    transform: translateY(-3px);

    box-shadow:
        0 15px 35px rgba(0,0,0,.25);
}


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

.footer-bottom {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 20px;

    border-top: 1px solid rgba(255,255,255,.09);

    padding-top: 22px;
}


.footer-bottom p {

    margin: 0;

    color: #777777;

    font-size: 11px;
}


/* Bottom menu */

.footer-menu {

    display: flex;

    gap: 22px;

    flex-wrap: wrap;
}


.footer-menu a {

    color: #777777;

    text-decoration: none;

    font-size: 11px;

    transition: color .3s ease;
}


.footer-menu a:hover {

    color: #ed1c24;
}


/* =========================================================
   SCROLL TO TOP
========================================================= */

#scrollTop {

    position: fixed;

    right: 25px;
    bottom: 25px;

    width: 48px;
    height: 48px;

    border: 1px solid rgba(237,28,36,.3);

    border-radius: 50%;

    background: #fff;

    color: #000;

    font-size: 18px;

    display: none;

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

    cursor: pointer;

    z-index: 9999;

    box-shadow:
        0 10px 30px rgba(237,28,36,.25);

    transition:
        transform .3s ease,
        background .3s ease;
}


#scrollTop:hover {

    background: #ffffff;

    color: #111111;

    transform: translateY(-4px);
}


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

@media (max-width: 992px) {

    .v2k-footer {

        padding: 70px 0 25px;
    }


    .v2k-footer-grid {

        grid-template-columns: 1fr 1fr;

        gap: 45px;
    }


    .footer-cta {

        flex-direction: column;

        align-items: flex-start;
    }


    .footer-bottom {

        flex-direction: column;

        align-items: flex-start;
    }

}


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

@media (max-width: 640px) {

    .v2k-footer {

        padding: 55px 0 20px;
    }


    .v2k-container {

        padding: 0 20px;
    }


    .v2k-footer-grid {

        grid-template-columns: 1fr;

        gap: 35px;
    }


    .footer-logo img {

        max-width: 150px;
    }


    .footer-about p {

        font-size: 13px;

        line-height: 1.7;
    }


    .footer-cta {

        margin: 50px 0 35px;

        padding: 25px 22px;

        border-radius: 16px;

        align-items: flex-start;
    }


    .footer-cta h2 {

        font-size: 24px;
    }


    .footer-cta p {

        font-size: 12px;

        line-height: 1.6;
    }


    .footer-btn {

        width: 100%;

        padding: 13px 22px;

        font-size: 12px;
    }


    .footer-bottom {

        align-items: center;

        text-align: center;
    }


    .footer-menu {

        justify-content: center;

        gap: 15px;
    }


    #scrollTop {

        width: 44px;

        height: 44px;

        right: 18px;

        bottom: 18px;
    }

}

/* header */

/*==================================
        V2K TOP HEADER RIBBON
===================================*/
/*==================================
        V2K TOP HEADER RIBBON
==================================*/

.v2k-top-ribbon{
    width:100%;
    background:#000;
    color:#fff;
    position:relative;
    z-index:9999;
    font-size:14px;
}

.v2k-container-ribbon{
    max-width:1280px;
    margin:0 auto;
    padding:0 20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    min-height:50px;
}

.v2k-ribbon-left,
.v2k-ribbon-right{
    display:flex;
    align-items:center;
}

.v2k-ribbon-left{
    gap:30px;
}

.v2k-ribbon-right{
    gap:15px;
}

.v2k-ribbon-left a,
.v2k-ribbon-right a{
    display:flex;
    align-items:center;
    color:#fff;
    text-decoration:none;
    transition:0.3s;
    white-space:nowrap;
}

.v2k-ribbon-left a:hover,
.v2k-ribbon-right a:hover{
    color:#e53935;
}

.v2k-ribbon-left i,
.v2k-ribbon-right i{
    margin-right:8px;
    color:#fff;
    font-size:14px;
}

/* Social Icons */

.v2k-ribbon-right a:not(.v2k-quote-btn){
    width:34px;
    height:34px;
    display:flex;
    justify-content:center;
    align-items:center;
    border:1px solid rgba(255,255,255,.25);
    border-radius:50%;
}

.v2k-ribbon-right a:not(.v2k-quote-btn) i{
    margin:0;
}

.v2k-ribbon-right a:not(.v2k-quote-btn):hover{
    background:#e53935;
    border-color:#e53935;
    color:#fff;
}

.v2k-ribbon-right a:not(.v2k-quote-btn):hover i{
    color:#fff;
}

/* CTA Button */

.v2k-quote-btn{
    background:#e53935;
    color:#fff !important;
    padding:10px 22px;
    border-radius:4px;
    font-weight:600;
    margin-left:10px;
}

.v2k-quote-btn:hover{
    background:#c62828;
}

/*=========================
        Tablet
=========================*/

@media (max-width:991px){

    .v2k-container{
        flex-direction:column;
        align-items:center;
        padding:12px 15px;
        gap:12px;
    }

    .v2k-ribbon-left,
    .v2k-ribbon-right{
        justify-content:center;
        flex-wrap:wrap;
        width:100%;
        gap:15px;
    }

    .v2k-quote-btn{
        margin-left:0;
    }

}

/*=========================
        Mobile
=========================*/

@media (max-width:576px){

    .v2k-top-ribbon{
        font-size:13px;
    }

    .v2k-container{
        padding:10px;
    }

    .v2k-ribbon-left{
        flex-direction:column;
        gap:10px;
    }

    .v2k-ribbon-right{
        justify-content:center;
        flex-wrap:wrap;
        gap:10px;
    }

    .v2k-ribbon-left a{
        justify-content:center;
    }

    .v2k-quote-btn{
        width:100%;
        justify-content:center;
        text-align:center;
    }

}