/* ══════════════════════════════════════════════════════
   IBSEC — Curso LGPD & Privacidade
   Design System v3.0 — Dourado único accent
   ══════════════════════════════════════════════════════ */

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

  /* Accent — Dourado IBSEC (cor oficial única) */
  --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 }
html,body { overflow-x:hidden }
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 }
h1,h2,h3,p { overflow-wrap:break-word; word-break:break-word }
p { color:var(--muted2); font-size:1.03rem; line-height:1.75 }
a { text-decoration:none; color:inherit }
main,.hero-grid,.mod-grid,.footer-grid { min-width:0 }

/* ── Utilities ─────────────────────────────────────── */
.container { max-width:1160px; margin:0 auto; padding:0 28px; position:relative; z-index:1 }
.section { padding:88px 0 }
.section-alt { background:var(--surface) }
.section-head { margin-bottom:52px }
.section-head h2 { margin-top:14px }
.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:'// ' }

.gold-line { border:none; border-top:1px solid var(--gold-bg); margin:0 }

/* ── 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);
}
.btn-ghost:hover {
  background:rgba(255,255,255,.1);
  color:var(--text);
  transform:translateY(-2px);
}

/* ── 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 var(--gold-bg);
}
.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 { 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) }
.mono { font-family:'IBM Plex Mono',monospace }

/* ── 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:24px 0 64px }
.hero-grid {
  display:grid; grid-template-columns:1fr 340px;
  gap:56px; align-items:start;
}
.hero-cat {
  display:inline-flex; align-items:center; gap:6px;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.84rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold);
  border:1px solid rgba(254,213,0,.3);
  background:rgba(254,213,0,.08);
  padding:5px 12px; border-radius:6px; margin-bottom:14px;
}
.hero h1 { margin-bottom:16px }
.hero-sub { font-size:1.08rem; line-height:1.75; margin-bottom:28px }
.hero-ctas { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:32px }
.hero-pills {
  display:flex; gap:8px; flex-wrap:wrap;
  padding-top:22px; border-top:1px solid var(--gold-bg);
}
.pill {
  font-family:'IBM Plex Mono',monospace;
  font-size:0.8rem; padding:4px 10px; border-radius:20px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);
  color:var(--muted2);
}
.pill-cat {
  border-color:rgba(254,213,0,.3);
  background:rgba(254,213,0,.08);
  color:var(--gold);
}

/* ── Side Card ─────────────────────────────────────── */
.side-card {
  background:var(--surface);
  border:1px solid var(--gold-bg);
  border-top:3px solid var(--gold);
  border-radius:12px;
  padding:28px 24px;
  position:sticky; top:116px;
}
.side-title {
  font-family:'IBM Plex Mono',monospace;
  font-size:0.82rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold);
  margin-bottom:16px; padding-bottom:12px;
  border-bottom:1px solid var(--gold-bg);
}
.side-item { display:flex; gap:12px; margin-bottom:12px; align-items:flex-start }
.side-icon { font-size:1.2rem; flex-shrink:0; margin-top:2px }
.side-item strong {
  font-family:'Montserrat',sans-serif;
  font-size:1.02rem; letter-spacing:.02em;
  display:block; margin-bottom:2px;
}
.side-item p { font-size:0.9rem }
.side-div { border:none; border-top:1px solid var(--gold-bg); margin:16px 0 }
.side-note {
  font-family:'IBM Plex Mono',monospace;
  font-size:0.78rem; color:var(--muted);
  text-align:center; margin-top:10px;
}

/* ── Módulos Grid ──────────────────────────────────── */
.mod-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px }
.mod-item {
  background:var(--surface2);
  border:1px solid rgba(255,255,255,.05);
  border-radius:12px;
  padding:12px 16px;
  display:flex; align-items:center; gap:12px;
  transition:border-color .2s;
}
.mod-item:hover { border-color:rgba(254,213,0,.3) }
.mod-n {
  font-family:'IBM Plex Mono',monospace;
  font-size:0.82rem; color:var(--gold);
  font-weight:600; min-width:24px; flex-shrink:0;
}
.mod-t {
  font-family:'Montserrat',sans-serif;
  font-size:1.06rem; letter-spacing:.01em;
}

/* ── Turma & Vagas ─────────────────────────────────── */
.hero-turma { display:flex; flex-wrap:wrap; gap:18px; margin-top:18px; margin-bottom:6px }
.hero-turma-item { display:inline-flex; align-items:center; gap:8px; font-family:'IBM Plex Mono',monospace; font-size:0.88rem; color:var(--muted2); background:var(--gold-bg2); border:1px solid var(--border); border-radius:8px; padding:8px 14px }
.hero-turma-item strong { color:var(--gold); font-weight:600 }
.side-item-turma p.side-turma-highlight { color:var(--gold); font-weight:500 }

/* ── Listas ────────────────────────────────────────── */
.check-list { list-style:none; display:flex; flex-direction:column; gap:9px }
.check-list li {
  display:flex; gap:9px;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.96rem; color:var(--muted2);
  align-items:flex-start; line-height:1.5;
}
.check-list li::before { content:'✓'; color:var(--gold); font-weight:700; flex-shrink:0 }

.arrow-list { list-style:none; display:flex; flex-direction:column; gap:9px }
.arrow-list li {
  display:flex; gap:9px;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.96rem; color:var(--muted2);
  align-items:flex-start; line-height:1.5;
}
.arrow-list li::before { content:'›'; color:var(--gold); font-weight:700; flex-shrink:0; font-size:1.2rem }

