*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:#080909;color:#eee;font-family:Inter,Arial,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.gold{color:#c5a36a}

.header{
  height:82px;position:absolute;z-index:10;top:0;left:0;width:100%;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 7%;border-bottom:1px solid #ffffff18;
  background:linear-gradient(#050606c9,transparent)
}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:4px;font-size:19px}
.brand-mark{width:34px;height:34px;border:1px solid #b9975d;color:#d4b276;display:grid;place-items:center;transform:skew(-9deg);font-weight:900}
.nav{display:flex;gap:34px}
.nav a,.footer-links a{font-size:10px;letter-spacing:1.7px;color:#c7c5c0;transition:.25s}
.nav a:hover,.nav a.active,.footer-links a:hover{color:#d5b276}
.nav a.active:after{content:" ";display:block;width:18px;height:2px;background:#c6a36b;margin:9px auto 0}

.button{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 25px;
  background:linear-gradient(110deg,#e0c18a,#ad854b);
  color:#14110c;font-size:11px;font-weight:900;letter-spacing:1px;
  border:1px solid #e4c994;border-radius:3px;
  box-shadow:0 7px 28px #c49a5630;transition:.25s
}
.button:hover{transform:translateY(-3px);filter:brightness(1.12)}
.button-small{min-height:39px;padding:0 18px;font-size:10px}
.button-outline{background:#111315aa;color:#eee;border:1px solid #ffffff55;box-shadow:none}

.hero{
  height:760px;min-height:680px;position:relative;
  display:flex;align-items:center;padding:100px 10% 65px;overflow:hidden
}
.hero-image{
  position:absolute;inset:0;
  background:url("assets/nexus-hero.png") center 55%/cover no-repeat;
  opacity:.75
}
.hero-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,#050606 0%,#050606dc 27%,#05060635 68%,#05060655),
    linear-gradient(180deg,#080909ee 0%,#08090988 18%,transparent 35%),
    linear-gradient(0deg,#080909 0%,transparent 28%,#08090935 100%)
}
.hero-content{position:relative;z-index:1;max-width:590px;margin-top:40px}
.eyebrow{font-size:10px;letter-spacing:3px;color:#c5a36a;font-weight:700}
.eyebrow span{display:inline-block;width:25px;height:1px;background:#c5a36a;vertical-align:middle;margin-right:10px}
.hero h1{font-size:clamp(76px,11vw,142px);line-height:.86;letter-spacing:5px;margin:26px 0 8px;font-weight:900;color:#f2f1ed}
.hero h2{font-size:clamp(23px,3vw,37px);letter-spacing:8px;color:#c9a66d;margin:0;font-weight:700}
.tagline{letter-spacing:5px;font-size:12px;margin:28px 0 13px}
.hero-copy{font-size:14px;line-height:1.8;color:#c1c1bd}
.hero-actions{display:flex;gap:13px;margin-top:28px}
.hero-index{position:absolute;right:8%;bottom:70px;font-size:23px;letter-spacing:2px;color:#c6a36b}
.hero-index span{font-size:11px;color:#888}
.scroll-cue{position:absolute;bottom:30px;left:10%;font-size:9px;letter-spacing:2px;color:#a5a5a0}
.scroll-cue span{display:inline-block;width:35px;height:1px;background:#c6a36b;vertical-align:middle;margin-right:10px}

.section{padding:105px 8%;position:relative}
.section-heading{text-align:center;margin:0 auto 48px}
.section-heading h2{font-size:clamp(25px,4vw,39px);letter-spacing:2px;margin:13px 0}
.section-heading h2 span,.download-inner h2 span{color:#c5a36a}
.section-sub{font-size:13px;color:#92928d}
.section-line{display:block;width:65px;height:1px;background:#c5a36a;margin:0 auto 22px}

.games-section{background:radial-gradient(ellipse at 50% 0%,#24201a 0%,#0b0c0c 54%)}
.games-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.game-card{
  min-height:180px;padding:0;align-items:stretch;
  background-color:#111;background-position:center;background-size:cover;
  border:1px solid #a987514d;border-radius:5px;
  box-shadow:0 8px 28px #0008;overflow:hidden;
  position:relative;isolation:isolate;transition:.3s
}
.game-card:before{
  content:" ";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(0deg,#050606b8 0%,#05060612 45%,#05060605 100%);
  transition:background .25s
}
.game-card:after{content:" ";position:absolute;inset:0;border:1px solid #d1ad6d00;transition:.3s}
.game-card:hover{transform:translateY(-5px);border-color:#d2ad70;box-shadow:0 12px 32px #000b,0 0 20px #c5a36a22}
.game-card:hover:before{background:linear-gradient(0deg,#050606d0 0%,#05060605 68%)}
.game-card:hover:after{border-color:#c5a36a55}
.game-card >div:last-child{align-self:flex-end;padding:17px;width:100%;background:linear-gradient(0deg,#050606d9,transparent);position:relative;z-index:1}
.game-card h3{font-size:12px;letter-spacing:1px;margin:5px 0 0;text-shadow:0 2px 8px #000}
.game-card small{font-size:8px;letter-spacing:2px;color:#e0bf83;text-shadow:0 1px 5px #000}
.game-number{position:absolute;right:9px;top:9px;font-size:11px;color:#ffffff60;z-index:2;background:#0809099c;padding:4px 6px;border-radius:2px}

.game-cs{background-image:url("assets/games/cs2.jpg")}
.game-dota{background-image:url("assets/games/dota2.jpg")}
.game-pubg{background-image:url("assets/games/pubg.jpg")}
.game-phantom{background-image:url("assets/games/phantom.jpg")}
.game-aion{background-image:url("assets/games/aion2.jpg")}
.game-deadlock{background-image:url("assets/games/deadlock.jpg")}
.game-bongo{background-image:url("assets/games/bongocat.jpg")}
.game-cod{background-image:url("assets/games/cod.jpg")}
.game-apex{background-image:url("assets/games/apex.jpg")}
.game-fortnite{background-image:url("assets/games/fortnite.jpg")}
.game-war{background-image:url("assets/games/warthunder.jpg")}

.fine-print{text-align:center;color:#777;font-size:10px;margin:25px 0 0}

.features-section{background:#0d0f0f}
.feature-grid{max-width:1150px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.feature-card{padding:29px 24px;border:1px solid #ffffff19;background:linear-gradient(145deg,#191b1a,#0c0e0e);min-height:190px}
.feature-icon{font-size:29px;color:#c5a36a;margin-bottom:22px}
.feature-card h3{font-size:11px;letter-spacing:1.5px}
.feature-card p,.step p{font-size:12px;color:#999;line-height:1.7}

.how-section{background:linear-gradient(180deg,#101211,#080909)}
.steps{max-width:1150px;margin:auto;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:18px}
.step{display:flex;align-items:center;gap:17px;padding:22px;border:1px solid #ffffff20;background:#141615}
.step-no{font-size:34px;color:#c5a36a;font-weight:800}
.step h3{font-size:11px;letter-spacing:1px;margin:0}
.step p{margin:8px 0 0}
.step-arrow{color:#c5a36a;font-size:24px}

.faq-section{background:#0c0e0e}
.faq-list{max-width:850px;margin:auto}
.faq-list details{border-bottom:1px solid #ffffff25;padding:0 5px}
.faq-list summary{list-style:none;cursor:pointer;padding:21px 4px;font-size:13px;display:flex;justify-content:space-between;align-items:center}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary span{font-size:21px;color:#c5a36a;transition:.2s}
.faq-list details[open] summary span{transform:rotate(45deg)}
.faq-list details p{font-size:12px;color:#999;line-height:1.8;padding:0 25px 18px 4px;margin:0}

.download-section{
  padding:100px 20px;text-align:center;
  background:linear-gradient(90deg,#080909dd,#08090977),url("assets/nexus-hero.png") center 68%/cover no-repeat;
  border-top:1px solid #c5a36a55;border-bottom:1px solid #c5a36a55
}
.download-inner h2{font-size:clamp(34px,6vw,60px);line-height:1.08;letter-spacing:2px;margin:18px 0}
.download-inner >p:not(.eyebrow){font-size:13px;color:#bbb;margin-bottom:28px}
.download-inner small{display:block;color:#858580;font-size:10px;margin-top:15px}

.footer{min-height:100px;padding:25px 8%;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#070808}
.footer-links{display:flex;gap:25px}
.copyright{font-size:9px;letter-spacing:1px;color:#777}

.menu-toggle{display:none;background:none;border:0;padding:8px}
.menu-toggle span{display:block;width:24px;height:2px;background:#d0b17b;margin:5px}

.reveal{animation:rise .9s both}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}

@media(max-width:1000px){.games-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){
  .header{padding:0 5%}
  .nav{gap:15px}
  .nav a{font-size:9px}
  .hero{padding-left:7%;height:690px}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:1fr;max-width:600px}
  .step-arrow{transform:rotate(90deg);text-align:center}
  .section{padding:80px 6%}
}
@media(max-width:650px){
  .header{height:70px}
  .menu-toggle{display:block;order:3}
  .header >.button{display:none}
  .nav{display:none;position:absolute;top:70px;left:0;right:0;padding:20px 7%;background:#090b0bf5;border-bottom:1px solid #ffffff20;flex-direction:column;gap:20px}
  .nav.open{display:flex}
  .nav a.active:after{display:none}
  .hero{height:680px;min-height:620px;padding:100px 7% 60px;align-items:center}
  .hero-image{background-position:58% center;opacity:.55}
  .hero-shade{background:linear-gradient(90deg,#050606e8,#05060688),linear-gradient(0deg,#080909,transparent 50%)}
  .hero h1{font-size:76px}
  .hero h2{font-size:22px;letter-spacing:5px}
  .tagline{font-size:9px;letter-spacing:3px}
  .hero-copy{font-size:13px}
  .hero-actions{flex-direction:column;align-items:flex-start}
  .hero-actions .button{min-width:205px}
  .hero-index{right:7%;bottom:36px}
  .scroll-cue{display:none}
  .games-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .game-card{min-height:145px;padding:13px}
  .game-card h3{font-size:10px}
  .feature-grid{grid-template-columns:1fr 1fr;gap:9px}
  .feature-card{padding:19px 15px;min-height:175px}
  .feature-card h3{font-size:9px}
  .feature-card p{font-size:11px}
  .section{padding:70px 5%}
  .section-heading{margin-bottom:35px}
  .section-heading h2{font-size:25px}
  .footer{flex-wrap:wrap;padding:25px 6%}
  .footer-links{order:3;width:100%;justify-content:space-between}
  .copyright{font-size:8px}
  .download-section{padding:80px 15px}
}
@media(max-width:380px){
  .games-grid,.feature-grid{grid-template-columns:1fr}
  .game-card{min-height:120px}
}