/* ============================================================
   DESIGN SYSTEM GOV.BR — CLONE MEI 2027
   Fontes oficiais Rawline + cores oficiais + mobile-first
   ============================================================ */

/* ---------- Fontes oficiais gov.br (Rawline) ---------- */
@font-face {
  font-family: 'Rawline';
  src: url('fonts/rawline-300.woff2') format('woff2');
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Rawline';
  src: url('fonts/rawline-400.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Rawline';
  src: url('fonts/rawline-400i.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Rawline';
  src: url('fonts/rawline-500.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Rawline';
  src: url('fonts/rawline-600.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Rawline';
  src: url('fonts/rawline-700.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

html, body {
  max-width: 100%;
  overflow-x: hidden;
  position: relative;
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Rawline', 'Segoe UI', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  color: #333333;
  background: #ffffff;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }

img { max-width: 100%; height: auto; display: block; }

a { color: #1351B8; text-decoration: none; }
a:visited { color: #1351B8; }
a:hover { color: #0C3268; text-decoration: underline; }

button { font-family: inherit; }
input, select, textarea { font-family: inherit; font-size: 16px; }

/* ---------- Container ---------- */
.container { width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.header-wrapper.secondary { max-width: 100%; overflow: hidden; }

/* ---------- Cabeçalho Oficial gov.br (Conforme Padrão Gov.br / media_1793296454638_549a80fc.png) ---------- */
.barra-gov-oficial {
  background: #ffffff;
  border-bottom: 3px solid #1351b8;
  font-family: 'Rawline', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  position: relative;
  z-index: 100;
  width: 100%;
  max-width: 100%;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}
.barra-gov-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 10px 16px 12px 16px;
  display: flex;
  flex-direction: column;
}
.barra-gov-top-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 8px;
}
.barra-gov-top-links {
  display: flex;
  align-items: center;
  gap: 18px;
}
.gov-top-link {
  color: #1351b8;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  line-height: 1;
  background: transparent;
  border: none;
  padding: 2px;
}
.gov-top-link i {
  font-size: 15px;
  color: #1351b8;
}
.gov-top-link .fa-chevron-down {
  font-size: 11px;
  margin-left: 2px;
}

.barra-gov-main-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.barra-gov-left {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.barra-logo-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none !important;
}
.barra-logo-img {
  height: 32px;
  width: auto;
  display: block;
}
.barra-btn-dots {
  background: transparent;
  border: none;
  color: #1351b8;
  font-size: 20px;
  padding: 2px 4px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.barra-divisoria {
  display: inline-block;
  width: 1.5px;
  height: 28px;
  background: #d0d0d0;
  margin: 0 2px;
}

.barra-gov-right {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.barra-btn-atalhos {
  background: #ffffff;
  border: 1.5px solid #1351b8;
  color: #1351b8;
  font-size: 13.5px;
  font-weight: 700;
  padding: 7px 14px;
  border-radius: 24px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none !important;
  line-height: 1.2;
}
.barra-btn-atalhos i {
  font-size: 14px;
  color: #1351b8;
}
.barra-btn-entrar {
  background: #1351b8;
  border: 1.5px solid #1351b8;
  color: #ffffff !important;
  font-size: 13.5px;
  font-weight: 700;
  padding: 7px 16px;
  border-radius: 24px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none !important;
  line-height: 1.2;
}
.barra-btn-entrar i {
  font-size: 14px;
  color: #ffffff;
}

/* Maior destaque em smartphones (conforme solicitação do usuário) */
@media (max-width: 480px) {
  .barra-gov-container {
    padding: 10px 14px 12px 14px;
  }
  .barra-gov-top-row {
    margin-bottom: 7px;
  }
  .barra-gov-top-links {
    gap: 16px;
  }
  .gov-top-link {
    font-size: 13.5px;
  }
  .gov-top-link i {
    font-size: 14px;
  }
  .barra-logo-img {
    height: 30px;
  }
  .barra-btn-dots {
    font-size: 18px;
    padding: 2px;
  }
  .barra-divisoria {
    height: 26px;
    margin: 0 1px;
  }
  .barra-gov-right {
    gap: 6px;
  }
  .barra-btn-atalhos {
    font-size: 12.5px;
    padding: 6px 12px;
    gap: 6px;
  }
  .barra-btn-atalhos i {
    font-size: 13px;
  }
  .barra-btn-entrar {
    font-size: 12.5px;
    padding: 6px 14px;
    gap: 6px;
  }
  .barra-btn-entrar i {
    font-size: 13px;
  }
}
@media (max-width: 360px) {
  .barra-gov-container {
    padding: 8px 10px 10px 10px;
  }
  .barra-gov-top-links {
    gap: 12px;
  }
  .barra-logo-img {
    height: 27px;
  }
  .barra-btn-atalhos {
    font-size: 12px;
    padding: 5px 9px;
  }
  .barra-btn-entrar {
    font-size: 12px;
    padding: 5px 11px;
  }
}

/* ---------- Header gov.br ---------- */
#site-header {
  background: #1351B8;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
#site-header .main .header-wrapper {
  max-width: 1280px; margin: 0 auto; padding: 16px 20px;
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  flex-wrap: wrap;
}
.gov-logo-link {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none !important;
}
.gov-logo-link:hover { text-decoration: none !important; }
.gov-header-bars {
  color: #ffffff;
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  flex-shrink: 0;
  cursor: pointer;
  height: 15px;
}
.gov-header-bars i {
  font-size: 15px;
  line-height: 1;
  display: block;
}
.site-title {
  color: #ffffff;
  font-size: 15px !important;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.1px;
  display: inline-flex;
  align-items: center;
}
@media (max-width: 480px) {
  #site-header .main .header-wrapper {
    padding: 10px 14px;
  }
  .gov-logo-link {
    gap: 10px;
  }
  .gov-header-bars,
  .gov-header-bars i {
    font-size: 14px;
    height: 14px;
  }
  .site-title {
    font-size: 14.5px !important;
    line-height: 1.2;
  }
}
.busca-gov {
  display: flex; align-items: center; background: #ffffff;
  border-radius: 4px; overflow: hidden; min-width: 260px; max-width: 400px;
}
.busca-gov input { border: none; padding: 11px 14px; font-size: 16px; flex: 1; outline: none; color: #333; }
.busca-gov button {
  background: #FFCD07; border: none; padding: 11px 16px; cursor: pointer;
  color: #0C3268; font-size: 16px; min-width: 48px;
}
.busca-gov button:hover { background: #F5C400; }

/* ---------- Menu de canais ---------- */
.menu-canais {
  background: #0C3268;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.menu-canais ul {
  max-width: 1280px; margin: 0 auto; list-style: none;
  display: flex; flex-wrap: nowrap; overflow-x: auto;
  padding: 0 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.menu-canais ul::-webkit-scrollbar { display: none; }
.menu-canais ul li { flex-shrink: 0; }
.menu-canais ul li a {
  display: block; color: #ffffff; text-decoration: none;
  font-size: 15px; padding: 13px 16px; font-weight: 500; white-space: nowrap;
}
.menu-canais ul li a:hover,
.menu-canais ul li a.ativo { background: #1351B8; color: #FFCD07; text-decoration: none; }

/* ---------- Faixa amarela ---------- */
.faixa-amarela { height: 5px; width: 100%; background: #FFCD07; }

/* ---------- Breadcrumb ---------- */
.breadcrumb-gov {
  max-width: 1100px; margin: 0 auto; padding: 16px 20px;
  font-size: 14px; color: #5c6b80;
}
.breadcrumb-gov a { color: #1351B8; text-decoration: none; font-weight: 600; }

/* ---------- Hero da oferta ---------- */
.hero-mei {
  background: linear-gradient(135deg, #1351B8 0%, #0C3268 100%);
  color: #ffffff; padding: 56px 20px; text-align: center;
}
.hero-mei .container { max-width: 960px; margin: 0 auto; }
.selo-governo {
  display: inline-block; background: #FFCD07; color: #0C3268;
  font-weight: 700; font-size: 14px; padding: 8px 18px;
  border-radius: 20px; letter-spacing: 0.4px; text-transform: uppercase;
  margin-bottom: 20px;
}
.hero-mei h2 { font-size: 30px; font-weight: 700; line-height: 1.25; margin-bottom: 12px; }
.hero-mei h2 .valor-beneficio { color: #FFCD07; font-size: 44px; display: block; margin-top: 8px; }
.hero-mei p {
  font-size: 18px; max-width: 680px; margin: 0 auto 28px auto;
  line-height: 1.55; color: #dce9ff;
}
.hero-mei p strong { color: #ffffff; }

/* ---------- Botão CTA ---------- */
.btn-gov-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  background: #268744; color: #ffffff !important;
  font-family: 'Rawline', 'Segoe UI', Arial, sans-serif;
  font-size: 18px; font-weight: 700;
  padding: 16px 44px; min-height: 56px;
  border-radius: 28px; text-decoration: none !important;
  border: none; cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  transition: transform 0.15s, box-shadow 0.15s, background 0.15s;
  -webkit-appearance: none; appearance: none;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
  letter-spacing: 0.3px;
}
.btn-gov-cta:visited, .btn-gov-cta:active {
  color: #ffffff !important;
  text-decoration: none !important;
}
.btn-gov-cta:hover, .btn-gov-cta:focus {
  background: #1f6f37; color: #ffffff !important; text-decoration: none !important;
  transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}
.btn-gov-cta i {
  color: #ffffff !important;
  font-size: 19px;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.3));
}
.btn-gov-cta:disabled { opacity: 0.6; cursor: wait; }
.btn-block { width: 100%; }

.hero-mei .info-strip {
  margin-top: 32px; display: flex; flex-wrap: wrap;
  justify-content: center; gap: 12px 24px;
  font-size: 14px; color: #b8d2f5;
}
.hero-mei .info-strip span { display: flex; align-items: center; gap: 6px; }

/* ---------- Seções ---------- */
.section-gov { padding: 48px 20px; }
.section-gov .container { max-width: 1100px; margin: 0 auto; }
.section-title {
  font-size: 24px; font-weight: 700; color: #0C3268;
  border-bottom: 3px solid #FFCD07; display: inline-block;
  padding-bottom: 6px; margin-bottom: 28px;
}

/* ---------- Grid de cards ---------- */
.grid-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
}
.card-gov {
  background: #ffffff; border: 1px solid #dbe4ef;
  border-top: 4px solid #1351B8; border-radius: 4px;
  padding: 24px 20px;
  transition: box-shadow 0.2s, transform 0.2s;
  display: flex; flex-direction: column;
}
.card-gov:hover { box-shadow: 0 8px 20px rgba(19, 81, 184, 0.14); transform: translateY(-3px); }
.card-ico {
  width: 56px; height: 56px; background: #eaf1fc; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #1351B8; font-size: 22px; margin-bottom: 16px; flex-shrink: 0;
}
.card-gov h3 { font-size: 17px; font-weight: 700; color: #0C3268; margin-bottom: 8px; }
.card-gov p { font-size: 15px; color: #555555; line-height: 1.55; margin-bottom: 12px; flex-grow: 1; }
.card-gov a { color: #1351B8; font-weight: 700; font-size: 15px; text-decoration: none; }
.card-gov a:hover { text-decoration: underline; }
.card-gov .card-img { border-radius: 4px; margin-bottom: 12px; width: 100%; }

/* ---------- Passos / requisitos ---------- */
.step-item { display: flex; gap: 16px; margin-bottom: 24px; align-items: flex-start; }
.step-num {
  flex-shrink: 0; width: 44px; height: 44px;
  background: #1351B8; color: #FFCD07;
  font-weight: 700; font-size: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.step-item h4 { margin-bottom: 4px; font-size: 17px; color: #0C3268; font-weight: 700; }
.step-item p { margin: 0; font-size: 15px; color: #555555; line-height: 1.55; }

/* ---------- Callouts ---------- */
.callout-gov {
  background: #fff8e1; border-left: 5px solid #FFCD07;
  padding: 16px 20px; border-radius: 4px; margin: 24px 0;
  font-size: 15px; color: #6b5900; line-height: 1.6;
}
.callout-gov.azul { background: #eaf1fc; border-left-color: #1351B8; color: #1c3a6e; }

/* ---------- Box de valor (resumo benefício) ---------- */
.valor-box {
  background: #ffffff; border: 2px solid #1351B8;
  border-radius: 8px; max-width: 640px; margin: 0 auto 40px auto;
  overflow: hidden;
}
.valor-box .vb-head {
  background: #1351B8; color: #ffffff; padding: 14px 24px;
  font-weight: 700; font-size: 16px; display: flex;
  justify-content: space-between; align-items: center; gap: 10px;
}
.valor-box .vb-body { padding: 20px 24px; }
.valor-box .linha {
  display: flex; justify-content: space-between; gap: 16px;
  padding: 10px 0; font-size: 15px; flex-wrap: wrap;
}
.valor-box .linha.total {
  border-top: 2px dashed #cccccc; margin-top: 8px;
  padding-top: 16px; font-weight: 700; font-size: 19px; color: #268744;
}

/* ---------- Formulários ---------- */
.form-gov { max-width: 560px; margin: 0 auto; }
.form-gov label {
  display: block; font-weight: 700; font-size: 15px;
  color: #0C3268; margin-bottom: 6px;
}
.form-gov .campo {
  width: 100%; padding: 14px 16px;
  border: 1px solid #7f9fc4; border-radius: 4px;
  font-size: 16px; font-family: 'Rawline', 'Segoe UI', Arial, sans-serif;
  margin-bottom: 18px; background: #ffffff; color: #333;
  min-height: 52px; -webkit-appearance: none; appearance: none;
}
.form-gov .campo:focus {
  outline: 2px solid #1351B8; border-color: #1351B8;
  box-shadow: 0 0 0 3px rgba(19, 81, 184, 0.15);
}
.form-gov .campo[readonly] {
  background: #f1f5fa !important;
  color: #3b4c68 !important;
  border-color: #cbd7e6 !important;
  cursor: not-allowed;
  font-weight: 600;
  box-shadow: none !important;
}

/* ---------- Tabela cronograma ---------- */
.tabela-wrap {
  width: 100%;
  overflow-x: auto;
  margin-bottom: 24px;
  -webkit-overflow-scrolling: touch;
}
.tabela-gov {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
.tabela-gov th {
  background: #1351B8;
  color: #ffffff;
  padding: 12px 16px;
  text-align: left;
  font-weight: 700;
  white-space: nowrap;
}
.tabela-gov th.th-etapa { width: 50%; }
.tabela-gov th.th-periodo { width: 30%; }
.tabela-gov th.th-situacao { width: 20%; }
.tabela-gov td {
  padding: 12px 16px;
  border-bottom: 1px solid #e3e9f2;
}
.tabela-gov tr:nth-child(even) {
  background: #f4f7fc;
}

/* Badges de situação */
.badge-status {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}
.badge-status.status-disp {
  background: #e7f6ec;
  color: #1e7e34;
}
.badge-status.status-taxa {
  background: #eaf1fc;
  color: #1351B8;
}
.badge-status.status-agendado {
  background: #f1f3f5;
  color: #555555;
}

/* ---------- Loading ---------- */
.loading-box { display: none; text-align: center; padding: 32px 0; }
.spinner-gov {
  width: 56px; height: 56px; margin: 0 auto 16px auto;
  border: 6px solid #e3e9f2; border-top-color: #1351B8; border-radius: 50%;
  animation: girar 0.9s linear infinite;
}
@keyframes girar { to { transform: rotate(360deg); } }
.loading-box .titulo-load { color: #1351B8; font-weight: 600; font-size: 17px; }
.loading-box .sub-load { color: #888888; font-size: 14px; margin-top: 6px; }

/* ---------- Resultado (consulta) ---------- */
.resultado-box {
  display: none; max-width: 640px; margin: 0 auto; text-align: center;
  background: #ffffff; border: 1px solid #dbe4ef;
  border-top: 5px solid #268744; border-radius: 6px; padding: 32px 24px;
}
.selo-ok, .selo-neg {
  width: 80px; height: 80px; margin: 0 auto 16px auto; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #ffffff; font-size: 34px;
}
.selo-ok { background: #268744; }
.selo-neg { background: #E52207; }
.resultado-box h2, .resultado-neg h2 { color: #0C3268; font-size: 22px; margin-bottom: 10px; }
.resultado-box .subtitulo, .resultado-neg .texto-neg {
  color: #555555; font-size: 16px; line-height: 1.6; margin-bottom: 20px;
}

/* Card da empresa verificada — NOME REAL DA EMPRESA em destaque */
.empresa-verificada {
  background: #f4f7fc; border: 1px solid #dbe4ef; border-radius: 8px;
  padding: 18px 20px; margin-bottom: 24px; text-align: left;
}
.empresa-verificada .ev-tag {
  display: inline-flex; align-items: center; gap: 6px;
  background: #268744; color: #ffffff; font-size: 12px; font-weight: 700;
  padding: 4px 12px; border-radius: 12px; margin-bottom: 12px;
  text-transform: uppercase; letter-spacing: 0.4px;
}
.empresa-verificada .ev-nome {
  font-size: 20px; font-weight: 700; color: #0C3268; line-height: 1.35;
  word-break: break-word; margin-bottom: 8px;
}
.empresa-verificada .ev-detalhes { font-size: 14px; color: #555555; }
.empresa-verificada .ev-detalhes > div {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 6px 0; flex-wrap: wrap;
}
.empresa-verificada .ev-detalhes strong { color: #268744; }

/* ---------- Erros ---------- */
.erro-msg {
  display: none; background: #fdeceb; border-left: 5px solid #E52207;
  color: #7a1c10; padding: 14px 16px; border-radius: 4px;
  font-size: 15px; margin-bottom: 16px; line-height: 1.5;
}

/* ---------- Checkout ---------- */
.checkout-wrap {
  max-width: 780px; margin: 0 auto; display: grid;
  grid-template-columns: 1fr 300px; gap: 24px; align-items: start;
}
.form-gov.form-full { max-width: 100%; }
fieldset-gov, .bloco-titulo {
  color: #0C3268; font-size: 17px; font-weight: 700;
  border-bottom: 2px solid #FFCD07; padding-bottom: 6px; margin: 28px 0 16px 0;
}
.resumo-pag {
  position: sticky; top: 16px; background: #ffffff;
  border: 1px solid #dbe4ef; border-radius: 6px; overflow: hidden;
}
.resumo-pag .rp-head {
  background: #0C3268; color: #ffffff; padding: 14px 18px;
  font-weight: 700; font-size: 15px;
}
.resumo-pag .rp-body { padding: 18px; }
.rp-linha {
  display: flex; justify-content: space-between; gap: 10px;
  font-size: 14px; padding: 6px 0; flex-wrap: wrap;
}
.rp-linha.destaque { border-bottom: 1px dashed #cccccc; }
.rp-linha.beneficio { color: #268744; padding-top: 10px; }
.rp-total {
  background: #268744; color: #ffffff; text-align: center; padding: 14px;
  font-size: 21px; font-weight: 700; letter-spacing: 0.4px;
}
.bandeiras {
  display: flex; gap: 10px; justify-content: center; margin-top: 14px;
  font-size: 24px; color: #555555; flex-wrap: wrap;
}
.selo-verificado {
  display: inline-flex; align-items: center; gap: 6px;
  background: #e7f6ec; color: #1d6b36; border: 1px solid #b8e2c6;
  font-size: 13px; font-weight: 700; padding: 5px 12px; border-radius: 14px;
}
.texto-aux {
  font-size: 15px; color: #666666; line-height: 1.6; margin-bottom: 16px;
}
.notinha {
  font-size: 13px; color: #888888; text-align: center;
  margin-top: 12px; line-height: 1.55;
}

/* ---------- Página obrigado ---------- */
.ok-box {
  max-width: 680px; margin: 40px auto; text-align: center;
  background: #ffffff; border: 1px solid #dbe4ef;
  border-top: 5px solid #268744; border-radius: 6px; padding: 40px 24px;
}
.protocolo {
  background: #f4f7fc; border: 1px dashed #1351B8; border-radius: 6px;
  padding: 16px; font-family: 'Courier New', monospace;
  font-size: 17px; color: #0C3268; letter-spacing: 1.5px; margin: 20px 0;
  word-break: break-all;
}

/* ---------- Rodapé ---------- */
.footer-extra {
  background: #f8f8f8; border-top: 1px solid #e0e0e0;
  padding: 28px 20px; text-align: center; font-size: 14px; color: #777777;
}
.footer-extra a { color: #1351B8; }

/* ---------- Títulos de página ---------- */
.titulo-pagina { font-size: 26px; color: #0C3268; font-weight: 700; margin-bottom: 12px; line-height: 1.3; }
.subtitulo-pagina { color: #555555; font-size: 16px; line-height: 1.65; margin-bottom: 28px; max-width: 780px; }

/* ---------- CTA central ---------- */
.cta-centro { text-align: center; padding: 24px 0 48px 0; }
.cta-centro .btn-gov-cta { font-size: 18px; padding: 18px 52px; }
.cta-centro .abaixo { font-size: 13px; color: #777777; margin-top: 10px; }

/* ============================================================
   RESPONSIVO — MOBILE FIRST FIXES
   ============================================================ */
@media (max-width: 860px) {
  .checkout-wrap {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .checkout-wrap > div:first-child {
    order: 1;
  }
  .resumo-pag {
    position: static;
    order: 2;
  }
}

@media (max-width: 720px) {
  .busca-gov { display: none; }
  #site-header .main .header-wrapper { padding: 12px 16px; }
  .gov-logo-link img { height: 38px; }

  .hero-mei { padding: 36px 16px; }
  .hero-mei h2 { font-size: 22px; line-height: 1.3; }
  .hero-mei h2 .valor-beneficio { font-size: 34px; margin-top: 6px; }
  .hero-mei p { font-size: 15.5px; margin-bottom: 22px; line-height: 1.55; }
  .selo-governo { font-size: 12px; padding: 6px 14px; margin-bottom: 16px; }
  .hero-mei .info-strip { font-size: 12.5px; gap: 8px 16px; }

  .btn-gov-cta {
    font-size: 16px;
    padding: 15px 24px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    text-align: center;
  }
  .cta-centro .btn-gov-cta { padding: 16px 20px; }

  .section-gov { padding: 28px 16px; }
  .section-title { font-size: 20px; margin: 24px 0 16px 0; }
  .titulo-pagina { font-size: 21px; word-break: break-word; line-height: 1.3; }
  .subtitulo-pagina { font-size: 15px; margin-bottom: 22px; }

  .step-item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
  }
  .step-num {
    width: 34px;
    height: 34px;
    font-size: 15px;
    flex-shrink: 0;
  }
  .step-item h4 { font-size: 15px; margin-bottom: 4px; line-height: 1.35; }
  .step-item p { font-size: 13.5px; line-height: 1.5; }

  .valor-box { margin-bottom: 28px; }
  .valor-box .vb-head { padding: 12px 16px; font-size: 15px; }
  .valor-box .vb-body { padding: 14px 16px; }
  .valor-box .linha { font-size: 14px; padding: 8px 0; gap: 8px; }
  .valor-box .linha.total { font-size: 17px; padding-top: 12px; }

  .grid-cards { grid-template-columns: 1fr; gap: 16px; }
  .card-gov { padding: 20px 16px; }
  .card-gov h3 { font-size: 16px; }
  .card-gov p { font-size: 14px; }

  .resultado-box { padding: 24px 16px; }
  .empresa-verificada { padding: 14px 16px; }
  .empresa-verificada .ev-nome { font-size: 17px; }
  .ok-box { padding: 28px 16px; margin: 24px auto; }
  .protocolo { font-size: 14px; word-break: break-all; }

  .breadcrumb-gov { padding: 12px 16px; font-size: 13px; line-height: 1.4; }
  .form-gov { max-width: 100%; }
}

/* Transformação da Tabela para modo Celular */
@media (max-width: 640px) {
  .container { padding: 0 14px; }

  .tabela-wrap {
    overflow-x: visible;
    margin-bottom: 20px;
  }
  .tabela-gov {
    min-width: 0 !important;
    width: 100% !important;
    display: block;
    border: none;
  }
  .tabela-gov thead {
    display: none;
  }
  .tabela-gov tbody,
  .tabela-gov tr,
  .tabela-gov td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .tabela-gov tr {
    background: #ffffff !important;
    border: 1px solid #dbe4ef;
    border-left: 5px solid #1351B8;
    border-radius: 8px;
    margin-bottom: 14px;
    padding: 14px 16px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
  }
  .tabela-gov td {
    padding: 8px 0;
    border: none;
    border-bottom: 1px dashed #eef2f7;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    text-align: right;
  }
  .tabela-gov td:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
  .tabela-gov td.col-etapa,
  .tabela-gov td:first-child {
    font-size: 15px;
    font-weight: 700;
    color: #0C3268;
    display: block;
    border-bottom: 2px solid #FFCD07;
    padding: 0 0 8px 0;
    margin-bottom: 8px;
    line-height: 1.35;
    text-align: left;
  }
  .tabela-gov td:not(.col-etapa):not(:first-child)::before {
    content: attr(data-label) ":";
    font-weight: 700;
    color: #555555;
    font-size: 13px;
    flex-shrink: 0;
    text-align: left;
  }

  .valor-box .linha {
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    padding: 8px 0;
    border-bottom: 1px solid #f0f4f9;
  }
  .valor-box .linha:last-child {
    border-bottom: none;
  }
  .valor-box .linha span:first-child {
    font-size: 13px;
    color: #666666;
  }
  .valor-box .linha strong,
  .valor-box .linha span:last-child {
    font-size: 14.5px;
    color: #0C3268;
  }
  .valor-box .linha.total {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-top: 2px dashed #cccccc;
    margin-top: 8px;
    padding-top: 12px;
  }
  .valor-box .linha.total span:first-child {
    font-size: 14.5px;
    font-weight: 700;
    color: #0C3268;
  }
  .valor-box .linha.total span:last-child {
    font-size: 19px;
    font-weight: 700;
    color: #268744;
  }

  .callout-gov {
    padding: 14px 16px;
    font-size: 13.5px;
    margin: 18px 0;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  .pix-container {
    padding: 16px;
  }
  .pix-header-status {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .pix-badge-status {
    align-self: flex-start;
  }
  .pix-timer-alert {
    font-size: 13px;
    padding: 10px 12px;
  }
  .pix-steps {
    padding: 14px;
  }
  .pix-steps ol {
    padding-left: 18px;
    font-size: 13px;
  }
}

@media (max-width: 360px) {
  .container { padding: 0 10px; }
  .titulo-pagina { font-size: 19px; }
  .hero-mei h2 { font-size: 19px; }
  .hero-mei h2 .valor-beneficio { font-size: 28px; }
  .btn-gov-cta { font-size: 15px; padding: 14px 16px; }
  .pix-qr-frame { min-width: 180px; min-height: 180px; padding: 10px; }
  .pix-qr-frame canvas, .pix-qr-frame img { max-width: 170px; }
}

/* ============================================================
   PÁGINA CHECKOUT2 — PAGAMENTO PIX BRAVOPAY
   ============================================================ */
.pix-container {
  background: #ffffff;
  border: 1px solid #dbe4ef;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.pix-header-status {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  padding-bottom: 16px;
  border-bottom: 1px solid #eef2f7;
  margin-bottom: 20px;
}
.pix-badge-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff8e6;
  color: #8c6b00;
  border: 1px solid #ffe187;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
}
.pix-pulsing-dot {
  width: 8px;
  height: 8px;
  background-color: #ffaa00;
  border-radius: 50%;
  animation: pulse 1.5s infinite;
}
@keyframes pulse {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 170, 0, 0.7); }
  70% { transform: scale(1.15); box-shadow: 0 0 0 6px rgba(255, 170, 0, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 170, 0, 0); }
}
.pix-timer-alert {
  background: #f4f7fc;
  border-left: 4px solid #1351B8;
  padding: 12px 16px;
  border-radius: 4px;
  font-size: 14px;
  color: #333333;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
.pix-timer-alert strong {
  color: #0C3268;
  font-size: 16px;
}
.pix-qr-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 20px 0;
}
.pix-qr-frame {
  background: #ffffff;
  padding: 14px;
  border: 2px dashed #b8c9df;
  border-radius: 8px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 210px;
  min-height: 210px;
  margin-bottom: 12px;
}
.pix-qr-frame canvas, .pix-qr-frame img {
  display: block;
  max-width: 200px;
  height: auto;
}
.pix-code-container {
  margin-top: 18px;
}
.pix-code-label {
  font-size: 14px;
  font-weight: 700;
  color: #0C3268;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pix-code-input {
  width: 100%;
  padding: 12px 14px;
  font-family: 'Courier New', monospace;
  font-size: 13px;
  color: #444444;
  background: #f8fafc;
  border: 1px solid #ccd7e6;
  border-radius: 4px;
  resize: none;
  height: 68px;
  outline: none;
  word-break: break-all;
}
.btn-copiar {
  background: #268744;
  color: #ffffff;
  border: none;
  padding: 14px 20px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin-top: 10px;
  transition: background 0.2s;
}
.btn-copiar:hover {
  background: #1e6e37;
  color: #ffffff;
  text-decoration: none;
}
.btn-copiar.copiado {
  background: #1351B8;
}
.pix-steps {
  background: #fafbfc;
  border: 1px solid #e7ecf2;
  border-radius: 6px;
  padding: 18px;
  margin-top: 24px;
}
.pix-steps h4 {
  font-size: 15px;
  color: #0C3268;
  font-weight: 700;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.pix-steps ol {
  padding-left: 20px;
  list-style: decimal;
  font-size: 14px;
  color: #555555;
  line-height: 1.6;
}
.pix-steps ol li {
  margin-bottom: 6px;
}
.pix-monitor-status {
  text-align: center;
  padding: 16px;
  margin-top: 20px;
  background: #f4f8fd;
  border-radius: 6px;
  border: 1px solid #d2e3f8;
  font-size: 14px;
  color: #0C3268;
}
.pix-monitor-status i {
  color: #1351B8;
  margin-right: 6px;
}
.btn-check-status {
  background: #ffffff;
  border: 1px solid #1351B8;
  color: #1351B8;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 4px;
  cursor: pointer;
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s;
}
.btn-check-status:hover {
  background: #1351B8;
  color: #ffffff;
}
.pix-loading-screen {
  text-align: center;
  padding: 60px 20px;
}
.pix-loading-screen .fa-spinner {
  font-size: 40px;
  color: #1351B8;
  margin-bottom: 16px;
}
.pix-loading-screen h3 {
  font-size: 18px;
  color: #0C3268;
  margin-bottom: 8px;
}
.pix-loading-screen p {
  color: #666666;
  font-size: 14px;
}

/* ---------- Resumo do Pedido Recolhível / Accordion (Checkout2) ---------- */
.resumo-collapsible {
  background: #ffffff;
  border: 1px solid #dbe4ef;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 12px;
}
.rp-toggle {
  width: 100%;
  background: #f4f7fc;
  border: none;
  padding: 12px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s;
}
.rp-toggle:hover {
  background: #eaf1fc;
}
.rp-toggle-left {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 700;
  color: #0C3268;
}
.rp-toggle-badge {
  font-size: 11px;
  color: #1351b8;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #ffffff;
  padding: 3px 8px;
  border-radius: 10px;
  border: 1px solid #c9daf8;
}
.rp-toggle-total {
  font-size: 16px;
  font-weight: 800;
  color: #268744;
}
.resumo-collapsible .rp-body {
  padding: 12px 16px;
  background: #ffffff;
  border-top: 1px solid #e2eaf5;
}

/* ---------- Checkout2: Card de Pagamento Compacto e Reordenado ---------- */
.pix-container-compact {
  background: #ffffff;
  border: 1px solid #dbe4ef;
  border-radius: 8px;
  padding: 18px 20px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.pix-topo-valor {
  text-align: center;
  padding-bottom: 12px;
  border-bottom: 1px solid #edf2f7;
  margin-bottom: 12px;
}
.pix-topo-valor .label {
  font-size: 13px;
  color: #666666;
  display: block;
  margin-bottom: 2px;
}
.pix-topo-valor .valor {
  font-size: 28px;
  color: #268744;
  font-weight: 800;
  letter-spacing: -0.5px;
}
.checkout2-header-compact {
  padding-top: 8px !important;
  padding-bottom: 14px !important;
}
.checkout2-breadcrumb {
  padding: 6px 16px !important;
  margin-bottom: 2px !important;
}
.checkout2-titulo {
  font-size: 22px !important;
  margin-top: 4px !important;
  margin-bottom: 6px !important;
}
.checkout2-wrap-compact {
  display: flex;
  flex-direction: column;
  gap: 12px !important;
  max-width: 680px;
  margin: 0 auto;
}

