/*
Theme Name: Yono Games Inspired
Theme URI: https://example.com/
Author: OpenAI
Description: A responsive game-directory WordPress theme inspired by common gaming directory layouts. Includes editable game cards, hero area, featured apps, guide section and footer. Replace demo content and artwork with assets you own or are licensed to use.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: yono-games-inspired
*/
:root{--bg:#0b1020;--panel:#141b2f;--panel2:#1a2440;--text:#f4f7ff;--muted:#aeb9d3;--accent:#77f0b2;--accent2:#6db8ff;--line:rgba(255,255,255,.09);--radius:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at top,#172648 0,#0b1020 48%,#080c18 100%);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}button,input{font:inherit}.container{width:min(1160px,calc(100% - 32px));margin-inline:auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(9,14,28,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.2rem;letter-spacing:-.03em}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#091222;font-size:1.2rem}.main-nav{display:flex;align-items:center;gap:22px;color:var(--muted);font-size:.94rem}.main-nav a:hover{color:var(--accent)}.nav-toggle{display:none;background:var(--panel);border:1px solid var(--line);color:var(--text);padding:8px 12px;border-radius:10px}.hero{padding:72px 0 36px}.hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:26px;align-items:stretch}.hero-copy,.hero-aside{border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,rgba(28,42,73,.96),rgba(17,24,43,.94));padding:clamp(26px,5vw,54px);position:relative;overflow:hidden}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.hero h1{font-size:clamp(2.6rem,6vw,5rem);line-height:1.02;letter-spacing:-.06em;margin:18px 0}.hero h1 span{color:var(--accent)}.hero p{max-width:620px;color:var(--muted);font-size:1.06rem}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:12px 18px;border-radius:12px;background:var(--accent);color:#071421;font-weight:850;border:1px solid transparent;transition:transform .2s,filter .2s}.btn:hover{transform:translateY(-2px);filter:brightness(1.05)}.btn-secondary{background:rgba(255,255,255,.05);border-color:var(--line);color:var(--text)}.hero-aside{display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(150deg,rgba(41,77,104,.75),rgba(20,27,47,.96))}.hero-icon{font-size:4rem;filter:drop-shadow(0 12px 20px rgba(0,0,0,.3))}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}.stat{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:14px;padding:14px}.stat strong{display:block;font-size:1.15rem}.stat span{font-size:.78rem;color:var(--muted)}section.content-section{padding:32px 0 52px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:22px}.section-heading h2{font-size:clamp(1.7rem,3vw,2.4rem);letter-spacing:-.04em;margin:0}.section-heading p{color:var(--muted);margin:5px 0 0}.filter-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}.search-input{width:min(360px,100%);background:var(--panel);border:1px solid var(--line);color:var(--text);padding:11px 14px;border-radius:12px;outline:none}.filter-btn{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:12px;padding:10px 14px;cursor:pointer}.filter-btn.active{background:var(--accent);color:#071421;border-color:transparent;font-weight:800}.game-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.game-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(26,36,64,.92),rgba(17,24,43,.96));padding:15px;transition:transform .2s,border-color .2s}.game-card:hover{transform:translateY(-4px);border-color:rgba(119,240,178,.45)}.game-top{display:flex;align-items:center;gap:12px}.game-art{width:58px;height:58px;flex:0 0 58px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,#273f64,#1c2945);font-size:1.7rem}.game-card h3{font-size:1rem;margin:0;overflow-wrap:anywhere}.game-meta{font-size:.8rem;color:var(--muted);margin-top:3px}.bonus{color:var(--accent);font-weight:750;font-size:.84rem;margin:15px 0}.game-card .btn{margin-top:auto;width:100%;padding:10px}.featured-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.feature-card{padding:23px;border-radius:20px;border:1px solid var(--line);background:var(--panel)}.feature-card .feature-icon{font-size:2rem}.feature-card h3{margin:10px 0 6px}.feature-card p{color:var(--muted);margin:0}.guide-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:22px}.guide-intro,.guide-list{padding:26px;border:1px solid var(--line);border-radius:20px;background:var(--panel)}.guide-list ol{margin:0;padding-left:22px}.guide-list li{padding:8px 0;color:var(--muted)}.guide-list strong{color:var(--text)}.cta-band{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:30px;border-radius:22px;background:linear-gradient(110deg,rgba(119,240,178,.15),rgba(109,184,255,.13));border:1px solid var(--line)}.cta-band h2{margin:0 0 5px}.cta-band p{margin:0;color:var(--muted)}.site-footer{margin-top:30px;border-top:1px solid var(--line);background:rgba(5,8,16,.35);padding:30px 0;color:var(--muted)}.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap}.footer-links{display:flex;gap:16px;flex-wrap:wrap}.footer-links a:hover{color:var(--accent)}.page-content{padding:45px 0 70px;min-height:55vh}.page-content article{max-width:850px;margin:auto;background:var(--panel);padding:clamp(20px,4vw,42px);border:1px solid var(--line);border-radius:22px}.page-content h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1}.page-content p,.page-content li{color:var(--muted)}.empty-note{color:var(--muted);grid-column:1/-1;padding:24px;border:1px dashed var(--line);border-radius:16px}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-aside{min-height:230px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.guide-layout{grid-template-columns:1fr}}
@media(max-width:650px){.header-inner{min-height:66px}.nav-toggle{display:block}.main-nav{display:none;position:absolute;left:16px;right:16px;top:66px;padding:16px;background:#10182b;border:1px solid var(--line);border-radius:14px;flex-direction:column;align-items:flex-start}.main-nav.open{display:flex}.hero{padding-top:32px}.hero-copy,.hero-aside{padding:25px}.stats{grid-template-columns:repeat(3,1fr)}.stat{padding:10px}.stat strong{font-size:1rem}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.game-card{padding:11px}.game-top{align-items:flex-start;gap:9px}.game-art{width:46px;height:46px;flex-basis:46px;border-radius:12px;font-size:1.35rem}.game-card h3{font-size:.92rem}.featured-grid{grid-template-columns:1fr}.section-heading{align-items:flex-start;flex-direction:column}.cta-band{align-items:flex-start;flex-direction:column}}