/* ===========================================================
   IMBRANET — Dark Premium UI
   Paleta: #050816 bg · #0EA5FF glow · #FF2B2B red · #F5F7FA soft · #A7B0C0 muted
   =========================================================== */

:root{
  --bg:#050816;
  --bg-soft:#0A0F1F;
  --glow:#0EA5FF;
  --red:#FF2B2B;
  --soft:#F5F7FA;
  --muted:#A7B0C0;
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.14);
}

*{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--soft);
  font-family:'Inter','General Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  overflow-x:hidden;
}

/* Tipografia de títulos: Clash Display / Satoshi */
.font-display{ font-family:'Clash Display','Satoshi','Inter',sans-serif; }

/* Fundo de profundidade global (luz azul abstrata) */
.bg-aura{ position:relative; }
.bg-aura::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(60rem 40rem at 75% -10%, rgba(14,165,255,.16), transparent 60%),
    radial-gradient(50rem 40rem at 10% 8%,  rgba(14,165,255,.08), transparent 55%),
    radial-gradient(40rem 30rem at 90% 80%, rgba(255,43,43,.05),  transparent 60%);
}

/* Glassmorphism leve */
.glass{
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  border:1px solid var(--line);
  backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
}
.glass-strong{
  background:linear-gradient(180deg, rgba(12,18,36,.85), rgba(8,12,26,.78));
  border:1px solid var(--line);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}

/* Linha fina superior nos cards (acabamento premium) */
.hairline-top{ position:relative; }
.hairline-top::before{
  content:""; position:absolute; inset:0 0 auto 0; height:1px;
  background:linear-gradient(90deg, transparent, rgba(14,165,255,.6), transparent);
  opacity:.0; transition:opacity .4s ease;
}
.hairline-top:hover::before{ opacity:1; }

/* Glow utilitário */
.glow-blue{ box-shadow:0 0 0 1px rgba(14,165,255,.25), 0 12px 40px -12px rgba(14,165,255,.45); }
.glow-red{  box-shadow:0 8px 30px -8px rgba(255,43,43,.6), inset 0 0 0 1px rgba(255,255,255,.08); }
.text-glow{ text-shadow:0 0 24px rgba(14,165,255,.45); }

/* Botões premium */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-weight:600; letter-spacing:.01em; border-radius:.85rem;
  padding:.7rem 1.25rem; font-size:.92rem; line-height:1;
  transition:transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease, background .3s ease, border-color .3s ease, color .3s ease;
  will-change:transform;
}
.btn:active{ transform:translateY(1px) scale(.99); }

.btn-red{
  color:#fff; background:linear-gradient(180deg,#FF3A3A,#E11D1D);
  box-shadow:0 10px 30px -10px rgba(255,43,43,.7), inset 0 1px 0 rgba(255,255,255,.18);
}
.btn-red:hover{ box-shadow:0 14px 40px -10px rgba(255,43,43,.85), inset 0 1px 0 rgba(255,255,255,.25); transform:translateY(-1px); }

.btn-outline{
  color:var(--soft); background:rgba(14,165,255,.04);
  border:1px solid rgba(14,165,255,.35);
}
.btn-outline:hover{
  border-color:rgba(14,165,255,.75);
  box-shadow:0 0 0 1px rgba(14,165,255,.35), 0 12px 36px -14px rgba(14,165,255,.6);
  transform:translateY(-1px);
}

.btn-ghost{ color:var(--muted); }
.btn-ghost:hover{ color:var(--soft); }

/* Card de plano */
.plan-card{
  position:relative; overflow:hidden; border-radius:1.25rem;
  border:1px solid var(--line); background:var(--bg-soft);
  transition:transform .45s cubic-bezier(.2,.7,.3,1), border-color .4s ease, box-shadow .45s ease;
  min-height:340px;
}
.plan-card:hover{
  transform:translateY(-6px);
  border-color:rgba(14,165,255,.4);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.8), 0 0 0 1px rgba(14,165,255,.18), 0 0 50px -20px rgba(14,165,255,.5);
}
.plan-card__img{
  position:absolute; inset:0; background-size:cover; background-position:center;
  transform:scale(1.02); transition:transform .8s cubic-bezier(.2,.7,.3,1); filter:saturate(.9);
}
.plan-card:hover .plan-card__img{ transform:scale(1.08); }
.plan-card__veil{
  position:absolute; inset:0;
  background:linear-gradient(110deg, rgba(5,8,22,.96) 30%, rgba(5,8,22,.78) 52%, rgba(5,8,22,.28) 100%),
             linear-gradient(0deg, rgba(5,8,22,.85), transparent 55%);
}
.plan-card__glow{
  position:absolute; right:-30%; top:30%; width:60%; height:60%;
  background:radial-gradient(circle, rgba(14,165,255,.35), transparent 65%);
  opacity:.0; transition:opacity .5s ease;
}
.plan-card:hover .plan-card__glow{ opacity:1; }

/* Ícone outline em moldura */
.icon-chip{
  display:inline-flex; align-items:center; justify-content:center;
  width:3rem; height:3rem; border-radius:.9rem;
  border:1px solid var(--line-strong);
  background:linear-gradient(180deg, rgba(14,165,255,.12), rgba(14,165,255,.02));
  color:var(--glow);
}
.icon-chip svg{ width:1.4rem; height:1.4rem; stroke-width:1.5; }

/* Links de navegação com ícone */
.nav-ico{ color:var(--muted); transition:color .25s ease; }
.nav-ico:hover{ color:var(--soft); }
.nav-ico svg{ stroke-width:1.4; }

/* Divisores minimalistas */
.vsep{ width:1px; height:1.25rem; background:var(--line-strong); }

/* Footer action item */
.action-item{ transition:color .3s ease; color:var(--muted); }
.action-item:hover{ color:var(--soft); }
.action-item:hover .icon-chip{
  border-color:rgba(14,165,255,.55);
  box-shadow:0 0 30px -8px rgba(14,165,255,.6);
}
.action-item .icon-chip{ transition:border-color .3s ease, box-shadow .3s ease; }

/* Reveal on scroll */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.reveal.is-in{ opacity:1; transform:none; }

/* Grão sutil para profundidade cinematográfica */
.grain::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.04; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

::selection{ background:rgba(14,165,255,.35); color:#fff; }

/* Scrollbar discreta */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:#070b18; }
::-webkit-scrollbar-thumb{ background:#18203a; border-radius:20px; border:2px solid #070b18; }
::-webkit-scrollbar-thumb:hover{ background:#222c4d; }

@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1 !important; transform:none !important; }
  *{ scroll-behavior:auto; }
}
