:root{
  --bg:#0d1117;
  --bg-2:#0a0d12;
  --card:#161b22;
  --text:#f5f1ea;
  --muted:#a8a29e;
  --primary:#f97316;
  --primary-2:#ea580c;
  --accent:#22c55e;
  --border:#2a2f37;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  background:linear-gradient(180deg,#10141b 0%,#070a0f 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.page{position:relative;min-height:100vh;overflow:hidden}

.grid-bg{
  position:absolute;inset:0;opacity:.07;pointer-events:none;
  background-image:
    linear-gradient(var(--primary) 1px,transparent 1px),
    linear-gradient(90deg,var(--primary) 1px,transparent 1px);
  background-size:60px 60px;
}
.glow{position:absolute;border-radius:50%;filter:blur(110px);pointer-events:none}
.glow-top{top:-160px;left:50%;transform:translateX(-50%);width:520px;height:520px;background:rgba(249,115,22,.22)}
.glow-bottom{bottom:-120px;right:-80px;width:420px;height:420px;background:rgba(249,115,22,.12)}

.container{
  position:relative;z-index:1;
  max-width:1100px;margin:0 auto;
  padding:48px 20px 64px;
  display:flex;flex-direction:column;align-items:center;
  min-height:100vh;justify-content:center;
}

.badge{
  display:inline-flex;align-items:center;gap:10px;
  padding:8px 16px;border-radius:999px;
  background:rgba(22,27,34,.7);backdrop-filter:blur(8px);
  border:1px solid rgba(249,115,22,.4);
  color:var(--primary);
  font-size:12px;font-weight:700;letter-spacing:.18em;
  margin-bottom:32px;
}
.badge-dot{
  width:8px;height:8px;border-radius:50%;background:var(--primary);
  box-shadow:0 0 12px var(--primary);
  animation:spark 1.6s ease-in-out infinite;
}

.hero-wrap{
  position:relative;width:100%;max-width:780px;
  border-radius:18px;overflow:hidden;
  border:1px solid rgba(249,115,22,.3);
  box-shadow:0 20px 60px -20px rgba(249,115,22,.45);
}
.hero-wrap img{width:100%;height:auto}
.hero-fade{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(7,10,15,.85),transparent 55%);
}

.title{
  font-family:'Oswald','Impact',sans-serif;
  font-weight:700;text-transform:uppercase;
  font-size:clamp(32px,5.5vw,60px);
  text-align:center;line-height:1.05;
  margin-top:40px;letter-spacing:.02em;
}
.title-fire{
  background:linear-gradient(135deg,#fb923c,#ea580c);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

.subtitle{
  margin-top:18px;max-width:640px;text-align:center;
  color:var(--muted);font-size:clamp(15px,1.6vw,18px);
}

.cta{
  margin-top:32px;
  display:inline-flex;align-items:center;gap:12px;
  padding:16px 28px;border-radius:999px;
  background:var(--accent);color:#fff;
  font-weight:700;font-size:17px;
  box-shadow:0 14px 40px -10px rgba(34,197,94,.55);
  transition:transform .2s ease,box-shadow .2s ease;
  animation:pulseGlow 2.2s ease-in-out infinite;
}
.cta:hover{transform:scale(1.04);box-shadow:0 0 50px rgba(249,115,22,.55)}
.cta-phone{font-weight:500;opacity:.95}
@media (max-width:520px){.cta-phone{display:none}}

.features{
  margin-top:54px;width:100%;max-width:780px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
}
@media (max-width:640px){.features{grid-template-columns:1fr}}
.feature{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;border-radius:14px;
  background:rgba(22,27,34,.6);backdrop-filter:blur(8px);
  border:1px solid var(--border);
  transition:border-color .2s ease;
}
.feature:hover{border-color:rgba(249,115,22,.5)}
.feature-icon{
  width:42px;height:42px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(249,115,22,.15);font-size:20px;
}
.feature-title{font-weight:600;font-size:14px}
.feature-desc{color:var(--muted);font-size:12px}

.footer{
  margin-top:48px;color:var(--muted);font-size:12px;text-align:center;
}

.float-wa{
  position:fixed;right:20px;bottom:20px;z-index:50;
  width:60px;height:60px;border-radius:50%;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 30px rgba(34,197,94,.5);
  transition:transform .2s;
}
.float-wa:hover{transform:scale(1.1)}

.fade-in{
  opacity:0;transform:translateY(16px);
  animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) forwards;
  animation-delay:var(--delay,0s);
}
@keyframes fadeUp{to{opacity:1;transform:none}}
@keyframes spark{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}
@keyframes pulseGlow{
  0%,100%{box-shadow:0 14px 40px -10px rgba(34,197,94,.55),0 0 0 0 rgba(249,115,22,.4)}
  50%{box-shadow:0 14px 40px -10px rgba(34,197,94,.7),0 0 30px 4px rgba(249,115,22,.5)}
}
