/* =====================================================================
   Inscrição em Mentorias — mesmo visual "Stadium" do free2026.
   Escopo: .lp-inscricao (não afeta outras páginas). As classes de cor do
   lp.css continuam disponíveis. Toggle das abas em inscricao.js.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

.lp-inscricao {
  --bg: #F7F5F0;
  --ink: #16181F;
  --muted: #5b6168;
  --accent: #E35100;
  --navy: #152A3F;
  --gold: #ffd24a;
  --ok: #2e9e6b;
  --no: #d6453d;
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Open Sans", sans-serif;
}
.lp-inscricao h1,
.lp-inscricao h2,
.lp-inscricao h3,
.lp-inscricao h4,
.lp-inscricao h5 {
  font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ===== HERO ===== */
.lp-inscricao .ment-hero {
  background: linear-gradient(135deg, #0d1b2a 0%, #152A3F 55%, #1b3a5c 100%);
  color: #fff;
  /* padding-top extra: navbar do base2026 é fixed-top */
  padding: 104px 24px 44px;
  text-align: center;
}
.lp-inscricao .ment-hero .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .18);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 7px 14px;
  border-radius: 999px;
}
.lp-inscricao .ment-hero h1 {
  font-weight: 800;
  letter-spacing: -.02em;
  font-size: clamp(26px, 3.6vw, 40px);
  line-height: 1.1;
  margin: 18px 0 12px;
  color: #fff;
}
.lp-inscricao .ment-hero p {
  font-size: clamp(15px, 1.5vw, 18px);
  color: #d7e2ee;
  max-width: 680px;
  margin: 0 auto;
}
.lp-inscricao .ment-hero p b {
  color: var(--gold);
}

/* ===== container central ===== */
.lp-inscricao .ment-wrap {
  max-width: 1040px;
  margin: 0 auto;
  padding: 36px 24px 56px;
}

/* ===== caixa de aviso (intro "Olá, TDC Lover") ===== */
.lp-inscricao .ment-note {
  background: #fff;
  border: 1px solid #ece8e0;
  border-radius: 16px;
  padding: 22px 24px;
  margin-bottom: 22px;
  box-shadow: 0 8px 24px rgba(21, 42, 63, .05);
}
.lp-inscricao .ment-note h3 {
  font-weight: 800;
  font-size: 18px;
  color: var(--navy);
  margin-bottom: 10px;
}
.lp-inscricao .ment-note p {
  color: var(--muted);
  font-size: 15px;
  margin: 0 0 8px;
}
.lp-inscricao .ment-note a {
  color: var(--accent);
  font-weight: 600;
}
.lp-inscricao .ment-note ul {
  color: var(--muted);
  font-size: 14.5px;
  margin: 8px 0 0;
  padding-left: 18px;
}
.lp-inscricao .ment-note ul li {
  margin-bottom: 6px;
}

/* ===== cards de info (quem participa / limite) ===== */
.lp-inscricao .info-card {
  background: #fff;
  border: 1px solid #ece8e0;
  border-radius: 16px;
  padding: 24px 22px;
  height: 100%;
}
.lp-inscricao .info-card .ic {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
  margin-bottom: 14px;
}
.lp-inscricao .info-card h5 {
  font-weight: 700;
  font-size: 16px;
  color: var(--ink);
  margin-bottom: 10px;
}
.lp-inscricao .info-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.lp-inscricao .info-card li {
  font-size: 14.5px;
  color: var(--muted);
  margin-bottom: 7px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.lp-inscricao .info-card li i {
  color: var(--ok);
  margin-top: 3px;
}

/* ===== passos (1. e-mail / 2. escolha) ===== */
.lp-inscricao .ment-step {
  display: flex;
  gap: 14px;
  background: #fff;
  border: 1.5px solid #ece8e0;
  border-radius: 16px;
  padding: 20px 22px;
  margin-bottom: 18px;
  box-shadow: 0 8px 24px rgba(21, 42, 63, .05);
}
.lp-inscricao .ment-step-badge {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.lp-inscricao .ment-step-main {
  flex: 1;
  min-width: 0;
}
.lp-inscricao .ment-step-main label {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
  display: block;
}
.lp-inscricao .req {
  color: var(--accent);
}
.lp-inscricao .ment-step-main .form-control {
  border: 1.5px solid #e2ddd3;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 15px;
  background: #fdfcfa;
  max-width: 520px;
}
.lp-inscricao .ment-step-main .form-control:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 .2rem rgba(227, 81, 0, .12);
  background: #fff;
}
.lp-inscricao .ment-step-main .form-control.is-invalid {
  border-color: var(--no);
  box-shadow: 0 0 0 .2rem rgba(214, 69, 61, .12);
}
.lp-inscricao .ment-step-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  font-size: 17px;
  color: var(--navy);
  margin: 6px 0 10px;
}

