/* ══════════════════════════════════════════════════════
   IBSEC — Cursos · Design System Unificado
   Cor oficial: #FED500
   Referência: index.css v2.34
   ══════════════════════════════════════════════════════ */

:root {
  /* Fundos */
  --bg:        #0D0D1A;
  --bg-alt:    #121225;
  --surface:   #151530;
  --surface2:  #1A1A3A;
  --light:     #F0F0F0;
  --white:     #FFFFFF;

  /* Accent — Dourado IBSEC (cor oficial) */
  --gold:      #FED500;
  --gold-dark: #D4B200;
  --gold-bg:   rgba(254,213,0,0.12);
  --gold-bg2:  rgba(254,213,0,0.06);

  /* Texto */
  --text:      #FFFFFF;
  --text-dark: #1A1A2E;
  --text-body: #333333;
  --text-muted:#666666;
  --muted:     #8A8AAA;
  --muted2:    #A0A0BC;

  /* Bordas */
  --border:    rgba(254,213,0,0.15);
  --border-l:  rgba(0,0,0,0.06);
}

/* ── Reset ─────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth }
body {
  font-family:'Montserrat',sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
  overflow-x:hidden;
}

h1,h2,h3,h4 {
  font-family:'Montserrat',sans-serif;
  line-height:1.12;
  letter-spacing:-0.01em;
}
h1 { font-size:clamp(2.2rem,4.6vw,4.4rem); font-weight:800 }
h2 { font-size:clamp(1.8rem,3.6vw,2.8rem); font-weight:700 }
h3 { font-size:clamp(1.05rem,1.8vw,1.35rem); font-weight:600 }
p  { color:var(--muted2); font-size:1.03rem; line-height:1.75 }

a { text-decoration:none; color:inherit }
.mono { font-family:'IBM Plex Mono',monospace }

/* ── Utilities ─────────────────────────────────────── */
.container { max-width:1160px; margin:0 auto; padding:0 28px; position:relative; z-index:1 }
.section { padding:88px 0 }
.hl { color:var(--gold) }

.label {
  font-family:'IBM Plex Mono',monospace;
  font-size:0.84rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
}
.label::before { content:'// ' }

/* ── Buttons ───────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Montserrat',sans-serif; font-weight:600;
  font-size:1.06rem; letter-spacing:.04em;
  text-transform:uppercase;
  padding:13px 28px; border-radius:25px; cursor:pointer;
  border:none; transition:all .25s ease;
}
.btn-gold {
  background:var(--gold);
  border:2px solid var(--gold);
  color:var(--bg);
  font-weight:700;
}
.btn-gold:hover {
  background:#fff; border-color:#fff; color:var(--bg);
  box-shadow:0 0 24px rgba(254,213,0,.3);
  transform:translateY(-2px);
}
.btn-primary {
  background:transparent;
  border:2px solid var(--gold);
  color:var(--gold);
}
.btn-primary:hover {
  background:var(--gold); color:var(--bg);
  box-shadow:0 0 24px rgba(254,213,0,.3);
  transform:translateY(-2px);
}
.btn-outline {
  background:transparent;
  border:2px solid rgba(255,255,255,.4);
  color:#fff;
}
.btn-outline:hover {
  border-color:#fff;
  background:rgba(255,255,255,.08);
  transform:translateY(-2px);
}
.btn-ghost {
  background:rgba(255,255,255,.05);
  border:2px solid rgba(255,255,255,.12);
  color:var(--muted2);
  border-radius:25px;
}
.btn-ghost:hover {
  background:rgba(255,255,255,.1); color:var(--text);
  transform:translateY(-2px);
}

/* ── Badges ────────────────────────────────────────── */
.badge {
  display:inline-flex; align-items:center; gap:6px;
  font-family:'IBM Plex Mono',monospace; font-size:0.82rem;
  letter-spacing:.08em; text-transform:uppercase;
  padding:5px 12px; border-radius:6px; border:1px solid;
}
.badge-accent {
  color:var(--gold); border-color:rgba(254,213,0,.3);
  background:rgba(254,213,0,.06);
}
.badge-gold {
  color:var(--gold); border-color:rgba(254,213,0,.3);
  background:rgba(254,213,0,.06);
}
.badge-new {
  color:var(--gold); border-color:rgba(254,213,0,.25);
  background:rgba(254,213,0,.04);
}
.gold-line { border:none; border-top:1px solid var(--gold-bg); margin:0 }

