/* =========================
   DEADKOP MOBILE FIX
========================= */

@media (max-width: 900px){

    .container{
        width:92%;
    }

    .site-header{
        position:sticky;
        top:0;
        z-index:999;
    }

    .header-inner{
        min-height:86px;
        gap:14px;
        overflow-x:auto;
    }

    .site-logo{
        width:72px;
        min-width:72px;
    }

    .main-menu{
        flex:1;
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
    }

    .main-menu .menu{
        display:flex;
        gap:18px;
        flex-wrap:nowrap;
        min-width:max-content;
        padding:0 8px;
    }

    .main-menu .menu a{
        font-size:13px;
        white-space:nowrap;
        padding:10px 0;
    }

    .search-btn{
        width:52px;
        height:52px;
        min-width:52px;
        border-radius:16px;
    }

    .hero{
        min-height:680px;
        padding:120px 0 80px;
        background-position:center;
    }

    .hero-content{
        max-width:100%;
    }

    .hero h1{
        font-size:clamp(44px,14vw,76px);
        line-height:1.05;
    }

    .hero p{
        font-size:18px;
        line-height:1.5;
    }

    .hero-actions{
        display:flex;
        gap:14px;
        flex-wrap:wrap;
    }

    .btn{
        min-height:52px;
        padding:0 24px;
    }

    .section-head{
        flex-direction:column;
        align-items:flex-start;
        gap:16px;
    }

    .section-head h1,
    .section-head h2,
    .latest-news h2{
        font-size:clamp(34px,10vw,52px);
    }

    .news-grid{
        grid-template-columns:1fr!important;
        gap:22px;
    }

    .news-card{
        border-radius:22px;
    }

    .news-image{
        height:220px;
    }

    .news-content{
        padding:24px;
    }

    .archive-page,
    .single-page{
        padding:60px 0 80px;
    }

    .single-article{
        width:94%!important;
        padding:28px 20px!important;
        border-radius:22px!important;
    }

    .single-title{
        font-size:34px!important;
        line-height:1.15!important;
    }

    .single-meta{
        flex-direction:column;
        gap:8px;
    }

    .single-content{
        font-size:18px!important;
        line-height:1.8!important;
    }

    .single-content h2{
        font-size:28px!important;
    }

    .single-content img,
    .single-cover img{
        border-radius:16px!important;
    }

    .footer-top{
        grid-template-columns:1fr!important;
        gap:34px;
    }

    .footer-brand h3{
        font-size:34px;
    }

    .footer-bottom{
        flex-direction:column;
        align-items:flex-start;
        gap:12px;
    }

    .dk-ai-widget{
        right:16px!important;
        bottom:16px!important;
    }

    .dk-ai-panel{
        right:0!important;
        bottom:78px!important;
        width:calc(100vw - 32px)!important;
        height:70vh!important;
    }
}

