/* Vain uusi demonäkymä. Etusivun alkuperäiseen ulkoasuun ei kosketa. */
.demo-page .hero { padding-top: 48px; }
.demo-page .hero__copy h1 { font-size: clamp(32px, 5vw, 60px); }
.demo-page .nk-chat:has(#nk-contact:not([hidden])) { height: auto; min-height: var(--chat-h); }
.demo-page #nk-contact { flex: 0 0 auto; }
.demo-page #demo-services { min-height: 120px; }
.demo-page #demo-start { width: 100%; margin: 12px 0; }
.demo-page #nk-contact .nk-quick { padding: 8px 0; }
.demo-page #demo-email-preview { flex: 1; min-height: 0; overflow-y: auto; padding: 16px 20px 24px; }
.demo-page #demo-email-preview h3 { margin: 12px 0; font-size: 21px; }
.demo-page #demo-email-preview .nk-notice { padding: 10px 0; background: none; }
.demo-page #demo-email-preview label { display: block; margin: 10px 0; font-size: 14px; font-weight: 600; }
.demo-page #demo-email { width: 100%; min-height: 230px; padding: 12px 14px; border: 1.5px solid #D5D9E2; border-radius: 12px; background: #fff; font: inherit; resize: vertical; }
.demo-page #demo-email:focus { outline: 0; border-color: var(--blue); box-shadow: 0 0 0 4px var(--tint); }
.demo-page #demo-email-preview .btn { margin-top: 16px; width: 100%; }
.demo-page #demo-summary details { margin-top: 18px; font-size: 13px; }
.demo-page #demo-source { padding: 10px 0 0 18px; list-style: disc; }
.demo-page #demo-source li { margin-bottom: 8px; white-space: pre-wrap; overflow-wrap: anywhere; }
.demo-page .draft__body { max-height: 440px; }
.demo-page .nk-language-choices button:disabled { opacity: .6; }
.demo-page .btn:disabled { opacity: .6; cursor: wait; }
.demo-page .draft__foot .text-link { display: inline-block; margin-top: 12px; }