/* ==========================================================================
   Botões do site (Parte 3). Carregado em todas as páginas, depois dos outros CSS.
   - Principal (navy): textura com brilho no topo e sombra curta; "afunda" ao clicar.
   - Principal sobre fundo navy: papel, com o mesmo toque.
   - Secundário em fundo claro (FlowButton): contorno; no mouse o navy cresce do centro e a seta troca de lado.
   - Secundário em fundo navy (Liquid): contorno claro que enche de baixo com a cor Papel.
   Cores: navy #16233D, papel #F5F3EC, linha #DBD6C6. Só transform e opacity nos efeitos de preenchimento.
   ========================================================================== */
:root{--nx-btn-navy:#16233D;--nx-btn-paper:#F5F3EC;--nx-btn-line:#DBD6C6;--nx-btn-ease:cubic-bezier(.2,.7,.2,1);
  --nx-btn-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
  --nx-btn-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .10 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}

/* o brilho que passava no hover e a onda do clique saem: o efeito agora é o das regras abaixo */
.nx-rip{display:none!important}

/* ---------- Principal em fundo claro: navy com textura ---------- */
html body :is(.nx-primary-button,.dg-button:not(.dg-button-light),.nx-contact-submit,.nx-digital-secondary,.nx-segment-invite>a,.sg-action:not(.sg-action-light),.lp2-btn-navy){
  background-color:var(--nx-btn-navy)!important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 48%,rgba(0,0,0,.12) 100%),var(--nx-btn-grain)!important;
  background-size:100% 100%,80px 80px!important;background-position:0 0,0 0!important;background-repeat:no-repeat,repeat!important;
  color:var(--nx-btn-paper)!important;border:1px solid var(--nx-btn-navy)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 1px 2px rgba(22,35,61,.32),0 4px 10px -4px rgba(22,35,61,.4)!important;
  transition:transform .14s var(--nx-btn-ease),box-shadow .14s var(--nx-btn-ease),background-color .2s!important}
html body :is(.nx-primary-button,.dg-button:not(.dg-button-light),.nx-contact-submit,.nx-digital-secondary,.nx-segment-invite>a,.sg-action:not(.sg-action-light),.lp2-btn-navy):hover{
  background-color:#1f3254!important;background-position:0 0,0 0!important;transform:none}
html body :is(.nx-primary-button,.dg-button:not(.dg-button-light),.nx-contact-submit,.nx-digital-secondary,.nx-segment-invite>a,.sg-action:not(.sg-action-light),.lp2-btn-navy):active{
  transform:translateY(1px) scale(.985);box-shadow:inset 0 2px 5px rgba(0,0,0,.38),0 0 0 rgba(22,35,61,0)!important}
html body :is(.nx-primary-button,.dg-button,.nx-contact-submit,.nx-digital-secondary,.nx-segment-invite>a,.sg-action,.lp2-btn-navy,.nx-digital-cta,.nx-back-button,.dg-back,.nx-conversation-secondary,.nx-conversation-primary,.nx-human-cta):focus-visible{outline:2px solid #0e6b58;outline-offset:3px}

/* ---------- Principal em fundo navy: papel, mesmo toque ---------- */
html body :is(.dg-button-light,.sg-action-light,.nx-human-cta,.nx-conversation-primary,.co-link-light,.lp2-btn-light){
  background-color:var(--nx-btn-paper)!important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.7) 0%,rgba(255,255,255,0) 52%,rgba(22,35,61,.06) 100%)!important;
  background-size:100% 100%!important;background-position:0 0!important;background-repeat:no-repeat!important;
  color:var(--nx-btn-navy)!important;border-color:var(--nx-btn-paper)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 1px 2px rgba(0,0,0,.28),0 4px 10px -4px rgba(0,0,0,.4)!important;
  transition:transform .14s var(--nx-btn-ease),box-shadow .14s var(--nx-btn-ease),background-color .2s!important}
