/* Lista de espera e ajustes da LP estática (sem o bundle antigo do Next). */
:root { --hyvo-green: #c8f169; --focus: #111; }
.skip-link { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: 999px; background: #111; color: #fff; font-size: 14px; }
.skip-link:focus { top: 12px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.mobile-menu { cursor: pointer; }
.drawer-close { cursor: pointer; width: 100%; font: inherit; color: inherit; }
.drawer-backdrop { position: absolute; inset: 0; width: 100%; cursor: pointer; }

/* Selos de status: o que existe, o que entra no lançamento e o que é futuro. */
.status-tag { display: inline-block; margin-left: 8px; padding: 3px 8px; border-radius: 999px; background: var(--hyvo-green); color: #1d2a06; font-size: 9px; font-style: normal; font-weight: 750; letter-spacing: .06em; vertical-align: middle; }
.status-tag.soon { background: #e7ebee; color: #4a5056; }
.illustrative-tag { position: absolute; z-index: 5; top: 10px; right: 12px; padding: 4px 9px; border-radius: 999px; background: rgba(17, 17, 17, .72); color: #fff; font-size: 10px; font-weight: 650; letter-spacing: .04em; pointer-events: none; }
.hero-visual, .account-visual { position: relative; }
.plan-grid strong small { margin-left: 4px; font-size: 13px; font-weight: 500; opacity: .7; }
.plan-grid li.partial em { margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: #343434; color: #ddd; font-size: 10px; font-style: normal; }
.plan-grid article:not(.featured) li.partial em { background: #e7ebee; color: #4a5056; }
.plans-note { margin: 28px auto 0; max-width: 820px; color: #666; font-size: 13px; line-height: 1.6; text-align: center; }
.hero-foot span:last-child { user-select: all; }

/* FAQ: aberta por padrão (funciona sem JS); com JS, a página fecha as demais. */
.faq-list a { text-decoration: underline; }

/* Formulário: vidro fosco ("moon glass") mantendo contraste do texto. */
.contact form.waitlist-form { grid-template-columns: 1fr 1fr; align-items: end; gap: 14px; padding: 22px; border: 1px solid rgba(255, 255, 255, .75); border-radius: 28px; }
.moon-glass { background: linear-gradient(145deg, rgba(255, 255, 255, .78), rgba(236, 240, 243, .56)); -webkit-backdrop-filter: blur(18px) saturate(1.2); backdrop-filter: blur(18px) saturate(1.2); box-shadow: 0 24px 60px rgba(35, 40, 45, .18), inset 0 1px 0 rgba(255, 255, 255, .9); transition: box-shadow .25s, transform .25s; }
.moon-glass:hover, .moon-glass:focus-within { box-shadow: 0 30px 70px rgba(35, 40, 45, .24), 0 0 0 3px rgba(200, 241, 105, .55), inset 0 1px 0 #fff; }
.contact .waitlist-form label span { font-size: 11px; color: #3e454b; }
.contact .waitlist-form input:hover, .contact .waitlist-form select:hover { border-color: rgba(17, 17, 17, .5); }
.contact .waitlist-form input[aria-invalid="true"], .contact .waitlist-form select[aria-invalid="true"] { border-color: #b42318; }
.waitlist-form .consent { grid-column: 1 / -1; display: flex; gap: 10px; align-items: flex-start; }
.contact .waitlist-form .consent input { width: 18px; height: 18px; margin-top: 2px; flex: none; border-radius: 4px; padding: 0; accent-color: #111; }
.contact .waitlist-form .consent span { padding: 0; font-size: 12px; font-weight: 500; line-height: 1.5; }
.waitlist-form .waitlist-submit { grid-column: 1 / -1; width: 100%; }
.waitlist-submit[aria-busy="true"] { opacity: .7; cursor: progress; }
.waitlist-submit[aria-busy="true"] span::after { content: ""; display: inline-block; width: 14px; height: 14px; margin-left: 10px; border: 2px solid rgba(255, 255, 255, .4); border-top-color: #fff; border-radius: 50%; vertical-align: -2px; animation: hyvo-spin .8s linear infinite; }
@keyframes hyvo-spin { to { transform: rotate(360deg); } }
.form-feedback { grid-column: 1 / -1; min-height: 1em; margin: 0; font-size: 13px; color: #b42318; }
.form-feedback:empty { display: none; }
.hp-field { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Avisos de resultado: aparecem via :target (sem JS) ou pela classe .show (com JS). */
.waitlist-status { display: none; max-width: 650px; margin-top: 24px; padding: 14px 18px; border-radius: 18px; font-size: 14px; line-height: 1.5; }
.waitlist-status:target, .waitlist-status.show { display: block; }
.waitlist-status.ok { background: rgba(200, 241, 105, .9); color: #1d2a06; }
.waitlist-status.error { background: #fee4e2; color: #7a271a; }
.waitlist-done .waitlist-form { display: none; }

.footer-baas { border-top: 1px solid rgba(255, 255, 255, .08); padding: 24px 0; margin-top: 24px; display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; color: rgba(255, 255, 255, .7); font-size: 12.5px; line-height: 1.6; }
.footer-baas > a { flex-shrink: 0; display: inline-block; }
.footer-baas img { display: block; }
.footer-baas > div { flex: 1; min-width: 260px; max-width: 820px; }
.footer-baas strong { color: #fff; }
.asaas-support { display: inline-block; margin-top: 8px; }
.asaas-support a, .footer-bottom a { color: var(--hyvo-green); }
.footer-bottom a { color: inherit; }

@media (max-width: 900px) { .mobile-menu { display: block; } }
@media (max-width: 640px) {
  .contact form.waitlist-form { grid-template-columns: 1fr; padding: 16px; }
  .contact form .pill { width: 100%; }
  .status-tag { margin: 6px 0 0; display: table; }
}
@media (prefers-reduced-motion: reduce) { .moon-glass, .waitlist-submit span::after { transition: none; animation: none; } }