/* Public home newsletter (footer). Behaviour: src/flicko-newsletter.js. Tokens: src/flicko-tokens.css (light/dark). */
.fk-nl-lead{margin:-.25rem 0 .875rem;font-size:.875rem;line-height:1.5;color:var(--fk-text-soft,#3E3049)}
.fk-nl{position:relative}
/* Honeypot: off-screen (not display:none, so naive bots still fill it); never focusable, hidden from assistive tech. */
.fk-nl-hp{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.fk-nl-input:focus-visible{outline:2px solid var(--fk-focus,#2B4BE0);outline-offset:2px;border-color:var(--fk-focus,#2B4BE0)}
.fk-nl-input[aria-invalid=true],.fk-nl-input[aria-invalid=true]:focus-visible{border-color:var(--fk-danger,#B3261E);outline-color:var(--fk-danger,#B3261E)}
.fk-nl-submit:focus-visible{outline:2px solid var(--fk-focus,#2B4BE0);outline-offset:3px}
.fk-nl-submit[aria-busy=true]{cursor:progress}
.fk-nl-submit[aria-busy=true] .fk-nl-spin{display:inline-block}
.fk-nl-spin{display:none;width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:fk-nl-spin .8s linear infinite}
@keyframes fk-nl-spin{to{transform:rotate(1turn)}}
@media (prefers-reduced-motion:reduce){.fk-nl-spin{animation-duration:2.4s}}
.fk-nl-status{margin:0;min-height:0;font-size:.875rem;line-height:1.45;font-weight:600}
.fk-nl-status:empty{display:none}
.fk-nl-status[data-tone=ok]{color:var(--fk-success,#1F7A4A)}
.fk-nl-status[data-tone=info]{color:var(--fk-text-soft,#3E3049)}
.fk-nl-status[data-tone=error]{color:var(--fk-danger,#B3261E)}
.fk-nl-consent{margin:0;font-size:.75rem;line-height:1.5;color:var(--fk-text-muted,#574765)}
.fk-nl-consent a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.fk-nl-consent a:focus-visible{outline:2px solid var(--fk-focus,#2B4BE0);outline-offset:2px;border-radius:2px}
.fk-nl[data-state=done] .fk-nl-field{opacity:.6}
/* D13 (layout audit 20/10/2026): the taller newsletter column stretched the footer's first row and left ~130 px empty above
   "Jurídico". From 1024 px the footer becomes a two-column grid: brand + link columns on the left, the newsletter spanning
   both rows on the right, the bottom bar across. Below 1024 px the original stacked flow stays. */
@media (min-width:1024px){
 footer div:has(> div > .fk-nl-col){display:grid;grid-template-columns:minmax(0,1fr) 22rem;column-gap:2rem;align-items:start}
 footer div:has(> .fk-nl-col){display:contents}
 footer div:has(> div > .fk-nl-col) > div:has(> .fk-nl-col) > :not(.fk-nl-col){grid-column:1;grid-row:1}
 footer .fk-nl-col{grid-column:2;grid-row:1 / span 2}
 footer div:has(> div > .fk-nl-col) > .mt-14{grid-column:1;grid-row:2;margin-top:2.5rem}
 footer div:has(> div > .fk-nl-col) > .mt-16{grid-column:1 / -1;grid-row:3}
}
