/* =====================================================================
   DocsGer - página "em construção" (pública, whitelabel)
   Fonte: Inter (arquivos locais em /assets/fontes/)
   Cores injetadas via :root pelo index.php (--primaria / --secundaria)
   ===================================================================== */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fontes/inter-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fontes/inter-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fontes/inter-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fontes/inter-Bold.woff2') format('woff2');
}

:root {
  --primaria: #c9a227;
  --secundaria: #1f4a38;
  --texto: #22262e;
  --texto-suave: #5d6470;
  --borda: #e6e8ec;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  color: var(--texto);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ------------------------------------------------------------------ */
/* Tela "em construção"                                                */
/* ------------------------------------------------------------------ */

.tela-construcao {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 40px 20px;
  background:
    radial-gradient(1100px 520px at 50% -10%, color-mix(in srgb, var(--secundaria) 14%, #ffffff), #ffffff 60%),
    #ffffff;
}

.cons-fundo {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    radial-gradient(closest-side at 12% 18%, color-mix(in srgb, var(--primaria) 12%, transparent), transparent),
    radial-gradient(closest-side at 88% 78%, color-mix(in srgb, var(--secundaria) 10%, transparent), transparent);
  opacity: .8;
}

.cons {
  position: relative;
  width: 100%;
  max-width: 520px;
  text-align: center;
  animation: consEntrar .7s cubic-bezier(.2, .7, .3, 1) both;
}

@keyframes consEntrar {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}

.cons-logo {
  max-width: 190px;
  max-height: 110px;
  width: auto;
  height: auto;
  object-fit: contain;
  margin-bottom: 18px;
}

.cons-inicial {
  width: 84px;
  height: 84px;
  margin: 0 auto 18px;
  border-radius: 24px;
  color: #fff;
  font-size: 38px;
  font-weight: 700;
  display: grid;
  place-items: center;
  box-shadow: 0 14px 34px color-mix(in srgb, var(--primaria) 40%, transparent);
}

.cons-empresa {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--texto-suave);
}

.cons-titulo {
  margin: 0;
  font-size: clamp(34px, 7vw, 52px);
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--secundaria);
  line-height: 1.1;
}

.cons-figura {
  margin: 26px auto 0;
  max-width: 420px;
}

.cons-figura img {
  width: 100%;
  height: auto;
  border-radius: 18px;
  box-shadow: 0 18px 44px rgba(16, 24, 40, .16);
}

.cons-divisor {
  width: 64px;
  height: 4px;
  border-radius: 99px;
  margin: 26px auto 22px;
}

.cons-texto {
  margin: 0 auto;
  max-width: 430px;
  font-size: 17px;
  line-height: 1.65;
  color: var(--texto-suave);
  white-space: pre-line;
}

.cons-botao {
  display: inline-block;
  margin-top: 30px;
  padding: 14px 34px;
  border-radius: 999px;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--primaria) 42%, transparent);
  transition: transform .18s ease, box-shadow .18s ease;
}

.cons-botao:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px color-mix(in srgb, var(--primaria) 52%, transparent);
}

/* Pulso discreto no rodapé do bloco */
.cons-pulsante {
  margin: 40px auto 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--primaria);
  animation: consPulsar 2.2s ease-in-out infinite;
}

@keyframes consPulsar {
  0%, 100% { opacity: .25; transform: scale(.8); }
  50%      { opacity: 1;   transform: scale(1.15); }
}

/* ------------------------------------------------------------------ */
/* Tela de aviso (links inválidos)                                     */
/* ------------------------------------------------------------------ */

.tela-aviso {
  min-height: 100vh;
  display: grid;
  place-items: center;
  background: #f4f5f7;
  padding: 24px;
}

.card-aviso {
  max-width: 420px;
  padding: 40px 32px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, .08);
  text-align: center;
}

.card-aviso .icone {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  border-radius: 50%;
  background: #fdecec;
  color: #c0392b;
  display: grid;
  place-items: center;
}

.card-aviso h1 { font-size: 20px; margin: 0 0 8px; }
.card-aviso p { margin: 0; color: var(--texto-suave); line-height: 1.5; }

/* Mobile: reduz a marca para equilibrar com o texto */
@media (max-width: 480px) {
  .cons-inicial { width: 66px; height: 66px; font-size: 30px; border-radius: 20px; margin-bottom: 14px; }
  .cons-logo { max-width: 150px; max-height: 84px; margin-bottom: 14px; }
  .cons-titulo { font-size: clamp(30px, 9vw, 40px); }
  .cons-texto { font-size: 15.5px; }
}