/* =========================================================
   KITAAB SPEAKS — FINAL PRODUCTION FOOTER
   Locked layout:
   Desktop/Laptop: social icons 7 + 7
   Tablet: 7 + 7
   Mobile: 5 + 5 + 4
   ========================================================= */

.ks-footer{
    --ks-footer-bg:#08090a;
    --ks-footer-panel:#0d0e10;
    --ks-footer-gold:#d6a83f;
    --ks-footer-gold-bright:#f2cc6b;
    --ks-footer-ivory:#f7f1e5;
    --ks-footer-muted:#9f998f;
    --ks-footer-line:rgba(214,168,63,.16);
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 14% 18%,rgba(214,168,63,.055),transparent 28rem),
        #08090a;
    color:var(--ks-footer-muted);
    border-top:1px solid rgba(214,168,63,.12);
}

.ks-footer *,
.ks-footer *::before,
.ks-footer *::after{
    box-sizing:border-box;
}

.ks-footer .ks-shell{
    width:min(100% - 48px,1200px);
    margin-inline:auto;
}

/* ---------- Signal divider ---------- */
.ks-footer__signal{
    height:64px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    border-bottom:1px solid rgba(214,168,63,.10);
    background:
        linear-gradient(90deg,rgba(214,168,63,.025),rgba(255,42,36,.025),rgba(214,168,63,.015));
}

