/* Landing newslettera (/newsletter/). Układ i kolory są w atrybutach style z projektu Claude Design;
   tu tylko to, czego style inline nie potrafią: stany :hover/:focus, formularz, FAQ, animacje, telefon. */
.nl [hidden], #nl-mini[hidden] { display: none !important; }
.nl { color: #2C2C2C; font-size: 17px; line-height: 1.6; overflow-x: clip; background: #fff; }
.nl h1, .nl h2, .nl h3, .nl p, .nl blockquote, .nl figure { margin: 0; }
.nl h1, .nl h2, .nl h3 { text-wrap: balance; letter-spacing: -0.01em; }
.nl section[id] { scroll-margin-top: calc(var(--header-h) + 12px); }
.nl #zapis { scroll-margin-top: calc(var(--header-h) + 24px); }
.nl a[href="#numer"]:hover, .nl a[href^="mailto:"]:hover, .nl #nl-copy:hover { background: #F3F2F2 !important; }
.nl #nl-li:hover { background: #404040 !important; }

/* Formularz zapisu */
.nl-form { display: grid; gap: 24px; }
.nl-row { display: flex; gap: 10px; flex-wrap: wrap; }
.nl-row input[type=email] { flex: 1 1 220px; min-width: 0; max-width: 400px; font: inherit; font-size: 16px; color: #2C2C2C; background: #fff; border: 1.5px solid transparent; border-radius: 10px; padding: 12px 14px; outline: none; }
.nl-row input[type=email]:focus { border-color: #EC4A3F; }
.nl-row button { appearance: none; border: 0; cursor: pointer; font: inherit; font-size: 16px; font-weight: 700; color: #fff; background: #D63637; border-radius: 999px; padding: 13px 32px; transition: filter .15s ease; animation: nlGlow 2.2s ease-out infinite; }
.nl-row button:hover { filter: brightness(1.06); }
.nl-row button[disabled] { opacity: .75; cursor: wait; animation: none; }
.nl-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5; color: #D9D9D9; cursor: pointer; }
.nl-consent input { margin-top: 3px; width: 18px; height: 18px; accent-color: #D63637; flex: none; }
.nl-consent a { color: #fff; }
.nl-err { font-size: 14px; color: #FF8A80; }
.nl-form.bad input[type=email]:invalid, .nl-form .is-bad { border-color: #FF8A80 !important; }
.nl-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.nl-ok { display: grid; gap: 8px; }
@keyframes nlGlow { 0% { box-shadow: 0 0 0 0 rgba(214,54,55,.55); } 70% { box-shadow: 0 0 0 12px rgba(214,54,55,0); } 100% { box-shadow: 0 0 0 0 rgba(214,54,55,0); } }

/* FAQ */
.nl-faq { border-bottom: 1px solid #E6E6E6; padding-block: 18px; }
.nl-faq summary { list-style: none; cursor: pointer; font-size: 18px; font-weight: 800; display: flex; justify-content: space-between; gap: 16px; }
.nl-faq summary::-webkit-details-marker { display: none; }
.nl-faq summary span::before { content: "+"; font-weight: 300; font-size: 24px; line-height: 1; }
.nl-faq[open] summary span::before { content: "–"; }

/* Pasek „Zapisz się” po przewinięciu formularza */
#nl-mini a:hover { filter: brightness(1.06); }
#nl-mini button:hover { background: rgba(255,255,255,.08) !important; color: #fff !important; }

/* Logotypy klientów */
@keyframes rfm-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Zdjęcia w hero: na telefonie chowamy (zasłaniałyby formularz) */
@media (max-width: 860px) { #rfm-scatter { display: none; } }
@media (max-width: 640px) {
  .nl #hero { min-height: 0 !important; padding: 40px 0 32px !important; }
  .nl-row button { width: 100%; }
  .nl #zaufali img { height: 80px !important; margin-right: 48px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .nl-row button { animation: none; }
  .nl [aria-label="Klienci Innovatiki"] > div { animation: none !important; }
}
.nl-err a { color: #fff; font-weight: 700; }
