/*
Theme Name: 雷电模拟器主题
Theme URI: https://example.com/leidian
Author: 雷电模拟器团队
Author URI: https://example.com
Description: 专为雷电模拟器官网设计的WordPress主题，支持响应式布局、SEO优化、多开功能展示。
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: leidian
Tags: one-column, custom-menu, featured-images, theme-options, translation-ready

雷电模拟器WordPress主题，基于原HTML首页转换而来。
*/

/* Reset and Base Styles */
*,:after,:before{box-sizing:border-box}
body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;line-height:1.6;color:#333}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
ul,ol{list-style:none;margin:0;padding:0}

/* Container */
.container{max-width:1200px;margin:0 auto;padding:0 1rem}

/* Grid System */
.grid{display:grid;gap:1.5rem}
.grid-cols-1{grid-template-columns:repeat(1,1fr)}
.grid-cols-2{grid-template-columns:repeat(2,1fr)}
.grid-cols-3{grid-template-columns:repeat(3,1fr)}
.grid-cols-6{grid-template-columns:repeat(6,1fr)}

@media (min-width:768px){
  .md\:grid-cols-2{grid-template-columns:repeat(2,1fr)}
  .md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}
  .md\:grid-cols-4{grid-template-columns:repeat(4,1fr)}
}
@media (min-width:1024px){
  .lg\:grid-cols-2{grid-template-columns:repeat(2,1fr)}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,1fr)}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,1fr)}
  .lg\:grid-cols-6{grid-template-columns:repeat(6,1fr)}
}

/* Flexbox */
.flex{display:flex}
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.items-center{align-items:center}
.items-start{align-items:flex-start}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.gap-1{gap:.25rem}
.gap-2{gap:.5rem}
.gap-3{gap:.75rem}
.gap-4{gap:1rem}
.gap-6{gap:1.5rem}
.gap-8{gap:2rem}

