* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
:root{
  --bg:#050505;
  --panel:rgba(255,255,255,0.055);
  --panel-2:rgba(255,255,255,0.02);
  --line:rgba(255,255,255,0.08);
  --text:#f7f7f8;
  --muted:#bbbcc2;
  --gold:#ffd179;
}
body{
  margin:0;
  background:
    radial-gradient(circle at 50% -10%, rgba(255,125,35,0.14), transparent 24%),
    linear-gradient(180deg, #030303 0%, #050505 100%);
  color:var(--text);
  font-family:"Rajdhani",sans-serif;
  overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }

.site-noise{
  pointer-events:none;
  position:fixed;
  inset:0;
  z-index:1;
  opacity:.04;
  background-image:
    radial-gradient(circle at 20% 20%, #fff 0 1px, transparent 1px),
    radial-gradient(circle at 80% 30%, #fff 0 1px, transparent 1px),
    radial-gradient(circle at 50% 80%, #fff 0 1px, transparent 1px);
  background-size:190px 190px, 240px 240px, 210px 210px;
  mix-blend-mode:soft-light;
}

.topbar{
  position:sticky;
  top:0;
  z-index:40;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.4rem;
  background:rgba(5,5,5,.76);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.brand-lockup{
  display:flex;
  align-items:center;
  gap:.85rem;
  min-width:0;
}
.brand-logo-mini{
  width:52px;
  height:52px;
  object-fit:contain;
  border-radius:14px;
  filter:drop-shadow(0 0 12px rgba(255,100,25,.35));
  animation: miniPulse 3.8s ease-in-out infinite;
}
@keyframes miniPulse{
  0%,100%{ transform:scale(1); filter:drop-shadow(0 0 12px rgba(255,100,25,.35)); }
  50%{ transform:scale(1.04); filter:drop-shadow(0 0 20px rgba(255,130,35,.55)); }
}
.brand-copy{
  display:flex;
  flex-direction:column;
  line-height:1;
}
.brand-overline,.brand-name,.nav a,.btn,.eyebrow,.section-kicker,.footer,.logo-tagline{
  font-family:"Orbitron",sans-serif;
}
.brand-overline{
  font-size:.66rem;
  letter-spacing:.25em;
  color:#ffb68b;
}
.brand-name{
  margin-top:.4rem;
  font-size:1rem;
  font-weight:900;
  letter-spacing:.18em;
}
.nav{
  display:flex;
  gap:1.2rem;
  flex-wrap:wrap;
}
.nav a{
  font-family:"Orbitron",sans-serif;
  font-size:.74rem;
  letter-spacing:.18em;
  color:#d5d5da;
}
.nav a:hover{ color:#ffbf94; }

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  padding:1rem 1.25rem;
  font-size:.78rem;
  letter-spacing:.16em;
  font-weight:800;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{
  background:linear-gradient(90deg, var(--gold), #ff7b1f 38%, #b71414);
  color:#150903;
  box-shadow:0 0 44px rgba(255,100,25,.25);
}
.btn-secondary,.btn-outline{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.14);
}
.btn-outline{
  color:#ffd2b8;
  border-color:rgba(255,120,50,.28);
}
.btn.small{ padding:.85rem 1rem; font-size:.7rem; }
.btn.full{ width:100%; }

.hero{
  position:relative;
  min-height:calc(100vh - 86px);
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 14%, rgba(255,124,28,.20), transparent 17%),
    radial-gradient(circle at 16% 16%, rgba(255,40,0,.13), transparent 22%),
    radial-gradient(circle at 86% 12%, rgba(255,180,80,.09), transparent 20%),
    linear-gradient(135deg, #010101 0%, #110303 20%, #2a0909 45%, #120707 65%, #000000 100%);
}
.hero-background{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at center, rgba(255,120,35,.05) 0%, transparent 24%),
    radial-gradient(circle at center, transparent 0%, rgba(0,0,0,.22) 58%, rgba(0,0,0,.82) 100%);
}
.hero-grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px);
  background-size:58px 58px;
  mask-image:linear-gradient(to bottom, rgba(255,255,255,.22), transparent 72%);
}
.hero-vignette{
  position:absolute;
  inset:-10%;
  background:
    radial-gradient(circle at 45% 42%, rgba(255,100,20,.10), transparent 18%),
    radial-gradient(circle at 60% 40%, rgba(255,60,10,.07), transparent 28%),
    radial-gradient(circle at 50% 45%, transparent 0%, rgba(0,0,0,.48) 74%);
  filter:blur(10px);
}
.lava-orb{
  position:absolute;
  width:34rem;
  height:34rem;
  border-radius:999px;
  filter:blur(35px);
  opacity:.35;
  pointer-events:none;
  animation: orbShift 9s ease-in-out infinite;
}
.lava-orb-left{
  left:-12rem;
  top:8rem;
  background:radial-gradient(circle, rgba(255,120,35,.35) 0%, rgba(255,50,0,.20) 32%, rgba(255,50,0,0) 72%);
}
.lava-orb-right{
  right:-12rem;
  bottom:0;
  background:radial-gradient(circle, rgba(255,170,70,.28) 0%, rgba(255,50,0,.16) 34%, rgba(255,50,0,0) 72%);
  animation-delay: -4s;
}
@keyframes orbShift{
  0%,100%{ transform:translateY(0) scale(1); }
  50%{ transform:translateY(-22px) scale(1.06); }
}
.embers{ position:absolute; inset:0; pointer-events:none; }
.ember{
  position:absolute;
  border-radius:999px;
  background: radial-gradient(circle, rgba(255,185,85,.95) 0%, rgba(255,100,25,.88) 44%, rgba(255,100,25,0) 76%);
  box-shadow:0 0 18px rgba(255,110,35,.55);
  animation: emberRise linear infinite;
}
@keyframes emberRise{
  0%{ transform:translateY(36px) scale(.8); opacity:0; }
  14%{ opacity:.95; }
  100%{ transform:translateY(-220px) scale(1.35); opacity:0; }
}

.hero-inner{
  position:relative;
  z-index:2;
  max-width:1320px;
  margin:0 auto;
  padding:4.4rem 1.5rem 5.5rem;
  display:grid;
  grid-template-columns:minmax(0, 1.08fr) minmax(320px, 470px);
  gap:2rem;
  align-items:center;
}
.hero-copy{ min-width:0; }
.eyebrow{
  display:inline-block;
  padding:.72rem 1rem;
  border-radius:999px;
  border:1px solid rgba(255,120,50,.2);
  background:rgba(255,90,30,.08);
  color:#ffc2a1;
  font-size:.74rem;
  letter-spacing:.16em;
}
.logo-monument{
  position:relative;
  margin-top:1.1rem;
  max-width:900px;
}
.logo-fire-aura{
  position:absolute;
  inset:6% 10% 14% 10%;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,140,40,.26) 0%, rgba(255,70,15,.16) 34%, rgba(255,70,15,0) 70%);
  filter:blur(30px);
  animation: auraPulse 4.2s ease-in-out infinite;
}
@keyframes auraPulse{
  0%,100%{ transform:scale(1); opacity:.8; }
  50%{ transform:scale(1.06); opacity:1; }
}
.logo-shell{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 50% 34%, rgba(255,110,30,.08), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  box-shadow:0 20px 80px rgba(0,0,0,.46);
  padding:1.2rem 1.2rem 1.35rem;
  backdrop-filter:blur(12px);
}
.logo-shell::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.06), transparent);
  transform:translateX(-120%);
  animation:sheen 6.5s linear infinite;
  pointer-events:none;
}
.hero-logo{
  position:relative;
  z-index:2;
  width:min(100%, 760px);
  display:block;
  margin:0 auto;
  filter:
    drop-shadow(0 0 20px rgba(255,130,35,.30))
    drop-shadow(0 0 46px rgba(255,70,15,.28));
  transform-origin:center center;
  animation:
    logoFloat 5.8s ease-in-out infinite,
    logoPulse 4.2s ease-in-out infinite;
}
@keyframes logoFloat{
  0%,100%{ transform:translateY(0px) scale(1); }
  50%{ transform:translateY(-8px) scale(1.01); }
}
@keyframes logoPulse{
  0%,100%{
    filter:drop-shadow(0 0 20px rgba(255,130,35,.30)) drop-shadow(0 0 46px rgba(255,70,15,.28));
  }
  50%{
    filter:drop-shadow(0 0 28px rgba(255,160,55,.52)) drop-shadow(0 0 72px rgba(255,70,15,.38));
  }
}
.logo-flames{
  position:absolute;
  inset:auto 7% 8% 7%;
  height:28%;
  z-index:1;
  pointer-events:none;
}
.flame{
  position:absolute;
  bottom:0;
  width:22%;
  border-radius:50% 50% 35% 35%;
  background:
    radial-gradient(circle at 50% 78%, rgba(255,220,130,.95) 0%, rgba(255,150,50,.84) 18%, rgba(255,80,18,.75) 42%, rgba(255,80,18,0) 72%);
  filter:blur(8px);
  opacity:.85;
  mix-blend-mode:screen;
}
.flame-1{ left:4%; height:72%; animation: flameDance 2.8s ease-in-out infinite; }
.flame-2{ left:22%; height:100%; animation: flameDance 3.2s ease-in-out -1.2s infinite; }
.flame-3{ left:40%; height:82%; animation: flameDance 2.6s ease-in-out -0.8s infinite; }
.flame-4{ right:22%; height:98%; animation: flameDance 3s ease-in-out -1.6s infinite; }
.flame-5{ right:4%; height:68%; animation: flameDance 2.5s ease-in-out -0.5s infinite; }
@keyframes flameDance{
  0%,100%{ transform:translateY(0) scaleX(1) scaleY(1); opacity:.72; }
  25%{ transform:translateY(-10px) scaleX(1.04) scaleY(1.10); opacity:.95; }
  50%{ transform:translateY(-20px) scaleX(.96) scaleY(1.22); opacity:.88; }
  75%{ transform:translateY(-8px) scaleX(1.05) scaleY(1.08); opacity:.98; }
}
.logo-tagline-wrap{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:1rem;
  justify-content:center;
  margin-top:.75rem;
}
.logo-tagline{
  margin:0;
  font-size:clamp(.8rem, 1.2vw, 1rem);
  font-weight:900;
  letter-spacing:.24em;
  color:#ffcfb0;
  text-align:center;
}
.tagline-ignite{
  display:inline-block;
  position:relative;
  text-shadow:
    0 0 8px rgba(255,120,35,.25),
    0 0 18px rgba(255,90,20,.22);
  animation:
    taglineIgnite .95s ease-out .25s both,
    taglineFlicker 3.4s linear 1.2s infinite,
    taglineGlow 2.8s ease-in-out 1.2s infinite;
}
.tagline-ignite::before{
  content:"";
  position:absolute;
  inset:-22% -8%;
  background:linear-gradient(90deg, transparent 0%, rgba(255,220,160,.65) 40%, rgba(255,120,30,.78) 50%, transparent 60%);
  transform:translateX(-140%) skewX(-18deg);
  filter:blur(6px);
  animation: forgeSweep 1.2s ease-out .1s both;
  pointer-events:none;
}
@keyframes forgeSweep{
  0%{ transform:translateX(-140%) skewX(-18deg); opacity:0; }
  20%{ opacity:1; }
  100%{ transform:translateX(160%) skewX(-18deg); opacity:0; }
}
@keyframes taglineIgnite{
  0%{
    opacity:0;
    transform:translateY(8px) scale(.98);
    color:#5a2314;
    letter-spacing:.32em;
    text-shadow:none;
  }
  35%{
    opacity:1;
    color:#ff9f63;
    text-shadow:0 0 10px rgba(255,115,35,.45), 0 0 20px rgba(255,60,0,.18);
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1);
    color:#ffd7b8;
    letter-spacing:.24em;
    text-shadow:0 0 10px rgba(255,140,55,.35), 0 0 22px rgba(255,70,0,.22);
  }
}
@keyframes taglineFlicker{
  0%, 18%, 22%, 62%, 100% { opacity:1; }
  20%, 60% { opacity:.82; }
  21%, 61% { opacity:.94; }
}
@keyframes taglineGlow{
  0%,100%{
    text-shadow:0 0 10px rgba(255,140,55,.35), 0 0 22px rgba(255,70,0,.22), 0 0 40px rgba(255,70,0,.08);
  }
  50%{
    text-shadow:0 0 14px rgba(255,170,75,.55), 0 0 30px rgba(255,85,10,.34), 0 0 60px rgba(255,85,10,.12);
  }
}
.section-ignite{
  position:relative;
  display:inline-block;
  text-shadow:
    0 0 10px rgba(255,125,35,.22),
    0 0 24px rgba(255,60,0,.12);
  animation:
    sectionIgnite 1.05s ease-out .4s both,
    sectionFlicker 4.2s linear 1.4s infinite,
    sectionGlow 3s ease-in-out 1.4s infinite;
}
.section-ignite::after{
  content:"";
  position:absolute;
  left:-3%;
  right:-3%;
  top:0;
  bottom:0;
  background:linear-gradient(90deg, transparent, rgba(255,215,160,.22), transparent);
  transform:translateX(-120%);
  animation: forgeSweep 1.25s ease-out .35s both;
  filter:blur(4px);
  pointer-events:none;
}
@keyframes sectionIgnite{
  0%{ opacity:0; transform:translateY(8px); color:#5a2314; }
  40%{ opacity:1; color:#ff9f63; }
  100%{ opacity:1; transform:translateY(0); color:#fff2e8; }
}
@keyframes sectionFlicker{
  0%, 12%, 18%, 100% { opacity:1; }
  15% { opacity:.88; }
  16% { opacity:1; }
}
@keyframes sectionGlow{
  0%,100%{ text-shadow:0 0 10px rgba(255,125,35,.22), 0 0 24px rgba(255,60,0,.12); }
  50%{ text-shadow:0 0 16px rgba(255,160,65,.45), 0 0 36px rgba(255,75,10,.22); }
}
.tagline-divider{
  flex:1 1 auto;
  max-width:120px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,195,150,.7), transparent);
}

.hero-text{
  max-width:760px;
  margin-top:1.25rem;
  font-size:1.28rem;
  line-height:1.62;
  color:#e5e5e8;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:2rem;
}
.hero-stat-row{
  margin-top:2.2rem;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1rem;
}
.hero-stat, .card, .side-card{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  backdrop-filter:blur(12px);
  box-shadow:0 18px 70px rgba(0,0,0,.42);
}
.hero-stat{ padding:1rem 1.1rem; }
.hero-stat span{
  display:block;
  color:#9ea0a9;
  font-size:.95rem;
}
.hero-stat strong{
  display:block;
  margin-top:.35rem;
  font-size:1.18rem;
  color:#ffd0b2;
}

.hero-side{ min-width:0; }
.side-card{
  min-height:560px;
}
.side-card::before, .card::before, .hero-stat::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.06), transparent);
  transform:translateX(-120%);
  animation:sheen 6.2s linear infinite;
  pointer-events:none;
}
@keyframes sheen{
  0%{ transform:translateX(-120%); }
  100%{ transform:translateX(120%); }
}
.side-card-glow{
  position:absolute;
  inset:auto 8% -18% 8%;
  height:220px;
  background:radial-gradient(circle, rgba(255,90,20,.28) 0%, rgba(255,90,20,0) 72%);
  filter:blur(22px);
}
.side-card-inner{
  position:relative;
  z-index:1;
  padding:2rem;
}
.side-kicker{
  font-family:"Orbitron",sans-serif;
  font-size:.74rem;
  letter-spacing:.18em;
  color:#ffba89;
}
.side-card h2{
  margin:.8rem 0 0;
  font-family:"Orbitron",sans-serif;
  font-size:clamp(1.8rem, 4vw, 2.8rem);
  line-height:1.06;
}
.side-card p{
  margin-top:1rem;
  font-size:1.15rem;
  line-height:1.6;
  color:#d0d0d6;
}
.feature-list{
  display:grid;
  gap:1rem;
  margin-top:1.5rem;
}
.feature-item{
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.22);
  padding:1rem;
}
.feature-item h3{
  margin:0;
  font-size:1.12rem;
}
.feature-item p{
  margin:.45rem 0 0;
  font-size:1rem;
}

