/* okgames.cfd Stylesheet - All classes use pgd1- prefix */
:root {
  --pgd1-dark-bg: #273746;
  --pgd1-lime-green: #32CD32;
  --pgd1-aquamarine: #66CDAA;
  --pgd1-light-goldenrod: #FAFAD2;
  --pgd1-gold: #FFCC33;
  --pgd1-white: #FFFFFF;
  --pgd1-text-dark: #2C3E50;
  --pgd1-gray-light: #ECF0F1;
  --pgd1-overlay-dark: rgba(39, 55, 70, 0.95);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 62.5%; scroll-behavior: smooth; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size: 1.6rem; line-height: 1.6; color: var(--pgd1-text-dark); background: var(--pgd1-gray-light); -webkit-font-smoothing: antialiased; }
.pgd1-container { max-width: 430px; margin: 0 auto; padding: 0 1.6rem; background: var(--pgd1-white); min-height: 100vh; }
.pgd1-header { position: sticky; top: 0; z-index: 1000; background: linear-gradient(135deg, var(--pgd1-dark-bg) 0%, #1a252f 100%); padding: 1.2rem 1.6rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); display: flex; justify-content: space-between; align-items: center; }
.pgd1-header-logo { display: flex; align-items: center; gap: 0.8rem; text-decoration: none; }
.pgd1-logo-icon { width: 2.8rem; height: 2.8rem; background: var(--pgd1-lime-green); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; }
.pgd1-logo-text { font-size: 2rem; font-weight: 700; color: var(--pgd1-white); letter-spacing: -0.5px; }
.pgd1-header-buttons { display: flex; gap: 1rem; }
.pgd1-btn-header { padding: 0.8rem 1.6rem; border-radius: 2rem; font-size: 1.4rem; font-weight: 600; text-decoration: none; transition: all 0.3s ease; cursor: pointer; border: none; min-height: 4.4rem; }
.pgd1-btn-register { background: var(--pgd1-lime-green); color: var(--pgd1-dark-bg); }
.pgd1-btn-register:hover { background: var(--pgd1-aquamarine); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(50, 205, 50, 0.4); }
.pgd1-btn-login { background: transparent; color: var(--pgd1-gold); border: 2px solid var(--pgd1-gold); }
.pgd1-btn-login:hover { background: var(--pgd1-gold); color: var(--pgd1-dark-bg); }
.pgd1-menu-button { display: none; background: none; border: none; color: var(--pgd1-white); font-size: 2.4rem; cursor: pointer; padding: 0.5rem; }
.pgd1-mobile-menu-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--pgd1-overlay-dark); z-index: 9999; display: flex; flex-direction: column; padding: 8rem 2rem 2rem; transform: translateX(-100%); transition: transform 0.3s ease; }
.pgd1-mobile-menu-overlay.pgd1-menu-open { transform: translateX(0); }
.pgd1-menu-close { position: absolute; top: 2rem; right: 2rem; background: none; border: none; color: var(--pgd1-white); font-size: 3rem; cursor: pointer; }
.pgd1-menu-nav { display: flex; flex-direction: column; gap: 1.5rem; }
.pgd1-menu-link { color: var(--pgd1-white); text-decoration: none; font-size: 1.8rem; padding: 1rem 1.5rem; border-radius: 1rem; transition: all 0.3s ease; display: flex; align-items: center; gap: 1rem; }
.pgd1-menu-link:hover { background: rgba(255, 255, 255, 0.1); padding-left: 2rem; }
.pgd1-main { padding: 2rem 0 8rem; }
.pgd1-carousel { position: relative; width: 100%; overflow: hidden; border-radius: 1.2rem; margin-bottom: 2.4rem; cursor: pointer; }
.pgd1-carousel-track { display: flex; transition: transform 0.5s ease; }
.pgd1-carousel-slide { min-width: 100%; height: 20rem; overflow: hidden; }
.pgd1-carousel-slide img { width: 100%; height: 100%; object-fit: cover; }
.pgd1-section { margin-bottom: 3rem; }
.pgd1-section-title { font-size: 2.4rem; font-weight: 700; color: var(--pgd1-dark-bg); margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.8rem; }
.pgd1-section-title i { color: var(--pgd1-lime-green); }
.pgd1-game-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.pgd1-game-card { background: var(--pgd1-white); border-radius: 1rem; overflow: hidden; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; cursor: pointer; text-decoration: none; display: block; }
.pgd1-game-card:hover { transform: translateY(-4px); box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); }
.pgd1-game-image { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--pgd1-gray-light); }
.pgd1-game-name { padding: 0.8rem 0.5rem; font-size: 1.2rem; font-weight: 600; color: var(--pgd1-text-dark); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pgd1-info-module { background: linear-gradient(135deg, var(--pgd1-light-goldenrod) 0%, #fff8dc 100%); border-radius: 1.2rem; padding: 2rem; margin-bottom: 2rem; border-left: 4px solid var(--pgd1-gold); }
.pgd1-module-title { font-size: 2rem; font-weight: 700; color: var(--pgd1-dark-bg); margin-bottom: 1rem; }
.pgd1-module-content { font-size: 1.5rem; line-height: 1.8; color: var(--pgd1-text-dark); }
.pgd1-module-content p { margin-bottom: 1rem; }
.pgd1-btn-primary { display: inline-block; background: linear-gradient(135deg, var(--pgd1-lime-green) 0%, var(--pgd1-aquamarine) 100%); color: var(--pgd1-dark-bg); padding: 1.2rem 2.4rem; border-radius: 2.5rem; font-size: 1.6rem; font-weight: 700; text-decoration: none; transition: all 0.3s ease; border: none; cursor: pointer; box-shadow: 0 4px 12px rgba(50, 205, 50, 0.3); }
.pgd1-btn-primary:hover { transform: translateY(-3px); box-shadow: 0 6px 16px rgba(50, 205, 50, 0.4); }
.pgd1-btn-secondary { display: inline-block; background: var(--pgd1-gold); color: var(--pgd1-dark-bg); padding: 1rem 2rem; border-radius: 2rem; font-size: 1.5rem; font-weight: 600; text-decoration: none; transition: all 0.3s ease; border: none; cursor: pointer; }
.pgd1-btn-secondary:hover { background: #e6b800; transform: translateY(-2px); }
.pgd1-footer { background: var(--pgd1-dark-bg); padding: 3rem 1.6rem 10rem; margin-top: 4rem; }
.pgd1-footer-links { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 2rem; }
.pgd1-footer-link { color: var(--pgd1-light-goldenrod); text-decoration: none; font-size: 1.4rem; padding: 0.5rem 1rem; border-radius: 0.5rem; transition: all 0.3s ease; }
.pgd1-footer-link:hover { background: rgba(255, 255, 255, 0.1); color: var(--pgd1-white); }
.pgd1-partners { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; margin-bottom: 2rem; }
.pgd1-partner-logo { width: 6rem; height: 3rem; object-fit: contain; opacity: 0.8; transition: opacity 0.3s ease; }
.pgd1-partner-logo:hover { opacity: 1; }
.pgd1-copyright { text-align: center; color: var(--pgd1-gray-light); font-size: 1.3rem; padding-top: 2rem; border-top: 1px solid rgba(255, 255, 255, 0.1); }
.pgd1-bottom-nav { position: fixed; bottom: 0; left: 0; width: 100%; background: linear-gradient(135deg, var(--pgd1-dark-bg) 0%, #1a252f 100%); display: flex; justify-content: space-around; padding: 0.8rem 0; box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.15); z-index: 1000; }
.pgd1-nav-item { display: flex; flex-direction: column; align-items: center; gap: 0.3rem; text-decoration: none; color: var(--pgd1-gray-light); min-width: 6rem; min-height: 6rem; justify-content: center; transition: all 0.3s ease; border-radius: 1rem; padding: 0.5rem; }
.pgd1-nav-item i { font-size: 2.2rem; color: var(--pgd1-light-goldenrod); }
.pgd1-nav-item span { font-size: 1rem; font-weight: 500; color: var(--pgd1-white); }
.pgd1-nav-item:hover { background: rgba(255, 255, 255, 0.1); transform: scale(1.05); }
.pgd1-nav-item.active { background: rgba(50, 205, 50, 0.2); }
.pgd1-nav-item.active i { color: var(--pgd1-lime-green); }
@media (min-width: 769px) {
  .pgd1-bottom-nav { display: none; }
  .pgd1-main { padding-bottom: 2rem; }
  .pgd1-footer { padding-bottom: 3rem; }
}
@media (max-width: 768px) {
  .pgd1-menu-button { display: block; }
  .pgd1-header-buttons { display: none; }
}
.pgd1-faq-item { background: var(--pgd1-white); border-radius: 1rem; padding: 1.5rem; margin-bottom: 1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); }
.pgd1-faq-question { font-size: 1.6rem; font-weight: 700; color: var(--pgd1-dark-bg); margin-bottom: 0.8rem; }
.pgd1-faq-answer { font-size: 1.5rem; line-height: 1.7; color: #555; }