/* ── Nav ───────────────────────────────────────────── */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(13,13,26,.94);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(254,213,0,.07);
}
.nav-inner {
  display:flex; align-items:center; justify-content:space-between;
  height:110px; padding:10px 0; gap:24px;
}
.nav-logo {
  display:flex; align-items:center; gap:10px;
  font-family:'Montserrat',sans-serif; font-weight:700;
  font-size:1.56rem; letter-spacing:.06em; text-transform:uppercase;
}
.nav-links { display:flex; align-items:center; gap:2px; list-style:none }
.nav-links a {
  font-family:'IBM Plex Mono',monospace; font-size:0.78rem;
  letter-spacing:.06em; color:var(--muted);
  padding:8px 14px; border-radius:6px;
  transition:color .2s,background .2s; white-space:nowrap;
}
.nav-links a:hover,
.nav-links a.active { color:var(--gold); background:var(--gold-bg2) }
.nav-actions { display:flex; align-items:center; gap:10px }
.nav-login {
  font-family:'IBM Plex Mono',monospace; font-size:0.78rem;
  color:var(--muted); padding:8px 14px; transition:color .2s; white-space:nowrap;
}
.nav-login:hover { color:var(--text) }

/* ── Breadcrumb ────────────────────────────────────── */
.breadcrumb {
  padding:130px 0 0;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.86rem; color:var(--muted);
}
.breadcrumb a { color:var(--muted); transition:color .2s }
.breadcrumb a:hover { color:var(--gold) }
.breadcrumb span { color:var(--gold); margin:0 6px }

/* ── Hero ──────────────────────────────────────────── */
.hero { padding:32px 0 72px }
.hero-inner {
  display:grid; grid-template-columns:1fr auto;
  gap:48px; align-items:center;
}
.hero-label { margin-bottom:16px }
.hero h1 { margin-bottom:18px }
.hero h1 .hl { color:var(--gold) }
.hero-sub {
  font-size:1.08rem; line-height:1.75;
  max-width:620px; margin-bottom:32px;
}
.hero-ctas { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:36px }
.hero-stats {
  display:flex; gap:28px; flex-wrap:wrap;
  padding-top:24px; border-top:1px solid var(--gold-bg);
}
.hero-stat-num {
  font-family:'Montserrat',sans-serif; font-weight:800;
  font-size:1.92rem; color:var(--gold); display:block;
}
.hero-stat-lbl {
  font-family:'IBM Plex Mono',monospace; font-size:0.82rem;
  letter-spacing:.06em; color:var(--muted);
}
.hero-visual {
  background:var(--surface2);
  border:1px solid var(--gold-bg);
  border-radius:12px; padding:28px 24px;
  min-width:260px; flex-shrink:0;
}
.hero-visual-title {
  font-family:'IBM Plex Mono',monospace; font-size:0.84rem;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold); margin-bottom:16px;
  border-bottom:1px solid var(--gold-bg); padding-bottom:12px;
}
.plan-card {
  padding:14px 16px; border-radius:12px;
  margin-bottom:10px; cursor:pointer; transition:all .2s;
}
.plan-card.featured {
  background:rgba(254,213,0,.08);
  border:1px solid rgba(254,213,0,.25);
}
.plan-card.regular {
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
}
.plan-name {
  font-family:'Montserrat',sans-serif; font-weight:600;
  font-size:1.08rem; letter-spacing:.04em;
  text-transform:uppercase; margin-bottom:4px;
}
.plan-desc {
  font-family:'IBM Plex Mono',monospace;
  font-size:0.82rem; color:var(--muted2);
}
.plan-card.featured .plan-name { color:var(--gold) }
.plan-card.regular .plan-name { color:var(--text) }

/* ── Filters ───────────────────────────────────────── */
.filter-bar {
  background:var(--surface);
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
  padding:18px 0; position:sticky; top:96px;
  z-index:100; backdrop-filter:blur(10px);
}
.filter-inner {
  display:flex; align-items:center; gap:8px;
  flex-wrap:nowrap; overflow-x:auto;
  -webkit-overflow-scrolling:touch; scrollbar-width:none;
  padding-bottom:2px;
}
.filter-inner::-webkit-scrollbar { display:none }
.filter-btn {
  font-family:'IBM Plex Mono',monospace; font-size:0.86rem;
  letter-spacing:.06em; padding:6px 12px; border-radius:20px;
  border:1px solid rgba(255,255,255,.08); background:transparent;
  color:var(--muted); cursor:pointer; transition:all .2s;
  white-space:nowrap; flex-shrink:0;
}
.filter-btn:hover { border-color:rgba(254,213,0,.3); color:var(--gold) }
.filter-btn.active {
  border-color:var(--gold);
  background:rgba(254,213,0,.1);
  color:var(--gold);
}
.filter-count {
  font-family:'IBM Plex Mono',monospace; font-size:0.82rem;
  color:var(--muted); margin-left:auto; white-space:nowrap;
}

