.top-banner{ position: fixed; top: 0; left: 0; z-index: 10001; background: var(--gray); width: 100%;
border-bottom: 1px solid #1a1a1a; padding: 12px 1rem; box-sizing: border-box; flex-direction: column;
display: flex; align-items: center; justify-content: center; gap: 4px; }

#flashSaleBanner{ display: inline-flex; background: linear-gradient(90deg, #ffec99, #ffc857);
color: var(--black); font-weight: bold; text-align: center; padding: 8px 12px; border-radius: 4px;
align-items: center; border: 1px solid var(--black); width: auto; }

.countdownColor{ color: #fd2626; font-weight: bolder; }

#flashSaleBanner .status-flex{ justify-content: center; }
#topBannerText{ width: 100%; text-align: center; }

.top-banner p{ color: var(--black); margin: 0 auto; font-size: 0.85rem; letter-spacing: 0.4px;
text-align: center; max-width: 900px; line-height: 1.4; transition: opacity 0.4s ease; }

.top-banner.status-operational{ background: #2ea536; border-bottom: 1px solid #3a3a3a; }
.top-banner.status-operational p, .top-banner.status-operational .status-link{ color: #ffffff; }

.top-banner.status-degraded{ background: #f57c00; border-bottom: 1px solid #3a3a3a;}
.top-banner.status-down{ background: #fc5543; border-bottom: 1px solid #3a3a3a; }

.top-banner.status-sponsored{ background: #00796b; border-bottom: #3a3a3a; }
.top-banner.status-sponsored p, .top-banner.status-sponsored .status-link{ color: var(--marble); }
.sponsored-tag{ font-size: 0.7rem; font-weight: 700; letter-spacing: 0.6px; opacity: 0.8; margin-right: 6px; }
.sponsored-text{ font-weight: bolder; }
.top-banner.status-sponsored{ color: var(--marble); }

.status-link{ text-decoration: underline; font-weight: 600; color: inherit; }
.status-flex{ display: inline-flex; align-items: center; gap: 8px; }
.status-icon{ width: 18px; height: 18px; stroke-width: 2.2; flex-shrink: 0;}

.main-header{ z-index: 1050; background: var(--rich-gold); align-items: center; padding: 20px 50px;
border-bottom: 1px solid #1a1a1a; display: flex; justify-content: space-between; top: auto; }

.logo img{ width: 50px; height: 50px; }

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

.header-right{ text-align: right; }

.main-nav{ background: var(--gold); padding: 12px; top: calc(28px + 88px); z-index: 1000;
margin-top: 0; }

.faicon{ font-size: 1.3rem; }

.main-nav ul{ display: flex; justify-content: center; gap: 40px; }

.main-nav a{ display: inline-flex; align-items: center; gap: 8px; padding: 14px 0; color: var(--black);
font-size: 0.9rem; letter-spacing: 1px; z-index: 1000; }

.nav-links{ display: flex; align-items: center; gap: 40px; position: relative; z-index: 1; }

.nav-links > li{ list-style: none; }

.mobile-menu, .mobile-header, .menu-close{ display: none; }

.site-footer{ background-color: var(--dark-gold); padding: 2rem; text-align: center; border-top: 1px solid var(--black); }

.footer-container{ max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column;
align-items: center; gap: 1rem; }

.footer-links{ display: flex; gap: 0.2rem; flex-wrap: wrap; justify-content: center; align-items: center; }

.footer-links a{ color: var(--black); text-decoration: none; font-size: 0.95rem; margin: 0 0.5rem;
transition: color 0.3s ease, transform 0.3s ease; }

.footer-links a:hover{ color: var(--black); transform: scale(1.01); }
.footer-links a i{ transition: all 0.3s ease; font-size: 1.8rem; }
.footer-links a:hover i{ transform: rotate(8deg) scale(1.1); }

.footer-links .facebook:hover{ color: #1877f2; }
.footer-links .whatsapp:hover{ color: #25d366; }

.footer-links .instagram:hover{ background: linear-gradient(45deg, #833ab4, #fd1d1d, #fcaf45);
-webkit-background-clip: text; background-clip: text; color: transparent; }

.footer-links .tiktok:hover{ color: #000; text-shadow: 3px 0 #69c9d0, -3px 0 #ee1d52; }

.footer-links .snapchat:hover{ color: #fffc00; }

.roe-links{ display: flex; gap: 1.1rem; flex-wrap: wrap; }
.roe-links a{ color: var(--black); transition: all 0.3s ease; font-size: 1.1rem; }
.roe-links a:hover{ font-weight: bold; text-decoration: underline; }

.nan-x{ color: var(--black); }
.nan-x-link{ color: inherit; text-decoration: none; transition: all 0.3s ease; }
.nan-x-link:hover{ text-decoration: underline; }