.ticker-wrap{
  overflow:hidden;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:rgba(0,0,0,.48);
  padding:.95rem 0;
}
.ticker{
  display:flex;
  gap:3rem;
  min-width:max-content;
  animation:tickerMove 22s linear infinite;
}
.ticker span{
  font-family:"Orbitron",sans-serif;
  font-size:.78rem;
  letter-spacing:.22em;
  color:#ffc3a0;
}
@keyframes tickerMove{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

.section{
  position:relative;
  z-index:2;
  max-width:1320px;
  margin:0 auto;
  padding:5rem 1.5rem;
}
.section.alt{
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
}
.section-head h2{
  margin:.45rem 0 0;
  font-family:"Orbitron",sans-serif;
  font-size:clamp(2rem, 4vw, 3.4rem);
  line-height:1.08;
}
.section-head p{
  margin-top:.9rem;
  font-size:1.18rem;
  color:var(--muted);
}
.section-kicker{
  margin:0;
  font-size:.8rem;
  letter-spacing:.18em;
  color:#ffb88f;
}
.grid-two{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:1.25rem;
  margin-top:1.8rem;
}
.card{
  padding:1.5rem;
}
.card h3{
  margin:0;
  font-size:1.3rem;
}
.list{
  margin:1rem 0 0;
  padding-left:1.15rem;
  color:#dbdbe0;
  font-size:1.08rem;
  line-height:1.7;
}
.raid-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.raid-card strong{
  color:#ffd0b2;
  font-size:1.1rem;
}
.button-row{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:1.4rem;
}
.stack{
  display:grid;
  gap:.9rem;
  margin-top:.5rem;
}
.contact-item{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:.95rem 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.contact-item:last-child{ border-bottom:none; }
.contact-item span{ color:#a7a8b1; }
.contact-item strong{ color:#fff2e7; }

.footer{
  padding:2rem 1.5rem 3rem;
  text-align:center;
  color:#c4c4cb;
  letter-spacing:.14em;
  font-size:.72rem;
  border-top:1px solid var(--line);
}

@media (max-width: 1180px){
  .hero-inner{ grid-template-columns:1fr; }
  .side-card{ min-height:auto; }
}
@media (max-width: 900px){
  .nav{ display:none; }
  .grid-two, .hero-stat-row{ grid-template-columns:1fr; }
  .raid-card{ flex-direction:column; align-items:flex-start; }
  .tagline-divider{ display:none; }
}
@media (max-width: 560px){
  .topbar{ padding:1rem; }
  .brand-name{ font-size:.86rem; }
  .hero-inner, .section{ padding-left:1rem; padding-right:1rem; }
  .hero-text{ font-size:1.08rem; }
  .brand-logo-mini{ width:44px; height:44px; }
  .logo-shell{ padding:.85rem .85rem 1rem; }
  .logo-tagline{ letter-spacing:.14em; }
}