/* ── Section Header ────────────────────────────────── */
.section-h {
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; margin-bottom:28px; padding-top:56px;
}
.section-h-left { display:flex; align-items:center; gap:14px }
.section-h h2 { font-size:clamp(1.2rem,2.5vw,1.8rem) }
.section-stripe {
  width:3px; height:28px; background:var(--gold);
  border-radius:1px; flex-shrink:0;
}
.section-count {
  font-family:'IBM Plex Mono',monospace; font-size:0.86rem;
  color:var(--muted); padding:4px 10px;
  border:1px solid rgba(255,255,255,.08); border-radius:6px;
}

/* ── Course Grid ───────────────────────────────────── */
.course-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(310px,1fr));
  gap:18px; margin-bottom:16px;
}
.course-card {
  background:var(--surface);
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px; overflow:hidden;
  display:flex; flex-direction:column;
  transition:border-color .25s,transform .25s,box-shadow .25s;
  position:relative;
}
.course-card:hover {
  border-color:rgba(254,213,0,.3);
  transform:translateY(-3px);
  box-shadow:0 20px 50px rgba(0,0,0,.4);
}
.course-card.gold-card:hover { border-color:rgba(254,213,0,.4) }
.course-thumb {
  height:110px; display:flex; align-items:center; justify-content:center;
  font-size:2.88rem; position:relative; overflow:hidden;
}

.course-thumb-img {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}

.course-thumb::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top,rgba(13,13,26,.85),transparent);
}
.course-thumb-label {
  position:absolute; bottom:0; left:0; right:0;
  padding:8px 14px; z-index:1;
  display:flex; align-items:center; justify-content:space-between;
}
.course-body { padding:18px 20px; flex:1; display:flex; flex-direction:column }
.course-badges { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px }
.course-badge-off {
  display:inline-block; font-family:'IBM Plex Mono',monospace;
  font-size:.64rem; letter-spacing:.08em;
  color:var(--bg); background:var(--gold);
  padding:2px 7px; border-radius:4px;
  margin-bottom:6px; font-weight:600;
}
.course-card h3 { font-size:clamp(.9rem,1.6vw,1.05rem); margin-bottom:9px; line-height:1.2 }
.course-card p { font-size:0.94rem; margin-bottom:16px; flex:1 }
.course-tags { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px }
.course-tag {
  font-family:'IBM Plex Mono',monospace; font-size:0.76rem;
  color:var(--muted); background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07);
  padding:3px 8px; border-radius:6px;
}
.course-footer {
  display:flex; align-items:center; justify-content:space-between;
  padding-top:14px; border-top:1px solid rgba(255,255,255,.05);
  margin-top:auto;
}
.course-meta {
  font-family:'IBM Plex Mono',monospace; font-size:0.8rem;
  color:var(--muted); line-height:1.4;
}
.course-cta {
  font-family:'Montserrat',sans-serif; font-weight:600;
  font-size:0.94rem; letter-spacing:.04em; text-transform:uppercase;
  color:var(--gold); padding:8px 14px;
  border:1px solid rgba(254,213,0,.3); border-radius:20px;
  transition:all .2s; white-space:nowrap;
}
.course-cta:hover { background:var(--gold); color:var(--bg) }
.gold-card .course-cta { color:var(--gold); border-color:rgba(254,213,0,.3) }
.gold-card .course-cta:hover { background:var(--gold); color:var(--bg) }
.course-hot {
  position:absolute; top:12px; right:12px;
  font-family:'IBM Plex Mono',monospace; font-size:0.74rem;
  letter-spacing:.06em; background:var(--gold); color:var(--bg);
  padding:3px 8px; border-radius:4px;
  font-weight:600; text-transform:uppercase; z-index:2;
}

