/* ================================================================
   Wibox SGA — Portal Público
   Paleta: azul #2563eb, cian #06b6d4, amarillo #ffc107
   ================================================================ */
:root {
  --primary:   #2563eb;
  --secondary: #1e40af;
  --accent:    #06b6d4;
  --dark:      #1f2937;
  --light:     #f8fafc;
  --yellow:    #ffc107;
  --green:     #10b981;
  --gray-text: #374151;
}
* { box-sizing: border-box; }
body { font-family: 'Inter', sans-serif; color: var(--gray-text); background: #fff; }
a { color: var(--primary); }
a:hover { color: var(--secondary); }

/* ── Navbar ── */
.navbar-custom {
  background: rgba(255,255,255,0.97) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(37,99,235,0.12);
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  transition: all .3s;
}
.navbar-custom .nav-link { color: var(--dark) !important; font-weight: 500; font-size: .95rem; padding: .5rem .9rem !important; border-radius: 8px; }
.navbar-custom .nav-link:hover { color: var(--primary) !important; background: rgba(37,99,235,.07); }
.navbar-brand-text { font-size: 1.35rem; font-weight: 800; color: var(--primary) !important; letter-spacing: -.3px; }

/* ── Buttons ── */
.btn-primary-custom {
  background: linear-gradient(135deg, var(--primary), var(--accent));
  border: none; color: #fff; font-weight: 600; border-radius: 10px;
  padding: .65rem 1.5rem; transition: all .3s;
}
.btn-primary-custom:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(37,99,235,.4); color: #fff; }
.btn-yellow { background: var(--yellow); border: none; color: var(--dark); font-weight: 700; border-radius: 10px; padding: .65rem 1.5rem; transition: all .3s; }
.btn-yellow:hover { background: #ffcd39; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(255,193,7,.4); }

/* ── Hero ── */
.hero-section {
  background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 60%, #0f2050 100%);
  color: #fff; padding: 120px 0 80px; min-height: 100vh;
  display: flex; align-items: center; position: relative; overflow: hidden;
}
.hero-section::before {
  content:''; position:absolute; top:-50%; right:-20%; width:70%; height:200%;
  background: radial-gradient(ellipse, rgba(6,182,212,.18) 0%, transparent 60%);
  pointer-events:none;
}
.hero-title { font-size: clamp(2rem,5vw,3.2rem); font-weight: 800; line-height: 1.1; }
.hero-title span { color: var(--yellow); }
.hero-subtitle { font-size: 1.1rem; opacity: .88; max-width: 520px; line-height: 1.65; }
.hero-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.25);
  border-radius:20px; padding:5px 14px; font-size:.82rem; font-weight:500;
}
.hero-icon-bg {
  width:280px; height:280px; background:rgba(255,255,255,.07);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  margin:0 auto; border:2px solid rgba(255,255,255,.15);
}
.hero-icon-bg i { font-size:8rem; opacity:.45; color:#fff; }

/* ── Stats ── */
.stats-section { background: var(--light); padding: 60px 0; }
.stat-number { font-size:2.4rem; font-weight:800; color:var(--primary); line-height:1; }
.stat-label { color:#6b7280; font-size:.9rem; margin-top:4px; }

/* ── Sections ── */
.section-py { padding: 80px 0; }
.section-title {
  font-size: clamp(1.6rem,3vw,2rem); font-weight:700; color:var(--dark);
  margin-bottom:.5rem; position:relative; display:inline-block;
}
.section-title::after {
  content:''; position:absolute; bottom:-8px; left:0;
  width:50px; height:3px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  border-radius:2px;
}
.section-subtitle { color:#6b7280; font-size:1rem; max-width:560px; }

/* ── Feature cards ── */
.feature-card {
  background:#fff; border-radius:16px; padding:2rem 1.5rem;
  box-shadow:0 4px 20px rgba(0,0,0,.07); transition:all .3s; height:100%;
  border:1px solid rgba(37,99,235,.06);
}
.feature-card:hover { transform:translateY(-6px); box-shadow:0 12px 35px rgba(37,99,235,.15); }
.feature-icon {
  width:65px; height:65px; border-radius:16px;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.2rem; font-size:1.6rem; color:#fff;
}

/* ── Module cards ── */
.module-card { border-radius:20px; overflow:hidden; height:100%; box-shadow:0 8px 30px rgba(0,0,0,.1); transition:all .3s; }
.module-card:hover { transform:translateY(-4px); box-shadow:0 16px 45px rgba(37,99,235,.18); }
.module-header { background:linear-gradient(135deg,var(--primary),var(--secondary)); color:#fff; padding:2rem; }
.module-header i { font-size:2.2rem; opacity:.9; }
.module-body { padding:1.5rem; background:#fff; }
.benefits-list { list-style:none; padding:0; margin:0; }
.benefits-list li { padding:.5rem 0 .5rem 1.8rem; position:relative; font-size:.9rem; border-bottom:1px solid #f3f4f6; }
.benefits-list li:last-child { border-bottom:none; }
.benefits-list li::before { content:'✓'; position:absolute; left:0; color:var(--green); font-weight:700; }

/* ── Tech ── */
.layer-item {
  background:#fff; border-left:4px solid var(--primary);
  padding:1rem 1.2rem; border-radius:0 10px 10px 0;
  box-shadow:0 2px 10px rgba(0,0,0,.06); display:flex; align-items:center; gap:1rem;
}
.layer-item i { font-size:1.5rem; color:var(--primary); }
.tech-badge {
  display:inline-flex; align-items:center; gap:5px;
  background:#e0f2fe; color:#0277bd; border-radius:20px;
  padding:4px 12px; font-size:.8rem; font-weight:500; margin:3px;
}

/* ── Plan cards ── */
.plan-card {
  background:#fff; border-radius:20px; padding:2rem;
  box-shadow:0 4px 20px rgba(0,0,0,.08); transition:all .3s; height:100%;
  border:2px solid transparent; position:relative;
}
.plan-card:hover { border-color:var(--primary); transform:translateY(-4px); }
.plan-card.featured { background:linear-gradient(135deg,var(--primary),var(--secondary)); color:#fff; }
.plan-badge { position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:var(--yellow); color:var(--dark); font-weight:700; font-size:.75rem; padding:4px 14px; border-radius:20px; }
.plan-price { font-size:2.2rem; font-weight:800; color:var(--primary); }
.plan-card.featured .plan-price { color:#fff; }

/* ── CTA ── */
.cta-section { background:linear-gradient(135deg,var(--dark),#374151); color:#fff; padding:80px 0; }

/* ── Footer ── */
.footer-dark { background:var(--dark); color:rgba(255,255,255,.75); padding:60px 0 30px; }
.footer-dark a { color:rgba(255,255,255,.6); text-decoration:none; }
.footer-dark a:hover { color:#fff; }
.footer-title { color:#fff; font-weight:700; margin-bottom:1rem; }

/* ── Forms ── */
.form-card { background:#fff; border-radius:20px; padding:2.5rem; box-shadow:0 8px 35px rgba(0,0,0,.1); }
.form-control, .form-select { border-radius:10px; border:1.5px solid #e5e7eb; padding:.65rem 1rem; }
.form-control:focus, .form-select:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.12); }

/* ── Alerts ── */
.alert-wibox-success { background:#d1fae5; border:none; border-left:4px solid var(--green); color:#065f46; border-radius:10px; }
.alert-wibox-error   { background:#fee2e2; border:none; border-left:4px solid #ef4444; color:#991b1b; border-radius:10px; }
.alert-wibox-info    { background:#dbeafe; border:none; border-left:4px solid var(--primary); color:#1e40af; border-radius:10px; }
.alert-wibox-warning { background:#fef3c7; border:none; border-left:4px solid var(--yellow); color:#92400e; border-radius:10px; }

/* ── Dashboard ── */
.dash-card { background:#fff; border-radius:16px; padding:1.5rem; box-shadow:0 4px 18px rgba(0,0,0,.07); }
.dash-stat { font-size:1.8rem; font-weight:800; color:var(--primary); }

/* ── Cookie banner ── */
.cookie-banner {
  position:fixed; bottom:0; left:0; right:0; z-index:9999;
  background:rgba(31,41,55,.97); color:#fff;
  padding:1rem 1.5rem; display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
  border-top:3px solid var(--primary);
}
.cookie-banner p { margin:0; font-size:.88rem; flex:1; }
