/* Neuromedia API — shared styles for content pages, support widget, cookie banner
   and new main-page blocks. Builds on styles.css + conversion-hero.css variables. */
:root{--card-bg:linear-gradient(150deg,#10141a,#090c11);--card-border:rgba(141,163,187,.24);--line-soft:rgba(141,163,187,.18);--input-bg:#06080b;--input-border:rgba(141,163,187,.3);--danger:#ff8e86;--cookie-offset:0px}

/* ---------- Header / footer ---------- */
/* Subpages reuse the main page's top bar (.products-utility from conversion-hero.css). */
.site-topbar{padding-top:22px}
.site-topbar .products-utility{margin-bottom:0}
[data-lang-doc][hidden]{display:none!important}
.site-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding:28px 0 44px;margin-top:20px;border-top:1px solid var(--line-soft);color:var(--text-muted);font-family:var(--font-ui);font-size:.8rem}
.site-footer-links{display:flex;flex-wrap:wrap;gap:8px 20px}
.site-footer-links a{color:var(--text-secondary)}
.site-footer-links a:hover{color:var(--accent)}
@media(max-width:760px){.site-topbar{padding-top:13px}}
@media(max-width:640px){.site-footer{flex-direction:column;align-items:flex-start;padding-bottom:calc(90px + var(--cookie-offset))}}

/* ---------- Generic page ---------- */
.page-section{padding-top:46px}
.page-head{margin-bottom:30px}
.page-title{margin-top:10px;font-size:clamp(1.9rem,4.2vw,3.2rem);line-height:1.04;letter-spacing:-.045em}
.page-lead{margin-top:14px;color:var(--text-secondary);font-size:1.06rem;max-width:720px}
.page main a:not(.btn),.legal a,.register-help a,.form-card .check a{color:var(--accent);text-decoration:underline;text-decoration-color:rgba(240,185,11,.4);text-underline-offset:3px}
code{font-family:var(--font-ui);font-size:.88em;padding:2px 6px;border:1px solid var(--line-soft);border-radius:3px;background:#0b0f14;color:#f5d36a;overflow-wrap:anywhere}
.btn{cursor:pointer}
.btn[disabled]{opacity:.6;cursor:progress}
.btn-ghost{border:1px solid rgba(240,185,11,.38);border-radius:3px;background:rgba(240,185,11,.06);color:var(--text-primary)}
.btn-ghost:hover{border-color:var(--accent)}
.page-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:34px;padding:26px;border:1px solid rgba(240,185,11,.42);border-radius:5px;background:linear-gradient(120deg,rgba(240,185,11,.1),#0b0f14 55%)}
.page-cta h2{font-size:clamp(1.3rem,2.4vw,1.8rem)}
.page-cta p{margin-top:6px;color:var(--text-secondary)}
.page-cta .btn{flex:none}
@media(max-width:760px){.page-cta{flex-direction:column;align-items:stretch}}

/* ---------- Forms ---------- */
.form-card{position:relative;padding:26px;border:1px solid var(--card-border);border-radius:5px;background:var(--card-bg)}
.lead-form{display:grid;gap:14px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-field label,.support-field label{display:block;margin-bottom:6px;color:var(--text-secondary);font-family:var(--font-ui);font-size:.76rem;letter-spacing:.02em}
.form-field input,.form-field select,.support-field input,.support-field textarea{width:100%;min-height:46px;padding:12px 13px;border:1px solid var(--input-border);border-radius:3px;background:var(--input-bg);color:var(--text-primary);font:inherit;font-size:.95rem;outline:none;transition:border-color .15s,box-shadow .15s}
.form-field select{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:linear-gradient(45deg,transparent 50%,var(--accent) 50%),linear-gradient(135deg,var(--accent) 50%,transparent 50%);background-position:calc(100% - 19px) 50%,calc(100% - 14px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.form-field select option,.form-field select optgroup{background:#0b0f14;color:var(--text-primary)}
.form-field input:focus,.form-field select:focus,.support-field input:focus,.support-field textarea:focus{border-color:rgba(240,185,11,.7);box-shadow:0 0 0 3px rgba(240,185,11,.1)}
.form-field input[aria-invalid="true"]{border-color:rgba(255,142,134,.7)}
.support-field textarea{min-height:104px;resize:vertical}
.field-error{min-height:0;margin-top:5px;color:var(--danger);font-size:.82rem;line-height:1.35}
.field-error:empty{display:none}
.check{display:flex;gap:11px;align-items:flex-start;color:var(--text-secondary);font-size:.9rem;line-height:1.45;cursor:pointer}
.check input{flex:none;width:18px;height:18px;margin-top:2px;accent-color:var(--accent);cursor:pointer}
.check-trial{padding:13px 14px;border:1px solid var(--line-soft);border-radius:4px;background:rgba(255,255,255,.02)}
.check-trial b{display:block;color:var(--text-primary);font-family:var(--font-display);font-size:1rem}
.check-trial small{display:block;margin-top:2px;color:var(--text-secondary);font-size:.84rem}
.hp-field{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-submit{width:100%;min-height:50px;margin-top:4px;font-size:.9rem}
.form-note{min-height:1.2em;color:var(--text-secondary);font-size:.88rem}
.form-note.is-error{color:var(--danger)}
.form-success{display:grid;justify-items:start;gap:12px;padding:10px 0;outline:none}
.form-success[hidden],.lead-form[hidden],.support-success[hidden],.support-form[hidden]{display:none!important}
.form-success h2{font-size:clamp(1.6rem,3vw,2.2rem)}
.form-success p{color:var(--text-secondary);font-size:1.05rem;margin-bottom:6px}
.form-success .btn{width:100%}
.success-mark{display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(240,185,11,.6);border-radius:50%;color:var(--accent);font:700 1.4rem var(--font-display);background:rgba(240,185,11,.08)}
@media(max-width:760px){.form-field input,.form-field select,.support-field input,.support-field textarea{font-size:16px}}

/* ---------- Register ---------- */
.register-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.register-intro{position:sticky;top:24px}
.register-points{list-style:none;display:grid;gap:12px;margin:28px 0 22px}
.register-points li{padding:14px 16px;border:1px solid var(--card-border);border-left:2px solid var(--accent);border-radius:4px;background:var(--card-bg)}
.register-points b{display:block;font-family:var(--font-display);font-size:1rem}
.register-points span{color:var(--text-secondary);font-size:.92rem}
.register-help{color:var(--text-secondary);font-size:.92rem}
@media(max-width:900px){.register-layout{grid-template-columns:1fr;gap:26px}.register-intro{position:static}.register-points{margin:20px 0 14px}}
/* mobile: heading -> form -> benefits, so the form is on the first screen */
/* mobile: heading -> form -> benefits */
@media(max-width:900px){.register-layout{gap:0}.register-intro{display:contents}.register-intro>*{margin-bottom:14px}.register-layout .form-card{order:2;margin:6px 0 22px}.register-points,.register-help{order:3}}
@media(max-width:560px){.form-card{padding:18px}.form-row{grid-template-columns:1fr}}
/* trust line under the submit button: small and muted, no accent colour */
.form-trust{margin-top:-4px;color:var(--text-muted);font-family:var(--font-ui);font-size:.74rem;line-height:1.5;text-align:center}

/* blocks below the form grid: why / next steps / FAQ (calm: grey frames, accent only for small numerals) */
.reg-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0;padding:0;list-style:none}
.reg-steps li{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--card-border);border-radius:5px;background:var(--card-bg);min-width:0}
.reg-step-num{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--card-border);border-radius:3px;color:var(--accent);font:700 .9rem var(--font-ui)}
.reg-steps b{font-family:var(--font-display);font-size:1.08rem;line-height:1.25}
.reg-steps span:not(.reg-step-num){color:var(--text-secondary);font-size:.92rem;line-height:1.5}
@media(max-width:900px){.reg-steps{grid-template-columns:1fr}}
@media(max-width:560px){.reg-steps li{padding:16px}}

/* ---------- Connect page ---------- */
.param-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.param-card{display:grid;gap:8px;align-content:start;padding:18px;border:1px solid var(--card-border);border-radius:5px;background:var(--card-bg);min-width:0}
.param-card small{color:var(--text-secondary);font-size:.84rem}
.param-label{color:var(--accent);font-family:var(--font-ui);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.copy-line{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.copy-line code{font-size:.92rem;padding:6px 8px}
.copy-btn{flex:none;padding:6px 10px;border:1px solid rgba(240,185,11,.4);border-radius:3px;background:rgba(240,185,11,.08);color:var(--accent);font:700 .72rem var(--font-ui);cursor:pointer;transition:.15s}
.copy-btn:hover{background:var(--accent);color:#14100a}
.copy-btn.copied{background:var(--accent);color:#14100a}
.toc{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 8px;padding:12px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);font-family:var(--font-ui);font-size:.8rem}
.page main .toc a{padding:6px 10px;border:1px solid var(--card-border);border-radius:3px;color:var(--text-secondary);text-decoration:none}
.page main .toc a:hover{border-color:rgba(240,185,11,.55);color:var(--text-primary)}
.doc-section{padding:34px 0 6px;scroll-margin-top:16px}
.doc-section h2{font-size:clamp(1.4rem,2.6vw,2rem);margin-bottom:14px}
.doc-section>p{color:var(--text-secondary);margin:12px 0;max-width:820px}
.doc-steps{display:grid;gap:10px;margin:0;padding:0;list-style:none;counter-reset:step;max-width:860px}
.doc-steps li{position:relative;padding:12px 14px 12px 50px;border:1px solid var(--card-border);border-radius:4px;background:var(--card-bg);color:var(--text-secondary);counter-increment:step}
.doc-steps li:before{content:counter(step);position:absolute;left:14px;top:11px;display:grid;place-items:center;width:24px;height:24px;border:1px solid rgba(240,185,11,.55);border-radius:3px;color:var(--accent);font:700 .78rem var(--font-ui)}
.doc-steps b{color:var(--text-primary)}
.code-block{position:relative;margin:12px 0;border:1px solid var(--card-border);border-radius:5px;background:#06080b;max-width:900px}
.code-block pre{margin:0;padding:18px 16px;overflow-x:auto;font-family:var(--font-ui);font-size:.84rem;line-height:1.6;color:#dfe7f1;tab-size:2}
.code-block pre code{padding:0;border:0;background:none;color:inherit;font-size:inherit;overflow-wrap:normal}
.code-block .copy-btn{position:absolute;top:10px;right:10px;z-index:1}
.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:900px}
.mode-card{padding:20px;border:1px solid var(--card-border);border-radius:5px;background:var(--card-bg)}
.mode-card.hot{border-color:rgba(240,185,11,.52)}
.mode-card .badge{display:inline-block;border-radius:2px;background:transparent;border:1px solid rgba(240,185,11,.48);color:#f5c542}
.mode-card .badge.dark{border-color:rgba(141,163,187,.3);color:#b7c4d2}
.mode-card ul{margin:14px 0 0 18px;color:var(--text-secondary);display:grid;gap:6px}
.faq-list{display:grid;gap:4px;max-width:860px}
.faq-list dt{margin-top:12px;font-family:var(--font-display);font-weight:700;font-size:1.04rem}
.faq-list dd{color:var(--text-secondary)}
@media(max-width:900px){.param-grid,.mode-grid{grid-template-columns:1fr}}

/* ---------- Legal pages ---------- */
.demo-note{margin:0 0 26px;padding:14px 16px;border:1px dashed rgba(240,185,11,.6);border-radius:4px;background:rgba(240,185,11,.07);color:var(--text-secondary);font-size:.92rem}
.demo-note b{color:var(--accent)}
.demo-field{padding:1px 5px;border-radius:3px;background:rgba(240,185,11,.14);color:#f5d36a;font-family:var(--font-ui);font-size:.86em}
.legal{color:var(--text-secondary);font-size:.98rem;line-height:1.68}
.legal h2{margin:30px 0 10px;color:var(--text-primary);font-size:clamp(1.2rem,2vw,1.5rem);letter-spacing:-.02em}
.legal p{margin:8px 0}
.legal ul{margin:8px 0 8px 22px;display:grid;gap:6px}
.legal b{color:var(--text-primary)}
.legal-details{list-style:none;margin-left:0!important;padding:14px 16px;border:1px solid var(--card-border);border-radius:4px;background:var(--card-bg)}

/* ---------- Main page: trial CTA, connect steps, scenarios ---------- */
.trial-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:-6px 0 22px;padding:16px 18px;border:1px solid rgba(240,185,11,.52);border-radius:5px;background:linear-gradient(110deg,rgba(240,185,11,.13),#0b0f14 60%)}
.trial-cta b{display:block;font-family:var(--font-display);font-size:1.15rem;color:var(--text-primary)}
.trial-cta span{display:block;color:var(--text-secondary);font-size:.92rem}
.trial-cta .btn{flex:none}
@media(max-width:760px){.trial-cta{flex-direction:column;align-items:stretch;margin-top:0}.trial-cta .btn{width:100%}}
.connect-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0;padding:0;list-style:none}
.connect-steps li{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--card-border);border-radius:5px;background:var(--card-bg);min-width:0}
.connect-steps b{font-family:var(--font-display);font-size:1.12rem}
.connect-steps span:not(.step-num){color:var(--text-secondary);font-size:.92rem}
.connect-steps code{align-self:flex-start;font-size:.86rem}
.step-num{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(240,185,11,.6);border-radius:3px;color:var(--accent);font:700 .9rem var(--font-ui)}
.connect-more{width:100%;margin-top:16px;min-height:48px;font-size:.86rem;text-align:center}
@media(max-width:900px){.connect-steps{grid-template-columns:1fr}}
.scenario-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.scenario-card{display:flex;flex-direction:column;gap:8px;padding:18px;border:1px solid var(--card-border);border-radius:5px;background:var(--card-bg);min-width:0}
.scenario-tag{align-self:flex-start;padding:4px 8px;border:1px solid rgba(240,185,11,.48);border-radius:2px;color:#f5c542;font:800 .7rem var(--font-ui);text-transform:uppercase;letter-spacing:.03em}
.scenario-card h3{font-size:1.16rem;line-height:1.2;letter-spacing:-.02em}
.scenario-card p{color:var(--text-secondary);font-size:.92rem;line-height:1.46}
.scenario-card .scenario-plan{margin-top:auto;padding-top:10px;border-top:1px solid rgba(141,163,187,.16);color:var(--text-muted);font-family:var(--font-ui);font-size:.78rem}
.scenario-card a{color:var(--accent);font-family:var(--font-ui);font-size:.82rem;font-weight:700}
.scenario-card a:hover{color:var(--accent-hover)}
@media(max-width:980px){.scenario-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.scenario-grid{grid-template-columns:1fr;gap:10px}}

/* ---------- Support widget ---------- */
.support-widget{position:fixed;right:18px;bottom:calc(18px + var(--cookie-offset));z-index:70;display:flex;flex-direction:column;align-items:flex-end;gap:12px;font-family:var(--font-body);transition:bottom .2s ease}
.support-fab{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:0 18px;border:1px solid var(--accent);border-radius:3px;background:var(--accent);color:#14100a;font:700 .84rem var(--font-ui);cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.45);transition:background .15s,transform .15s}
.support-fab:hover{background:var(--accent-hover);transform:translateY(-1px)}
.support-fab-dot{width:8px;height:8px;border-radius:50%;background:#14100a;box-shadow:0 0 0 3px rgba(20,16,10,.18)}
.support-widget.is-open .support-fab{background:#0b0f14;color:var(--accent)}
.support-widget.is-open .support-fab-dot{background:var(--success)}
.support-panel{width:min(370px,calc(100vw - 32px));max-height:calc(100vh - 110px - var(--cookie-offset));overflow-y:auto;padding:20px;border:1px solid rgba(240,185,11,.45);border-radius:5px;background:#0b0f14;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.support-panel[hidden]{display:none}
.support-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:14px}
.support-head h2{margin-top:4px;font-size:1.35rem;letter-spacing:-.02em}
.support-sub{margin-top:4px;color:var(--text-secondary);font-size:.86rem;line-height:1.4}
.support-close{flex:none;width:32px;height:32px;border:1px solid var(--card-border);border-radius:3px;background:transparent;color:var(--text-secondary);font-size:1.2rem;line-height:1;cursor:pointer}
.support-close:hover{border-color:var(--accent);color:var(--accent)}
.support-form{position:relative;display:grid;gap:11px}
.support-field{position:relative}
.support-counter{display:block;margin-top:4px;text-align:right;color:var(--text-muted);font-family:var(--font-ui);font-size:.7rem}
.support-submit{width:100%;min-height:46px}
.support-success{display:grid;justify-items:start;gap:12px;padding:6px 0;color:var(--text-primary);outline:none}
.support-success p{color:var(--text-secondary)}
@media(max-width:560px){.support-widget{right:12px;bottom:calc(12px + var(--cookie-offset))}.support-fab{min-height:44px;padding:0 15px;width:auto}.support-panel{width:calc(100vw - 24px)}.support-panel .btn{width:100%}}

/* ---------- Cookie banner ---------- */
.cookie-banner{position:fixed;left:18px;bottom:18px;z-index:61;display:flex;align-items:center;gap:14px;max-width:min(520px,calc(100vw - 36px));padding:14px 16px;border:1px solid var(--card-border);border-radius:5px;background:#0b0f14;box-shadow:0 18px 44px rgba(0,0,0,.55);color:var(--text-secondary);font-size:.86rem;line-height:1.45}
.cookie-banner a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.cookie-banner .btn{flex:none;min-height:38px;padding:0 16px;width:auto;font-size:.8rem}
/* On wide screens the banner sits bottom-left and does not collide with the widget. */
@media(min-width:900px){html.has-cookie-banner{--cookie-offset:0px!important}}
@media(max-width:899px){.cookie-banner{left:12px;right:12px;bottom:12px;max-width:none}}
@media(max-width:420px){.cookie-banner{flex-direction:column;align-items:stretch}.cookie-banner .btn{width:100%}}

/* support window wins over the cookie notice: hide the notice while support is open */
html.support-open .cookie-banner{display:none}
html.support-open{--cookie-offset:0px!important}

/* owner: no floating support button — support opens from the footer link only */
.support-fab{display:none!important}
.support-widget{bottom:18px!important}
.reg-short{padding:34px 0 40px;border-top:1px solid var(--card-border);margin-top:40px}
.reg-short .kicker{margin-bottom:16px}
.reg-short-list{display:grid;grid-template-columns:repeat(4,1fr);gap:18px 28px;margin:0}
.reg-short-list dt{font-family:var(--font-display);font-weight:600;font-size:.98rem;color:var(--text-primary);margin-bottom:4px}
.reg-short-list dd{margin:0;color:var(--text-secondary);font-size:.92rem;line-height:1.5}
@media(max-width:1100px){.reg-short-list{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.reg-short-list{grid-template-columns:1fr;gap:14px}.reg-short{padding:26px 0 30px;margin-top:28px}}