/* ── Pacotes ───────────────────────────────────────── */
.pacotes-section {
  background:var(--surface);
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
  padding:60px 0; margin:56px 0 0;
}
.pacotes-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:20px; margin-top:40px;
}
.pacote-card {
  border-radius:12px; padding:30px 26px;
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;
}
.pacote-card.individual {
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
}
.pacote-card.vitalicio {
  background:linear-gradient(160deg,rgba(254,213,0,.08) 0%,var(--surface) 60%);
  border:1px solid rgba(254,213,0,.25);
}
.pacote-card.plataforma {
  background:linear-gradient(160deg,rgba(254,213,0,.06) 0%,var(--surface) 60%);
  border:1px solid rgba(254,213,0,.2);
}
.pacote-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
}
.individual::before { background:rgba(255,255,255,.1) }
.vitalicio::before { background:var(--gold) }
.plataforma::before { background:var(--gold-dark) }
.pacote-label {
  font-family:'IBM Plex Mono',monospace; font-size:0.84rem;
  letter-spacing:.16em; text-transform:uppercase;
  margin-bottom:14px;
}
.individual .pacote-label { color:var(--muted) }
.vitalicio .pacote-label { color:var(--gold) }
.plataforma .pacote-label { color:var(--gold-dark) }
.pacote-card h3 { font-size:1.32rem; margin-bottom:10px }
.pacote-card p { font-size:0.96rem; margin-bottom:20px; flex:1 }
.pacote-feat { display:flex; flex-direction:column; gap:8px; margin-bottom:24px }
.pacote-feat li {
  display:flex; align-items:flex-start; gap:8px;
  font-family:'IBM Plex Mono',monospace; font-size:0.88rem;
  color:var(--muted2); list-style:none;
}
.pacote-feat li::before { content:'✓'; color:var(--gold); flex-shrink:0; font-weight:700 }
.best-badge {
  position:absolute; top:18px; right:18px;
  background:var(--gold); color:var(--bg);
  font-family:'IBM Plex Mono',monospace; font-size:0.76rem;
  font-weight:600; padding:3px 9px; border-radius:4px;
  letter-spacing:.06em; text-transform:uppercase;
}

/* ── Depoimentos ───────────────────────────────────── */
.test-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.test-card {
  background:var(--surface);
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px; padding:24px;
  display:flex; flex-direction:column;
  transition:border-color .25s;
}
.test-card:hover { border-color:rgba(254,213,0,.2) }
.test-stars { color:var(--gold); font-size:1.08rem; letter-spacing:3px; margin-bottom:12px }
.test-quote {
  font-size:0.98rem; color:var(--muted2);
  line-height:1.75; margin-bottom:16px; flex:1; font-style:italic;
}
.test-author { display:flex; align-items:center; gap:12px }
.test-av {
  width:38px; height:38px; border-radius:8px; flex-shrink:0;
  background:var(--gold); display:flex; align-items:center; justify-content:center;
  font-family:'Montserrat',sans-serif; font-weight:700;
  color:var(--bg); font-size:1.06rem;
}
.test-name { font-weight:600; font-size:1.02rem }
.test-role { font-family:'IBM Plex Mono',monospace; font-size:0.8rem; color:var(--muted) }

/* ── FAQ ───────────────────────────────────────────── */
.faq-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
  max-width:900px; margin:0 auto;
}
.faq-item {
  background:var(--surface);
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px; overflow:hidden;
}
.faq-q {
  width:100%; text-align:left;
  display:flex; justify-content:space-between; align-items:flex-start;
  gap:12px; padding:18px 20px;
  font-family:'Montserrat',sans-serif; font-weight:600;
  font-size:1.06rem; letter-spacing:.01em;
  color:var(--text); background:none; border:none;
  cursor:pointer; line-height:1.3;
}
.faq-arrow { color:var(--gold); font-size:1.32rem; transition:transform .25s; flex-shrink:0 }
.faq-item.open .faq-arrow { transform:rotate(45deg) }
.faq-a {
  max-height:0; overflow:hidden; transition:max-height .35s ease,padding .35s;
  font-size:0.98rem; color:var(--muted2); line-height:1.7; padding:0 20px;
}
.faq-item.open .faq-a { max-height:300px; padding:0 20px 18px }