/* box do Passo 2 (título + abas + lista) — mesma cara dos demais blocos.
   Fundo levemente mais suave que o branco para os cards brancos saltarem dentro. */
.lp-inscricao .ment-box {
  background: #fbfaf7;
  border: 1px solid #ece8e0;
  border-radius: 16px;
  padding: 22px;
  margin-bottom: 18px;
  box-shadow: 0 8px 24px rgba(21, 42, 63, .05);
}
.lp-inscricao .ment-box .ment-step-title {
  margin-top: 0;
}

/* erro inline de campo (escondido por padrão; .show exibe) */
.lp-inscricao .field-error {
  display: none;
  color: var(--no);
  font-size: 13.5px;
  font-weight: 600;
  margin-top: 8px;
  align-items: center;
  gap: 6px;
}
.lp-inscricao .field-error.show {
  display: flex;
}

/* ===== abas de dia ===== */
.lp-inscricao .day-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 6px 0 18px;
  padding: 0;
  list-style: none;
}
.lp-inscricao .day-tab {
  border: 1.5px solid #e2ddd3;
  background: #fff;
  color: var(--navy);
  font-weight: 700;
  font-size: 14px;
  border-radius: 12px;
  padding: 11px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.lp-inscricao .day-tab.active {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
}

/* ===== cards de mentoria (selecionáveis) ===== */
.lp-inscricao .ment-day-block {
  display: grid;
  gap: 12px;
}
.lp-inscricao .ment-card {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #fff;
  border: 1.5px solid #ece8e0;
  border-radius: 14px;
  padding: 16px 18px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
.lp-inscricao .ment-card:hover {
  border-color: #d8d2c6;
  box-shadow: 0 8px 22px rgba(21, 42, 63, .07);
}
.lp-inscricao .ment-card:has(.ment-radio:checked) {
  border-color: var(--accent);
  box-shadow: 0 8px 24px rgba(227, 81, 0, .15);
}
/* radio escondido + indicador custom */
.lp-inscricao .ment-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.lp-inscricao .ment-check {
  flex: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid #cfc8ba;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color .15s, background .15s;
}
.lp-inscricao .ment-card:has(.ment-radio:checked) .ment-check {
  border-color: var(--accent);
  background: var(--accent);
}
.lp-inscricao .ment-card:has(.ment-radio:checked) .ment-check::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
}
.lp-inscricao .ment-main {
  flex: 1;
  min-width: 0;
}
.lp-inscricao .ment-time {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--navy);
  display: flex;
  align-items: center;
  gap: 6px;
}
.lp-inscricao .ment-name {
  font-weight: 700;
  font-size: 15.5px;
  color: var(--ink);
  margin: 3px 0 4px;
  line-height: 1.3;
}
.lp-inscricao .ment-mentors {
  font-size: 13.5px;
  color: var(--muted);
}
.lp-inscricao .ment-status {
  flex: none;
  text-align: right;
}
.lp-inscricao .badge-vacancy {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
}
.lp-inscricao .badge-vacancy.yes {
  background: rgba(46, 158, 107, .12);
  color: var(--ok);
}
.lp-inscricao .badge-vacancy.no {
  background: rgba(214, 69, 61, .1);
  color: var(--no);
}
/* badge de tipo (Presencial / Digital) — usado nos workshops */
.lp-inscricao .badge-type {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  background: #eef0f3;
  color: #5b6168;
  margin-bottom: 6px;
}
.lp-inscricao .badge-type.digital {
  background: rgba(85, 153, 219, .14);
  color: #2a6db0;
}

