:root{
  --brand-dark:#141d2c;
  --brand-ink:#0f1622;
  --brand-accent:#009dd3;
  --brand-accent-50:#66c9e6;
}
*{box-sizing:border-box}
html{ scroll-behavior:smooth; }
html, body{ height:100%; }
body{ font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; background:#0b121e; color:#111; display:flex; flex-direction:column; }
main{ flex:1 0 auto; padding-bottom:0; }
footer{ flex-shrink:0; margin-top:0 !important; }

/* Colors & helpers */
.bg-brand-dark{background:var(--brand-dark)!important}
.bg-brand-ink{background:var(--brand-ink)!important}
.text-brand{color:var(--brand-dark)}
.text-accent{color:var(--brand-accent)!important}
.text-accent-50{color:var(--brand-accent-50)!important}
.border-accent{border-color:var(--brand-accent)!important}
.bg-accent-subtle{background:rgba(0,157,211,.15)!important}
.link-accent{color:var(--brand-accent);text-decoration:none}
.link-accent:hover{opacity:.85}

.btn-accent{background:var(--brand-accent);border-color:var(--brand-accent);color:#fff}
.btn-accent:hover{filter:brightness(.95);color:#fff}
.btn-outline-accent{border-color:var(--brand-accent);color:var(--brand-accent);background:transparent}
.btn-outline-accent:hover{background:var(--brand-accent);color:#fff}
.btn-gradient{ background:linear-gradient(135deg,var(--brand-accent),#00b6f0); color:#fff; border:0; box-shadow:0 .75rem 1.75rem rgba(0,157,211,.35); }
.btn-gradient:hover{ filter:brightness(.95); color:#fff }

/* Glow button */
.btn-glow{
  background: linear-gradient(135deg, var(--brand-accent), #00b6f0);
  color:#fff; border:0;
  box-shadow:0 0 18px rgba(0,157,211,.6), 0 0 36px rgba(0,182,240,.35);
  transition: all .25s ease-in-out;
}
.btn-glow:hover{ filter:brightness(1.05); transform:translateY(-2px); box-shadow:0 0 22px rgba(0,157,211,.8), 0 0 44px rgba(0,182,240,.45); color:#fff; }

#mainNav{ z-index:2000; }
.navbar-glass{
  background: linear-gradient(180deg, rgba(20,29,44,.75), rgba(20,29,44,.35));
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.navbar .nav-link{color:#cbd5e1}
.navbar .nav-link.active,.navbar .nav-link:hover{color:#fff}
.navbar-brand img{ width:36px; height:36px; object-fit:contain; }

/* Hero */
.hero-wrap{position:relative;overflow:hidden}
.bg-hero{
  background: radial-gradient(1000px 500px at -10% -10%, rgba(0,157,211,.25), transparent 60%),
              radial-gradient(600px 300px at 110% 10%, rgba(0,157,211,.2), transparent 60%),
              linear-gradient(180deg, #0b121e 0%, #141d2c 50%, #0b121e 100%);
  color:#fff;
}
.bg-hero-subtle{background:linear-gradient(180deg,#0b121e 0%,#141d2c 100%)}
.hero-card{max-width:420px;border-radius:1rem;background:rgba(255,255,255,.02);backdrop-filter: blur(4px)}
.hero-card img{filter:drop-shadow(0 12px 30px rgba(0,0,0,.35))}

/* Buttons */
.btn-cta{font-weight:700;padding:.9rem 2.2rem;border-radius:.75rem;text-transform:uppercase;letter-spacing:.5px;}
.btn-cta-outline{font-weight:700;padding:.9rem 2.2rem;border-radius:.75rem;}

/* Sections */
.section-xl{ padding-top:6rem; padding-bottom:6rem; }
@media (max-width:575.98px){ .section-xl{ padding-top:4.5rem; padding-bottom:4.5rem; } }

/* Features */
.feature .icon-circle{ width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(0,157,211,.12);color:var(--brand-accent);font-size:1.25rem; }
.feature{border:0;border-radius:1rem}
.card{border-radius:1rem}

/* Plans */
.plans-gradient{
  background:
    radial-gradient(900px 400px at 0% 0%, rgba(0,157,211,.25), transparent 60%),
    radial-gradient(700px 300px at 100% 10%, rgba(0,157,211,.18), transparent 60%),
    linear-gradient(180deg, #0b121e 0%, #0e1624 40%, #0b121e 100%);
  padding-top:6rem; padding-bottom:6rem;
}
.pricing-modern,.pricing-pro{
  background:linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  border-radius:1.25rem; transition:transform .25s, box-shadow .25s, border-color .25s; color:#fff;
}
.pricing-modern .pricing-inner,.pricing-pro .pricing-inner{
  background:radial-gradient(800px 300px at 0% 0%, rgba(0,157,211,.08), transparent 70%);
  border-radius:1.1rem; padding:2.25rem;
}
.pricing-pro{ border:1px solid rgba(0,157,211,.55); box-shadow:0 1rem 2.5rem rgba(0,157,211,.25); position:relative; overflow:hidden; }
.pricing-pro::before{ content:""; position:absolute; inset:-1px; background:linear-gradient(135deg, rgba(0,157,211,.35), rgba(0,157,211,0) 50%); border-radius:1.25rem; z-index:0; pointer-events:none; }
.pricing-modern:hover,.pricing-pro:hover{ transform:translateY(-6px) scale(1.01); box-shadow:0 1.5rem 3rem rgba(0,0,0,.45), 0 1rem 3rem rgba(0,157,211,.25); border-color:rgba(0,157,211,.55); }
.badge-popular{ position:absolute; top:12px; right:12px; background:var(--brand-accent); color:#fff; padding:.35rem .6rem; border-radius:2rem; font-size:.75rem; font-weight:600; box-shadow:0 6px 18px rgba(0,157,211,.35); }

/* Glass card + forms (dark) */
.card.glass{
  background:linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  color:#fff;
}
.form-modern .form-label{ color:#ffffff; }
.form-modern .form-control,.form-modern .form-select,.form-modern textarea{
  width:100%;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);
  color:#fff;
}
.form-modern .form-control:focus,.form-modern .form-select:focus,.form-modern textarea:focus{
  border-color:var(--brand-accent);
  box-shadow:0 0 0 .25rem rgba(0,157,211,.25);
  color:#fff;
}
.form-modern .form-text,.form-modern .invalid-feedback{ color:#cbd5e1; }
.form-modern ::placeholder{ color:#cbd5e199; }

/* >>> Select (combobox) com fundo preto <<< */
.form-modern .form-select{
  background:rgba(255,255,255,.06);      /* fundo preto do campo */
  color:#fff;
}
.form-modern .form-select:focus{
  background-color:#000;      /* mantém preto no foco */
  color:#fff;
}
.form-modern .form-select option{
  background-color:#000;      /* fundo da lista (browsers que suportam) */
  color:#fff;
}

/* Auth layout */
.auth-center .container{ min-height:calc(100vh - 500px); display:flex; align-items:center; justify-content:center; }
@media (max-width:575.98px){ .auth-center .container{ min-height:calc(100vh - 120px); } }
.auth-panel{ width:100%; max-width:820px; }
.auth-center .card.glass{ width:100%; }

/* Small details */
.display-5.fw-extrabold{font-weight:800}
.shadow-xl{box-shadow:0 1.25rem 2.5rem rgba(0,0,0,.35)!important}
footer a{opacity:.9} footer a:hover{opacity:1}
section{ scroll-margin-top:72px; }

/* ===== Modal polish ===== */
.modal-elevate{ z-index:2050 !important; }
.modal-backdrop{ z-index:2045 !important; }
.modal-backdrop.show{ opacity:.65; }

.modal-glass{
  position:relative;
  background:
    radial-gradient(1000px 400px at 0% 0%, rgba(0,157,211,.12), transparent 55%),
    linear-gradient(180deg, #0f1622 0%, #141d2c 60%, #0b121e 100%);
  color:#e6f1f8; border-radius:1rem;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 1.25rem 3rem rgba(0,0,0,.6), 0 0 0 1px rgba(0,157,211,.25) inset;
  backdrop-filter: blur(10px);
}
.modal-glass::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  box-shadow:0 0 0 1px rgba(0,157,211,.18) inset, 0 10px 50px rgba(0,157,211,.08) inset;
}
.modal-glass .modal-header{ background:linear-gradient(90deg, rgba(0,157,211,.20), rgba(0,157,211,0)); border-bottom:1px solid rgba(255,255,255,.08); }
.modal-glass .modal-title{ color:#fff; }
.modal-glass .modal-footer{ border-top:1px solid rgba(255,255,255,.08); }
.btn-close-white{ filter:invert(1) grayscale(100%) brightness(200%); opacity:.85; }
.btn-close-white:hover{ opacity:1; }
.modal-glass .table{
  --bs-table-bg:transparent;
  --bs-table-striped-bg:rgba(255,255,255,.04);
  --bs-table-striped-color:#e6f1f8;
  --bs-table-color:#e6f1f8;
  border-color:rgba(255,255,255,.08);
}
.modal-glass th{ color:#bfeaff; font-weight:700; }

/* WhatsApp floating button */
.whatsapp-float{
  position:fixed;
  right:calc(18px + env(safe-area-inset-right, 0px));
  bottom:calc(18px + env(safe-area-inset-bottom, 0px));
  z-index:2030;                  /* acima do conteúdo, abaixo do backdrop (2045) */
  width:56px; height:56px;
  border-radius:50%;
  display:grid; place-items:center;
  background:linear-gradient(135deg,#25D366,#20bd5a);
  color:#fff; font-size:1.5rem;
  text-decoration:none;
  box-shadow:0 8px 24px rgba(32,189,90,.35);
  transition:transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.whatsapp-float:hover{
  filter:brightness(.95);
  transform:translateY(-2px);
  color:#fff; text-decoration:none;
  box-shadow:0 12px 28px rgba(32,189,90,.45);
}

/* HERO “chips” (modern glossy pills) */
.hero-chips{ position:relative; z-index:1; }

.chip{
  display:inline-flex; align-items:center; gap:.65rem;
  padding:.78rem 1.15rem;
  border-radius:999px;

  /* glassy gradient + thin border */
  background:
    radial-gradient(120% 140% at 10% 10%, rgba(255,255,255,.10) 0%, rgba(255,255,255,.04) 35%, rgba(255,255,255,.02) 100%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(6px);

  color:#e6f1f8;
  font-weight:600;
  letter-spacing:.2px;

  /* depth */
  box-shadow:
    0 10px 22px rgba(0,0,0,.30),
    inset 0 0 0 1px rgba(255,255,255,.05);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.chip i{
  font-size:1.1rem;
  opacity:.95;
}

/* hover: slight lift + accent glow */
.chip:hover{
  transform: translateY(-2px);
  border-color: rgba(0,157,211,.55);
  box-shadow:
    0 14px 26px rgba(0,0,0,.38),
    0 0 0 1px rgba(0,157,211,.35) inset,
    0 0 24px rgba(0,157,211,.18);
}

/* tighter on smaller widths */
@media (max-width: 991.98px){
  .chip{ padding:.65rem 1rem; }
}
@media (max-width: 575.98px){
  .chip{ padding:.6rem .9rem; font-size:.95rem; }
}