/* Spacing */
.p-4{padding:1rem}
.p-6{padding:1.5rem}
.p-8{padding:2rem}
.px-3{padding-left:.75rem;padding-right:.75rem}
.px-4{padding-left:1rem;padding-right:1rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}
.px-8{padding-left:2rem;padding-right:2rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-5{padding-top:1.25rem;padding-bottom:1.25rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-20{padding-top:5rem;padding-bottom:5rem}
.pt-8{padding-top:2rem}
.pb-5{padding-bottom:1.25rem}
.mb-2{margin-bottom:.5rem}
.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}
.mb-12{margin-bottom:3rem}
.mb-16{margin-bottom:4rem}
.mt-2{margin-top:.5rem}
.mt-8{margin-top:2rem}
.mr-1{margin-right:.25rem}
.mr-3{margin-right:.75rem}
.mr-4{margin-right:1rem}
.ml-2{margin-left:.5rem}
.ml-16{margin-left:4rem}
.mx-auto{margin-left:auto;margin-right:auto}

/* Typography */
.text-xs{font-size:.75rem;line-height:1rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.text-5xl{font-size:3rem;line-height:1}
.text-6xl{font-size:3.75rem;line-height:1}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.leading-tight{line-height:1.25}
.leading-relaxed{line-height:1.625}
.text-center{text-align:center}
.text-white{color:#fff}
.text-black{color:#000}
.text-gray-300{color:#d1d5db}
.text-gray-400{color:#9ca3af}
.text-gray-500{color:#6b7280}
.text-gray-600{color:#4b5563}
.text-gray-900{color:#111827}

/* Colors */
.bg-white{background-color:#fff}
.bg-black{background-color:#000}
.bg-gray-50{background-color:#f9fafb}
.bg-gray-100{background-color:#f3f4f6}
.bg-gray-200{background-color:#e5e7eb}
.bg-gray-900{background-color:#111827}
.bg-primary{background-color:#FFB800}
.bg-primary\/5{background-color:rgba(255,184,0,.05)}
.bg-primary\/10{background-color:rgba(255,184,0,.1)}
.bg-primary\/20{background-color:rgba(255,184,0,.2)}
.bg-primary\/90{background-color:rgba(255,184,0,.9)}
.text-primary{color:#FFB800}
.border-primary\/30{border-color:rgba(255,184,0,.3)}
.shadow-primary\/25{box-shadow:0 10px 15px -3px rgba(255,184,0,.25)}

/* Gradients */
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}
.from-gray-900{--tw-gradient-from:#111827;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(17,24,39,0))}
.via-gray-800{--tw-gradient-via:#1f2937;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-via),var(--tw-gradient-to,rgba(31,41,55,0))}
.to-black{--tw-gradient-to:#000}
.from-gray-900{--tw-gradient-from:#111827;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(17,24,39,0))}
.to-black{--tw-gradient-to:#000}
.from-primary\/5{--tw-gradient-from:rgba(255,184,0,.05);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(255,184,0,0))}
.to-primary\/10{--tw-gradient-to:rgba(255,184,0,.1)}
.from-blue-50{--tw-gradient-from:#eff6ff;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(239,246,255,0))}
.to-blue-100{--tw-gradient-to:#dbeafe}
.from-green-50{--tw-gradient-from:#f0fdf4;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(240,253,244,0))}
.to-green-100{--tw-gradient-to:#dcfce7}
.from-purple-50{--tw-gradient-from:#faf5ff;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(250,245,255,0))}
.to-purple-100{--tw-gradient-to:#f3e8ff}
.from-red-50{--tw-gradient-from:#fef2f2;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(254,242,242,0))}
.to-red-100{--tw-gradient-to:#fee2e2}
.from-indigo-50{--tw-gradient-from:#eef2ff;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(238,242,255,0))}
.to-indigo-100{--tw-gradient-to:#e0e7ff}

/* Border */
.rounded{border-radius:.25rem}
.rounded-lg{border-radius:.5rem}
.rounded-xl{border-radius:.75rem}
.rounded-2xl{border-radius:1rem}
.rounded-full{border-radius:9999px}
.border{border-width:1px}
.border-t{border-top-width:1px}
.border-b{border-bottom-width:1px}

/* Shadow */
.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1)}
.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1)}
.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1)}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}

/* Position */
.fixed{position:fixed}
.absolute{position:absolute}
.relative{position:relative}
.z-10{z-index:10}
.z-50{z-index:50}
.top-0{top:0}
.left-0{left:0}
.right-0{right:0}
.bottom-20{bottom:5rem}
.bottom-6{bottom:1.5rem}
.-top-6{top:-1.5rem}
.-right-6{right:-1.5rem}
.-bottom-6{bottom:-1.5rem}
.-left-6{left:-1.5rem}
.inset-0{top:0;right:0;bottom:0;left:0}

/* Sizing */
.w-4{width:1rem}
.w-6{width:1.5rem}
.w-10{width:2.5rem}
.w-12{width:3rem}
.w-16{width:4rem}
.w-24{width:6rem}
.w-32{width:8rem}
.w-96{width:24rem}
.w-auto{width:auto}
.w-full{width:100%}
.h-4{height:1rem}
.h-6{height:1.5rem}
.h-8{height:2rem}
.h-10{height:2.5rem}
.h-12{height:3rem}
.h-16{height:4rem}
.h-24{height:6rem}
.h-32{height:8rem}
.h-96{height:24rem}
.h-full{height:100%}
.min-h-screen{min-height:100vh}

/* Display */
.hidden{display:none}
.block{display:block}
.inline-block{display:inline-block}
.inline-flex{display:inline-flex}
.grid{display:grid}
.flex{display:flex}

/* Overflow */
.overflow-hidden{overflow:hidden}

/* Transform */
.transform{transform:translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}
.-translate-x-1\/2{--tw-translate-x:-50%}
.-translate-y-1\/2{--tw-translate-y:-50%}
.hover\:scale-105:hover{--tw-scale-x:1.05;--tw-scale-y:1.05}
.hover\:-translate-y-2:hover{--tw-translate-y:-0.5rem}

/* Transition */
.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.duration-200{transition-duration:.2s}
.duration-300{transition-duration:.3s}

/* Animation */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
.animate-float{animation:float 6s ease-in-out infinite}

/* Hover Effects */
.hover\:bg-white\/10:hover{background-color:rgba(255,255,255,.1)}
.hover\:bg-primary\/90:hover{background-color:rgba(255,184,0,.9)}
.hover\:bg-gray-100:hover{background-color:#f3f4f6}
.hover\:text-primary:hover{color:#FFB800}
.hover\:text-white:hover{color:#fff}
.hover\:shadow-xl:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1)}
.hover\:shadow-primary\/25:hover{box-shadow:0 10px 15px -3px rgba(255,184,0,.25)}
.group:hover .group-hover\:bg-primary\/90{background-color:rgba(255,184,0,.9)}

/* Backdrop */
.backdrop-blur-sm{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

/* Object Fit */
.object-cover{object-fit:cover}

/* Truncate */
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.whitespace-nowrap{white-space:nowrap}

/* List */
.list-decimal{list-style-type:decimal}
.list-inside{list-style-position:inside}

/* Space */
.space-y-2>*+*{margin-top:.5rem}
.space-y-3>*+*{margin-top:.75rem}
.space-y-6>*+*{margin-top:1.5rem}
.space-x-1>*+*{margin-left:.25rem}
.space-x-2>*+*{margin-left:.5rem}
.space-x-4>*+*{margin-left:1rem}

/* Max Width */
.max-w-3xl{max-width:48rem}
.max-w-4xl{max-width:56rem}
.max-w-6xl{max-width:72rem}

/* Notation */
.not-italic{font-style:normal}

/* Header Styles */
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(23,23,26,.9);color:rgba(255,255,255,.9)}
.header-nav{display:flex;align-items:center;justify-content:space-between;height:58px;padding:0 1rem}
.header-logo{display:flex;align-items:center;gap:0.5rem;text-decoration:none}
.header-logo img{height:32px;width:auto}
.header-logo span{font-size:1.25rem;font-weight:700}
.header-menu{display:flex;gap:1rem;margin-left:4rem}
.header-menu a{padding:.5rem .75rem;font-size:.875rem;color:rgba(255,255,255,.9);transition:color .2s}
.header-menu a:hover{color:#FFB800}
.header-actions{display:flex;align-items:center;gap:1rem}
.download-btn{display:inline-flex;align-items:center;padding:.25rem 1rem;background:#FFB800;color:#000;font-weight:500;border-radius:9999px;font-size:.875rem;text-decoration:none;transition:background .2s}
.download-btn:hover{background:rgba(255,184,0,.9)}
.download-btn img{width:16px;height:16px;margin-right:.25rem}

/* Mobile Menu */
.mobile-menu-btn{display:none;padding:.5rem;border:none;background:transparent;color:rgba(255,255,255,.9);cursor:pointer}
.mobile-nav{display:none;background:rgba(23,23,26,.95);border-top:1px solid rgba(255,255,255,.1)}
.mobile-nav.is-open{display:block}
.mobile-nav ul{list-style:none;margin:0;padding:0}
.mobile-nav li{margin:0}
.mobile-nav a{display:block;padding:.5rem .75rem;font-size:.875rem;color:rgba(255,255,255,.9);text-decoration:none;transition:color .2s}
.mobile-nav a:hover{color:#FFB800}

/* WordPress Menu Styles */
.header-menu ul{display:flex;gap:1rem;margin:0;padding:0;list-style:none}
.header-menu li{margin:0}
.footer-nav ul{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem .5rem;margin:0;padding:0;list-style:none}
.footer-nav li{margin:0}

/* FAQ Section - 确保样式优先级 */
.faq-section .faq-list{display:flex;flex-direction:column;gap:1rem;max-width:56rem;margin:0 auto}
.faq-section .faq-item{background:#f9fafb;border-radius:.75rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);overflow:hidden}
.faq-section .faq-toggle{width:100%;padding:1.25rem 1.5rem;text-align:left;display:flex;align-items:center;justify-content:space-between;border:none;background:transparent;cursor:pointer;transition:background .2s;font-size:1rem}
.faq-section .faq-toggle:hover{background:#f3f4f6}
.faq-section .faq-toggle h3{font-size:1.125rem;font-weight:600;color:#111827;margin:0;padding-right:1rem}
.faq-section .faq-toggle svg{width:1.5rem;height:1.5rem;color:#FFB800;flex-shrink:0;transition:transform .2s}
.faq-section .faq-item.is-open .faq-toggle svg{transform:rotate(180deg)}
.faq-section .faq-answer{display:none !important;padding:0 1.5rem 1.25rem;color:#4b5563;line-height:1.625}
.faq-section .faq-item.is-open .faq-answer{display:block !important}

@media (max-width:1023px){
  .header-menu{display:none}
  .header-actions .download-btn{display:none}
  .mobile-menu-btn{display:flex}
}

/* Hero Section */
.hero-section{position:relative;overflow:hidden;background:linear-gradient(to bottom right,#111827,#1f2937,#000)}
.hero-section::before{content:'';position:absolute;inset:0}
.hero-section .bg-blob-1{position:absolute;bottom:5rem;right:2.5rem;width:24rem;height:24rem;background:rgba(255,184,0,.1);border-radius:50%;filter:blur(3rem)}
.hero-section .bg-blob-2{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50rem;height:50rem;background:rgba(255,184,0,.05);border-radius:50%;filter:blur(3rem)}
.hero-content{position:relative;z-index:10;padding:5rem 0}
.hero-text{color:#fff}
.hero-title{font-size:3rem;font-weight:700;line-height:1.25;margin-bottom:1.5rem}
@media (min-width:1024px){.hero-title{font-size:4.5rem}}
.hero-title .text-primary{color:#FFB800}
.hero-subtitle{font-size:1.25rem;color:#d1d5db;line-height:1.6;margin-bottom:2rem}
@media (min-width:1024px){.hero-subtitle{font-size:1.5rem}}
.hero-tags{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:2rem}
.hero-tag{padding:.5rem 1rem;background:rgba(255,184,0,.2);border:1px solid rgba(255,184,0,.3);border-radius:9999px;color:#FFB800;font-weight:500}
.hero-download{display:inline-flex;align-items:center;padding:1rem 2rem;background:#FFB800;color:#000;font-weight:700;border-radius:.75rem;text-decoration:none;transition:all .3s;box-shadow:0 10px 15px -3px rgba(255,184,0,.25)}
.hero-download:hover{background:rgba(255,184,0,.9);transform:scale(1.05)}
.hero-download img{width:24px;height:24px;margin-right:.75rem}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding-top:2rem;border-top:1px solid #374151}
.hero-stat{text-align:center}
.hero-stat .number{font-size:1.875rem;font-weight:700;color:#FFB800}
.hero-stat .label{color:#9ca3af}
.hero-image{position:relative}
.hero-image img{width:100%;height:auto;border-radius:1rem;box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}
.hero-image .float-1{position:absolute;top:-1.5rem;right:-1.5rem;width:6rem;height:6rem;background:rgba(255,184,0,.2);border-radius:50%;animation:float 6s ease-in-out infinite}
.hero-image .float-2{position:absolute;bottom:-1.5rem;left:-1.5rem;width:8rem;height:8rem;background:rgba(255,184,0,.2);border-radius:50%;animation:float 6s ease-in-out infinite 1s}

/* Features Section */
.features-section{padding:5rem 0;background:#fff}
.section-title{text-align:center;margin-bottom:4rem}
.section-title h2{font-size:2.25rem;font-weight:700;color:#111827;margin-bottom:1.5rem}
@media (min-width:1024px){.section-title h2{font-size:3rem}}
.section-title h2 .text-primary{color:#FFB800}
.section-title p{font-size:1.25rem;color:#4b5563;max-width:48rem;margin:0 auto}
.feature-card{padding:2rem;background:linear-gradient(to bottom right,rgba(255,184,0,.05),rgba(255,184,0,.1));border-radius:1rem;transition:all .3s}
.feature-card:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1);transform:translateY(-0.5rem)}
.feature-icon{width:4rem;height:4rem;margin-bottom:1.5rem;padding:1rem;background:#FFB800;border-radius:.75rem}
.feature-icon svg{width:100%;height:100%;color:#000}
.feature-card h3{font-size:1.5rem;font-weight:700;color:#111827;margin-bottom:1rem}
.feature-card p{color:#4b5563;line-height:1.625}

/* Games Section */
.games-section{padding:5rem 0;background:linear-gradient(to bottom right,#111827,#000)}
.game-card{position:relative;overflow:hidden;border-radius:1rem;padding:1.5rem;transition:all .3s}
.game-card:hover{transform:scale(1.05)}
.game-card .game-icon{width:4rem;height:4rem;margin:0 auto 1rem;display:flex;align-items:center;justify-content:center;border-radius:.75rem}
.game-card img{width:3rem;height:3rem;object-fit:cover;border-radius:.25rem}
.game-card h3{color:#fff;font-weight:600;text-align:center}

/* Reviews Section */
.reviews-section{padding:5rem 0;background:#f9fafb}
.review-card{background:#fff;padding:2rem;border-radius:1rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1);transition:all .3s}
.review-card:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}
.review-avatar{width:3rem;height:3rem;border-radius:50%;background:#FFB800;display:flex;align-items:center;justify-content:center;color:#000;font-weight:700;margin-right:1rem}
.review-stars{color:#FFB800}

/* Rating Section */
.rating-section{padding:5rem 0;background:linear-gradient(to bottom right,#111827,#1f2937,#000)}
.rating-summary{background:rgba(255,255,255,.05);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.1);border-radius:1rem;padding:2rem}
.rating-score{font-size:3.75rem;font-weight:700;color:#FFB800;text-align:center;margin-bottom:.5rem}
.rating-stars{text-align:center;color:#FFB800;font-size:1.5rem;letter-spacing:.25rem;margin-bottom:.5rem}
.rating-count{text-align:center;color:#9ca3af;font-size:.875rem}
.rating-bar{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}
.rating-bar .label{width:2rem;flex-shrink:0;color:#9ca3af;font-size:.875rem}
.rating-bar .track{flex:1;height:.5rem;background:rgba(255,255,255,.1);border-radius:9999px;overflow:hidden}
.rating-bar .fill{height:100%;background:#FFB800;border-radius:9999px;transition:width .6s ease}
.rating-bar .percent{width:2.5rem;flex-shrink:0;text-align:right;color:#9ca3af;font-size:.875rem}
.review-detail{background:#fff;border-radius:1rem;padding:1.5rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1);transition:box-shadow .3s}
.review-detail:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}

/* News Section */
.news-section{padding:5rem 0;background:#f9fafb}
.news-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:1.5rem}
@media (min-width:640px){.news-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.news-grid{grid-template-columns:repeat(4,1fr)}}
.news-card{display:flex;flex-direction:column;background:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);transition:all .3s;text-decoration:none;color:inherit;border:1px solid #e5e7eb}
.news-card:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1);transform:translateY(-4px);border-color:#d1d5db}
.news-card-image{width:100%;height:180px;overflow:hidden;background:#f3f4f6}
.news-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s;display:block;margin:0;padding:0;border:none}
.news-card:hover .news-card-image img{transform:scale(1.05)}
.news-card-content{padding:1.25rem;flex:1;display:flex;flex-direction:column}
.news-card-title{font-size:1rem;font-weight:700;color:#111827;margin:0 0 .5rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-card:hover .news-card-title{color:#FFB800}
.news-card-excerpt{font-size:.875rem;color:#6b7280;line-height:1.5;margin:0 0 .75rem;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-card-date{font-size:.75rem;color:#9ca3af}
.news-more{display:flex;justify-content:center;margin-top:2.5rem}
.news-more-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 2rem;background:#FFB800;color:#fff;border-radius:9999px;font-weight:500;text-decoration:none;transition:all .3s}
.news-more-btn:hover{background:rgba(255,184,0,.9);transform:scale(1.02)}
.news-more-btn svg{transition:transform .2s}
.news-more-btn:hover svg{transform:translateX(4px)}
.news-empty{grid-column:1/-1;text-align:center;padding:3rem;color:#6b7280}

/* FAQ Section */
.faq-section{padding:5rem 0;background:#fff}
.faq-list{display:flex;flex-direction:column;gap:1rem;max-width:56rem;margin:0 auto}
.faq-item{background:#f9fafb;border-radius:.75rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);overflow:hidden}
.faq-toggle{width:100%;padding:1.25rem 1.5rem;text-align:left;display:flex;align-items:center;justify-content:space-between;border:none;background:transparent;cursor:pointer;transition:background .2s}
.faq-toggle:hover{background:#f3f4f6}
.faq-toggle h3{font-size:1.125rem;font-weight:600;color:#111827;margin:0;padding-right:1rem}
.faq-toggle svg{width:1.5rem;height:1.5rem;color:#FFB800;flex-shrink:0;transition:transform .2s}
.faq-item.is-open .faq-toggle svg{transform:rotate(180deg)}
.faq-answer{display:none;padding:0 1.5rem 1.25rem;color:#4b5563;line-height:1.625}
.faq-item.is-open .faq-answer{display:block}

/* Footer */
.site-footer{background:#f9fafb;border-top:1px solid #e5e7eb;padding:1.5rem 0}
.footer-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem .5rem;margin-bottom:1rem}
.footer-nav a{font-size:.875rem;color:#4b5563;text-decoration:none;transition:color .2s}
.footer-nav a:hover{color:#FFB800}
.footer-copyright{text-align:center;font-size:.75rem;color:#6b7280}

/* Utility Classes */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
.group{position:relative}

/* Responsive Adjustments */
@media (max-width:767px){
  .hero-title{font-size:2.25rem}
  .hero-subtitle{font-size:1rem}
  .hero-stats{grid-template-columns:repeat(3,1fr);gap:1rem}
  .hero-stat .number{font-size:1.25rem}
  .section-title h2{font-size:1.875rem}
  .feature-card{padding:1.5rem}
  .game-card{padding:1rem}
  .review-card{padding:1.5rem}
  .rating-summary{padding:1.5rem}
  .rating-score{font-size:3rem}
}

@media (min-width:768px) and (max-width:1023px){
  .hero-title{font-size:3rem}
  .section-title h2{font-size:2.25rem}
}

/* News Hero Section */
.news-hero-section{background:linear-gradient(to bottom right,#111827,#1f2937,#000);padding-top:58px;margin-bottom:3rem}
.news-hero-title{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem}
@media (min-width:1024px){.news-hero-title{font-size:2.25rem}}
.news-hero-subtitle{font-size:1.125rem;color:#d1d5db;max-width:48rem;margin:0 auto}
@media (min-width:1024px){.news-hero-subtitle{font-size:1.25rem}}

/* Article Grid */
.article-grid{display:grid !important;grid-template-columns:repeat(1,1fr) !important;gap:1.5rem !important;margin-bottom:3rem}
@media (min-width:640px){.article-grid{grid-template-columns:repeat(2,1fr) !important}}
@media (min-width:1024px){.article-grid{grid-template-columns:repeat(3,1fr) !important}}
@media (min-width:1280px){.article-grid{grid-template-columns:repeat(4,1fr) !important}}

/* Article Card - New Style */
.article-card{position:relative !important;display:flex !important;flex-direction:column !important;background:#fff;border-radius:.5rem;overflow:hidden;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);transition:all .3s}
.article-card:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1);transform:translateY(-4px)}
.article-image{height:12rem !important;overflow:hidden;background:#f3f4f6;flex-shrink:0}
@media (min-width:640px){.article-image{height:20rem !important}}
@media (min-width:768px){.article-image{height:14rem !important}}
@media (min-width:1024px){.article-image{height:12rem !important}}
.article-image img{width:100% !important;height:100% !important;object-fit:cover !important;display:block !important}
.article-card:hover .article-image img{transform:scale(1.05)}
.article-content{padding:1rem !important;flex:1;display:flex;flex-direction:column}
.article-title{font-size:1rem !important;font-weight:600 !important;color:#111827 !important;margin:0 0 .5rem !important;line-height:1.4 !important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .3s}
.article-card:hover .article-title{color:#FFB800}
.article-excerpt{font-size:.875rem !important;color:#6b7280 !important;line-height:1.5 !important;margin:0 0 1rem !important;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.article-meta{font-size:.875rem !important;color:#9ca3af !important;padding-bottom:.5rem}
.article-link{position:absolute !important;top:0 !important;left:0 !important;width:100% !important;height:100% !important;z-index:1 !important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Article Pagination */
.article-pagination{display:flex;justify-content:center;padding:3rem 0}
.article-pagination .nav-links{display:flex;align-items:center;gap:.5rem}
.article-pagination .page-numbers{display:flex;align-items:center;justify-content:center;min-width:2.5rem;height:2.5rem;padding:0 .5rem;border-radius:.5rem;background:#fff;border:1px solid #e5e7eb;color:#4b5563;font-weight:500;font-size:.875rem;text-decoration:none;transition:all .2s}
.article-pagination .page-numbers:hover{background:#f9fafb;border-color:#d1d5db}
.article-pagination .page-numbers.current{background:#FFB800;border-color:#FFB800;color:#fff}
.article-pagination .prev,.article-pagination .next{background:transparent;border:none}
.article-pagination .dots{padding:0 .5rem;color:#9ca3af}

/* Sidebar Widgets */
.articles-sidebar{display:flex;flex-direction:column;gap:1.5rem}
.sidebar-widget{background:#fff;border-radius:1rem;padding:1.5rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}
.widget-title{font-size:1.125rem;font-weight:700;color:#111827;margin:0 0 1rem;padding-bottom:.75rem;border-bottom:2px solid #FFB800}
.widget-list{list-style:none;margin:0;padding:0}
.widget-list li{padding:.5rem 0;border-bottom:1px solid #f3f4f6}
.widget-list li:last-child{border-bottom:none}
.widget-list a{display:flex;align-items:center;justify-content:space-between;text-decoration:none;color:#4b5563;transition:color .2s}
.widget-list a:hover{color:#FFB800}
.widget-list-title{flex:1;font-size:.875rem;font-weight:500;line-height:1.4}
.widget-list-date,.widget-list-views{font-size:.75rem;color:#9ca3af;margin-left:.5rem}

/* Search Form */
.search-form{display:flex;gap:.5rem}
.search-form input[type="search"]{flex:1;padding:.625rem 1rem;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;outline:none;transition:border-color .2s}
.search-form input[type="search"]:focus{border-color:#FFB800}
.search-form button{padding:.625rem 1rem;background:#FFB800;color:#fff;border:none;border-radius:.5rem;font-weight:500;cursor:pointer;transition:background .2s}
.search-form button:hover{background:rgba(255,184,0,.9)}

/* Widget Categories */
.widget-categories{list-style:none;margin:0;padding:0}
.widget-categories li{padding:.375rem 0}
.widget-categories li a{display:flex;justify-content:space-between;color:#4b5563;font-size:.875rem;text-decoration:none;transition:color .2s}
.widget-categories li a:hover{color:#FFB800}
.widget-categories .count{color:#9ca3af;font-size:.75rem}

/* Article Detail Section */
.article-detail-section{padding:3rem 0;background:#f9fafb}
.article-detail-layout{display:grid;grid-template-columns:1fr;gap:2rem}
@media (min-width:1024px){
  .article-detail-layout{grid-template-columns:1fr 300px;gap:3rem}
}

/* Article Detail */
.article-detail{background:#fff;border-radius:1rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);overflow:hidden}
.article-detail-header{padding:2rem;border-bottom:1px solid #f3f4f6}
.article-detail-meta{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;margin-bottom:1rem}
.article-category-badge{display:inline-block;padding:.25rem .75rem;background:#FFB800;color:#fff;border-radius:9999px;font-size:.75rem;font-weight:500;text-decoration:none}
.article-category-badge:hover{background:rgba(255,184,0,.9)}
.article-detail-date,.article-detail-reading{display:flex;align-items:center;gap:.25rem;color:#6b7280;font-size:.875rem}
.article-detail-title{font-size:1.875rem;font-weight:700;color:#111827;margin:0 0 1.5rem;line-height:1.3}
@media (min-width:768px){
  .article-detail-title{font-size:2.25rem}
}
.article-detail-author{display:flex;align-items:center;gap:1rem}
.author-avatar img{width:48px;height:48px;border-radius:50%}
.author-info{display:flex;flex-direction:column}
.author-name{font-weight:600;color:#111827}
.author-posts{font-size:.875rem;color:#6b7280}

/* Article Detail Thumbnail */
.article-detail-thumbnail{padding:0 2rem}
@media (max-width:767px){
  .article-detail-thumbnail{padding:0 1rem}
}
.article-detail-thumbnail img{width:100%;border-radius:.5rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}

/* Article Detail Content */
.article-detail-content{padding:2rem;line-height:1.75;color:#374151}
@media (max-width:767px){
  .article-detail-content{padding:1.5rem}
}
.article-detail-content h2{font-size:1.5rem;font-weight:700;color:#111827;margin:2rem 0 1rem;padding-top:1rem;border-top:1px solid #f3f4f6}
.article-detail-content h3{font-size:1.25rem;font-weight:600;color:#111827;margin:1.5rem 0 .75rem}
.article-detail-content p{margin-bottom:1rem}
.article-detail-content ul,.article-detail-content ol{margin:1rem 0;padding-left:1.5rem}
.article-detail-content li{margin-bottom:.5rem}
.article-detail-content img{border-radius:.5rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);margin:1rem 0}
.article-detail-content blockquote{border-left:4px solid #FFB800;background:#eff6ff;padding:1rem 1.5rem;margin:1.5rem 0;border-radius:0 .5rem .5rem 0;font-style:italic;color:#4b5563}
.article-detail-content table{width:100%;border-collapse:collapse;margin:1.5rem 0}
.article-detail-content th,.article-detail-content td{padding:.75rem 1rem;border:1px solid #e5e7eb;text-align:left}
.article-detail-content th{background:#f9fafb;font-weight:600;color:#111827}
.article-detail-content a{color:#FFB800;text-decoration:underline}
.article-detail-content a:hover{color:rgba(255,184,0,.9)}

/* Article Tags */
.article-detail-tags{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;padding:1.5rem 2rem;border-top:1px solid #f3f4f6}
@media (max-width:767px){
  .article-detail-tags{padding:1rem 1.5rem}
}
.tags-label{color:#6b7280;font-size:.875rem}
.tag-item{display:inline-block;padding:.25rem .75rem;background:#f3f4f6;color:#4b5563;border-radius:9999px;font-size:.75rem;text-decoration:none;transition:all .2s}
.tag-item:hover{background:#FFB800;color:#fff}

/* Article Navigation */
.article-nav{display:flex;border-top:1px solid #f3f4f6}
.article-nav-prev,.article-nav-next{flex:1;padding:1.5rem 2rem}
@media (max-width:767px){
  .article-nav-prev,.article-nav-next{padding:1rem 1.5rem}
}
.article-nav-divider{width:1px;background:#f3f4f6}
.nav-link{display:flex;align-items:center;gap:1rem;text-decoration:none;color:#4b5563;transition:color .2s}
.nav-link:hover{color:#FFB800}
.nav-info{display:flex;flex-direction:column}
.nav-label{font-size:.75rem;color:#9ca3af;margin-bottom:.25rem}
.nav-title{font-size:.875rem;font-weight:500;line-height:1.4}
.nav-empty{color:#9ca3af;font-size:.875rem}
.article-nav-next .nav-link{justify-content:flex-end;text-align:right}
.article-nav-next .nav-info{align-items:flex-end}

/* Article Sidebar */
.article-sidebar{display:flex;flex-direction:column;gap:1.5rem}

/* Author Widget */
.author-widget{text-align:center;padding:2rem}
.author-widget-avatar img{width:80px;height:80px;border-radius:50%;margin-bottom:1rem}
.author-widget-name{font-size:1.125rem;font-weight:700;color:#111827;margin:0 0 .5rem}
.author-widget-bio{color:#6b7280;font-size:.875rem;line-height:1.5;margin:0 0 1rem}
.author-widget-stats{display:flex;justify-content:center;gap:2rem;padding-top:1rem;border-top:1px solid #f3f4f6}
.stat-item{text-align:center}
.stat-number{display:block;font-size:1.25rem;font-weight:700;color:#FFB800}
.stat-label{font-size:.75rem;color:#6b7280}

/* Related Posts */
.related-posts{list-style:none;margin:0;padding:0}
.related-posts li{margin-bottom:1rem}
.related-posts li:last-child{margin-bottom:0}
.related-posts a{display:flex;gap:1rem;text-decoration:none;color:#4b5563;transition:color .2s}
.related-posts a:hover{color:#FFB800}
.related-post-thumb{width:80px;height:60px;flex-shrink:0;border-radius:.5rem;overflow:hidden}
.related-post-thumb img{width:100%;height:100%;object-fit:cover}
.related-post-info{display:flex;flex-direction:column;justify-content:center}
.related-post-title{font-size:.875rem;font-weight:500;line-height:1.4;margin-bottom:.25rem}
.related-post-date{font-size:.75rem;color:#9ca3af}

/* Tag Cloud */
.tagcloud{display:flex;flex-wrap:wrap;gap:.5rem}
.tagcloud a{display:inline-block;padding:.25rem .75rem;background:#f3f4f6;color:#4b5563;border-radius:9999px;text-decoration:none;transition:all .2s}
.tagcloud a:hover{background:#FFB800;color:#fff}

/* Comments */
.comments-area{margin-top:2rem;padding:2rem;border-top:1px solid #f3f4f6}
.comments-title{font-size:1.5rem;font-weight:700;color:#111827;margin:0 0 1.5rem}
.comment-list{list-style:none;margin:0;padding:0}
.comment-body{padding:1.5rem;background:#f9fafb;border-radius:.75rem;margin-bottom:1rem}
.comment-meta{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.comment-author img{width:40px;height:40px;border-radius:50%}
.comment-author b{font-weight:600;color:#111827}
.comment-metadata{font-size:.75rem;color:#6b7280}
.comment-content{color:#4b5563;line-height:1.625}
.comment-reply-link{color:#FFB800;font-size:.875rem;text-decoration:none}
.comment-reply-link:hover{text-decoration:underline}

/* Comment Form */
.comment-form{margin-top:1.5rem}
.comment-form label{display:block;font-weight:500;color:#111827;margin-bottom:.5rem}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{width:100%;padding:.75rem 1rem;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;outline:none;transition:border-color .2s;margin-bottom:1rem}
.comment-form input:focus,
.comment-form textarea:focus{border-color:#FFB800}
.comment-form textarea{min-height:150px;resize:vertical}
.comment-form .submit{display:inline-block;padding:.75rem 1.5rem;background:#FFB800;color:#fff;border:none;border-radius:.5rem;font-weight:500;cursor:pointer;transition:background .2s}
.comment-form .submit:hover{background:rgba(255,184,0,.9)}

/* No Results */
.no-results{text-align:center;padding:4rem 2rem;background:#fff;border-radius:1rem}
.no-results p{color:#6b7280;font-size:1.125rem;margin:0}