/* card de patrocínio (workshops) — logo centralizado e em destaque */
.lp-inscricao .sponsor-card {
  text-align: center;
  justify-content: center;
}
.lp-inscricao .sponsor-card .ic {
  margin-left: auto;
  margin-right: auto;
}
.lp-inscricao .sponsor-logo {
  max-width: 200px;
  width: 100%;
  height: auto;
  margin-top: 8px;
}

/* patrocínio (faixa) — usado no formSummit */
.lp-inscricao .ment-sponsor {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid #ece8e0;
  border-radius: 14px;
  padding: 14px 20px;
  margin-bottom: 22px;
}
.lp-inscricao .ment-sponsor span {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--muted);
}
.lp-inscricao .ment-sponsor img {
  max-height: 38px;
  width: auto;
}
/* mentoria encerrada (sem seleção) */
.lp-inscricao .ment-card.is-past {
  cursor: default;
  opacity: .6;
}
.lp-inscricao .ment-card.is-past:hover {
  border-color: #ece8e0;
  box-shadow: none;
}
.lp-inscricao .ment-card.is-past .ment-check {
  visibility: hidden;
}
.lp-inscricao .ment-past-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}

/* ===== submit ===== */
.lp-inscricao .ment-submit {
  text-align: center;
  margin-top: 30px;
}
.lp-inscricao .btn-grat {
  background: var(--accent);
  border: none;
  color: #fff;
  font-weight: 800;
  font-size: 17px;
  padding: 14px 34px;
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(227, 81, 0, .35);
  transition: .15s;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.lp-inscricao .btn-grat:hover {
  background: #c84800;
  color: #fff;
  transform: translateY(-2px);
}
.lp-inscricao .btn-grat:disabled {
  background: #c9c2b6;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

/* ===== banner de erro ===== */
.lp-inscricao .ment-error {
  background: #fff4f3;
  border: 1px solid #f3c6c2;
  color: #9a1f1a;
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 22px;
}
.lp-inscricao .ment-error ul {
  margin: 0;
  padding-left: 22px;
}

/* ===== tela de agradecimento ===== */
.lp-inscricao .ment-thanks {
  min-height: 68vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 120px 24px 60px;
}
.lp-inscricao .ment-thanks-card {
  background: #fff;
  border: 1px solid #ece8e0;
  border-radius: 20px;
  box-shadow: 0 18px 50px rgba(21, 42, 63, .1);
  max-width: 560px;
  width: 100%;
  text-align: center;
  padding: 44px 36px 40px;
}
.lp-inscricao .ment-thanks-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(46, 158, 107, .12);
  color: var(--ok);
  font-size: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}
.lp-inscricao .ment-thanks-card h1 {
  font-weight: 800;
  font-size: clamp(26px, 3vw, 34px);
  color: var(--navy);
  margin: 0 0 14px;
}
.lp-inscricao .ment-thanks-msg {
  font-size: 16px;
  line-height: 1.6;
  color: var(--muted);
  margin: 0 0 8px;
}
.lp-inscricao .ment-thanks-card .btn-grat {
  margin-top: 22px;
}

@media (max-width: 575px) {
  .lp-inscricao .ment-card {
    flex-wrap: wrap;
  }
  .lp-inscricao .ment-status {
    width: 100%;
    text-align: left;
  }
}