
:root{
  --bg:#0b0b0b;
  --bg2:#111111;
  --panel:#171717;
  --panel2:#1d1d1d;
  --line:#2a2a2a;
  --text:#f3f1ed;
  --muted:#88827d;
  --accent:#ff6a18;
  --accent2:#ffb31a;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
img{max-width:100%;display:block}
.wrap{width:min(960px,calc(100% - 34px));margin:0 auto}
.topline{height:3px;background:linear-gradient(90deg,var(--accent),var(--accent2))}
header{height:54px;background:#0a0a0a;border-bottom:1px solid #1f1f1f}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:18px}
.logo{display:flex;align-items:center;gap:8px;font-weight:900;font-size:12px;letter-spacing:.03em}
.logo-mark{width:24px;height:24px;transform:rotate(45deg);border:2px solid var(--accent2);display:grid;place-items:center}
.logo-mark span{transform:rotate(-45deg);font-size:8px;color:var(--accent2)}
.nav{display:flex;align-items:center;gap:21px;font-size:10px;color:#b3aea8}
.nav a{padding:17px 0;border-bottom:2px solid transparent}
.nav a.active,.nav a:hover{color:#fff;border-bottom-color:var(--accent)}
.store-pill{padding:7px 15px!important;border-radius:99px;background:linear-gradient(90deg,var(--accent),#ff8d18);color:white!important;border-bottom:0!important;font-weight:700}
.hero{position:relative;min-height:470px;overflow:hidden;border-bottom:1px solid #212121;background:
linear-gradient(90deg,rgba(18,8,4,.94) 0%,rgba(15,15,15,.78) 42%,rgba(15,17,16,.88) 100%),
radial-gradient(circle at 78% 25%,rgba(43,69,78,.22),transparent 34%),
#131313}
.hero:before{content:"";position:absolute;inset:0;opacity:.35;background:
linear-gradient(135deg, transparent 0 58%, rgba(255,255,255,.03) 58% 59%, transparent 59%),
repeating-linear-gradient(90deg,rgba(255,255,255,.015) 0 1px,transparent 1px 64px)}
.hero:after{content:"";position:absolute;inset:auto 0 0;height:120px;background:linear-gradient(transparent,rgba(0,0,0,.5))}
.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;min-height:470px}
.hero-copy{padding-left:4px}
.eyebrow{color:var(--accent);font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;margin-bottom:10px}
.hero h1{font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;font-size:44px;line-height:.96;margin:0 0 14px;text-transform:uppercase;letter-spacing:.01em}
.hero p{font-size:12px;color:#aaa49e;max-width:430px;margin:0 0 18px;line-height:1.65}
.cta-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cta{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:8px 16px;border-radius:5px;background:linear-gradient(180deg,#ff9b28,#ff6a18);color:white;font-size:11px;font-weight:800;border:1px solid #ff9b28;box-shadow:0 0 0 1px rgba(0,0,0,.3) inset}
.cta.secondary{background:#111;border:1px solid #3c3c3c}
.store-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid #474747;border-radius:5px;background:#171717;font-size:10px;color:#eee}
.store-badge b{color:#8fd265}
.hero-poster{justify-self:center;position:relative;width:340px;height:360px;border:2px solid #8b4a1e;border-radius:4px;background:
linear-gradient(180deg,rgba(29,82,110,.35),rgba(10,10,10,.05)),
linear-gradient(145deg,#29475f,#17232a 55%,#20201f);
box-shadow:0 18px 50px rgba(0,0,0,.45);overflow:hidden}
.poster-grid{position:absolute;inset:0;background:
linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px);background-size:34px 34px}
.tank-poster{position:absolute;left:50%;top:48%;width:180px;height:120px;transform:translate(-50%,-50%) rotate(-6deg)}
.tank-track{position:absolute;left:12px;width:132px;height:26px;border-radius:16px;background:#161616;border:4px solid #494949}
.tank-track.t1{top:10px}.tank-track.t2{bottom:8px}
.tank-body{position:absolute;left:30px;top:30px;width:116px;height:66px;border-radius:16px;background:#5c713b;border:5px solid #98ad67}
.tank-turret{position:absolute;left:71px;top:39px;width:52px;height:52px;border-radius:50%;background:#78974f;border:4px solid #b6d37f}
.tank-gun{position:absolute;left:110px;top:59px;width:96px;height:11px;border-radius:5px;background:#c8df8b}
.poster-title{position:absolute;left:18px;top:18px;font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;font-size:28px;line-height:.9;text-transform:uppercase;text-shadow:0 3px 0 rgba(0,0,0,.3)}
.poster-title span{display:block;color:var(--accent2);font-size:13px;letter-spacing:.09em;margin-bottom:3px}
.poster-debris{position:absolute;width:10px;height:10px;border:2px solid #9ca2a5;transform:rotate(45deg);opacity:.55}
.poster-debris.d1{right:25px;top:96px}.poster-debris.d2{left:25px;bottom:95px}.poster-debris.d3{right:60px;bottom:36px}
.poster-shot{position:absolute;left:-18px;bottom:18px;width:155px;height:85px;border:2px solid #303030;background:#222;box-shadow:0 8px 18px rgba(0,0,0,.45)}
.poster-shot:before{content:"";position:absolute;inset:0;background:
linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px),
linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px);background-size:18px 18px}
.poster-shot .mini{position:absolute;left:44px;top:29px;width:38px;height:24px;background:#718549;border:3px solid #b0c978;border-radius:5px}
.poster-shot .boom{position:absolute;right:18px;top:13px;width:24px;height:24px;border-radius:50%;background:#ff6a18;box-shadow:0 0 18px 6px rgba(255,106,24,.35)}
main section{border-bottom:1px solid #252525}
.release{background:#141414;padding:50px 0 56px}
.release-grid{display:grid;grid-template-columns:290px 1fr;gap:38px;align-items:start}
.large-shot{height:175px;background:#1c1c1c;border:1px solid #313131;position:relative;overflow:hidden}
.large-shot:before,.thumb:before{content:"";position:absolute;inset:0;background:
linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);background-size:24px 24px}
.large-shot .mini-tank,.thumb .mini-tank{position:absolute;width:50px;height:31px;border-radius:6px;background:#6b7c42;border:3px solid #9fb06d}
.large-shot .mini-tank{left:74px;top:75px}
.large-shot .mini-tank:after,.thumb .mini-tank:after{content:"";position:absolute;left:31px;top:10px;width:42px;height:6px;background:#aeca70}
.large-shot .enemy{position:absolute;right:54px;top:44px;width:30px;height:30px;border-radius:50%;background:#b43d2f;box-shadow:0 0 18px 6px rgba(180,61,47,.25)}
.release-head{display:flex;gap:12px;align-items:start}
.release-icon{width:52px;height:52px;border:2px solid #7b451e;background:linear-gradient(145deg,#214a61,#152127);position:relative}
.release-icon:after{content:"T";position:absolute;inset:0;display:grid;place-items:center;color:#ff8b24;font-weight:900;font-size:26px}
.release h2,.gallery h2{font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;font-size:28px;line-height:1;margin:5px 0 10px;text-transform:uppercase}
.release-copy>p{font-size:11px;color:#8e8984;line-height:1.6;margin:0 0 15px}
.feature-list{display:grid;gap:8px}
.feature-row{display:grid;grid-template-columns:26px 1fr;background:#1a1a1a;border:1px solid #222;padding:10px 12px;align-items:start}
.feature-icon{color:var(--accent);font-size:13px;font-weight:900}
.feature-row strong{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:3px}
.feature-row span{display:block;font-size:9px;color:#77716c}
.details-link{display:inline-block;margin-top:14px;color:var(--accent);font-size:10px;font-weight:800}
.gallery{background:#0e0e0e;padding:48px 0 52px}
.gallery .eyebrow{margin-bottom:6px}
.thumb-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
.thumb{height:108px;background:#191919;border:1px solid #303030;position:relative;overflow:hidden}
.thumb:nth-child(1){background:linear-gradient(145deg,#202d22,#151515)}
.thumb:nth-child(2){background:linear-gradient(145deg,#313022,#141414)}
.thumb:nth-child(3){background:linear-gradient(145deg,#233142,#141414)}
.thumb:nth-child(4){background:linear-gradient(145deg,#2f2b1e,#151515)}
.thumb .mini-tank{left:34px;bottom:22px}
.thumb .boom{position:absolute;right:22px;top:22px;width:24px;height:24px;border-radius:50%;background:#d1482d;box-shadow:0 0 16px 6px rgba(209,72,45,.24)}
footer{background:#151515;border-top:1px solid #242424}
.footer-main{padding:34px 0 28px;display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:58px}
.footer-col h3{font-size:9px;color:var(--accent);text-transform:uppercase;letter-spacing:.12em;margin:0 0 12px}
.footer-col p,.footer-col a{display:block;font-size:9px;color:#77716c;margin:0 0 7px}
.footer-brand{font-size:11px;font-weight:900;margin-bottom:12px}
.footer-brand span{color:var(--accent2)}
.footer-bottom{border-top:1px solid #242424;padding:10px 0 11px;text-align:center;font-size:8px;color:#5e5955}
.page-hero{padding:62px 0 38px;background:#111}
.page-hero h1{font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;font-size:46px;text-transform:uppercase;margin:0 0 12px}
.page-hero p{color:#8f8984;font-size:12px;max-width:620px}
.content-section{padding:44px 0 55px;background:#141414}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.card{background:#191919;border:1px solid #292929;padding:24px}
.card b{color:var(--accent);font-size:10px;letter-spacing:.1em}
.card h3{font-size:15px;text-transform:uppercase;margin:10px 0 6px}
.card p{font-size:10px;color:#817b76;margin:0}
.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);border:1px solid #2a2a2a}
.contact-box{padding:24px;background:#191919}
.contact-box:nth-child(odd){border-right:1px solid #2a2a2a}
.contact-box:nth-child(-n+2){border-bottom:1px solid #2a2a2a}
.contact-box h3{font-size:12px;text-transform:uppercase;margin:0 0 7px}
.contact-box p,.contact-box a{font-size:10px;color:#8a847f}
.game-hud{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.stats{display:flex;gap:7px;flex-wrap:wrap}
.stat{background:#191919;border:1px solid #2b2b2b;padding:7px 10px;min-width:70px;text-align:center}
.stat small{display:block;font-size:8px;color:#756f6b;text-transform:uppercase}
.stat b{font-size:14px}
.game-shell{position:relative;background:#162017;border:1px solid #2b2b2b}
#gameCanvas{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#162017;touch-action:none}
.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(5,5,5,.76);padding:18px}
.overlay[hidden]{display:none}
.game-panel{width:min(430px,100%);background:#111;border:1px solid #343434;padding:24px;text-align:center}
.game-panel h3{font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;font-size:28px;text-transform:uppercase;margin:0 0 8px}
.game-panel p{font-size:10px;color:#817c77}
.key-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:15px 0}
.key{border:1px solid #333;padding:7px;font-size:9px;color:#8f8983}.key b{display:block;color:var(--accent)}
.small-btn{min-height:34px;padding:7px 13px;background:#151515;color:#ddd;border:1px solid #383838;font-size:9px;text-transform:uppercase;font-weight:700}
.touch{display:none;position:absolute;left:8px;right:8px;bottom:8px;justify-content:space-between;align-items:end;pointer-events:none}
.touch button{pointer-events:auto;width:44px;height:44px;background:rgba(5,5,5,.65);color:#fff;border:1px solid rgba(255,255,255,.2)}
.pad{display:grid;grid-template-columns:44px 44px 44px;grid-template-rows:44px 44px;gap:3px}.pad .up{grid-column:2}.pad .left{grid-column:1;grid-row:2}.pad .down{grid-column:2;grid-row:2}.pad .right{grid-column:3;grid-row:2}
.fire{width:70px!important;height:70px!important;border-radius:50%;background:rgba(255,106,24,.85)!important;color:#111!important;font-weight:900}
.store-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.product{background:#191919;border:1px solid #292929;padding:22px}
.product h3{font-size:14px;text-transform:uppercase;margin:0 0 8px}.product p{font-size:10px;color:#827c77}.product .price{color:var(--accent);font-size:20px;font-weight:900;margin:15px 0}
.coin{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#d49a27;color:#2c1d08;border:6px double #7d5719;font-weight:900;margin-bottom:16px}
.notice{margin-top:18px;background:#191919;border:1px solid #2a2a2a;padding:14px;font-size:9px;color:#7c7671}
@media(max-width:800px){
  .hero-inner,.release-grid{grid-template-columns:1fr}
  .hero-inner{padding:46px 0}.hero-copy{padding-left:0}.hero-poster{width:min(340px,100%);height:340px}
  .release-grid{gap:22px}.large-shot{max-width:420px}.thumb-row{grid-template-columns:1fr 1fr}.footer-main{grid-template-columns:1fr 1fr}.cards,.store-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  header{height:auto}.header-inner{padding:10px 0;align-items:flex-start;flex-direction:column}.nav{gap:14px;flex-wrap:wrap}.nav a{padding:5px 0}.hero h1{font-size:38px}.hero{min-height:auto}.hero-inner{min-height:auto}
  .thumb-row,.cards,.store-grid,.contact-grid{grid-template-columns:1fr}.contact-box{border-right:0!important;border-bottom:1px solid #2a2a2a!important}.contact-box:last-child{border-bottom:0!important}.footer-main{grid-template-columns:1fr}.key-grid{grid-template-columns:1fr 1fr}.touch{display:flex}
}


/* ===== About page: matched to supplied reference screenshot ===== */
.about-reference{
  background:#0d0d0d;
  padding:48px 0 56px;
  border-bottom:1px solid #2a2a2a;
}
.about-reference .wrap{
  width:min(1080px,calc(100% - 40px));
}
.about-layout{
  display:grid;
  grid-template-columns:minmax(0,1.7fr) minmax(280px,.85fr);
  gap:42px;
  align-items:start;
}
.about-main .eyebrow{
  margin-bottom:12px;
  color:#ff6a18;
}
.about-main h1{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:38px;
  line-height:1;
  letter-spacing:.01em;
  margin:0 0 20px;
}
.about-main .lead-strong{
  color:#f0eee9;
  font-size:12px;
  line-height:1.7;
  margin:0 0 12px;
  font-weight:700;
}
.about-main .body-copy{
  color:#8c8782;
  font-size:11px;
  line-height:1.72;
  margin:0 0 18px;
}
.about-landscape{
  height:305px;
  border:1px solid #363636;
  border-radius:3px;
  overflow:hidden;
  position:relative;
  background:
    linear-gradient(180deg,rgba(18,30,38,.20),rgba(8,8,8,.45)),
    linear-gradient(135deg,#263038 0%,#151718 55%,#111 100%);
}
.about-landscape:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:34px 34px;
  opacity:.55;
}
.about-landscape .ruin{
  position:absolute;
  background:#1d2124;
  border:1px solid #30383d;
}
.about-landscape .r1{left:0;bottom:0;width:33%;height:72%}
.about-landscape .r2{left:30%;bottom:0;width:24%;height:52%}
.about-landscape .r3{right:0;bottom:0;width:36%;height:60%}
.about-landscape .road{
  position:absolute;left:12%;right:10%;bottom:-10px;height:90px;
  background:linear-gradient(180deg,#232323,#171717);
  transform:skewX(-18deg);
  border-top:1px solid #3b3b3b;
}
.about-landscape .warning{
  position:absolute;left:14%;top:24%;
  color:#c95c45;font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:30px;transform:rotate(-6deg);opacity:.85;
}
.about-landscape .barrel{
  position:absolute;right:17%;bottom:20px;width:48px;height:58px;
  border:2px solid #454545;border-radius:50%/14%;
  background:linear-gradient(90deg,#232323,#333,#1a1a1a);
}
.about-side{
  display:grid;
  gap:16px;
}
.about-portrait{
  height:325px;
  border:2px solid #b45a1b;
  border-radius:4px;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 28%,rgba(53,114,154,.55),transparent 26%),
    linear-gradient(180deg,#28465d,#151b20 62%,#111);
}
.about-portrait:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:32px 32px;
}
.about-portrait .portrait-head{
  position:absolute;
  left:50%;top:28%;
  transform:translate(-50%,-50%);
  width:120px;height:120px;border-radius:50%;
  background:#2c6b92;border:7px solid #101a20;
  box-shadow:0 0 0 6px #417ba0 inset;
}
.about-portrait .portrait-body{
  position:absolute;
  left:50%;bottom:34px;
  transform:translateX(-50%);
  width:145px;height:150px;
  border-radius:70px 70px 26px 26px;
  background:#222f3a;border:7px solid #12181d;
}
.about-portrait .portrait-gun{
  position:absolute;left:48%;top:56%;
  width:138px;height:28px;border-radius:16px;
  background:linear-gradient(90deg,#f07a22,#ffae2c 55%,#2a6c91 56%);
  transform:rotate(-10deg);
  box-shadow:0 0 0 4px #17242d inset;
}
.about-contact-card{
  background:#1b1b1b;
  border:1px solid #2c2c2c;
  padding:23px 24px;
}
.about-contact-card h3{
  margin:0 0 14px;
  color:#ff9c16;
  text-transform:uppercase;
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:19px;
  letter-spacing:.02em;
}
.about-contact-card p,
.about-contact-card a{
  color:#8e8984;
  font-size:10px;
  line-height:1.6;
  margin:0 0 10px;
}
.about-contact-card strong{
  color:#efede8;
  font-size:10px;
}
.about-contact-card a{
  color:#f06b22;
}
.about-contact-card .muted-block{
  margin-top:12px;
}
@media(max-width:800px){
  .about-layout{grid-template-columns:1fr}
  .about-side{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .about-reference{padding:36px 0 44px}
  .about-reference .wrap{width:min(100% - 28px,1080px)}
  .about-main h1{font-size:32px}
  .about-landscape{height:230px}
  .about-side{grid-template-columns:1fr}
  .about-portrait{height:300px}
}


/* ===== Games page: matched to supplied reference screenshot ===== */
.games-hero{
  min-height:360px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:
    linear-gradient(rgba(6,7,7,.72),rgba(6,7,7,.86)),
    radial-gradient(circle at 50% 25%,rgba(50,85,105,.25),transparent 30%),
    linear-gradient(135deg,#1b1f20,#111 60%,#14100d);
  border-bottom:1px solid #292929;
}
.games-hero-inner{padding:46px 0 50px}
.game-icon-card{
  width:74px;height:74px;margin:0 auto 12px;
  border:2px solid #a84f1b;border-radius:4px;
  background:
    radial-gradient(circle at 50% 33%,rgba(38,110,151,.55),transparent 30%),
    linear-gradient(145deg,#29475b,#142129);
  position:relative;
}
.game-icon-card:before{
  content:"T";position:absolute;inset:0;display:grid;place-items:center;
  color:#ff8c23;font-weight:900;font-size:31px;
}
.games-hero h1{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:42px;line-height:1;margin:0 0 12px;text-transform:uppercase;
}
.games-hero p{font-size:12px;color:#9d9791;margin:0 0 18px}
.game-page{
  background:#0d0d0d;
  padding:38px 0 58px;
}
.game-page-grid{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  gap:38px;
  align-items:start;
}
.game-side{
  position:sticky;
  top:78px;
  padding-top:2px;
}
.game-side .eyebrow{font-size:9px;margin-bottom:10px}
.game-side a{
  display:block;
  padding:10px 0;
  border-bottom:1px solid #2c2c2c;
  font-size:9px;
  color:#77716d;
}
.game-side a:hover{color:#fff}
.game-main h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:25px;
  line-height:1;
  text-transform:uppercase;
  margin:0 0 8px;
}
.game-main p{font-size:10px;color:#8b8580;line-height:1.65;margin:0 0 18px}
.game-preview{
  height:390px;
  border:1px solid #303030;
  background:
    linear-gradient(rgba(22,32,36,.15),rgba(8,8,8,.4)),
    linear-gradient(145deg,#283740,#171a1b 60%,#111);
  position:relative;overflow:hidden;margin:16px 0 30px;
}
.game-preview:before{
  content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
  linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:36px 36px;
}
.game-preview .city{position:absolute;background:#1b1f21;border:1px solid #2b3033}
.game-preview .c1{left:0;bottom:0;width:27%;height:78%}
.game-preview .c2{left:29%;bottom:0;width:30%;height:50%}
.game-preview .c3{right:0;bottom:0;width:36%;height:64%}
.game-preview .player-tank{
  position:absolute;left:48%;bottom:92px;width:58px;height:38px;border-radius:7px;
  background:#708a48;border:4px solid #adc978;
}
.game-preview .player-tank:after{content:"";position:absolute;left:37px;top:13px;width:48px;height:7px;background:#adc978}
.game-preview .enemy-mark{
  position:absolute;right:23%;top:27%;width:34px;height:34px;border-radius:50%;
  background:#cc4936;box-shadow:0 0 18px 8px rgba(204,73,54,.25);
}
.features-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0 32px}
.feature-box{
  background:#1a1a1a;border:1px solid #303030;border-top:2px solid #d24e32;padding:19px;
}
.feature-box h3{font-size:10px;color:#f3b21a;text-transform:uppercase;margin:0 0 9px}
.feature-box p{font-size:9px;color:#817b77;margin:0;line-height:1.6}
.game-screens{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:32px}
.game-screen{
  height:125px;background:#191919;border:1px solid #313131;position:relative;overflow:hidden;
}
.game-screen:before{content:"";position:absolute;inset:0;background:
linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);background-size:22px 22px}
.game-screen .mini-tank{position:absolute;left:26px;bottom:24px;width:42px;height:28px;background:#71844c;border:3px solid #a9c579;border-radius:6px}
.game-screen .mini-tank:after{content:"";position:absolute;left:28px;top:9px;width:34px;height:6px;background:#a9c579}
.game-screen .boom{position:absolute;right:20px;top:18px;width:24px;height:24px;border-radius:50%;background:#d54835;box-shadow:0 0 14px 5px rgba(213,72,53,.25)}
.faq{display:grid;gap:7px;margin-bottom:30px}
.faq details{background:#1a1a1a;border:1px solid #2c2c2c;padding:10px 12px}
.faq summary{font-size:9px;font-weight:700;cursor:pointer}
.faq p{margin:8px 0 0;font-size:9px}
.download-box{
  border:1px solid #303030;background:#151515;text-align:center;padding:30px 20px;
}
.download-box h3{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:23px;text-transform:uppercase;margin:0 0 14px;
}

/* ===== Contact page: matched to supplied reference screenshot ===== */
.contact-hero{
  text-align:center;
  padding:52px 0 40px;
  background:#111;
  border-bottom:1px solid #252525;
}
.contact-hero .eyebrow{margin-bottom:8px}
.contact-hero h1{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:38px;
  line-height:1;
  margin:0 0 10px;
}
.contact-hero p{font-size:10px;color:#827d78;margin:0}
.contact-main{
  background:#0d0d0d;
  padding:46px 0 60px;
}
.contact-columns{
  display:grid;
  grid-template-columns:.85fr 1.25fr .85fr;
  gap:34px;
  align-items:start;
}
.contact-col h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:19px;
  margin:0 0 16px;
}
.contact-list{display:grid;gap:18px}
.contact-item{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start}
.contact-item .ico{color:var(--accent);font-size:13px;font-weight:900}
.contact-item strong{display:block;font-size:9px;text-transform:uppercase;margin-bottom:3px}
.contact-item span,.contact-item a{display:block;font-size:9px;color:#85807b}
.contact-item a{color:#f06c22}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px}
.contact-form label{display:grid;gap:5px;font-size:8px;color:#b3ada8}
.contact-form .full{grid-column:1/-1}
.contact-form input,.contact-form textarea{
  width:100%;
  background:#171717;
  border:1px solid #303030;
  color:#fff;
  padding:10px 11px;
  font-size:10px;
}
.contact-form textarea{min-height:110px;resize:vertical}
.contact-form button{grid-column:1/-1}
.form-note{
  grid-column:1/-1;
  min-height:16px;
  font-size:8px;
  color:#77716c;
}
.social-buttons{display:flex;gap:10px;margin:10px 0 20px}
.social-btn{
  width:31px;height:31px;border-radius:50%;display:grid;place-items:center;
  background:#1b1b1b;border:1px solid #303030;color:#9d9792;font-size:11px;
}
.contact-side-box{
  background:#191919;border:1px solid #2b2b2b;padding:14px;
}
.contact-side-box strong{display:block;font-size:9px;text-transform:uppercase;margin-bottom:6px}
.contact-side-box p{font-size:9px;color:#7f7974;margin:0;line-height:1.55}

@media(max-width:800px){
  .game-page-grid{grid-template-columns:1fr}
  .game-side{position:static;display:flex;gap:14px;flex-wrap:wrap}
  .game-side .eyebrow{width:100%}
  .game-side a{border:0;padding:0}
  .features-3,.game-screens{grid-template-columns:1fr}
  .contact-columns{grid-template-columns:1fr 1fr}
  .contact-columns .contact-col:nth-child(2){grid-column:1/-1}
}
@media(max-width:620px){
  .games-hero h1{font-size:34px}
  .game-preview{height:260px}
  .contact-columns{grid-template-columns:1fr}
  .contact-columns .contact-col:nth-child(2){grid-column:auto}
  .contact-form{grid-template-columns:1fr}
  .contact-form .full,.contact-form button,.form-note{grid-column:auto}
}


/* ===== Store page: matched to supplied reference screenshot ===== */
.store-page{
  background:#0d0d0d;
  padding:44px 0 58px;
}
.store-head{
  margin-bottom:18px;
}
.store-head .eyebrow{
  margin-bottom:7px;
}
.store-head h1{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:35px;
  line-height:1;
  margin:0 0 5px;
}
.store-head p{
  margin:0;
  color:#7f7974;
  font-size:10px;
}
.store-info{
  border-left:3px solid #ffb31a;
  background:#1a1a1a;
  padding:14px 16px;
  color:#817b76;
  font-size:9px;
  line-height:1.6;
  margin:18px 0 18px;
}
.store-section-title{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:10px;
  text-transform:uppercase;
  font-weight:800;
  margin:0 0 8px;
}
.store-section-title .ico{color:#ffb31a}
.coin-picker{
  border:1px solid #2b2b2b;
  background:#151515;
  padding:12px 12px 8px;
  position:relative;
  margin-bottom:20px;
}
.coin-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
  max-height:255px;
  overflow-y:auto;
  padding-right:4px;
  scrollbar-color:#ff681c #141414;
  scrollbar-width:thin;
}
.coin-grid::-webkit-scrollbar{width:8px}
.coin-grid::-webkit-scrollbar-track{background:#141414}
.coin-grid::-webkit-scrollbar-thumb{background:#ff681c;border-radius:6px}
.coin-package{
  appearance:none;
  border:1px solid #303030;
  background:#1c1c1c;
  color:#fff;
  min-height:130px;
  padding:15px 8px 12px;
  cursor:pointer;
  text-align:center;
  position:relative;
  border-radius:3px;
}
.coin-package:hover{border-color:#555}
.coin-package.selected{
  border:2px solid #ff681c;
  box-shadow:0 0 0 1px rgba(255,104,28,.16) inset;
}
.coin-package .check{
  display:none;
  position:absolute;
  right:8px;
  top:7px;
  width:18px;height:18px;border-radius:50%;
  background:#ff681c;
  color:#fff;
  font-size:11px;
  place-items:center;
  font-weight:900;
}
.coin-package.selected .check{display:grid}
.coin-art{
  width:44px;height:44px;border-radius:50%;
  margin:0 auto 10px;
  display:grid;place-items:center;
  background:
    radial-gradient(circle at 38% 32%,#ffe76b 0 18%,#ffc51d 19% 48%,#e99905 49% 65%,#ffcf27 66% 100%);
  border:4px double #8e620d;
  color:#fff4b0;
  font-weight:900;
  box-shadow:0 2px 6px rgba(0,0,0,.3);
}
.coin-package strong{
  display:block;
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:13px;
  text-transform:uppercase;
  margin-bottom:5px;
}
.coin-package .pkg-price{
  color:#ffd31d;
  font-weight:900;
  font-size:13px;
}
.checkout-box{
  border:1px solid #2d2d2d;
  background:#161616;
  padding:24px;
}
.checkout-box h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:19px;
  margin:0 0 22px;
}
.checkout-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 20px;
}
.checkout-form label{
  display:grid;
  gap:5px;
  font-size:8px;
  color:#d2cec9;
}
.checkout-form input{
  min-height:36px;
  background:#0f0f0f;
  border:1px solid #2b2b2b;
  color:#fff;
  padding:8px 10px;
  font-size:9px;
}
.pay-methods{
  grid-column:1/-1;
}
.pay-methods-title{
  display:block;
  font-size:8px;
  color:#d2cec9;
  margin-bottom:7px;
}
.method-row{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
}
.pay-method{
  min-height:34px;
  padding:7px 12px;
  background:#101010;
  color:#ddd;
  border:1px solid #333;
  border-radius:3px;
  font-size:9px;
  cursor:pointer;
}
.pay-method.selected{
  border-color:#ff681c;
  box-shadow:0 0 0 1px #ff681c inset;
}
.agree-row{
  grid-column:1/-1;
  display:flex;
  align-items:flex-start;
  gap:7px;
  font-size:8px;
  color:#8b8580;
}
.agree-row input{margin-top:1px}
.agree-row a{
  color:#ff6d22;
}
.order-summary{
  grid-column:1/-1;
  border:1px solid #2d2d2d;
  background:#0f0f0f;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:13px 14px;
  min-height:60px;
}
.order-summary small{
  display:block;
  color:#77716d;
  font-size:8px;
  margin-bottom:4px;
}
.order-summary strong{
  font-size:10px;
}
.order-total{
  text-align:right;
}
.order-total b{
  display:block;
  color:#ffd31d;
  font-size:16px;
}
.confirm-btn{
  grid-column:1/-1;
  width:100%;
  min-height:42px;
  border:0;
  background:#ff681c;
  color:#fff;
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  letter-spacing:.02em;
  text-transform:uppercase;
  cursor:pointer;
}
.confirm-btn:hover{background:#ff7d37}
.checkout-message{
  grid-column:1/-1;
  min-height:15px;
  font-size:8px;
  color:#817b76;
}
.demo-modal{
  position:fixed;
  inset:0;
  z-index:120;
  background:rgba(0,0,0,.72);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.demo-modal[hidden]{display:none}
.demo-card{
  width:min(440px,100%);
  background:#171717;
  border:1px solid #343434;
  padding:24px;
}
.demo-card h3{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:22px;
  text-transform:uppercase;
  margin:0 0 8px;
}
.demo-card p{font-size:9px;color:#85807b}
.demo-list{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:7px 14px;
  margin:16px 0 20px;
  font-size:9px;
}
.demo-list dt{font-weight:700}
.demo-list dd{margin:0;color:#8f8984}
@media(max-width:800px){
  .coin-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:620px){
  .coin-grid{grid-template-columns:repeat(2,1fr)}
  .checkout-form{grid-template-columns:1fr}
  .pay-methods,.agree-row,.order-summary,.confirm-btn,.checkout-message{grid-column:auto}
}


/* ===== V5 homepage enrichment ===== */
.home-stats{
  background:#111;
  border-top:1px solid #262626;
  border-bottom:1px solid #262626;
}
.home-stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}
.home-stat{
  padding:22px 18px;
  text-align:center;
  border-right:1px solid #292929;
}
.home-stat:last-child{border-right:0}
.home-stat b{
  display:block;
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:28px;
  color:#ff9a23;
  letter-spacing:.02em;
}
.home-stat span{
  display:block;
  margin-top:4px;
  color:#7e7872;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.11em;
}

.home-feature-section{
  padding:48px 0 54px;
  background:#111;
  border-bottom:1px solid #252525;
}
.home-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:22px;
}
.home-heading h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:29px;
  line-height:1;
  text-transform:uppercase;
  margin:0;
}
.home-heading p{
  max-width:460px;
  margin:0;
  color:#7f7974;
  font-size:10px;
  line-height:1.6;
}
.home-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.home-feature-card{
  background:#191919;
  border:1px solid #2c2c2c;
  padding:22px;
  min-height:170px;
  position:relative;
  overflow:hidden;
}
.home-feature-card:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:linear-gradient(#ff6b18,#ffb31a);
}
.home-feature-card .icon{
  width:38px;height:38px;
  border:1px solid #3a3a3a;
  display:grid;
  place-items:center;
  color:#ff8d21;
  font-weight:900;
  margin-bottom:15px;
  background:#121212;
}
.home-feature-card h3{
  margin:0 0 8px;
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:17px;
}
.home-feature-card p{
  margin:0;
  color:#7f7974;
  font-size:9px;
  line-height:1.65;
}

.home-roadmap{
  padding:48px 0 54px;
  background:#0d0d0d;
  border-bottom:1px solid #252525;
}
.roadmap-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.roadmap-card{
  background:#161616;
  border:1px solid #2a2a2a;
  padding:20px;
}
.roadmap-card .status{
  display:inline-block;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#111;
  background:#ff9c22;
  padding:4px 7px;
  margin-bottom:11px;
  font-weight:900;
}
.roadmap-card .status.progress{background:#ffc941}
.roadmap-card .status.planned{background:#7b7b7b;color:#eee}
.roadmap-card h3{
  font-size:14px;
  text-transform:uppercase;
  margin:0 0 7px;
}
.roadmap-card p{
  margin:0;
  color:#7d7772;
  font-size:9px;
  line-height:1.6;
}

.home-gameplay{
  padding:50px 0 56px;
  background:#121212;
  border-bottom:1px solid #252525;
}
.gameplay-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:28px;
  align-items:center;
}
.gameplay-visual{
  height:300px;
  border:1px solid #303030;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(22,34,37,.12),rgba(6,6,6,.42)),
    linear-gradient(145deg,#293b42,#161819 60%,#111);
}
.gameplay-visual:before{
  content:"";
  position:absolute;inset:0;
  background:
  linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
  linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:28px 28px;
}
.gameplay-visual .building{
  position:absolute;
  bottom:0;
  background:#1d2224;
  border:1px solid #2e3437;
}
.gameplay-visual .b1{left:0;width:28%;height:70%}
.gameplay-visual .b2{left:31%;width:24%;height:50%}
.gameplay-visual .b3{right:0;width:36%;height:60%}
.gameplay-visual .tank-mini{
  position:absolute;
  left:47%;bottom:74px;
  width:52px;height:34px;
  border-radius:6px;
  background:#6c8147;
  border:4px solid #a9c777;
}
.gameplay-visual .tank-mini:after{
  content:"";
  position:absolute;
  left:33px;top:11px;
  width:45px;height:7px;
  background:#a9c777;
}
.gameplay-visual .enemy-dot{
  position:absolute;
  right:20%;top:25%;
  width:28px;height:28px;
  border-radius:50%;
  background:#d14935;
  box-shadow:0 0 18px 7px rgba(209,73,53,.25);
}
.gameplay-copy h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:28px;
  text-transform:uppercase;
  line-height:1;
  margin:0 0 12px;
}
.gameplay-copy p{
  font-size:10px;
  color:#837d78;
  line-height:1.7;
  margin:0 0 14px;
}
.gameplay-list{
  display:grid;
  gap:8px;
  margin:14px 0 18px;
}
.gameplay-point{
  display:grid;
  grid-template-columns:23px 1fr;
  gap:8px;
  align-items:start;
}
.gameplay-point .n{
  color:#ff7c1d;
  font-weight:900;
  font-size:10px;
}
.gameplay-point b{
  display:block;
  font-size:9px;
  text-transform:uppercase;
  margin-bottom:2px;
}
.gameplay-point span{
  display:block;
  color:#77716c;
  font-size:8px;
}

.home-faq{
  padding:48px 0 55px;
  background:#0d0d0d;
  border-bottom:1px solid #252525;
}
.home-faq-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:36px;
  align-items:start;
}
.home-faq-copy h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:28px;
  line-height:1;
  margin:0 0 10px;
}
.home-faq-copy p{
  margin:0;
  color:#7e7872;
  font-size:9px;
  line-height:1.65;
}
.home-faq-list{
  display:grid;
  gap:7px;
}
.home-faq-list details{
  background:#181818;
  border:1px solid #2b2b2b;
  padding:10px 12px;
}
.home-faq-list summary{
  cursor:pointer;
  font-size:9px;
  font-weight:800;
}
.home-faq-list p{
  color:#7f7974;
  font-size:9px;
  margin:8px 0 0;
  line-height:1.6;
}

.home-cta{
  background:
    linear-gradient(90deg,rgba(59,22,6,.86),rgba(20,20,20,.95)),
    #171717;
  padding:38px 0;
  border-bottom:1px solid #262626;
}
.home-cta-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.home-cta h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  text-transform:uppercase;
  font-size:27px;
  line-height:1;
  margin:0 0 7px;
}
.home-cta p{
  margin:0;
  color:#978f88;
  font-size:9px;
}
.home-cta-actions{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
}

@media(max-width:800px){
  .home-stats-grid{grid-template-columns:repeat(2,1fr)}
  .home-stat:nth-child(2){border-right:0}
  .home-stat:nth-child(-n+2){border-bottom:1px solid #292929}
  .home-feature-grid,.roadmap-grid{grid-template-columns:1fr}
  .gameplay-grid,.home-faq-grid{grid-template-columns:1fr}
  .home-heading{align-items:flex-start;flex-direction:column}
  .home-cta-inner{align-items:flex-start;flex-direction:column}
}


/* ===== V6 richer in-game screenshot scenes ===== */
.rich-shot-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.rich-shot{
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  border:1px solid #323232;
  background:#171717;
}
.rich-shot:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:24px 24px;
  opacity:.5;
}
.rich-shot .hud-top{
  position:absolute;
  left:8px;right:8px;top:7px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:7px;
  color:#d9d5cf;
  z-index:4;
}
.rich-shot .hud-chip{
  background:rgba(8,8,8,.76);
  border:1px solid rgba(255,255,255,.12);
  padding:3px 5px;
  border-radius:2px;
}
.rich-shot .hpbar{
  position:absolute;
  left:9px;top:25px;
  width:68px;height:6px;
  background:#2b2b2b;
  border:1px solid #444;
  z-index:4;
}
.rich-shot .hpbar span{
  display:block;height:100%;
  background:linear-gradient(90deg,#9cc55f,#d7df6f);
}
.rich-shot .mission{
  position:absolute;
  right:9px;top:25px;
  z-index:4;
  font-size:7px;
  color:#ff7546;
  font-weight:800;
}
.rich-shot .ground{
  position:absolute;
  left:0;right:0;bottom:0;
  height:50%;
  background:linear-gradient(#202523,#111);
}
.rich-shot .building{
  position:absolute;
  bottom:30%;
  background:#1f2426;
  border:1px solid #31383a;
}
.rich-shot .building:after{
  content:"";
  position:absolute;inset:8px;
  background:
    linear-gradient(90deg,transparent 0 22%,#30383b 22% 35%,transparent 35% 62%,#30383b 62% 75%,transparent 75%);
  opacity:.75;
}
.rich-shot .b-a{left:0;width:24%;height:50%}
.rich-shot .b-b{left:29%;width:22%;height:37%}
.rich-shot .b-c{right:0;width:31%;height:46%}
.rich-shot .tank-unit{
  position:absolute;
  width:46px;height:29px;
  background:#748749;
  border:3px solid #aec97a;
  border-radius:6px;
  z-index:5;
}
.rich-shot .tank-unit:before{
  content:"";
  position:absolute;
  width:22px;height:16px;
  border-radius:50%;
  background:#93ad5d;
  left:12px;top:4px;
}
.rich-shot .tank-unit:after{
  content:"";
  position:absolute;
  left:29px;top:9px;
  width:34px;height:6px;
  background:#aec97a;
}
.rich-shot .enemy-unit{
  position:absolute;
  width:40px;height:26px;
  border-radius:6px;
  background:#683c34;
  border:3px solid #c56a5c;
  z-index:5;
}
.rich-shot .enemy-unit:after{
  content:"";
  position:absolute;
  left:24px;top:8px;
  width:28px;height:5px;
  background:#d97668;
}
.rich-shot .armored{
  background:#7f562f;
  border-color:#f1a344;
}
.rich-shot .armored:after{background:#ffbd67}
.rich-shot .blast-ring{
  position:absolute;
  width:34px;height:34px;
  border-radius:50%;
  border:6px double #ff7a33;
  box-shadow:0 0 18px 7px rgba(255,105,35,.25);
  z-index:3;
}
.rich-shot .coin-drop{
  position:absolute;
  width:16px;height:16px;
  border-radius:50%;
  background:#ffce2c;
  border:3px double #8a5b0d;
  z-index:5;
  box-shadow:0 0 10px rgba(255,206,44,.28);
}
.rich-shot .crosshair{
  position:absolute;
  width:28px;height:28px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:50%;
  z-index:6;
}
.rich-shot .crosshair:before,
.rich-shot .crosshair:after{
  content:"";position:absolute;background:rgba(255,255,255,.55)
}
.rich-shot .crosshair:before{width:38px;height:1px;left:-6px;top:13px}
.rich-shot .crosshair:after{height:38px;width:1px;left:13px;top:-6px}
.rich-shot .mobile-pad{
  position:absolute;
  left:8px;bottom:8px;
  width:58px;height:58px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(10,10,10,.46);
  z-index:6;
}
.rich-shot .mobile-fire{
  position:absolute;
  right:10px;bottom:12px;
  width:42px;height:42px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,106,24,.36);
  color:#fff;
  font-size:7px;
  display:grid;
  place-items:center;
  z-index:6;
}
.rich-shot .menu-panel{
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  width:56%;
  min-height:48%;
  background:rgba(14,14,14,.92);
  border:1px solid #393939;
  z-index:8;
  padding:10px;
}
.rich-shot .menu-panel h4{
  margin:0 0 8px;
  font-size:9px;
  color:#ff8f20;
  text-transform:uppercase;
}
.rich-shot .menu-row{
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:7px;
  color:#aaa39d;
  border-top:1px solid #2a2a2a;
  padding:6px 0;
}
.rich-shot .boss-label{
  position:absolute;
  left:50%;top:34px;
  transform:translateX(-50%);
  color:#ff7a40;
  font-size:7px;
  font-weight:900;
  text-transform:uppercase;
  z-index:7;
}
.rich-shot .bossbar{
  position:absolute;
  left:22%;right:22%;top:47px;
  height:7px;
  background:#2a2a2a;
  border:1px solid #4a4a4a;
  z-index:7;
}
.rich-shot .bossbar span{
  display:block;height:100%;width:72%;
  background:linear-gradient(90deg,#c43d31,#ff7339);
}
.rich-shot.scene-night{
  background:linear-gradient(180deg,#142332,#111 68%);
}
.rich-shot.scene-night .ground{
  background:linear-gradient(#1a2227,#0e1113);
}
.rich-shot.scene-dust{
  background:
    radial-gradient(circle at 70% 30%,rgba(205,122,48,.16),transparent 28%),
    linear-gradient(180deg,#2a241c,#121212 68%);
}
.rich-shot.scene-dust .ground{
  background:linear-gradient(#33291e,#14100d);
}
.rich-shot.scene-red{
  background:
    radial-gradient(circle at 48% 48%,rgba(157,45,34,.18),transparent 30%),
    linear-gradient(180deg,#2b1a18,#101010 68%);
}
.rich-shot .caption{
  position:absolute;
  left:8px;bottom:7px;
  z-index:9;
  font-size:7px;
  color:#ddd7cf;
  background:rgba(0,0,0,.58);
  border-left:2px solid #ff6a18;
  padding:3px 5px;
  text-transform:uppercase;
}
@media(max-width:800px){
  .rich-shot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .rich-shot-grid{grid-template-columns:1fr}
}


/* ===== V7 richer backgrounds ===== */

/* Global page atmosphere */
body{
  background:
    radial-gradient(circle at 15% 0%, rgba(255,110,27,.08), transparent 23%),
    radial-gradient(circle at 85% 12%, rgba(255,179,26,.05), transparent 22%),
    linear-gradient(180deg,#0a0a0a,#111 34%,#0d0d0d 100%);
}

/* Hero background layering */
.hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 16% 26%, rgba(255,110,27,.16), transparent 21%),
    radial-gradient(circle at 82% 18%, rgba(255,179,26,.10), transparent 20%),
    linear-gradient(90deg,rgba(25,8,3,.98),rgba(14,15,15,.88)),
    #111 !important;
}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px);
  background-size:42px 42px;
  opacity:.28;
  pointer-events:none;
}
.hero:after{
  content:"";
  position:absolute;
  inset:auto -4% -28px auto;
  width:44%;
  height:58%;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,106,24,.15), transparent 58%),
    radial-gradient(circle at 30% 40%, rgba(255,193,74,.10), transparent 52%);
  filter:blur(8px);
  pointer-events:none;
}

/* Poster atmosphere */
.hero-poster,
.poster{
  background:
    radial-gradient(circle at 72% 24%, rgba(255,122,34,.16), transparent 18%),
    radial-gradient(circle at 34% 72%, rgba(103,180,226,.12), transparent 25%),
    linear-gradient(145deg,#29475f,#17232a 55%,#20201f) !important;
}
.hero-poster:after,
.poster:after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:42%;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.32));
  pointer-events:none;
}

/* Section background upgrades */
.release,
.home-feature-section,
.home-roadmap,
.home-gameplay,
.gallery,
.home-faq,
.home-cta{
  position:relative;
  overflow:hidden;
}
.release{
  background:
    radial-gradient(circle at 18% 28%, rgba(255,132,34,.07), transparent 18%),
    linear-gradient(180deg,#141414,#101010);
}
.home-feature-section{
  background:
    radial-gradient(circle at 90% 18%, rgba(255,110,27,.06), transparent 20%),
    linear-gradient(180deg,#111,#0f0f0f) !important;
}
.home-roadmap{
  background:
    radial-gradient(circle at 12% 8%, rgba(255,179,26,.05), transparent 18%),
    linear-gradient(180deg,#0d0d0d,#101010) !important;
}
.home-gameplay{
  background:
    radial-gradient(circle at 84% 14%, rgba(255,110,27,.06), transparent 21%),
    linear-gradient(180deg,#121212,#0f0f0f) !important;
}
.gallery{
  background:
    radial-gradient(circle at 22% 14%, rgba(255,110,27,.05), transparent 18%),
    linear-gradient(180deg,#0f0f0f,#121212) !important;
}
.home-faq{
  background:
    radial-gradient(circle at 88% 12%, rgba(255,179,26,.04), transparent 18%),
    linear-gradient(180deg,#0d0d0d,#111) !important;
}
.home-cta{
  background:
    radial-gradient(circle at 84% 50%, rgba(255,179,26,.08), transparent 20%),
    linear-gradient(90deg,rgba(59,22,6,.90),rgba(20,20,20,.98)),
    #171717 !important;
}
.release:before,
.home-feature-section:before,
.home-roadmap:before,
.home-gameplay:before,
.gallery:before,
.home-faq:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px);
  background-size:52px 52px;
  opacity:.25;
  pointer-events:none;
}

/* Gameplay visual area enriched */
.gameplay-visual{
  background:
    radial-gradient(circle at 74% 20%, rgba(255,123,34,.12), transparent 22%),
    radial-gradient(circle at 26% 72%, rgba(112,180,214,.10), transparent 24%),
    linear-gradient(180deg,rgba(22,34,37,.12),rgba(6,6,6,.42)),
    linear-gradient(145deg,#293b42,#161819 60%,#111) !important;
}
.gameplay-visual:after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:34%;
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.36)),
    repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 8px,transparent 8px 16px);
  opacity:.28;
  pointer-events:none;
}

/* Cards get subtle background glow */
.home-feature-card,
.roadmap-card,
.home-faq-list details,
.feature-row,
.frow{
  background-image:
    radial-gradient(circle at top right, rgba(255,110,27,.05), transparent 28%);
}

/* Rich screenshot scenes: layered backgrounds and terrain */
.rich-shot{
  background:
    radial-gradient(circle at 75% 18%, rgba(255,121,39,.08), transparent 18%),
    linear-gradient(180deg,#202020,#151515) !important;
}
.rich-shot:after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:44%;
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.30)),
    repeating-linear-gradient(140deg,rgba(255,255,255,.018) 0 9px,transparent 9px 18px);
  opacity:.55;
  pointer-events:none;
}
.rich-shot .ground{
  background:
    radial-gradient(circle at 22% 30%, rgba(255,255,255,.03), transparent 20%),
    radial-gradient(circle at 68% 58%, rgba(255,255,255,.02), transparent 18%),
    linear-gradient(#202523,#111) !important;
}
.rich-shot.scene-night{
  background:
    radial-gradient(circle at 78% 16%, rgba(72,144,214,.18), transparent 18%),
    radial-gradient(circle at 16% 26%, rgba(255,110,27,.08), transparent 14%),
    linear-gradient(180deg,#142332,#111 68%) !important;
}
.rich-shot.scene-night .ground{
  background:
    radial-gradient(circle at 62% 40%, rgba(74,110,144,.08), transparent 18%),
    linear-gradient(#1a2227,#0e1113) !important;
}
.rich-shot.scene-dust{
  background:
    radial-gradient(circle at 70% 30%, rgba(205,122,48,.20), transparent 28%),
    radial-gradient(circle at 20% 16%, rgba(255,196,120,.10), transparent 18%),
    linear-gradient(180deg,#2a241c,#121212 68%) !important;
}
.rich-shot.scene-dust .ground{
  background:
    radial-gradient(circle at 30% 50%, rgba(255,220,140,.06), transparent 16%),
    linear-gradient(#33291e,#14100d) !important;
}
.rich-shot.scene-red{
  background:
    radial-gradient(circle at 48% 48%, rgba(157,45,34,.22), transparent 30%),
    radial-gradient(circle at 82% 18%, rgba(255,153,74,.08), transparent 20%),
    linear-gradient(180deg,#2b1a18,#101010 68%) !important;
}
.rich-shot.scene-red .ground{
  background:
    radial-gradient(circle at 55% 48%, rgba(204,86,52,.08), transparent 16%),
    linear-gradient(#251715,#0f0d0d) !important;
}

/* Decorative stars / sparks */
.rich-shot .hud-top:after{
  content:"";
  position:absolute;
  right:8px;
  top:14px;
  width:44px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  opacity:.55;
}
.rich-shot .blast-ring{
  background:
    radial-gradient(circle at center, rgba(255,182,112,.18), transparent 52%);
}
.rich-shot .coin-drop{
  background:
    radial-gradient(circle at 38% 32%,#ffe76b 0 18%,#ffc51d 19% 48%,#e99905 49% 65%,#ffcf27 66% 100%) !important;
}

/* Gallery zone richer frame */
.rich-shot-grid{
  position:relative;
}
.rich-shot-grid:before{
  content:"";
  position:absolute;
  inset:-10px -10px -10px -10px;
  border:1px solid rgba(255,255,255,.04);
  pointer-events:none;
}


/* ===== V8 cinematic official-game-site homepage ===== */
.game-site-home{
  background:#07090b;
  color:#f5f7f8;
}
.v8-header{
  position:absolute;
  z-index:80;
  top:3px;
  left:0;right:0;
  background:linear-gradient(180deg,rgba(4,6,8,.92),rgba(4,6,8,.50),transparent);
  border-bottom:0;
}
.v8-header .header-inner{
  width:min(1180px,calc(100% - 36px));
  height:78px;
  margin:auto;
}
.v8-header .logo{
  font-size:13px;
}
.v8-header .nav{
  gap:24px;
  font-size:10px;
}
.v8-header .nav a{
  padding:28px 0 20px;
  color:#d8dadd;
  text-shadow:0 1px 6px #000;
}
.v8-header .nav a.active{
  color:#fff;
  border-bottom-color:#ff7b26;
}
.v8-play-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:8px 16px!important;
  border:1px solid #ff9340!important;
  background:linear-gradient(180deg,#ff973d,#e95e13)!important;
  color:white!important;
  font-weight:900!important;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-radius:2px!important;
  box-shadow:0 8px 20px rgba(223,84,15,.22);
}
.v8-hero{
  position:relative;
  min-height:720px;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(4,7,9,.96) 0%,rgba(4,7,9,.72) 40%,rgba(4,7,9,.25) 66%,rgba(4,7,9,.52) 100%),
    radial-gradient(circle at 72% 34%,rgba(255,111,31,.20),transparent 18%),
    radial-gradient(circle at 62% 44%,rgba(92,136,162,.18),transparent 26%),
    linear-gradient(135deg,#121a20 0%,#202b2f 42%,#141619 100%);
  border-bottom:1px solid #1f252a;
}
.v8-hero:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.58)),
    repeating-linear-gradient(90deg,rgba(255,255,255,.015) 0 1px,transparent 1px 74px);
  pointer-events:none;
}
.v8-hero:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:190px;
  background:linear-gradient(transparent,#07090b 90%);
  pointer-events:none;
}
.v8-hero .wrap{
  position:relative;
  z-index:4;
  width:min(1180px,calc(100% - 36px));
}
.v8-hero-copy{
  max-width:600px;
  padding-top:60px;
}
.v8-kicker{
  display:flex;
  align-items:center;
  gap:9px;
  color:#ff8b36;
  font-size:11px;
  font-weight:900;
  letter-spacing:.21em;
  text-transform:uppercase;
  margin-bottom:14px;
}
.v8-kicker:before{
  content:"";
  width:34px;height:2px;
  background:#ff7b26;
}
.v8-title{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:clamp(64px,8vw,118px);
  line-height:.84;
  text-transform:uppercase;
  letter-spacing:-.025em;
  margin:0;
  text-shadow:0 5px 20px rgba(0,0,0,.55);
}
.v8-title span{
  display:block;
  color:#ff7b26;
}
.v8-hero-copy p{
  max-width:560px;
  font-size:14px;
  line-height:1.72;
  color:#c0c5c8;
  text-shadow:0 2px 8px #000;
  margin:22px 0 24px;
}
.v8-actions{
  display:flex;
  gap:11px;
  flex-wrap:wrap;
}
.v8-primary,
.v8-secondary{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 22px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:11px;
  font-weight:900;
  border-radius:2px;
}
.v8-primary{
  background:linear-gradient(180deg,#ff9539,#e75d14);
  border:1px solid #ff9a46;
  color:#fff;
  box-shadow:0 10px 28px rgba(213,74,11,.24);
}
.v8-secondary{
  background:rgba(9,12,14,.72);
  border:1px solid rgba(255,255,255,.24);
  color:#fff;
  backdrop-filter:blur(4px);
}
.v8-secondary:hover{border-color:#ff8a34;color:#ff9a45}
.v8-platforms{
  display:flex;
  gap:8px;
  margin-top:18px;
  flex-wrap:wrap;
}
.v8-platform{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(8,10,12,.58);
  color:#aeb3b7;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.09em;
  padding:6px 8px;
}
.v8-scene{
  position:absolute;
  right:2%;
  bottom:8%;
  width:min(54vw,760px);
  height:74%;
  z-index:2;
}
.v8-tank-main{
  position:absolute;
  right:12%;
  bottom:12%;
  width:360px;
  height:220px;
  transform:rotate(-6deg);
  filter:drop-shadow(0 30px 28px rgba(0,0,0,.5));
}
.v8-tank-main .track{
  position:absolute;
  left:28px;
  width:260px;height:52px;
  border-radius:26px;
  background:#121519;
  border:7px solid #384147;
}
.v8-tank-main .t1{top:18px}.v8-tank-main .t2{bottom:16px}
.v8-tank-main .body{
  position:absolute;
  left:64px;top:61px;
  width:220px;height:104px;
  border-radius:22px;
  background:linear-gradient(145deg,#586341,#303a2c);
  border:8px solid #7f8f5c;
  box-shadow:inset -20px -14px 0 rgba(0,0,0,.12);
}
.v8-tank-main .turret{
  position:absolute;
  left:139px;top:74px;
  width:94px;height:94px;
  border-radius:50%;
  background:linear-gradient(145deg,#71814e,#455133);
  border:7px solid #98a96d;
}
.v8-tank-main .gun{
  position:absolute;
  left:215px;top:110px;
  width:220px;height:18px;
  border-radius:8px;
  background:linear-gradient(90deg,#9cab71,#6b774f);
  box-shadow:0 4px 7px rgba(0,0,0,.3);
}
.v8-smoke{
  position:absolute;
  border-radius:50%;
  background:radial-gradient(circle,rgba(108,120,129,.20),rgba(50,58,64,.08) 45%,transparent 70%);
  filter:blur(3px);
}
.v8-smoke.s1{right:30%;top:16%;width:240px;height:210px}
.v8-smoke.s2{right:3%;top:28%;width:270px;height:240px}
.v8-fire{
  position:absolute;
  right:8%;
  bottom:24%;
  width:120px;height:120px;
  background:radial-gradient(circle,#ffd06f 0 9%,#ff7b21 10% 27%,rgba(201,57,19,.28) 28% 50%,transparent 65%);
  filter:blur(.5px);
}
.v8-debris{
  position:absolute;
  width:9px;height:9px;
  background:#7f7160;
  transform:rotate(45deg);
  opacity:.55;
}
.v8-debris.d1{right:32%;top:27%}.v8-debris.d2{right:18%;top:20%;width:6px;height:6px}.v8-debris.d3{right:7%;top:42%;width:12px;height:12px}
.v8-scroll{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:28px;
  transform:translateX(-50%);
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:#7f8588;
}
.v8-scroll:after{
  content:"";
  display:block;
  width:1px;height:24px;
  margin:7px auto 0;
  background:linear-gradient(#ff7a27,transparent);
}

.v8-intro{
  background:#07090b;
  padding:78px 0 82px;
  border-bottom:1px solid #1d2226;
}
.v8-section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:34px;
  margin-bottom:34px;
}
.v8-section-head h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:48px;
  line-height:.94;
  text-transform:uppercase;
  margin:0;
}
.v8-section-head h2 span{color:#ff7924}
.v8-section-head p{
  width:min(520px,100%);
  color:#8f979b;
  font-size:11px;
  line-height:1.7;
  margin:0;
}
.v8-feature-hero{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  min-height:430px;
  border:1px solid #242b30;
  background:#0d1012;
}
.v8-feature-visual{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 68% 42%,rgba(255,116,35,.13),transparent 18%),
    linear-gradient(150deg,#223039,#15191b 58%,#0b0e10);
}
.v8-feature-visual:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:42px 42px;
}
.v8-feature-visual .building{
  position:absolute;
  bottom:0;
  background:linear-gradient(#1c2428,#121719);
  border:1px solid #293238;
}
.v8-feature-visual .b1{left:0;width:22%;height:68%}
.v8-feature-visual .b2{left:25%;width:20%;height:42%}
.v8-feature-visual .b3{right:0;width:34%;height:59%}
.v8-feature-visual .tankunit{
  position:absolute;
  left:48%;bottom:16%;
  width:86px;height:52px;
  border-radius:9px;
  background:#667747;
  border:5px solid #9faf73;
}
.v8-feature-visual .tankunit:after{
  content:"";
  position:absolute;
  left:55px;top:17px;
  width:76px;height:10px;
  background:#aabe7e;
}
.v8-feature-visual .enemyunit{
  position:absolute;
  right:17%;bottom:28%;
  width:70px;height:44px;
  border-radius:8px;
  background:#713d34;
  border:5px solid #d36a59;
}
.v8-feature-visual .enemyunit:after{
  content:"";
  position:absolute;
  left:44px;top:14px;
  width:60px;height:9px;
  background:#dd7b6a;
}
.v8-feature-visual .blast{
  position:absolute;
  right:35%;top:33%;
  width:70px;height:70px;
  border-radius:50%;
  background:radial-gradient(circle,#ffd382 0 9%,#ff7b26 10% 28%,rgba(220,65,18,.28) 29% 50%,transparent 68%);
}
.v8-feature-copy{
  padding:42px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(145deg,#111517,#0b0d0f);
}
.v8-feature-copy .eyebrow{
  color:#ff7c28;
  font-size:9px;
  letter-spacing:.17em;
}
.v8-feature-copy h3{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:34px;
  line-height:.95;
  text-transform:uppercase;
  margin:7px 0 14px;
}
.v8-feature-copy p{
  color:#899196;
  font-size:10px;
  line-height:1.7;
  margin:0 0 18px;
}
.v8-feature-list{
  display:grid;
  gap:8px;
  margin-bottom:20px;
}
.v8-feature-item{
  display:grid;
  grid-template-columns:24px 1fr;
  gap:9px;
  padding:9px 0;
  border-top:1px solid #20262a;
}
.v8-feature-item:first-child{border-top:0}
.v8-feature-item .n{color:#ff7b27;font-weight:900;font-size:9px}
.v8-feature-item b{display:block;font-size:9px;text-transform:uppercase;margin-bottom:2px}
.v8-feature-item span{display:block;color:#6f777c;font-size:8px}

.v8-media{
  padding:78px 0;
  background:
    radial-gradient(circle at 85% 10%,rgba(255,117,30,.07),transparent 18%),
    linear-gradient(180deg,#0b0e10,#07090b);
  border-bottom:1px solid #1e2428;
}
.v8-media-grid{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  gap:14px;
}
.v8-media-main,
.v8-media-small{
  position:relative;
  overflow:hidden;
  border:1px solid #283035;
  background:#111619;
}
.v8-media-main{min-height:390px}
.v8-media-side{display:grid;gap:14px}
.v8-media-small{min-height:188px}
.v8-media-main:before,.v8-media-small:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:36px 36px;
}
.v8-media-main.night{
  background:
    radial-gradient(circle at 76% 20%,rgba(84,151,196,.17),transparent 20%),
    linear-gradient(160deg,#183044,#121719 60%,#0b0d0e);
}
.v8-media-small.dust{
  background:
    radial-gradient(circle at 68% 25%,rgba(226,146,68,.16),transparent 23%),
    linear-gradient(160deg,#32251b,#151312 70%);
}
.v8-media-small.red{
  background:
    radial-gradient(circle at 50% 48%,rgba(185,50,35,.18),transparent 25%),
    linear-gradient(160deg,#291818,#100d0d 68%);
}
.v8-media-label{
  position:absolute;
  left:16px;bottom:15px;
  z-index:6;
  color:#fff;
  font-size:9px;
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:.07em;
  background:rgba(0,0,0,.55);
  border-left:3px solid #ff7c27;
  padding:6px 8px;
}
.v8-media-main .tankunit,
.v8-media-small .tankunit{
  position:absolute;
  width:60px;height:38px;
  border-radius:7px;
  background:#6a7d48;
  border:4px solid #a8c176;
  z-index:4;
}
.v8-media-main .tankunit:after,
.v8-media-small .tankunit:after{
  content:"";
  position:absolute;
  left:38px;top:12px;
  width:46px;height:7px;
  background:#a8c176;
}
.v8-media-main .tankunit{left:46%;bottom:18%}
.v8-media-small .tankunit{left:28%;bottom:20%;transform:scale(.78)}
.v8-media-main .enemy,
.v8-media-small .enemy{
  position:absolute;
  width:54px;height:34px;
  border-radius:7px;
  background:#6b3b32;
  border:4px solid #c96859;
  z-index:4;
}
.v8-media-main .enemy{right:18%;bottom:29%}
.v8-media-small .enemy{right:18%;bottom:28%;transform:scale(.78)}
.v8-media-main .enemy:after,
.v8-media-small .enemy:after{
  content:"";
  position:absolute;
  left:34px;top:11px;
  width:42px;height:7px;
  background:#dc7968;
}
.v8-media .building{
  position:absolute;
  bottom:0;
  background:#192024;
  border:1px solid #293237;
}
.v8-media .b1{left:0;width:25%;height:58%}
.v8-media .b2{left:28%;width:20%;height:38%}
.v8-media .b3{right:0;width:34%;height:52%}
.v8-media-main .boom,.v8-media-small .boom{
  position:absolute;
  border-radius:50%;
  background:radial-gradient(circle,#ffd27f 0 10%,#ff7923 11% 28%,rgba(211,63,19,.28) 29% 50%,transparent 68%);
}
.v8-media-main .boom{right:34%;top:37%;width:70px;height:70px}
.v8-media-small .boom{right:35%;top:32%;width:46px;height:46px}

.v8-news{
  padding:74px 0 80px;
  background:#07090b;
  border-bottom:1px solid #1d2327;
}
.v8-news-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.v8-news-card{
  border:1px solid #22292d;
  background:#0e1113;
  overflow:hidden;
}
.v8-news-art{
  height:155px;
  position:relative;
  background:
    radial-gradient(circle at 74% 22%,rgba(255,114,32,.13),transparent 22%),
    linear-gradient(145deg,#26343b,#14191c 65%);
}
.v8-news-art:before{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px);
  background-size:28px 28px;
}
.v8-news-body{padding:18px}
.v8-news-body small{
  color:#ff7b27;
  font-size:7px;
  text-transform:uppercase;
  letter-spacing:.14em;
}
.v8-news-body h3{
  font-size:15px;
  text-transform:uppercase;
  margin:7px 0;
}
.v8-news-body p{
  color:#727a7f;
  font-size:8px;
  line-height:1.6;
  margin:0;
}

.v8-community{
  position:relative;
  overflow:hidden;
  padding:66px 0;
  background:
    linear-gradient(90deg,rgba(50,18,5,.88),rgba(10,12,13,.94)),
    radial-gradient(circle at 75% 50%,rgba(255,137,53,.12),transparent 24%);
  border-bottom:1px solid #262b2e;
}
.v8-community .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}
.v8-community h2{
  font-family:Impact,"Arial Narrow Bold",Arial,sans-serif;
  font-size:42px;
  line-height:.96;
  text-transform:uppercase;
  margin:0 0 8px;
}
.v8-community p{
  margin:0;
  color:#a69f99;
  font-size:10px;
}
.v8-community-actions{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
}
.v8-footer{
  background:#080a0b;
  border-top:1px solid #1c2226;
  padding-top:42px;
}
.v8-footer-grid{
  display:grid;
  grid-template-columns:1.5fr .7fr .7fr .8fr;
  gap:40px;
  padding-bottom:32px;
}
.v8-footer h4{
  margin:0 0 12px;
  color:#ff7b27;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.14em;
}
.v8-footer p,.v8-footer a{
  display:block;
  color:#687075;
  font-size:8px;
  margin:0 0 7px;
}
.v8-footer .studio{
  font-size:12px;
  font-weight:900;
  color:#e6e8e9;
  margin-bottom:9px;
}
.v8-footer-bottom{
  border-top:1px solid #1b2024;
  padding:12px 0;
  color:#4e5559;
  font-size:7px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
@media(max-width:900px){
  .v8-hero{min-height:650px}
  .v8-scene{opacity:.55;width:70vw;right:-16%}
  .v8-feature-hero,.v8-media-grid{grid-template-columns:1fr}
  .v8-media-side{grid-template-columns:1fr 1fr}
  .v8-news-grid{grid-template-columns:1fr 1fr}
  .v8-footer-grid{grid-template-columns:1.3fr 1fr 1fr}
}
@media(max-width:680px){
  .v8-header{position:relative;top:0;background:#090b0d}
  .v8-header .header-inner{height:auto;padding:12px 0;align-items:flex-start;flex-direction:column}
  .v8-header .nav{gap:15px;flex-wrap:wrap}
  .v8-header .nav a{padding:5px 0}
  .v8-hero{min-height:620px}
  .v8-hero-copy{padding-top:0}
  .v8-title{font-size:58px}
  .v8-scene{right:-48%;width:100vw;opacity:.42}
  .v8-section-head{align-items:flex-start;flex-direction:column}
  .v8-section-head h2{font-size:38px}
  .v8-feature-copy{padding:28px}
  .v8-media-side,.v8-news-grid{grid-template-columns:1fr}
  .v8-community .wrap{align-items:flex-start;flex-direction:column}
  .v8-community h2{font-size:34px}
  .v8-footer-grid{grid-template-columns:1fr 1fr}
}


/* ===== V9 more realistic / cinematic military finish ===== */

:root{
  --mil-orange:#d96c28;
  --mil-amber:#c88a3a;
  --mil-olive:#59624a;
  --mil-dark:#080a0b;
  --mil-panel:#0e1113;
  --mil-steel:#3f474c;
}

.game-site-home{
  background:
    radial-gradient(circle at 18% 8%,rgba(198,124,58,.035),transparent 20%),
    linear-gradient(180deg,#060708,#0a0d0f 40%,#080a0b 100%);
}

/* Reduce “arcade neon”, increase grounded military tone */
.v8-kicker,
.v8-feature-copy .eyebrow,
.v8-news-body small,
.v8-footer h4{
  color:var(--mil-amber)!important;
}
.v8-title span{color:#d6712f!important}
.v8-primary,
.v8-play-btn{
  background:linear-gradient(180deg,#c97536,#9f4e21)!important;
  border-color:#d98b52!important;
  box-shadow:0 10px 26px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.08)!important;
}
.v8-secondary{
  background:linear-gradient(180deg,rgba(34,39,42,.88),rgba(15,18,20,.88))!important;
  border-color:rgba(156,166,171,.22)!important;
}

/* Film grain / lens falloff */
.v8-hero{
  background:
    linear-gradient(90deg,rgba(3,5,6,.97) 0%,rgba(4,6,7,.82) 34%,rgba(7,9,10,.30) 64%,rgba(4,5,6,.70) 100%),
    radial-gradient(circle at 78% 34%,rgba(226,137,70,.13),transparent 18%),
    radial-gradient(circle at 66% 60%,rgba(102,126,138,.12),transparent 27%),
    linear-gradient(135deg,#11171a 0%,#242d31 44%,#111416 100%)!important;
}
.v8-hero:before{
  background:
    radial-gradient(circle at center,transparent 30%,rgba(0,0,0,.38) 82%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 3px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.008) 0 1px,transparent 1px 4px)!important;
  opacity:.72!important;
}
.v8-hero:after{
  height:250px!important;
  background:linear-gradient(transparent,rgba(6,8,9,.55) 52%,#07090b 100%)!important;
}

/* Distant terrain / ruined skyline */
.v8-scene:before{
  content:"";
  position:absolute;
  left:-10%;
  right:-5%;
  bottom:4%;
  height:42%;
  background:
    linear-gradient(90deg,
      transparent 0 4%,
      rgba(16,20,22,.95) 4% 13%,
      transparent 13% 18%,
      rgba(18,22,24,.92) 18% 27%,
      transparent 27% 32%,
      rgba(15,19,21,.95) 32% 45%,
      transparent 45% 52%,
      rgba(19,23,25,.93) 52% 64%,
      transparent 64% 71%,
      rgba(16,20,22,.96) 71% 84%,
      transparent 84% 100%);
  clip-path:polygon(0 58%,5% 45%,9% 52%,13% 34%,18% 47%,22% 29%,27% 45%,32% 39%,36% 52%,42% 31%,48% 44%,53% 28%,59% 43%,65% 35%,71% 49%,78% 30%,84% 44%,90% 37%,96% 53%,100% 47%,100% 100%,0 100%);
  filter:blur(.4px);
  opacity:.86;
}
.v8-scene:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(113deg,transparent 0 54%,rgba(255,205,143,.10) 54.4% 54.7%,transparent 55.1%),
    linear-gradient(93deg,transparent 0 74%,rgba(255,136,74,.07) 74.2% 74.45%,transparent 74.8%),
    radial-gradient(circle at 78% 68%,rgba(232,137,74,.08),transparent 10%);
  pointer-events:none;
}

/* More realistic tank: gunmetal + olive + bevels */
.v8-tank-main{
  width:390px!important;
  height:235px!important;
  filter:drop-shadow(0 34px 36px rgba(0,0,0,.62)) contrast(1.03);
}
.v8-tank-main .track{
  height:58px!important;
  background:
    repeating-linear-gradient(90deg,#24282b 0 16px,#15181a 16px 24px),
    linear-gradient(#22282b,#101214)!important;
  border:7px solid #353d41!important;
  box-shadow:
    inset 0 8px 12px rgba(255,255,255,.025),
    inset 0 -10px 14px rgba(0,0,0,.38),
    0 8px 10px rgba(0,0,0,.38);
}
.v8-tank-main .body{
  background:
    linear-gradient(160deg,rgba(255,255,255,.06),transparent 24%),
    repeating-linear-gradient(118deg,rgba(255,255,255,.018) 0 2px,transparent 2px 8px),
    linear-gradient(145deg,#5e674d,#3e4637 58%,#2b3128)!important;
  border-color:#6f785e!important;
  box-shadow:
    inset 0 2px rgba(255,255,255,.06),
    inset -20px -16px 24px rgba(0,0,0,.18),
    0 10px 18px rgba(0,0,0,.34)!important;
}
.v8-tank-main .body:before{
  content:"";
  position:absolute;
  left:18px;right:22px;top:17px;
  height:3px;
  background:linear-gradient(90deg,transparent,#7f875f,transparent);
  opacity:.45;
}
.v8-tank-main .body:after{
  content:"";
  position:absolute;
  right:18px;top:20px;
  width:28px;height:16px;
  border:2px solid rgba(20,24,19,.75);
  background:#444d3a;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.025);
}
.v8-tank-main .turret{
  background:
    radial-gradient(circle at 34% 30%,rgba(255,255,255,.09),transparent 18%),
    linear-gradient(145deg,#667052,#46503e 58%,#30382d)!important;
  border-color:#778166!important;
  box-shadow:
    inset -9px -12px 18px rgba(0,0,0,.2),
    0 8px 16px rgba(0,0,0,.28);
}
.v8-tank-main .turret:before{
  content:"";
  position:absolute;
  width:28px;height:16px;
  left:26px;top:12px;
  border-radius:4px;
  background:#3d4636;
  border:2px solid #59644b;
}
.v8-tank-main .gun{
  height:16px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 40%),
    linear-gradient(90deg,#798262,#565f49 65%,#414839)!important;
  box-shadow:0 6px 8px rgba(0,0,0,.35), inset 0 -4px rgba(0,0,0,.16)!important;
}
.v8-tank-main .gun:after{
  content:"";
  position:absolute;
  right:-18px;top:-3px;
  width:22px;height:22px;
  border-radius:2px;
  background:#31372f;
  border:2px solid #555e4d;
}

/* Smoke with layered depth */
.v8-smoke{
  background:
    radial-gradient(circle at 44% 44%,rgba(155,162,164,.22),rgba(81,89,93,.12) 42%,transparent 72%)!important;
  filter:blur(7px)!important;
}
.v8-smoke.s1{opacity:.9}
.v8-smoke.s2{opacity:.7}
.v8-fire{
  background:
    radial-gradient(circle at 46% 48%,#fff0bd 0 4%,#f7c267 5% 11%,#dc7a35 12% 27%,rgba(117,43,19,.35) 28% 48%,transparent 64%)!important;
  filter:blur(1px)!important;
  opacity:.9;
}

/* Media panels become grounded and photographic */
.v8-feature-visual,
.v8-media-main,
.v8-media-small,
.v8-news-art{
  filter:saturate(.78) contrast(1.05);
}
.v8-feature-visual{
  background:
    radial-gradient(circle at 72% 34%,rgba(218,129,63,.11),transparent 17%),
    radial-gradient(circle at 28% 68%,rgba(79,99,111,.10),transparent 20%),
    linear-gradient(160deg,#20292e,#131719 62%,#0a0d0e)!important;
}
.v8-feature-visual:after{
  content:"";
  position:absolute;inset:0;
  background:
    radial-gradient(circle at center,transparent 36%,rgba(0,0,0,.28) 100%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.010) 0 1px,transparent 1px 3px);
  pointer-events:none;
}
.v8-feature-visual .building,
.v8-media .building{
  background:
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 18%),
    linear-gradient(#1c2327,#111517)!important;
  border-color:#2a3236!important;
  box-shadow:inset -10px 0 20px rgba(0,0,0,.18);
}
.v8-feature-visual .building:before,
.v8-media .building:before{
  content:"";
  position:absolute;
  inset:14px 10px;
  background:
    linear-gradient(90deg,transparent 0 14%,rgba(180,190,194,.07) 14% 23%,transparent 23% 45%,rgba(180,190,194,.06) 45% 54%,transparent 54% 74%,rgba(180,190,194,.05) 74% 83%,transparent 83%);
  opacity:.8;
}

/* Enemy and player units less toy-like */
.v8-feature-visual .tankunit,
.v8-media-main .tankunit,
.v8-media-small .tankunit{
  background:
    linear-gradient(160deg,rgba(255,255,255,.06),transparent 25%),
    linear-gradient(145deg,#626b4e,#3c4534)!important;
  border-color:#747f60!important;
  box-shadow:0 7px 14px rgba(0,0,0,.36);
}
.v8-feature-visual .enemyunit,
.v8-media-main .enemy,
.v8-media-small .enemy{
  background:
    linear-gradient(160deg,rgba(255,255,255,.05),transparent 25%),
    linear-gradient(145deg,#654137,#442b27)!important;
  border-color:#8b5a4d!important;
  box-shadow:0 7px 14px rgba(0,0,0,.34);
}
.v8-feature-visual .blast,
.v8-media-main .boom,
.v8-media-small .boom{
  background:
    radial-gradient(circle,#fff3c0 0 4%,#f1ba62 5% 11%,#c96930 12% 26%,rgba(127,47,19,.26) 27% 46%,transparent 67%)!important;
  filter:blur(.6px);
}

/* Panels more industrial */
.v8-feature-copy,
.v8-news-card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.012),transparent),
    #0c0f11!important;
}
.v8-feature-item{
  border-color:#252b2f!important;
}
.v8-feature-item .n{color:#b97941!important}
.v8-media-label{
  color:#d8d9d8!important;
  background:rgba(7,9,10,.72)!important;
  border-left-color:#b76531!important;
  letter-spacing:.08em!important;
}
.v8-news-card{
  border-color:#20262a!important;
}
.v8-news-body h3{color:#e1e3e3}
.v8-community{
  background:
    linear-gradient(90deg,rgba(45,22,10,.88),rgba(9,11,12,.96)),
    radial-gradient(circle at 75% 50%,rgba(179,104,49,.10),transparent 22%)!important;
}
.v8-community h2{color:#e7e8e8}

/* More restrained footer */
.v8-footer{
  background:#07090a!important;
}
.v8-footer .studio{color:#d9dddd!important}
.v8-footer p,.v8-footer a{color:#646b6f!important}

/* subtle scan/film surface across realistic blocks */
.v8-feature-visual,
.v8-media-main,
.v8-media-small,
.v8-news-art{
  box-shadow:inset 0 0 40px rgba(0,0,0,.26);
}

@media(max-width:680px){
  .v8-scene{opacity:.36!important}
  .v8-title{font-size:54px!important}
}


/* ===== V11 matched real gameplay images ===== */
.image-shot{overflow:hidden;padding:0;background:#0f1517 !important}
.image-shot img{width:100%;height:100%;display:block;object-fit:cover}

.matched-media-grid{display:grid;grid-template-columns:1.4fr .85fr;gap:14px}
.matched-media-card{position:relative;display:block;min-height:188px;overflow:hidden;border-radius:18px;border:1px solid rgba(255,255,255,.06);box-shadow:0 18px 40px rgba(0,0,0,.35);background:#111;text-decoration:none}
.matched-media-main{min-height:390px}
.matched-media-card img{width:100%;height:100%;display:block;object-fit:cover;filter:saturate(1.03) contrast(1.03)}
.matched-media-card:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.72) 100%)}
.matched-media-card .v8-media-label{position:absolute;left:18px;bottom:16px;z-index:2}

.actual-shot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:16px}
.actual-shot-card{margin:0;background:#101416;border:1px solid rgba(255,255,255,.08);border-radius:18px;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.28)}
.actual-shot-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.actual-shot-card figcaption{padding:12px 14px;color:#e8ece6;font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.88rem}

@media(max-width:900px){
  .matched-media-grid{grid-template-columns:1fr}
  .actual-shot-grid{grid-template-columns:1fr}
}


/* ===== V12 all-page visual unification ===== */
.v8-hero-shot{position:absolute;right:7%;bottom:58px;width:min(46vw,700px);border-radius:26px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 80px rgba(0,0,0,.45);z-index:1;background:#0f1315}
.v8-hero-shot img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:16/9;filter:saturate(1.04) contrast(1.04)}
.v8-hero-shot:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.36))}
.hero-shot-badge{position:absolute;left:18px;bottom:16px;z-index:2;padding:8px 12px;border-radius:999px;background:rgba(10,14,16,.76);border:1px solid rgba(255,255,255,.12);font-size:.72rem;letter-spacing:.12em;color:#dce3dd;font-weight:800}
.v8-hero-copy{position:relative;z-index:3;max-width:560px}

.game-icon-card{overflow:hidden;padding:0;background:#101416 !important;border:1px solid rgba(255,255,255,.08)}
.game-icon-card img{width:100%;height:100%;display:block;object-fit:cover}

.about-image-frame{position:relative;overflow:hidden;padding:0 !important;background:#101416 !important}
.about-image-frame img{display:block;width:100%;height:100%;object-fit:cover}
.image-chip{position:absolute;left:16px;bottom:14px;padding:7px 12px;border-radius:999px;background:rgba(7,10,12,.72);border:1px solid rgba(255,255,255,.12);color:#ecf1ea;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.about-mini-gallery{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0 18px}
.about-mini-card{position:relative;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 36px rgba(0,0,0,.24);background:#101416}
.about-mini-card img{display:block;width:100%;height:148px;object-fit:cover}
.about-mini-card span{position:absolute;left:12px;bottom:10px;padding:6px 10px;background:rgba(8,10,12,.72);border-radius:999px;font-size:.72rem;color:#edf0ea;font-weight:700}

.contact-hero-rich{position:relative;overflow:hidden}
.contact-hero-rich:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,14,.32),rgba(10,12,14,.72)), url('assets/night-front.jpg') center/cover no-repeat;opacity:.8}
.contact-hero-rich .wrap{position:relative;z-index:2}
.contact-hero-preview{margin-top:16px;max-width:390px;position:relative;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.10);box-shadow:0 18px 42px rgba(0,0,0,.30)}
.contact-hero-preview img{width:100%;height:190px;display:block;object-fit:cover}
.contact-hero-preview span{position:absolute;left:14px;bottom:12px;background:rgba(8,10,12,.74);color:#eef2ee;border-radius:999px;padding:8px 12px;font-size:.74rem;font-weight:700}
.support-shot{margin-top:18px;position:relative;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:#101416}
.support-shot img{display:block;width:100%;height:190px;object-fit:cover}
.support-shot span{position:absolute;left:14px;bottom:12px;background:rgba(8,10,12,.72);padding:8px 12px;border-radius:12px;color:#edf1ec;font-size:.74rem;font-weight:700;max-width:80%}

.store-head-rich{display:grid;grid-template-columns:1fr minmax(300px,480px);gap:28px;align-items:center;margin-bottom:24px}
.store-head-art{position:relative;border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 22px 50px rgba(0,0,0,.32);background:#101416}
.store-head-art img{display:block;width:100%;height:100%;aspect-ratio:16/9;object-fit:cover}
.store-art-badge{position:absolute;left:16px;bottom:14px;background:rgba(8,10,12,.76);border:1px solid rgba(255,255,255,.12);color:#ecf0e8;padding:8px 12px;border-radius:999px;font-size:.74rem;font-weight:700}
.store-info-rich{border-left:3px solid rgba(217,174,59,.55)}
.store-showcase{display:grid;grid-template-columns:1.25fr .85fr;gap:14px;margin:0 0 18px}
.store-showcase-main,.store-showcase-side{position:relative;overflow:hidden;border-radius:20px;border:1px solid rgba(255,255,255,.07);box-shadow:0 18px 40px rgba(0,0,0,.24);background:#101416}
.store-showcase-main img,.store-showcase-side img{display:block;width:100%;height:100%;object-fit:cover}
.store-showcase-main img{aspect-ratio:16/9}
.store-showcase-side img{aspect-ratio:16/9}
.store-showcase-main span,.store-showcase-side span{position:absolute;left:14px;bottom:12px;padding:8px 12px;border-radius:999px;background:rgba(8,10,12,.72);color:#eff1eb;font-size:.74rem;font-weight:700}

@media(max-width:980px){
  .v8-hero-shot{position:relative;right:auto;bottom:auto;width:100%;margin:24px auto 0}
  .store-head-rich,.store-showcase{grid-template-columns:1fr}
}
@media(max-width:760px){
  .about-mini-gallery,.actual-shot-grid{grid-template-columns:1fr}
  .contact-hero-preview{max-width:none}
}
