/* Tema visual das páginas públicas da FEAL/ABRASEL (i9/feal/) -- 21/09/2026.
   Usa as mesmas cores de marca da Rodada de Negócios (ver
   rodada-de-negocios/assets/css/estilo.css), não o preto+dourado
   institucional do restante do portal i9 -- aqui quem "fala" é a Rodada. */
:root {
  --marca-azul-900: #0B1E4D;
  --marca-azul-800: #12296B;
  --marca-azul-700: #1D4ED8;
  --marca-azul-500: #2563EB;
  --marca-azul-300: #93C5FD;
  --marca-branco: #ffffff;
  --marca-texto-claro: #eef4ff;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: 'Segoe UI', Roboto, Arial, sans-serif;
  background: var(--marca-azul-900);
  color: #1b2540;
}

.feal-topo {
  background: radial-gradient(circle at 15% 0%, var(--marca-azul-700) 0%, var(--marca-azul-900) 65%);
  color: var(--marca-branco);
  padding: 48px 20px 64px;
  text-align: center;
}

.feal-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.35);
  color: var(--marca-texto-claro);
  padding: 6px 16px;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  margin-bottom: 18px;
}

.feal-topo h1 {
  font-size: clamp(1.8rem, 4vw, 2.7rem);
  font-weight: 800;
  margin: 0 0 14px;
  line-height: 1.15;
}

.feal-topo h1 .destaque { color: var(--marca-azul-300); }

.feal-topo p.lead {
  max-width: 640px;
  margin: 0 auto;
  font-size: 1.1rem;
  color: var(--marca-texto-claro);
}

.feal-conteudo {
  background: #f4f7ff;
  border-radius: 28px 28px 0 0;
  margin-top: -30px;
  padding: 44px 20px 60px;
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}

.feal-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  max-width: 900px;
  margin: 0 auto 40px;
}

@media (max-width: 720px) {
  .feal-cards { grid-template-columns: 1fr; }
}

.feal-card {
  background: var(--marca-branco);
  border-radius: 18px;
  padding: 30px 26px;
  box-shadow: 0 12px 30px rgba(11,30,77,0.10);
  border: 1px solid #e3e9fb;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.feal-card .icone {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  background: linear-gradient(135deg, var(--marca-azul-800), var(--marca-azul-700));
  color: #fff;
  margin-bottom: 6px;
}

