/* Newsletter signup: article sidebar, end of article, blog index, site footer. */
.nl{font-family:Velisto,Arial,sans-serif;color:#171a2e}
.nl .nl-title{margin:0;color:#171a2e;font-weight:800;font-size:1rem;line-height:1.3;letter-spacing:-.01em}
.nl .nl-promise{margin:6px 0 0;color:#62677b;font-size:.875rem;line-height:1.55}
.nl-form{display:flex;gap:8px;margin-top:14px}
.nl-form input{flex:1;min-width:0;height:44px;padding:0 13px;border:1px solid #d9d6e4;border-radius:10px;background:#fff;color:#171a2e;font:inherit;font-size:.9375rem}
.nl-form input::placeholder{color:#9a98ab}
.nl-form input:focus{outline:2px solid rgba(99,53,237,.3);outline-offset:1px;border-color:#6335ed}
.nl-form button{height:44px;padding:0 18px;border:0;border-radius:10px;background:#6335ed;color:#fff;font:inherit;font-size:.9375rem;font-weight:700;white-space:nowrap;cursor:pointer;transition:background .15s}
.nl-form button:hover{background:#4820ba}
.nl-form button:disabled{opacity:.6;cursor:default}
.nl-fine{margin:10px 0 0;color:#7b718d;font-size:.75rem;line-height:1.5}
.nl-fine a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.nl-fine-error{color:#b4411b;font-weight:600}
.nl-done{margin:14px 0 0;padding:11px 13px;border-radius:10px;background:#ecf8f1;color:#17603a;font-size:.875rem;line-height:1.5}

/* Sidebar, under "In this guide": desktop only, since the sidebar tops the page below 900px. */
.nl-rail{margin-top:20px;padding:18px;border:1px solid #e4e1eb;border-radius:12px;background:#fcfbfe}
/* Stacked forms: the input must not grow along the column, or its height collapses. */
.nl-rail .nl-form{flex-direction:column}
.nl-rail .nl-form input,.nl-rail .nl-form button{flex:none;width:100%}
@media(max-width:900px){.nl-rail{display:none}}

/* Band: end of an article, and under the blog index grid. */
.nl-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:28px;align-items:center;margin:44px 0 0;padding:26px 28px;border:1px solid #e6e7ef;border-radius:18px;background:#f7f6fc}
.nl.nl-band .nl-title{font-size:1.3rem;letter-spacing:-.02em}
.nl-band .nl-form{margin-top:0}
@media(max-width:760px){.nl-band{grid-template-columns:1fr;gap:16px;padding:22px}}
@media(max-width:480px){.nl-band .nl-form{flex-direction:column}.nl-band .nl-form input,.nl-band .nl-form button{flex:none;width:100%}}
.bl-newsletter{padding:0 0 56px}
.bl-newsletter .nl-band{margin-top:0}

/* Footer: a row between the logo row and the link grid, on the dark footer. */
.nl-footer{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:30px 0;border-bottom:1px solid var(--vf-line,#263147);color:#f6f7fc}
.nl-footer .nl-copy{max-width:480px}
.nl.nl-footer .nl-title{color:#f6f7fc}
.nl.nl-footer .nl-promise{color:#abb8ce}
.nl-footer .nl-action{flex:0 1 440px}
.nl-footer .nl-form{margin-top:0}
.nl-footer .nl-form input{background:#16213a;border-color:#2f3b55;color:#f6f7fc}
.nl-footer .nl-form input::placeholder{color:#7f8aa3}
.nl-footer .nl-fine{color:#8f9bb3}
.nl-footer .nl-fine-error{color:#ffb38a}
.nl-footer .nl-done{background:#132a24;color:#9ee6bf}
@media(max-width:760px){.nl-footer{flex-direction:column;align-items:stretch;gap:16px}.nl-footer .nl-action{flex:none}}
@media(max-width:480px){.nl-footer .nl-form{flex-direction:column}.nl-footer .nl-form input,.nl-footer .nl-form button{flex:none;width:100%}}