/* =========================================================================
   Lumin'área · o convite do próximo ciclo
   Mesma linha da casa: cartão branco, régua de 1px, amarelo só como luz,
   cantos retos. O botão é discreto dentro do card, porque o convite
   principal continua sendo a inscrição.
   ========================================================================= */

/* ------------------------------------------------ o botão dentro do card */
.btn-aviso{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:6px 2px;border:0;background:none;cursor:pointer;
  font-size:12.5px;line-height:1.4;letter-spacing:.01em;text-align:center;
  color:var(--terra,#B67460);position:relative;
}
/* o traço só aparece no toque do olhar: no repouso, o convite é discreto,
   porque o botão principal continua sendo a inscrição */
.btn-aviso span{position:relative;padding-bottom:2px}
.btn-aviso span::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:currentColor;opacity:.5;transform:scaleX(0);transform-origin:center;
  transition:transform .34s var(--calma,cubic-bezier(.22,.8,.28,1));
}
.btn-aviso:hover span::after,
.btn-aviso:focus-visible span::after{transform:scaleX(1)}
.btn-aviso:focus-visible{outline:2px solid var(--luz,#F0C800);outline-offset:3px}
.btn-aviso .sino-min{
  width:13px;height:14px;flex:none;position:relative;display:inline-block;
}
.btn-aviso .sino-min::before{
  content:"";position:absolute;inset:0 1px 3px 1px;
  border:1px solid currentColor;border-bottom:0;
  border-radius:50% 50% 0 0 / 62% 62% 0 0;
}
.btn-aviso .sino-min::after{
  content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;
}
.btn-aviso:hover .sino-min{animation:sineta .6s var(--calma,ease)}
@keyframes sineta{
  0%,100%{transform:rotate(0)}
  30%{transform:rotate(-11deg)}
  65%{transform:rotate(7deg)}
}

/* dentro da tarja escura dos próximos encontros, o convite clareia */
.encontros .btn-aviso{color:rgba(233,223,210,.8)}
.encontros .btn-aviso:hover{color:#F7F2E9}

/* na agenda e na tarja, a coluna de ações é estreita: o convite acompanha
   a largura do botão de inscrição em vez de esticar sozinho */
.evento-acoes{flex-wrap:wrap}
.evento-acoes .btn-aviso{max-width:20ch;margin-inline:auto}

/* ------------------------------------------------------------- a caixa */
body.ciclo-aberto{overflow:hidden}

.ciclo-veu{
  position:fixed;inset:0;z-index:70;background:rgba(34,24,18,.52);
  opacity:0;transition:opacity .34s var(--calma,cubic-bezier(.22,.8,.28,1));
}
.ciclo-veu.aberto{opacity:1}

.ciclo-caixa{
  position:fixed;z-index:71;left:50%;top:50%;
  width:min(468px,calc(100vw - 26px));max-height:min(88vh,760px);overflow-y:auto;
  background:#FFFFFF;border:1px solid var(--linho,#E2D8CD);
  padding:clamp(26px,4vw,38px) clamp(22px,4vw,36px) clamp(24px,4vw,32px);
  transform:translate(-50%,-46%);opacity:0;
  transition:transform .42s var(--calma,cubic-bezier(.22,.8,.28,1)),
             opacity .34s var(--calma,cubic-bezier(.22,.8,.28,1));
}
.ciclo-caixa.aberta{transform:translate(-50%,-50%);opacity:1}

.ciclo-caixa .rotulo{
  display:flex;align-items:center;gap:10px;margin:0 0 12px;
  font-size:10.5px;text-transform:uppercase;letter-spacing:.3em;color:var(--terra,#B67460);
}
.ciclo-caixa .tick{display:inline-block;width:20px;height:2px;background:var(--luz,#F0C800);flex:none}
.ciclo-caixa .titulo-2{
  margin:0 0 10px;font-size:clamp(21px,3vw,26px);font-weight:600;letter-spacing:-.03em;
  color:var(--tinta,#221812);text-wrap:balance;
}
.ciclo-linha{
  margin:0 0 22px;color:var(--tinta-suave,#5A4B40);font-size:14.5px;line-height:1.66;
  text-wrap:pretty;
}
.ciclo-linha strong{color:var(--marrom,#2A1B16);font-weight:600}

.ciclo-fecha{
  position:absolute;top:12px;right:12px;width:36px;height:36px;
  border:0;background:none;cursor:pointer;padding:0;
}
.ciclo-fecha i{position:absolute;inset:0}
.ciclo-fecha i::before,.ciclo-fecha i::after{
  content:"";position:absolute;left:11px;right:11px;top:17px;height:1px;
  background:var(--taupe,#B09F8D);transition:background .2s ease;
}
.ciclo-fecha i::before{transform:rotate(45deg)}
.ciclo-fecha i::after{transform:rotate(-45deg)}
.ciclo-fecha:hover i::before,.ciclo-fecha:hover i::after{background:var(--marrom,#2A1B16)}

/* ---------------------------------------------------------- o formulário */
.ciclo-campo{display:block;margin-bottom:14px}
.ciclo-campo > span{
  display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.22em;
  color:var(--rotulo,#7A6C60);margin-bottom:7px;
}
.ciclo-campo input,.ciclo-campo textarea{
  width:100%;padding:11px 13px;font:inherit;font-size:15px;
  border:1px solid var(--linho,#E2D8CD);background:var(--marfim,#F7F2E9);
  color:var(--tinta,#221812);transition:border-color .2s ease,background .2s ease;
}
.ciclo-campo textarea{resize:vertical;line-height:1.6}
.ciclo-campo input:focus,.ciclo-campo textarea:focus{
  outline:none;border-color:var(--taupe,#B09F8D);background:#FFFFFF;
  box-shadow:inset 0 -2px 0 var(--luz,#F0C800);
}

/* o campo isca: gente não vê, robô preenche e a casa recusa */
.ciclo-isca{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.ciclo-consentimento{
  display:flex;gap:11px;align-items:flex-start;margin:18px 0 20px;
  font-size:13px;line-height:1.55;color:var(--tinta-suave,#5A4B40);cursor:pointer;
}
.ciclo-consentimento input{
  appearance:none;width:18px;height:18px;flex:none;margin-top:1px;
  border:1px solid var(--areia,#C5B6A7);background:#FFFFFF;cursor:pointer;position:relative;
}
.ciclo-consentimento input:checked{background:var(--marrom,#2A1B16);border-color:var(--marrom,#2A1B16)}
.ciclo-consentimento input:checked::after{
  content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;
  border:solid var(--luz,#F0C800);border-width:0 1.5px 1.5px 0;transform:rotate(42deg);
}
.ciclo-consentimento input:focus-visible{outline:2px solid var(--luz,#F0C800);outline-offset:2px}

.ciclo-forma .btn-solido{width:100%;justify-content:center}
.ciclo-recado{
  min-height:20px;margin:12px 0 0;font-size:13px;color:#9C3B23;text-align:center;
}
.ciclo-recado.bom{color:#4F6B45}

@media (max-width:520px){
  .ciclo-caixa{top:auto;bottom:0;transform:translate(-50%,14px);max-height:92vh;
    width:100%;border-bottom:0;border-left:0;border-right:0}
  .ciclo-caixa.aberta{transform:translate(-50%,0)}
}

@media (prefers-reduced-motion:reduce){
  .ciclo-veu,.ciclo-caixa{transition:none}
  .btn-aviso:hover .sino-min{animation:none}
}