.feal-card h3 { margin: 0; font-size: 1.25rem; color: var(--marca-azul-900); }
.feal-card p { margin: 0; color: #4b5875; font-size: 0.96rem; }

.feal-btn {
  display: inline-block;
  margin-top: 8px;
  padding: 12px 28px;
  border-radius: 999px;
  background: var(--marca-azul-700);
  color: #fff !important;
  text-decoration: none;
  font-weight: 700;
  transition: background 0.15s ease, transform 0.15s ease;
}
.feal-btn:hover { background: var(--marca-azul-800); transform: translateY(-1px); }
.feal-btn.secundario {
  background: transparent;
  color: var(--marca-azul-700) !important;
  border: 2px solid var(--marca-azul-700);
}
.feal-btn.secundario:hover { background: var(--marca-azul-700); color: #fff !important; }

.feal-como-funciona {
  max-width: 780px;
  margin: 0 auto 46px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}
@media (max-width: 560px) { .feal-como-funciona { grid-template-columns: 1fr; } }

.feal-passo {
  background: #fff;
  border-radius: 14px;
  padding: 20px;
  border: 1px solid #e3e9fb;
  text-align: center;
}
.feal-passo .num {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--marca-azul-300); color: var(--marca-azul-900);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; margin: 0 auto 10px;
}
.feal-passo p { margin: 0; font-size: 0.92rem; color: #4b5875; }

.feal-secao-titulo {
  text-align: center;
  color: var(--marca-azul-900);
  font-weight: 700;
  font-size: 1.1rem;
  margin: 0 0 16px;
}

.feal-validados {
  max-width: 640px;
  margin: 0 auto 40px;
  text-align: center;
}
.feal-validados p {
  color: #6b7896;
  font-size: 0.88rem;
  margin: 0 0 10px;
}
.feal-validados-links {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}
.feal-validados-links a {
  color: var(--marca-azul-700);
  font-weight: 700;
  font-size: 0.88rem;
  text-decoration: none;
  padding: 8px 18px;
  border: 1.5px solid #d7deef;
  border-radius: 999px;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.feal-validados-links a:hover { background: #eef2fb; border-color: var(--marca-azul-300); }

.feal-qrs {
  max-width: 780px;
  margin: 0 auto;
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e3e9fb;
  padding: 32px 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  text-align: center;
}
@media (max-width: 720px) { .feal-qrs { grid-template-columns: 1fr; } }

.feal-qrs h4 { margin: 12px 0 4px; color: var(--marca-azul-900); }
.feal-qrs p.legenda { margin: 0; font-size: 0.85rem; color: #6b7896; }
.feal-qr-caixa {
  display: inline-flex;
  padding: 12px;
  background: #fff;
  border: 1px solid #dbe3fb;
  border-radius: 12px;
}

.feal-rodape {
  text-align: center;
  padding: 26px 20px 40px;
  color: #6b7896;
  font-size: 0.85rem;
}
.feal-rodape a { color: var(--marca-azul-700); }

/* ---- páginas de entrada (expositor.php / comprador.php) ---- */
.feal-entrada-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.feal-entrada-card {
  background: #fff;
  border-radius: 20px;
  max-width: 440px;
  width: 100%;
  padding: 38px 32px;
  box-shadow: 0 20px 50px rgba(11,30,77,0.25);
  text-align: center;
}
.feal-entrada-card .icone-topo {
  width: 64px; height: 64px; border-radius: 18px;
  background: linear-gradient(135deg, var(--marca-azul-800), var(--marca-azul-700));
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 1.8rem; margin: 0 auto 16px;
}
.feal-entrada-card h2 { color: var(--marca-azul-900); margin: 0 0 8px; font-size: 1.4rem; }
.feal-entrada-card p.sub { color: #5a6890; font-size: 0.95rem; margin: 0 0 24px; }
.feal-google-slot { display: flex; justify-content: center; margin-bottom: 10px; }
.feal-outras-formas { margin-top: 6px; font-size: 0.85rem; }
.feal-outras-formas a { color: #7c88ab; text-decoration: none; }
.feal-form-fallback { margin-top: 18px; text-align: left; }
.feal-form-fallback label { font-size: 0.85rem; font-weight: 600; color: var(--marca-azul-900); display: block; margin-bottom: 4px; }
.feal-form-fallback input {
  width: 100%; padding: 12px 12px; margin-bottom: 14px;
  border: 1px solid #d7deef; border-radius: 8px; font-size: 16px; /* 16px+ evita zoom automático no iOS ao focar o campo */
}
.feal-form-fallback button {
  width: 100%; padding: 11px; border: none; border-radius: 8px;
  background: var(--marca-azul-700); color: #fff; font-weight: 700; cursor: pointer;
}
.feal-form-fallback button:disabled { opacity: 0.6; cursor: default; }
.feal-esqueci-senha { display: block; text-align: center; margin-top: 10px; font-size: 0.82rem; color: var(--marca-azul-700); text-decoration: none; }
.feal-esqueci-senha:hover { text-decoration: underline; }
.feal-aviso-fallback {
  background: #eef4ff; border: 1px solid #d7e3ff; border-radius: 10px;
  padding: 10px 14px; font-size: 0.82rem; color: #33437a; margin-bottom: 16px; text-align: left;
}
.feal-voltar { display: block; margin-top: 22px; font-size: 0.85rem; color: #8390b3; text-decoration: none; }

/* Pré-cadastro de leads (fornecedor/comprador) e tela de acesso por
   token -- 22/09/2026. Reaproveita as cores/variáveis já definidas no
   topo deste arquivo. */
.feal-cadastro-card {
  background: #fff;
  border-radius: 20px;
  max-width: 640px;
  width: 100%;
  padding: 34px 32px 30px;
  box-shadow: 0 20px 50px rgba(11,30,77,0.25);
}
.feal-cadastro-card h2 { color: var(--marca-azul-900); margin: 0 0 6px; font-size: 1.4rem; text-align:center; }
.feal-cadastro-card p.sub { color: #5a6890; font-size: 0.95rem; margin: 0 0 24px; text-align:center; }
.feal-campo { margin-bottom: 14px; }
.feal-campo label { font-size: 0.85rem; font-weight: 600; color: var(--marca-azul-900); display: block; margin-bottom: 4px; }
.feal-campo input[type="text"], .feal-campo input[type="email"], .feal-campo input[type="tel"], .feal-campo textarea {
  width: 100%; padding: 12px 12px; border: 1px solid #d7deef; border-radius: 8px; font-size: 16px; font-family: inherit; /* 16px+ evita zoom automático no iOS ao focar o campo */
}
.feal-campo textarea { resize: vertical; min-height: 70px; }
.feal-linha2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 560px) { .feal-linha2 { grid-template-columns: 1fr; } }
.feal-upload-imagem { border: 1px dashed #c7d2eb; border-radius: 10px; padding: 12px; display:flex; gap:12px; align-items:center; margin-bottom: 14px; }
.feal-upload-imagem .prev { width: 64px; height: 64px; border-radius: 8px; background: #eef2fb; flex-shrink:0; overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:11px; color:#8390b3; text-align:center; }
.feal-upload-imagem .prev img { width:100%; height:100%; object-fit:cover; }
.feal-upload-imagem .info { flex:1; }
.feal-upload-imagem .info strong { display:block; font-size:0.88rem; color: var(--marca-azul-900); }
.feal-upload-imagem .info span { display:block; font-size:0.78rem; color:#7c88ab; margin-top:2px; }
.feal-upload-imagem .info label {
  display:inline-flex; align-items:center; margin-top:8px; padding:8px 14px; min-height:36px;
  font-size:0.82rem; font-weight:600; color: var(--marca-azul-700);
  border: 1.5px solid var(--marca-azul-300); border-radius: 999px; cursor:pointer;
}
.feal-upload-imagem .info label:active { background: #eef2fb; }
.feal-upload-imagem .info input[type="file"] { display:none; }
.feal-cadastro-card button[type="submit"] {
  width: 100%; padding: 12px; border: none; border-radius: 8px; margin-top: 6px;
  background: var(--marca-azul-700); color: #fff; font-weight: 700; cursor: pointer; font-size: 0.98rem;
}
.feal-cadastro-card button[type="submit"]:disabled { opacity: 0.6; cursor: default; }
.feal-msg-erro { background: #fde8e8; border: 1px solid #f3b4b4; color: #9b2c2c; border-radius: 8px; padding: 10px 12px; font-size: 0.86rem; margin: 12px 0; }
.feal-msg-ok { background: #e6f6ec; border: 1px solid #a9dcb9; color: #256a3c; border-radius: 8px; padding: 10px 12px; font-size: 0.86rem; margin: 12px 0; }
.feal-acesso-opcoes { display:flex; flex-direction:column; gap: 10px; margin: 18px 0; }
.feal-acesso-ou { text-align:center; color:#a6afca; font-size:0.8rem; margin: 4px 0; }

/* Link pro manual dentro de cada card (25/09/2026) */
.feal-link-manual {
  display: inline-block;
  margin-top: 12px;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--marca-azul-700);
  text-decoration: none;
  border-bottom: 1px dashed currentColor;
  align-self: center;
}
.feal-link-manual:hover { color: var(--marca-azul-900); border-bottom-style: solid; }
