* {margin: 0;padding: 0;box-sizing: border-box;}
body {font-family: 'Roboto', sans-serif;line-height: 1.6;color: #333;background: linear-gradient(135deg, #8B0000 0%, #FFD700 100%);}
header {background: rgba(139, 0, 0, 0.95);padding: 1rem 0;box-shadow: 0 2px 10px rgba(0,0,0,0.3);}
nav {display: flex;justify-content: space-between;align-items: center;max-width: 1200px;margin: 0 auto;padding: 0 2rem;}
.logo-container {flex-shrink: 0;}
.logo {height: 60px;width: auto;}
.nav-menu {display: flex;list-style: none;gap: 2rem;}
.nav-menu a {color: #FFD700;text-decoration: none;font-weight: 500;transition: color 0.3s;}
.nav-menu a:hover {color: #FFF;}
.cta-button {background: #FFD700;color: #8B0000;padding: 0.75rem 1.5rem;border-radius: 25px;text-decoration: none;font-weight: 700;transition: all 0.3s;}
.cta-button:hover {background: #FFF;transform: scale(1.05);}
main {max-width: 1200px;margin: 0 auto;padding: 2rem;}
.hero {position: relative;margin-bottom: 3rem;border-radius: 15px;overflow: hidden;box-shadow: 0 10px 30px rgba(0,0,0,0.3);}
.hero-image {width: 100%;height: auto;display: block;}
.hero-content {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center;color: #FFF;text-shadow: 2px 2px 4px rgba(0,0,0,0.7);width: 90%;}
.hero-content h1 {font-family: 'Bebas Neue', cursive;font-size: 3.5rem;margin-bottom: 1rem;color: #FFD700;}
.hero-content p {font-size: 1.3rem;margin-bottom: 2rem;}
.hero-cta {display: inline-block;background: #FFD700;color: #8B0000;padding: 1rem 2.5rem;border-radius: 30px;text-decoration: none;font-weight: 700;font-size: 1.2rem;transition: all 0.3s;}
.hero-cta:hover {background: #FFF;transform: scale(1.1);}
section {background: rgba(255, 255, 255, 0.95);padding: 3rem;margin-bottom: 2rem;border-radius: 15px;box-shadow: 0 5px 20px rgba(0,0,0,0.2);}
h2 {font-family: 'Bebas Neue', cursive;font-size: 2.5rem;color: #8B0000;margin-bottom: 1.5rem;text-align: center;}
h3 {font-size: 1.5rem;color: #8B0000;margin-bottom: 1rem;}
p {margin-bottom: 1rem;text-align: justify;}
ul {margin-left: 2rem;margin-bottom: 1rem;}
li {margin-bottom: 0.5rem;}
.games-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 2rem;margin-top: 2rem;}
.game-card {background: #FFF;border-radius: 10px;overflow: hidden;box-shadow: 0 3px 15px rgba(0,0,0,0.1);transition: transform 0.3s;}
.game-card:hover {transform: translateY(-10px);}
.game-card img {width: 100%;height: 200px;object-fit: cover;}
.game-card h3 {padding: 1rem 1rem 0.5rem;color: #8B0000;}
.game-card p {padding: 0 1rem 1rem;font-size: 0.9rem;}
.game-card a {display: block;background: #FFD700;color: #8B0000;text-align: center;padding: 0.75rem;text-decoration: none;font-weight: 700;transition: background 0.3s;}
.game-card a:hover {background: #8B0000;color: #FFD700;}
.bonus-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 2rem;margin-top: 2rem;}
.bonus-item {background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);padding: 2rem;border-radius: 10px;box-shadow: 0 3px 15px rgba(0,0,0,0.1);}
.bonus-item h3 {color: #8B0000;font-size: 1.3rem;}
.bonus-item p {color: #333;}
.payment-content {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 2rem;margin-top: 2rem;}
.payment-item {text-align: center;}
.payment-item img {width: 100%;max-width: 300px;height: auto;border-radius: 10px;margin-bottom: 1rem;}
.payment-note {background: #FFF3CD;border-left: 4px solid #FFD700;padding: 1rem;margin-top: 2rem;border-radius: 5px;}
.reviews-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 2rem;margin-top: 2rem;}
.review-card {background: #F8F9FA;padding: 1.5rem;border-radius: 10px;border-left: 4px solid #FFD700;}
.review-header {display: flex;justify-content: space-between;align-items: center;margin-bottom: 1rem;}
.review-header strong {color: #8B0000;}
.rating {color: #FFD700;font-size: 1.2rem;}
.review-card time {display: block;margin-top: 1rem;font-size: 0.85rem;color: #666;}
.license-content {display: flex;gap: 2rem;align-items: center;flex-wrap: wrap;}
.license-content img {max-width: 300px;height: auto;border-radius: 10px;}
.license-text {flex: 1;min-width: 300px;}
.support-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 2rem;margin-top: 2rem;}
.support-item {text-align: center;padding: 1.5rem;background: #F8F9FA;border-radius: 10px;}
.support-item img {width: 100%;max-width: 200px;height: auto;margin-bottom: 1rem;border-radius: 10px;}
.faq-list {margin-top: 2rem;}
.faq-item {background: #F8F9FA;padding: 1.5rem;margin-bottom: 1rem;border-radius: 10px;border-left: 4px solid #FFD700;}
.faq-item h3 {font-size: 1.2rem;color: #8B0000;margin-bottom: 0.75rem;}
.cta-final {text-align: center;background: linear-gradient(135deg, #8B0000 0%, #FFD700 100%);color: #FFF;padding: 4rem 3rem;}
.cta-final h2 {color: #FFF;}
.cta-final p {color: #FFF;font-size: 1.2rem;}
.cta-button-large {display: inline-block;background: #FFD700;color: #8B0000;padding: 1.25rem 3rem;border-radius: 30px;text-decoration: none;font-weight: 700;font-size: 1.3rem;margin: 2rem 0;transition: all 0.3s;}
.cta-button-large:hover {background: #FFF;transform: scale(1.1);}
.cta-note {font-size: 0.9rem;color: #FFF;}
footer {background: #1a1a1a;color: #FFF;padding: 3rem 2rem 1rem;}
.footer-content {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 2rem;max-width: 1200px;margin: 0 auto 2rem;}
.footer-section h3 {color: #FFD700;margin-bottom: 1rem;}
.footer-section ul {list-style: none;margin-left: 0;}
.footer-section a {color: #FFF;text-decoration: none;transition: color 0.3s;}
.footer-section a:hover {color: #FFD700;}
.footer-bottom {text-align: center;padding-top: 2rem;border-top: 1px solid #333;max-width: 1200px;margin: 0 auto;}
.footer-bottom p {margin-bottom: 0.5rem;font-size: 0.9rem;}
@media (max-width: 768px) {
nav {flex-direction: column;gap: 1rem;}
.nav-menu {flex-direction: column;align-items: center;gap: 1rem;}
.hero-content h1 {font-size: 2rem;}
.hero-content p {font-size: 1rem;}
h2 {font-size: 2rem;}
.games-grid, .bonus-grid, .payment-content, .reviews-grid, .support-grid {grid-template-columns: 1fr;}
}
