/* =========================================================
   ESCOLA SEMENTES — Banner de consentimento de cookies
   Fase 2. Usa a paleta nova (marca.css).

   O site ainda está na identidade antiga (Fase 1 pendente),
   então este banner é, por ora, a única peça no visual novo.
   ========================================================= */

.consent{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 90;                 /* acima do .wa-float (60) */
  background: var(--es-areia, #FBF4E8);
  color: var(--es-humus, #3B2312);
  border-top: 3px solid var(--es-floresta, #075C52);
  box-shadow: 0 -14px 40px -22px rgba(7, 92, 82, .55);
  padding: clamp(18px, 2.4vw, 26px) clamp(20px, 5vw, 64px);
  /* fora da tela até o JS decidir mostrar — evita piscar no carregamento */
  transform: translateY(100%);
  transition: transform .32s ease;
}
.consent[hidden]{ display: none !important; }
.consent.is-open{ transform: translateY(0); }

@media (prefers-reduced-motion: reduce){
  .consent{ transition: none; }
}

.consent__in{
  max-width: var(--maxw, 1240px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: clamp(18px, 3vw, 44px);
  flex-wrap: wrap;
}

.consent__text{
  flex: 1 1 320px;
  min-width: 0;
  font-size: .98rem;
  line-height: 1.5;
  margin: 0;
}

.consent__title{
  display: block;
  font-weight: 600;
  font-size: 1.06rem;
  margin-bottom: .35rem;
  color: var(--es-floresta, #075C52);
}

.consent__text a{
  color: var(--es-floresta, #075C52);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 500;
}
.consent__text a:hover{ color: var(--es-humus, #3B2312); }

/* --- Botões ---------------------------------------------
   "Aceitar" e "Recusar" são DELIBERADAMENTE idênticos:
   mesmo tamanho, mesma cor, mesmo peso. Só o rótulo muda.
   A LGPD exige que recusar seja tão fácil quanto aceitar —
   não dê a um deles um destaque maior "porque fica melhor".
   --------------------------------------------------------- */
.consent__actions{
  flex: 0 0 auto;
  display: flex;
  gap: 12px;
}

.consent__btn{
  appearance: none;
  -webkit-appearance: none;
  font: inherit;
  font-weight: 600;
  font-size: .95rem;
  line-height: 1;
  cursor: pointer;
  background: var(--es-floresta, #075C52);
  color: #fff;                 /* branco sobre Floresta: aprovado no manual */
  border: 2px solid var(--es-floresta, #075C52);
  border-radius: 0;
  padding: 14px 30px;
  min-width: 132px;            /* trava a largura dos dois no mesmo valor */
  text-align: center;
  transition: background .2s, color .2s;
}
.consent__btn:hover{
  background: var(--es-humus, #3B2312);
  border-color: var(--es-humus, #3B2312);
}
/* O anel de foco cai no vão de 2px, ou seja, sobre a Areia. Girassol
   ali dá 1,62:1 — invisível. Húmus dá 13,38:1. */
.consent__btn:focus-visible{
  outline: 3px solid var(--es-humus, #3B2312);
  outline-offset: 2px;
}

/* --- Celular ---------------------------------------------
   Medido a 360px: empilha e ocupa a largura toda, mantendo
   os dois botões exatamente do mesmo tamanho.
   --------------------------------------------------------- */
@media (max-width: 620px){
  .consent{ padding: 20px; }
  .consent__in{ gap: 16px; }
  .consent__text{ flex: 1 1 100%; font-size: .94rem; }
  .consent__actions{ flex: 1 1 100%; }
  .consent__btn{ flex: 1 1 0; min-width: 0; padding: 14px 10px; }
}

/* O botão flutuante do WhatsApp mora no mesmo canto. Enquanto o
   banner estiver aberto, ele sobe — a altura real vem do JS. */
body.consent-open .wa-float{
  bottom: calc(var(--consent-h, 150px) + 16px);
  transition: bottom .32s ease;
}