/* ── CTA Final ─────────────────────────────────────── */
.cta-final {
  text-align:center; padding:60px 0 48px !important;
  border-top:1px solid var(--gold-bg);
  position:relative; overflow:hidden;
}
.cta-final h2 { margin-bottom:14px }
.cta-final h2 .hl { color:var(--gold) }
.cta-final > div > p { max-width:520px; margin:0 auto 34px }
.cta-actions { display:flex; justify-content:center; gap:14px; flex-wrap:wrap }
.cta-note {
  margin-top:18px; font-family:'IBM Plex Mono',monospace;
  font-size:0.84rem; color:var(--muted);
}
.cta-final .cta-note { margin-top:32px }

/* Footer e WhatsApp → css/rodape.css (carregado via includes/rodape.php) */

/* ── Section helpers ───────────────────────────────── */
.section-alt { background:var(--surface) }

/* ── Animations ────────────────────────────────────── */
@keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
.hero-label { animation:fadeUp .7s ease .1s both }
.hero h1 { animation:fadeUp .7s ease .22s both }
.hero-sub { animation:fadeUp .7s ease .34s both }
.hero-ctas { animation:fadeUp .7s ease .46s both }
.hero-stats { animation:fadeUp .7s ease .58s both }

/* ── Hamburger mobile ──────────────────────────────── */
.nav-toggle { display:none }
.nav-hamburger {
  display:none; flex-direction:column; justify-content:space-between;
  width:28px; height:20px; cursor:pointer; z-index:1100; flex-shrink:0;
}
.nav-hamburger span {
  display:block; height:2px; width:100%; background:var(--text);
  border-radius:2px; transition:all .3s ease;
}
.nav-mobile-menu {
  display:none; position:absolute; top:100%; left:0; right:0;
  background:rgba(13,13,26,.98); backdrop-filter:blur(20px);
  border-bottom:1px solid var(--gold-bg);
  flex-direction:column; padding:12px 0; z-index:999;
}
.nav-mobile-menu a {
  font-family:'IBM Plex Mono',monospace; font-size:0.84rem;
  letter-spacing:.06em; color:var(--muted);
  padding:14px 24px; transition:color .2s,background .2s;
  border-bottom:1px solid rgba(255,255,255,.04);
}
.nav-mobile-menu a:last-child { border-bottom:none }
.nav-mobile-menu a:hover,
.nav-mobile-menu a.active { color:var(--gold); background:var(--gold-bg2) }
.nav-mobile-menu .nav-mobile-login { color:var(--muted) }
.nav-mobile-menu .nav-mobile-cta {
  color:var(--gold); font-weight:600;
  border-top:1px solid rgba(254,213,0,.15); margin-top:4px;
}

/* ── Responsive ────────────────────────────────────── */
@media(max-width:1024px) {
  .nav-hamburger { display:flex }
  .nav-links { display:none }
  .nav-actions { display:none }
  .nav-toggle:checked ~ .nav-mobile-menu { display:flex }
  .nav-toggle:checked + .nav-hamburger span:nth-child(1) { transform:translateY(9px) rotate(45deg) }
  .nav-toggle:checked + .nav-hamburger span:nth-child(2) { opacity:0; transform:scaleX(0) }
  .nav-toggle:checked + .nav-hamburger span:nth-child(3) { transform:translateY(-9px) rotate(-45deg) }
}
@media(min-width:1025px) {
  .nav-links { display:flex }
  .nav-actions { display:flex }
  .nav-hamburger { display:none }
  .nav-mobile-menu { display:none !important }
}

@media(max-width:960px) {
  .hero-inner { grid-template-columns:1fr }
  .hero-visual { display:none }
  .pacotes-grid { grid-template-columns:1fr }
  .test-grid { grid-template-columns:1fr 1fr }
  .faq-grid { grid-template-columns:1fr }
}
@media(max-width:600px) {
  .test-grid { grid-template-columns:1fr }
  .course-grid { grid-template-columns:1fr }
  .section-h { flex-direction:column; align-items:flex-start; gap:12px }
  .section-h > a, .section-h > .btn { align-self:flex-start }
  .filter-bar .container { padding:0; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none }
  .filter-bar .container::-webkit-scrollbar { display:none }
  .filter-inner { width:max-content; min-width:100%; flex-wrap:nowrap; padding:0 16px 2px }
  .filter-count { padding-right:16px }
}
@media(max-width:480px) {
  .hero-ctas { flex-direction:column }
  .hero-ctas .btn { width:100%; text-align:center; justify-content:center }
  .cta-actions { flex-direction:column }
  .cta-actions .btn { width:100%; text-align:center; justify-content:center }
  .pacotes-grid { gap:14px }
}