/*
Theme Name: P77 Game - Gold Arcade
Theme URI: https://p77game.net/
Author: P77 Game
Description: High-performance P77 Game WordPress theme with game-specific visuals, searchable game cards, internal-link hubs, blog-ready templates and responsive navigation.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.8
Text Domain: p77-game
*/
:root{--black:#060607;--black2:#0d0b0b;--panel:#141011;--panel2:#1b1413;--gold:#f4c542;--gold2:#ffdd72;--red:#d9362e;--maroon:#42070d;--cream:#fff6d5;--muted:#b9b1a5;--line:rgba(244,197,66,.16);--shadow:0 22px 60px rgba(0,0,0,.35);--max:1460px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 78% -8%,rgba(217,54,46,.2),transparent 28%),radial-gradient(circle at 15% 20%,rgba(244,197,66,.06),transparent 25%),var(--black);color:#fff8e8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.7}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 75%);z-index:-1}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input{font:inherit}.site-shell{min-height:100vh}.site-header{position:sticky;top:0;z-index:1000;background:rgba(6,6,7,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.header-inner{width:min(calc(100% - 34px),var(--max));height:76px;margin:auto;display:flex;align-items:center;gap:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:950;letter-spacing:-.5px;min-width:190px}.brand img{width:48px;height:48px;border-radius:13px;object-fit:cover;border:1px solid rgba(244,197,66,.4);box-shadow:0 8px 22px rgba(217,54,46,.2)}.brand span{font-size:21px}.brand b{color:var(--gold)}.mobile-menu{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:#171010;color:#fff;cursor:pointer}.search-form{position:relative;display:flex;align-items:center;flex:1;max-width:650px;margin-left:10px}.search-form input{width:100%;height:46px;border-radius:14px;border:1px solid var(--line);background:#121011;color:#fff;padding:0 82px 0 43px;outline:none;transition:.25s}.search-form input:focus{border-color:rgba(244,197,66,.55);box-shadow:0 0 0 4px rgba(244,197,66,.07)}.search-form button{position:absolute;right:5px;height:36px;padding:0 13px;border:0;border-radius:10px;background:var(--gold);color:#170d00;font-weight:900;cursor:pointer}.search-icon{position:absolute;left:15px;font-size:24px;color:var(--gold);z-index:1}.header-actions{margin-left:auto;display:flex;gap:9px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 19px;border-radius:12px;border:1px solid transparent;font-weight:900;letter-spacing:-.1px;transition:transform .22s ease,box-shadow .22s ease,background .22s ease,filter .22s ease;cursor:pointer}.btn:hover{transform:translateY(-3px)}.btn-gold{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#160e00;box-shadow:0 13px 28px rgba(244,197,66,.22)}.btn-gold:hover{box-shadow:0 18px 36px rgba(244,197,66,.3);filter:brightness(1.05)}.btn-outline,.btn-dark{background:#171112;border-color:var(--line);color:#fff}.btn-outline:hover,.btn-dark:hover{border-color:rgba(244,197,66,.45);background:#211718}.btn-outline-light{border-color:rgba(255,246,213,.3);background:rgba(255,255,255,.04);color:#fff}.layout{width:min(calc(100% - 34px),var(--max));margin:24px auto 0;display:grid;grid-template-columns:255px minmax(0,1fr);gap:22px}.sidebar{position:sticky;top:98px;height:calc(100vh - 120px);overflow:auto;padding:15px;background:linear-gradient(180deg,#151011,#0d0b0b);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}.side-heading{margin:15px 9px 7px;color:var(--gold);font-size:10px;font-weight:950;text-transform:uppercase;letter-spacing:1.4px}.side-link{display:flex;align-items:center;gap:10px;margin:3px 0;padding:10px 11px;border-radius:11px;color:#d6cec0;font-size:13px;font-weight:750;transition:.2s}.side-link span{width:22px;text-align:center;color:var(--gold)}.side-link:hover,.side-link.active{background:linear-gradient(90deg,rgba(217,54,46,.18),rgba(244,197,66,.06));color:#fff;transform:translateX(3px)}.main{min-width:0}.hero{position:relative;overflow:hidden;min-height:500px;border-radius:26px;border:1px solid var(--line);background:linear-gradient(120deg,#190708 0%,#0b0809 52%,#2a0a0c 100%);display:grid;grid-template-columns:1.15fr .85fr;align-items:center;box-shadow:var(--shadow)}.hero:after{content:"";position:absolute;inset:auto -10% -45% 25%;height:75%;background:radial-gradient(circle,rgba(244,197,66,.18),transparent 60%);filter:blur(10px)}.hero-glow{position:absolute;inset:0;background:radial-gradient(circle at 74% 42%,rgba(217,54,46,.25),transparent 27%),linear-gradient(90deg,rgba(0,0,0,.1),rgba(0,0,0,.2));z-index:0}.hero-copy{position:relative;z-index:2;padding:62px 58px}.eyebrow{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid rgba(244,197,66,.28);background:rgba(244,197,66,.07);border-radius:999px;color:var(--gold2);font-size:11px;font-weight:950;letter-spacing:1.1px;text-transform:uppercase}.hero h1{font-size:clamp(42px,5vw,72px);line-height:1.02;letter-spacing:-3px;margin:18px 0 18px;max-width:850px}.hero p{font-size:18px;color:#d8d0c5;max-width:760px}.hero-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:27px}.hero-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.hero-links a{padding:7px 11px;border:1px solid rgba(244,197,66,.18);background:rgba(0,0,0,.22);border-radius:9px;font-size:12px;color:#eadfcf;transition:.2s}.hero-links a:hover{color:#160e00;background:var(--gold);transform:translateY(-2px)}.hero-art{position:relative;min-height:430px;display:grid;place-items:center;z-index:2}.hero-logo{position:relative;z-index:4;width:min(280px,58%);aspect-ratio:1;border-radius:38px;overflow:hidden;box-shadow:0 35px 70px rgba(0,0,0,.6),0 0 70px rgba(244,197,66,.14);border:1px solid rgba(244,197,66,.42);animation:float 5s ease-in-out infinite}.hero-logo img{width:100%;height:100%;object-fit:cover}.orbit{position:absolute;border:1px solid rgba(244,197,66,.2);border-radius:50%;transform:rotate(-18deg)}.orbit-one{width:390px;height:180px}.orbit-two{width:470px;height:220px;transform:rotate(32deg);border-color:rgba(217,54,46,.2)}@keyframes float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}.quick-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:15px 0}.quick-stats>div{padding:18px 19px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,#161011,#0f0c0d);transition:.25s;box-shadow:0 10px 30px rgba(0,0,0,.18)}.quick-stats>div:hover{transform:translateY(-5px);border-color:rgba(244,197,66,.35);box-shadow:0 18px 38px rgba(0,0,0,.28)}.quick-stats strong{display:block;color:var(--gold);font-size:24px}.quick-stats span{display:block;color:var(--muted);font-size:12px}.section,.content-page{margin:18px 0;padding:30px;border:1px solid var(--line);border-radius:21px;background:linear-gradient(145deg,rgba(23,16,17,.96),rgba(12,10,10,.96));box-shadow:0 16px 45px rgba(0,0,0,.16);scroll-margin-top:100px}.section-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:21px}.section h2,.content-page h2{font-size:31px;line-height:1.15;letter-spacing:-1.1px;margin:7px 0}.section p,.content-page p{color:#c6bdb0}.games-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.game-card{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:linear-gradient(160deg,#1b1314,#0e0b0c);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;box-shadow:0 12px 28px rgba(0,0,0,.22)}.game-card:hover{transform:translateY(-8px);border-color:rgba(244,197,66,.42);box-shadow:0 25px 55px rgba(0,0,0,.42),0 0 0 1px rgba(244,197,66,.08)}.game-media{position:relative;display:block;aspect-ratio:1.15/1;overflow:hidden;background:#090909}.game-media img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease,filter .45s ease}.game-card:hover .game-media img{transform:scale(1.08);filter:saturate(1.08)}.game-type{position:absolute;left:10px;top:10px;padding:5px 8px;border-radius:8px;background:rgba(0,0,0,.76);border:1px solid rgba(244,197,66,.25);color:var(--gold2);font-size:9px;font-weight:950;text-transform:uppercase;letter-spacing:.7px}.game-info{padding:14px}.game-info h3{font-size:18px;margin:0 0 4px}.game-info p{font-size:12px;line-height:1.5;margin:0;color:#a99f91;min-height:38px}.game-actions{display:flex;gap:7px;margin-top:13px}.small-btn{flex:1;min-height:35px;display:flex;align-items:center;justify-content:center;border-radius:9px;font-size:11px;font-weight:900;transition:.2s}.small-btn:hover{transform:translateY(-2px)}.small-btn-gold{background:var(--gold);color:#170d00}.small-btn-dark{border:1px solid var(--line);background:#171112;color:#eee4d5}.mini-grid,.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.mini-card,.feature-card{display:block;padding:20px;border:1px solid var(--line);border-radius:15px;background:#130f10;transition:.25s}.mini-card:hover,.feature-card:hover{transform:translateY(-5px);border-color:rgba(244,197,66,.38);background:linear-gradient(145deg,#211617,#120e0f);box-shadow:0 18px 36px rgba(0,0,0,.26)}.mini-card strong{display:block;color:var(--gold2);font-size:17px}.mini-card span{display:block;color:#a99f92;font-size:13px;margin-top:4px}.feature-card>span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;background:rgba(244,197,66,.08);color:var(--gold);font-weight:950}.feature-card h3{margin:12px 0 5px;font-size:19px}.feature-card p{margin:0;font-size:13px}.split-section{display:grid;grid-template-columns:1.25fr .75fr;gap:28px;align-items:center}.steps{display:grid;gap:10px;margin:18px 0}.step{display:grid;grid-template-columns:48px 1fr;gap:12px;padding:13px;border-radius:13px;background:#0d0b0c;border:1px solid var(--line)}.step>b{width:48px;height:48px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,var(--gold2),var(--gold));color:#160e00}.visual-panel{min-height:330px;border-radius:22px;border:1px solid rgba(244,197,66,.2);background:radial-gradient(circle at 50% 30%,rgba(244,197,66,.13),transparent 35%),linear-gradient(145deg,#27080c,#0d0a0a);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;text-align:center;padding:30px}.visual-panel img{width:180px;height:180px;border-radius:30px;object-fit:cover;box-shadow:0 25px 55px rgba(0,0,0,.5)}.visual-panel strong{display:block;font-size:20px;color:var(--gold2)}.visual-panel span{display:block;color:#b7ad9f;font-size:13px}.seo-copy{max-width:none}.seo-copy p{max-width:1050px}.seo-copy h3{margin-top:28px}.faq details{border-top:1px solid var(--line);padding:16px 0}.faq summary{cursor:pointer;font-weight:900;color:#fff}.faq summary:hover{color:var(--gold2)}.text-link{color:var(--gold2);font-weight:850}.notice{padding:15px 17px;margin:18px 0;border-left:3px solid var(--gold);background:rgba(244,197,66,.07);border-radius:9px;color:#ddd1bd}.content-page{max-width:none}.content-page>h1,.page-content>h1{font-size:clamp(38px,5vw,60px);line-height:1.05;letter-spacing:-2px;margin:14px 0 20px}.page-content{max-width:1000px}.page-content h2{margin-top:30px}.guide-list{padding-left:22px;color:#cfc5b7}.guide-list li{margin:8px 0}.post-card{display:grid;grid-template-columns:260px 1fr;gap:20px;padding:18px;border:1px solid var(--line);border-radius:16px;background:#120e0f;margin:14px 0}.post-card h2{margin:5px 0;font-size:24px}.post-thumb{min-height:150px;border-radius:12px;overflow:hidden;background:#090909}.post-thumb img{width:100%;height:100%;object-fit:cover}.post-date{color:var(--gold);font-size:11px;font-weight:900}.posts-grid{display:grid;gap:14px}.post-meta{color:#9f9689;font-size:12px;margin:-8px 0 22px}.post-image{max-height:520px;width:100%;object-fit:cover;border-radius:17px;margin:0 0 25px}.post-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}.blog-placeholder{padding:24px;border:1px dashed rgba(244,197,66,.25);border-radius:14px;background:rgba(244,197,66,.04)}.blog-placeholder strong{display:block;color:var(--gold2);font-size:19px}.blog-placeholder span{display:block;color:#aaa093;margin-top:4px}.pagination .page-numbers{display:inline-flex;padding:8px 12px;margin:4px;border:1px solid var(--line);border-radius:8px}.center{text-align:center}.center-actions{justify-content:center}.cta-band{margin:18px 0 30px;padding:30px;border-radius:20px;border:1px solid rgba(244,197,66,.28);background:linear-gradient(110deg,#39070c,#171010 55%,#2a0b0d);display:flex;align-items:center;justify-content:space-between;gap:20px}.cta-band>div>span{color:var(--gold);font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:1px}.cta-band h2{margin:4px 0}.cta-band p{margin:0;color:#bdb2a3}.footer{margin-top:30px;border-top:2px solid var(--gold);background:#0b0909;padding:44px 0 100px}.footer-inner{width:min(calc(100% - 34px),var(--max));margin:auto;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:30px}.footer p,.footer a{color:#a99f92}.footer a:hover{color:var(--gold2)}.footer h4{margin:0 0 10px;color:#fff}.footer-bottom{width:min(calc(100% - 34px),var(--max));margin:28px auto 0;padding-top:20px;border-top:1px solid var(--line);font-size:12px;color:#80786e}.sticky-cta{position:fixed;z-index:2000;right:22px;bottom:22px;display:flex;align-items:center;gap:9px;padding:14px 20px;border-radius:999px;background:linear-gradient(135deg,var(--gold2),var(--gold));color:#170d00;font-weight:950;box-shadow:0 18px 42px rgba(0,0,0,.5),0 0 28px rgba(244,197,66,.18);transition:.25s}.sticky-cta:hover{transform:translateY(-4px) scale(1.02)}.is-visible{animation:rise .55s ease both}@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}[hidden]{display:none!important}
@media(max-width:1250px){.games-grid{grid-template-columns:repeat(3,1fr)}.layout{grid-template-columns:220px minmax(0,1fr)}.hero-copy{padding:48px}.hero h1{font-size:52px}}
@media(max-width:950px){.header-inner{height:68px}.mobile-menu{display:block}.brand{min-width:auto}.brand span{display:none}.header-actions .btn-outline{display:none}.search-form{margin-left:0}.layout{display:block;width:calc(100% - 20px);margin-top:12px}.sidebar{position:fixed;left:0;top:68px;bottom:0;width:290px;height:auto;z-index:1500;border-radius:0 18px 18px 0;transform:translateX(-105%);transition:.3s}.sidebar.open{transform:translateX(0)}.hero{grid-template-columns:1fr;min-height:600px}.hero-copy{padding:40px 25px}.hero-art{min-height:250px}.hero-logo{width:170px}.orbit-one{width:270px;height:120px}.orbit-two{width:330px;height:150px}.quick-stats{grid-template-columns:repeat(2,1fr)}.games-grid{grid-template-columns:repeat(2,1fr)}.mini-grid,.feature-grid{grid-template-columns:repeat(2,1fr)}.split-section{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr 1fr}.section,.content-page{padding:22px}.section-top{align-items:flex-start;flex-direction:column}.section-top .btn{width:100%}}
@media(max-width:560px){body{font-size:15px}.header-inner{width:calc(100% - 18px);gap:9px}.brand img{width:43px;height:43px}.search-form input{height:42px;padding-left:38px;padding-right:70px;font-size:12px}.search-form button{height:32px;font-size:11px}.header-actions .btn-gold{padding:0 11px;min-height:42px;font-size:11px}.hero{min-height:650px}.hero h1{font-size:39px;letter-spacing:-2px}.hero p{font-size:16px}.hero-actions .btn{width:100%}.hero-links{gap:6px}.quick-stats{gap:8px}.quick-stats>div{padding:13px}.quick-stats strong{font-size:20px}.games-grid,.mini-grid,.feature-grid{grid-template-columns:1fr}.game-media{aspect-ratio:1.2/1}.content-page>h1,.page-content>h1{font-size:39px}.post-card{grid-template-columns:1fr}.post-thumb{height:190px}.footer-inner{grid-template-columns:1fr}.sticky-cta{left:10px;right:10px;bottom:10px;justify-content:center}.cta-band{display:block}.cta-band .btn{width:100%;margin-top:14px}}
