/* --- Botão: arredondado, gradiente deslizante, respiração e anel pulsante contínuos --- */
.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.6rem;
  padding: 0.95rem 2.4rem;
  border: 0;
  border-radius: var(--r-pill);
  font-size: clamp(0.875rem, 0.82rem + 0.28vw, 1.0625rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: var(--action-ink);
  background-color: var(--c-green);
  background-image: linear-gradient(100deg, var(--c-green-deep) 0%, var(--c-green) 28%, var(--c-green-bright) 50%, var(--c-green) 72%, var(--c-green-deep) 100%);
  background-size: 260% 100%;
  box-shadow: var(--sh-action), inset 0 1px 0 rgb(255 255 255 / 0.25);
  isolation: isolate;
  -webkit-tap-highlight-color: transparent;
  animation: btn-hue 6s linear infinite, btn-breathe 3s var(--ease-out) infinite;
  transition: transform 160ms var(--ease-spring), box-shadow 0.4s var(--ease-out), filter 160ms;
}
.btn--block { display: flex; width: 100%; }
@keyframes btn-hue { to { background-position: 260% 50%; } }
@keyframes btn-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.025); } }
.btn::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  border: 2px solid var(--c-green-bright); opacity: 0;
  animation: btn-ring 2.4s var(--ease-out) infinite;
}
@keyframes btn-ring { 0% { transform: scale(1); opacity: 0.6; } 70%, 100% { transform: scale(1.2, 1.5); opacity: 0; } }
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background-image: linear-gradient(110deg, transparent 40%, rgb(255 255 255 / 0.5) 50%, transparent 60%);
  background-size: 300% 100%; background-repeat: no-repeat; background-position: 150% 0; opacity: 0;
}
@media (hover: hover) {
  .btn:hover { transform: translateY(-3px) scale(1.02); box-shadow: 0 18px 44px color-mix(in srgb, var(--c-green-deep) 60%, transparent), inset 0 1px 0 rgb(255 255 255 / 0.3); animation-play-state: paused, paused; }
  .btn:hover::before { opacity: 1; animation: btn-shine 0.85s var(--ease-out); }
}
@keyframes btn-shine { from { background-position: 150% 0; } to { background-position: -50% 0; } }
.btn:active { transform: scale(0.97); transition-duration: 80ms; }
.btn:focus-visible { outline: 3px solid var(--c-bone); outline-offset: 4px; }
.btn[disabled], .btn[aria-busy="true"] { cursor: progress; filter: saturate(0.6); animation-play-state: paused, paused; transform: none; }
.btn[disabled]::after { animation: none; opacity: 0; }
.btn__spin { display: inline-block; width: 1em; height: 1em; margin-right: 0.6em; vertical-align: -0.12em; border: 2px solid rgb(255 255 255 / 0.35); border-top-color: #fff; border-radius: 50%; animation: giro 0.8s linear infinite; }
@keyframes giro { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .btn, .btn::after { animation: none; } }

/* --- Formulário --- */
.form { display: grid; gap: 0.8rem; }
.field { position: relative; display: block; }
.field__input {
  width: 100%; min-height: 3.5rem; padding: 0.9rem 3rem 0.9rem 1.5rem;
  font-size: 1rem; color: var(--c-ink); background: #fff;
  border: 1px solid transparent; border-radius: var(--r-pill); outline: none;
  transition: border-color 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.field__input::placeholder { color: color-mix(in srgb, var(--c-ink) 55%, transparent); }
.field__input:focus { border-color: var(--c-gold); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-gold) 30%, transparent); }
.field__mark { position: absolute; right: 1.1rem; top: 1.75rem; width: 1.1rem; height: 1.1rem; margin-top: -0.55rem; color: #14892c; opacity: 0; transform: scale(0.6); transition: opacity 0.4s var(--ease), transform 0.4s var(--ease); pointer-events: none; }
.field.is-valid .field__mark { opacity: 1; transform: none; }
.field.is-invalid .field__input { border-color: #e0715c; }
.field__error { display: block; padding: 0.35rem 1.5rem 0; font-size: 0.8125rem; font-weight: 500; color: #ffb4a3; }
.field__error:empty { display: none; }
.field--trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__status { font-size: 0.875rem; text-align: center; color: var(--on-dark-soft); }
.form__status:empty { display: none; }
.form__status[data-state="error"] { color: #ffb4a3; font-weight: 500; }
.form__status[data-state="ok"] { color: #7ee2a2; font-weight: 500; }
.form__note { margin-top: 0.2rem; font-size: 0.8125rem; text-align: center; color: var(--on-dark-mute); }

.is-called .field__input { animation: chamado 1.4s var(--ease); }
@keyframes chamado { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--c-gold) 60%, transparent); } 60% { box-shadow: 0 0 0 18px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }

/* --- Cartões --- */
.card { padding: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem); border-radius: var(--r-l); background: #fff; box-shadow: var(--shadow-card); }

/* --- Seletor de país do WhatsApp (intl-tel-input, visual da página) ---------- */
.iti { display: block; width: 100%; --iti-hover-color: #f1ede2; --iti-border-color: transparent; --iti-dropdown-bg: #fff; --iti-arrow-color: var(--c-ink); --iti-dialcode-color: var(--c-ink); --iti-path-flags-1x: url("/nsj/assets/img/flags.webp"); --iti-path-flags-2x: url("/nsj/assets/img/flags@2x.webp"); --iti-path-globe-1x: url("/nsj/assets/img/globe.webp"); --iti-path-globe-2x: url("/nsj/assets/img/globe@2x.webp"); }
.iti .field__input { padding-right: 3rem; }
.iti__country-container { padding: 0.35rem 0 0.35rem 0.35rem; }
.iti__selected-country { border-radius: var(--r-pill); padding-inline: 0.5rem 0.3rem; transition: background-color 0.3s var(--ease); }
.iti__selected-country-primary { gap: 0.1rem; padding-inline: 0.5rem; border-radius: var(--r-pill); }
.iti__selected-country-primary:hover, .iti--container .iti__selected-country-primary:hover { background: #f1ede2; }
.iti__selected-dial-code { font-size: 1rem; color: var(--c-ink); margin-left: 0.4rem; }
.iti__arrow { margin-left: 0.4rem; border-top-color: var(--c-ink); opacity: 0.55; transition: transform 0.3s var(--ease); }
.iti__arrow--up { transform: rotate(180deg); border-top-color: var(--c-ink); border-bottom: 0; }

/* lista: aberta no <body>, sobre tudo; cantos e sombra no mesmo tom dos cartões */
.iti--container { z-index: 1000; }
.iti__dropdown-content { overflow: hidden; border: 1px solid var(--line); border-radius: 1rem; background: #fff; box-shadow: 0 24px 60px -12px rgb(19 26 21 / 0.5), 0 2px 6px rgb(19 26 21 / 0.12); color: var(--c-ink); font-family: var(--font); }
.iti--inline-dropdown .iti__dropdown-content { margin-top: 0.4rem; }
.iti__search-input { width: 100%; min-height: 3rem; padding: 0.7rem 1rem; font-size: 1rem; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: #faf8f2; color: var(--c-ink); outline: none; }
.iti__search-input:focus { background: #fff; box-shadow: inset 0 -2px 0 var(--c-gold); }
.iti__country-list { max-height: 15rem; overscroll-behavior: contain; }
.iti__country { display: flex; align-items: center; gap: 0.6rem; padding: 0.7rem 1rem; font-size: 0.9375rem; }
.iti__country.iti__highlight { background: #f1ede2; }
.iti__divider { border-bottom-color: var(--line); }
.iti__dial-code { color: var(--ink-soft); }

/* celular: tela cheia, nada por trás respondendo ao toque */
.iti--fullscreen-popup.iti--container { background: rgb(19 26 21 / 0.72); backdrop-filter: blur(4px); padding: 1rem; }
.iti--fullscreen-popup .iti__dropdown-content { max-height: 100%; display: flex; flex-direction: column; }
.iti--fullscreen-popup .iti__country-list { max-height: none; flex: 1; }
.iti--fullscreen-popup .iti__country { padding-block: 0.9rem; }