html body :is(.dg-button-light,.sg-action-light,.nx-human-cta,.nx-conversation-primary,.co-link-light,.lp2-btn-light):hover{background-color:#fbfaf6!important;background-position:0 0!important;transform:none;color:var(--nx-btn-navy)!important}
html body :is(.dg-button-light,.sg-action-light,.nx-human-cta,.nx-conversation-primary,.co-link-light,.lp2-btn-light):active{
  transform:translateY(1px) scale(.985);box-shadow:inset 0 2px 5px rgba(22,35,61,.28)!important}

/* ---------- Secundário em fundo claro: o navy cresce do centro; a seta troca de lado ---------- */
html body :is(.nx-digital-cta,.nx-back-button,.dg-wizard-actions>.dg-back){
  position:relative;overflow:hidden;isolation:isolate;
  background:transparent!important;background-image:none!important;color:var(--nx-btn-navy)!important;border:1px solid var(--nx-btn-line)!important;box-shadow:none!important;
  transition:color .35s var(--nx-btn-ease),border-color .35s var(--nx-btn-ease),transform .14s var(--nx-btn-ease)!important}
html body :is(.nx-digital-cta,.nx-back-button,.dg-wizard-actions>.dg-back)::before{
  content:"";position:absolute;z-index:-1;left:50%;top:50%;width:230%;aspect-ratio:1;border-radius:50%;background:var(--nx-btn-navy);
  transform:translate(-50%,-50%) scale(0);transition:transform .55s var(--nx-btn-ease);pointer-events:none}
html body :is(.nx-digital-cta,.nx-back-button,.dg-wizard-actions>.dg-back):hover{color:var(--nx-btn-paper)!important;border-color:var(--nx-btn-navy)!important;transform:none}
html body :is(.nx-digital-cta,.nx-back-button,.dg-wizard-actions>.dg-back):hover::before{transform:translate(-50%,-50%) scale(1)}
html body :is(.nx-digital-cta,.nx-back-button,.dg-wizard-actions>.dg-back):active{transform:translateY(1px) scale(.985)}
/* seta: sai pela direita e entra pela esquerda; o texto ocupa o lugar dela */
html body .nx-digital-cta{--nx-arrow-slot:25px;padding-left:20px!important;transition:color .35s var(--nx-btn-ease),border-color .35s var(--nx-btn-ease),padding-left .4s var(--nx-btn-ease),transform .14s var(--nx-btn-ease)!important}
html body .nx-digital-cta>svg{transition:transform .4s var(--nx-btn-ease),opacity .25s,margin-left .4s var(--nx-btn-ease)}
html body .nx-digital-cta::after{content:"";position:absolute;left:20px;top:50%;width:17px;height:17px;background:currentColor;
  -webkit-mask:var(--nx-btn-arrow) center/contain no-repeat;mask:var(--nx-btn-arrow) center/contain no-repeat;
  transform:translate(-10px,-50%);opacity:0;transition:transform .4s var(--nx-btn-ease),opacity .3s;pointer-events:none}
html body .nx-digital-cta:hover{padding-left:calc(20px + var(--nx-arrow-slot))!important}
html body .nx-digital-cta:hover>svg{transform:translateX(10px);opacity:0;margin-left:calc(var(--nx-arrow-slot) * -1)}
html body .nx-digital-cta:hover::after{transform:translate(0,-50%);opacity:1}

/* ---------- Secundário em fundo navy: contorno claro que enche de baixo com a cor Papel ---------- */
html body :is(.nx-conversation-secondary){
  position:relative;overflow:hidden;isolation:isolate;background:transparent!important;background-image:none!important;
  color:var(--nx-btn-paper)!important;border:1px solid rgba(220,234,229,.3)!important;box-shadow:none!important;
  transition:color .4s var(--nx-btn-ease),border-color .4s var(--nx-btn-ease),transform .14s var(--nx-btn-ease)!important}
html body :is(.nx-conversation-secondary)::before{
  content:"";position:absolute;z-index:-1;left:-8%;right:-8%;bottom:0;height:240%;background:var(--nx-btn-paper);
  border-radius:50% 50% 0 0/9% 9% 0 0;transform:translateY(100%);transition:transform .65s var(--nx-btn-ease);pointer-events:none}
html body :is(.nx-conversation-secondary):hover{color:var(--nx-btn-navy)!important;border-color:var(--nx-btn-paper)!important;transform:none}
html body :is(.nx-conversation-secondary):hover::before{transform:translateY(0)}
html body :is(.nx-conversation-secondary):active{transform:translateY(1px) scale(.985)}

@media (prefers-reduced-motion:reduce){
  html body :is(.nx-primary-button,.dg-button,.nx-contact-submit,.nx-digital-secondary,.nx-segment-invite>a,.sg-action,.lp2-btn-navy,.nx-digital-cta,.nx-back-button,.dg-back,.nx-conversation-secondary,.nx-conversation-primary,.nx-human-cta,.co-link-light,.lp2-btn-light)::before,
  html body :is(.nx-digital-cta,.nx-conversation-secondary,.nx-primary-button,.dg-button,.nx-contact-submit,.nx-digital-secondary,.nx-segment-invite>a,.nx-human-cta,.nx-conversation-primary),
  html body .nx-digital-cta>svg,html body .nx-digital-cta::after{transition:none!important}
}
