/*
Theme Name: KGAME Neon Child
Description: Original KGAME neon editorial skin built on Flatsome.
Author: Site Operations
Template: flatsome
Version: 3.1.4
Text Domain: kgame-child
*/

:root {
  --kg-purple: #3d138d;
  --kg-indigo: #2424df;
  --kg-blue: #2633e9;
  --kg-blue-dark: #102f4e;
  --kg-surface: #163f64;
  --kg-surface-soft: #1b4a72;
  --kg-black: #030506;
  --kg-lime: #9cff6c;
  --kg-cyan: #55e6ff;
  --kg-violet: #7b3cff;
  --kg-muted: #b8c8d9;
  --kg-white: #fff;
  --kg-shell: 1600px;
  --kg-neon: linear-gradient(135deg, var(--kg-lime), var(--kg-cyan) 52%, var(--kg-violet));
}

* { box-sizing: border-box; }
html { overflow-x: clip; overflow-y: visible; scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: clip;
  overflow-y: visible;
  color: var(--kg-white);
  background: #0a1425;
  font-family: Roboto, Arial, Helvetica, sans-serif;
  line-height: 1.65;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.kg-container { width: min(var(--kg-shell), calc(100% - 32px)); margin: 0 auto; }
.kg-site { width: 100%; margin: 0; background: var(--kg-surface); min-height: 100vh; }

.kg-header { position: sticky; top: 0; z-index: 999; width: 100%; color: var(--kg-white); background: rgba(63,27,181,.96); box-shadow: none; }
body.admin-bar .kg-header { top: 32px; }
.kg-header__top { width: min(1220px, calc(100% - 30px)); min-height: 90px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; padding: 10px 15px; transition: min-height .2s ease, padding .2s ease; }
.kg-menu-mark { display: none; border: 0; padding: 0; background: transparent; color: #fff; }
.kg-brand { grid-column: 2; display: inline-flex; align-items: center; justify-self: center; color: #fff; }
.kg-brand img { width: 200px; height: 47px; object-fit: fill; border-radius: 0; box-shadow: none; transition: width .2s ease, height .2s ease; }
.kg-header__tools { grid-column: 3; justify-self: end; display: flex; align-items: center; gap: 18px; }
.kg-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 18px; border: 0; border-radius: 10px; color: #fff; background: linear-gradient(90deg, #8713a7, #00b7ed); font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: .35px; box-shadow: none; transition: transform .2s ease, filter .2s ease; white-space: nowrap; }
.kg-btn:hover { color: #fff; filter: brightness(1.12); transform: translateY(-2px); }
.kg-socials { display: flex; align-items: center; gap: 5px; }
.kg-socials span { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid rgba(255,255,255,.75); border-radius: 50%; color: #fff; font-size: 14px; font-weight: 400; }
.kg-socials i { line-height: 1; }
.kg-nav { height: 70px; color: #fff; overflow-x: auto; background: rgb(39,33,221); border: 0; box-shadow: none; }
.kg-nav ul { width: max-content; max-width: 100%; height: 70px; display: flex; justify-content: center; align-items: stretch; gap: 22px; list-style: none; margin: 0 auto; padding: 0 15px; min-width: max-content; }
.kg-nav li { position: relative; display: flex; align-items: stretch; border: 0 !important; }
.kg-nav li + li::before { content: ""; position: absolute; left: -11px; top: 50%; width: 1px; height: 18px; background: rgba(255,255,255,.42); transform: translateY(-50%); }
.kg-nav .menu > li > a { height: 70px; display: inline-flex; align-items: center; gap: 7px; padding: 10px 0; font-size: 16px; font-weight: 400; line-height: 1.35; text-transform: uppercase; letter-spacing: 0; }
.kg-nav__icon { width: 20px; height: 20px; flex: 0 0 20px; object-fit: contain; }
.kg-nav .menu > li > a:hover, .kg-nav .menu > .current-menu-item > a { color: var(--kg-lime); background: rgba(255,255,255,.1); }
.kg-header.is-scrolled .kg-header__top { min-height: 70px; padding-top: 7px; padding-bottom: 7px; }
.kg-header.is-scrolled .kg-brand img { width: 180px; height: 42px; }

.kg-exact-main { min-height: 780px; color: #fff; background: #204b70; }
.kg-exact-shell { width: min(var(--kg-shell), calc(100% - 48px)); margin: 0 auto; }
.kg-exact-intro { padding: 52px 0 42px; }
.kg-exact-heading { display: flex; align-items: center; gap: 24px; margin: 0 auto 44px; color: var(--kg-lime); font-size: clamp(30px, 2.5vw, 46px); font-weight: 900; line-height: 1.28; text-align: center; text-transform: uppercase; letter-spacing: .45px; text-shadow: 0 0 18px rgba(156,255,108,.25); }
.kg-exact-heading::before, .kg-exact-heading::after { content: ""; flex: 1 1 120px; height: 3px; background: rgba(155,208,255,.16); }
.kg-exact-heading span { max-width: 1240px; background: linear-gradient(90deg, #b7ff45, #41f7cb); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kg-exact-copy { max-width: 1200px; margin: 0 auto; padding: 34px 42px; border: 4px solid transparent; border-radius: 20px; background: linear-gradient(#000, #000) padding-box, linear-gradient(135deg, #aaff61, #2df6d0 52%, #147aff) border-box; box-shadow: 0 18px 38px rgba(0,0,0,.18); }
.kg-exact-copy p { margin: 0; color: #f5f5f5; font-size: 19px; line-height: 1.7; }
.kg-exact-copy strong { color: #ffd580; }
.kg-exact-features { padding: 38px 0 110px; }
.kg-exact-features .kg-exact-heading { max-width: 1450px; margin-bottom: 42px; }
.kg-exact-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; align-items: stretch; }
.kg-exact-card { min-height: 460px; margin: 0; padding: 38px 32px 36px; border: 4px solid transparent; border-radius: 20px; background: linear-gradient(#000, #000) padding-box, linear-gradient(145deg, #aaff61, #29f5cf 52%, #1677ff) border-box; color: #fff; text-align: center; box-shadow: 0 14px 28px rgba(0,0,0,.16); }
.kg-exact-card__image { width: 190px; height: 190px; display: block; overflow: hidden; margin: 0 auto 20px; border: 2px solid rgba(255,255,255,.22); border-radius: 50%; background: #0a0a0a; }
.kg-exact-card__image img { width: 100%; height: 100%; object-fit: cover; }
.kg-exact-card h3 { margin: 0 0 8px; color: #fff; font-size: 22px; font-weight: 500; }
.kg-exact-card h3 a:hover { color: var(--kg-lime); }
.kg-exact-rating { margin-bottom: 25px; color: #ffb126; font-size: 22px; letter-spacing: 2px; }
.kg-exact-card p { margin: 0 auto; max-width: 420px; color: #f1f1f1; font-size: 17px; line-height: 1.75; }

.kg-main { background: var(--kg-surface); }
.kg-hero { position: relative; overflow: hidden; min-height: 390px; background: radial-gradient(circle at 70% 20%, #255c98 0, #12385c 45%, #07182c 100%); border-bottom: 1px solid rgba(112,225,255,.2); }
.kg-hero img { width: 100%; height: clamp(320px, 31.3vw, 366px); object-fit: cover; object-position: center; }
.kg-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3,10,27,.28), rgba(8,28,52,.54) 56%, rgba(10,35,58,.95)); pointer-events: none; }
.kg-hero__copy { position: absolute; z-index: 2; left: 50%; bottom: 26px; transform: translateX(-50%); width: min(850px, calc(100% - 40px)); color: #fff; text-align: center; }
.kg-hero__copy span { display: inline-block; padding: 8px 16px; border: 1px solid rgba(112,238,255,.52); border-radius: 10px; background: linear-gradient(135deg, rgba(116,50,231,.76), rgba(49,195,222,.72)); font-size: 12px; font-weight: 900; letter-spacing: .7px; text-transform: uppercase; box-shadow: 0 0 22px rgba(83,213,255,.18); }
.kg-hero__copy h1 { margin: 14px auto 9px; max-width: 780px; color: var(--kg-lime); font-size: clamp(30px, 4.2vw, 48px); line-height: 1.08; letter-spacing: .4px; text-transform: uppercase; text-shadow: 0 3px 0 #10375e, 0 0 20px rgba(156,255,108,.28); }
.kg-hero__copy p { margin: 0 auto; max-width: 680px; color: #f7fbff; font-size: 15px; text-shadow: 0 2px 9px rgba(0,0,0,.65); }

.kg-promo { background: linear-gradient(180deg, var(--kg-surface), #123654); padding: 38px 0 48px; }
.kg-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
.kg-card { position: relative; overflow: hidden; min-height: 180px; border: 4px solid transparent; border-radius: 18px; background: linear-gradient(var(--kg-black), var(--kg-black)) padding-box, var(--kg-neon) border-box; box-shadow: 0 18px 34px rgba(0,0,0,.32), 0 0 20px rgba(86,225,255,.08); }
.kg-card img { width: 100%; height: 100%; min-height: 180px; object-fit: cover; transition: transform .35s ease; }
.kg-card:hover img { transform: scale(1.035); }
.kg-card::after { content: ""; position: absolute; inset: auto 0 0; height: 44%; background: linear-gradient(transparent, rgba(0,0,0,.88)); pointer-events: none; }
.kg-card__label { position: absolute; z-index: 2; left: 16px; bottom: 14px; padding: 8px 14px; border: 1px solid rgba(156,255,108,.52); border-radius: 9px; background: rgba(0,0,0,.82); color: var(--kg-lime); font-size: 14px; font-weight: 900; text-transform: uppercase; letter-spacing: .35px; }
.kg-section-divider { height: 2px; margin-top: 38px; background: var(--kg-neon); box-shadow: 0 0 18px rgba(80,223,255,.38); opacity: .75; }

.kg-structure { padding: 54px 0 70px; background: radial-gradient(circle at 50% 0, var(--kg-surface-soft), var(--kg-surface) 52%, #102f4e); color: #edf5ff; }
.kg-structure .kg-container { display: grid; gap: 34px; }
.kg-structure-panel { padding: clamp(24px, 4vw, 42px); border: 3px solid transparent; border-radius: 18px; background: linear-gradient(var(--kg-black), var(--kg-black)) padding-box, var(--kg-neon) border-box; box-shadow: 0 20px 42px rgba(0,0,0,.32); }
.kg-panel-kicker { display: inline-block; padding: 7px 11px; border: 1px solid rgba(85,230,255,.46); border-radius: 8px; color: var(--kg-cyan); background: rgba(37,43,180,.22); font-size: 11px; font-weight: 900; letter-spacing: .8px; text-transform: uppercase; }
.kg-structure h2 { margin: 18px 0 24px; color: var(--kg-lime); font-size: clamp(24px, 3vw, 34px); line-height: 1.2; text-transform: uppercase; text-shadow: 0 0 16px rgba(156,255,108,.2); }
.kg-link-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.kg-link-grid a { min-height: 88px; display: flex; align-items: center; padding: 18px; border: 1px solid rgba(85,230,255,.26); border-left: 4px solid var(--kg-cyan); border-radius: 9px; background: #091522; color: #fff; font-size: 14px; font-weight: 800; transition: transform .2s ease, border-color .2s ease, color .2s ease, background .2s ease; }
.kg-link-grid a:hover { transform: translateY(-2px); border-color: var(--kg-lime); color: var(--kg-lime); background: #102238; }

.kg-content { background: var(--kg-surface); padding: 48px 0 64px; }
.kg-content article { max-width: 900px; margin: 0 auto; }
.kg-content h2 { margin: 36px 0 12px; color: var(--kg-lime); font-size: clamp(25px, 3.5vw, 36px); line-height: 1.25; }
.kg-content h3 { color: var(--kg-cyan); }
.kg-content p { color: #eef6ff; }
.kg-intro { padding: 26px; border-left: 5px solid var(--kg-lime); border-radius: 0 14px 14px 0; background: #06111d; font-size: 17px; }
.kg-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 30px 0; }
.kg-feature { padding: 22px; border: 1px solid rgba(85,230,255,.28); border-radius: 14px; background: #06111d; box-shadow: 0 10px 26px rgba(0,0,0,.25); }
.kg-feature b { display: block; margin-bottom: 8px; color: var(--kg-lime); font-size: 18px; }

.kg-editorial { background: radial-gradient(circle at 50% 0, var(--kg-surface-soft), var(--kg-surface) 46%, #102f4e); min-height: 520px; padding: 48px 0 72px; color: #f5f9ff; }
.kg-editorial__box { max-width: 920px; margin: 0 auto; padding: clamp(24px, 5vw, 52px); border: 3px solid transparent; border-radius: 18px; background: linear-gradient(var(--kg-black), var(--kg-black)) padding-box, var(--kg-neon) border-box; box-shadow: 0 22px 48px rgba(0,0,0,.34); }
.kg-editorial h1 { margin-top: 0; line-height: 1.18; color: var(--kg-lime); text-transform: uppercase; text-shadow: 0 0 16px rgba(156,255,108,.2); }
.kg-editorial h2, .kg-editorial h3, .kg-editorial h4 { color: var(--kg-lime); line-height: 1.28; }
.kg-editorial p, .kg-editorial li { color: #edf5ff; }
.kg-editorial a { color: var(--kg-cyan); }
.kg-editorial blockquote { margin: 24px 0; padding: 18px 22px; border-left: 4px solid var(--kg-lime); background: #0b1825; color: #fff; }
.kg-editorial table { width: 100%; border-collapse: collapse; background: #08131e; }
.kg-editorial th, .kg-editorial td { padding: 12px; border: 1px solid rgba(85,230,255,.24); }
.kg-editorial th { color: var(--kg-lime); background: #10243a; }
.kg-editorial img { border-radius: 12px; }
.kg-post-meta { color: var(--kg-muted); font-size: 13px; margin-bottom: 24px; }
.kg-archive-list { display: grid; gap: 18px; }
.kg-archive-item { padding: 22px; border: 1px solid rgba(85,230,255,.3); border-left: 4px solid var(--kg-lime); border-radius: 12px; background: #08131e; }
.kg-archive-item h2 { margin-top: 0; }

.kg-responsible { padding: 18px 20px; border-top: 1px solid rgba(156,255,108,.3); border-bottom: 1px solid rgba(85,230,255,.24); background: #081523; color: #e9f4ff; text-align: center; font-size: 14px; }
.kg-responsible strong { color: var(--kg-lime); }
.kg-footer { min-height: 466px; background: #000; color: #f1f1f1; }
.kg-footer .kg-container { width: min(1220px, calc(100% - 30px)); }
.kg-footer__grid { min-height: 418px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 30px 0 0; }
.kg-footer__grid > section { min-width: 0; padding: 0 15px 24px; }
.kg-footer__brandmark { display: inline-flex; align-items: center; width: 300px; height: 71px; margin: 0 0 21px; color: #fff; }
.kg-footer__brandmark img { width: 300px; height: 71px; border-radius: 0; object-fit: fill; }
.kg-footer h3 { position: relative; margin: 0 0 20px; padding-bottom: 13px; color: #fff; font-size: 16px; line-height: 1.4; text-transform: uppercase; }
.kg-footer h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 34px; height: 2px; background: #7d7d7d; }
.kg-footer p { margin: 0 0 20px; color: #dedede; font-size: 16px; line-height: 1.6; }
.kg-footer__keywords strong { color: #fff; }
.kg-footer ul { list-style: none; margin: 0; padding: 0; }
.kg-footer li { margin: 0 0 9px; color: #ededed; font-size: 16px; line-height: 1.6; }
.kg-footer li a { color: #f4f4f4; font-weight: 700; }
.kg-footer a:hover { color: var(--kg-cyan); }
.kg-footer__badges { height: 41px; display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 11px; }
.kg-footer__badges span { width: 39px; height: 39px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid #d7d7d7; border-radius: 50%; color: #fff; background: #0c0c0c; font-size: 12px; font-weight: 900; }
.kg-footer__badges span:first-child { border-color: #ff4949; }
.kg-footer__contact li { font-weight: 400; }
.kg-footer__bottom { min-height: 48px; display: flex; align-items: center; border-top: 0; padding: 10px 0 15px; background: #5b5b5b; color: #d7d7d7; font-size: 14px; line-height: 23px; text-align: center; }

@media (max-width: 820px) {
  body.admin-bar .kg-header { top: 46px; }
  .kg-header__top { width: 100%; min-height: 130px; grid-template-columns: 1fr; grid-template-rows: 70px 60px; justify-items: center; gap: 0; padding: 0 15px; }
  .kg-menu-mark { position: absolute; z-index: 2; left: 20px; top: 22px; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; cursor: pointer; }
  .kg-menu-mark .icon-menu { font-size: 24px; line-height: 1; }
  .kg-brand { grid-column: 1; grid-row: 1; justify-self: center; }
  .kg-brand img { width: 160px; height: 43px; object-fit: fill; }
  .kg-header__tools { grid-column: 1; grid-row: 2; width: calc(100% + 30px); height: 60px; margin-left: -15px; justify-self: stretch; justify-content: center; gap: 0; background: rgb(39,33,221); }
  .kg-header__tools .kg-btn { min-width: 183px; min-height: 38px; padding: 0 18px; font-size: 12px; }
  .kg-socials { display: none; }
  .kg-header.is-scrolled .kg-header__top { min-height: 130px; padding: 0 15px; }
  .kg-header.is-scrolled .kg-brand img { width: 160px; height: 43px; }
  .kg-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; height: auto; max-height: calc(100vh - 130px); overflow-y: auto; background: #2527df; box-shadow: 0 16px 28px rgba(0,0,0,.32); }
  .kg-nav.is-open { display: block; }
  .kg-nav ul { width: 100%; height: auto; min-width: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 0; }
  .kg-nav li { width: 100%; }
  .kg-nav li + li::before { display: none; }
  .kg-nav .menu > li > a { width: 100%; height: auto; justify-content: flex-start; padding: 13px 22px; font-size: 12px; }
  .kg-nav__icon { width: 20px; height: 20px; flex-basis: 20px; }
  .kg-exact-shell { width: min(100% - 30px, var(--kg-shell)); }
  .kg-exact-intro { padding: 30px 0 28px; }
  .kg-exact-heading { gap: 10px; margin-bottom: 34px; font-size: clamp(25px, 8vw, 34px); }
  .kg-exact-heading::before, .kg-exact-heading::after { flex-basis: 28px; height: 2px; }
  .kg-exact-copy { padding: 26px 22px; border-width: 3px; border-radius: 18px; }
  .kg-exact-copy p { font-size: 16px; line-height: 1.62; }
  .kg-exact-features { padding: 24px 0 74px; }
  .kg-exact-cards { grid-template-columns: 1fr; gap: 3px; }
  .kg-exact-card { min-height: 410px; padding: 34px 24px 32px; border-width: 3px; }
  .kg-exact-card__image { width: 165px; height: 165px; }
  .kg-exact-card p { font-size: 16px; }
  .kg-cards, .kg-feature-grid { grid-template-columns: 1fr; }
  .kg-link-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kg-footer { min-height: 0; }
  .kg-footer__grid { min-height: 0; grid-template-columns: 1fr; gap: 20px; padding-top: 30px; }
}

@media (max-width: 520px) {
  .kg-container { width: min(100% - 24px, var(--kg-shell)); }
  .kg-header__tools .kg-btn { min-width: 190px; }
  .kg-exact-heading { font-size: 28px; }
  .kg-exact-heading span { max-width: 270px; }
  .kg-exact-card { min-height: 430px; }
  .kg-hero { min-height: 390px; }
  .kg-hero img { height: 390px; }
  .kg-hero__copy { bottom: 24px; width: calc(100% - 28px); }
  .kg-hero__copy h1 { font-size: clamp(27px, 9vw, 34px); }
  .kg-hero__copy p { font-size: 13px; line-height: 1.5; }
  .kg-card { border-width: 3px; }
  .kg-structure-panel { border-width: 2px; }
  .kg-editorial__box { border-width: 2px; }
  .kg-footer .kg-container { width: min(100% - 30px, 1220px); }
  .kg-footer__grid { padding: 30px 0 12px; }
  .kg-footer__grid > section { padding: 0 0 12px; }
  .kg-footer__brandmark { width: 300px; height: 71px; margin-bottom: 20px; }
  .kg-footer__brandmark img { width: 300px; height: 71px; }
  .kg-link-grid { grid-template-columns: 1fr; }
}
