/* =========================================================================
   Lumin'área · o mini-formulário de interesse (briefing de 27/09)
   Peça nova, no vocabulário da casa: cartão branco sobre véu quente, fio de
   1px em linho, cantos retos, amarelo só como luz, botão como os do site.
   Não depende do lumi.css: a página de encontro também carrega este arquivo,
   então as cores moram aqui com o mesmo valor.
   ========================================================================= */
.int-veu,.int-painel{
  --int-marfim:#F7F2E9;--int-linho:#E2D6CD;--int-areia:#CEB6A7;--int-taupe:#B09F8D;
  --int-pedra:#6A655F;--int-marrom:#2A1B16;--int-tinta:#221812;--int-suave:#51443A;
  --int-rotulo:#7A6C60;--int-terra:#B67460;--int-luz:#F0CB00;
  --int-calma:cubic-bezier(.22,.8,.28,1);
}
html.int-aberto,html.int-aberto body{overflow:hidden}

.int-veu{
  position:fixed;inset:0;z-index:300;background:rgba(34,24,18,.52);
  opacity:0;transition:opacity .32s var(--int-calma);
}
.int-veu.aberto{opacity:1}

.int-painel{
  position:fixed;z-index:301;left:50%;top:50%;
  width:min(440px,calc(100vw - 32px));max-height:min(90vh,720px);overflow-y:auto;
  overscroll-behavior:contain;
  background:#FFFFFF;border:1px solid var(--int-linho);border-radius:0;
  padding:34px clamp(22px,4vw,34px) 28px;
  color:var(--int-tinta);font-family:inherit;font-size:16px;line-height:1.6;text-align:left;
  transform:translate(-50%,-46%);opacity:0;
  transition:transform .4s var(--int-calma),opacity .32s var(--int-calma);
}
.int-painel.aberta{transform:translate(-50%,-50%);opacity:1}

.int-rotulo{
  display:flex;align-items:center;gap:10px;margin:0 44px 12px 0;
  font-size:10.5px;line-height:1.5;text-transform:uppercase;letter-spacing:.26em;color:var(--int-terra);
}
.int-rotulo i{display:inline-block;width:20px;height:2px;background:var(--int-luz);flex:none}
.int-titulo{
  margin:0 0 10px;font-size:clamp(21px,3vw,25px);line-height:1.25;font-weight:600;
  letter-spacing:-.025em;color:var(--int-tinta);text-wrap:balance;
}
.int-linha{margin:0 0 22px;color:var(--int-suave);font-size:14.5px;line-height:1.66;text-wrap:pretty}

.int-fecha{
  position:absolute;top:10px;right:10px;width:44px;height:44px;
  border:0;background:none;cursor:pointer;padding:0;border-radius:0;
}
.int-fecha i{position:absolute;inset:0}
.int-fecha i::before,.int-fecha i::after{
  content:"";position:absolute;left:14px;right:14px;top:21px;height:1px;
  background:var(--int-taupe);transition:background .2s ease;
}
.int-fecha i::before{transform:rotate(45deg)}
.int-fecha i::after{transform:rotate(-45deg)}
.int-fecha:hover i::before,.int-fecha:hover i::after{background:var(--int-marrom)}
.int-fecha:focus-visible{outline:2px solid var(--int-luz);outline-offset:-4px}

/* ------------------------------------------------------------ os campos */
.int-campo{display:block;margin:0 0 14px}
.int-campo > span{
  display:block;margin-bottom:7px;
  font-size:10.5px;line-height:1.4;text-transform:uppercase;letter-spacing:.2em;color:var(--int-rotulo);
}
.int-campo input{
  display:block;width:100%;min-height:48px;padding:11px 13px;margin:0;
  font:inherit;font-size:16px;line-height:1.4;border-radius:0;
  border:1px solid var(--int-linho);background:var(--int-marfim);color:var(--int-tinta);
  -webkit-appearance:none;appearance:none;
  transition:border-color .2s ease,background .2s ease;
}
.int-campo input:focus{
  outline:none;border-color:var(--int-taupe);background:#FFFFFF;
  box-shadow:inset 0 -2px 0 var(--int-luz);
}
.int-isca{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.int-consentimento{
  display:flex;gap:12px;align-items:flex-start;margin:18px 0 6px;
  font-size:13.5px;line-height:1.55;color:var(--int-suave);
}
.int-consentimento label{cursor:pointer;text-wrap:pretty;padding-top:1px}
.int-consentimento input{
  -webkit-appearance:none;appearance:none;width:22px;height:22px;flex:none;margin:0;
  border:1px solid var(--int-areia);border-radius:0;background:#FFFFFF;cursor:pointer;position:relative;
}
.int-consentimento input:checked{background:var(--int-marrom);border-color:var(--int-marrom)}
.int-consentimento input:checked::after{
  content:"";position:absolute;left:7px;top:2px;width:6px;height:12px;
  border:solid var(--int-luz);border-width:0 1.5px 1.5px 0;transform:rotate(42deg);
}
.int-consentimento input:focus-visible{outline:2px solid var(--int-luz);outline-offset:2px}

.int-politica{margin:0 0 20px 34px;font-size:13px;line-height:1.5}
.int-politica a{
  color:var(--int-terra);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;
  display:inline-block;padding:4px 0;
}
.int-politica a:hover{color:var(--int-marrom)}

/* o botão é o btn-solido da casa: pedra taupe, letra marrom, traço amarelo */
.int-enviar{
  display:flex;width:100%;min-height:52px;align-items:center;justify-content:center;
  padding:18px 24px;margin:0;border:0;border-radius:0;cursor:pointer;position:relative;overflow:hidden;
  background:var(--int-taupe);color:var(--int-marrom);text-decoration:none;
  font:inherit;font-size:11px;line-height:1;font-weight:500;text-transform:uppercase;letter-spacing:.24em;
  transition:background .45s var(--int-calma),color .45s var(--int-calma);
}
.int-enviar::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--int-luz);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--int-calma);
}
.int-enviar:hover{background:var(--int-pedra);color:var(--int-marfim)}
.int-enviar:hover::after,.int-enviar:focus-visible::after{transform:scaleX(1)}
.int-enviar:focus-visible{outline:2px solid var(--int-luz);outline-offset:3px}
.int-enviar:disabled{opacity:.6;cursor:default}

.int-recado{min-height:20px;margin:12px 0 0;font-size:13px;line-height:1.5;color:#9C3B23;text-align:center}
.int-recado:empty{margin:0;min-height:0}
.int-pronto{margin-top:4px}

/* no celular, o painel sobe de baixo, na largura toda */
@media (max-width:520px){
  .int-painel{
    top:auto;bottom:0;width:100%;max-height:92vh;
    border-left:0;border-right:0;border-bottom:0;
    padding:30px 20px calc(24px + env(safe-area-inset-bottom,0px));
    transform:translate(-50%,16px);
  }
  .int-painel.aberta{transform:translate(-50%,0)}
}

@media (prefers-reduced-motion:reduce){
  .int-veu,.int-painel,.int-enviar,.int-enviar::after{transition:none}
}