@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

/* =====================================================
   OZONCORE PARTNER
   ENTERPRISE GLOBAL SYSTEM
===================================================== */

:root{

  --bg-1:#020617;
  --bg-2:#041226;
  --bg-3:#061B2D;

  --card:#091425;
  --card-hover:#0D1B30;

  --border:rgba(0,229,255,.08);

  --text:#F8FAFC;
  --text-soft:#94A3B8;

  --cyan:#00E5FF;
  --cyan-2:#00B8FF;

  --success:#00FF88;

  --radius:28px;

}

/* =====================================================
   RESET
===================================================== */

*{

  margin:0;
  padding:0;
  box-sizing:border-box;

}

html{

  scroll-behavior:smooth;

}

html,
body{

  width:100%;
  min-height:100vh;

  overflow-x:hidden;

}

/* =====================================================
   BODY
===================================================== */

body{

  font-family:
    Inter,
    system-ui,
    -apple-system,
    sans-serif;

  color:var(--text);

  background:
    linear-gradient(
      135deg,
      var(--bg-1) 0%,
      var(--bg-2) 50%,
      var(--bg-3) 100%
    );

  position:relative;

}

/* =====================================================
   GLOW PREMIUM
===================================================== */

body::before{

  content:"";

  position:fixed;

  top:0;
  right:0;

  width:40vw;
  height:100vh;

  background:
    radial-gradient(
      circle,
      rgba(0,229,255,.12),
      transparent 70%
    );

  pointer-events:none;

  z-index:0;

}

/* =====================================================
   TIPOGRAFIA
===================================================== */

h1{

  font-size:58px;
  font-weight:900;
  line-height:1;

  color:#FFFFFF;

}

h2{

  font-size:36px;
  font-weight:800;

  color:#FFFFFF;

}

h3{

  font-size:13px;
  font-weight:700;

  letter-spacing:.08em;
  text-transform:uppercase;

  color:#94A3B8;

}

p{

  font-size:16px;
  line-height:1.7;

  color:#CBD5E1;

}

/* =====================================================
   LINKS
===================================================== */

a{

  color:inherit;

  text-decoration:none;

}

/* =====================================================
   BOTÕES
===================================================== */

button{

  font-family:inherit;

  border:none;

  cursor:pointer;

}

/* =====================================================
   INPUTS
===================================================== */

input,
select,
textarea{

  font-family:inherit;

  outline:none;

}

/* =====================================================
   CARD SYSTEM
===================================================== */

.card{

  background:
    linear-gradient(
      180deg,
      rgba(9,20,37,.96),
      rgba(5,12,24,.98)
    );

  border:
    1px solid rgba(0,229,255,.08);

  border-radius:28px;

}

/* =====================================================
   SCROLLBAR
===================================================== */

::-webkit-scrollbar{

  width:8px;

}

::-webkit-scrollbar-track{

  background:#020617;

}

::-webkit-scrollbar-thumb{

  background:
    rgba(0,229,255,.20);

  border-radius:999px;

}

::-webkit-scrollbar-thumb:hover{

  background:
    rgba(0,229,255,.35);

}

/* =====================================================
   MOBILE
===================================================== */

@media(max-width:768px){

  h1{

    font-size:40px;

  }

  h2{

    font-size:28px;

  }

  p{

    font-size:15px;

  }

}

