/*
Theme Name: Khaloopks Reference
Theme URI: https://khaloopks.com/
Author: KHALOOPKS
Description: Clean, responsive neon gaming/app directory theme inspired by the supplied reference layout. Uses native WordPress APIs and requires no page builder.
Version: 3.5.1
License: GPL-2.0-or-later
Text Domain: khaloopks-reference
*/

:root{
 --bg:#07000d;--panel:#100718;--panel2:#14091e;--line:#28113d;
 --pink:#ef159f;--pink2:#ff2cae;--purple:#7517d8;--white:#f7f4fb;
 --muted:#a69aaa;--gold:#ffd21f;--max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(180deg,#07000d 0%,#0b0012 55%,#07000d 100%);color:var(--white);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input{font:inherit}
.kp-container{width:min(var(--max),calc(100% - 32px));margin:auto}


/* Logged-in editor toolbar */
.kp-editorbar{height:54px;background:#1d2227;border-bottom:1px solid #30353a;position:relative;z-index:2000}
.kp-editorbar-inner{height:54px;display:flex;align-items:center;gap:30px;padding:0 24px}
.kp-editorbar a{width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:#d8dadd;font-size:28px;text-decoration:none;border-radius:5px}
.kp-editorbar a:hover{background:#2b3035;color:#fff}
.kp-editor-profile{margin-left:auto;border:1px solid #7c8084;border-radius:3px!important;font-size:22px!important}
@media(max-width:800px){
 .kp-editorbar{height:54px}
 .kp-editorbar-inner{gap:18px;padding:0 14px}
 .kp-editorbar a{width:34px;height:34px;font-size:25px}
}

/* Header */
.kp-header{height:76px;background:rgba(5,0,10,.96);border-bottom:1px solid #24102f;position:sticky;top:0;z-index:1000;backdrop-filter:blur(12px)}
.kp-header-inner{height:100%;display:flex;align-items:center;gap:26px}
.kp-logo{font-weight:900;font-size:22px;line-height:1;color:#fff;white-space:nowrap;display:flex;align-items:center;gap:8px}
.kp-logo-mark{color:#ff6b00;font-size:25px}
.kp-logo small{display:block;font-size:7px;color:#c9bccf;letter-spacing:.5px;margin-top:3px}
.kp-search{height:42px;flex:1;max-width:520px;margin:auto;position:relative}
.kp-search input{width:100%;height:100%;border:1px solid #2b1938;border-radius:13px;background:#120d1a;color:#fff;padding:0 48px 0 18px;outline:0}
.kp-search input:focus{border-color:#7520a4;box-shadow:0 0 0 3px rgba(117,32,164,.12)}
.kp-search button{position:absolute;right:5px;top:5px;width:32px;height:32px;border:0;border-radius:10px;background:transparent;color:#fff;cursor:pointer}
.kp-download{background:linear-gradient(135deg,#c717df,#ff209e);padding:12px 18px;border-radius:10px;font-size:10px;font-weight:900;white-space:nowrap;box-shadow:0 8px 24px rgba(255,32,158,.18)}
.kp-menu{width:40px;height:40px;background:none;border:0;color:#fff;font-size:25px;cursor:pointer}
.kp-nav{background:#08010e;border-bottom:1px solid #1c0c29}
.kp-nav-inner{display:flex;justify-content:center;gap:34px;height:42px;align-items:center}
.kp-nav a{font-size:11px;font-weight:800;color:#9d91a5;padding:13px 0;position:relative}
.kp-nav a:hover,.kp-nav a.active{color:#ff2baa}
.kp-nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#ef159f}

/* Hero */
.kp-hero{position:relative;min-height:370px;overflow:hidden;background:
 radial-gradient(circle at 68% 42%,rgba(160,13,151,.48),transparent 25%),
 radial-gradient(circle at 86% 40%,rgba(84,0,120,.5),transparent 35%),
 linear-gradient(105deg,#180022,#08000f 55%,#130019)}
.kp-hero-art{position:absolute;inset:0;opacity:.28;background:
 radial-gradient(circle at 74% 52%,#ff1fa8 0 1px,transparent 2px),
 radial-gradient(circle at 88% 30%,#b700ff 0 1px,transparent 2px);
 background-size:90px 90px,120px 120px}
.kp-hero-inner{position:relative;z-index:2;min-height:370px;display:flex;align-items:center}
.kp-hero-copy{width:46%;padding:35px 0}
.kp-eyebrow{color:#ff2cab;font-size:14px;font-weight:900;letter-spacing:.3px}
.kp-hero h1{font-size:48px;line-height:.98;margin:12px 0;color:#fff;letter-spacing:-1.5px}
.kp-hero h1 span{color:#ef159f}
.kp-hero p{font-size:16px;line-height:1.45;color:#e1d9e6;max-width:330px}
.kp-cta{display:inline-flex;margin-top:10px;background:linear-gradient(135deg,#b817df,#ff1e9f);padding:13px 18px;border-radius:9px;font-size:11px;font-weight:900}
.kp-hero-visual{position:absolute;right:3%;bottom:0;width:52%;height:100%;display:flex;align-items:center;justify-content:center}
.kp-character{width:min(430px,90%);height:280px;border-radius:45% 45% 8% 8%;background:
 radial-gradient(circle at 55% 28%,#f1b28f 0 9%,transparent 10%),
 radial-gradient(circle at 47% 31%,#23151c 0 14%,transparent 15%),
 linear-gradient(145deg,transparent 20%,#15121c 21% 55%,#06040a 56%);
 filter:drop-shadow(0 0 38px rgba(255,0,174,.25));position:relative}
.kp-character:before{content:"AVIATOR";position:absolute;left:5%;top:22%;width:150px;height:70px;border:2px solid #ff35bc;border-radius:13px;display:flex;align-items:center;justify-content:center;color:#ff4ec5;font-size:22px;font-weight:900;box-shadow:0 0 25px rgba(255,30,180,.35)}
.kp-character:after{content:"x 15.92";position:absolute;left:18%;top:51%;color:#fff;font-weight:900;font-size:12px}
.kp-card{position:absolute;right:3%;top:37%;font-size:38px;transform:rotate(10deg);text-shadow:0 0 15px #fff}


/* Enhanced live 3D-style hero: browser-rendered template elements, not a screenshot */
.kp-hero-3d{overflow:visible}
.kp-hero-3d:before{
 content:"";position:absolute;right:9%;bottom:7%;width:360px;height:70px;border-radius:50%;
 background:radial-gradient(ellipse,rgba(255,22,180,.30),rgba(98,15,170,.12) 45%,transparent 72%);
 filter:blur(10px);animation:kpFloorGlow 4.8s ease-in-out infinite;z-index:-1
}
.kp-hero-avatar-wrap{will-change:transform;transform-style:preserve-3d}
.kp-hero-avatar{filter:drop-shadow(0 12px 18px rgba(255,0,180,.16));transform-style:preserve-3d}
.kp-hero-avatar-wrap:after{
 content:"";position:absolute;inset:10% 4% 4% 18%;border-radius:45%;
 background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 20% 70%,rgba(255,0,180,.12));
 mix-blend-mode:screen;pointer-events:none;transform:translateZ(2px);opacity:.7
}
.kp-hero-phone{filter:drop-shadow(10px 16px 16px rgba(0,0,0,.5))}
.kp-hero-phone:focus{outline:none}
.kp-hero-app-chip{transform-style:preserve-3d}
@keyframes kpFloorGlow{0%,100%{transform:scale(.92);opacity:.6}50%{transform:scale(1.08);opacity:1}}
@keyframes kpAvatarFloat{0%,100%{transform:translate3d(0,0,0) rotateZ(0deg)}25%{transform:translate3d(-3px,-7px,0) rotateZ(-.35deg)}50%{transform:translate3d(0,-13px,0) rotateZ(0deg)}75%{transform:translate3d(3px,-7px,0) rotateZ(.35deg)}}
@keyframes kpAvatarTilt{0%,100%{transform:perspective(900px) rotateY(-9deg) rotateX(2deg) rotateZ(0deg) scale(1)}
50%{transform:perspective(900px) rotateY(7deg) rotateX(-1deg) rotateZ(.7deg) scale(1.015)}}
@keyframes kpPhoneShow{0%,100%{transform:translate3d(0,0,0) rotate(0deg) rotateY(0deg)}
35%{transform:translate3d(-6px,-8px,3px) rotate(-2deg) rotateY(-4deg)}
70%{transform:translate3d(4px,-4px,1px) rotate(1.5deg) rotateY(3deg)}}
@media(max-width:800px){
 .kp-hero-visual.kp-hero-3d{right:-12%;width:74%;perspective:700px}
 .kp-hero-avatar-wrap{width:min(390px,96%);right:0}
 .kp-hero-3d:before{width:250px;height:48px;right:18%}
 .kp-hero-app-chip{right:0;bottom:20px;padding:7px 9px}
 .kp-hero-app-chip strong{font-size:7px}.kp-hero-app-chip small{font-size:5px}
}
@media(prefers-reduced-motion:reduce){
 .kp-hero-avatar-wrap,.kp-hero-avatar,.kp-hero-phone,.kp-hero-glow,.kp-hero-orbit,.kp-hero-app-chip,.kp-hero-3d:before{animation:none!important}
}

/* Stats */
.kp-stats{background:#0d0715;border:1px solid #24122f;border-radius:14px;position:relative;margin-top:-1px;z-index:4}
.kp-stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.kp-stat{padding:18px;text-align:center;border-right:1px solid #24122f}
.kp-stat:last-child{border-right:0}
.kp-stat b{display:block;font-size:19px}.kp-stat span{font-size:9px;color:#9c8fa4;margin-top:6px;display:block}

/* Categories */
.kp-main{padding:24px 0 55px}
.kp-categories{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0 0 25px}
.kp-category{min-height:190px;border:1px solid #29113e;border-radius:14px;background:
 radial-gradient(circle at 50% 25%,rgba(115,21,184,.2),transparent 45%),#100719;
 display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:.2s}
.kp-category:hover{transform:translateY(-3px);border-color:#7020a3;box-shadow:0 12px 35px rgba(97,16,145,.15)}
.kp-category-icon{font-size:58px;height:76px;display:flex;align-items:center;filter:drop-shadow(0 0 13px rgba(204,36,255,.45))}
.kp-category h3{font-size:14px;margin:10px 0 6px}.kp-category p{font-size:10px;color:#9e91a6;margin:0}

/* Sections */
.kp-section{background:linear-gradient(180deg,#0e0616,#0d0614);border:1px solid #1e0d2c;border-radius:14px;padding:20px 18px;margin:15px 0}
.kp-section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.kp-section h2{font-size:18px;margin:0}.kp-view{font-size:10px;color:#c8bbcf;border:1px solid #30203b;border-radius:8px;padding:7px 10px}
.kp-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.kp-card-item{background:#0b0611;border:1px solid #251037;border-radius:9px;padding:7px;min-width:0;transition:.2s}
.kp-card-item:hover{border-color:#7521a9;transform:translateY(-2px)}
.kp-thumb{aspect-ratio:1/1;border-radius:7px;overflow:hidden;background:linear-gradient(135deg,#351052,#120a19);position:relative}
.kp-thumb img{width:100%;height:100%;object-fit:cover}
.kp-thumb-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:22px;color:#fff}
.kp-badge{position:absolute;left:4px;top:4px;background:#d719aa;color:#fff;border-radius:4px;padding:3px 5px;font-size:7px;font-weight:900}
.kp-card-title{font-size:10px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:7px 2px 5px}
.kp-rating{font-size:9px;color:var(--gold);margin:0 2px 2px}.kp-rating span{color:#817487}

/* App banner */
.kp-app-banner{min-height:145px;margin:18px 0;border:1px solid #2a1240;border-radius:14px;overflow:hidden;background:
 radial-gradient(circle at 72% 50%,rgba(147,0,177,.35),transparent 28%),
 linear-gradient(105deg,#12031d,#270038 55%,#100016);display:flex;align-items:center;padding:22px 45px;position:relative}
.kp-app-icon{font-size:58px;margin-right:28px}.kp-app-banner h2{margin:0 0 8px;font-size:23px}.kp-app-banner p{margin:0 0 14px;color:#c7b7ce;font-size:12px}.kp-app-btn{display:inline-block;background:#ef159f;padding:10px 16px;border-radius:8px;font-size:10px;font-weight:900}

/* Footer */
.kp-footer{border-top:1px solid #23112f;padding:35px 0;background:#08010e;color:#9f92a6}
.kp-footer-grid{display:flex;justify-content:space-between;gap:30px}.kp-footer h3{color:#fff;margin:0 0 8px}.kp-footer p{font-size:11px;max-width:500px;line-height:1.7}
.kp-bottom{display:none}

/* Mobile */
@media(max-width:800px){
 .kp-container{width:min(100% - 22px,var(--max))}
 .kp-header{height:60px}.kp-header-inner{gap:8px}.kp-logo{font-size:16px}.kp-logo-mark{font-size:20px}.kp-logo small{font-size:5px}
 .kp-search{height:34px}.kp-search input{font-size:10px;padding-left:12px}
 .kp-download{display:none}.kp-menu{width:34px;font-size:22px}
 .kp-nav{display:none}
 .kp-hero{min-height:250px}.kp-hero-inner{min-height:250px}.kp-hero-copy{width:55%;padding:20px 0}.kp-eyebrow{font-size:10px}.kp-hero h1{font-size:31px}.kp-hero p{font-size:11px}.kp-cta{font-size:9px;padding:10px 13px}
 .kp-hero-visual{right:-17%;width:68%;height:100%}.kp-character{height:190px}.kp-character:before{width:105px;height:48px;font-size:15px}.kp-card{font-size:25px}
 .kp-stats-grid{grid-template-columns:repeat(4,1fr)}.kp-stat{padding:11px 4px}.kp-stat b{font-size:11px}.kp-stat span{font-size:6px}
 .kp-main{padding:14px 0 78px}.kp-categories{grid-template-columns:repeat(2,1fr);gap:8px}.kp-category{min-height:125px}.kp-category-icon{font-size:40px;height:48px}.kp-category h3{font-size:11px;margin:7px 0 4px}.kp-category p{font-size:8px}
 .kp-section{padding:13px 10px;margin:10px 0;border-radius:11px}.kp-section h2{font-size:14px}.kp-view{font-size:8px;padding:5px 8px}
 .kp-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.kp-card-item{padding:5px}.kp-card-title{font-size:8px;margin-top:5px}.kp-rating{font-size:7px}
 .kp-app-banner{min-height:110px;padding:16px}.kp-app-icon{font-size:40px;margin-right:14px}.kp-app-banner h2{font-size:16px}.kp-app-banner p{font-size:9px}.kp-app-btn{font-size:8px;padding:8px 11px}
 .kp-footer{padding-bottom:78px}.kp-footer-grid{display:block}
 .kp-bottom{display:grid;position:fixed;left:0;right:0;bottom:0;height:62px;background:rgba(8,2,13,.97);border-top:1px solid #2a1437;z-index:1200;grid-template-columns:repeat(4,1fr);backdrop-filter:blur(14px)}
 .kp-bottom a{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;color:#a69aaa;font-size:8px;font-weight:800}.kp-bottom a.active{color:#ef159f}.kp-bottom i{font-style:normal;font-size:18px}
}

/* v1.3 fixes */
.kp-single-image{margin-bottom:20px;border-radius:12px;overflow:hidden;border:1px solid #251037;background:#09040d}
.kp-single-image img{display:block;width:100%;height:auto;max-height:600px;object-fit:cover}
.kp-single-excerpt{color:#c7bbcc;font-size:14px;line-height:1.7;margin:0 0 18px}
.kp-single-content{color:#ddd4e2;font-size:14px;line-height:1.85}
.kp-single-content img{max-width:100%;height:auto;border-radius:10px}
.kp-single-content a{color:#ff36b4}
.kp-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.kp-tags a{color:#d7c7dc;border:1px solid #321542;border-radius:8px;padding:7px 10px;font-size:10px}
.kp-single-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
.kp-empty-text{color:#a79aaa;line-height:1.7}
.kp-bottom a{text-decoration:none}
@media(max-width:800px){.kp-single{padding:14px 12px}.kp-single-content{font-size:13px}.kp-single-actions .kp-cta,.kp-single-actions .kp-app-btn{padding:11px 14px;font-size:10px}}


/* KHALOOPKS v1.6: single-post mobile navigation visibility fix */
@media (max-width:800px){
  html, body { overflow-x:hidden; }
  body { padding-bottom:calc(88px + env(safe-area-inset-bottom)) !important; }
  .kp-bottom{
    display:grid !important;
    position:fixed !important;
    left:0 !important; right:0 !important; bottom:0 !important;
    width:100% !important;
    height:68px !important;
    z-index:2147483000 !important;
    visibility:visible !important;
    opacity:1 !important;
    transform:none !important;
    padding-bottom:env(safe-area-inset-bottom) !important;
    box-sizing:content-box !important;
    pointer-events:auto !important;
  }
  .kp-bottom a { min-height:68px !important; position:relative; z-index:2147483001 !important; }
  .kp-main, .kp-single, .kp-footer { padding-bottom:110px !important; }
}

.kp-footer-links{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px}.kp-footer-links a{color:#d7c8dc;text-decoration:none;font-size:12px;font-weight:700}.kp-footer-links a:hover{color:#ef159f}.kp-footer-links a+a{border-left:1px solid #382044;padding-left:18px}
@media(max-width:800px){.kp-footer-links{gap:10px 14px}.kp-footer-links a{font-size:11px}.kp-footer-links a+a{padding-left:14px}}

@media(max-width:800px){.kp-single-content{padding-bottom:18px}.kp-single-actions{margin-bottom:12px}}


/* Home article section */
.kp-article-list{display:flex;flex-direction:column;gap:12px;padding:0 16px 28px}
.kp-article-card{display:flex;gap:12px;padding:10px;border:1px solid #2c2e3e;border-radius:14px;background:#20222f;color:#f2f0ec;text-decoration:none}
.kp-article-thumb{width:90px;height:70px;flex:0 0 90px;overflow:hidden;border-radius:10px}
.kp-article-thumb img{width:100%;height:100%;object-fit:cover}
.kp-article-card h3{font-size:14px;margin:2px 0 6px}
.kp-article-card p{font-size:11px;color:#9a9aa8;margin:0;line-height:1.45}
.kp-empty{padding:18px 16px;color:#9a9aa8}
\n\n/* Article content and article-first-class layout */\n.kp-single-article .kp-section-head h1{font-size:28px;line-height:1.2;margin:0}\n.kp-single-article>.kp-section{overflow:hidden}\n.kp-single-article .kp-single-content h1,.kp-single-article .kp-single-content h2,.kp-single-article .kp-single-content h3,.kp-single-article .kp-single-content h4{color:#fff;line-height:1.3;margin:22px 0 10px}\n.kp-single-article .kp-single-content p{margin:0 0 16px}\n.kp-single-article .kp-single-content ul,.kp-single-article .kp-single-content ol{padding-left:22px}\n.kp-single-article .kp-single-content blockquote{border-left:3px solid var(--pink);margin:18px 0;padding:8px 16px;color:#cfc2d5}\n.kp-article-app-banner{margin-top:28px}\n.kp-related-games{margin:28px 0 0;padding:0;border:0;background:transparent}\n@media(max-width:800px){.kp-single-article .kp-section-head h1{font-size:20px}.kp-single-article .kp-single-content{font-size:13px}.kp-article-app-banner{margin-top:20px}.kp-related-games{margin-top:20px}}\n

/* KHALOOPKS v3.0 — animated 3D-style hero avatar */
.kp-hero{min-height:430px;background:
 radial-gradient(circle at 78% 42%,rgba(255,18,185,.18),transparent 18%),
 radial-gradient(circle at 92% 28%,rgba(121,20,255,.28),transparent 30%),
 linear-gradient(105deg,#180022,#08000f 56%,#17001e)}
.kp-hero-inner{min-height:430px}
.kp-hero-visual.kp-hero-3d{right:0;width:57%;height:100%;display:flex;align-items:flex-end;justify-content:center;perspective:900px;isolation:isolate}
.kp-hero-glow{position:absolute;width:330px;height:330px;border-radius:50%;right:16%;top:12%;background:radial-gradient(circle,rgba(239,21,159,.42),rgba(117,23,216,.18) 42%,transparent 70%);filter:blur(7px);animation:kpGlowPulse 4.5s ease-in-out infinite}
.kp-hero-avatar-wrap{position:absolute;right:6%;bottom:-4px;width:min(470px,92%);transform-origin:50% 90%;animation:kpAvatarFloat 4.2s ease-in-out infinite;filter:drop-shadow(0 24px 34px rgba(0,0,0,.48))}
.kp-hero-avatar{display:block;width:100%;height:auto;overflow:visible;transform:rotateY(-8deg) rotateX(2deg);transform-origin:center bottom;animation:kpAvatarTilt 6s ease-in-out infinite}
.kp-hero-phone{transform-origin:397px 290px;animation:kpPhoneShow 3.8s ease-in-out infinite}
.kp-hero-orbit{position:absolute;border:1px solid rgba(255,49,188,.28);border-radius:50%;transform:rotateX(66deg) rotateZ(-14deg);pointer-events:none}
.kp-orbit-a{width:390px;height:120px;right:8%;top:44%;animation:kpOrbitA 12s linear infinite}
.kp-orbit-b{width:300px;height:90px;right:16%;top:48%;border-color:rgba(128,54,255,.25);animation:kpOrbitB 9s linear infinite reverse}
.kp-hero-app-chip{position:absolute;right:2%;bottom:34px;display:flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid rgba(255,52,190,.4);border-radius:12px;background:rgba(12,3,19,.72);box-shadow:0 10px 28px rgba(0,0,0,.3),0 0 28px rgba(238,21,159,.12);backdrop-filter:blur(10px);animation:kpChipFloat 3.6s ease-in-out infinite}
.kp-hero-app-chip strong{font-size:9px;letter-spacing:.5px;color:#fff}.kp-hero-app-chip small{font-size:6px;color:#bcaac6;display:block;margin-left:2px}.kp-chip-dot{width:8px;height:8px;border-radius:50%;background:#ff2aaf;box-shadow:0 0 12px #ff2aaf}
@keyframes kpAvatarFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-10px,0)}}
@keyframes kpAvatarTilt{0%,100%{transform:rotateY(-8deg) rotateX(2deg) rotateZ(0deg)}50%{transform:rotateY(4deg) rotateX(1deg) rotateZ(.5deg)}}
@keyframes kpPhoneShow{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}45%{transform:translate3d(-4px,-8px,0) rotate(-2deg)}70%{transform:translate3d(3px,-3px,0) rotate(1.5deg)}}
@keyframes kpGlowPulse{0%,100%{opacity:.72;transform:scale(.96)}50%{opacity:1;transform:scale(1.05)}}
@keyframes kpOrbitA{from{transform:rotateX(66deg) rotateZ(-14deg) rotate(0deg)}to{transform:rotateX(66deg) rotateZ(-14deg) rotate(360deg)}}
@keyframes kpOrbitB{from{transform:rotateX(66deg) rotateZ(12deg) rotate(0deg)}to{transform:rotateX(66deg) rotateZ(12deg) rotate(-360deg)}}
@keyframes kpChipFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media(max-width:800px){
 .kp-hero{min-height:390px}.kp-hero-inner{min-height:390px;align-items:flex-start}
 .kp-hero-copy{width:56%;padding:32px 0 20px;position:relative;z-index:5}
 .kp-hero h1{font-size:31px}.kp-hero p{font-size:11px}
 .kp-hero-visual.kp-hero-3d{right:-12%;width:66%;height:100%;align-items:flex-end}
 .kp-hero-avatar-wrap{width:360px;right:-2%;bottom:-8px}
 .kp-hero-glow{width:250px;height:250px;right:6%;top:22%}
 .kp-orbit-a{width:260px;height:82px;right:-4%;top:46%}.kp-orbit-b{width:205px;height:65px;right:6%;top:49%}
 .kp-hero-app-chip{right:1%;bottom:18px;padding:7px 9px;gap:5px}.kp-hero-app-chip strong{font-size:7px}.kp-hero-app-chip small{font-size:5px}.kp-chip-dot{width:6px;height:6px}
}
@media(prefers-reduced-motion:reduce){.kp-hero-avatar-wrap,.kp-hero-avatar,.kp-hero-phone,.kp-hero-glow,.kp-hero-orbit,.kp-hero-app-chip{animation:none!important}}


/* KHALOOPKS v3.1 — replacement hero girl photo with CSS 3-D depth */
.kp-hero-photo-wrap{
  width:min(650px,108%);
  height:auto;
  right:1%;
  bottom:-10px;
  transform-style:preserve-3d;
  perspective:1100px;
  animation:kpPhotoFloat 4.8s ease-in-out infinite;
}
.kp-hero-avatar-photo{
  position:relative;
  z-index:3;
  display:block;
  width:100%;
  height:auto;
  max-height:620px;
  object-fit:contain;
  object-position:center bottom;
  transform-style:preserve-3d;
  transform:rotateY(-7deg) rotateX(1deg) translateZ(18px);
  transform-origin:58% 88%;
  filter:drop-shadow(0 24px 30px rgba(0,0,0,.48))
         drop-shadow(0 0 30px rgba(239,21,159,.22));
  animation:kpPhotoTilt 6.5s ease-in-out infinite;
  transition:transform .35s ease, filter .35s ease;
}
.kp-hero-photo-depth{
  position:absolute;
  z-index:1;
  width:100%;
  height:100%;
  left:0;
  top:0;
  background:url('assets/khaloopks-girl-3d.png') center bottom / contain no-repeat;
  transform:translate3d(18px,10px,-22px) rotateY(-7deg) rotateX(1deg);
  filter:brightness(.42) saturate(1.25) blur(.2px);
  opacity:.52;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 100%);
}
.kp-hero-photo-wrap:hover .kp-hero-avatar-photo{
  transform:rotateY(-13deg) rotateX(2deg) translate3d(-5px,-4px,32px) scale(1.015);
  filter:drop-shadow(0 28px 34px rgba(0,0,0,.52))
         drop-shadow(0 0 42px rgba(239,21,159,.30));
}
@keyframes kpPhotoFloat{
  0%,100%{transform:translate3d(0,0,0) rotateZ(0deg)}
  50%{transform:translate3d(0,-7px,0) rotateZ(.35deg)}
}
@keyframes kpPhotoTilt{
  0%,100%{transform:rotateY(-7deg) rotateX(1deg) translateZ(18px)}
  50%{transform:rotateY(-2deg) rotateX(-1deg) translateZ(25px)}
}
@media(max-width:900px){
  .kp-hero-photo-wrap{right:-8%;width:78%;bottom:-7px}
  .kp-hero-avatar-photo{max-height:410px}
}
@media(max-width:640px){
  .kp-hero-photo-wrap{right:-15%;width:84%;bottom:-5px}
  .kp-hero-avatar-photo{max-height:350px}
  .kp-hero-photo-depth{transform:translate3d(12px,7px,-16px) rotateY(-7deg)}
}
@media(prefers-reduced-motion:reduce){
  .kp-hero-photo-wrap,.kp-hero-avatar-photo{animation:none!important}
}


/* KHALOOPKS v3.2 — dynamic Trending Games UI */
.kp-category[href*="kp_sort=trending"]{position:relative}
.kp-category[href*="kp_sort=trending"]:after{content:"AUTO";position:absolute;top:10px;right:10px;color:#ff66ca;font-size:7px;font-weight:900;letter-spacing:.8px;border:1px solid #5c1b71;border-radius:5px;padding:3px 5px;background:rgba(35,4,45,.55)}

/* Category archive: keep featured images hidden. Homepage cards and single posts remain unchanged. */
.kp-category-card-no-image .kp-thumb,
.kp-category-card-no-image .kp-article-thumb {
  display: none !important;
}


/* v19 — Hide featured images on Games, Apps, Articles and Trending section listings. Homepage cards remain unchanged. */
.kp-category-card-no-image .kp-thumb,
.kp-category-card-no-image .kp-article-thumb { display:none !important; }
.kp-single-article-no-featured .kp-single-image,
.kp-single-article-no-featured > .kp-featured-image { display:none !important; }


/* v5.1 FIX: Featured images are hidden INSIDE individual Games, Apps and
 * Articles. They remain available for listing/card thumbnails. */
.kp-single-image,
.kp-single-article .wp-post-image,
.kp-single-game .wp-post-image,
.kp-single-article article > .post-thumbnail,
.kp-single-game article > .post-thumbnail,
.single .post-thumbnail,
.single-khalowin_game .post-thumbnail,
.single-khalowin_app .post-thumbnail {
    display: none !important;
}

/* Never let a featured-image wrapper leave an empty gap on single posts. */
.kp-single-article .featured-image,
.kp-single-game .featured-image,
.kp-single-article .wp-block-post-featured-image,
.kp-single-game .wp-block-post-featured-image {
    display: none !important;
}

/* v6.1 — move app promotion to top, same girl image */
.kp-app-banner-top{display:flex;align-items:center;justify-content:space-between;min-height:260px;margin:18px auto;border:1px solid #2a1240;border-radius:14px;overflow:hidden;background:radial-gradient(circle at 72% 50%,rgba(147,0,177,.35),transparent 28%),linear-gradient(105deg,#12031d,#270038 55%,#100016);position:relative;text-decoration:none;color:inherit;padding:0 34px 0 45px;box-sizing:border-box}
.kp-app-banner-top .kp-app-banner-copy{position:relative;z-index:2;max-width:58%}
.kp-app-eyebrow{font-size:13px;font-weight:900;letter-spacing:2px;color:#fff;margin-bottom:5px}
.kp-app-banner-top h2{margin:0 0 8px;font-size:34px;line-height:1.05;color:#fff}
.kp-app-banner-top p{margin:4px 0;color:#c7b7ce;font-size:14px}
.kp-app-banner-girl{height:260px;width:42%;display:flex;align-items:flex-end;justify-content:center;position:relative;z-index:1}
.kp-app-banner-girl img{display:block;height:100%;width:auto;max-width:100%;object-fit:contain;object-position:center bottom}
.kp-app-banner-top:hover{border-color:#7521a9}
@media(max-width:800px){.kp-app-banner-top{min-height:250px;margin:10px 0;padding:0 8px 0 18px;border-radius:12px}.kp-app-banner-top .kp-app-banner-copy{max-width:57%}.kp-app-eyebrow{font-size:9px;letter-spacing:1px}.kp-app-banner-top h2{font-size:27px;margin-bottom:6px}.kp-app-banner-top p{font-size:10px;line-height:1.35}.kp-app-banner-girl{height:250px;width:46%}}