.ks-footer__signal span{
    display:block;
    width:4px;
    border-radius:999px;
    background:linear-gradient(180deg,#f2cc6b,#ff2a24);
    box-shadow:0 0 12px rgba(255,42,36,.16);
}

.ks-footer__signal span:nth-child(1),
.ks-footer__signal span:nth-child(7){height:8px}
.ks-footer__signal span:nth-child(2),
.ks-footer__signal span:nth-child(6){height:18px}
.ks-footer__signal span:nth-child(3),
.ks-footer__signal span:nth-child(5){height:30px}
.ks-footer__signal span:nth-child(4){height:42px}

/* ---------- Main grid ---------- */
.ks-footer__grid{
    display:grid;
    grid-template-columns:minmax(400px,1.45fr) minmax(145px,.62fr) minmax(145px,.62fr) minmax(145px,.62fr);
    gap:56px;
    align-items:start;
    padding:66px 0 56px;
}

.ks-footer__brand{
    min-width:0;
}

.ks-footer__logo{
    display:inline-flex;
    align-items:center;
    gap:14px;
    text-decoration:none;
    color:inherit;
}

.ks-footer__logo img{
    width:64px;
    height:64px;
    border-radius:50%;
    object-fit:cover;
    border:1px solid rgba(242,204,107,.34);
    box-shadow:0 8px 24px rgba(0,0,0,.24);
}

.ks-footer__logo span{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
}

.ks-footer__logo strong{
    color:var(--ks-footer-ivory);
    font-size:18px;
    line-height:1.1;
    letter-spacing:.11em;
    font-weight:850;
    white-space:nowrap;
}

.ks-footer__logo small{
    color:var(--ks-footer-gold);
    font-size:10px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:.05em;
}

.ks-footer__brand > p{
    max-width:500px;
    margin:28px 0 0;
    color:#969087;
    font-size:14px;
    line-height:1.75;
}

.ks-footer__email{
    width:max-content;
    max-width:100%;
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:14px;
    color:#d8d0c5;
    font-size:14px;
    line-height:1.4;
    text-decoration:none;
    overflow-wrap:anywhere;
    transition:color .18s ease,transform .18s ease;
}

.ks-footer__email span{
    color:var(--ks-footer-gold-bright);
}

.ks-footer__email:hover{
    color:var(--ks-footer-gold-bright);
    transform:translateX(2px);
}

/* ---------- Social icons: LOCKED 7 + 7 on desktop/laptop ---------- */
.ks-footer__socials{
    --social-size:44px;
    --social-gap:10px;
    display:grid !important;
    grid-template-columns:repeat(7,var(--social-size)) !important;
    grid-auto-flow:row !important;
    gap:var(--social-gap) !important;
    align-items:center !important;
    justify-content:start !important;
    width:max-content !important;
    max-width:100% !important;
    margin-top:24px !important;
    overflow:visible !important;
}

.ks-footer__social-link{
    --brand:#d6a83f;
    position:relative;
    isolation:isolate;
    width:var(--social-size) !important;
    height:var(--social-size) !important;
    min-width:var(--social-size) !important;
    min-height:var(--social-size) !important;
    display:grid !important;
    place-items:center !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:50% !important;
    border:1px solid rgba(214,168,63,.34) !important;
    background:#111214 !important;
    overflow:visible !important;
    text-decoration:none !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 7px 18px rgba(0,0,0,.22) !important;
    transition:
        transform .20s ease,
        border-color .20s ease,
        background .20s ease,
        box-shadow .20s ease !important;
}

.ks-footer__social-link::before{
    content:"";
    position:absolute;
    inset:-3px;
    z-index:-1;
    border-radius:inherit;
    opacity:0;
    background:radial-gradient(circle,var(--brand) 0%,transparent 68%);
    filter:blur(8px);
    transform:scale(.76);
    transition:opacity .2s ease,transform .2s ease;
}

.ks-footer__social-link::after{
    content:attr(data-label);
    position:absolute;
    left:50%;
    bottom:calc(100% + 9px);
    z-index:20;
    transform:translate(-50%,5px);
    padding:6px 9px;
    border:1px solid rgba(214,168,63,.30);
    border-radius:8px;
    background:#111214;
    color:#f7f1e5;
    box-shadow:0 10px 24px rgba(0,0,0,.40);
    font-size:10px;
    font-weight:850;
    line-height:1;
    white-space:nowrap;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
}

.ks-footer__social-icon-wrap{
    width:32px !important;
    height:32px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:50% !important;
    overflow:hidden !important;
    background:transparent !important;
    box-shadow:none !important;
}

.ks-footer__social-icon{
    width:26px !important;
    height:26px !important;
    display:block !important;
    object-fit:contain !important;
    filter:none !important;
    -webkit-filter:none !important;
    opacity:1 !important;
    visibility:visible !important;
    mix-blend-mode:normal !important;
    transform:scale(1) !important;
    transition:transform .18s ease !important;
}

/* Contrast discs only for naturally dark monochrome SVGs */
.ks-social--x .ks-footer__social-icon-wrap,
.ks-social--threads .ks-footer__social-icon-wrap,
.ks-social--medium .ks-footer__social-icon-wrap,
.ks-social--quora .ks-footer__social-icon-wrap{
    background:#fff !important;
    box-shadow:0 1px 8px rgba(0,0,0,.25) !important;
}

.ks-social--snapchat .ks-footer__social-icon-wrap{
    background:#fffc00 !important;
    box-shadow:0 1px 8px rgba(0,0,0,.25) !important;
}

.ks-social--official-website .ks-footer__social-icon-wrap{
    background:#0b0b0c !important;
    border:1px solid rgba(242,204,107,.38) !important;
}

.ks-social--official-website .ks-footer__social-icon{
    width:30px !important;
    height:30px !important;
    border-radius:50% !important;
}

/* Brand accent halo colors */
.ks-social--official-website{--brand:#f2cc6b}
.ks-social--youtube{--brand:#ff0000}
.ks-social--instagram{--brand:#e1306c}
.ks-social--facebook{--brand:#1877f2}
.ks-social--x{--brand:#f7f1e5}
.ks-social--telegram{--brand:#229ed9}
.ks-social--whatsapp{--brand:#25d366}
.ks-social--pinterest{--brand:#e60023}
.ks-social--threads{--brand:#f7f1e5}
.ks-social--medium{--brand:#f7f1e5}
.ks-social--bluesky{--brand:#1185fe}
.ks-social--reddit{--brand:#ff4500}
.ks-social--quora{--brand:#b92b27}
.ks-social--snapchat{--brand:#fffc00}

.ks-footer__social-link:hover,
.ks-footer__social-link:focus-visible{
    transform:translateY(-3px) scale(1.05) !important;
    border-color:var(--brand) !important;
    background:#15171a !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.07),
        0 10px 24px rgba(0,0,0,.28),
        0 0 18px color-mix(in srgb,var(--brand) 30%,transparent) !important;
}

.ks-footer__social-link:hover::before,
.ks-footer__social-link:focus-visible::before{
    opacity:.30;
    transform:scale(1.06);
}

.ks-footer__social-link:hover::after,
.ks-footer__social-link:focus-visible::after{
    opacity:1;
    visibility:visible;
    transform:translate(-50%,0);
}

.ks-footer__social-link:hover .ks-footer__social-icon,
.ks-footer__social-link:focus-visible .ks-footer__social-icon{
    transform:scale(1.10) !important;
}

.ks-footer__social-link:focus-visible{
    outline:2px solid var(--ks-footer-gold-bright) !important;
    outline-offset:3px !important;
}

/* ---------- Footer columns ---------- */
.ks-footer__column{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:15px;
}

.ks-footer__column h2{
    margin:0 0 9px;
    color:var(--ks-footer-ivory);
    font-size:12px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.ks-footer__column a{
    color:#aaa39a;
    font-size:14px;
    line-height:1.45;
    text-decoration:none;
    transition:color .18s ease,transform .18s ease;
}

.ks-footer__column a:hover{
    color:var(--ks-footer-gold-bright);
    transform:translateX(2px);
}

/* ---------- Bottom row ---------- */
.ks-footer__bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:22px 0 26px;
    border-top:1px solid rgba(214,168,63,.12);
}

.ks-footer__bottom p{
    margin:0;
    color:#777169;
    font-size:11px;
    line-height:1.5;
}

.ks-footer__micro{
    letter-spacing:.07em;
}

/* ---------- Tablet ---------- */
@media(max-width:1100px){
    .ks-footer__grid{
        grid-template-columns:minmax(0,1.25fr) repeat(2,minmax(140px,1fr));
        gap:38px;
    }

    .ks-footer__brand{
        grid-column:1/-1;
    }

    .ks-footer__socials{
        grid-template-columns:repeat(7,var(--social-size)) !important;
    }
}

/* ---------- Tablet portrait ---------- */
@media(max-width:760px){
    .ks-footer .ks-shell{
        width:min(100% - 36px,100%);
    }

    .ks-footer__grid{
        grid-template-columns:1fr 1fr;
        gap:34px 28px;
        padding-top:46px;
    }

    .ks-footer__brand{
        grid-column:1/-1;
    }

    .ks-footer__bottom{
        align-items:flex-start;
        flex-direction:column;
        gap:7px;
    }

    .ks-footer__social-link::after{
        display:none;
    }
}

/* ---------- Mobile: 5 + 5 + 4 ---------- */
@media(max-width:560px){
    .ks-footer .ks-shell{
        width:min(100% - 28px,100%);
    }

    .ks-footer__grid{
        grid-template-columns:1fr;
        gap:30px;
        padding:42px 0 40px;
    }

    .ks-footer__brand{
        grid-column:auto;
    }

    .ks-footer__logo img{
        width:58px;
        height:58px;
    }

    .ks-footer__logo strong{
        font-size:17px;
    }

    .ks-footer__brand > p{
        margin-top:22px;
        font-size:14px;
    }

    .ks-footer__email{
        font-size:14px;
    }

    .ks-footer__socials{
        --social-size:44px;
        --social-gap:9px;
        grid-template-columns:repeat(5,var(--social-size)) !important;
    }

    .ks-footer__social-icon-wrap{
        width:32px !important;
        height:32px !important;
    }

    .ks-footer__social-icon{
        width:25px !important;
        height:25px !important;
    }
}

/* ---------- Very narrow phones ---------- */
@media(max-width:340px){
    .ks-footer__socials{
        --social-size:40px;
        --social-gap:7px;
        grid-template-columns:repeat(4,var(--social-size)) !important;
    }

    .ks-footer__social-icon-wrap{
        width:29px !important;
        height:29px !important;
    }

    .ks-footer__social-icon{
        width:22px !important;
        height:22px !important;
    }
}

@media(hover:none){
    .ks-footer__social-link:hover{
        transform:none !important;
    }

    .ks-footer__social-link::after{
        display:none;
    }
}

@media(prefers-reduced-motion:reduce){
    .ks-footer__email,
    .ks-footer__column a,
    .ks-footer__social-link,
    .ks-footer__social-link::before,
    .ks-footer__social-link::after,
    .ks-footer__social-icon{
        transition:none !important;
    }
}