@media (max-width: 480px){

    .header-inner{
        min-height:76px;
    }

    .site-logo{
        width:58px;
        min-width:58px;
    }

    .main-menu .menu{
        gap:14px;
    }

    .main-menu .menu a{
        font-size:12px;
    }

    .search-btn{
        width:46px;
        height:46px;
        min-width:46px;
    }

    .hero{
        min-height:620px;
        padding:100px 0 70px;
    }

    .hero h1{
        font-size:46px;
    }

    .hero p{
        font-size:16px;
    }

    .btn{
        width:100%;
    }

    .news-image{
        height:190px;
    }

    .single-title{
        font-size:30px!important;
    }

    .single-content{
        font-size:17px!important;
    }

    .footer-youtube,
    .footer-chat{
        width:100%;
    }
}
@media (max-width: 768px){

    .site-header{
        padding:0;
    }

    .header-inner{
        min-height:96px;
        height:96px;
        display:grid;
        grid-template-columns:70px 1fr 62px;
        gap:12px;
        align-items:center;
        overflow:hidden;
    }

    .logo{
        display:flex;
        justify-content:center;
    }

    .site-logo{
        width:58px!important;
        max-width:58px!important;
    }

    .main-menu{
        overflow-x:auto;
        overflow-y:hidden;
        white-space:nowrap;
        -webkit-overflow-scrolling:touch;
    }

    .main-menu .menu{
        display:flex;
        flex-wrap:nowrap;
        gap:22px;
        width:max-content;
    }

    .main-menu .menu li{
        flex:0 0 auto;
    }

    .main-menu .menu a{
        display:block;
        font-size:18px!important;
        line-height:1;
        white-space:nowrap;
    }

    .search-btn{
        width:58px!important;
        height:58px!important;
        min-width:58px!important;
        border-radius:18px!important;
        font-size:24px!important;
    }

    .hero{
        min-height:calc(100vh - 96px);
        padding:90px 0 80px;
        background-position:center top;
    }

    .hero-content{
        padding-top:80px;
    }

    .hero h1{
        font-size:52px!important;
    }

    .hero-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:16px;
    }

    .hero-actions .btn{
        width:100%;
        padding:0 18px;
    }
}
@media (max-width: 768px){

    .site-header{
        position:sticky;
        top:0;
        z-index:9999;
        background:#101722;
        border-bottom:1px solid rgba(0,178,255,.18);
    }

    .header-inner{
        height:86px;
        min-height:86px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:16px;
        overflow:visible;
    }

    .site-logo{
        width:64px!important;
        max-width:64px!important;
    }

    .header-actions{
        display:flex;
        align-items:center;
        gap:12px;
    }

    .search-btn{
        width:54px!important;
        height:54px!important;
        min-width:54px!important;
        border-radius:18px!important;
    }

    .mobile-menu-toggle{
        width:54px;
        height:54px;
        border:1px solid rgba(0,178,255,.25);
        border-radius:18px;
        background:#0b1b33;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:6px;
        cursor:pointer;
        box-shadow:0 0 24px rgba(0,178,255,.18);
    }

    .mobile-menu-toggle span{
        width:24px;
        height:2px;
        background:#fff;
        border-radius:10px;
        transition:.25s;
    }

    .mobile-menu-toggle.active span:nth-child(1){
        transform:translateY(8px) rotate(45deg);
    }

    .mobile-menu-toggle.active span:nth-child(2){
        opacity:0;
    }

    .mobile-menu-toggle.active span:nth-child(3){
        transform:translateY(-8px) rotate(-45deg);
    }

    .main-menu{
        position:fixed;
        inset:86px 0 0 0;
        background:
            radial-gradient(circle at top right,rgba(0,178,255,.18),transparent 35%),
            linear-gradient(180deg,#071024,#05070d);
        padding:28px 22px;
        transform:translateX(100%);
        transition:.32s ease;
        overflow-y:auto;
        z-index:9998;
    }

    .main-menu.active{
        transform:translateX(0);
    }

    .main-menu .menu{
        display:flex!important;
        flex-direction:column;
        gap:14px;
        width:100%;
    }

    .main-menu .menu li{
        width:100%;
    }

    .main-menu .menu a{
        display:flex;
        align-items:center;
        justify-content:space-between;
        width:100%;
        min-height:62px;
        padding:0 20px;
        border-radius:18px;
        background:linear-gradient(180deg,#111a33,#08132a);
        border:1px solid rgba(255,255,255,.08);
        color:#fff!important;
        font-size:20px!important;
        font-weight:900;
        text-decoration:none;
    }

    .main-menu .menu a:hover,
    .main-menu .menu .current-menu-item > a{
        background:linear-gradient(135deg,#0070ff,#00b2ff);
        box-shadow:0 0 28px rgba(0,178,255,.4);
    }

    body.menu-open{
        overflow:hidden;
    }
}

/* =========================
   DEADKOP MOBILE MENU FINAL
========================= */

@media (max-width: 768px){

    .site-header{
        position:sticky!important;
        top:0;
        z-index:9999;
        background:#101722!important;
        border-bottom:1px solid rgba(0,178,255,.18);
    }

    .header-inner{
        height:86px!important;
        min-height:86px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        gap:16px!important;
        overflow:visible!important;
    }

    .logo{
        width:auto!important;
        min-width:64px!important;
        flex:0 0 auto!important;
    }

    .site-logo{
        width:64px!important;
        max-width:64px!important;
        height:auto!important;
    }

    .header-actions{
        display:flex!important;
        align-items:center!important;
        gap:12px!important;
        margin-left:auto!important;
    }

    .search-btn{
        width:54px!important;
        height:54px!important;
        min-width:54px!important;
        border-radius:18px!important;
        font-size:22px!important;
    }

    .mobile-menu-toggle{
        width:54px!important;
        height:54px!important;
        border:1px solid rgba(0,178,255,.25)!important;
        border-radius:18px!important;
        background:#0b1b33!important;
        display:flex!important;
        flex-direction:column!important;
        align-items:center!important;
        justify-content:center!important;
        gap:6px!important;
        cursor:pointer!important;
        box-shadow:0 0 24px rgba(0,178,255,.18)!important;
    }

    .mobile-menu-toggle span{
        width:24px!important;
        height:2px!important;
        background:#fff!important;
        border-radius:10px!important;
        transition:.25s!important;
    }

    .mobile-menu-toggle.active span:nth-child(1){
        transform:translateY(8px) rotate(45deg)!important;
    }

    .mobile-menu-toggle.active span:nth-child(2){
        opacity:0!important;
    }

    .mobile-menu-toggle.active span:nth-child(3){
        transform:translateY(-8px) rotate(-45deg)!important;
    }

    .main-menu{
        position:fixed!important;
        inset:86px 0 0 0!important;
        background:
            radial-gradient(circle at top right,rgba(0,178,255,.18),transparent 35%),
            linear-gradient(180deg,#071024,#05070d)!important;
        padding:28px 22px 120px!important;
        transform:translateX(100%)!important;
        transition:.32s ease!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        z-index:9998!important;
        flex:none!important;
    }

    .main-menu.active{
        transform:translateX(0)!important;
    }

    .main-menu .menu{
        display:flex!important;
        flex-direction:column!important;
        gap:14px!important;
        width:100%!important;
        min-width:0!important;
        padding:0!important;
        list-style:none!important;
    }

    .main-menu .menu li{
        width:100%!important;
        flex:none!important;
    }

    .main-menu .menu a{
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        width:100%!important;
        min-height:62px!important;
        padding:0 20px!important;
        border-radius:18px!important;
        background:linear-gradient(180deg,#111a33,#08132a)!important;
        border:1px solid rgba(255,255,255,.08)!important;
        color:#fff!important;
        font-size:20px!important;
        font-weight:900!important;
        text-decoration:none!important;
        white-space:normal!important;
        text-transform:uppercase!important;
    }

    .main-menu .menu a:hover,
    .main-menu .menu .current-menu-item > a{
        background:linear-gradient(135deg,#0070ff,#00b2ff)!important;
        box-shadow:0 0 28px rgba(0,178,255,.4)!important;
    }

    body.menu-open{
        overflow:hidden!important;
    }

    .hero{
        min-height:calc(100vh - 86px)!important;
        padding:90px 0 80px!important;
    }
}

@media (min-width: 769px){
    .mobile-menu-toggle{
        display:none!important;
    }
}