.brand-logo{
  font-size:18px;
  font-weight:900;
  line-height:1.1;

  color:#F8FAFC;

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.brand-subtitle{
  margin-top:4px;

  font-size:10px;
  font-weight:700;

  letter-spacing:1.5px;
  color:#94A3B8;
}


/* =====================================================
   OZONCORE PARTNER • SIDEBAR PREMIUM GLOBAL
   PATCH FINAL
===================================================== */

/* SIDEBAR */

.sidebar{
  width:245px;
  min-width:245px;

  display:flex;
  flex-direction:column;

  background:rgba(5,12,24,.88);
  backdrop-filter:blur(18px);

  border-right:1px solid rgba(0,255,209,.06);
}

/* BRAND */

.sidebar-brand{

  padding:20px 14px 22px;

  margin-bottom:14px;

  border-bottom:
  1px solid rgba(255,255,255,.05);
}

.brand-logo{

  font-size:18px;
  font-weight:900;

  line-height:1;

  letter-spacing:-0.5px;

  color:#F8FAFC;

  white-space:nowrap;
}

.brand-subtitle{

  margin-top:6px;

  font-size:10px;
  font-weight:700;

  text-transform:uppercase;

  letter-spacing:1.8px;

  color:#94A3B8;
}

/* NAV */

.nav{

  display:flex;
  flex-direction:column;

  gap:10px;

  padding:0 14px;
}

.nav a{

  height:52px;

  display:flex;
  align-items:center;

  gap:12px;

  padding:0 18px;

  border-radius:18px;

  font-size:16px;
  font-weight:700;

  color:#E2E8F0;

  text-decoration:none;

  transition:.25s;
}

.nav a:hover{

  background:
  rgba(0,255,209,.04);

  border:
  1px solid rgba(0,255,209,.12);
}

.nav a.active{

  background:
  linear-gradient(
    90deg,
    rgba(0,255,209,.08),
    rgba(0,184,255,.05)
  );

  border:
  1px solid rgba(0,255,209,.18);

  box-shadow:
  inset 0 0 0 1px rgba(0,255,209,.05);
}

.nav a svg{

  width:20px;
  height:20px;

  flex-shrink:0;

  stroke-width:2.1;
}

/* DESKTOP GRANDE */

@media(min-width:1600px){

  .sidebar{
    width:260px;
    min-width:260px;
  }

}

/* MOBILE */

@media(max-width:768px){

  .sidebar-brand{
    display:none;
  }

}

/* =========================================
   SIDEBAR STRUCTURE FIX
========================================= */

.sidebar{

  display:flex;
  flex-direction:column;

}

.nav{

  flex:none;

}

.sidebar-footer{

  margin-top:auto;

}

/* =========================================
   SIDEBAR STRUCTURE FIX
========================================= */

.sidebar{

  display:flex;
  flex-direction:column;

}

.nav{

  display:flex;
  flex-direction:column;

  gap:10px;

  flex:none;
}

.sidebar-footer{

  margin-top:auto;

  padding:16px 14px 20px;
}

.logout-btn-sidebar{

  width:100%;
}


/* =====================================================
   OZONCORE PARTNER
   REFINO TIPOGRÁFICO PREMIUM
===================================================== */

/* TITULOS */

h1{
  font-size:56px !important;
  line-height:1.05;
  letter-spacing:-2px;
}

h2{
  font-size:34px !important;
}

h3{
  font-size:18px !important;
}

/* SUBTITULOS */

.sub,
.subtitle,
.page-subtitle{
  font-size:15px !important;
  color:#94A3B8 !important;
}

/* CARDS */

.card h3,
.stat-card h3,
.metric-card h3{
  font-size:13px !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#94A3B8;
}

/* VALORES */

.valor,
.metric-value,
.card-value{
  font-size:28px !important;
  font-weight:800;
}

.valor strong,
.metric-value strong{
  font-size:inherit;
}

/* LICENÇAS EM CARTEIRA */

.licencas-grid-card strong{
  font-size:18px !important;
}

.licencas-grid-card span{
  font-size:12px !important;
}

/* TABELAS */

table th{
  font-size:12px !important;
  letter-spacing:.08em;
}

table td{
  font-size:14px !important;
}

/* MENU */

.nav a{
  font-size:15px !important;
  font-weight:600;
}

.nav a i{
  width:18px;
  height:18px;
}

/* LOGO */

.logo strong{
  font-size:18px !important;
}

.logo span{
  font-size:11px !important;
  letter-spacing:.15em;
}

/* BOTÃO SAIR */

.logout-btn-sidebar{
  font-size:15px !important;
}

/* INPUTS */

input,
select,
textarea{
  font-size:14px !important;
}

/* BOTÕES */

button{
  font-size:14px !important;
}


/* ==========================================
   REFINO ENTERPRISE FINAL
========================================== */

/* HERO */

.hero h1,
.page-title,
.main h1{
  font-size:72px !important;
  line-height:1;
  letter-spacing:-3px;
}

/* SUBTITULO */

.hero p,
.page-subtitle{
  font-size:16px !important;
}

/* NOME DOS PLANOS */

.plano-titulo,
.plan-title,
.resumo-premium-card h2{
  font-size:58px !important;
  line-height:1;
}

/* DESCRIÇÃO DOS PLANOS */

.plano-desc,
.plan-description{
  font-size:14px !important;
  line-height:1.6;
}

/* BENEFÍCIOS */

.plano-beneficios li{
  font-size:14px !important;
}

/* CARD PREÇO DIREITA */

.valor-principal,
.preco-principal,
.metrica-principal{
  font-size:68px !important;
  line-height:1;
}

/* CARDS SUPERIORES */

.metric-card{
  min-height:84px !important;
}

.metric-card h3{
  font-size:12px !important;
}

.metric-card strong{
  font-size:18px !important;
}

/* TABS DOS PLANOS */

.combo-tab,
.plan-card{
  min-height:100px !important;
}

.combo-tab strong,
.plan-card strong{
  font-size:16px !important;
}

/* MENU */

.nav a{
  font-size:14px !important;
}

/* LOGO */

.logo strong{
  font-size:16px !important;
}

.logo span{
  font-size:10px !important;
  letter-spacing:.18em;
}

/* ==========================================
   REFINO VISUAL ENTERPRISE
========================================== */

/* títulos principais */

.main h1,
.hero h1,
.page-title{
  font-size:64px !important;
  line-height:.95 !important;
  letter-spacing:-2px !important;
  margin-bottom:12px !important;
}

/* subtítulos */

.main .sub,
.hero p,
.page-subtitle{
  font-size:15px !important;
  line-height:1.5 !important;
  margin-bottom:20px !important;
}

/* reduz espaços verticais */

.hero{
  gap:16px !important;
}

.page-header{
  margin-bottom:20px !important;
}

/* cards topo */

.cards,
.metric-grid,
.top-cards{
  gap:16px !important;
}

/* tabs de planos */

.combo-tabs,
.plan-tabs{
  gap:16px !important;
  margin-top:16px !important;
}

/* bloco principal */

.operacao-layout,
.plan-layout,
.content-grid{
  gap:20px !important;
  margin-top:16px !important;
}


/* ==========================================
   PAGE HERO GLOBAL
========================================== */

.page-hero{
  margin-bottom:42px;
}

.partner-mini{
  display:inline-flex;
  align-items:center;

  padding:10px 16px;

  border-radius:999px;

  background:
  linear-gradient(
    180deg,
    rgba(255,255,255,.06),
    rgba(255,255,255,.02)
  );

  border:1px solid rgba(255,255,255,.08);

  color:#FFD84D;

  font-size:13px;
  font-weight:800;

  margin-bottom:18px;
}

.page-hero h1{
  font-size:72px;
  font-weight:900;
  line-height:.92;
  letter-spacing:-2px;

  margin:0 0 18px;
}

.page-subtitle{
  font-size:18px;
  color:#94A3B8;
  line-height:1.6;
  max-width:900px;
}


/* =====================================================
   OZONCORE ENTERPRISE
   TYPOGRAPHY COMPACT V1
===================================================== */

/* TITULO PRINCIPAL */

.page-hero h1,
.page-title,
.main h1,
.hero h1,
.header h1{

  font-size:46px !important;

  line-height:.95 !important;

  letter-spacing:-2px !important;

}

/* SUBTITULOS */

.page-subtitle,
.hero p,
.header .sub,
.sub,
.subtitle{

  font-size:14px !important;

  line-height:1.5 !important;

  color:#94A3B8 !important;

}

/* TITULOS DE SEÇÃO */

h2{

  font-size:28px !important;

  line-height:1.1 !important;

}

/* TITULOS SECUNDÁRIOS */

h3{

  font-size:13px !important;

  line-height:1.2 !important;

}

/* TITULOS DOS CARDS */

.card h3,
.metric-card h3,
.stat-card h3,
.summary-card h3,
.table-card h3,
.progresso h3{

  font-size:11px !important;

  letter-spacing:.10em !important;

  text-transform:uppercase !important;

}

/* VALORES DOS CARDS */

.valor strong,
.metric-value,
.stat-value,
.card-value{

  font-size:18px !important;

  line-height:1 !important;

}

/* VALORES GRANDES */

.combo-price,
.valor-principal,
.preco-principal,
.combo-metric-value{

  font-size:52px !important;

  line-height:1 !important;

}

/* TEXTO PADRÃO */

p,
td,
li{

  font-size:13px !important;

  line-height:1.6 !important;

}

/* TABELAS */

table th{

  font-size:10px !important;

  letter-spacing:.10em !important;

}

table td{

  font-size:12px !important;

}

/* INPUTS */

input,
select,
textarea{

  font-size:13px !important;

}

/* BOTÕES */

button,
.btn-primary,
.btn-secondary{

  font-size:13px !important;

  font-weight:600 !important;

}

/* MENU LATERAL */

.nav a{

  font-size:14px !important;

  font-weight:600 !important;

}

/* LOGO */

.brand-logo,
.logo strong{

  font-size:16px !important;

}

.brand-subtitle,
.logo span{

  font-size:9px !important;

  letter-spacing:.18em !important;

}

/* DEBUG MODAIS */

.modal,
.modal *,
.modal-content,
.modal-box{

  transition:none !important;
  animation:none !important;

}
