body { background: black; color: gold; font-family: Arial, sans-serif; text-align: center; margin: 0; }
.top-header { padding: 5px; display: flex; justify-content: center; align-items: center; border-bottom: 1px solid gold; }
.hold-icon { max-width: 100px; height: auto; margin: 0 20px; }
.top-nav { margin: 0; }
.nav-btn { color: white; text-decoration: none; margin: 0 5px; }
.main-header { padding: 10px; display: flex; justify-content: center; }
.buy-btn { background: gold; color: black; padding: 10px 20px; text-decoration: none; border-radius: 5px; }
#hero { padding: 50px 0; position: relative; overflow: hidden; }
.animated-image { width: 250px; animation: bounce 2s infinite; position: relative; z-index: 5; }
h1 { font-size: 2.5em; }
#about { padding: 10px; }
.featured-image { margin: 20px auto; max-width: 350px; }
.blink-image { width: 100%; animation: blink 1.5s infinite; }
.social-links { margin-top: 20px; }
.social-icon { width: 40px; margin: 0 10px; }
#bubble-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.bubble { position: absolute; border-radius: 50%; overflow: hidden; transition: left 0.2s ease, top 0.2s ease; pointer-events: auto; }
.bubble img { width: 100%; height: 100%; object-fit: cover; }
.bubble:hover { opacity: 0.9; cursor: none; }
.buy-text { position: absolute; top: 20%; left: 20%; transform: translateX(-50%); font-size: 2em; color: gold; animation: blink 1s infinite; z-index: 10;
    padding: 10px 20px;
    border: 2px solid #ffd700;
    border-radius: 10px;
    box-shadow: 0 0 10px #ffd700, 0 0 20px #000000, 0 0 30px #ffd700;
    background: rgba(0, 0, 0, 0.7);
    animation: neonGlow 2s infinite alternate;
}
.pointing-hand { position: absolute; top: 20%; left: 20%; width: 100px; animation: point 2s infinite; z-index: 10; transform-origin: left; }
@media (max-width: 600px) { /* Tối ưu mobile */
    .animated-image { width: 200px; }
    .buy-text { font-size: 1.5em; top: 25%; }
    .pointing-hand { width: 80px; top: 25%; }
    #bubble-container { height: 80%; } /* Giảm bong bóng trên mobile */
}
@keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes blink { 0% { opacity: 1; } 50% { opacity: 0.3; } 100% { opacity: 1; } }
@keyframes point { 0% { transform: translateX(0) rotate(-20deg); } 50% { transform: translateX(150px) rotate(0deg); } 100% { transform: translateX(0) rotate(-20deg); } }
@keyframes neonGlow { 0% { box-shadow: 0 0 5px #ffd700, 0 0 10px #000000, 0 0 15px #ffd700; } 100% { box-shadow: 0 0 15px #ffd700, 0 0 30px #000000, 0 0 40px #ffd700; } }