{"id":122176,"date":"2026-07-16T13:45:28","date_gmt":"2026-07-16T11:45:28","guid":{"rendered":"https:\/\/monetplus.cz\/clm-configurator\/"},"modified":"2026-07-23T15:01:15","modified_gmt":"2026-07-23T13:01:15","slug":"clm-configurator","status":"publish","type":"page","link":"https:\/\/monetplus.cz\/en\/clm-configurator\/","title":{"rendered":"CLM Configurator"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"122176\" class=\"elementor elementor-122176 elementor-122115\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-46b4793 top-space elementor-section-height-min-height elementor-section-boxed elementor-section-height-default elementor-section-items-middle elementor-invisible\" data-id=\"46b4793\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;,&quot;animation&quot;:&quot;fadeIn&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\" elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-d85c74c elementor-invisible\" data-fullscreen-column-settings=\"{&quot;fullscreen&quot;:&quot;&quot;}\" data-id=\"d85c74c\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;animation&quot;:&quot;fadeIn&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-bb85de0 elementor-widget-mobile__width-inherit elementor-widget elementor-widget-litho-heading\" data-id=\"bb85de0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"litho-heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"litho-heading elementor-size-default\"><span class=\"litho-primary-title\">Online CLM Configurator<\/span><\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e26cd7c elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"e26cd7c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Answer a few questions about your environment and get specific module recommendations.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-a8b3371 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"a8b3371\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\" elementor-column elementor-col-16 elementor-top-column elementor-element elementor-element-c34486b\" data-fullscreen-column-settings=\"{&quot;fullscreen&quot;:&quot;&quot;}\" data-id=\"c34486b\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap\">\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\" elementor-column elementor-col-66 elementor-top-column elementor-element elementor-element-a826ff9\" data-fullscreen-column-settings=\"{&quot;fullscreen&quot;:&quot;&quot;}\" data-id=\"a826ff9\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5304210 elementor-widget elementor-widget-html\" data-id=\"5304210\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ============================================================\n     Certificate Lifecycle Management module configurator (Monet+)\n     Paste this entire block into the Elementor -> \"HTML\" widget.\n\n     NOTE: the element has NO background of its own. Set the background\n     on the Elementor section. Text colours below assume a LIGHT section\n     background; for a dark one, change --clm-text \/ --clm-text-muted.\n     ============================================================ -->\n\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\n\n<style>\n  .clm-configurator {\n    \/* --- brand colours: change here only --- *\/\n    --clm-accent: #0E95A7;              \/* Monet+ green \u2013 active states, accents *\/\n    --clm-accent-dark: #0B7986;         \/* hover *\/\n    --clm-accent-soft: rgba(14,149,167,.08);\n    --clm-accent-tint: #E3F2F4;         \/* icon backgrounds *\/\n    --clm-primary: #17273F;             \/* dark navy \u2013 headings, CTA block *\/\n    --clm-primary-light: #24395A;\n    --clm-text: #17273F;\n    --clm-text-muted: #667080;\n    --clm-divider: rgba(23,39,63,.14);\n    --clm-danger: #E14B4B;\n    --clm-ready: #34C77B;\n    --clm-font: 'Poppins', sans-serif;\n\n    position: relative;\n    font-family: var(--clm-font);\n    color: var(--clm-text);\n    background: transparent;\n    max-width: 900px;\n    margin: 0 auto;\n    padding: 0;\n    box-sizing: border-box;\n  }\n  .clm-configurator, .clm-configurator * { box-sizing: border-box; }\n  .clm-configurator *:focus-visible { outline: 2px solid var(--clm-accent); outline-offset: 2px; }\n\n  .clm-card {\n    position: relative;\n    background: transparent;\n    border: none;\n    border-radius: 0;\n    padding: 0;\n    box-shadow: none;\n  }\n\n  \/* ---------- Header ---------- *\/\n  .clm-header { margin-bottom: 22px; }\n  .clm-eyebrow {\n    display: inline-block; font-size: 11.5px; font-weight: 700; letter-spacing: 0.12em;\n    text-transform: uppercase; color: var(--clm-accent); margin-bottom: 6px;\n  }\n  .clm-header p { color: var(--clm-text-muted); margin: 0; font-size: 13.5px; }\n\n  \/* ---------- Pill tabs ---------- *\/\n  .clm-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 30px; }\n  .clm-tab {\n    display: inline-flex; align-items: center; gap: 7px;\n    padding: 9px 16px 9px 12px; border-radius: 999px;\n    font-size: 12.5px; font-weight: 600;\n    border: 1px solid var(--clm-divider); background: transparent;\n    color: var(--clm-text-muted); transition: all .2s ease; white-space: nowrap;\n  }\n  .clm-tab svg { width: 14px; height: 14px; flex-shrink: 0; }\n  .clm-tab.active { background: var(--clm-accent); color: #fff; border-color: var(--clm-accent); }\n  .clm-tab.completed { color: var(--clm-accent); border-color: rgba(14,149,167,.45); cursor: pointer; }\n  .clm-tab.upcoming { opacity: .5; }\n\n  \/* ---------- Step ---------- *\/\n  .clm-step { display: none; }\n  .clm-step.active { display: block; animation: clmFade .3s ease; }\n  @keyframes clmFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }\n  @media (prefers-reduced-motion: reduce) { .clm-step.active { animation: none; } }\n\n  .clm-step h3 { font-size: 17px; font-weight: 700; line-height: 1.4; color: var(--clm-primary); margin: 0 0 3px; }\n  .clm-step .clm-step-desc { color: var(--clm-text-muted); font-size: 14px; margin: 0 0 22px; }\n\n  .clm-field { margin-bottom: 34px; }\n  .clm-field:last-child { margin-bottom: 0; }\n\n  \/* Question label \u2013 one step below the section heading (17px navy) *\/\n  .clm-field-label {\n    display: flex; align-items: center; gap: 10px;\n    font-size: 15px; font-weight: 700; line-height: 1.45;\n    letter-spacing: normal; text-transform: none;\n    color: var(--clm-text-muted); margin: 0 0 14px;\n  }\n  .clm-field-icon {\n    width: 26px; height: 26px; border-radius: 8px; background: var(--clm-accent-tint);\n    color: var(--clm-accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0;\n  }\n  .clm-field-icon svg { width: 14px; height: 14px; }\n  .clm-error-msg { color: var(--clm-danger); font-size: 12.5px; margin-top: 8px; display: none; }\n  .clm-error-msg.show { display: block; }\n\n  \/* ---------- Options: two tiles per row ---------- *\/\n  .clm-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 8px; }\n  @media (max-width: 560px) { .clm-options { grid-template-columns: 1fr; } }\n  .clm-option {\n    position: relative; display: flex; align-items: center; gap: 14px;\n    padding: 14px; cursor: pointer; border-radius: 14px;\n    border: 1.5px solid var(--clm-divider); background: transparent;\n    transition: background .15s ease, border-color .15s ease;\n  }\n  .clm-option:hover { border-color: var(--clm-accent); }\n  .clm-option.clm-checked { background: var(--clm-accent-soft); border-color: var(--clm-accent); }\n  .clm-option input { position: absolute; opacity: 0; }\n  .clm-option-icon {\n    width: 36px; height: 36px; border-radius: 11px; background: var(--clm-accent-tint);\n    color: var(--clm-accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0;\n    transition: background .15s ease, color .15s ease;\n  }\n  .clm-option-icon svg { width: 17px; height: 17px; }\n  .clm-option.clm-checked .clm-option-icon { background: var(--clm-accent); color: #fff; }\n  .clm-option-body { flex: 1; min-width: 0; }\n  .clm-opt-title { font-weight: 600; font-size: 14.5px; color: var(--clm-text); display: block; }\n  .clm-opt-desc { display: block; font-size: 14px; color: var(--clm-text-muted); margin-top: 2px; font-weight: 400; }\n  .clm-check {\n    position: relative; width: 20px; height: 20px; border: 1.5px solid var(--clm-divider);\n    background: transparent; flex-shrink: 0; transition: background .15s ease, border-color .15s ease;\n  }\n  .clm-check-box { border-radius: 6px; }\n  .clm-check-radio { border-radius: 50%; }\n  .clm-option input:checked ~ .clm-check { background: var(--clm-accent); border-color: var(--clm-accent); }\n  .clm-option input[type=\"checkbox\"]:checked ~ .clm-check::after {\n    content: \"\"; position: absolute; left: 6px; top: 2px; width: 5px; height: 9px;\n    border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg);\n  }\n  .clm-option input[type=\"radio\"]:checked ~ .clm-check::after {\n    content: \"\"; position: absolute; left: 5px; top: 5px; width: 7px; height: 7px;\n    border-radius: 50%; background: white;\n  }\n\n  \/* ---------- Navigation ---------- *\/\n  .clm-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 30px; gap: 12px; }\n  .clm-btn {\n    font-family: var(--clm-font); font-weight: 600; font-size: 14px;\n    padding: 12px 26px; border-radius: 999px; border: none; cursor: pointer;\n    transition: opacity .15s ease, transform .1s ease, background .15s ease;\n  }\n  .clm-btn:active { transform: scale(.98); }\n  .clm-btn-primary { background: var(--clm-accent); color: #fff; }\n  .clm-btn-primary:hover { background: var(--clm-accent-dark); }\n  .clm-btn-accent { background: var(--clm-accent); color: #fff; }\n  .clm-btn-accent:hover { background: var(--clm-accent-dark); }\n  .clm-btn-ghost { background: transparent; color: var(--clm-text-muted); }\n  .clm-btn-ghost:hover { color: var(--clm-text); }\n  .clm-btn:disabled { opacity: .5; cursor: not-allowed; }\n\n  \/* ---------- Results ---------- *\/\n  .clm-result-head { margin-bottom: 24px; }\n  .clm-result-head h3 { font-size: 18px; font-weight: 700; color: var(--clm-primary); margin: 0 0 4px; }\n  .clm-result-head p { color: var(--clm-text-muted); font-size: 13px; margin: 0; }\n\n  .clm-module-group { margin-bottom: 22px; }\n  .clm-module-group h4 {\n    font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;\n    color: var(--clm-text-muted); margin: 0 0 10px;\n  }\n  .clm-module-card {\n    display: flex; gap: 14px; align-items: flex-start;\n    padding: 13px 6px; border-bottom: 1px solid var(--clm-divider);\n  }\n  .clm-module-card:last-child { border-bottom: none; }\n  .clm-module-icon {\n    flex-shrink: 0; width: 36px; height: 36px; border-radius: 11px;\n    background: var(--clm-accent-tint); color: var(--clm-accent);\n    display: flex; align-items: center; justify-content: center;\n  }\n  .clm-module-icon svg { width: 17px; height: 17px; }\n  .clm-module-card.clm-module-core .clm-module-icon { background: var(--clm-accent-tint); color: var(--clm-primary); }\n  .clm-module-card.clm-module-featured .clm-module-icon { background: var(--clm-accent); color: #fff; }\n  .clm-module-title { font-weight: 600; font-size: 14.5px; margin: 0 0 3px; color: var(--clm-text); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }\n  .clm-module-reason { font-size: 12.5px; color: var(--clm-text-muted); margin: 0; line-height: 1.5; }\n  .clm-module-tag {\n    display: inline-block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;\n    color: #fff; background: var(--clm-accent); padding: 2px 8px; border-radius: 20px;\n  }\n  .clm-empty-state { padding: 14px 6px; color: var(--clm-text-muted); font-size: 13px; }\n\n  \/* ---------- Roadmap ---------- *\/\n  .clm-roadmap { margin: 30px 0 8px; }\n  .clm-roadmap-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--clm-text-muted); margin: 0 0 14px; }\n  .clm-roadmap-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }\n  .clm-roadmap-step { background: transparent; border: 1px solid var(--clm-divider); border-radius: 16px; padding: 16px; }\n  .clm-roadmap-num {\n    width: 28px; height: 28px; border-radius: 9px; background: var(--clm-accent); color: #fff;\n    font-size: 12.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-bottom: 10px;\n  }\n  .clm-roadmap-step h5 { font-size: 13px; font-weight: 600; margin: 0 0 6px; color: var(--clm-text); }\n  .clm-roadmap-step p { font-size: 12px; color: var(--clm-text-muted); margin: 0; line-height: 1.5; }\n  @media (max-width: 640px) { .clm-roadmap-steps { grid-template-columns: 1fr; } }\n\n  \/* ---------- CTA \/ contact form ---------- *\/\n  .clm-cta {\n    margin-top: 30px; padding: 20px; border-radius: 18px;\n    background: var(--clm-primary); color: #fff;\n    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px;\n  }\n  .clm-cta p { margin: 0; font-size: 13.5px; max-width: 380px; opacity: .85; }\n  .clm-cta p strong { display: block; font-size: 15.5px; font-weight: 600; margin-bottom: 3px; opacity: 1; }\n\n  .clm-contact-form { display: none; margin-top: 26px; border-top: 1px solid var(--clm-divider); padding-top: 24px; }\n  .clm-contact-form.show { display: block; }\n  .clm-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }\n  .clm-contact-grid .clm-field { margin-bottom: 0; }\n  @media (max-width: 560px) { .clm-contact-grid { grid-template-columns: 1fr; } }\n  .clm-configurator input[type=\"text\"], .clm-configurator input[type=\"email\"], .clm-configurator input[type=\"tel\"] {\n    width: 100%; padding: 11px 14px; border: 1px solid var(--clm-divider); border-radius: 12px;\n    font-family: var(--clm-font); font-size: 14px; color: var(--clm-text); background: transparent;\n  }\n  .clm-configurator input:focus { border-color: var(--clm-accent); }\n  .clm-configurator input.clm-invalid { border-color: var(--clm-danger); }\n  .clm-field-label-sm { display: block; font-size: 12px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--clm-text-muted); margin-bottom: 8px; }\n\n  .clm-consent { display: flex; align-items: flex-start; gap: 10px; margin: 20px 0; font-size: 12.5px; color: var(--clm-text-muted); }\n  .clm-consent input { margin-top: 3px; accent-color: var(--clm-accent); }\n\n  \/* ---------- Step indicator ---------- *\/\n  .clm-stepper {\n    display: flex; align-items: center; gap: 14px;\n    margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--clm-divider);\n  }\n  .clm-stepper-dots { display: flex; align-items: center; gap: 8px; }\n  .clm-stepper-dot {\n    width: 30px; height: 30px; border-radius: 50%;\n    display: flex; align-items: center; justify-content: center;\n    font-size: 12.5px; font-weight: 700;\n    border: 1.5px solid var(--clm-divider); background: transparent; color: var(--clm-text-muted);\n    transition: background .2s ease, border-color .2s ease, color .2s ease;\n  }\n  .clm-stepper-dot.done { border-color: var(--clm-accent); color: var(--clm-accent); }\n  .clm-stepper-dot.active { background: var(--clm-accent); border-color: var(--clm-accent); color: #fff; }\n  .clm-stepper-label { margin-left: auto; font-size: 12.5px; font-weight: 600; color: var(--clm-text-muted); }\n  @media (max-width: 420px) { .clm-stepper-label { display: none; } }\n\n  .clm-result-status { text-align: center; padding: 30px 10px; }\n  .clm-result-icon { width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; font-size: 22px; color: #fff; }\n  .clm-result-icon.ok { background: var(--clm-ready); }\n  .clm-result-icon.err { background: var(--clm-danger); }\n  .clm-result-status h3 { color: var(--clm-primary); margin: 0 0 8px; }\n  .clm-result-status p { color: var(--clm-text-muted); font-size: 14px; max-width: 420px; margin: 0 auto; }\n  .clm-fallback-box { margin-top: 16px; text-align: left; background: transparent; border: 1px solid var(--clm-divider); border-radius: 12px; padding: 14px; font-size: 12px; white-space: pre-wrap; max-height: 200px; overflow: auto; }\n<\/style>\n\n<div class=\"clm-configurator\" id=\"clmConfigurator\">\n  <div class=\"clm-card\">\n\n    <div class=\"clm-tabs\" id=\"clmTabs\">\n      <span class=\"clm-tab\" data-index=\"0\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3l9 5-9 5-9-5 9-5z\"\/><path d=\"M3 13l9 5 9-5\"\/><\/svg>Devices<\/span>\n      <span class=\"clm-tab\" data-index=\"1\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"8\" cy=\"15\" r=\"4\"\/><path d=\"M11 12l9-9M17 6l3 3M14 9l2 2\"\/><\/svg>CA &amp; PKI<\/span>\n      <span class=\"clm-tab\" data-index=\"2\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 12a8 8 0 0113.7-5.7L21 9M21 4v5h-5\"\/><path d=\"M20 12a8 8 0 01-13.7 5.7L3 15M3 20v-5h5\"\/><\/svg>Operations<\/span>\n      <span class=\"clm-tab\" data-index=\"3\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"6\" y=\"4\" width=\"12\" height=\"16\" rx=\"2\"\/><path d=\"M9 4V3h6v1M9 12l2 2 4-4\"\/><\/svg>Compliance<\/span>\n      <span class=\"clm-tab\" data-index=\"4\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M8 12l3 3 5-6\"\/><\/svg>Result<\/span>\n    <\/div>\n\n    <form id=\"clmForm\" novalidate>\n\n      <!-- STEP 1 -->\n      <div class=\"clm-step active\" data-step=\"1\">\n        <h3>Devices<\/h3>\n        <p class=\"clm-step-desc\">Select everything that applies to your environment.<\/p>\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\">What will you cover?<\/label>\n          <div class=\"clm-options\" data-group=\"endpoints\" data-type=\"checkbox\" data-required=\"true\">\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"endpoints\" value=\"tls\">\n              <span class=\"clm-option-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M3 12h18M12 3a15 15 0 010 18 15 15 0 010-18\"\/><\/svg><\/span>\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">TLS certificates<\/span><span class=\"clm-opt-desc\">websites, APIs, application servers<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"endpoints\" value=\"microservices\">\n              <span class=\"clm-option-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3l9 5-9 5-9-5 9-5z\"\/><path d=\"M3 13l9 5 9-5\"\/><\/svg><\/span>\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">Short-lived certificates for microservices<\/span><span class=\"clm-opt-desc\">frequent rotation, service-to-service communication<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"endpoints\" value=\"f5\">\n              <span class=\"clm-option-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"7\" rx=\"2\"\/><rect x=\"3\" y=\"13\" width=\"18\" height=\"7\" rx=\"2\"\/><circle cx=\"7\" cy=\"7.5\" r=\"1\"\/><circle cx=\"7\" cy=\"16.5\" r=\"1\"\/><\/svg><\/span>\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">F5 BIG-IP \/ F5 load balancers<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"endpoints\" value=\"cisco\">\n              <span class=\"clm-option-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M2 8.5a15 15 0 0120 0\"\/><path d=\"M5.5 12a10 10 0 0113 0\"\/><path d=\"M9 15.5a5 5 0 016 0\"\/><circle cx=\"12\" cy=\"19\" r=\"1.2\"\/><\/svg><\/span>\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">Cisco network devices<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"endpoints\" value=\"iot\">\n              <span class=\"clm-option-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"6\" y=\"6\" width=\"12\" height=\"12\" rx=\"2\"\/><rect x=\"9\" y=\"9\" width=\"6\" height=\"6\"\/><path d=\"M12 2v3M12 19v3M2 12h3M19 12h3\"\/><\/svg><\/span>\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">OT\/IoT devices<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"endpoints\" value=\"custom\">\n              <span class=\"clm-option-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"16\" rx=\"2\"\/><path d=\"M7 9l3 3-3 3M13 15h4\"\/><\/svg><\/span>\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">Custom \/ internal systems<\/span><span class=\"clm-opt-desc\">without support for standard protocols<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"endpoints\">Please select at least one option.<\/div>\n        <\/div>\n      <\/div>\n\n      <!-- STEP 2 -->\n      <div class=\"clm-step\" data-step=\"2\">\n        <h3>Certificates &amp; PKI<\/h3>\n        <p class=\"clm-step-desc\">Where your certificates come from and how your infrastructure looks.<\/p>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3l7 3v6c0 4.5-3 7.5-7 9-4-1.5-7-4.5-7-9V6l7-3z\"\/><path d=\"M9 12l2 2 4-4\"\/><\/svg><\/span>Where do your certificates primarily come from?<\/label>\n          <div class=\"clm-options\" data-group=\"caSource\" data-type=\"checkbox\" data-required=\"true\">\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"caSource\" value=\"publicCA\">\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">Public CA<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"caSource\" value=\"internalCA\">\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">Own \/ internal CA<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n            <label class=\"clm-option\">\n              <input type=\"checkbox\" name=\"caSource\" value=\"unsureCA\">\n              <span class=\"clm-option-body\"><span class=\"clm-opt-title\">Not sure \/ mixed<\/span><\/span>\n              <span class=\"clm-check clm-check-box\"><\/span>\n            <\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"caSource\">Please select at least one option.<\/div>\n        <\/div>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"8\" cy=\"15\" r=\"4\"\/><path d=\"M11 12l9-9M17 6l3 3M14 9l2 2\"\/><\/svg><\/span>Do you currently have a functional PKI infrastructure?<\/label>\n          <div class=\"clm-options\" data-group=\"pkiStatus\" data-type=\"radio\" data-required=\"true\">\n            <label class=\"clm-option\"><input type=\"radio\" name=\"pkiStatus\" value=\"pkiOk\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Yes, fully functional<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"pkiStatus\" value=\"pkiPartial\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Partial \/ outdated<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"pkiStatus\" value=\"pkiNone\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">No, we don't<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"pkiStatus\">Please select one option.<\/div>\n        <\/div>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M2 12s4-7 10-7 10 7 10 7-4 7-10 7-10-7-10-7z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg><\/span>Do you have an accurate overview of how many certificates your company has, and of what type?<\/label>\n          <div class=\"clm-options\" data-group=\"visibility\" data-type=\"radio\" data-required=\"true\">\n            <label class=\"clm-option\"><input type=\"radio\" name=\"visibility\" value=\"fullView\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Yes, a complete inventory<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"visibility\" value=\"partialView\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Partially<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"visibility\" value=\"noView\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">No, we don't know<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"visibility\">Please select one option.<\/div>\n        <\/div>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"5\" y=\"11\" width=\"14\" height=\"9\" rx=\"2\"\/><path d=\"M8 11V7a4 4 0 018 0v4\"\/><\/svg><\/span>Do you use your own HSM (Hardware Security Module) to protect keys?<\/label>\n          <div class=\"clm-options\" data-group=\"hsm\" data-type=\"radio\" data-required=\"true\">\n            <label class=\"clm-option\"><input type=\"radio\" name=\"hsm\" value=\"hsmYes\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Yes, we have our own<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"hsm\" value=\"hsmNeed\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">No, but we need one<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"hsm\" value=\"hsmNo\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">No, we don't need one<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"hsm\">Please select one option.<\/div>\n        <\/div>\n      <\/div>\n\n      <!-- STEP 3 -->\n      <div class=\"clm-step\" data-step=\"3\">\n        <h3>Operations<\/h3>\n        <p class=\"clm-step-desc\">How you handle the certificate lifecycle today.<\/p>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 12a8 8 0 0113.7-5.7L21 9M21 4v5h-5\"\/><path d=\"M20 12a8 8 0 01-13.7 5.7L3 15M3 20v-5h5\"\/><\/svg><\/span>How does certificate renewal and issuance work today?<\/label>\n          <div class=\"clm-options\" data-group=\"renewal\" data-type=\"radio\" data-required=\"true\">\n            <label class=\"clm-option\"><input type=\"radio\" name=\"renewal\" value=\"manual\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Manually \/ in a spreadsheet<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"renewal\" value=\"partialAuto\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Partially automated<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"renewal\" value=\"fullAuto\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Fully automated<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"renewal\">Please select one option.<\/div>\n        <\/div>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3l10 18H2L12 3z\"\/><path d=\"M12 10v4M12 17h.01\"\/><\/svg><\/span>Has a certificate expired without warning in the past year?<\/label>\n          <div class=\"clm-options\" data-group=\"outage\" data-type=\"radio\" data-required=\"true\">\n            <label class=\"clm-option\"><input type=\"radio\" name=\"outage\" value=\"repeated\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Yes, repeatedly<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"outage\" value=\"once\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Yes, once<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"outage\" value=\"never\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">No<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"outage\">Please select one option.<\/div>\n        <\/div>\n      <\/div>\n\n      <!-- STEP 4 -->\n      <div class=\"clm-step\" data-step=\"4\">\n        <h3>Compliance<\/h3>\n        <p class=\"clm-step-desc\">Last questions, then just the result.<\/p>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"6\" y=\"4\" width=\"12\" height=\"16\" rx=\"2\"\/><path d=\"M9 4V3h6v1M9 12l2 2 4-4\"\/><\/svg><\/span>Does your organization fall under DORA, NIS2, or a similar auditability requirement?<\/label>\n          <div class=\"clm-options\" data-group=\"regulation\" data-type=\"radio\" data-required=\"true\">\n            <label class=\"clm-option\"><input type=\"radio\" name=\"regulation\" value=\"regYes\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Yes<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"regulation\" value=\"regUnsure\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Not sure<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"regulation\" value=\"regNo\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">No<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"regulation\">Please select one option.<\/div>\n        <\/div>\n\n        <div class=\"clm-field\">\n          <label class=\"clm-field-label\"><span class=\"clm-field-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"9\" cy=\"8\" r=\"3\"\/><path d=\"M3 20c0-3 3-5 6-5s6 2 6 5\"\/><circle cx=\"17\" cy=\"9\" r=\"2.5\"\/><path d=\"M15 20c.3-2 1.8-3.5 4-3.8\"\/><\/svg><\/span>Do you need a hierarchy of administrative roles to manage certificate access?<\/label>\n          <div class=\"clm-options\" data-group=\"roles\" data-type=\"radio\" data-required=\"true\">\n            <label class=\"clm-option\"><input type=\"radio\" name=\"roles\" value=\"rolesYes\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Yes<\/span><span class=\"clm-opt-desc\">admin, approver, requester<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"roles\" value=\"rolesUnsure\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">Not sure<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n            <label class=\"clm-option\"><input type=\"radio\" name=\"roles\" value=\"rolesNo\"><span class=\"clm-option-body\"><span class=\"clm-opt-title\">No<\/span><\/span><span class=\"clm-check clm-check-radio\"><\/span><\/label>\n          <\/div>\n          <div class=\"clm-error-msg\" data-for-group=\"roles\">Please select one option.<\/div>\n        <\/div>\n      <\/div>\n\n      <!-- STEP 5: RESULT -->\n      <div class=\"clm-step\" data-step=\"5\">\n        <div class=\"clm-result-head\">\n          <span class=\"clm-eyebrow\">Your recommendation<\/span>\n          <h3>Configuration tailored to your environment<\/h3>\n          <p>Based on your answers.<\/p>\n        <\/div>\n\n        <div id=\"clmModuleResults\"><\/div>\n\n        <div class=\"clm-roadmap\">\n          <div class=\"clm-roadmap-title\">Implementation plan<\/div>\n          <div class=\"clm-roadmap-steps\">\n            <div class=\"clm-roadmap-step\">\n              <div class=\"clm-roadmap-num\">1<\/div>\n              <h5>Cryptographic audit<\/h5>\n              <p>We map the current state of cryptography, certificates, keys and CAs in your environment.<\/p>\n            <\/div>\n            <div class=\"clm-roadmap-step\">\n              <div class=\"clm-roadmap-num\">2<\/div>\n              <h5>Endpoint mapping<\/h5>\n              <p>We identify all systems and devices using certificates, including owners and dependencies.<\/p>\n            <\/div>\n            <div class=\"clm-roadmap-step\">\n              <div class=\"clm-roadmap-num\">3<\/div>\n              <h5>CLM implementation<\/h5>\n              <p>We design the flow, connect internal systems and deploy the module.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"clm-cta\" id=\"clmCtaBox\">\n          <p><strong>Want to discuss this?<\/strong>We'll email you the configuration and a consultant will reach out.<\/p>\n          <button type=\"button\" class=\"clm-btn clm-btn-accent\" id=\"clmShowContact\">Request a consultation<\/button>\n        <\/div>\n\n        <div class=\"clm-contact-form\" id=\"clmContactForm\">\n          <div class=\"clm-contact-grid\">\n            <div class=\"clm-field\">\n              <label class=\"clm-field-label-sm\" for=\"orgName\">Organization<\/label>\n              <input type=\"text\" id=\"orgName\" name=\"orgName\">\n              <div class=\"clm-error-msg\">Please enter your organization name.<\/div>\n            <\/div>\n            <div class=\"clm-field\">\n              <label class=\"clm-field-label-sm\" for=\"contactName\">Name<\/label>\n              <input type=\"text\" id=\"contactName\" name=\"contactName\">\n              <div class=\"clm-error-msg\">Please enter your name.<\/div>\n            <\/div>\n            <div class=\"clm-field\">\n              <label class=\"clm-field-label-sm\" for=\"contactEmail\">Email<\/label>\n              <input type=\"email\" id=\"contactEmail\" name=\"contactEmail\">\n              <div class=\"clm-error-msg\">Please enter a valid email address.<\/div>\n            <\/div>\n            <div class=\"clm-field\">\n              <label class=\"clm-field-label-sm\" for=\"contactPhone\">Phone (optional)<\/label>\n              <input type=\"tel\" id=\"contactPhone\" name=\"contactPhone\">\n            <\/div>\n          <\/div>\n          <label class=\"clm-consent\">\n            <input type=\"checkbox\" id=\"clmConsent\">\n            <span>I agree to the processing of my data by MONET+, a.s. for the purpose of handling my inquiry.<\/span>\n          <\/label>\n          <div class=\"clm-error-msg\" id=\"clmConsentError\">Consent is required to submit.<\/div>\n          <button type=\"button\" class=\"clm-btn clm-btn-primary\" id=\"clmSubmit\">Send to consultant<\/button>\n        <\/div>\n      <\/div>\n\n      <!-- Submission status -->\n      <div class=\"clm-step\" data-step=\"result\">\n        <div class=\"clm-result-status\" id=\"clmResultStatus\"><\/div>\n      <\/div>\n\n      <div class=\"clm-nav\" id=\"clmNav\">\n        <button type=\"button\" class=\"clm-btn clm-btn-ghost\" id=\"clmBack\">Back<\/button>\n        <button type=\"button\" class=\"clm-btn clm-btn-primary\" id=\"clmNext\">Continue<\/button>\n      <\/div>\n\n      <div class=\"clm-stepper\" id=\"clmStepper\">\n        <div class=\"clm-stepper-dots\">\n          <span class=\"clm-stepper-dot\" data-dot=\"0\">1<\/span>\n          <span class=\"clm-stepper-dot\" data-dot=\"1\">2<\/span>\n          <span class=\"clm-stepper-dot\" data-dot=\"2\">3<\/span>\n          <span class=\"clm-stepper-dot\" data-dot=\"3\">4<\/span>\n        <\/div>\n        <span class=\"clm-stepper-label\" id=\"clmStepperLabel\">Step 1 of 4<\/span>\n      <\/div>\n\n    <\/form>\n  <\/div>\n<\/div>\n\n<script>\n(function () {\n  var root = document.getElementById('clmConfigurator');\n  var steps = Array.prototype.slice.call(root.querySelectorAll('.clm-step[data-step]'));\n  var stepKeys = steps.map(function (s) { return s.getAttribute('data-step'); });\n  var current = 0;\n  var totalSteps = stepKeys.filter(function (k) { return k !== 'result'; }).length;\n  var questionSteps = totalSteps - 1; \/\/ steps 1-4 are questions, step 5 is the recommendation\n\n  var tabs = Array.prototype.slice.call(root.querySelectorAll('.clm-tab'));\n  var stepper = document.getElementById('clmStepper');\n  var stepperDots = Array.prototype.slice.call(root.querySelectorAll('.clm-stepper-dot'));\n  var stepperLabel = document.getElementById('clmStepperLabel');\n\n  var backBtn = document.getElementById('clmBack');\n  var nextBtn = document.getElementById('clmNext');\n\n  function updateTabs(index) {\n    tabs.forEach(function (tab) {\n      var i = parseInt(tab.getAttribute('data-index'), 10);\n      tab.classList.remove('active', 'completed', 'upcoming');\n      if (i === index) tab.classList.add('active');\n      else if (i < index) tab.classList.add('completed');\n      else tab.classList.add('upcoming');\n    });\n  }\n\n  function updateStepper(index) {\n    stepperDots.forEach(function (dot, i) {\n      dot.classList.remove('active', 'done');\n      if (i === index) dot.classList.add('active');\n      else if (i < index) dot.classList.add('done');\n    });\n    stepperLabel.textContent = 'Step ' + (index + 1) + ' of ' + questionSteps;\n  }\n\n  function showStep(index) {\n    steps.forEach(function (s) { s.classList.remove('active'); });\n    steps[index].classList.add('active');\n\n    updateTabs(Math.min(index, totalSteps - 1));\n\n    var isResult = stepKeys[index] === 'result';\n    var showStepper = !isResult && index < questionSteps;\n    stepper.style.display = showStepper ? 'flex' : 'none';\n    if (showStepper) updateStepper(index);\n\n    backBtn.style.display = (index === 0 || isResult) ? 'none' : 'inline-block';\n    nextBtn.style.display = (index === totalSteps - 1 || isResult) ? 'none' : 'inline-block';\n    document.getElementById('clmNav').style.display = isResult ? 'none' : 'flex';\n\n    if (index === totalSteps - 1) buildResults();\n  }\n\n  function validateStep(index) {\n    var step = steps[index]; var valid = true;\n    step.querySelectorAll('.clm-options[data-required=\"true\"]').forEach(function (group) {\n      var name = group.getAttribute('data-group');\n      var checked = group.querySelectorAll('input[name=\"' + name + '\"]:checked').length > 0;\n      var errorEl = step.querySelector('.clm-error-msg[data-for-group=\"' + name + '\"]');\n      if (errorEl) errorEl.classList.toggle('show', !checked);\n      if (!checked) valid = false;\n    });\n    return valid;\n  }\n\n  root.addEventListener('change', function (e) {\n    if (e.target.matches('.clm-option input')) {\n      var group = e.target.name;\n      root.querySelectorAll('input[name=\"' + group + '\"]').forEach(function (input) {\n        input.closest('.clm-option').classList.toggle('clm-checked', input.checked);\n      });\n    }\n  });\n\n  tabs.forEach(function (tab) {\n    tab.addEventListener('click', function () {\n      var i = parseInt(tab.getAttribute('data-index'), 10);\n      if (i < current) { current = i; showStep(current); root.scrollIntoView({ behavior: 'smooth', block: 'start' }); }\n    });\n  });\n\n  nextBtn.addEventListener('click', function () {\n    if (!validateStep(current)) return;\n    current++; showStep(current);\n    root.scrollIntoView({ behavior: 'smooth', block: 'start' });\n  });\n  backBtn.addEventListener('click', function () {\n    current--; showStep(current);\n    root.scrollIntoView({ behavior: 'smooth', block: 'start' });\n  });\n\n  function getValues(name) {\n    return Array.prototype.slice.call(root.querySelectorAll('input[name=\"' + name + '\"]:checked')).map(function (i) { return i.value; });\n  }\n  function getVal(name) { var v = getValues(name); return v.length ? v[0] : null; }\n\n  function computeAnswers() {\n    return {\n      endpoints: getValues('endpoints'),\n      caSource: getValues('caSource'),\n      pkiStatus: getVal('pkiStatus'),\n      visibility: getVal('visibility'),\n      renewal: getVal('renewal'),\n      outage: getVal('outage'),\n      regulation: getVal('regulation'),\n      hsm: getVal('hsm'),\n      roles: getVal('roles')\n    };\n  }\n\n  \/\/ ---------- Icons for result modules ----------\n  var ICONS = {\n    acme: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M13 2L4 14h6l-1 8 9-12h-6l1-8z\"\/><\/svg>',\n    f5: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"7\" rx=\"2\"\/><rect x=\"3\" y=\"13\" width=\"18\" height=\"7\" rx=\"2\"\/><circle cx=\"7\" cy=\"7.5\" r=\"1\"\/><circle cx=\"7\" cy=\"16.5\" r=\"1\"\/><\/svg>',\n    scep: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M2 8.5a15 15 0 0120 0\"\/><path d=\"M5.5 12a10 10 0 0113 0\"\/><path d=\"M9 15.5a5 5 0 016 0\"\/><circle cx=\"12\" cy=\"19\" r=\"1.2\"\/><\/svg>',\n    est: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"6\" y=\"6\" width=\"12\" height=\"12\" rx=\"2\"\/><rect x=\"9\" y=\"9\" width=\"6\" height=\"6\"\/><path d=\"M12 2v3M12 19v3M2 12h3M19 12h3\"\/><\/svg>',\n    'manual-issuance': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"16\" rx=\"2\"\/><path d=\"M7 9l3 3-3 3M13 15h4\"\/><\/svg>',\n    'public-ca': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3l7 3v6c0 4.5-3 7.5-7 9-4-1.5-7-4.5-7-9V6l7-3z\"\/><path d=\"M9 12l2 2 4-4\"\/><\/svg>',\n    'internal-ca': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"4\" y=\"3\" width=\"16\" height=\"18\" rx=\"1\"\/><path d=\"M9 8h1M14 8h1M9 12h1M14 12h1M9 16h1M14 16h1\"\/><\/svg>',\n    'pki-buildup': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"8\" cy=\"15\" r=\"4\"\/><path d=\"M11 12l9-9M17 6l3 3M14 9l2 2\"\/><\/svg>',\n    'hsm-supply': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"5\" y=\"11\" width=\"14\" height=\"9\" rx=\"2\"\/><path d=\"M8 11V7a4 4 0 018 0v4\"\/><\/svg>',\n    discovery: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M2 12s4-7 10-7 10 7 10 7-4 7-10 7-10-7-10-7z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/svg>',\n    'auto-renew': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 12a8 8 0 0113.7-5.7L21 9M21 4v5h-5\"\/><path d=\"M20 12a8 8 0 01-13.7 5.7L3 15M3 20v-5h5\"\/><\/svg>',\n    'expiry-alerts': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3l10 18H2L12 3z\"\/><path d=\"M12 10v4M12 17h.01\"\/><\/svg>',\n    'audit-log': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"6\" y=\"4\" width=\"12\" height=\"16\" rx=\"2\"\/><path d=\"M9 4V3h6v1M9 12l2 2 4-4\"\/><\/svg>',\n    'approval-workflow': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M8 12l3 3 5-6\"\/><\/svg>',\n    'role-hierarchy': '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"9\" cy=\"8\" r=\"3\"\/><path d=\"M3 20c0-3 3-5 6-5s6 2 6 5\"\/><circle cx=\"17\" cy=\"9\" r=\"2.5\"\/><path d=\"M15 20c.3-2 1.8-3.5 4-3.8\"\/><\/svg>',\n    core: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 3l9 5-9 5-9-5 9-5z\"\/><path d=\"M3 13l9 5 9-5\"\/><\/svg>'\n  };\n\n  \/\/ ---------- Recommendation rules ----------\n  var RULES = [\n    { id: 'acme', category: 'Endpoints & protocols', title: 'ACME protocol', featured: true,\n      test: function (a) { return a.endpoints.indexOf('tls') > -1 || a.endpoints.indexOf('microservices') > -1; },\n      reason: function (a) {\n        var uses = [];\n        if (a.endpoints.indexOf('tls') > -1) uses.push('automated issuance and renewal of TLS certificates for websites and APIs');\n        if (a.endpoints.indexOf('microservices') > -1) uses.push('fast, hands-off rotation of short-lived certificates for microservices');\n        return 'Covers ' + uses.join(' and ') + '. The most widely used protocol for a fully automated certificate lifecycle without manual steps.';\n      } },\n    { id: 'f5', category: 'Endpoints & protocols', title: 'F5 BIG-IP connector',\n      test: function (a) { return a.endpoints.indexOf('f5') > -1; },\n      reason: 'Automates certificate installation and renewal directly on F5 devices.' },\n    { id: 'scep', category: 'Endpoints & protocols', title: 'SCEP protocol',\n      test: function (a) { return a.endpoints.indexOf('cisco') > -1; },\n      reason: 'The standard way of obtaining certificates for Cisco network devices.' },\n    { id: 'est', category: 'Endpoints & protocols', title: 'EST protocol',\n      test: function (a) { return a.endpoints.indexOf('iot') > -1; },\n      reason: 'A more secure enrollment method for OT\/IoT devices than older protocols.' },\n    { id: 'manual-issuance', category: 'Endpoints & protocols', title: 'Manual \/ API issuance',\n      test: function (a) { return a.endpoints.indexOf('custom') > -1; },\n      reason: 'For custom systems without standard protocol support \u2013 issuance via API or manually.' },\n\n    { id: 'public-ca', category: 'Certificate sources & PKI', title: 'Public CA integration',\n      test: function (a) { return a.caSource.indexOf('publicCA') > -1; },\n      reason: 'Direct API integration for issuance and renewal from a public certificate authority.' },\n    { id: 'internal-ca', category: 'Certificate sources & PKI', title: 'Internal CA integration',\n      test: function (a) { return a.caSource.indexOf('internalCA') > -1; },\n      reason: 'Connects your internal CA directly to lifecycle management.' },\n    { id: 'pki-buildup', category: 'Certificate sources & PKI', title: 'Building \/ strengthening PKI',\n      test: function (a) { return a.pkiStatus === 'pkiNone' || a.pkiStatus === 'pkiPartial'; },\n      reason: function (a) { return a.pkiStatus === 'pkiNone'\n        ? 'You don\\'t have your own PKI yet \u2013 the necessary foundation CLM builds on.'\n        : 'Your PKI is only partial or outdated \u2013 we recommend strengthening it before deployment.'; } },\n    { id: 'hsm-supply', category: 'Certificate sources & PKI', title: 'HSM supply and deployment',\n      test: function (a) { return a.hsm === 'hsmNeed'; },\n      reason: 'You don\\'t have your own HSM, but your deployment calls for one \u2013 we can supply and deploy it.' },\n\n    { id: 'discovery', category: 'Visibility & inventory', title: 'Discovery module',\n      test: function (a) { return a.visibility === 'noView' || a.visibility === 'partialView'; },\n      reason: function (a) { return a.visibility === 'noView'\n        ? 'You don\\'t have an overview of existing certificates \u2013 Discovery will automatically find and register them.'\n        : 'Your overview is only partial \u2013 Discovery will complete it and keep it up to date.'; } },\n\n    { id: 'auto-renew', category: 'Operational automation', title: 'Automatic renewal',\n      test: function (a) { return a.renewal === 'manual' || a.renewal === 'partialAuto' || a.outage === 'repeated' || a.outage === 'once'; },\n      reason: function (a) { return (a.outage === 'repeated' || a.outage === 'once')\n        ? 'A certificate has expired without warning in the past \u2013 automatic renewal will prevent this going forward.'\n        : 'You currently handle renewal manually or only partially automatically \u2013 the biggest opportunity to save time.'; } },\n    { id: 'expiry-alerts', category: 'Operational automation', title: 'Expiry alerts',\n      test: function (a) { return a.renewal === 'manual' || a.outage === 'repeated' || a.outage === 'once'; },\n      reason: 'Early alerts give your team time to act before an outage occurs.' },\n\n    { id: 'audit-log', category: 'Compliance & audit', title: 'Audit log',\n      test: function (a) { return a.regulation === 'regYes' || a.regulation === 'regUnsure'; },\n      reason: function (a) { return a.regulation === 'regYes'\n        ? 'Evidence of compliance with DORA\/NIS2 during inspections.'\n        : 'A precaution even without certainty about regulation \u2013 compliance can be demonstrated retroactively.'; } },\n    { id: 'approval-workflow', category: 'Compliance & audit', title: 'Approval workflow',\n      test: function (a) { return a.regulation === 'regYes'; },\n      reason: 'Approval before certificate issuance as part of change control.' },\n    { id: 'role-hierarchy', category: 'Compliance & audit', title: 'Administrative role hierarchy',\n      test: function (a) { return a.roles === 'rolesYes'; },\n      reason: 'Splits permissions between administrators, approvers and requesters according to your structure.' }\n  ];\n\n  var CATEGORY_ORDER = ['Endpoints & protocols', 'Certificate sources & PKI', 'Visibility & inventory', 'Operational automation', 'Compliance & audit'];\n\n  function resolveReason(rule, answers) {\n    return typeof rule.reason === 'function' ? rule.reason(answers) : rule.reason;\n  }\n\n  function buildResults() {\n    var answers = computeAnswers();\n    var triggered = RULES.filter(function (r) { return r.test(answers); });\n\n    var container = document.getElementById('clmModuleResults');\n    var html = '';\n\n    html += '<div class=\"clm-module-group\"><h4>Foundation<\/h4>';\n    html += '<div class=\"clm-module-card clm-module-core\"><div class=\"clm-module-icon\">' + ICONS.core + '<\/div><div><p class=\"clm-module-title\">CLM platform and certificate inventory<\/p><p class=\"clm-module-reason\">Central certificate management and inventory is included in every deployment.<\/p><\/div><\/div>';\n    html += '<\/div>';\n\n    if (triggered.length === 0) {\n      html += '<div class=\"clm-empty-state\">Based on your answers we don\\'t see any further specific needs yet \u2013 we\\'ll go over the details with a consultant.<\/div>';\n    } else {\n      CATEGORY_ORDER.forEach(function (cat) {\n        var items = triggered.filter(function (r) { return r.category === cat; });\n        if (!items.length) return;\n        html += '<div class=\"clm-module-group\"><h4>' + cat + '<\/h4>';\n        items.forEach(function (rule) {\n          var cardClass = 'clm-module-card' + (rule.featured ? ' clm-module-featured' : '');\n          var tag = rule.featured ? '<span class=\"clm-module-tag\">Key protocol<\/span>' : '';\n          var icon = ICONS[rule.id] || ICONS.core;\n          html += '<div class=\"' + cardClass + '\"><div class=\"clm-module-icon\">' + icon + '<\/div><div><p class=\"clm-module-title\">' + rule.title + tag + '<\/p><p class=\"clm-module-reason\">' + resolveReason(rule, answers) + '<\/p><\/div><\/div>';\n        });\n        html += '<\/div>';\n      });\n    }\n\n    container.innerHTML = html;\n    window.__clmLastAnswers = answers;\n    window.__clmLastModules = triggered.map(function (r) { return { title: r.title, category: r.category, reason: resolveReason(r, answers) }; });\n  }\n\n  var showContactBtn = document.getElementById('clmShowContact');\n  var contactForm = document.getElementById('clmContactForm');\n  var ctaBox = document.getElementById('clmCtaBox');\n  showContactBtn.addEventListener('click', function () {\n    contactForm.classList.add('show');\n    ctaBox.style.display = 'none';\n    document.getElementById('orgName').setAttribute('required', 'required');\n    document.getElementById('contactName').setAttribute('required', 'required');\n    document.getElementById('contactEmail').setAttribute('required', 'required');\n    contactForm.scrollIntoView({ behavior: 'smooth', block: 'start' });\n  });\n\n  function getFieldVal(id) { var el = document.getElementById(id); return el ? el.value.trim() : ''; }\n\n  var submitBtn = document.getElementById('clmSubmit');\n  submitBtn.addEventListener('click', function () {\n    var valid = true;\n    [['orgName', ''], ['contactName', ''], ['contactEmail', '']].forEach(function (pair) {\n      var el = document.getElementById(pair[0]);\n      var errorEl = el.parentElement.querySelector('.clm-error-msg');\n      var ok = el.value.trim() !== '';\n      if (pair[0] === 'contactEmail' && ok) ok = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/.test(el.value.trim());\n      el.classList.toggle('clm-invalid', !ok);\n      if (errorEl) errorEl.classList.toggle('show', !ok);\n      if (!ok) valid = false;\n    });\n    var consent = document.getElementById('clmConsent');\n    var consentError = document.getElementById('clmConsentError');\n    if (!consent.checked) { consentError.classList.add('show'); valid = false; } else { consentError.classList.remove('show'); }\n    if (!valid) return;\n\n    submitBtn.disabled = true; submitBtn.textContent = 'Sending...';\n\n    \/\/ NOTE: payload keys stay in Czech \u2013 they are read by the WordPress\n    \/\/ handler clm_configurator_submit. Do not rename without changing the PHP.\n    var payload = {\n      organizace: getFieldVal('orgName'),\n      kontaktJmeno: getFieldVal('contactName'),\n      kontaktEmail: getFieldVal('contactEmail'),\n      kontaktTelefon: getFieldVal('contactPhone'),\n      odpovedi: window.__clmLastAnswers || {},\n      doporuceneModuly: window.__clmLastModules || [],\n      lang: 'en'\n    };\n\n    fetch('\/wp-admin\/admin-ajax.php', {\n      method: 'POST',\n      headers: { 'Content-Type': 'application\/x-www-form-urlencoded' },\n      body: new URLSearchParams({ action: 'clm_configurator_submit', payload: JSON.stringify(payload) })\n    })\n      .then(function (res) { if (!res.ok) throw new Error('Server error'); return res.json().catch(function () { return {}; }); })\n      .then(function (data) { if (data && data.success === false) throw new Error('Handler error'); showResult(true, payload); })\n      .catch(function () { showResult(false, payload); });\n  });\n\n  function showResult(success, payload) {\n    current = stepKeys.indexOf('result');\n    showStep(current);\n    var el = document.getElementById('clmResultStatus');\n    if (success) {\n      el.innerHTML = '<div class=\"clm-result-icon ok\">&#10003;<\/div><h3>Configuration sent<\/h3><p>We\\'ve sent a confirmation to ' + payload.kontaktEmail + '. Our consultant will be in touch.<\/p>';\n    } else {\n      el.innerHTML = '<div class=\"clm-result-icon err\">&#33;<\/div><h3>Couldn\\'t send automatically<\/h3><p>Please copy the summary below and send it to <a href=\"mailto:ivrana@monetplus.cz\">ivrana@monetplus.cz<\/a>.<\/p><div class=\"clm-fallback-box\">' + JSON.stringify(payload, null, 2).replace(\/<\/g, '&lt;') + '<\/div>';\n    }\n    root.scrollIntoView({ behavior: 'smooth', block: 'start' });\n  }\n\n  showStep(0);\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\" elementor-column elementor-col-16 elementor-top-column elementor-element elementor-element-2ce6a40\" data-fullscreen-column-settings=\"{&quot;fullscreen&quot;:&quot;&quot;}\" data-id=\"2ce6a40\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap\">\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Online CLM Configurator Answer a few questions about your environment and get specific module recommendations. Devices CA &amp; PKI Operations Compliance Result Devices Select everything that applies to your environment. What will you cover? TLS certificateswebsites, APIs, application servers Short-lived certificates for microservicesfrequent rotation, service-to-service communication F5 BIG-IP \/ F5 load balancers Cisco network devices [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-122176","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/pages\/122176","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/comments?post=122176"}],"version-history":[{"count":29,"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/pages\/122176\/revisions"}],"predecessor-version":[{"id":125092,"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/pages\/122176\/revisions\/125092"}],"wp:attachment":[{"href":"https:\/\/monetplus.cz\/en\/wp-json\/wp\/v2\/media?parent=122176"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}