/* ── Cert Banner ───────────────────────────────────── */
.cert-banner {
  background:rgba(254,213,0,.06);
  border:1px solid rgba(254,213,0,.25);
  border-radius:12px;
  padding:24px 28px;
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; flex-wrap:wrap;
}
.cert-banner-left { display:flex; align-items:center; gap:14px }
.cert-icon { font-size:2.4rem }
.cert-banner h3 { font-size:1.14rem; margin-bottom:4px }

/* ── Price Block ───────────────────────────────────── */
.price-block {
  background:rgba(254,213,0,.06);
  border:1px solid rgba(254,213,0,.15);
  border-radius:12px;
  padding:14px 16px; margin-bottom:14px; text-align:center;
}
.price-de {
  font-family:'IBM Plex Mono',monospace;
  font-size:.78rem; color:var(--muted);
  text-decoration:line-through; margin-bottom:2px;
}
.price-por {
  font-family:'Montserrat',sans-serif;
  font-size:1.56rem; font-weight:700;
  color:var(--gold); line-height:1;
}
.price-tag {
  font-family:'IBM Plex Mono',monospace;
  font-size:.68rem; color:var(--gold);
  letter-spacing:.08em; margin-top:4px;
}
.guarantee {
  display:flex; align-items:center; gap:7px; justify-content:center;
  margin-top:10px;
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem; color:var(--muted2);
}

/* ── Methodology cards ─────────────────────────────── */
.method-card {
  background:var(--surface2);
  border:1px solid rgba(255,255,255,.05);
  border-top:2px solid var(--gold);
  border-radius:12px;
  padding:22px 18px; text-align:center;
}
.method-step {
  font-family:'IBM Plex Mono',monospace;
  font-size:0.84rem; letter-spacing:.14em; text-transform:uppercase;
  margin-bottom:7px; color:var(--gold);
}
.method-icon {
  font-size:1.92rem; margin-bottom:10px; display:block;
}
.support-bar {
  background:rgba(254,213,0,.05);
  border:1px solid rgba(254,213,0,.18);
  border-radius:12px;
  padding:22px 26px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
}
.support-item { display:flex; gap:12px; align-items:flex-start }
.support-item strong {
  font-family:'Montserrat',sans-serif;
  font-size:1.02rem; letter-spacing:.02em;
  display:block; margin-bottom:3px;
}

/* ── Cert detail cards ─────────────────────────────── */
.cert-detail-card {
  background:var(--surface2);
  border:1px solid rgba(255,255,255,.05);
  border-radius:12px;
  padding:16px; text-align:center;
}
.cert-detail-label {
  font-family:'Montserrat',sans-serif;
  font-size:0.98rem;
  margin-bottom:4px;
}

/* ── 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 > 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 }

/* ── DEPOIMENTOS ── */
.test-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.test-card{background:var(--surface2);border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:24px 22px;display:flex;flex-direction:column;gap:14px;transition:border-color .2s}
.test-card:hover{border-color:rgba(254,213,0,.2)}
.test-stars{display:flex;gap:3px}
.test-quote{font-family:'IBM Plex Mono',monospace;font-size:0.92rem;color:var(--muted2);line-height:1.7;font-style:italic}
.test-author{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.06)}
.test-name{display:block;font-family:'Montserrat',sans-serif;font-size:0.96rem;font-weight:600;color:var(--text)}
.test-role{display:block;font-family:'IBM Plex Mono',monospace;font-size:0.78rem;color:var(--muted);margin-top:3px}
@media(max-width:960px){.test-grid{grid-template-columns:1fr}}
@media(max-width:600px){.test-grid{grid-template-columns:1fr}}

/* ── FAQ ───────────────────────────────────────────── */
.faq-list { max-width:780px; margin:0 auto }
.faq-item {
  background:var(--surface); border:1px solid rgba(255,255,255,.06);
  border-radius:12px; margin-bottom:10px; overflow:hidden;
}
.faq-q {
  width:100%; text-align:left;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  padding:20px 24px;
  font-family:'Montserrat',sans-serif; font-weight:600;
  font-size:1.14rem; letter-spacing:.02em; text-transform:uppercase;
  color:var(--text); background:none; border:none; cursor:pointer;
}
.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 24px;
}
.faq-item.open .faq-a { max-height:200px; padding:0 24px 20px }

/* Footer e WhatsApp → css/rodape.css (carregado via includes/rodape.php) */
/* ── Animations ────────────────────────────────────── */
@keyframes fadeUp { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }
.hero-cat,.hero h1,.hero-sub,.hero-turma,.hero-ctas,.hero-pills { animation:fadeUp .5s ease both }
.hero-cat  { animation-delay:.05s }
.hero h1   { animation-delay:.15s }
.hero-sub  { animation-delay:.25s }
.hero-turma{ animation-delay:.30s }
.hero-ctas { animation-delay:.35s }
.hero-pills{ animation-delay:.45s }

/* ── 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);
  text-decoration:none; display:block;
}
.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-grid { grid-template-columns:1fr }
  .side-card { position:static }
  .mod-grid { grid-template-columns:1fr }
  .support-bar { grid-template-columns:1fr }
  div[style*="repeat(4"] { grid-template-columns:1fr 1fr !important }
  div[style*="repeat(3"] { grid-template-columns:1fr 1fr !important }
  div[style*="1fr 1fr"][style*="gap:56px"] { grid-template-columns:1fr !important }
}
@media(max-width:600px) {
  div[style*="repeat(4"],
  div[style*="repeat(3"],
  div[style*="1fr 1fr"] { grid-template-columns:1fr !important }
}
@media(max-width:480px) {
  .hero-turma { flex-direction:column; gap:10px }
  .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 }
  .cert-banner { flex-direction:column; text-align:center }
  .cert-banner-left { flex-direction:column }
}