/* ===== ẨN SCROLLBAR ===== */
*::-webkit-scrollbar{
    width:0px;
    height:0px;
    background:transparent;
}
*{
    scrollbar-width:none;
    -ms-overflow-style:none;
}
html, body{
    overflow:auto;
}

/* ===== PARTNER CONTAINER ===== */
.partner-container{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:20px;
    margin-bottom:30px;
    padding: 10px 10px;
}

/* ===== CARD ĐỐI TÁC (GLASS GAMING) ===== */
.partner-card{
    position:relative; /* FIX: để tam giác ::after bám vào */
    width: 280px;
    max-width: 100%;

    background: rgba(15, 15, 25, 0.78);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius:18px;

    padding:18px;
    text-align:center;
    color: rgba(255,255,255,0.88);

    box-shadow: 0 12px 40px rgba(0,0,0,.55);
    backdrop-filter: blur(10px);

    transition:.25s ease;
    overflow:hidden;
}

/* neon line top */
.partner-card::before{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    top:-1px;
    height:2px;
    background:linear-gradient(90deg, transparent, #00ffff, #ff00cc, transparent);
    opacity:.9;
}

/* hover */
.partner-card:hover{
    transform:translateY(-6px);
    border-color: rgba(0,255,255,0.20);
    box-shadow: 0 18px 45px rgba(0,0,0,.70);
}

/* Ảnh */
.partner-card img{
    width:100%;
    height:auto;
    max-height:280px;
    object-fit:contain;
    display:block;
    margin: 0 auto;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.08);
    transition: transform .45s ease;
}

.partner-card:hover img{
    transform: scale(1.04);
}

/* Tiêu đề */
.partner-card h3{
    margin:12px 0 6px;
    font-size:16px;
    letter-spacing:.2px;
    color:#00ffff;
}

/* Mô tả */
.partner-card p{
    margin: 0 0 6px;
    font-size:13.5px;
    line-height:1.6;
    color: rgba(255,255,255,0.72);
}

/* Link button (đối tác) */
.partner-card a{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    margin-top:12px;
    padding: 10px 16px;
    border-radius:999px;

    background: linear-gradient(135deg, rgba(0,255,255,.18), rgba(255,0,204,.16));
    color:#fff;

    font-weight:900;
    font-size:13px;
    letter-spacing:.2px;

    border: 1px solid rgba(255,255,255,0.10);
    box-shadow: 0 10px 22px rgba(0,0,0,.35);
    transition:.25s ease;
}

.partner-card a:hover{
    transform: translateY(-2px);
    border-color: rgba(0,255,255,0.35);
    box-shadow: 0 16px 30px rgba(0,0,0,.55);
}

/* Tam giác neon từ dưới lên */
.partner-card::after{
    content:"";
    position:absolute;
    bottom:0;
    left:50%;
    transform: translateX(-50%) scaleY(0);
    width:0;
    height:0;

    border-left: 70px solid transparent;
    border-right: 70px solid transparent;
    border-bottom: 60px solid rgba(255,0,204,0.35);

    transform-origin: bottom;
    transition: transform .45s ease;
    z-index:1;
}

.partner-card:hover::after{
    transform: translateX(-50%) scaleY(1);
}

/* Tiêu đề + mô tả nổi trên tam giác */
.partner-card h3,
.partner-card p{
    position:relative;
    z-index:2;
}

/* ===== PARTNER LINK (nếu dùng dạng text) ===== */
.partner-link{
    display:inline-block;
    margin-top:8px;
    color:#00ffff;
    font-weight:800;
    text-decoration:none;
    transition:.25s;
    opacity:.9;
}

.partner-link:hover{
    opacity:1;
    text-decoration:underline;
}

/* ===== RESPONSIVE PARTNER ===== */
@media (max-width: 900px){
    .partner-card{
        width: 88%;
        max-width: 420px;
    }
    .partner-card img{
        max-height: 300px;
    }
}

/* ===== FOOTER GAMING ===== */
.footer-columns{
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:20px;

    background: rgba(15, 15, 25, 0.92);
    border-top: 1px solid rgba(255,255,255,0.08);

    color:#fff;
    padding: 30px 20px 10px 20px;
    backdrop-filter: blur(10px);
}

.footer-column{
    flex:1 1 150px;
    min-width:150px;
}

.footer-column h4{
    margin-bottom:10px;
    font-size:14px;
    color:#00ffff;
    text-transform:uppercase;
    letter-spacing:.5px;
}

.footer-column a{
    display:block;
    color: rgba(255,255,255,0.80);
    text-decoration:none;
    margin: 6px 0;
    font-weight:700;
    font-size: 13.5px;
    transition:.2s;
}

.footer-column a:hover{
    color:#00ffff;
}

/* hr neon */
hr{
    border:none;
    height:2px;
    background: linear-gradient(to right, transparent, #00ffff, #ff00cc, transparent);
    margin: 20px 0;
    opacity:.9;
}

/* footer responsive */
@media (max-width: 600px){
    .footer-columns{
        flex-direction:column;
        align-items:flex-start;
    }
}

/* ===== GRID 4 Ô FEATURE ===== */
.feature-grid{
    max-width:1100px;
    margin:40px auto;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:18px;
    padding: 0 10px;
}

/* BOX FEATURE GLASS */
.feature-box{
    display:block;
    text-decoration:none;

    background: rgba(15, 15, 25, 0.78);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius:18px;

    padding:22px;
    box-shadow: 0 12px 40px rgba(0,0,0,.55);
    backdrop-filter: blur(10px);

    transition:.25s ease;
    position:relative;
    overflow:hidden;
}

/* neon line */
.feature-box::before{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    top:-1px;
    height:2px;
    background:linear-gradient(90deg, transparent, #00ffff, #ff00cc, transparent);
    opacity:.85;
}

/* title */
.feature-box h3{
    color:#00ffff;
    margin-bottom:8px;
    font-size:16px;
    letter-spacing:.3px;
}

/* desc */
.feature-box p{
    color: rgba(255,255,255,0.72);
    font-size:13.5px;
    line-height:1.6;
}

.feature-box:hover{
    transform: translateY(-6px);
    border-color: rgba(0,255,255,0.20);
    box-shadow: 0 18px 45px rgba(0,0,0,.70);
}

/* responsive feature */
@media(max-width:992px){
    .feature-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media(max-width:480px){
    .feature-grid{ grid-template-columns:1fr; }
}

/* ===== TEXT FRIEND ===== */
.banbe{
    color:#00ffff;
    text-align:center;
    font-weight:900;
    letter-spacing:.3px;
    opacity:.9;
}

/* ===== CART COUNT BUMP ===== */
#cart-count.bump{
    animation: bump .3s ease;
}

@keyframes bump{
    0%{transform:scale(1)}
    50%{transform:scale(1.4)}
    100%{transform:scale(1)}
}