{"id":78863,"date":"2026-08-19T02:31:29","date_gmt":"2026-08-18T21:01:29","guid":{"rendered":"https:\/\/smartfoodsafe.com\/clone\/?page_id=78863"},"modified":"2026-09-15T16:11:45","modified_gmt":"2026-09-15T10:41:45","slug":"smart-change","status":"publish","type":"page","link":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/","title":{"rendered":"Smart Change"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>Change Management Software \u2014 Elementor-Ready Build<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&#038;family=Poppins:wght@400;500;600;700&#038;display=swap\" rel=\"stylesheet\">\n\n<style>\n\/* Fonts loaded via @import \u2014 more reliable inside Elementor HTML widgets than <link> *\/\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap');\n\n.smcm-page {\n  --smcm-navy:   #0B163F;\n  --smcm-blue:   #2B6BE6;\n  --smcm-white:  #FFFFFF;\n  --smcm-muted:  #6B7A99;\n  --smcm-pill:   40px;\n  --smcm-font-h: 'Plus Jakarta Sans', sans-serif;\n  --smcm-font-b: 'Poppins', sans-serif;\n\n  font-family: var(--smcm-font-b);\n  color: var(--smcm-navy);\n\n  width: 100%;\n  max-width: 100%;\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n\n  background: linear-gradient(\n    180deg,\n    #B8D4F0  0%,\n    #C6DCF5  6%,\n    #D4E6F8 14%,\n    #DFECF9 24%,\n    #EAF2FB 38%,\n    #F2F7FD 56%,\n    #F9FCFE 72%,\n    #FFFFFF 100%\n  );\n}\n.smcm-page, .smcm-page *, .smcm-page *::before, .smcm-page *::after {\n  box-sizing: border-box;\n}\n\n\/* Neutralize theme\/Elementor default button & link chrome inside this widget only.\n   Zero-specificity :where() so any later, more specific rule in this file wins. *\/\n.smcm-page :where(button) {\n  all: unset;\n  box-sizing: border-box;\n  cursor: pointer;\n  font-family: var(--smcm-font-b);\n}\n.smcm-page :where(a) {\n  text-decoration: none;\n  box-sizing: border-box;\n}\n\n.smcm-page h1,\n.smcm-page h2,\n.smcm-page h3,\n.smcm-page .smcm-hero-title,\n.smcm-page .smcm-tour-heading,\n.smcm-page .smcm-tour-intro-title,\n.smcm-page .smcm-sf-heading {\n  font-family: var(--smcm-font-h) !important;\n}\n.smcm-page .smcm-sf-tab-title,\n.smcm-page .smcm-sf-heading-blue {\n  font-family: var(--smcm-font-h) !important;\n}\n.smcm-page .smcm-sf-tab-desc {\n  font-family: var(--smcm-font-b) !important;\n}\n.smcm-page p,\n.smcm-page button,\n.smcm-page a,\n.smcm-page span,\n.smcm-page .smcm-hero-subtitle,\n.smcm-page .smcm-tour-intro-desc,\n.smcm-page .smcm-tour-callout,\n.smcm-page .smcm-tour-counter {\n  font-family: var(--smcm-font-b) !important;\n}\n\n  .smcm-hero-dashboard {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    overflow: hidden;\n    background: linear-gradient(\n      180deg,\n      #B8D4F0  0%,\n      #C6DCF5  6%,\n      #D4E6F8 14%,\n      #DFECF9 24%,\n      #EAF2FB 38%,\n      #F2F7FD 56%,\n      #F9FCFE 72%,\n      #FFFFFF 100%\n    );\n  }\n  .smcm-hero {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    min-height: 52vh;\n    padding: 132px 48px 8px;\n    background: transparent;\n    text-align: center;\n  }\n  .smcm-hero-content {\n    width: 100%;\n    max-width: clamp(320px, 62vw, 1760px);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n  }\n  .smcm-hero-title {\n    font-family: var(--smcm-font-h);\n    font-size: clamp(36px, 4vw, 118px);\n    font-weight: 700;\n    color: var(--smcm-navy);\n    line-height: 1.24;\n    letter-spacing: -1.2px;\n    margin-bottom: 16px;\n  }\n  .smcm-hero-subtitle {\n    font-family: var(--smcm-font-b);\n    font-size: clamp(12px, 1vw, 18px);\n    font-weight: 500;\n    color: var(--smcm-muted);\n    line-height: 1.6;\n    max-width: clamp(400px, 46vw, 900px);\n    margin-bottom: 32px;\n  }\n  .smcm-hero-btn {\n    position: relative;\n    z-index: 5;\n    display: inline-flex !important;\n    align-items: center;\n    gap: 10px;\n    background: linear-gradient(145deg, #0351C2 0%, #01265C 100%) !important;\n    color: #fff !important;\n    padding: 20px 36px !important;\n    border-radius: var(--smcm-pill) !important;\n    font-family: var(--smcm-font-b);\n    font-size: 13px;\n    font-weight: 700;\n    text-decoration: none !important;\n    white-space: nowrap;\n    letter-spacing: 0.1px;\n    margin-bottom: 32px;\n    border: none !important;\n  }\n  @media (min-width: 1440px) {\n    .smcm-tour-section::before { width: min(1400px, calc(100% - 64px)); }\n    .smcm-hero { min-height: 54vh; padding: 148px 80px 8px; }\n  }\n  @media (max-width: 768px) {\n    .smcm-hero { min-height: 40vh; padding: 96px 20px 6px; }\n    .smcm-hero-title { font-size: 36px; }\n    .smcm-hero-subtitle { font-size: 12px; }\n  }\n\n  \/* Dashboard grows in normal document flow, driven purely by scroll\n     distance from the very top of the page \u2014 no pin\/fixed step, so it\n     starts scaling the instant the user begins scrolling, since hero\n     and dashboard now live in one continuous section. *\/\n  .smcm-reveal-shot {\n    display: block;\n    width: 100%;\n    max-width: clamp(560px, 68vw, 1900px);\n    height: auto;\n    object-fit: contain;\n    border-radius: 16px;\n    transform: scale(0.6);\n    transform-origin: center top;\n    will-change: transform;\n  }\n\n  .smcm-reveal-shot-wrap {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n    padding: 0 48px 40px;\n    box-sizing: border-box;\n  }\n\n  @media (min-width: 2200px) {\n    .smcm-reveal-shot-wrap { padding: 0 64px 48px; }\n  }\n  @media (min-width: 1600px) {\n    .smcm-tour-section::before { width: min(1520px, calc(100% - 72px)); }\n  }\n  @media (min-width: 1800px) {\n    .smcm-tour-section::before { width: min(1680px, calc(100% - 80px)); }\n  }\n  @media (min-width: 2400px) {\n    .smcm-tour-section::before { width: min(2040px, calc(100% - 112px)); }\n  }\n\n  .smcm-sf-section {\n    background: #ffffff;\n    padding: 80px 48px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 100%;\n  }\n  .smcm-sf-inner {\n    width: 100%;\n    max-width: min(1140px, 92vw);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n  }\n  .smcm-sf-header {\n    text-align: center;\n    margin-bottom: 40px;\n  }\n  .smcm-sf-heading {\n    font-family: var(--smcm-font-h);\n    font-size: 34px;\n    font-weight: 700;\n    color: var(--smcm-navy);\n    letter-spacing: -0.8px;\n    line-height: 1.2;\n    margin: 0;\n  }\n  .smcm-sf-heading-blue {\n    color: var(--smcm-blue);\n    font-size: inherit;\n    font-weight: inherit;\n    font-family: var(--smcm-font-h);\n  }\n\n  .smcm-sf-subtitle {\n    margin: 12px auto 0;\n    max-width: 760px;\n    font-family: var(--smcm-font-b) !important;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 1.7;\n    color: var(--smcm-muted);\n    text-align: center;\n  }\n  .smcm-sf-layout {\n    width: 100%;\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-items: center;\n    gap: clamp(32px, 3.5vw, 64px);\n  }\n  .smcm-sf-tabs {\n    flex: 1 1 300px;\n    max-width: 380px;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n  }\n  .smcm-sf-tab {\n    padding: 16px 0 16px 14px;\n    border-bottom: 1px solid rgba(11,22,63,0.08);\n    border-left: 3px solid transparent;\n    cursor: pointer;\n    transition: border-color 0.25s;\n  }\n  .smcm-sf-tab:first-child { padding-top: 0; }\n  .smcm-sf-tab.smcm-sf-active {\n    border-left-color: var(--smcm-blue);\n  }\n  .smcm-sf-tab-title {\n    font-family: var(--smcm-font-h);\n    font-size: 15px;\n    font-weight: 700;\n    color: var(--smcm-muted);\n    margin: 0;\n    transition: color 0.25s;\n  }\n  .smcm-sf-tab.smcm-sf-active .smcm-sf-tab-title { color: var(--smcm-navy); }\n  .smcm-sf-tab-desc {\n    display: none;\n    font-family: var(--smcm-font-b);\n    font-size: 12.5px;\n    font-weight: 500;\n    color: var(--smcm-muted);\n    line-height: 1.6;\n    margin: 8px 0 0;\n  }\n  .smcm-sf-tab.smcm-sf-active .smcm-sf-tab-desc { display: block; }\n  .smcm-sf-tab-progress {\n    display: none;\n    width: 100%;\n    height: 2px;\n    background: rgba(43,107,230,0.15);\n    margin-top: 14px;\n    border-radius: 2px;\n    overflow: hidden;\n  }\n  .smcm-sf-tab.smcm-sf-active .smcm-sf-tab-progress { display: block; }\n  .smcm-sf-tab-progress-fill {\n    display: block;\n    height: 100%;\n    width: 0%;\n    background: var(--smcm-blue);\n    border-radius: 2px;\n  }\n  .smcm-sf-tab-progress-fill.smcm-sf-animate {\n    animation: smcm-sf-progress 5s linear forwards;\n  }\n  @keyframes smcm-sf-progress {\n    from { width: 0%; }\n    to   { width: 100%; }\n  }\n  .smcm-sf-tab-mobile-img {\n    display: none;\n  }\n  .smcm-sf-panel {\n    flex: 0 1 460px;\n    width: 100%;\n    max-width: 460px;\n    border-radius: 28px;\n    background: linear-gradient(135deg, #EAF2FC 0%, #F7FAFE 55%, #FFFFFF 100%);\n    box-shadow: 0 20px 60px rgba(43,107,230,0.08);\n    padding: clamp(18px, 2vw, 28px);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n  }\n  .smcm-sf-media {\n    position: relative;\n    width: 100%;\n    max-width: 340px;\n    margin: 0 auto;\n    aspect-ratio: 4 \/ 5;\n    overflow: hidden;\nborder-radius: 18px;\n  }\n  .smcm-sf-media-img {\n    width: 100%;\n    height: 100%;\n    display: block;\n    object-fit: contain;\n    opacity: 0;\n    position: absolute;\n    top: 0; left: 0;\n    transition: opacity 0.4s ease;\n  }\n  .smcm-sf-media-img.smcm-sf-active { opacity: 1; }\n\n  @media (max-width: 1280px) {\n    .smcm-sf-section { padding: 72px 40px; }\n  }\n  @media (max-width: 1024px) {\n    .smcm-sf-section { padding: 64px 32px; }\n    .smcm-sf-heading { font-size: 30px; }\n    .smcm-sf-layout  { gap: 36px; }\n    .smcm-sf-tabs    { max-width: 320px; }\n    .smcm-sf-panel   { flex-basis: 360px; max-width: 360px; padding: 22px; border-radius: 24px; }\n    .smcm-sf-media   { max-width: 300px; }\n  }\n  @media (max-width: 900px) {\n    .smcm-sf-layout {\n      flex-direction: column;\n      max-width: 520px;\n      margin: 0 auto;\n      align-items: stretch;\n    }\n    .smcm-sf-panel  { display: none; }\n    .smcm-sf-tabs   { max-width: 100%; width: 100%; flex: 1 1 auto; }\n    .smcm-sf-tab-mobile-img {\n      display: none;\n      width: 100%;\n      max-width: 360px;\n      height: auto;\n      aspect-ratio: 4 \/ 5;\n      object-fit: contain;\n      border-radius: 16px;\n      margin: 16px auto 0;\n      box-shadow: 0 12px 30px rgba(43,107,230,0.14);\n      background: linear-gradient(135deg, #EEF4FF 0%, #E2EDFF 100%);\n    }\n    .smcm-sf-tab.smcm-sf-active .smcm-sf-tab-mobile-img { display: block; }\n\n    \/* On mobile\/tablet the image sits inside .smcm-sf-tab itself, so\n       the active-tab accent border (normally on the whole tab) was\n       running the full height including alongside the image. Move it\n       to just the title\/description text instead. *\/\n    .smcm-sf-tab {\n      border-left-color: transparent !important;\n      padding-left: 0 !important;\n    }\n    .smcm-sf-tab-title,\n    .smcm-sf-tab-desc {\n      padding-left: 14px;\n      border-left: 3px solid transparent;\n    }\n    .smcm-sf-tab.smcm-sf-active .smcm-sf-tab-title,\n    .smcm-sf-tab.smcm-sf-active .smcm-sf-tab-desc {\n      border-left-color: var(--smcm-blue);\n    }\n  }\n  @media (max-width: 768px) {\n    .smcm-sf-section { padding: 48px 20px; }\n    .smcm-sf-header  { margin-bottom: 24px; }\n    .smcm-sf-heading { font-size: 24px; }\n    .smcm-sf-layout  { gap: 8px; max-width: 100%; }\n    .smcm-sf-tab     { padding: 12px 0; }\n    .smcm-sf-tab-title { font-size: 14px; }\n    .smcm-sf-tab-desc  { font-size: 12px; }\n    .smcm-sf-tab-mobile-img { max-width: 100%; }\n  }\n  @media (max-width: 480px) {\n    .smcm-sf-section { padding: 40px 16px; }\n    .smcm-sf-heading { font-size: 22px; }\n    .smcm-sf-tab-title { font-size: 13px; }\n    .smcm-sf-tab-desc  { font-size: 11.5px; }\n  }\n\n  .smcm-tour-section {\n    background: #ffffff;\n    position: relative;\n    width: 100%;\n    padding: 96px clamp(28px, 5vw, 80px) 72px;\n    overflow: visible;\n  }\n  .smcm-tour-section::before {\n    content: '';\n    position: absolute;\n    left: 50%;\n    top: 24px;\n    bottom: 24px;\n    transform: translateX(-50%);\n    width: min(1280px, calc(100% - 48px));\n    background-image: url('https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/background.svg');\n    background-size: cover;\n    background-position: center center;\n    background-repeat: no-repeat;\n    border-radius: 28px;\n    z-index: 0;\n    pointer-events: none;\n  }\n  .smcm-tour-section > * {\n    position: relative;\n    z-index: 1;\n  }\n\n  .smcm-tour-heading {\n    text-align: center;\n    font-family: var(--smcm-font-h);\n    font-size: clamp(26px, 2.4vw, 40px);\n    font-weight: 700;\n    color: var(--smcm-navy);\n    margin: 0 0 clamp(20px, 2vw, 30px);\n  }\n  .smcm-tour-subtitle {\n    margin: -14px auto 28px;\n    max-width: 760px;\n    text-align: center;\n    font-family: var(--smcm-font-b) !important;\n    font-size: clamp(13px, 1vw, 16px);\n    font-weight: 500;\n    line-height: 1.6;\n    color: var(--smcm-muted);\n  }\n\n  \n\n\n  .smcm-tour-heading .smcm-tour-accent {\n    color: inherit;\n    font-family: var(--smcm-font-h) !important;\n  }\n\n  .smcm-tour-card {\n    position: relative;\n    width: 100%;\n    max-width: min(1400px, 94vw);\n    margin: 0 auto;\n    background: #fff;\n    border-radius: clamp(14px, 1.2vw, 20px);\n    box-shadow: 0 24px 64px rgba(11,22,63,0.14);\n    overflow: hidden;\n  }\n\n  .smcm-tour-chrome {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 18px;\n    background: transparent;\n    border-bottom: 1px solid #E7ECF5;\n  }\n  .smcm-tour-dot { width: 11px; height: 11px; border-radius: 50%; }\n  .smcm-tour-dot.smcm-tour-dot-red    { background: #FF5F57; }\n  .smcm-tour-dot.smcm-tour-dot-yellow { background: #FEBC2E; }\n  .smcm-tour-dot.smcm-tour-dot-green  { background: #28C840; }\n\n  .smcm-tour-viewport {\n    position: relative;\n    min-height: 0;\n    overflow: hidden;\n  }\n\n  .smcm-tour-slide {\n    display: none;\n    padding: clamp(22px, 2.2vw, 32px);\n  }\n  .smcm-tour-slide.smcm-tour-active { display: block; }\n  .smcm-tour-slide[data-slide=\"1\"] {\n    padding: clamp(22px, 2.2vw, 32px);\n  }\n\n  .smcm-tour-intro {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-items: center;\n    gap: clamp(24px, 2.4vw, 40px);\n    min-height: 0;\n    padding: 0 clamp(24px, 3.5vw, 56px);\n    box-sizing: border-box;\n    width: 100%;\n    max-width: min(1180px, 100%);\n    margin: 0 auto;\n  }\n  .smcm-tour-intro-photo {\n    position: relative;\n    flex: 0 1 340px;\n    width: 100%;\n    max-width: 340px;\n    border-radius: clamp(14px, 1.2vw, 20px);\n    overflow: hidden;\n    background: #E8F0FE;\n    aspect-ratio: 4 \/ 5;\n    max-height: min(420px, 50vh);\n    box-shadow:\n      0 0 0 6px rgba(210, 228, 255, 0.9),\n      0 0 40px 8px rgba(43, 107, 230, 0.16),\n      0 16px 40px rgba(11, 22, 63, 0.1);\n  }\n  .smcm-tour-portrait {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    object-position: center top;\n    display: block;\n  }\n  .smcm-tour-intro-copy {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: flex-start;\n    flex: 1 1 320px;\n    max-width: 460px;\n    padding: clamp(4px, 1vw, 10px) 0;\n    position: relative;\n    text-align: left;\n    box-sizing: border-box;\n  }\n  .smcm-tour-intro-title {\n    font-family: var(--smcm-font-h);\n    font-size: clamp(17px, 1.7vw, 27px);\n    font-weight: 700;\n    color: var(--smcm-navy);\n    margin: 0 0 clamp(8px, 0.9vw, 12px);\n    line-height: 1.28;\n    letter-spacing: -0.35px;\n    max-width: 28em;\n  }\n  .smcm-tour-intro-desc {\n    font-family: var(--smcm-font-b);\n    font-size: clamp(12px, 1vw, 15px);\n    font-weight: 400;\n    color: #6B7A99;\n    line-height: 1.6;\n    margin: 0 0 clamp(14px, 1.6vw, 24px);\n    max-width: 36em;\n  }\n  .smcm-tour-start-btn {\n    font-size: clamp(13px, 1.05vw, 16px) !important;\n    padding: clamp(10px, 1vw, 14px) clamp(20px, 2vw, 28px) !important;\n  }\n  .smcm-tour-powered {\n    margin-top: clamp(16px, 2vw, 28px);\n    padding-top: 0;\n    font-family: var(--smcm-font-b);\n    font-size: clamp(11px, 0.95vw, 14px);\n    font-weight: 500;\n    color: #8A97B0;\n    align-self: flex-start;\n  }\n  .smcm-tour-powered span {\n    color: #2B6BE6;\n    font-weight: 600;\n  }\n  .smcm-tour-start-btn {\n    display: inline-flex !important;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    width: auto;\n    max-width: max-content;\n    align-self: flex-start;\n    background: #2B6BE6 !important;\n    color: #fff !important;\n    padding: 12px 26px !important;\n    border-radius: 10px !important;\n    font-family: var(--smcm-font-b);\n    font-size: 14px;\n    font-weight: 600;\n    text-decoration: none !important;\n    border: none !important;\n    cursor: pointer;\n    box-shadow: 0 6px 18px rgba(43,107,230,0.25) !important;\n    transition: transform 0.15s ease, box-shadow 0.15s ease;\n  }\n  .smcm-tour-start-btn:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 8px 22px rgba(43,107,230,0.32) !important;\n  }\n\n  .smcm-tour-hotspot {\n    position: relative;\n    display: inline-flex;\n    cursor: pointer;\n    z-index: 2;\n  }\n  .smcm-tour-hotspot::after {\n    content: '';\n    position: absolute;\n    inset: -4px;\n    border-radius: inherit;\n    box-shadow: 0 0 0 0 rgba(43, 107, 230, 0.4);\n    animation: smcm-tour-pulse 1.8s ease-out infinite;\n    pointer-events: none;\n  }\n  .smcm-tour-hotspot.smcm-tour-hotspot-pill::after {\n    border-radius: 999px;\n  }\n  .smcm-tour-hotspot.smcm-tour-hotspot-rect::after {\n    border-radius: 14px;\n  }\n  @keyframes smcm-tour-pulse {\n    0%   { box-shadow: 0 0 0 0 rgba(43, 107, 230, 0.4); }\n    70%  { box-shadow: 0 0 0 10px rgba(43, 107, 230, 0); }\n    100% { box-shadow: 0 0 0 0 rgba(43, 107, 230, 0); }\n  }\n\n  \/* \u2500\u2500 Slide 14: Final CTA \u2014 Book Demo \u2500\u2500 *\/\n  .smcm-tour-slide14 {\n    position: relative;\n    \/* Both children here (bg + modal) are position:absolute, so unlike\n       other slides this one has no in-flow content to size itself by \u2014\n       needs a min-height floor or it collapses to 0. This still grows\n       for more content; it just won't disappear. *\/\n    min-height: clamp(280px, 26vw, 420px);\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F4F7FC;\n  }\n  .smcm-tour-s14-bg {\n    position: absolute;\n    inset: 0;\n    filter: blur(6px);\n    opacity: 0.7;\n    transform: scale(1.05);\n    pointer-events: none;\n    display: flex;\n  }\n  .smcm-tour-s14-bg-side {\n    width: 22%;\n    background: linear-gradient(180deg, #1B4FBF, #163F9A);\n  }\n  .smcm-tour-s14-bg-main {\n    flex: 1;\n    background: #F7F9FC;\n    padding: 20px;\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n  }\n  .smcm-tour-s14-bg-row {\n    height: 36px;\n    border-radius: 8px;\n    background: #fff;\n    box-shadow: 0 1px 3px rgba(11,22,63,0.05);\n  }\n  .smcm-tour-s14-modal {\n    position: absolute;\n    left: 50%;\n    top: 50%;\n    transform: translate(-50%, -50%);\n    width: min(480px, 88%);\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 20px;\n    padding: clamp(24px, 3vw, 38px) clamp(22px, 2.6vw, 34px);\n    text-align: center;\n    box-shadow: 0 24px 60px rgba(11, 30, 80, 0.35);\n    z-index: 2;\n  }\n  .smcm-tour-s14-title {\n    font-family: var(--smcm-font-h);\n    font-size: clamp(19px, 2vw, 26px);\n    font-weight: 700;\n    color: #fff;\n    margin: 0 0 10px;\n    line-height: 1.3;\n  }\n  .smcm-tour-s14-desc {\n    font-family: var(--smcm-font-b);\n    font-size: clamp(13px, 1.15vw, 15px);\n    font-weight: 400;\n    color: rgba(255,255,255,0.9);\n    line-height: 1.55;\n    margin: 0 0 20px;\n  }\n  .smcm-tour-s14-btn {\n    display: inline-flex !important;\n    align-items: center;\n    justify-content: center;\n    background: #3B82F6 !important;\n    color: #fff !important;\n    border: none !important;\n    border-radius: 10px !important;\n    padding: 12px 28px !important;\n    font-family: var(--smcm-font-b);\n    font-size: 14px;\n    font-weight: 600;\n    text-decoration: none !important;\n    cursor: pointer;\n    box-shadow: 0 8px 20px rgba(0,0,0,0.18) !important;\n    transition: transform 0.15s ease, box-shadow 0.15s ease;\n  }\n  .smcm-tour-s14-btn:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 10px 24px rgba(0,0,0,0.22) !important;\n    color: #fff !important;\n  }\n\n  .smcm-tour-footer {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 20px 14px;\n    border-top: 1px solid #E7ECF5;\n    background: #fff;\n  }\n  .smcm-tour-nav {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n  }\n  .smcm-tour-nav-btn {\n    width: 36px !important;\n    height: 36px !important;\n    min-width: 36px !important;\n    max-width: 36px !important;\n    flex: 0 0 36px !important;\n    border-radius: 50% !important;\n    border: 1.5px solid #D8E0EE !important;\n    background: #fff !important;\n    color: #1A56C4 !important;\n    font-size: 16px !important;\n    line-height: 1 !important;\n    padding: 0 !important;\n    margin: 0 !important;\n    cursor: pointer;\n    display: inline-flex !important;\n    align-items: center !important;\n    justify-content: center !important;\n    transition: background 0.15s, border-color 0.15s;\n    box-sizing: border-box !important;\n  }\n  .smcm-tour-nav-btn:hover:not(:disabled) {\n    background: #E8F0FE !important;\n    border-color: #1A56C4 !important;\n  }\n  .smcm-tour-nav-btn:disabled {\n    opacity: 0.35;\n    cursor: default;\n  }\n  .smcm-tour-counter {\n    font-family: var(--smcm-font-b);\n    font-size: 13px;\n    font-weight: 600;\n    color: #6B7A99;\n    min-width: 48px;\n    text-align: center;\n  }\n\n  \/* \u2500\u2500 Slide 13: Close Change Request + SUBMIT hotspot \u2500\u2500 *\/\n  .smcm-tour-slide13 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F5F7FB;\n    display: flex;\n    flex-direction: column;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s13-body {\n    display: flex;\n    flex: 1;\n    min-height: 0;\n  }\n  \/* CLOSE CHANGE REQUEST floats beneath the action buttons.\n     The header keeps its normal height, so the callout overlays the content below\n     instead of pushing the workflow\/content downward. *\/\n  .smcm-tour-slide13 .smcm-tour-shell-wizard-top {\n    position: relative;\n    overflow: visible;\n  }\n  .smcm-tour-s13-content {\n    flex: 1;\n    min-width: 0;\n    padding: 6px 18px 18px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n  }\n  .smcm-tour-s13-blur {\n    height: 60px;\n    border-radius: 12px;\n    background: linear-gradient(180deg, #E8EEF7 0%, #F5F7FB 100%);\n    filter: blur(5px);\n    opacity: 0.6;\n    margin-bottom: 10px;\n    pointer-events: none;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s13-callout-wrap {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n    gap: 8px;\n    margin: 0;\n    width: min(300px, calc(100% - 32px));\n    max-width: 300px;\n    flex-shrink: 0;\n    position: absolute;\n    top: calc(100% + 14px);\n    right: 16px;\n    z-index: 50;\n    pointer-events: none;\n  }\n  .smcm-tour-s13-callout {\n    width: 100%;\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 14px;\n    padding: 14px 16px;\n    box-shadow: 0 20px 48px rgba(11, 30, 80, 0.34);\n    position: relative;\n    z-index: 51;\n    pointer-events: none;\n  }\n  .smcm-tour-s13-callout h4 {\n    margin: 0 0 6px;\n    font-family: var(--smcm-font-h);\n    font-size: 13px;\n    font-weight: 700;\n    color: #fff;\n  }\n  .smcm-tour-s13-callout p {\n    margin: 0;\n    font-size: 12px;\n    line-height: 1.5;\n    color: rgba(255,255,255,0.92);\n  }\n  \n\n  .smcm-tour-s13-submit {\n    background: #F5A623 !important;\n    color: #fff !important;\n    border: none !important;\n    border-radius: 8px !important;\n    padding: 10px 18px !important;\n    font-family: var(--smcm-font-b);\n    font-size: 12px;\n    font-weight: 700;\n    letter-spacing: 0.3px;\n    cursor: pointer;\n    position: relative;\n    z-index: 5;\n  }\n  .smcm-tour-s13-submit.smcm-tour-hotspot::after {\n    inset: -6px;\n    border-radius: 12px;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n\n  \/* \u2500\u2500 Slide 12: CA-PA Status + circle hotspot \u2500\u2500 *\/\n  .smcm-tour-slide12 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F5F7FB;\n    display: flex;\n    flex-direction: column;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s12-body {\n    display: flex;\n    flex: 1;\n    min-height: 0;\n  }\n  .smcm-tour-s12-content {\n    flex: 1;\n    min-width: 0;\n    padding: 14px 18px 18px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n  .smcm-tour-s12-blur {\n    height: 90px;\n    border-radius: 12px;\n    background: linear-gradient(180deg, #E8EEF7, #F5F7FB);\n    filter: blur(4px);\n    opacity: 0.55;\n    pointer-events: none;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s12-panel {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    padding: 14px 16px 16px;\n    position: relative;\n    z-index: 2;\n    animation: smcm-tour-panel-glow 1.8s ease-out infinite;\n  }\n  .smcm-tour-s12-panel-title {\n    font-size: 12px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.3px;\n    margin: 0 0 12px;\n  }\n  .smcm-tour-s12-table {\n    width: 100%;\n    border-collapse: collapse;\n    font-size: 12.5px;\n  }\n  .smcm-tour-s12-table th {\n    text-align: left;\n    font-size: 11px;\n    font-weight: 600;\n    color: #8A97B0;\n    padding: 10px 12px;\n    background: #F8FAFD;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-s12-table td {\n    padding: 12px;\n    border-bottom: 1px solid #F0F3F8;\n    color: #1A2B4A;\n    vertical-align: middle;\n  }\n  .smcm-tour-s12-select {\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    min-width: 100px;\n    height: 32px;\n    padding: 0 12px;\n    border: 1px solid #D8E0EE;\n    border-radius: 8px;\n    background: #fff;\n    font-size: 12px;\n    font-weight: 600;\n    color: #1A2B4A;\n    font-family: inherit;\n    cursor: default;\n  }\n  .smcm-tour-s12-select::after {\n    content: '\u25be';\n    font-size: 10px;\n    color: #8A97B0;\n  }\n  .smcm-tour-s12-hotspot-wrap {\n    display: flex;\n    justify-content: flex-end;\n    padding-right: 4px;\n  }\n  .smcm-tour-s12-hotspot-btn {\n    position: relative;\n    width: 36px !important;\n    height: 36px !important;\n    min-width: 36px !important;\n    border-radius: 50% !important;\n    border: 2px solid #3B82F6 !important;\n    background: rgba(255,255,255,0.95) !important;\n    cursor: pointer;\n    z-index: 4;\n    padding: 0 !important;\n    margin: 0 !important;\n  }\n  .smcm-tour-s12-hotspot-btn.smcm-tour-hotspot::after {\n    inset: -8px;\n    border-radius: 50%;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n\n  \/* \u2500\u2500 Slide 11: Effectiveness Review \/ Validation + hotspot \u2500\u2500 *\/\n  .smcm-tour-slide11 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F5F7FB;\n    display: flex;\n    flex-direction: column;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s11-body {\n    display: flex;\n    flex: 1;\n    min-height: 0;\n  }\n  .smcm-tour-s11-content {\n    flex: 1;\n    min-width: 0;\n    padding: 14px 18px 18px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n  }\n  .smcm-tour-s11-panel {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    padding: 14px 16px 16px;\n    position: relative;\n    z-index: 2;\n    animation: smcm-tour-panel-glow 1.8s ease-out infinite;\n  }\n  .smcm-tour-s11-panel-title {\n    font-size: 12px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.3px;\n    margin: 0 0 14px;\n  }\n  .smcm-tour-s11-block {\n    display: flex;\n    gap: 12px;\n    margin-bottom: 16px;\n    padding-bottom: 16px;\n    border-bottom: 1px dashed #D8E0EE;\n  }\n  .smcm-tour-s11-block:last-of-type {\n    border-bottom: none;\n    margin-bottom: 0;\n    padding-bottom: 0;\n  }\n  .smcm-tour-s11-label {\n    writing-mode: vertical-rl;\n    transform: rotate(180deg);\n    font-size: 10px;\n    font-weight: 700;\n    letter-spacing: 0.5px;\n    color: #8A97B0;\n    background: #F0F4FA;\n    padding: 8px 4px;\n    border-radius: 6px;\n    text-align: center;\n  }\n  .smcm-tour-s11-block-body {\n    flex: 1;\n    min-width: 0;\n  }\n  .smcm-tour-s11-q {\n    font-size: 13px;\n    font-weight: 600;\n    color: #1A2B4A;\n    margin: 0 0 6px;\n  }\n  .smcm-tour-s11-text {\n    font-size: 12px;\n    color: #6B7A99;\n    line-height: 1.5;\n  }\n  .smcm-tour-s11-row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 12px;\n    margin-bottom: 10px;\n    flex-wrap: wrap;\n  }\n  .smcm-tour-s11-badge-no {\n    background: #FFECEC;\n    color: #C62828;\n    font-size: 12px;\n    font-weight: 700;\n    padding: 4px 12px;\n    border-radius: 6px;\n  }\n  .smcm-tour-s11-blur {\n    margin-top: 14px;\n    height: 48px;\n    border-radius: 10px;\n    background: #E8EEF7;\n    filter: blur(3px);\n    opacity: 0.55;\n    pointer-events: none;\n  }\n  .smcm-tour-s11-callout-wrap {\n    position: relative;\n    align-self: flex-end;\n    margin-top: 14px;\n    width: min(300px, 48%);\n    max-width: 340px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n  }\n  .smcm-tour-s11-callout {\n    position: relative;\n    width: 100%;\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 14px;\n    padding: 14px 16px;\n    z-index: 3;\n    box-shadow: 0 16px 40px rgba(11, 30, 80, 0.28);\n    pointer-events: none;\n  }\n  .smcm-tour-s11-callout h4 {\n    margin: 0 0 6px;\n    font-family: var(--smcm-font-h);\n    font-size: clamp(12px, 0.95vw, 14px);\n    font-weight: 700;\n    color: #fff;\n  }\n  .smcm-tour-s11-callout p {\n    margin: 0;\n    font-size: clamp(11px, 0.9vw, 13px);\n    line-height: 1.5;\n    color: rgba(255,255,255,0.92);\n  }\n  .smcm-tour-s11-hotspot-btn {\n    position: relative;\n    width: 36px !important;\n    height: 36px !important;\n    min-width: 36px !important;\n    border-radius: 50% !important;\n    border: 2px solid #3B82F6 !important;\n    background: rgba(255,255,255,0.95) !important;\n    cursor: pointer;\n    z-index: 4;\n    padding: 0 !important;\n    margin: 0 !important;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s11-hotspot-btn.smcm-tour-hotspot::after {\n    inset: -8px;\n    border-radius: 50%;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n\n  \n\n\n  \/* \u2500\u2500 Slide 10: Smart Docs Review list + row hotspot \u2500\u2500 *\/\n  .smcm-tour-slide10 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #EEF2F8;\n    display: flex;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s10-sidebar {\n    width: 200px;\n    flex-shrink: 0;\n    background: #1A56C4;\n    color: #fff;\n    display: flex;\n    flex-direction: column;\n    padding: 12px 0;\n  }\n  .smcm-tour-s10-nav-item {\n    padding: 9px 16px;\n    font-size: 12.5px;\n    font-weight: 500;\n    color: rgba(255,255,255,0.85);\n  }\n  .smcm-tour-s10-nav-item.smcm-tour-s10-active {\n    background: #0F3F9E;\n    color: #7CFFB2;\n    font-weight: 600;\n    position: relative;\n  }\n  .smcm-tour-s10-nav-item.smcm-tour-s10-active::before {\n    content: '';\n    position: absolute;\n    left: 0; top: 6px; bottom: 6px;\n    width: 3px;\n    background: #7CFFB2;\n    border-radius: 0 2px 2px 0;\n  }\n  .smcm-tour-s10-nav-sub {\n    padding: 7px 16px 7px 28px;\n    font-size: 12px;\n    color: rgba(255,255,255,0.75);\n  }\n  .smcm-tour-s10-nav-sub.smcm-tour-s10-active {\n    background: #0F3F9E;\n    color: #7CFFB2;\n    font-weight: 600;\n  }\n  .smcm-tour-s10-main {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    background: #F5F7FB;\n  }\n  .smcm-tour-s10-topbar {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 16px;\n    background: #fff;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-s10-top-title {\n    font-size: 13px;\n    font-weight: 700;\n    color: #1A56C4;\n  }\n  .smcm-tour-s10-body {\n    padding: 14px 18px;\n    flex: 1;\n  }\n  .smcm-tour-s10-page-title {\n    font-size: 18px;\n    font-weight: 700;\n    color: #1A3A6E;\n    margin: 0 0 4px;\n  }\n  .smcm-tour-s10-crumb {\n    font-size: 11px;\n    color: #8A97B0;\n    margin-bottom: 12px;\n  }\n  .smcm-tour-s10-search {\n    height: 34px;\n    border: 1px solid #D8E0EE;\n    border-radius: 8px;\n    background: #fff;\n    margin-bottom: 10px;\n    padding: 0 12px;\n    font-size: 12px;\n    color: #8A97B0;\n    display: flex;\n    align-items: center;\n  }\n  .smcm-tour-s10-tabs {\n    display: flex;\n    gap: 4px;\n    margin-bottom: 10px;\n  }\n  .smcm-tour-s10-tab {\n    padding: 7px 12px;\n    font-size: 11px;\n    font-weight: 600;\n    color: #8A97B0;\n  }\n  .smcm-tour-s10-tab-active {\n    color: #1A56C4;\n    border: 1.5px solid #1A56C4;\n    border-radius: 8px;\n  }\n  .smcm-tour-s10-table {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    overflow: hidden;\n  }\n  .smcm-tour-s10-thead,\n  .smcm-tour-s10-row {\n    display: grid;\n    grid-template-columns: 28px minmax(0, 1.4fr) minmax(0, 0.5fr) minmax(0, 0.5fr) minmax(0, 0.7fr) minmax(0, 0.9fr) minmax(0, 0.8fr) minmax(0, 0.9fr) minmax(0, 0.9fr);\n    gap: 6px;\n    align-items: center;\n    padding: 11px 12px;\n    font-size: 11.5px;\n  }\n  .smcm-tour-s10-thead {\n    background: #F8FAFD;\n    color: #8A97B0;\n    font-weight: 600;\n    font-size: 10.5px;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-s10-row-active {\n    background: #F0F7FF !important;\n    border: none !important;\n    width: 100%;\n    text-align: left;\n    font-family: inherit;\n    color: #1A2B4A;\n    cursor: pointer;\n    position: relative;\n    z-index: 2;\n    padding: 11px 12px !important;\n  }\n  .smcm-tour-s10-row-active.smcm-tour-hotspot::after {\n    inset: 2px 4px;\n    border-radius: 10px;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.5);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n  .smcm-tour-s10-check {\n    width: 14px; height: 14px;\n    border-radius: 50%;\n    border: 2px solid #3B82F6;\n    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);\n    background: #fff;\n  }\n  .smcm-tour-s10-blur {\n    filter: blur(2.5px);\n    opacity: 0.4;\n    pointer-events: none;\n  }\n  .smcm-tour-s10-blur .smcm-tour-s10-row span {\n    display: inline-block;\n    height: 10px;\n    width: 70%;\n    border-radius: 4px;\n    background: #E8EEF7;\n  }\n\n  @media (max-width: 900px) {\n    .smcm-tour-s10-sidebar { width: 56px; }\n    .smcm-tour-s10-nav-item, .smcm-tour-s10-nav-sub { font-size: 0; padding: 12px; }\n    .smcm-tour-s10-thead, .smcm-tour-s10-row {\n      grid-template-columns: 24px minmax(0, 1.4fr) minmax(0, 0.6fr) minmax(0, 0.8fr) minmax(0, 0.9fr);\n    }\n    .smcm-tour-s10-thead span:nth-child(n+6),\n    .smcm-tour-s10-row span:nth-child(n+6) { display: none; }\n  }\n\n  \/* \u2500\u2500 Slide 9: Implementation \/ Acknowledgement + hotspot \u2500\u2500 *\/\n  .smcm-tour-slide9 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F5F7FB;\n    display: flex;\n    flex-direction: column;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s9-body {\n    display: flex;\n    flex: 1;\n    min-height: 0;\n  }\n  .smcm-tour-s9-content {\n    flex: 1;\n    min-width: 0;\n    padding: 14px 18px 18px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n  }\n  .smcm-tour-s9-blur-top {\n    height: 40px;\n    border-radius: 10px;\n    background: linear-gradient(90deg, #E8EEF7, #F0F4FA 40%, #E8EEF7);\n    filter: blur(4px);\n    opacity: 0.5;\n    margin-bottom: 10px;\n    pointer-events: none;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s9-callout-wrap {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n    margin: 0 auto 12px;\n    width: 100%;\n    max-width: 360px;\n    flex-shrink: 0;\n    position: relative;\n    z-index: 3;\n  }\n  .smcm-tour-s9-callout {\n    width: 100%;\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 14px;\n    padding: 14px 16px;\n    box-shadow: 0 16px 40px rgba(11, 30, 80, 0.28);\n    pointer-events: none;\n  }\n  .smcm-tour-s9-callout h4 {\n    margin: 0 0 6px;\n    font-family: var(--smcm-font-h);\n    font-size: 13px;\n    font-weight: 700;\n    color: #fff;\n  }\n  .smcm-tour-s9-callout p {\n    margin: 0;\n    font-size: 12px;\n    line-height: 1.5;\n    color: rgba(255,255,255,0.92);\n  }\n  .smcm-tour-s9-hotspot-btn {\n    position: relative;\n    width: 34px !important;\n    height: 34px !important;\n    min-width: 34px !important;\n    border-radius: 50% !important;\n    border: 2px solid #3B82F6 !important;\n    background: rgba(255,255,255,0.95) !important;\n    cursor: pointer;\n    z-index: 4;\n    padding: 0 !important;\n    margin: 0 !important;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s9-hotspot-btn.smcm-tour-hotspot::after {\n    inset: -8px;\n    border-radius: 50%;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n  .smcm-tour-s9-panel {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    padding: 14px 16px 16px;\n    margin-top: 0;\n    position: relative;\n    z-index: 2;\n    animation: smcm-tour-panel-glow 1.8s ease-out infinite;\n  }\n  .smcm-tour-s9-panel-title {\n    font-size: 12px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.3px;\n    margin: 0 0 12px;\n    padding: 8px 12px;\n    background: #E8F0FE;\n    border-radius: 8px;\n  }\n  .smcm-tour-s9-row3 {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);\n    gap: 12px;\n    margin-bottom: 14px;\n  }\n  .smcm-tour-s9-field label {\n    display: block;\n    font-size: 10px;\n    color: #8A97B0;\n    margin-bottom: 4px;\n  }\n  .smcm-tour-s9-input {\n    height: 34px;\n    border: 1px solid #D8E0EE;\n    border-radius: 8px;\n    background: #fff;\n    padding: 0 12px;\n    font-size: 12.5px;\n    color: #1A2B4A;\n    font-weight: 500;\n    display: flex;\n    align-items: center;\n  }\n  .smcm-tour-s9-tabs {\n    display: flex;\n    gap: 8px;\n    margin-bottom: 12px;\n    align-items: center;\n  }\n  .smcm-tour-s9-tab {\n    font-size: 12px;\n    font-weight: 600;\n    color: #8A97B0;\n    padding: 6px 12px;\n  }\n  .smcm-tour-s9-tab-active {\n    color: #1A56C4;\n    border: 1.5px solid #1A56C4;\n    border-radius: 8px;\n  }\n  .smcm-tour-s9-setting {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    background: #F8FAFD;\n    border-radius: 8px;\n    padding: 10px 12px;\n    margin-bottom: 8px;\n    font-size: 12.5px;\n    color: #1A2B4A;\n    font-weight: 600;\n  }\n  .smcm-tour-s9-toggle {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    color: #1A56C4;\n    font-size: 12px;\n    font-weight: 600;\n  }\n  .smcm-tour-s9-toggle-dot {\n    width: 36px;\n    height: 20px;\n    border-radius: 999px;\n    background: #1A56C4;\n    position: relative;\n  }\n  .smcm-tour-s9-toggle-dot::after {\n    content: '';\n    position: absolute;\n    right: 3px;\n    top: 3px;\n    width: 14px;\n    height: 14px;\n    border-radius: 50%;\n    background: #fff;\n  }\n  .smcm-tour-s9-hint {\n    font-size: 12px;\n    color: #6B7A99;\n    margin: 8px 0 12px;\n  }\n\n  \n\n\n  \/* \u2500\u2500 Slide 8: Task Details \/ Action Plan + hotspot \u2500\u2500 *\/\n  .smcm-tour-slide8 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F5F7FB;\n    display: flex;\n    flex-direction: column;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s8-body {\n    display: flex;\n    flex: 1;\n    min-height: 0;\n  }\n  .smcm-tour-s8-content {\n    flex: 1;\n    min-width: 0;\n    padding: 14px 18px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n  .smcm-tour-s8-panel {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    padding: 14px 16px 16px;\n  }\n  \/* Task Details header. ACTION PLAN & APPROVAL is placed after Review Comments. *\/\n  .smcm-tour-s8-panel-head {\n    display: flex;\n    align-items: flex-start;\n    justify-content: flex-start;\n    gap: 18px;\n    margin: 0 0 12px;\n  }\n  .smcm-tour-s8-panel-title {\n    font-size: 12px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.3px;\n    margin: 0;\n    flex: 0 0 auto;\n  }\n  .smcm-tour-s8-field {\n    margin-bottom: 10px;\n  }\n  .smcm-tour-s8-field label {\n    display: block;\n    font-size: 10px;\n    color: #8A97B0;\n    margin-bottom: 4px;\n  }\n  .smcm-tour-s8-input {\n    height: 34px;\n    border: 1px solid #D8E0EE;\n    border-radius: 8px;\n    background: #fff;\n    padding: 0 12px;\n    font-size: 12.5px;\n    color: #1A2B4A;\n    font-weight: 500;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .smcm-tour-s8-input::after {\n    content: '\u25be';\n    font-size: 10px;\n    color: #8A97B0;\n  }\n  .smcm-tour-s8-row3 {\n    display: grid;\n    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 0.8fr);\n    gap: 12px;\n  }\n  .smcm-tour-s8-comments {\n    height: 36px;\n    border: 1px solid #E6EBF4;\n    border-radius: 8px;\n    background: #F8FAFD;\n  }\n  .smcm-tour-s8-callout-wrap {\n    display: flex;\n    flex-direction: column;\n    align-items: stretch;\n    gap: 8px;\n    margin: 24px 0 0;\n    width: min(360px, 100%);\n    max-width: 360px;\n    flex: 0 1 360px;\n    position: relative;\n    z-index: 3;\n  }\n  .smcm-tour-s8-callout {\n    width: 100%;\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 14px;\n    padding: 14px 16px;\n    box-shadow: 0 16px 40px rgba(11, 30, 80, 0.28);\n    pointer-events: none;\n  }\n  .smcm-tour-s8-callout h4 {\n    margin: 0 0 6px;\n    font-family: var(--smcm-font-h);\n    font-size: 13px;\n    font-weight: 700;\n    color: #fff;\n  }\n  .smcm-tour-s8-callout p {\n    margin: 0;\n    font-size: 12px;\n    line-height: 1.5;\n    color: rgba(255,255,255,0.92);\n  }\n  .smcm-tour-s8-nav-hotspot {\n    position: relative;\n  }\n  .smcm-tour-s8-nav-hotspot.smcm-tour-hotspot::after {\n    inset: -4px -4px -4px 0;\n    border-radius: 0 10px 10px 0;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.5);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n  .smcm-tour-s8-nav-btn {\n    display: block !important;\n    width: 100%;\n    text-align: left;\n    border: none !important;\n    background: #1A56C4 !important;\n    color: #fff !important;\n    font-weight: 600;\n    font-size: 11.5px;\n    padding: 7px 14px 7px 18px !important;\n    border-radius: 0 6px 6px 0 !important;\n    margin-right: 8px;\n    cursor: pointer;\n    font-family: inherit;\n  }\n\n  \n\n\n  \/* \u2500\u2500 Slide 7: Risk Assessment + callout hotspot \u2500\u2500 *\/\n  .smcm-tour-slide7 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F5F7FB;\n    display: flex;\n    flex-direction: column;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s7-body {\n    display: flex;\n    flex: 1;\n    min-height: 0;\n  }\n  .smcm-tour-s7-content {\n    flex: 1;\n    min-width: 0;\n    padding: 14px 18px 18px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n  }\n  .smcm-tour-s7-page-title {\n    font-size: 15px;\n    font-weight: 700;\n    color: #1A56C4;\n    margin: 0 0 2px;\n  }\n  .smcm-tour-s7-crumb {\n    font-size: 11px;\n    color: #8A97B0;\n    margin-bottom: 10px;\n  }\n  .smcm-tour-s7-blur-top {\n    height: 40px;\n    border-radius: 10px;\n    background: linear-gradient(90deg, #E8EEF7, #F0F4FA 40%, #E8EEF7);\n    filter: blur(4px);\n    opacity: 0.55;\n    margin-bottom: 10px;\n    pointer-events: none;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s7-callout-wrap {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n    margin: 0 auto 12px;\n    width: 100%;\n    max-width: 360px;\n    flex-shrink: 0;\n    position: relative;\n    z-index: 3;\n  }\n  .smcm-tour-s7-callout {\n    width: 100%;\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 14px;\n    padding: 14px 16px;\n    box-shadow: 0 16px 40px rgba(11, 30, 80, 0.28);\n    pointer-events: none;\n  }\n  .smcm-tour-s7-callout h4 {\n    margin: 0 0 6px;\n    font-family: var(--smcm-font-h);\n    font-size: 13px;\n    font-weight: 700;\n    color: #fff;\n  }\n  .smcm-tour-s7-callout p {\n    margin: 0;\n    font-size: 12px;\n    line-height: 1.5;\n    color: rgba(255,255,255,0.92);\n  }\n  .smcm-tour-s7-hotspot-btn {\n    position: relative;\n    width: 34px !important;\n    height: 34px !important;\n    min-width: 34px !important;\n    border-radius: 50% !important;\n    border: 2px solid #3B82F6 !important;\n    background: rgba(255,255,255,0.95) !important;\n    cursor: pointer;\n    z-index: 4;\n    padding: 0 !important;\n    margin: 0 !important;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s7-hotspot-btn.smcm-tour-hotspot::after {\n    inset: -8px;\n    border-radius: 50%;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n  .smcm-tour-s7-panel {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    padding: 14px 16px 16px;\n    margin-top: 0;\n    position: relative;\n    z-index: 2;\n    animation: smcm-tour-panel-glow 1.8s ease-out infinite;\n  }\n  @keyframes smcm-tour-panel-glow {\n    0%   { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.35), 0 0 0 0 rgba(59, 130, 246, 0.15); }\n    60%  { box-shadow: 0 0 0 6px rgba(59, 130, 246, 0), 0 0 0 14px rgba(59, 130, 246, 0); }\n    100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0), 0 0 0 0 rgba(59, 130, 246, 0); }\n  }\n  .smcm-tour-s7-panel-title {\n    font-size: 12px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.3px;\n    margin: 0 0 14px;\n    padding: 8px 12px;\n    background: #E8F0FE;\n    border-radius: 8px;\n  }\n  .smcm-tour-s7-qa {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n  }\n  .smcm-tour-s7-row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 16px;\n  }\n  .smcm-tour-s7-q {\n    flex: 1;\n    font-size: 12.5px;\n    color: #1A2B4A;\n    line-height: 1.4;\n  }\n  .smcm-tour-s7-select {\n    min-width: 72px;\n    height: 32px;\n    border: 1px solid #D8E0EE;\n    border-radius: 8px;\n    background: #fff;\n    padding: 0 10px;\n    font-size: 12px;\n    color: #1A2B4A;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s7-select::after {\n    content: '\u25be';\n    font-size: 10px;\n    color: #8A97B0;\n  }\n  .smcm-tour-s7-insight {\n    margin-top: 12px;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 12px;\n    background: #FFECEC;\n    border-radius: 8px;\n    padding: 10px 14px;\n    flex-wrap: wrap;\n  }\n  .smcm-tour-s7-insight-text {\n    font-size: 12.5px;\n    color: #C62828;\n    font-weight: 600;\n  }\n  .smcm-tour-s7-level {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 12px;\n    color: #1A2B4A;\n  }\n  .smcm-tour-s7-level-badge {\n    border: 1.5px solid #C62828;\n    color: #C62828;\n    font-weight: 700;\n    border-radius: 6px;\n    padding: 4px 10px;\n    font-size: 12px;\n  }\n\n  \n\n\n  \/* \u2500\u2500 Slide 6: Impact Assessment + callout hotspot \u2500\u2500 *\/\n  .smcm-tour-slide6 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F5F7FB;\n    display: flex;\n    flex-direction: column;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-shell-wizard-top {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 16px;\n    background: #fff;\n    border-bottom: 1px solid #E6EBF4;\n    gap: 12px;\n  }\n  .smcm-tour-shell-wizard-top-title {\n    font-size: 14px;\n    font-weight: 700;\n    color: #1A56C4;\n  }\n  .smcm-tour-shell-wizard-top-actions {\n    display: flex;\n    gap: 8px;\n  }\n  .smcm-tour-shell-wizard-btn {\n    border-radius: 8px !important;\n    padding: 8px 14px !important;\n    font-size: 11px;\n    font-weight: 700;\n    letter-spacing: 0.3px;\n    font-family: inherit;\n    cursor: default;\n    border: 1.5px solid transparent !important;\n  }\n  .smcm-tour-shell-wizard-btn-outline {\n    background: #fff !important;\n    color: #F5A623 !important;\n    border-color: #F5A623 !important;\n  }\n  .smcm-tour-shell-wizard-btn-solid {\n    background: #F5A623 !important;\n    color: #fff !important;\n  }\n  .smcm-tour-shell-wizard-steps {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 16px;\n    background: #fff;\n    border-bottom: 1px solid #E6EBF4;\n    flex-wrap: wrap;\n    font-size: 11px;\n  }\n  .smcm-tour-shell-wizard-step {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    color: #8A97B0;\n    font-weight: 500;\n  }\n  .smcm-tour-shell-wizard-step.smcm-tour-shell-wizard-done { color: #22A06B; font-weight: 600; }\n  .smcm-tour-shell-wizard-step.smcm-tour-shell-wizard-current {\n    color: #1A56C4;\n    font-weight: 700;\n    background: #E8F0FE;\n    padding: 4px 10px;\n    border-radius: 8px;\n  }\n  .smcm-tour-shell-wizard-step-line {\n    width: 24px;\n    height: 1px;\n    border-top: 1px dashed #C5D0E0;\n  }\n  .smcm-tour-s6-body {\n    display: flex;\n    flex: 1;\n    min-height: 0;\n  }\n  .smcm-tour-shell-wizard-subnav {\n    width: 160px;\n    flex-shrink: 0;\n    background: #F0F4FA;\n    padding: 12px 0;\n    border-right: 1px solid #E6EBF4;\n  }\n  .smcm-tour-shell-wizard-subnav-group {\n    font-size: 11px;\n    font-weight: 700;\n    color: #1A2B4A;\n    padding: 8px 14px 6px;\n  }\n  .smcm-tour-shell-wizard-subnav-item {\n    font-size: 11.5px;\n    color: #6B7A99;\n    padding: 7px 14px 7px 18px;\n  }\n  .smcm-tour-shell-wizard-subnav-item.smcm-tour-shell-wizard-active {\n    background: #1A56C4;\n    color: #fff;\n    font-weight: 600;\n    border-radius: 0 6px 6px 0;\n    margin-right: 8px;\n  }\n  .smcm-tour-s6-content {\n    flex: 1;\n    min-width: 0;\n    padding: 14px 16px 16px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n  }\n  .smcm-tour-s6-panel {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    padding: 14px 16px;\n    position: relative;\n    z-index: 2;\n    animation: smcm-tour-panel-glow 1.8s ease-out infinite;\n  }\n  .smcm-tour-s6-panel-title {\n    font-size: 12px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.3px;\n    margin: 0 0 12px;\n  }\n  .smcm-tour-s6-table {\n    width: 100%;\n    border-collapse: collapse;\n    font-size: 12px;\n  }\n  .smcm-tour-s6-table th {\n    text-align: left;\n    font-size: 11px;\n    font-weight: 600;\n    color: #8A97B0;\n    padding: 8px 10px;\n    background: #F8FAFD;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-s6-table td {\n    padding: 10px;\n    border-bottom: 1px solid #F0F3F8;\n    color: #1A2B4A;\n    vertical-align: top;\n  }\n  .smcm-tour-s6-table tr.smcm-tour-s6-req {\n    background: #FFF5F5;\n  }\n  .smcm-tour-s6-callout-wrap {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n    margin: 0 auto 12px;\n    width: 100%;\n    max-width: 360px;\n    flex-shrink: 0;\n    position: relative;\n    z-index: 3;\n  }\n  .smcm-tour-s6-callout {\n    width: 100%;\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 14px;\n    padding: 14px 16px;\n    box-shadow: 0 16px 40px rgba(11, 30, 80, 0.28);\n    pointer-events: none;\n  }\n  .smcm-tour-s6-callout h4 {\n    margin: 0 0 6px;\n    font-family: var(--smcm-font-h);\n    font-size: 12.5px;\n    font-weight: 700;\n    color: #fff;\n  }\n  .smcm-tour-s6-callout p {\n    margin: 0;\n    font-size: 11.5px;\n    line-height: 1.5;\n    color: rgba(255,255,255,0.92);\n  }\n  .smcm-tour-s6-hotspot-btn {\n    position: relative;\n    width: 34px !important;\n    height: 34px !important;\n    min-width: 34px !important;\n    border-radius: 50% !important;\n    border: 2px solid #3B82F6 !important;\n    background: rgba(255,255,255,0.95) !important;\n    cursor: pointer;\n    z-index: 4;\n    padding: 0 !important;\n    margin: 0 !important;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s6-hotspot-btn.smcm-tour-hotspot::after {\n    inset: -8px;\n    border-radius: 50%;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n\n  \n\n  \n\n\n  \/* \u2500\u2500 Slide 5: In Progress list + row hotspot \u2500\u2500 *\/\n  .smcm-tour-slide5 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #EEF2F8;\n    display: flex;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s5-main {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    background: #F5F7FB;\n  }\n  .smcm-tour-s5-body {\n    padding: 14px 18px 16px;\n    flex: 1;\n    position: relative;\n  }\n  .smcm-tour-s5-page-head {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    margin-bottom: 12px;\n  }\n  .smcm-tour-s5-page-title {\n    font-size: 18px;\n    font-weight: 700;\n    color: #1A3A6E;\n    margin: 0 0 4px;\n  }\n  .smcm-tour-s5-crumb {\n    font-size: 11px;\n    color: #8A97B0;\n  }\n  .smcm-tour-s5-create {\n    background: #F5A623 !important;\n    color: #fff !important;\n    border: none !important;\n    border-radius: 8px !important;\n    padding: 10px 16px !important;\n    font-size: 12px;\n    font-weight: 700;\n    letter-spacing: 0.3px;\n    cursor: default;\n  }\n  .smcm-tour-s5-search {\n    width: 100%;\n    max-width: 420px;\n    height: 34px;\n    border: 1px solid #D8E0EE;\n    border-radius: 8px;\n    background: #fff;\n    margin-bottom: 12px;\n    padding: 0 12px;\n    font-size: 12px;\n    color: #8A97B0;\n    box-sizing: border-box;\n  }\n  .smcm-tour-s5-tabs {\n    display: flex;\n    gap: 4px;\n    margin-bottom: 10px;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-s5-tab {\n    padding: 8px 14px;\n    font-size: 11px;\n    font-weight: 600;\n    color: #8A97B0;\n    letter-spacing: 0.3px;\n    position: relative;\n  }\n  .smcm-tour-s5-tab.smcm-tour-s5-tab-active {\n    color: #1A56C4;\n  }\n  .smcm-tour-s5-tab.smcm-tour-s5-tab-active::after {\n    content: '';\n    position: absolute;\n    left: 10px; right: 10px; bottom: -1px;\n    height: 2px;\n    background: #1A56C4;\n    border-radius: 2px;\n  }\n  .smcm-tour-s5-table {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    overflow: hidden;\n  }\n  .smcm-tour-s5-thead,\n  .smcm-tour-s5-row {\n    display: grid;\n    grid-template-columns: 28px minmax(0, 1.6fr) minmax(0, 0.8fr) minmax(0, 0.7fr) minmax(0, 0.7fr) minmax(0, 0.7fr) minmax(0, 0.85fr) minmax(0, 0.6fr) minmax(0, 0.85fr);\n    gap: 6px;\n    align-items: center;\n    padding: 11px 12px;\n    font-size: 11.5px;\n  }\n  .smcm-tour-s5-thead {\n    background: #F8FAFD;\n    color: #8A97B0;\n    font-weight: 600;\n    font-size: 10.5px;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-s5-row {\n    border-bottom: 1px solid #F0F3F8;\n    color: #1A2B4A;\n    background: #fff;\n  }\n  .smcm-tour-s5-row-active {\n    position: relative;\n    z-index: 2;\n    cursor: pointer;\n    background: #F8FBFF !important;\n    border: none !important;\n    width: 100%;\n    text-align: left;\n    font-family: inherit;\n    padding: 11px 12px !important;\n  }\n  .smcm-tour-s5-row-active.smcm-tour-hotspot::after {\n    inset: 2px 4px;\n    border-radius: 10px;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.5);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n  .smcm-tour-s5-check {\n    width: 14px; height: 14px;\n    border-radius: 50%;\n    border: 2px solid #3B82F6;\n    background: #fff;\n    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);\n  }\n  .smcm-tour-s5-status {\n    color: #F5A623;\n    font-weight: 600;\n  }\n  .smcm-tour-s5-blur-rows {\n    filter: blur(2.5px);\n    opacity: 0.45;\n    pointer-events: none;\n  }\n  .smcm-tour-s5-blur-rows .smcm-tour-s5-row span {\n    display: inline-block;\n    height: 10px;\n    border-radius: 4px;\n    background: #E8EEF7;\n    width: 70%;\n  }\n\n  @media (max-width: 900px) {\n    .smcm-tour-s5-thead,\n    .smcm-tour-s5-row {\n      grid-template-columns: 24px minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 0.8fr) minmax(0, 0.8fr);\n    }\n    .smcm-tour-s5-thead span:nth-child(n+6),\n    .smcm-tour-s5-row span:nth-child(n+6) { display: none; }\n  }\n\n  \/* \u2500\u2500 Slide 4: Change initiation detail + SUBMIT hotspot \u2500\u2500 *\/\n  .smcm-tour-slide4 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #EEF2F8;\n    display: flex;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-s4-main {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    background: #F5F7FB;\n  }\n  .smcm-tour-s4-body {\n    padding: 10px 16px 14px;\n    flex: 1;\n    overflow: hidden;\n    position: relative;\n  }\n  .smcm-tour-s4-page-head {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    gap: 12px;\n    margin-bottom: 8px;\n  }\n  .smcm-tour-s4-page-title {\n    font-size: clamp(15px, 1.35vw, 18px);\n    font-weight: 700;\n    color: #1A56C4;\n    margin: 0 0 4px;\n  }\n  .smcm-tour-s4-crumb {\n    font-size: 11px;\n    color: #8A97B0;\n  }\n  .smcm-tour-s4-actions {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s4-edit {\n    background: #fff !important;\n    color: #F5A623 !important;\n    border: 1.5px solid #F5A623 !important;\n    border-radius: 8px !important;\n    padding: 9px 16px !important;\n    font-family: var(--smcm-font-b);\n    font-size: 12px;\n    font-weight: 700;\n    letter-spacing: 0.3px;\n    cursor: default;\n  }\n  .smcm-tour-s4-submit {\n    background: #F5A623 !important;\n    color: #fff !important;\n    border: none !important;\n    border-radius: 8px !important;\n    padding: 10px 18px !important;\n    font-family: var(--smcm-font-b);\n    font-size: 12px;\n    font-weight: 700;\n    letter-spacing: 0.3px;\n    cursor: pointer;\n    box-shadow: 0 4px 14px rgba(245, 166, 35, 0.35) !important;\n  }\n  .smcm-tour-s4-submit.smcm-tour-hotspot::after {\n    inset: -6px;\n    border-radius: 12px;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n  .smcm-tour-s4-card {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    padding: 12px 16px 14px;\n  }\n  .smcm-tour-s4-card-title {\n    font-size: 12px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.4px;\n    margin: 0 0 10px;\n    text-transform: uppercase;\n  }\n  .smcm-tour-s4-grid {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 8px 20px;\n  }\n  .smcm-tour-s4-field label {\n    display: block;\n    font-size: 10px;\n    color: #8A97B0;\n    margin-bottom: 2px;\n    font-weight: 500;\n  }\n  .smcm-tour-s4-field div {\n    font-size: 12.5px;\n    font-weight: 600;\n    color: #1A2B4A;\n    line-height: 1.3;\n  }\n  .smcm-tour-s4-wide {\n    grid-column: 1 \/ 3;\n  }\n  .smcm-tour-s4-ref {\n    grid-column: 3;\n    grid-row: span 3;\n  }\n  .smcm-tour-s4-ref-img {\n    width: 100%;\n    height: 110px;\n    border-radius: 10px;\n    object-fit: cover;\n    background: linear-gradient(135deg, #B8C9E0 0%, #7A9CC0 50%, #4A6FA5 100%);\n    display: block;\n    margin-top: 4px;\n  }\n\n  \n\n  \n\n\n  \/* \u2500\u2500 Slide 3: Change Management list + CREATE hotspot + callout \u2500\u2500 *\/\n  .smcm-tour-slide3 {\n    position: relative;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #EEF2F8;\n    display: flex;\n    font-family: var(--smcm-font-b);\n  }\n  .smcm-tour-shell-sidebar {\n    width: 200px;\n    flex-shrink: 0;\n    background: #1A56C4;\n    color: #fff;\n    display: flex;\n    flex-direction: column;\n    padding: 0;\n  }\n  .smcm-tour-shell-side-brand {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 14px 14px 12px;\n    font-size: 12px;\n    font-weight: 600;\n    border-bottom: 1px solid rgba(255,255,255,0.12);\n  }\n  .smcm-tour-shell-side-brand span {\n    width: 18px; height: 18px; border-radius: 50%;\n    background: rgba(255,255,255,0.25);\n    flex-shrink: 0;\n  }\n  .smcm-tour-shell-nav {\n    display: flex;\n    flex-direction: column;\n    padding: 10px 0;\n    gap: 2px;\n    flex: 1;\n  }\n  .smcm-tour-shell-nav-item {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 10px 16px;\n    font-size: 12.5px;\n    font-weight: 500;\n    color: rgba(255,255,255,0.85);\n    position: relative;\n  }\n  .smcm-tour-shell-nav-item.smcm-tour-shell-nav-active {\n    background: #0F3F9E;\n    color: #fff;\n    font-weight: 600;\n  }\n  .smcm-tour-shell-nav-item.smcm-tour-shell-nav-active::before {\n    content: '';\n    position: absolute;\n    left: 0; top: 6px; bottom: 6px;\n    width: 3px;\n    border-radius: 0 2px 2px 0;\n    background: #7CFFB2;\n  }\n  .smcm-tour-shell-nav-ico {\n    width: 14px; height: 14px;\n    border-radius: 3px;\n    background: rgba(255,255,255,0.3);\n    flex-shrink: 0;\n  }\n  .smcm-tour-shell-side-foot {\n    padding: 10px 14px 12px;\n    font-size: 9px;\n    color: rgba(255,255,255,0.45);\n    line-height: 1.4;\n  }\n  .smcm-tour-s3-main {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    background: #F5F7FB;\n  }\n  .smcm-tour-shell-topbar {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 18px;\n    background: #fff;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-shell-top-title {\n    font-size: 13px;\n    font-weight: 700;\n    color: #1A56C4;\n    letter-spacing: 0.2px;\n  }\n  .smcm-tour-shell-top-right {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n  }\n  .smcm-tour-shell-top-icon {\n    width: 28px; height: 28px;\n    border-radius: 8px;\n    background: #F0F4FA;\n  }\n  .smcm-tour-shell-avatar {\n    width: 28px; height: 28px;\n    border-radius: 50%;\n    background: #D6E4FF;\n    color: #1A56C4;\n    font-size: 11px;\n    font-weight: 700;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .smcm-tour-s3-body {\n    padding: 16px 20px 20px;\n    flex: 1;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n  .smcm-tour-s3-page-head {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    gap: 12px;\n  }\n  .smcm-tour-s3-page-title {\n    font-size: 18px;\n    font-weight: 700;\n    color: #1A3A6E;\n    margin: 0 0 4px;\n  }\n  .smcm-tour-s3-crumb {\n    font-size: 11px;\n    color: #8A97B0;\n  }\n  .smcm-tour-s3-create-wrap {\n    position: relative;\n    flex-shrink: 0;\n  }\n  .smcm-tour-s3-create {\n    display: inline-flex !important;\n    align-items: center;\n    gap: 6px;\n    background: #F5A623 !important;\n    color: #fff !important;\n    border: none !important;\n    border-radius: 8px !important;\n    padding: 10px 18px !important;\n    font-family: var(--smcm-font-b);\n    font-size: 12.5px;\n    font-weight: 700;\n    letter-spacing: 0.4px;\n    cursor: pointer;\n    box-shadow: 0 4px 14px rgba(245, 166, 35, 0.35) !important;\n  }\n  .smcm-tour-s3-create.smcm-tour-hotspot::after {\n    inset: -6px;\n    border-radius: 12px;\n    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55);\n    animation: smcm-tour-pulse-strong 1.6s ease-out infinite;\n  }\n  @keyframes smcm-tour-pulse-strong {\n    0%   { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.55); }\n    70%  { box-shadow: 0 0 0 14px rgba(59, 130, 246, 0); }\n    100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }\n  }\n  .smcm-tour-s3-table-wrap {\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #E6EBF4;\n    overflow: hidden;\n    filter: blur(2.5px);\n    opacity: 0.55;\n    pointer-events: none;\n  }\n  .smcm-tour-s3-table-head {\n    display: grid;\n    grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.9fr) minmax(0, 0.7fr) minmax(0, 0.7fr) minmax(0, 0.9fr) minmax(0, 0.8fr) minmax(0, 0.6fr) minmax(0, 0.7fr);\n    gap: 8px;\n    padding: 12px 14px;\n    background: #F8FAFD;\n    font-size: 10px;\n    font-weight: 600;\n    color: #8A97B0;\n    border-bottom: 1px solid #E6EBF4;\n  }\n  .smcm-tour-s3-table-row {\n    display: grid;\n    grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.9fr) minmax(0, 0.7fr) minmax(0, 0.7fr) minmax(0, 0.9fr) minmax(0, 0.8fr) minmax(0, 0.6fr) minmax(0, 0.7fr);\n    gap: 8px;\n    padding: 14px;\n    border-bottom: 1px solid #F0F3F8;\n    font-size: 11px;\n    color: #4A5A78;\n  }\n  .smcm-tour-s3-table-row span {\n    height: 10px;\n    border-radius: 4px;\n    background: #E8EEF7;\n  }\n\n  .smcm-tour-s3-callout-wrap {\n    display: flex;\n    justify-content: flex-end;\n  }\n  .smcm-tour-s3-callout {\n    position: relative;\n    width: min(280px, 60%);\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 14px;\n    padding: 14px 16px;\n    z-index: 3;\n    box-shadow: 0 16px 40px rgba(11, 30, 80, 0.3);\n    pointer-events: none;\n  }\n  .smcm-tour-s3-callout h4 {\n    margin: 0 0 6px;\n    font-family: var(--smcm-font-h);\n    font-size: 13px;\n    font-weight: 700;\n    letter-spacing: 0.3px;\n    color: #fff;\n  }\n  .smcm-tour-s3-callout p {\n    margin: 0;\n    font-size: 12px;\n    line-height: 1.5;\n    color: rgba(255,255,255,0.9);\n    font-weight: 400;\n  }\n\n  \n\n  \n\n\n  \/* \u2500\u2500 Slide 2: blurred product shell + centered message modal \u2500\u2500 *\/\n  .smcm-tour-slide2 {\n    position: relative;\n    \/* Same reasoning as slide 14: both children are position:absolute,\n       so this needs a min-height floor to avoid collapsing to 0. *\/\n    min-height: clamp(320px, 32vw, 480px);\n    border-radius: 12px;\n    overflow: hidden;\n    background: #F4F7FC;\n  }\n  .smcm-tour-slide2-bg {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    filter: blur(5px);\n    opacity: 0.85;\n    transform: scale(1.04);\n    pointer-events: none;\n    user-select: none;\n  }\n  .smcm-tour-slide2-sidebar {\n    width: 22%;\n    min-width: 140px;\n    background: linear-gradient(180deg, #1B4FBF 0%, #163F9A 100%);\n    padding: 16px 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n  }\n  .smcm-tour-slide2-sidebar-item {\n    height: 12px;\n    border-radius: 6px;\n    background: rgba(255,255,255,0.18);\n  }\n  .smcm-tour-slide2-sidebar-item.smcm-tour-slide2-active {\n    background: rgba(255,255,255,0.35);\n    height: 28px;\n  }\n  .smcm-tour-slide2-main {\n    flex: 1;\n    padding: 16px 20px;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n    background: #F7F9FC;\n  }\n  .smcm-tour-slide2-topbar {\n    height: 36px;\n    border-radius: 8px;\n    background: #fff;\n    box-shadow: 0 1px 4px rgba(11,22,63,0.06);\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    padding: 0 12px;\n  }\n  .smcm-tour-slide2-pill {\n    width: 72px;\n    height: 22px;\n    border-radius: 999px;\n    background: #F5A623;\n  }\n  .smcm-tour-slide2-rows {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n  }\n  .smcm-tour-slide2-row {\n    height: 40px;\n    border-radius: 8px;\n    background: #fff;\n    box-shadow: 0 1px 3px rgba(11,22,63,0.05);\n  }\n\n  .smcm-tour-modal {\n    position: absolute;\n    left: 50%;\n    top: 50%;\n    transform: translate(-50%, -50%);\n    width: min(520px, 88%);\n    background: #0B3A8C;\n    color: #fff;\n    border-radius: 20px;\n    padding: clamp(24px, 3vw, 38px) clamp(22px, 2.6vw, 34px);\n    text-align: center;\n    box-shadow: 0 24px 60px rgba(11, 30, 80, 0.35);\n    z-index: 2;\n  }\n  .smcm-tour-modal-text {\n    font-family: var(--smcm-font-b);\n    font-size: clamp(14px, 1.35vw, 18px);\n    font-weight: 400;\n    line-height: 1.55;\n    color: rgba(255,255,255,0.95);\n    margin: 0 0 clamp(18px, 2vw, 24px);\n  }\n  .smcm-tour-modal-btn {\n    display: inline-flex !important;\n    align-items: center;\n    justify-content: center;\n    background: #3B82F6 !important;\n    color: #fff !important;\n    border: none !important;\n    border-radius: 10px !important;\n    padding: 12px 28px !important;\n    font-family: var(--smcm-font-b);\n    font-size: clamp(13px, 1.1vw, 15px);\n    font-weight: 600;\n    cursor: pointer;\n    box-shadow: 0 8px 20px rgba(0,0,0,0.18) !important;\n    transition: transform 0.15s ease, box-shadow 0.15s ease;\n  }\n  .smcm-tour-modal-btn:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 10px 24px rgba(0,0,0,0.22) !important;\n  }\n\n  \n\n\n  .smcm-tour-ui {\n    position: relative;\n    width: 100%;\n    min-height: 360px;\n    background: #F7F9FC;\n    border-radius: 12px;\n    overflow: hidden;\n  }\n  .smcm-tour-ui-inner {\n    position: relative;\n    width: 100%;\n    min-height: 360px;\n    padding: 24px;\n    box-sizing: border-box;\n  }\n  .smcm-tour-ui-label {\n    font-family: var(--smcm-font-b);\n    font-size: 12px;\n    font-weight: 600;\n    color: var(--smcm-muted);\n    margin-bottom: 12px;\n  }\n  .smcm-tour-hint {\n    position: absolute;\n    bottom: 20px;\n    left: 50%;\n    transform: translateX(-50%);\n    font-family: var(--smcm-font-b);\n    font-size: 12px;\n    font-weight: 500;\n    color: var(--smcm-muted);\n    background: rgba(255,255,255,0.92);\n    padding: 8px 14px;\n    border-radius: 20px;\n    box-shadow: 0 4px 16px rgba(11,22,63,0.08);\n    white-space: nowrap;\n    pointer-events: none;\n  }\n\n  .smcm-tour-screen-wrap {\n    position: relative;\n    width: 100%;\n  }\n  .smcm-tour-screen {\n    width: 100%;\n    display: block;\n    border-radius: 8px;\n  }\n  .smcm-tour-callout {\n    position: absolute;\n    top: 14%;\n    left: 16%;\n    max-width: 260px;\n    background: var(--smcm-navy);\n    color: #fff;\n    padding: 16px 18px;\n    border-radius: 10px;\n    font-family: var(--smcm-font-b);\n    font-size: 13px;\n    font-weight: 600;\n    box-shadow: 0 12px 30px rgba(11,22,63,0.3);\n  }\n\n  \n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     MOBILE REDESIGN (\u2264640px) \u2014 slide height is already natural\/auto\n     everywhere now. On phones, chrome (browser-style sidebars\/topbars\/\n     steps) is simplified into simple stacked blocks, and every\n     grid\/row layout collapses to one column top-to-bottom. Nothing\n     here touches tablet\/desktop \u2014 nothing above 640px is affected.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  @media (max-width: 640px) {\n    .smcm-tour-viewport { overflow: visible; }\n    .smcm-tour-slide { padding: 16px; }\n\n    \/* Any remaining side-by-side \"body\" rows (sidebar + main content)\n       stack vertically instead of squeezing into an icon rail. *\/\n    .smcm-tour-s3-body,\n    .smcm-tour-s4-body,\n    .smcm-tour-s5-body,\n    .smcm-tour-s6-body,\n    .smcm-tour-s7-body,\n    .smcm-tour-s8-body,\n    .smcm-tour-s9-body,\n    .smcm-tour-slide10,\n    .smcm-tour-s11-body,\n    .smcm-tour-s12-body,\n    .smcm-tour-s13-body {\n      flex-direction: column;\n    }\n    .smcm-tour-shell-sidebar,\n    .smcm-tour-shell-wizard-subnav,\n    .smcm-tour-s10-sidebar {\n      display: none;\n    }\n    .smcm-tour-shell-wizard-steps { display: none; }\n\n    \/* Multi-column grids\/rows collapse to one clean column. *\/\n    .smcm-tour-s4-grid { grid-template-columns: 1fr; }\n    .smcm-tour-s4-wide { grid-column: 1 \/ -1; }\n    .smcm-tour-s4-ref { grid-column: 1 \/ -1; grid-row: auto; }\n    .smcm-tour-s4-ref-img { height: 90px; max-width: 220px; }\n    .smcm-tour-s4-page-head { flex-direction: column; align-items: flex-start; gap: 6px; }\n\n    .smcm-tour-s8-row3 { grid-template-columns: 1fr; }\n    .smcm-tour-s9-row3 { grid-template-columns: 1fr; }\n    .smcm-tour-s7-row { flex-direction: column; align-items: flex-start; gap: 6px; }\n    .smcm-tour-s6-panel { overflow-x: auto; }\n    .smcm-tour-s12-table,\n    .smcm-tour-s6-table { display: block; overflow-x: auto; white-space: nowrap; }\n\n    .smcm-tour-s3-table-wrap,\n    .smcm-tour-s5-table,\n    .smcm-tour-s10-table { overflow-x: auto; }\n    .smcm-tour-s3-table-head,\n    .smcm-tour-s3-table-row,\n    .smcm-tour-s5-thead,\n    .smcm-tour-s5-row,\n    .smcm-tour-s10-thead,\n    .smcm-tour-s10-row {\n      grid-template-columns: 24px minmax(120px, 1.4fr) repeat(4, minmax(70px, 0.8fr));\n      min-width: 560px;\n    }\n\n    .smcm-tour-s3-create-wrap,\n    .smcm-tour-s3-page-head,\n    .smcm-tour-s5-page-head {\n      flex-direction: column;\n      align-items: flex-start;\n      gap: 10px;\n    }\n\n    .smcm-tour-s13-callout-wrap { align-items: center; }\n  }\n\n  \/* Laptop-height compaction: typical 1024\u20131440px \/ shorter-viewport laptops.\n     Slide height is now fully natural\/auto (no lock) \u2014 this block only\n     trims the surrounding chrome and internal card padding so laptop\n     screens don't end up with an unnecessarily tall \"How Smart Change\n     Works\" card just because desktop-sized spacing carried over. *\/\n  @media (min-width: 1200px) and (max-width: 1440px) {\n    .smcm-hero { min-height: 44vh; padding-top: 104px; padding-bottom: 8px; }\n    .smcm-tour-section { padding: 64px clamp(20px, 4vw, 56px) 48px; }\n    .smcm-tour-heading { margin-bottom: 16px; }\n    .smcm-tour-intro-photo { max-height: min(340px, 42vh); }\n    .smcm-tour-slide { padding: 16px; }\n\n    \/* Give only the first How Smart Change Works slide more vertical room\n       on smaller \/ shorter desktop and laptop screens. *\/\n    .smcm-tour-slide[data-slide=\"1\"] {\n      min-height: 470px;\n      display: none;\n    }\n    .smcm-tour-slide[data-slide=\"1\"].smcm-tour-active {\n      display: flex;\n      align-items: center;\n    }\n    .smcm-tour-slide[data-slide=\"1\"] .smcm-tour-intro {\n      min-height: 430px;\n    }\n\n    \/* Tighten the densest cards so their natural height stays compact\n       on laptop widths without losing any content or column layout. *\/\n    .smcm-tour-s4-body { padding: 10px 14px 12px; }\n    .smcm-tour-s4-card { padding: 10px 14px 12px; }\n    .smcm-tour-s4-grid { gap: 6px 16px; }\n    .smcm-tour-s6-panel,\n    .smcm-tour-s7-panel,\n    .smcm-tour-s9-panel,\n    .smcm-tour-s11-panel,\n    .smcm-tour-s12-panel { padding: 10px 14px 12px; }\n    .smcm-tour-s6-content,\n    .smcm-tour-s7-content,\n    .smcm-tour-s8-content,\n    .smcm-tour-s9-content,\n    .smcm-tour-s11-content,\n    .smcm-tour-s12-content,\n    .smcm-tour-s13-content { padding: 10px 14px 12px; }\n    .smcm-tour-s9-row3 { gap: 8px; margin-bottom: 10px; }\n    .smcm-tour-s9-setting { padding: 8px 10px; margin-bottom: 6px; }\n    .smcm-tour-s7-qa { gap: 8px; }\n  }\n\n  @media (min-width: 1440px) {\n    .smcm-hero-title { letter-spacing: -1.4px; }\n\n    .smcm-sf-inner { max-width: min(1280px, 88vw); }\n    .smcm-sf-heading { font-size: 36px; }\n    .smcm-sf-tabs { max-width: 400px; }\n    .smcm-sf-panel { flex-basis: 460px; max-width: 460px; }\n    .smcm-sf-media { max-width: 400px; }\n\n    .smcm-tour-heading { font-size: 36px; }\n    .smcm-tour-card { max-width: min(1200px, 92vw); }\n    .smcm-tour-section { padding: 92px 64px 68px; }\n    .smcm-tour-intro { max-width: min(1180px, 100%); gap: 32px; }\n    .smcm-tour-intro-photo { flex-basis: 360px; max-width: 360px; max-height: min(460px, 52vh); }\n    .smcm-tour-intro-copy { max-width: 500px; }\n    .smcm-tour-intro-title { font-size: 26px; }\n    .smcm-tour-intro-desc { font-size: 14.5px; }\n    .smcm-tour-start-btn { font-size: 15px !important; padding: 13px 28px !important; }\n  }\n  @media (min-width: 1600px) {\n    .smcm-hero-title { letter-spacing: -1.6px; }\n\n    .smcm-sf-inner { max-width: min(1420px, 84vw); }\n    .smcm-sf-heading { font-size: 40px; }\n    .smcm-sf-layout { gap: clamp(40px, 3.5vw, 64px); }\n    .smcm-sf-tabs { max-width: 420px; }\n    .smcm-sf-panel { flex-basis: 500px; max-width: 500px; }\n    .smcm-sf-media { max-width: 440px; }\n    .smcm-sf-tab-title { font-size: 16px; }\n\n    .smcm-tour-heading { font-size: 40px; }\n    .smcm-tour-section { padding: 100px 64px 76px; }\n    .smcm-tour-card { max-width: min(1400px, 92vw); }\n    .smcm-tour-intro { max-width: min(1280px, 100%); gap: 36px; }\n    .smcm-tour-intro-photo { flex-basis: 400px; max-width: 400px; max-height: min(500px, 54vh); }\n    .smcm-tour-intro-copy { max-width: 540px; }\n    .smcm-tour-intro-title { font-size: 28px; }\n    .smcm-tour-intro-desc { font-size: 15px; }\n    .smcm-tour-start-btn { font-size: 15px !important; padding: 14px 30px !important; }\n    .smcm-tour-powered { font-size: 13px; margin-top: 28px; }\n  }\n  @media (min-width: 1800px) {\n    .smcm-hero { min-height: 46vh; padding: 96px 96px 8px; }\n    .smcm-hero-title { letter-spacing: -1.8px; }\n\n    .smcm-sf-section { padding: 96px 64px; }\n    .smcm-sf-inner { max-width: min(1580px, 80vw); }\n    .smcm-sf-heading { font-size: 44px; }\n    .smcm-sf-layout { gap: clamp(48px, 3.8vw, 72px); }\n    .smcm-sf-tabs { max-width: 440px; }\n    .smcm-sf-panel { flex-basis: 540px; max-width: 540px; }\n    .smcm-sf-media { max-width: 480px; }\n    .smcm-sf-tab-title { font-size: 17px; }\n    .smcm-sf-tab-desc { font-size: 13.5px; }\n\n    .smcm-tour-heading { font-size: 44px; }\n    .smcm-tour-section { padding: 108px 72px 84px; }\n    .smcm-tour-card { max-width: min(1560px, 94vw); }\n    .smcm-tour-intro { max-width: min(1400px, 100%); gap: 44px; padding: 0 40px; }\n    .smcm-tour-intro-photo { flex-basis: 440px; max-width: 440px; max-height: min(540px, 56vh); }\n    .smcm-tour-intro-copy { max-width: 580px; }\n    .smcm-tour-intro-title { font-size: 32px; }\n    .smcm-tour-intro-desc { font-size: 15.5px; max-width: 40em; }\n    .smcm-tour-start-btn { font-size: 16px !important; padding: 15px 32px !important; }\n    .smcm-tour-powered { font-size: 14px; margin-top: 32px; }\n  }\n  @media (min-width: 2100px) {\n    .smcm-tour-section::before { width: min(1840px, calc(100% - 96px)); }\n\n    .smcm-hero-title { letter-spacing: -2px; }\n\n    .smcm-sf-inner { max-width: min(1720px, 78vw); }\n    .smcm-sf-heading { font-size: 48px; }\n    .smcm-sf-layout { gap: clamp(56px, 4vw, 80px); }\n    .smcm-sf-tabs { max-width: 460px; }\n    .smcm-sf-panel { flex-basis: 580px; max-width: 580px; }\n    .smcm-sf-media { max-width: 520px; }\n\n    .smcm-tour-heading { font-size: 48px; }\n    .smcm-tour-section { padding: 116px 80px 92px; }\n    .smcm-tour-card { max-width: min(1680px, 94vw); }\n    .smcm-tour-intro { max-width: min(1520px, 100%); gap: 52px; }\n    .smcm-tour-intro-photo { flex-basis: 480px; max-width: 480px; max-height: min(580px, 58vh); }\n    .smcm-tour-intro-copy { max-width: 620px; }\n    .smcm-tour-intro-title { font-size: 34px; }\n    .smcm-tour-intro-desc { font-size: 16px; }\n    .smcm-tour-start-btn { font-size: 16px !important; padding: 16px 34px !important; }\n  }\n  @media (min-width: 2200px) {\n    .smcm-hero { min-height: 48vh; padding: 96px 112px 8px; }\n    .smcm-sf-section { padding: 104px 80px; }\n    .smcm-sf-inner { max-width: min(1800px, 76vw); }\n    .smcm-tour-card { max-width: min(1760px, 94vw); }\n    .smcm-tour-intro { max-width: min(1600px, 100%); gap: 56px; }\n    .smcm-tour-intro-photo { flex-basis: 500px; max-width: 500px; max-height: min(600px, 60vh); }\n    .smcm-tour-intro-title { font-size: 36px; }\n    .smcm-tour-intro-desc { font-size: 16.5px; }\n  }\n  @media (min-width: 2400px) {\n    .smcm-hero-title { letter-spacing: -2.2px; }\n    .smcm-sf-heading { font-size: 52px; }\n    .smcm-sf-inner { max-width: min(1900px, 74vw); }\n    .smcm-sf-tabs { max-width: 480px; }\n    .smcm-sf-panel { flex-basis: 620px; max-width: 620px; }\n    .smcm-sf-media { max-width: 560px; }\n    .smcm-tour-heading { font-size: 52px; }\n    .smcm-tour-section { padding: 124px 88px 100px; }\n    .smcm-tour-card { max-width: min(1900px, 94vw); }\n    .smcm-tour-intro { max-width: min(1720px, 100%); gap: 60px; }\n    .smcm-tour-intro-photo { flex-basis: 540px; max-width: 540px; max-height: min(660px, 62vh); }\n    .smcm-tour-intro-copy { max-width: 660px; }\n    .smcm-tour-intro-title { font-size: 40px; }\n    .smcm-tour-intro-desc { font-size: 17px; }\n    .smcm-tour-start-btn { font-size: 17px !important; padding: 17px 36px !important; }\n    .smcm-tour-powered { font-size: 15px; margin-top: 36px; }\n  }\n  @media (min-width: 2700px) {\n    .smcm-tour-section::before { width: min(2240px, calc(100% - 128px)); }\n\n    .smcm-hero-title { letter-spacing: -2.5px; }\n    .smcm-sf-heading { font-size: 56px; }\n    .smcm-sf-inner { max-width: min(2100px, 72vw); }\n    .smcm-tour-heading { font-size: 56px; }\n    .smcm-tour-section { padding: 132px 96px 108px; }\n    .smcm-tour-card { max-width: min(2100px, 94vw); }\n    .smcm-tour-intro { max-width: min(1900px, 100%); gap: 68px; }\n    .smcm-tour-intro-photo { flex-basis: 600px; max-width: 600px; max-height: min(740px, 64vh); }\n    .smcm-tour-intro-copy { max-width: 720px; }\n    .smcm-tour-intro-title { font-size: 44px; }\n    .smcm-tour-intro-desc { font-size: 18px; }\n    .smcm-tour-start-btn { font-size: 18px !important; padding: 18px 40px !important; }\n  }\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     WHY CHOOSE SMART FOOD SAFE \u2014 FEATURES-STYLE CAROUSEL\n     Scoped for Elementor. Mirrors the SFS product Features carousel:\n     desktop = 2 cards per view \/ 3 pages; mobile = 3 stacked cards per page.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  .smcm-why-section {\n    position: relative;\n    isolation: isolate;\n    width: 100%;\n    overflow: hidden;\n    padding: 96px 48px 104px;\n    font-family: var(--smcm-font-h) !important;\n    background:\n      radial-gradient(circle at 0% 0%, rgba(112,173,255,0.26) 0%, rgba(112,173,255,0.12) 20%, rgba(255,255,255,0) 42%),\n      radial-gradient(circle at 100% 100%, rgba(112,173,255,0.28) 0%, rgba(112,173,255,0.12) 22%, rgba(255,255,255,0) 44%);\n  }\n\n  .smcm-why-section,\n  .smcm-why-section * {\n    font-family: var(--smcm-font-h) !important;\n  }\n\n  .smcm-why-inner {\n    position: relative;\n    z-index: 1;\n    width: 100%;\n    max-width: 1140px;\n    margin: 0 auto;\n  }\n\n  .smcm-why-header {\n    text-align: center;\n    max-width: 780px;\n    margin: 0 auto 40px;\n  }\n\n  .smcm-why-heading {\n    margin: 0 0 12px;\n    font-size: clamp(30px, 2.6vw, 42px);\n    font-weight: 700;\n    line-height: 1.2;\n    letter-spacing: -0.9px;\n    color: var(--smcm-navy);\n  }\n\n  .smcm-why-eco-line {\n    display: block;\n  }\n\n  \/* Force the full Why-section heading, including the blue span,\n     to use Plus Jakarta Sans. This selector is intentionally more specific\n     than the global `.smcm-page span { font-family: var(--smcm-font-b) !important; }`\n     rule above, which was overriding the previous font declaration. *\/\n  .smcm-page .smcm-why-heading,\n  .smcm-page .smcm-why-heading .smcm-why-heading-blue {\n    font-family: 'Plus Jakarta Sans', sans-serif !important;\n  }\n\n  .smcm-page .smcm-why-heading-blue {\n    color: var(--smcm-blue);\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n    letter-spacing: inherit;\n  }\n\n  .smcm-why-sub {\n    margin: 0 auto;\n    max-width: 720px;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 1.7;\n    color: var(--smcm-navy);\n  }\n\n  .smcm-why-panel {\n    width: 100%;\n    border-radius: 32px;\n    padding: 48px 40px 34px;\n    background: linear-gradient(135deg, rgba(234,242,252,0.98) 0%, rgba(247,250,254,0.98) 55%, rgba(255,255,255,0.98) 100%);\n    overflow: hidden;\n    border: 1px solid rgba(255,255,255,0.94);\n  }\n\n  .smcm-why-track-wrap {\n    width: 100%;\n    overflow: hidden;\n    cursor: grab;\n    touch-action: pan-y;\n  }\n  .smcm-why-track-wrap.smcm-why-dragging { cursor: grabbing; }\n\n  .smcm-why-track {\n    display: flex;\n    gap: 0;\n    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);\n    will-change: transform;\n    user-select: none;\n  }\n\n  \/* Desktop: page wrappers disappear so exactly 2 cards are visible. *\/\n  .smcm-why-page { display: contents; }\n\n  .smcm-why-card {\n    flex: 0 0 50%;\n    max-width: 50%;\n    min-width: 0;\n    display: flex;\n    align-items: flex-start;\n    gap: 20px;\n    padding: 4px 32px;\n    box-sizing: border-box;\n  }\n\n  .smcm-why-card--divider {\n    border-right: 1px solid rgba(43,107,230,0.16);\n  }\n\n  .smcm-why-icon {\n    width: 64px;\n    height: 64px;\n    flex: 0 0 64px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent !important;\n    border: 0 !important;\n    outline: 0 !important;\n    box-shadow: none !important;\n    filter: none !important;\n    border-radius: 0 !important;\n  }\n\n  .smcm-why-icon-svg {\n    display: block;\n    width: 56px;\n    height: 56px;\n    overflow: visible;\n    border: 0 !important;\n    outline: 0 !important;\n    box-shadow: none !important;\n    filter: none !important;\n  }\n\n  .smcm-why-body {\n    flex: 1;\n    min-width: 0;\n  }\n\n  .smcm-why-card-title {\n    margin: 0 0 8px;\n    font-size: 15px;\n    font-weight: 700;\n    line-height: 1.35;\n    letter-spacing: -0.1px;\n    color: var(--smcm-navy);\n  }\n\n  .smcm-why-card-desc {\n    margin: 0;\n    font-size: 12.5px;\n    font-weight: 500;\n    line-height: 1.62;\n    color: var(--smcm-muted);\n  }\n\n  .smcm-why-card-desc + .smcm-why-card-desc {\n    margin-top: 8px;\n  }\n\n  .smcm-why-card-desc strong {\n    color: var(--smcm-navy);\n    font-weight: 500;\n  }\n\n  .smcm-why-ecosystem {\n    display: block;\n    margin-top: 9px;\n    color: var(--smcm-navy);\n    font-weight: 700;\n    line-height: 1.65;\n  }\n\n  .smcm-why-dots {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    margin-top: 32px;\n  }\n\n  .smcm-why-dot {\n    all: unset;\n    box-sizing: border-box;\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    background: rgba(43,107,230,0.22);\n    cursor: pointer;\n    transition: background 0.25s ease, transform 0.25s ease;\n  }\n\n  .smcm-why-dot.smcm-why-active {\n    background: var(--smcm-blue);\n    transform: scale(1.3);\n  }\n\n  .smcm-why-dot:focus-visible {\n    outline: 2px solid var(--smcm-blue);\n    outline-offset: 3px;\n  }\n\n  @media (max-width: 1280px) {\n    .smcm-why-section { padding: 84px 40px 92px; }\n  }\n\n  @media (max-width: 1024px) {\n    .smcm-why-section { padding: 72px 32px 80px; }\n    .smcm-why-panel { padding: 40px 32px 30px; border-radius: 28px; }\n    .smcm-why-heading { font-size: 30px; }\n    .smcm-why-card { padding: 4px 24px; gap: 18px; }\n    .smcm-why-icon { width: 56px; height: 56px; flex-basis: 56px; background: transparent; }\n    .smcm-why-icon-svg { width: 50px; height: 50px; }\n  }\n\n  @media (max-width: 768px) {\n    .smcm-why-section {\n      padding: 64px 20px 72px;\n      background:\n        radial-gradient(circle at 0% 0%, rgba(112,173,255,0.28) 0%, rgba(112,173,255,0.12) 22%, rgba(255,255,255,0) 46%),\n        radial-gradient(circle at 100% 100%, rgba(112,173,255,0.30) 0%, rgba(112,173,255,0.12) 24%, rgba(255,255,255,0) 48%);\n    }\n    .smcm-why-header { margin-bottom: 30px; }\n    .smcm-why-heading { font-size: 27px; letter-spacing: -0.6px; }\n    .smcm-why-sub { font-size: 12px; line-height: 1.65; }\n    .smcm-why-panel { padding: 32px 18px 26px; border-radius: 22px; }\n\n    \/* Same behavior as the theme Features carousel:\n       one mobile slide = three vertically stacked cards. *\/\n    .smcm-why-page {\n      display: flex;\n      flex-direction: column;\n      gap: 24px;\n      flex: 0 0 100%;\n      max-width: 100%;\n      box-sizing: border-box;\n    }\n\n    .smcm-why-card {\n      flex: 0 0 auto;\n      max-width: 100%;\n      width: 100%;\n      padding: 0;\n      gap: 16px;\n    }\n\n    .smcm-why-card--divider { border-right: none; }\n    .smcm-why-icon { width: 52px; height: 52px; flex-basis: 52px; background: transparent; }\n    .smcm-why-icon-svg { width: 46px; height: 46px; }\n    .smcm-why-card-title { font-size: 14px; }\n    .smcm-why-card-desc { font-size: 12px; line-height: 1.58; }\n    .smcm-why-dots { margin-top: 28px; }\n  }\n\n  @media (max-width: 480px) {\n    .smcm-why-section { padding: 52px 16px 60px; }\n    .smcm-why-heading { font-size: 24px; }\n    .smcm-why-panel { padding: 28px 16px 24px; border-radius: 18px; }\n    .smcm-why-page { gap: 22px; }\n    .smcm-why-icon { width: 48px; height: 48px; flex-basis: 48px; background: transparent; }\n    .smcm-why-icon-svg { width: 42px; height: 42px; }\n    .smcm-why-card-title { font-size: 13.5px; margin-bottom: 6px; }\n    .smcm-why-card-desc { font-size: 11.5px; }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     WHAT DIFFERENTIATES US \u2014 IMAGE COMPARISON SLIDER\n     Elementor-friendly: fully scoped to .smcm-page \/ smcm-* classes.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  .smcm-compare-section {\n    width: 100%;\n    background: #ffffff;\n    padding: 88px 48px 96px;\n  }\n\n  .smcm-compare-inner {\n    width: 100%;\n    max-width: 1180px;\n    margin: 0 auto;\n  }\n\n  .smcm-compare-heading {\n    margin: 0 0 42px;\n    text-align: center;\n    font-family: var(--smcm-font-h) !important;\n    font-size: clamp(30px, 3vw, 48px);\n    font-weight: 700;\n    line-height: 1.18;\n    letter-spacing: -1px;\n    color: var(--smcm-navy);\n  }\n\n  .smcm-page .smcm-compare-heading,\n  .smcm-page .smcm-compare-heading span {\n    font-family: var(--smcm-font-h) !important;\n  }\n\n  .smcm-compare-heading-blue {\n    color: var(--smcm-blue);\n  }\n\n  .smcm-compare-frame {\n    --smcm-compare-position: 50%;\n    position: relative;\n    width: 100%;\n    max-width: 960px;\n    margin: 0 auto;\n    aspect-ratio: 16 \/ 9;\n    border-radius: 28px;\n    overflow: hidden;\n    background: #eef4fb;\n    border: 1px solid rgba(43,107,230,0.12);\n    isolation: isolate;\n    touch-action: pan-y;\n    cursor: ew-resize;\n  }\n\n  .smcm-compare-image,\n  .smcm-compare-layer {\n    position: absolute;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n  }\n\n  .smcm-compare-image {\n    display: block;\n    object-fit: cover;\n    object-position: center center;\n    user-select: none;\n    -webkit-user-drag: none;\n    pointer-events: none;\n  }\n\n  .smcm-compare-manual {\n    z-index: 1;\n  }\n\n  .smcm-compare-layer {\n    z-index: 2;\n    overflow: hidden;\n    width: var(--smcm-compare-position);\n  }\n\n  .smcm-compare-layer .smcm-compare-image {\n    width: var(--smcm-compare-frame-width, 100%);\n    max-width: none;\n  }\n\n  .smcm-compare-frame::after {\n    content: '';\n    position: absolute;\n    z-index: 4;\n    top: 0;\n    bottom: 0;\n    left: var(--smcm-compare-position);\n    width: 3px;\n    transform: translateX(-50%);\n    background: rgba(255,255,255,0.96);\n    box-shadow: 0 0 0 1px rgba(11,22,63,0.08);\n    pointer-events: none;\n  }\n\n  .smcm-compare-handle {\n    position: absolute;\n    z-index: 6;\n    left: var(--smcm-compare-position);\n    top: 50%;\n    width: 68px;\n    height: 68px;\n    transform: translate(-50%, -50%);\n    border-radius: 12px;\n    background: #ffffff;\n    border: 1px solid rgba(11,22,63,0.08);\n    box-shadow: 0 10px 28px rgba(11,22,63,0.18);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    pointer-events: none;\n  }\n\n  .smcm-compare-handle-logo {\n    display: block;\n    width: 52px;\n    height: 52px;\n    object-fit: contain;\n    border: 0 !important;\n    outline: 0 !important;\n    box-shadow: none !important;\n    filter: none !important;\n  }\n\n  .smcm-compare-range {\n    position: absolute;\n    z-index: 7;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    margin: 0;\n    opacity: 0;\n    cursor: ew-resize;\n    appearance: none;\n    -webkit-appearance: none;\n  }\n\n  .smcm-compare-range:focus-visible + .smcm-compare-handle {\n    outline: 3px solid rgba(43,107,230,0.28);\n    outline-offset: 4px;\n  }\n\n  @media (max-width: 1024px) {\n    .smcm-compare-section {\n      padding: 72px 32px 80px;\n    }\n\n    .smcm-compare-heading {\n      margin-bottom: 34px;\n      font-size: clamp(28px, 4vw, 40px);\n    }\n\n    .smcm-compare-frame {\n      border-radius: 22px;\n    }\n  }\n\n  @media (max-width: 640px) {\n    .smcm-compare-section {\n      padding: 56px 16px 64px;\n    }\n\n    .smcm-compare-heading {\n      margin-bottom: 26px;\n      font-size: 28px;\n      line-height: 1.22;\n      letter-spacing: -0.6px;\n    }\n\n    .smcm-compare-frame {\n      aspect-ratio: 4 \/ 3;\n      border-radius: 18px;\n    }\n\n    .smcm-compare-handle {\n      width: 56px;\n      height: 56px;\n      border-radius: 10px;\n    }\n\n    .smcm-compare-handle-logo {\n      width: 42px;\n      height: 42px;\n    }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     FAQ\n     Elementor-friendly and fully scoped to smcm-* classes.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  .smcm-faq-section {\n    position: relative;\n    width: 100%;\n    overflow: hidden;\n    background: #ffffff;\n    padding: 92px 48px 104px;\n  }\n\n  .smcm-faq-section::before,\n  .smcm-faq-section::after {\n    content: '';\n    position: absolute;\n    width: min(480px, 42vw);\n    height: min(480px, 42vw);\n    border-radius: 50%;\n    pointer-events: none;\n    filter: blur(54px);\n    opacity: 0.72;\n    z-index: 0;\n  }\n\n  .smcm-faq-section::before {\n    left: -210px;\n    top: 180px;\n    background: radial-gradient(circle, rgba(128,184,255,0.52) 0%, rgba(178,214,255,0.28) 44%, rgba(255,255,255,0) 74%);\n  }\n\n  .smcm-faq-section::after {\n    right: -210px;\n    bottom: 70px;\n    background: radial-gradient(circle, rgba(128,184,255,0.52) 0%, rgba(178,214,255,0.28) 44%, rgba(255,255,255,0) 74%);\n  }\n\n  .smcm-faq-inner {\n    position: relative;\n    z-index: 1;\n    width: 100%;\n    max-width: 1120px;\n    margin: 0 auto;\n  }\n\n  .smcm-faq-heading {\n    margin: 0 0 46px;\n    text-align: center;\n    font-family: var(--smcm-font-h) !important;\n    font-size: clamp(32px, 3.2vw, 52px);\n    font-weight: 700;\n    line-height: 1.15;\n    letter-spacing: -1px;\n    color: var(--smcm-navy);\n  }\n\n  .smcm-faq-list {\n    display: flex;\n    flex-direction: column;\n    gap: 18px;\n  }\n\n  .smcm-faq-item {\n    background: rgba(255,255,255,0.96);\n    border: 1px solid rgba(11,22,63,0.04);\n    border-radius: 18px;\n    overflow: hidden;\n  }\n\n  .smcm-faq-question {\n    width: 100%;\n    display: flex !important;\n    align-items: center;\n    gap: 18px;\n    padding: 22px 24px !important;\n    background: #ffffff !important;\n    color: var(--smcm-navy) !important;\n    border: 0 !important;\n    text-align: left;\n    cursor: pointer;\n  }\n\n  .smcm-faq-icon {\n    width: 34px;\n    height: 34px;\n    min-width: 34px;\n    border-radius: 8px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    background: linear-gradient(145deg, #2B8DFF 0%, #72B8FF 100%);\n    position: relative;\n    flex-shrink: 0;\n  }\n\n  .smcm-faq-icon::before,\n  .smcm-faq-icon::after {\n    content: '';\n    position: absolute;\n    background: #ffffff;\n    border-radius: 2px;\n    transition: transform 0.22s ease, opacity 0.22s ease;\n  }\n\n  .smcm-faq-icon::before {\n    width: 14px;\n    height: 2px;\n  }\n\n  .smcm-faq-icon::after {\n    width: 2px;\n    height: 14px;\n  }\n\n  .smcm-faq-item.smcm-faq-open .smcm-faq-icon::after {\n    opacity: 0;\n    transform: scaleY(0);\n  }\n\n  .smcm-faq-question-text {\n    font-family: var(--smcm-font-h) !important;\n    font-size: 18px;\n    font-weight: 600;\n    line-height: 1.35;\n    color: var(--smcm-navy);\n  }\n\n  .smcm-faq-answer {\n    display: grid;\n    grid-template-rows: 0fr;\n    transition: grid-template-rows 0.28s ease;\n    background: #ffffff;\n  }\n\n  .smcm-faq-item.smcm-faq-open .smcm-faq-answer {\n    grid-template-rows: 1fr;\n  }\n\n  .smcm-faq-answer-inner {\n    overflow: hidden;\n  }\n\n  .smcm-faq-answer-copy {\n    margin: 0;\n    padding: 0 24px 22px 76px;\n    font-family: var(--smcm-font-b) !important;\n    font-size: 15px;\n    font-weight: 400;\n    line-height: 1.75;\n    color: var(--smcm-muted);\n  }\n\n  .smcm-faq-answer-copy strong {\n    font-family: inherit !important;\n    font-weight: 700;\n    color: var(--smcm-navy);\n  }\n\n  @media (max-width: 1024px) {\n    .smcm-faq-section {\n      padding: 76px 32px 88px;\n    }\n\n    .smcm-faq-heading {\n      margin-bottom: 38px;\n      font-size: 40px;\n    }\n  }\n\n  @media (max-width: 640px) {\n    .smcm-faq-section {\n      padding: 58px 16px 68px;\n    }\n\n    .smcm-faq-section::before,\n    .smcm-faq-section::after {\n      width: 320px;\n      height: 320px;\n      filter: blur(48px);\n    }\n\n    .smcm-faq-section::before {\n      left: -190px;\n      top: 110px;\n    }\n\n    .smcm-faq-section::after {\n      right: -190px;\n      bottom: 40px;\n    }\n\n    .smcm-faq-heading {\n      margin-bottom: 28px;\n      font-size: 30px;\n      line-height: 1.2;\n    }\n\n    .smcm-faq-list {\n      gap: 12px;\n    }\n\n    .smcm-faq-item {\n      border-radius: 14px;\n    }\n\n    .smcm-faq-question {\n      gap: 14px;\n      padding: 17px 16px !important;\n    }\n\n    .smcm-faq-icon {\n      width: 30px;\n      height: 30px;\n      min-width: 30px;\n      border-radius: 7px;\n    }\n\n    .smcm-faq-question-text {\n      font-size: 15px;\n      line-height: 1.4;\n    }\n\n    .smcm-faq-answer-copy {\n      padding: 0 16px 18px 60px;\n      font-size: 13.5px;\n      line-height: 1.65;\n    }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     GLOBAL SECTION HEADING SYSTEM \u2014 UI TYPOGRAPHY NORMALIZATION\n     Every H2 now uses one responsive scale at every viewport width.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  .smcm-page {\n    --smcm-section-h2-size: clamp(30px, 2.8vw, 64px);\n    --smcm-section-h2-line-height: 1.16;\n    --smcm-section-h2-letter-spacing: -0.9px;\n  }\n\n  .smcm-page h2 {\n    font-family: var(--smcm-font-h) !important;\n    font-size: var(--smcm-section-h2-size) !important;\n    font-weight: 700 !important;\n    line-height: var(--smcm-section-h2-line-height) !important;\n    letter-spacing: var(--smcm-section-h2-letter-spacing) !important;\n    color: var(--smcm-navy);\n    text-wrap: balance;\n  }\n\n  \/* The global .smcm-page span rule uses Poppins + !important.\n     Force every span inside an H2 to inherit the exact H2 typography. *\/\n  .smcm-page h2 span {\n    font-family: inherit !important;\n    font-size: inherit !important;\n    font-weight: inherit !important;\n    line-height: inherit !important;\n    letter-spacing: inherit !important;\n  }\n\n  \/* Keep the same proportional heading system on very small phones. *\/\n  @media (max-width: 420px) {\n    .smcm-page {\n      --smcm-section-h2-size: clamp(28px, 7.2vw, 30px);\n      --smcm-section-h2-letter-spacing: -0.65px;\n    }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     RESPONSIVE COPY + SECTION RHYTHM \u2014 LARGE-SCREEN UI AUDIT FIX\n     Keeps typography and vertical rhythm proportional as viewport grows.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  .smcm-page {\n    --smcm-section-space-y: clamp(64px, 4vw, 96px);\n    --smcm-heading-content-gap: clamp(32px, 2vw, 48px);\n    \/* One shared, fluid paragraph size used everywhere on the page \u2014\n       section intros, card copy, FAQ answers, compare\/tour subtitles,\n       and tour callouts all read at the exact same size per screen\n       width instead of each section having its own slightly-different\n       value. *\/\n    --smcm-body-copy-size: clamp(16px, 0.95vw, 22px);\n    --smcm-section-subtitle-size: var(--smcm-body-copy-size);\n    --smcm-content-copy-size: var(--smcm-body-copy-size);\n    --smcm-card-title-size: clamp(15px, 0.78vw, 20px);\n    --smcm-faq-question-size: clamp(17px, 0.84vw, 22px);\n    --smcm-faq-answer-size: var(--smcm-body-copy-size);\n    --smcm-copy-line-height: 1.65;\n  }\n\n  \/* One consistent vertical rhythm between all primary content sections. *\/\n  .smcm-page .smcm-sf-section,\n  .smcm-page .smcm-tour-section,\n  .smcm-page .smcm-why-section,\n  .smcm-page .smcm-compare-section,\n  .smcm-page .smcm-faq-section {\n    padding-top: var(--smcm-section-space-y) !important;\n    padding-bottom: var(--smcm-section-space-y) !important;\n  }\n\n  \/* Main section subtitles scale with viewport instead of staying tiny. *\/\n  .smcm-page .smcm-hero-subtitle,\n  .smcm-page .smcm-sf-subtitle,\n  .smcm-page .smcm-tour-subtitle,\n  .smcm-page .smcm-why-sub {\n    font-size: var(--smcm-section-subtitle-size) !important;\n    line-height: 1.65 !important;\n    text-wrap: pretty;\n  }\n\n  .smcm-page .smcm-hero-subtitle {\n    max-width: clamp(620px, 46vw, 1100px) !important;\n  }\n\n  .smcm-page .smcm-sf-subtitle,\n  .smcm-page .smcm-tour-subtitle {\n    max-width: clamp(720px, 42vw, 1040px) !important;\n  }\n\n  .smcm-page .smcm-why-sub {\n    max-width: clamp(720px, 42vw, 1020px) !important;\n  }\n\n  \/* Feature and editorial copy: readable at 2K\/2.5K\/3K widths. *\/\n  .smcm-page .smcm-sf-tab-desc,\n  .smcm-page .smcm-why-card-desc {\n    font-size: var(--smcm-content-copy-size) !important;\n    line-height: var(--smcm-copy-line-height) !important;\n    text-wrap: pretty;\n  }\n\n  .smcm-page .smcm-sf-tab-title,\n  .smcm-page .smcm-why-card-title {\n    font-size: var(--smcm-card-title-size) !important;\n    line-height: 1.38 !important;\n  }\n\n  .smcm-page .smcm-tour-intro-desc {\n    font-size: var(--smcm-body-copy-size) !important;\n    line-height: 1.65 !important;\n    max-width: clamp(36em, 38vw, 48em) !important;\n  }\n\n  .smcm-page .smcm-faq-question-text {\n    font-size: var(--smcm-faq-question-size) !important;\n    line-height: 1.4 !important;\n  }\n\n  .smcm-page .smcm-faq-answer-copy {\n    font-size: var(--smcm-faq-answer-size) !important;\n    line-height: 1.7 !important;\n  }\n\n  .smcm-page .smcm-compare-subtitle {\n    font-size: var(--smcm-body-copy-size) !important;\n    line-height: 1.7 !important;\n  }\n\n  \/* Normalize heading-cluster-to-content spacing across sections. *\/\n  .smcm-page .smcm-sf-header,\n  .smcm-page .smcm-why-header {\n    margin-bottom: var(--smcm-heading-content-gap) !important;\n  }\n\n  .smcm-page .smcm-sf-heading,\n  .smcm-page .smcm-why-heading {\n    margin-bottom: 12px !important;\n  }\n\n  .smcm-page .smcm-tour-heading {\n    margin-bottom: 12px !important;\n  }\n\n  .smcm-page .smcm-tour-subtitle {\n    margin: 0 auto var(--smcm-heading-content-gap) !important;\n    padding-left: 0 !important;\n    padding-right: 0 !important;\n  }\n\n  .smcm-page .smcm-compare-heading,\n  .smcm-page .smcm-faq-heading {\n    margin-bottom: var(--smcm-heading-content-gap) !important;\n  }\n\n  \/* Large canvases need wider content containers, not only larger type. *\/\n  .smcm-page .smcm-why-inner {\n    max-width: clamp(1140px, 68vw, 1900px) !important;\n  }\n\n  .smcm-page .smcm-compare-inner {\n    max-width: clamp(1180px, 68vw, 1900px) !important;\n  }\n\n  \/* .smcm-why-header caps the heading\/subtitle at a fixed 780px \u2014 fine\n     on normal screens, but on very wide monitors (2250px+ range) that's\n     narrower than the heading actually needs, forcing an unnecessary\n     line break. Let it stretch with the viewport instead, with a\n     generous side margin still reserved for breathing room; it will\n     only wrap if the text genuinely can't fit even at that width. *\/\n  .smcm-page .smcm-why-header {\n    max-width: clamp(780px, 52vw, 1500px) !important;\n  }\n\n  .smcm-page .smcm-compare-frame {\n    max-width: clamp(960px, 58vw, 1380px) !important;\n  }\n\n  .smcm-page .smcm-faq-inner {\n    max-width: clamp(1120px, 66vw, 1600px) !important;\n  }\n\n  \/* Let cards breathe proportionally as their container expands. *\/\n  .smcm-page .smcm-why-card {\n    gap: clamp(18px, 1.15vw, 28px) !important;\n    padding-left: clamp(24px, 1.6vw, 40px) !important;\n    padding-right: clamp(24px, 1.6vw, 40px) !important;\n  }\n\n  .smcm-page .smcm-why-panel {\n    padding-top: clamp(38px, 2.4vw, 56px) !important;\n    padding-bottom: clamp(30px, 1.8vw, 42px) !important;\n  }\n\n  .smcm-page .smcm-faq-question {\n    padding-top: clamp(20px, 1.15vw, 28px) !important;\n    padding-bottom: clamp(20px, 1.15vw, 28px) !important;\n  }\n\n  @media (max-width: 1024px) {\n    .smcm-page {\n      --smcm-section-space-y: 64px;\n      --smcm-heading-content-gap: 32px;\n      --smcm-body-copy-size: 14px;\n      --smcm-card-title-size: 14px;\n      --smcm-faq-question-size: 17px;\n    }\n  }\n\n  @media (max-width: 768px) {\n    .smcm-page {\n      --smcm-section-space-y: 56px;\n      --smcm-heading-content-gap: 28px;\n      --smcm-body-copy-size: 13.5px;\n      --smcm-card-title-size: 14px;\n      --smcm-faq-question-size: 15px;\n    }\n\n    .smcm-page .smcm-why-card {\n      padding-left: 0 !important;\n      padding-right: 0 !important;\n      gap: 16px !important;\n    }\n\n    .smcm-page .smcm-why-panel {\n      padding-top: 32px !important;\n      padding-bottom: 26px !important;\n    }\n  }\n\n  @media (max-width: 480px) {\n    .smcm-page {\n      --smcm-section-space-y: 52px;\n      --smcm-heading-content-gap: 26px;\n      --smcm-body-copy-size: 13px;\n      --smcm-card-title-size: 13.5px;\n    }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     FINAL WIDE-SCREEN UI FIX\n     FAQ typography, Why-card body font, and tour background scaling.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  \/* FAQ questions:\n     - force Plus Jakarta Sans over the global span\/Poppins rule\n     - scale more visibly on wider screens *\/\n  .smcm-page .smcm-faq-question .smcm-faq-question-text {\n    font-family: var(--smcm-font-h) !important;\n    font-size: clamp(18px, 1.08vw, 24px) !important;\n    font-weight: 600 !important;\n    line-height: 1.38 !important;\n    letter-spacing: -0.15px;\n  }\n\n  \/* Why-section descriptive copy must use Poppins, including nested\n     bold text and the three ecosystem lines. *\/\n  .smcm-page .smcm-why-card-desc,\n  .smcm-page .smcm-why-card-desc strong,\n  .smcm-page .smcm-why-card-desc span {\n    font-family: var(--smcm-font-b) !important;\n  }\n\n  \/* Tour background:\n     The original wide-screen ::before width rules were declared before\n     the base ::before block, so the later base 1280px width overrode them.\n     Re-apply the intended breakpoints here, after every base rule. *\/\n  @media (min-width: 1440px) {\n    .smcm-page .smcm-tour-section::before {\n      width: min(1400px, calc(100% - 64px)) !important;\n    }\n  }\n\n  @media (min-width: 1600px) {\n    .smcm-page .smcm-tour-section::before {\n      width: min(1520px, calc(100% - 72px)) !important;\n    }\n  }\n\n  @media (min-width: 1800px) {\n    .smcm-page .smcm-tour-section::before {\n      width: min(1680px, calc(100% - 80px)) !important;\n    }\n  }\n\n  @media (min-width: 2100px) {\n    .smcm-page .smcm-tour-section::before {\n      width: min(1840px, calc(100% - 96px)) !important;\n    }\n  }\n\n  @media (min-width: 2400px) {\n    .smcm-page .smcm-tour-section::before {\n      width: min(2040px, calc(100% - 112px)) !important;\n    }\n  }\n\n  @media (min-width: 2700px) {\n    .smcm-page .smcm-tour-section::before {\n      width: min(2240px, calc(100% - 128px)) !important;\n    }\n  }\n\n  \/* Preserve the tighter mobile FAQ scale. *\/\n  @media (max-width: 768px) {\n    .smcm-page .smcm-faq-question .smcm-faq-question-text {\n      font-size: 15px !important;\n      letter-spacing: 0;\n    }\n  }\n\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     HOW SMART CHANGE WORKS \u2014 SINGLE DESKTOP LAYOUT AT ALL SIZES\n     No mobile\/tablet redesign. Below 1200px the full desktop tour\n     is proportionally scaled to the available width.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  .smcm-tour-scale-shell {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n    align-items: flex-start;\n    position: relative;\n  }\n\n  @media (max-width: 1199px) {\n    .smcm-page .smcm-tour-section {\n      overflow: hidden;\n      padding-left: 16px;\n      padding-right: 16px;\n    }\n\n    .smcm-page .smcm-tour-scale-shell {\n      width: 100%;\n      height: var(--smcm-tour-scaled-height, auto);\n      overflow: visible;\n    }\n\n    .smcm-page .smcm-tour-card {\n      width: 1200px !important;\n      min-width: 1200px !important;\n      max-width: none !important;\n      flex: 0 0 1200px !important;\n      margin: 0 !important;\n      transform: scale(var(--smcm-tour-scale, 1));\n      transform-origin: top center;\n    }\n\n    \/* Freeze the opening slide at the same desktop composition.\n       The whole card is scaled afterward, so nothing stacks or moves. *\/\n    .smcm-page .smcm-tour-slide {\n      padding: 22px;\n    }\n\n    .smcm-page .smcm-tour-viewport {\n      min-height: 0;\n      overflow: hidden;\n    }\n\n    .smcm-page .smcm-tour-intro {\n      flex-direction: row;\n      flex-wrap: nowrap;\n      justify-content: center;\n      align-items: center;\n      text-align: left;\n      min-height: 0;\n      gap: 32px;\n      padding: 0 40px;\n      max-width: 1180px;\n    }\n\n    .smcm-page .smcm-tour-intro-photo {\n      flex: 0 0 360px;\n      width: 360px;\n      max-width: 360px;\n      max-height: 450px;\n      margin: 0;\n      aspect-ratio: 4 \/ 5;\n    }\n\n    .smcm-page .smcm-tour-intro-copy {\n      flex: 1 1 460px;\n      max-width: 500px;\n      align-items: flex-start;\n      text-align: left;\n      padding: 8px 0;\n    }\n\n    .smcm-page .smcm-tour-intro-title {\n      font-size: 26px;\n      max-width: 28em;\n    }\n\n    .smcm-page .smcm-tour-intro-desc {\n      font-size: 14.5px !important;\n      max-width: 36em;\n    }\n\n    .smcm-page .smcm-tour-start-btn {\n      align-self: flex-start;\n      font-size: 15px !important;\n      padding: 13px 28px !important;\n    }\n\n    .smcm-page .smcm-tour-powered {\n      align-self: flex-start;\n      text-align: left;\n      font-size: 13px;\n      margin-top: 26px;\n    }\n\n    \/* Restore the desktop shell structure on every tour screen. *\/\n    .smcm-page .smcm-tour-s3-body,\n    .smcm-page .smcm-tour-s4-body,\n    .smcm-page .smcm-tour-s5-body,\n    .smcm-page .smcm-tour-s6-body,\n    .smcm-page .smcm-tour-s7-body,\n    .smcm-page .smcm-tour-s8-body,\n    .smcm-page .smcm-tour-s9-body,\n    .smcm-page .smcm-tour-slide10,\n    .smcm-page .smcm-tour-s11-body,\n    .smcm-page .smcm-tour-s12-body,\n    .smcm-page .smcm-tour-s13-body {\n      flex-direction: row;\n    }\n\n    .smcm-page .smcm-tour-shell-sidebar {\n      display: flex;\n      width: 200px;\n    }\n\n    .smcm-page .smcm-tour-shell-wizard-subnav {\n      display: block;\n      width: 160px;\n    }\n\n    .smcm-page .smcm-tour-s10-sidebar {\n      display: flex;\n      width: 200px;\n    }\n\n    .smcm-page .smcm-tour-shell-wizard-steps {\n      display: flex;\n    }\n\n    .smcm-page .smcm-tour-shell-side-brand span + *,\n    .smcm-page .smcm-tour-shell-nav-item span:last-child,\n    .smcm-page .smcm-tour-shell-side-foot {\n      display: initial;\n    }\n\n    .smcm-page .smcm-tour-shell-nav-item {\n      justify-content: flex-start;\n      padding: 10px 16px;\n    }\n\n    .smcm-page .smcm-tour-s4-grid {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n\n    .smcm-page .smcm-tour-s4-wide {\n      grid-column: 1 \/ 3;\n    }\n\n    .smcm-page .smcm-tour-s4-ref {\n      grid-column: 3;\n      grid-row: span 3;\n    }\n\n    .smcm-page .smcm-tour-s4-ref-img {\n      height: 110px;\n      max-width: none;\n    }\n\n    .smcm-page .smcm-tour-s4-page-head,\n    .smcm-page .smcm-tour-s3-create-wrap,\n    .smcm-page .smcm-tour-s3-page-head,\n    .smcm-page .smcm-tour-s5-page-head,\n    .smcm-page .smcm-tour-s8-panel-head {\n      flex-direction: row;\n    }\n\n    .smcm-page .smcm-tour-s8-panel-head {\n      align-items: center;\n    }\n\n    .smcm-page .smcm-tour-s8-row3 {\n      grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 0.8fr);\n    }\n\n    .smcm-page .smcm-tour-s9-row3 {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n\n    .smcm-page .smcm-tour-s7-row {\n      flex-direction: row;\n      align-items: center;\n    }\n\n    .smcm-page .smcm-tour-s6-panel,\n    .smcm-page .smcm-tour-s3-table-wrap,\n    .smcm-page .smcm-tour-s5-table,\n    .smcm-page .smcm-tour-s10-table {\n      overflow: hidden;\n    }\n\n    .smcm-page .smcm-tour-s6-table,\n    .smcm-page .smcm-tour-s12-table {\n      display: table;\n      overflow: visible;\n      white-space: normal;\n    }\n\n    .smcm-page .smcm-tour-s3-table-head,\n    .smcm-page .smcm-tour-s3-table-row {\n      grid-template-columns: 28px minmax(0, 1.4fr) repeat(6, minmax(0, 0.8fr));\n      min-width: 0;\n    }\n\n    .smcm-page .smcm-tour-s3-table-head span,\n    .smcm-page .smcm-tour-s3-table-row span,\n    .smcm-page .smcm-tour-s5-thead span,\n    .smcm-page .smcm-tour-s5-row span,\n    .smcm-page .smcm-tour-s10-thead span,\n    .smcm-page .smcm-tour-s10-row span {\n      display: initial;\n    }\n\n    .smcm-page .smcm-tour-s5-thead,\n    .smcm-page .smcm-tour-s5-row {\n      grid-template-columns: 28px minmax(0, 1.4fr) repeat(6, minmax(0, 0.8fr));\n    }\n\n    .smcm-page .smcm-tour-s10-thead,\n    .smcm-page .smcm-tour-s10-row {\n      grid-template-columns: 28px minmax(0, 1.4fr) minmax(0, 0.5fr) minmax(0, 0.5fr) minmax(0, 0.7fr) minmax(0, 0.9fr) minmax(0, 0.8fr) minmax(0, 0.9fr) minmax(0, 0.9fr);\n    }\n\n    .smcm-page .smcm-tour-s10-nav-item,\n    .smcm-page .smcm-tour-s10-nav-sub {\n      font-size: 12px;\n    }\n\n    .smcm-page .smcm-tour-slide2 {\n      min-height: 400px;\n    }\n\n    .smcm-page .smcm-tour-slide2-sidebar {\n      display: flex;\n    }\n\n    .smcm-page .smcm-tour-modal {\n      width: min(520px, 88%);\n      border-radius: 20px;\n    }\n\n    .smcm-page .smcm-tour-s11-callout-wrap {\n      width: min(300px, 48%);\n      align-self: flex-end;\n    }\n\n    .smcm-page .smcm-tour-s13-callout-wrap {\n      align-items: flex-end;\n    }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     TOUR BACKGROUND \u2014 MOBILE \/ TABLET PORTRAIT FIX\n     Keep the same desktop tour composition, but make the decorative\n     background fill the full section behind the scaled tour.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  @media (max-width: 1199px) {\n    .smcm-page .smcm-tour-section::before {\n      left: 0 !important;\n      right: 0 !important;\n      top: 0 !important;\n      bottom: 0 !important;\n      width: 100% !important;\n      transform: none !important;\n      background-size: cover !important;\n      background-position: center center !important;\n      border-radius: 0 !important;\n    }\n  }\n\n  .smcm-compare-subtitle {\n    margin: -24px auto 38px;\n    max-width: 820px;\n    text-align: center;\n    font-family: var(--smcm-font-b) !important;\n    font-size: clamp(14px, 0.95vw, 18px);\n    font-weight: 500;\n    line-height: 1.7;\n    color: var(--smcm-muted);\n  }\n\n  @media (max-width: 768px) {\n    .smcm-compare-subtitle {\n      margin: -14px auto 26px;\n      padding: 0 6px;\n      font-size: 13px;\n      line-height: 1.6;\n    }\n  }\n\n  .smcm-faq-question-heading {\n    margin: 0;\n    padding: 0;\n    font-family: var(--smcm-font-h) !important;\n    font-size: inherit;\n    font-weight: 600;\n    line-height: inherit;\n  }\n\n  .smcm-page .smcm-faq-question-heading .smcm-faq-question,\n  .smcm-page .smcm-faq-question-heading .smcm-faq-question-text {\n    font-family: var(--smcm-font-h) !important;\n  }\n\n  .smcm-page .smcm-faq-question-heading .smcm-faq-question-text {\n    font-size: clamp(18px, 1.08vw, 24px) !important;\n    font-weight: 600 !important;\n    line-height: 1.38 !important;\n    letter-spacing: -0.15px;\n  }\n\n  @media (max-width: 768px) {\n    .smcm-page .smcm-faq-question-heading .smcm-faq-question-text {\n      font-size: 15px !important;\n      line-height: 1.4 !important;\n      letter-spacing: 0;\n    }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     TOUR INTRO IMAGE \u2014 SVG FIT \/ CLEAN WRAPPER FIX\n     The new Image.svg is 588\u00d7532 (landscape-ish), while this wrapper\n     was still using the old portrait 4:5 ratio. That mismatch caused\n     the bottom of the SVG to be cropped on shorter laptop screens.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  .smcm-page .smcm-tour-intro-photo {\n    background: transparent !important;\n    box-shadow: none !important;\n    border: 0 !important;\n    outline: 0 !important;\n\n    \/* Match the actual SVG dimensions instead of the old portrait ratio. *\/\n    aspect-ratio: 588 \/ 532 !important;\n    max-height: none !important;\n\n    \/* Keep clipping only for a clean rounded image edge. *\/\n    overflow: hidden !important;\n    border-radius: 22px !important;\n  }\n\n  .smcm-page .smcm-tour-portrait {\n    width: 100% !important;\n    height: 100% !important;\n\n    \/* Show the entire SVG \u2014 no top anchoring and no cover-cropping. *\/\n    object-fit: contain !important;\n    object-position: center center !important;\n\n    display: block;\n    border-radius: 22px !important;\n    background: transparent !important;\n    border: 0 !important;\n    outline: 0 !important;\n    box-shadow: none !important;\n    filter: none !important;\n  }\n\n  \/* Smaller laptop widths: keep the same image proportions and give\n     it enough width without using any height cap that can crop it. *\/\n  @media (min-width: 1200px) and (max-width: 1440px) {\n    .smcm-page .smcm-tour-intro-photo {\n      flex-basis: 360px !important;\n      width: 360px !important;\n      max-width: 360px !important;\n      max-height: none !important;\n    }\n  }\n\n  \/* The mobile\/tablet tour uses the scaled desktop composition.\n     Preserve the exact same SVG ratio before the whole card scales. *\/\n  @media (max-width: 1199px) {\n    .smcm-page .smcm-tour-intro-photo {\n      flex: 0 0 360px !important;\n      width: 360px !important;\n      max-width: 360px !important;\n      aspect-ratio: 588 \/ 532 !important;\n      max-height: none !important;\n    }\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     ELEMENTOR HOST SPACING FIX\n     Removes Elementor's default 10px populated-column padding only\n     around the column\/widget that contains this Smart Change page.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  .elementor-column-gap-default\n  > .elementor-column\n  > .elementor-element-populated:has(.smcm-page) {\n    padding: 0 !important;\n  }\n\n  .elementor-widget-html:has(.smcm-page),\n  .elementor-widget-html:has(.smcm-page) > .elementor-widget-container {\n    margin: 0 !important;\n    padding: 0 !important;\n  }\n\n  .smcm-page {\n    margin: 0 !important;\n    padding-top: 0 !important;\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     ELEMENTOR HEADER \u2192 HERO GAP FIX\n     DevTools shows the remaining 10px padding is on the LAST\n     Elementor populated column INSIDE the <header>, not on .smcm-page.\n     The previous :has(.smcm-page) rule therefore could not affect it.\n     These selectors remove spacing only from the final header section.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  \/* Elementor Theme Builder header *\/\n  .elementor-location-header .elementor-section:last-child,\n  .elementor-location-header .elementor-section:last-child > .elementor-container,\n  .elementor-location-header .elementor-section:last-child > .elementor-container > .elementor-column {\n    margin-bottom: 0 !important;\n    padding-bottom: 0 !important;\n  }\n\n  .elementor-location-header\n  .elementor-section:last-child\n  .elementor-column-gap-default\n  > .elementor-column\n  > .elementor-element-populated {\n    padding-bottom: 0 !important;\n  }\n\n  \/* Older Elementor header markup using .elementor-section-wrap *\/\n  header\n  .elementor-section-wrap\n  > .elementor-section:last-child\n  .elementor-column-gap-default\n  > .elementor-column\n  > .elementor-element-populated {\n    padding-bottom: 0 !important;\n  }\n\n  header\n  .elementor-section:last-child\n  .elementor-column-gap-default\n  > .elementor-column\n  > .elementor-element-populated {\n    padding-bottom: 0 !important;\n  }\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     ACTUAL SOURCE OF THE GAP \u2014 confirmed via DevTools.\n     Elementor auto-generates page-specific CSS (keyed to this post's\n     ID and this section's own element ID) that sets a fixed\n     padding-bottom on the header's last section \u2014 10px at the\n     2250px+ breakpoint per the screenshot, and likely similar values\n     at other breakpoints too. That rule lives in Elementor's own\n     generated stylesheet, not in this widget's code, but CSS cascades\n     globally so it can still be overridden here. No media query\n     needed \u2014 !important with no breakpoint wins at every width,\n     including the confirmed 2250px+ case.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  .elementor-65684 .elementor-element.elementor-element-43e222e1 {\n    padding-bottom: 0 !important;\n  }\n\n  \/* Belt-and-suspenders: also override inside the exact breakpoint\n     shown in DevTools, in case cascade layering ever changes. *\/\n  @media (min-width: 2250px) {\n    .elementor-65684 .elementor-element.elementor-element-43e222e1 {\n      padding-bottom: 0 !important;\n    }\n  }\n\n  \/* Remove any final section\/column margin Elementor may add below it. *\/\n  header .elementor-section:last-child,\n  header .elementor-section:last-child > .elementor-container,\n  header .elementor-section:last-child .elementor-column,\n  header .elementor-section:last-child .elementor-widget-wrap {\n    margin-bottom: 0 !important;\n  }\n\n  \/* Keep the Smart Change page itself flush with the header. *\/\n  .smcm-page,\n  .elementor-widget-html:has(.smcm-page),\n  .elementor-widget-html:has(.smcm-page) > .elementor-widget-container {\n    margin-top: 0 !important;\n    padding-top: 0 !important;\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     FINAL ELEMENTOR HEADER GAP OVERRIDE\n     The white strip is created by Elementor's:\n     .elementor-column-gap-default > .elementor-column >\n     .elementor-element-populated { padding: 10px; }\n\n     The selected element is inside the HEADER, so override that exact\n     structure there. We keep left\/right\/top spacing untouched and only\n     remove the bottom padding that creates the gap before .smcm-page.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  header .elementor-column-gap-default\n  > .elementor-column\n  > .elementor-element-populated,\n  .elementor-location-header .elementor-column-gap-default\n  > .elementor-column\n  > .elementor-element-populated {\n    padding-bottom: 0 !important;\n  }\n\n  \/* Make sure no bottom margin survives on the last header wrappers. *\/\n  header .elementor-section:last-of-type,\n  header .elementor-container:last-of-type,\n  header .elementor-widget-wrap:last-of-type,\n  .elementor-location-header .elementor-section:last-of-type,\n  .elementor-location-header .elementor-container:last-of-type,\n  .elementor-location-header .elementor-widget-wrap:last-of-type {\n    margin-bottom: 0 !important;\n  }\n\n  \/* Keep the Smart Change widget\/page flush to whatever is directly above it. *\/\n  .elementor-widget-html:has(.smcm-page),\n  .elementor-widget-html:has(.smcm-page) > .elementor-widget-container,\n  .smcm-page {\n    margin-top: 0 !important;\n    padding-top: 0 !important;\n  }\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     The previous version of this fix hardcoded one specific\n     Elementor-generated element ID (elementor-element-9e98e46).\n     That ID is unique to a single widget instance and Elementor can\n     regenerate it \u2014 so it silently stops matching the moment the\n     page\/widget is rebuilt, which is why the white strip kept coming\n     back. Replaced with a structure-agnostic JS fix below that walks\n     up from .smcm-page itself instead of guessing an ID.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     WIDE-SCREEN TYPE + FULL-WIDTH FEATURES + HERO RHYTHM\n     Final cascade override.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n  .smcm-page {\n    --smcm-content-h3-size: clamp(20px, 1.25vw, 32px);\n    --smcm-content-h4-size: clamp(19px, 1.15vw, 30px);\n    --smcm-feature-copy-size: clamp(14px, 0.78vw, 19px);\n    --smcm-callout-h4-size: clamp(15px, 0.95vw, 22px);\n    --smcm-callout-copy-size: var(--smcm-body-copy-size);\n  }\n\n  \/* Tour-slide callouts (the navy \"explainer\" boxes) use bare <h4>\/<p>\n     tags per slide, each previously locked to a flat ~12-13px with no\n     growth at all on wide screens. Bring them into the same fluid\n     scale as the rest of the marketing copy on this page. *\/\n  .smcm-page .smcm-tour-s3-callout h4,\n  .smcm-page .smcm-tour-s6-callout h4,\n  .smcm-page .smcm-tour-s7-callout h4,\n  .smcm-page .smcm-tour-s8-callout h4,\n  .smcm-page .smcm-tour-s9-callout h4,\n  .smcm-page .smcm-tour-s11-callout h4,\n  .smcm-page .smcm-tour-s13-callout h4 {\n    font-size: var(--smcm-callout-h4-size) !important;\n    line-height: 1.32 !important;\n  }\n  .smcm-page .smcm-tour-s3-callout p,\n  .smcm-page .smcm-tour-s6-callout p,\n  .smcm-page .smcm-tour-s7-callout p,\n  .smcm-page .smcm-tour-s8-callout p,\n  .smcm-page .smcm-tour-s9-callout p,\n  .smcm-page .smcm-tour-s11-callout p,\n  .smcm-page .smcm-tour-s13-callout p {\n    font-size: var(--smcm-callout-copy-size) !important;\n    line-height: 1.6 !important;\n  }\n\n  \/* Meaningful content H3s grow much more on 2K\/2.5K displays,\n     while staying compact automatically on tablets\/phones. *\/\n  .smcm-page .smcm-sf-tab-title,\n  .smcm-page .smcm-why-card-title {\n    font-family: var(--smcm-font-h) !important;\n    font-size: var(--smcm-content-h3-size) !important;\n    font-weight: 700 !important;\n    line-height: 1.34 !important;\n    letter-spacing: -0.22px;\n  }\n\n  \/* FAQ questions are semantic H4s: keep them visibly larger on wide screens. *\/\n  .smcm-page .smcm-faq-question-heading,\n  .smcm-page .smcm-faq-question-heading .smcm-faq-question-text,\n  .smcm-page .smcm-faq-question .smcm-faq-question-text {\n    font-family: var(--smcm-font-h) !important;\n    font-size: var(--smcm-content-h4-size) !important;\n    font-weight: 600 !important;\n    line-height: 1.4 !important;\n    letter-spacing: -0.15px;\n  }\n\n  \/* Balance body copy with the larger card\/question typography. *\/\n  .smcm-page .smcm-sf-tab-desc,\n  .smcm-page .smcm-why-card-desc {\n    font-size: var(--smcm-feature-copy-size) !important;\n    line-height: 1.68 !important;\n  }\n\n  \/* \u2500\u2500 Smart Change Features: use the available page width \u2500\u2500 *\/\n  .smcm-page .smcm-sf-section {\n    width: 100% !important;\n    padding-left: clamp(20px, 4.5vw, 120px) !important;\n    padding-right: clamp(20px, 4.5vw, 120px) !important;\n  }\n\n  .smcm-page .smcm-sf-inner {\n    width: 100% !important;\n    max-width: none !important;\n    padding: 0 !important;\n  }\n\n  .smcm-page .smcm-sf-header {\n    width: 100%;\n    max-width: none !important;\n  }\n\n  .smcm-page .smcm-sf-layout {\n    width: 100% !important;\n    max-width: none !important;\n    margin: 0 !important;\n    justify-content: space-between !important;\n    align-items: center !important;\n    gap: clamp(44px, 6vw, 170px) !important;\n  }\n\n  .smcm-page .smcm-sf-tabs {\n    width: auto !important;\n    max-width: none !important;\n    flex: 1 1 44% !important;\n    min-width: 0 !important;\n  }\n\n  .smcm-page .smcm-sf-panel {\n    width: auto !important;\n    max-width: none !important;\n    flex: 1 1 46% !important;\n    min-width: 0 !important;\n    padding: clamp(20px, 2.2vw, 46px) !important;\n  }\n\n  .smcm-page .smcm-sf-media {\n    width: 100% !important;\n    max-width: clamp(420px, 31vw, 760px) !important;\n  }\n\n  .smcm-page .smcm-sf-tab {\n    padding-top: clamp(14px, 0.9vw, 24px) !important;\n    padding-bottom: clamp(14px, 0.9vw, 24px) !important;\n  }\n\n  \/* Medium screens still use the full available width rather than the old\n     320px \/ 360px boxed columns. *\/\n  @media (min-width: 901px) and (max-width: 1199px) {\n    .smcm-page .smcm-sf-section {\n      padding-left: 28px !important;\n      padding-right: 28px !important;\n    }\n\n    .smcm-page .smcm-sf-layout {\n      gap: clamp(34px, 4.5vw, 58px) !important;\n    }\n\n    .smcm-page .smcm-sf-tabs {\n      flex-basis: 45% !important;\n    }\n\n    .smcm-page .smcm-sf-panel {\n      flex-basis: 48% !important;\n      padding: 20px !important;\n    }\n\n    .smcm-page .smcm-sf-media {\n      max-width: 100% !important;\n    }\n  }\n\n  \/* Phone\/tablet stack remains, but remove the old narrow 520px box.\n     Each active feature and its image can use the full screen width. *\/\n  @media (max-width: 900px) {\n    .smcm-page .smcm-sf-section {\n      padding-left: clamp(16px, 4vw, 28px) !important;\n      padding-right: clamp(16px, 4vw, 28px) !important;\n    }\n\n    .smcm-page .smcm-sf-layout {\n      width: 100% !important;\n      max-width: none !important;\n      margin: 0 !important;\n      gap: 10px !important;\n    }\n\n    .smcm-page .smcm-sf-tabs {\n      width: 100% !important;\n      max-width: none !important;\n    }\n\n    .smcm-page .smcm-sf-tab-mobile-img {\n      width: 100% !important;\n      max-width: none !important;\n      margin-left: 0 !important;\n      margin-right: 0 !important;\n      box-shadow: none !important;\n      background: transparent !important;\n    }\n  }\n\n  \/* \u2500\u2500 Hero: reduce excessive top breathing room at every width \u2500\u2500 *\/\n  .smcm-page .smcm-hero {\n    padding-top: clamp(40px, 3vw, 72px) !important;\n  }\n\n  \/* On very small phones keep it compact but not cramped. *\/\n  @media (max-width: 480px) {\n    .smcm-page .smcm-hero {\n      padding-top: 32px !important;\n    }\n\n    .smcm-page {\n      --smcm-content-h3-size: 20px;\n      --smcm-content-h4-size: 19px;\n      --smcm-feature-copy-size: 13.5px;\n      --smcm-callout-h4-size: 15px;\n      --smcm-callout-copy-size: var(--smcm-body-copy-size);\n    }\n  }\n\n  \/* Extra-wide screens: deliberately increase content scale and width.\n     2250px+ was the main weak point in the previous UI. *\/\n  @media (min-width: 2000px) {\n    .smcm-page {\n      --smcm-content-h3-size: clamp(29px, 1.42vw, 38px);\n      --smcm-content-h4-size: clamp(26px, 1.28vw, 35px);\n      --smcm-feature-copy-size: clamp(17px, 0.82vw, 21px);\n      --smcm-callout-h4-size: clamp(20px, 1.05vw, 26px);\n      --smcm-callout-copy-size: var(--smcm-body-copy-size);\n      --smcm-body-copy-size: clamp(22px, 1.05vw, 27px);\n    }\n\n    .smcm-page .smcm-sf-section {\n      padding-left: clamp(90px, 4.5vw, 150px) !important;\n      padding-right: clamp(90px, 4.5vw, 150px) !important;\n    }\n\n    .smcm-page .smcm-sf-layout {\n      gap: clamp(110px, 6vw, 190px) !important;\n    }\n\n    .smcm-page .smcm-sf-media {\n      max-width: clamp(620px, 30vw, 820px) !important;\n    }\n  }\n\n<\/style>\n<\/head>\n<body>\n\n<div class=\"smcm-page\">\n\n<!-- \u2550\u2550 HERO + DASHBOARD \u2014 one continuous section so the dashboard\n     starts growing from the very first scroll, no separate section to\n     \"reach\" first \u2550\u2550 -->\n<section class=\"smcm-hero-dashboard\">\n\n  <div class=\"smcm-hero\">\n    <div class=\"smcm-hero-content\">\n\n      <h1 class=\"smcm-hero-title\">Change Management Software<\/h1>\n\n      <p class=\"smcm-hero-subtitle\">\n        Bring every change, decision, and action from risk assessment to approval and implementation into one connected platform.\n      <\/p>\n\n      <a class=\"smcm-hero-btn\" href=\"\/contact\/\">Book a demo<\/a>\n\n    <\/div>\n  <\/div>\n\n  <div class=\"smcm-reveal-shot-wrap\" id=\"smcmRevealWrap\">\n    <img decoding=\"async\" class=\"smcm-reveal-shot\" id=\"smcmRevealShot\"\n         src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Dashboard-3-1-1-3.png\"\n         alt=\"Smart Change dashboard preview\"\/>\n  <\/div>\n\n<\/section>\n\n<!-- \u2550\u2550 Smart Change Features \u2550\u2550 -->\n<section class=\"smcm-sf-section\">\n  <div class=\"smcm-sf-inner\">\n    <div class=\"smcm-sf-header\">\n      <h2 class=\"smcm-sf-heading\">Digital Change Management <span class=\"smcm-sf-heading-blue\">Features<\/span><\/h2>\n      <p class=\"smcm-sf-subtitle\">Explore the connected tools that help your team assess risk, plan actions, collaborate, and verify every change with confidence.<\/p>\n    <\/div>\n\n    <div class=\"smcm-sf-layout\">\n      <div class=\"smcm-sf-tabs\" id=\"smcmSfTabs\">\n\n        <div class=\"smcm-sf-tab smcm-sf-active\" data-index=\"0\">\n          <h3 class=\"smcm-sf-tab-title\">Automated Risk and Impact Assessment<\/h3>\n          <p class=\"smcm-sf-tab-desc\">Risk assessment criteria apply uniformly across every change. This removes reviewer-to-reviewer variability and ensures consistent decision-making.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Automated-Risk-and-Impact-Assessment.png\" alt=\"Automated Risk and Impact Assessment\"\/>\n        <\/div>\n\n        <div class=\"smcm-sf-tab\" data-index=\"1\">\n          <h3 class=\"smcm-sf-tab-title\">Configurable Workflow Process<\/h3>\n          <p class=\"smcm-sf-tab-desc\">System-level controls prevent a step from closing until its predecessor is complete. This ensures the process is followed without bypassing critical stages.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Configurable-Workflow-Process.png\" alt=\"Configurable Workflow Process\"\/>\n        <\/div>\n\n        <div class=\"smcm-sf-tab\" data-index=\"2\">\n          <h3 class=\"smcm-sf-tab-title\">Cross-Linked Documents and Records<\/h3>\n          <p class=\"smcm-sf-tab-desc\">Change records automatically link to related CAPAs, deviations, documents, and other quality records. This eliminates manual searching and provides complete context for every change.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Cross-Linked-Documents-and-Records.png\" alt=\"Cross-Linked Documents and Records\"\/>\n        <\/div>\n\n        <div class=\"smcm-sf-tab\" data-index=\"3\">\n          <h3 class=\"smcm-sf-tab-title\">Change Action Management<\/h3>\n          <p class=\"smcm-sf-tab-desc\">Track containment, corrective, and preventive actions for every change with due dates, risk levels, and assigned owners to improve accountability and ensure timely closure.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Change-Action-Management.png\" alt=\"Change Action Management\"\/>\n        <\/div>\n\n        <div class=\"smcm-sf-tab\" data-index=\"4\">\n          <h3 class=\"smcm-sf-tab-title\">Automated Escalation<\/h3>\n          <p class=\"smcm-sf-tab-desc\">Overdue tasks automatically trigger system alerts and notifications. This keeps changes moving and prevents important activities from being overlooked.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Automated-Escalation.png\" alt=\"Automated Escalation\"\/>\n        <\/div>\n\n        <div class=\"smcm-sf-tab\" data-index=\"5\">\n          <h3 class=\"smcm-sf-tab-title\">Effectiveness and Reoccurrence Checks<\/h3>\n          <p class=\"smcm-sf-tab-desc\">Post-implementation verification remains linked to the original risk assessment and approval records, providing complete visibility throughout the change lifecycle.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Effectiveness-and-Reoccurrence-Checks.png\" alt=\"Effectiveness and Reoccurrence Checks\"\/>\n        <\/div>\n\n        <div class=\"smcm-sf-tab\" data-index=\"6\">\n          <h3 class=\"smcm-sf-tab-title\">21 CFR Part 11 E-Signatures<\/h3>\n          <p class=\"smcm-sf-tab-desc\">Electronic signatures are securely linked to the user identity, document version, and timestamp, helping maintain regulatory compliance and approval integrity.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/21-CFR-Part-11-E-Signatures.png\" alt=\"21 CFR Part 11 E-Signatures\"\/>\n        <\/div>\n\n        <div class=\"smcm-sf-tab\" data-index=\"7\">\n          <h3 class=\"smcm-sf-tab-title\">Real-Time Dashboards<\/h3>\n          <p class=\"smcm-sf-tab-desc\">Gain live visibility into open and completed changes, identify process bottlenecks, monitor workloads, and make informed decisions with interactive dashboards.<\/p>\n          <div class=\"smcm-sf-tab-progress\"><span class=\"smcm-sf-tab-progress-fill\"><\/span><\/div>\n          <img decoding=\"async\" class=\"smcm-sf-tab-mobile-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Real-Time-Dashboards.png\" alt=\"Real-Time Dashboards\"\/>\n        <\/div>\n\n      <\/div>\n\n      <div class=\"smcm-sf-panel\">\n        <div class=\"smcm-sf-media\" id=\"smcmSfMedia\">\n          <img decoding=\"async\" class=\"smcm-sf-media-img smcm-sf-active\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Automated-Risk-and-Impact-Assessment.png\" alt=\"Automated Risk and Impact Assessment\"\/>\n          <img decoding=\"async\" class=\"smcm-sf-media-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Configurable-Workflow-Process.png\" alt=\"Configurable Workflow Process\"\/>\n          <img decoding=\"async\" class=\"smcm-sf-media-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Cross-Linked-Documents-and-Records.png\" alt=\"Cross-Linked Documents and Records\"\/>\n          <img decoding=\"async\" class=\"smcm-sf-media-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Change-Action-Management.png\" alt=\"Change Action Management\"\/>\n          <img decoding=\"async\" class=\"smcm-sf-media-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Automated-Escalation.png\" alt=\"Automated Escalation\"\/>\n          <img decoding=\"async\" class=\"smcm-sf-media-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Effectiveness-and-Reoccurrence-Checks.png\" alt=\"Effectiveness and Reoccurrence Checks\"\/>\n          <img decoding=\"async\" class=\"smcm-sf-media-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/21-CFR-Part-11-E-Signatures.png\" alt=\"21 CFR Part 11 E-Signatures\"\/>\n          <img decoding=\"async\" class=\"smcm-sf-media-img\" src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Real-Time-Dashboards.png\" alt=\"Real-Time Dashboards\"\/>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     \"How it Works\" tour section \u2014 TEMPORARILY DISABLED for all\n     screens. Entire section commented out below (inner HTML\n     comments were stripped since comments cannot nest). To bring\n     it back, remove this wrapping comment and its matching closer.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n<!--DISABLED-HOW-IT-WORKS-START\n<section class=\"smcm-tour-section\">\n  <h2 class=\"smcm-tour-heading\">How <span class=\"smcm-tour-accent\">it<\/span> Works<\/h2>\n  <p class=\"smcm-tour-subtitle\">Manage change from request to effectiveness review in ten connected steps<\/p>\n\n  <div class=\"smcm-tour-scale-shell\" id=\"smcmTourScaleShell\">\n  <div class=\"smcm-tour-card\">\n    <div class=\"smcm-tour-chrome\">\n      <span class=\"smcm-tour-dot smcm-tour-dot-red\"><\/span>\n      <span class=\"smcm-tour-dot smcm-tour-dot-yellow\"><\/span>\n      <span class=\"smcm-tour-dot smcm-tour-dot-green\"><\/span>\n    <\/div>\n\n    <div class=\"smcm-tour-viewport\" id=\"smcmTourViewport\">\n\n      \n      <div class=\"smcm-tour-slide smcm-tour-active\" data-slide=\"1\">\n        <div class=\"smcm-tour-intro\">\n          <div class=\"smcm-tour-intro-photo\">\n            <img decoding=\"async\" class=\"smcm-tour-portrait\"\n                 src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Entry-Car-100kb.jpg\"\n                 alt=\"Smart Change user\"\/>\n          <\/div>\n          <div class=\"smcm-tour-intro-copy\">\n            <h3 class=\"smcm-tour-intro-title\">Manage change from request to proof it worked in 7 connected steps.<\/h3>\n            <p class=\"smcm-tour-intro-desc\">See how Smart Change provides a clear, structured path for managing change with defined steps<\/p>\n            <button type=\"button\"\n                    class=\"smcm-tour-start-btn smcm-tour-hotspot smcm-tour-hotspot-rect smcm-tour-advance\"\n                    id=\"smcmStartTourBtn\"\n                    data-goto=\"2\">Start tour<\/button>\n            <div class=\"smcm-tour-powered\">Powered by <span>SmartFoodSafe<\/span><\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"2\">\n        <div class=\"smcm-tour-slide2\">\n          <div class=\"smcm-tour-slide2-bg\" aria-hidden=\"true\">\n            <div class=\"smcm-tour-slide2-sidebar\">\n              <div class=\"smcm-tour-slide2-sidebar-item\"><\/div>\n              <div class=\"smcm-tour-slide2-sidebar-item\"><\/div>\n              <div class=\"smcm-tour-slide2-sidebar-item smcm-tour-slide2-active\"><\/div>\n              <div class=\"smcm-tour-slide2-sidebar-item\"><\/div>\n              <div class=\"smcm-tour-slide2-sidebar-item\"><\/div>\n              <div class=\"smcm-tour-slide2-sidebar-item\"><\/div>\n            <\/div>\n            <div class=\"smcm-tour-slide2-main\">\n              <div class=\"smcm-tour-slide2-topbar\"><span class=\"smcm-tour-slide2-pill\"><\/span><\/div>\n              <div class=\"smcm-tour-slide2-rows\">\n                <div class=\"smcm-tour-slide2-row\"><\/div>\n                <div class=\"smcm-tour-slide2-row\"><\/div>\n                <div class=\"smcm-tour-slide2-row\"><\/div>\n                <div class=\"smcm-tour-slide2-row\"><\/div>\n                <div class=\"smcm-tour-slide2-row\"><\/div>\n                <div class=\"smcm-tour-slide2-row\"><\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-modal\">\n            <p class=\"smcm-tour-modal-text\">The Change Management software bring every change, decision, and action from risk assessment to approval and implementation into one connected platform<\/p>\n            <button type=\"button\"\n                    class=\"smcm-tour-modal-btn smcm-tour-hotspot smcm-tour-hotspot-rect smcm-tour-advance\"\n                    data-goto=\"3\">Continue<\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"3\">\n        <div class=\"smcm-tour-slide3\">\n          <aside class=\"smcm-tour-shell-sidebar\">\n            <div class=\"smcm-tour-shell-side-brand\"><span><\/span> SmartFoodSafe<\/div>\n            <nav class=\"smcm-tour-shell-nav\">\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Dashboard<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item smcm-tour-shell-nav-active\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Change Management<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Schedule<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Reporting<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Configurations<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Master Data<\/span><\/div>\n            <\/nav>\n            <div class=\"smcm-tour-shell-side-foot\">V 1.0.7<br\/>Powered by SmartFoodSafe<\/div>\n          <\/aside>\n          <div class=\"smcm-tour-s3-main\">\n            <div class=\"smcm-tour-shell-topbar\">\n              <div class=\"smcm-tour-shell-top-title\">SMART CHANGE MANAGEMENT<\/div>\n              <div class=\"smcm-tour-shell-top-right\">\n                <span class=\"smcm-tour-shell-top-icon\"><\/span>\n                <span class=\"smcm-tour-shell-top-icon\"><\/span>\n                <span class=\"smcm-tour-shell-avatar\">A<\/span>\n              <\/div>\n            <\/div>\n            <div class=\"smcm-tour-s3-body\">\n              <div class=\"smcm-tour-s3-page-head\">\n                <div>\n                  <h3 class=\"smcm-tour-s3-page-title\">Change Management<\/h3>\n                  <div class=\"smcm-tour-s3-crumb\">Smart Change Management \/ Change Management<\/div>\n                <\/div>\n                <div class=\"smcm-tour-s3-create-wrap\">\n                  <button type=\"button\"\n                          class=\"smcm-tour-s3-create smcm-tour-hotspot smcm-tour-hotspot-rect smcm-tour-advance\"\n                          data-goto=\"4\">CREATE<\/button>\n                <\/div>\n              <\/div>\n              <div class=\"smcm-tour-s3-callout-wrap\">\n                <div class=\"smcm-tour-s3-callout\">\n                  <h4>CHANGE REQUEST<\/h4>\n                  <p>Define the proposed change, its purpose, scope, and key details to begin the change management process.<\/p>\n                <\/div>\n              <\/div>\n              <div class=\"smcm-tour-s3-table-wrap\" aria-hidden=\"true\">\n                <div class=\"smcm-tour-s3-table-head\">\n                  <span>Change Name<\/span><span>Change Type<\/span><span>Status<\/span><span>Priority<\/span>\n                  <span>Department<\/span><span>Due Date<\/span><span>Owner<\/span><span>State<\/span>\n                <\/div>\n                <div class=\"smcm-tour-s3-table-row\"><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><\/div>\n                <div class=\"smcm-tour-s3-table-row\"><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><\/div>\n                <div class=\"smcm-tour-s3-table-row\"><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"4\">\n        <div class=\"smcm-tour-slide4\">\n          <aside class=\"smcm-tour-shell-sidebar\">\n            <div class=\"smcm-tour-shell-side-brand\"><span><\/span> SmartFoodSafe<\/div>\n            <nav class=\"smcm-tour-shell-nav\">\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Dashboard<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item smcm-tour-shell-nav-active\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Change Management<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Schedule<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Reporting<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Configurations<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Master Data<\/span><\/div>\n            <\/nav>\n            <div class=\"smcm-tour-shell-side-foot\">V 1.0.7<br\/>Powered by SmartFoodSafe<\/div>\n          <\/aside>\n          <div class=\"smcm-tour-s4-main\">\n            <div class=\"smcm-tour-shell-topbar\">\n              <div class=\"smcm-tour-shell-top-title\">SMART CHANGE MANAGEMENT<\/div>\n              <div class=\"smcm-tour-shell-top-right\">\n                <span class=\"smcm-tour-shell-top-icon\"><\/span>\n                <span class=\"smcm-tour-shell-top-icon\"><\/span>\n                <span class=\"smcm-tour-shell-avatar\">A<\/span>\n              <\/div>\n            <\/div>\n            <div class=\"smcm-tour-s4-body\">\n              <div class=\"smcm-tour-s4-page-head\">\n                <div>\n                  <h3 class=\"smcm-tour-s4-page-title\">CR-2025-0142 - Equipment Related Change<\/h3>\n                  <div class=\"smcm-tour-s4-crumb\">Smart Change Management \/ Change Management \/ CR-2025-0142 - Equipment Related Change<\/div>\n                <\/div>\n                <div class=\"smcm-tour-s4-actions\">\n                  <button type=\"button\" class=\"smcm-tour-s4-edit\" tabindex=\"-1\">EDIT<\/button>\n                  <button type=\"button\"\n                          class=\"smcm-tour-s4-submit smcm-tour-hotspot smcm-tour-hotspot-rect smcm-tour-advance\"\n                          data-goto=\"5\">SUBMIT<\/button>\n                <\/div>\n              <\/div>\n              <div class=\"smcm-tour-s4-card\">\n                <div class=\"smcm-tour-s4-card-title\">Change Initiation<\/div>\n                <div class=\"smcm-tour-s4-grid\">\n                  <div class=\"smcm-tour-s4-field\"><label>Change ID<\/label><div>CR-2025-0142<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Change Title<\/label><div>Equipment Related Change<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Date Initiated<\/label><div>25-Mar-2025<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Change Type<\/label><div>Equipment<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Change Origin<\/label><div>Quality Driven<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Change Source<\/label><div>CAPA<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Change Coordinator<\/label><div>Sam Johnson<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Site<\/label><div>California Site<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Department<\/label><div>QA Department<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Temporary Change<\/label><div>Yes<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Complexity<\/label><div>Moderate<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field\"><label>Priority<\/label><div>Urgent<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field smcm-tour-s4-wide\"><label>Description<\/label><div>Revision Of The Existing Cleaning Procedure To Include Additional Drying Steps And Allergen Control Measures In The QA Area.<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field smcm-tour-s4-ref\">\n                    <label>Change Reference :<\/label>\n                    <div class=\"smcm-tour-s4-ref-img\" role=\"img\" aria-label=\"Change reference photo\"><\/div>\n                  <\/div>\n                  <div class=\"smcm-tour-s4-field smcm-tour-s4-wide\"><label>Justification<\/label><div>To Improve Compliance With Internal Audit Observations And Reduce The Risk Of Cross-Contamination.<\/div><\/div>\n                  <div class=\"smcm-tour-s4-field smcm-tour-s4-wide\"><label>Success Criteria<\/label><div>In Case Of Implementation Issues, Revert To The Previous Approved SOP Version And Notify QA.<\/div><\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"5\">\n        <div class=\"smcm-tour-slide5\">\n          <aside class=\"smcm-tour-shell-sidebar\">\n            <div class=\"smcm-tour-shell-side-brand\"><span><\/span> SmartFoodSafe<\/div>\n            <nav class=\"smcm-tour-shell-nav\">\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Dashboard<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item smcm-tour-shell-nav-active\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Change Management<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Schedule<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Reporting<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Configurations<\/span><\/div>\n              <div class=\"smcm-tour-shell-nav-item\"><span class=\"smcm-tour-shell-nav-ico\"><\/span><span>Master Data<\/span><\/div>\n            <\/nav>\n            <div class=\"smcm-tour-shell-side-foot\">V 1.0.7<br\/>Powered by SmartFoodSafe<\/div>\n          <\/aside>\n          <div class=\"smcm-tour-s5-main\">\n            <div class=\"smcm-tour-shell-topbar\">\n              <div class=\"smcm-tour-shell-top-title\">SMART CHANGE MANAGEMENT<\/div>\n              <div class=\"smcm-tour-shell-top-right\">\n                <span class=\"smcm-tour-shell-top-icon\"><\/span>\n                <span class=\"smcm-tour-shell-top-icon\"><\/span>\n                <span class=\"smcm-tour-shell-avatar\">A<\/span>\n              <\/div>\n            <\/div>\n            <div class=\"smcm-tour-s5-body\">\n              <div class=\"smcm-tour-s5-page-head\">\n                <div>\n                  <h3 class=\"smcm-tour-s5-page-title\">Change Management<\/h3>\n                  <div class=\"smcm-tour-s5-crumb\">Smart Change Management \/ Change Management<\/div>\n                <\/div>\n                <button type=\"button\" class=\"smcm-tour-s5-create\" tabindex=\"-1\">CREATE<\/button>\n              <\/div>\n              <div class=\"smcm-tour-s5-search\">Search<\/div>\n              <div class=\"smcm-tour-s5-tabs\">\n                <div class=\"smcm-tour-s5-tab\">MY ACTIONS<\/div>\n                <div class=\"smcm-tour-s5-tab smcm-tour-s5-tab-active\">INPROGRESS<\/div>\n                <div class=\"smcm-tour-s5-tab\">COMPLETED<\/div>\n                <div class=\"smcm-tour-s5-tab\">ARCHIVED<\/div>\n              <\/div>\n              <div class=\"smcm-tour-s5-table\">\n                <div class=\"smcm-tour-s5-thead\">\n                  <span><\/span>\n                  <span>Change Name<\/span>\n                  <span>Change Type<\/span>\n                  <span>Source<\/span>\n                  <span>Cordinator<\/span>\n                  <span>Department<\/span>\n                  <span>Due Date<\/span>\n                  <span>Priority<\/span>\n                  <span>Status<\/span>\n                <\/div>\n                <button type=\"button\"\n                        class=\"smcm-tour-s5-row smcm-tour-s5-row-active smcm-tour-hotspot smcm-tour-hotspot-rect smcm-tour-advance\"\n                        data-goto=\"6\">\n                  <span class=\"smcm-tour-s5-check\"><\/span>\n                  <span><strong>CI-1234<\/strong> Equipment Change Request<\/span>\n                  <span>Process<\/span>\n                  <span>CAPA<\/span>\n                  <span>Sam<\/span>\n                  <span>QA<\/span>\n                  <span>23\/04\/2026<\/span>\n                  <span>Low<\/span>\n                  <span class=\"smcm-tour-s5-status\">Assessment<\/span>\n                <\/button>\n                <div class=\"smcm-tour-s5-blur-rows\" aria-hidden=\"true\">\n                  <div class=\"smcm-tour-s5-row\"><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><\/div>\n                  <div class=\"smcm-tour-s5-row\"><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"6\">\n        <div class=\"smcm-tour-slide6\">\n          <div class=\"smcm-tour-shell-wizard-top\">\n            <div class=\"smcm-tour-shell-wizard-top-title\">CR-2025-0142 - Equipment Related Change<\/div>\n            <div class=\"smcm-tour-shell-wizard-top-actions\">\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">CANCEL<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">SAVE<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-solid\" tabindex=\"-1\">SUBMIT<\/button>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-shell-wizard-steps\">\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Change Request<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-current\">Assessment<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Planning<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Effectiveness Review<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Cost Of Quality<\/div>\n          <\/div>\n          <div class=\"smcm-tour-s6-body\">\n            <aside class=\"smcm-tour-shell-wizard-subnav\">\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Change Information<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Initiation<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Impact<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Feasibility Study<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item smcm-tour-shell-wizard-active\">Impact Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Containment<\/div>\n            <\/aside>\n            <div class=\"smcm-tour-s6-content\">\n              <div class=\"smcm-tour-s6-callout-wrap\">\n                <div class=\"smcm-tour-s6-callout\">\n                  <h4>IMPACT ASSESSMENT<\/h4>\n                  <p>Evaluate how the proposed change may affect processes, products, systems, people, compliance, and food safety.<\/p>\n                <\/div>\n                <button type=\"button\"\n                        class=\"smcm-tour-s6-hotspot-btn smcm-tour-hotspot smcm-tour-advance\"\n                        data-goto=\"7\"\n                        aria-label=\"Continue to next step\"><\/button>\n              <\/div>\n              <div class=\"smcm-tour-s6-panel\">\n                <div class=\"smcm-tour-s6-panel-title\">Impact Assessment<\/div>\n                <table class=\"smcm-tour-s6-table\">\n                  <thead>\n                    <tr><th>Impact Type<\/th><th>Response<\/th><th>Comments<\/th><\/tr>\n                  <\/thead>\n                  <tbody>\n                    <tr><td>Product Quality Risk<\/td><td>Yes<\/td><td>Product quality will be verified after implementation.<\/td><\/tr>\n                    <tr><td>Product Safety Risk<\/td><td>Yes<\/td><td>Food safety controls will be reviewed and confirmed.<\/td><\/tr>\n                    <tr><td>Health and Safety Risk<\/td><td>No<\/td><td>No health or safety concerns identified.<\/td><\/tr>\n                    <tr><td>Regulatory Risk<\/td><td>Yes<\/td><td>Regulatory compliance will be verified.<\/td><\/tr>\n                    <tr class=\"smcm-tour-s6-req\"><td>Risk Assessment Required ?<\/td><td>Yes<\/td><td>Risk Assessment Type : Risk Matrix<\/td><\/tr>\n                  <\/tbody>\n                <\/table>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"7\">\n        <div class=\"smcm-tour-slide7\">\n          <div class=\"smcm-tour-shell-wizard-top\">\n            <div class=\"smcm-tour-shell-wizard-top-title\">CR-2025-0142 - Equipment Related Change<\/div>\n            <div class=\"smcm-tour-shell-wizard-top-actions\">\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">CANCEL<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">SAVE<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-solid\" tabindex=\"-1\">SUBMIT<\/button>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-shell-wizard-steps\">\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Change Request<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-current\">Assessment<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Planning<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Effectiveness Review<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Cost Of Quality<\/div>\n          <\/div>\n          <div class=\"smcm-tour-s7-body\">\n            <aside class=\"smcm-tour-shell-wizard-subnav\">\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Change Information<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Initiation<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Impact<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Feasibility Study<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Impact Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item smcm-tour-shell-wizard-active\">Risk Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Containment<\/div>\n            <\/aside>\n            <div class=\"smcm-tour-s7-content\">\n              <div class=\"smcm-tour-s7-page-title\">CR-2025-0142 - Equipment Related Change<\/div>\n              <div class=\"smcm-tour-s7-crumb\">Smart Change Management \/ Change Management \/ CR-2025-0142 - Equipment Related Change<\/div>\n              <div class=\"smcm-tour-s7-blur-top\" aria-hidden=\"true\"><\/div>\n              <div class=\"smcm-tour-s7-callout-wrap\">\n                <div class=\"smcm-tour-s7-callout\">\n                  <h4>RISK ASSESSMENT<\/h4>\n                  <p>Objectively evaluate change-related risks using a structured decision tree, with built-in recurrence checks to prevent repeat issues.<\/p>\n                <\/div>\n                <button type=\"button\"\n                        class=\"smcm-tour-s7-hotspot-btn smcm-tour-hotspot smcm-tour-advance\"\n                        data-goto=\"8\"\n                        aria-label=\"Continue to next step\"><\/button>\n              <\/div>\n              <div class=\"smcm-tour-s7-panel\">\n                <div class=\"smcm-tour-s7-panel-title\">Risk Assessment<\/div>\n                <div class=\"smcm-tour-s7-qa\">\n                  <div class=\"smcm-tour-s7-row\">\n                    <div class=\"smcm-tour-s7-q\">Is There A Non-Compliance With A Requirement Regarding Food Safety, Quality, Legality, Authenticity Or Security?<\/div>\n                    <div class=\"smcm-tour-s7-select\">Yes<\/div>\n                  <\/div>\n                  <div class=\"smcm-tour-s7-row\">\n                    <div class=\"smcm-tour-s7-q\">Is The Non- Compliance Severe Or Systemic?<\/div>\n                    <div class=\"smcm-tour-s7-select\">No<\/div>\n                  <\/div>\n                  <div class=\"smcm-tour-s7-row\">\n                    <div class=\"smcm-tour-s7-q\">Is There A Probability Of Impact On The Conformity Of The Product?<\/div>\n                    <div class=\"smcm-tour-s7-select\">Yes<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"smcm-tour-s7-insight\">\n                  <div class=\"smcm-tour-s7-insight-text\">Insight : This Is A Major Non-Conformance Occurence<\/div>\n                  <div class=\"smcm-tour-s7-level\">\n                    <span>Incident Level :<\/span>\n                    <span class=\"smcm-tour-s7-level-badge\">Major<\/span>\n                  <\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"8\">\n        <div class=\"smcm-tour-slide8\">\n          <div class=\"smcm-tour-shell-wizard-top\">\n            <div class=\"smcm-tour-shell-wizard-top-title\">CR-2025-0142 - Equipment Related Change<\/div>\n            <div class=\"smcm-tour-shell-wizard-top-actions\">\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">CANCEL<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">SAVE<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-solid\" tabindex=\"-1\">SUBMIT<\/button>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-shell-wizard-steps\">\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Change Request<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Assessment<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-current\">Planning<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Effectiveness Review<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Cost Of Quality<\/div>\n          <\/div>\n          <div class=\"smcm-tour-s8-body\">\n            <aside class=\"smcm-tour-shell-wizard-subnav\">\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Change Information<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Initiation<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Impact<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Feasibility Study<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Impact Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Containment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Action Planning<\/div>\n              <button type=\"button\"\n                      class=\"smcm-tour-s8-nav-btn smcm-tour-s8-nav-hotspot smcm-tour-hotspot smcm-tour-advance\"\n                      data-goto=\"9\">Task Details<\/button>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Acknowledgement<\/div>\n            <\/aside>\n            <div class=\"smcm-tour-s8-content\">\n              <div class=\"smcm-tour-s8-panel\">\n                <div class=\"smcm-tour-s8-panel-head\">\n                  <div class=\"smcm-tour-s8-panel-title\">Task Details<\/div>\n                <\/div>\n                <div class=\"smcm-tour-s8-field\">\n                  <label>Task Type<\/label>\n                  <div class=\"smcm-tour-s8-input\">Document Review<\/div>\n                <\/div>\n                <div class=\"smcm-tour-s8-row3\">\n                  <div class=\"smcm-tour-s8-field\">\n                    <label>Document Name<\/label>\n                    <div class=\"smcm-tour-s8-input\">Weekly Audit Document<\/div>\n                  <\/div>\n                  <div class=\"smcm-tour-s8-field\">\n                    <label>Reviewer<\/label>\n                    <div class=\"smcm-tour-s8-input\">Sam Johnson<\/div>\n                  <\/div>\n                  <div class=\"smcm-tour-s8-field\">\n                    <label>Due Date<\/label>\n                    <div class=\"smcm-tour-s8-input\">30\/04\/2026<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"smcm-tour-s8-field\">\n                  <label>Review Comments<\/label>\n                  <div class=\"smcm-tour-s8-comments\"><\/div>\n                <\/div>\n                <div class=\"smcm-tour-s8-callout-wrap\">\n                  <div class=\"smcm-tour-s8-callout\">\n                    <h4>ACTION PLAN &amp; APPROVAL<\/h4>\n                    <p>Define required actions, assign responsibilities and timelines, and route the plan through approval workflows before implementation.<\/p>\n                  <\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"9\">\n        <div class=\"smcm-tour-slide9\">\n          <div class=\"smcm-tour-shell-wizard-steps\" style=\"border-bottom:1px solid #E6EBF4;background:#fff;\">\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Change Request<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Assessment<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-current\">Planning<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Effectiveness Review<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Cost Of Quality<\/div>\n          <\/div>\n          <div class=\"smcm-tour-s9-body\">\n            <aside class=\"smcm-tour-shell-wizard-subnav\">\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Change Information<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Initiation<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Impact<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Feasibility Study<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Impact Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Containment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Action Planning<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item smcm-tour-shell-wizard-active\">Task Details<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Acknowledgement<\/div>\n            <\/aside>\n            <div class=\"smcm-tour-s9-content\">\n              <div class=\"smcm-tour-s9-blur-top\" aria-hidden=\"true\"><\/div>\n              <div class=\"smcm-tour-s9-callout-wrap\">\n                <div class=\"smcm-tour-s9-callout\">\n                  <h4>IMPLEMENTATION<\/h4>\n                  <p>Assign and track implementation tasks, monitor due dates, notify responsible users, and verify action plan completion.<\/p>\n                <\/div>\n                <button type=\"button\"\n                        class=\"smcm-tour-s9-hotspot-btn smcm-tour-hotspot smcm-tour-advance\"\n                        data-goto=\"10\"\n                        aria-label=\"Continue to next step\"><\/button>\n              <\/div>\n              <div class=\"smcm-tour-s9-panel\">\n                <div class=\"smcm-tour-s9-panel-title\">Acknowledgement<\/div>\n                <div class=\"smcm-tour-s9-row3\">\n                  <div class=\"smcm-tour-s9-field\">\n                    <label>Acknowledgement<\/label>\n                    <div class=\"smcm-tour-s9-input\">Yes<\/div>\n                  <\/div>\n                  <div class=\"smcm-tour-s9-field\">\n                    <label>Due Date<\/label>\n                    <div class=\"smcm-tour-s9-input\">30\/4\/2026<\/div>\n                  <\/div>\n                  <div class=\"smcm-tour-s9-field\">\n                    <label>Reminder Notification<\/label>\n                    <div class=\"smcm-tour-s9-input\">Yes<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"smcm-tour-s9-tabs\">\n                  <div class=\"smcm-tour-s9-tab\">MAIL<\/div>\n                  <div class=\"smcm-tour-s9-tab smcm-tour-s9-tab-active\">SETTINGS<\/div>\n                <\/div>\n                <div class=\"smcm-tour-s9-setting\">\n                  <span>Before Due Date :<\/span>\n                  <div class=\"smcm-tour-s9-toggle\">Enable <span class=\"smcm-tour-s9-toggle-dot\"><\/span><\/div>\n                <\/div>\n                <div class=\"smcm-tour-s9-hint\">Select the Intervals <strong>1<\/strong> for sending reminder notifications until the due date.<\/div>\n                <div class=\"smcm-tour-s9-setting\">\n                  <span>On Due Date :<\/span>\n                  <div class=\"smcm-tour-s9-toggle\">Enable <span class=\"smcm-tour-s9-toggle-dot\"><\/span><\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"10\">\n        <div class=\"smcm-tour-slide10\">\n          <aside class=\"smcm-tour-s10-sidebar\">\n            <div class=\"smcm-tour-s10-nav-item\">Dashboard<\/div>\n            <div class=\"smcm-tour-s10-nav-item smcm-tour-s10-active\">My Actions<\/div>\n            <div class=\"smcm-tour-s10-nav-sub\">Workflow<\/div>\n            <div class=\"smcm-tour-s10-nav-sub smcm-tour-s10-active\">Review<\/div>\n            <div class=\"smcm-tour-s10-nav-sub\">Expiry<\/div>\n            <div class=\"smcm-tour-s10-nav-sub\">Collaboration Request<\/div>\n            <div class=\"smcm-tour-s10-nav-item\">Standards<\/div>\n            <div class=\"smcm-tour-s10-nav-item\">Custom Folders<\/div>\n            <div class=\"smcm-tour-s10-nav-item\">Corporate<\/div>\n            <div class=\"smcm-tour-s10-nav-item\">Workflow<\/div>\n            <div class=\"smcm-tour-s10-nav-item\">Reporting<\/div>\n            <div class=\"smcm-tour-s10-nav-item\">Activity Log<\/div>\n            <div class=\"smcm-tour-s10-nav-item\">Configuration<\/div>\n          <\/aside>\n          <div class=\"smcm-tour-s10-main\">\n            <div class=\"smcm-tour-s10-topbar\">\n              <div class=\"smcm-tour-s10-top-title\">SMART DOCS<\/div>\n              <div class=\"smcm-tour-shell-top-right\">\n                <span class=\"smcm-tour-shell-top-icon\"><\/span>\n                <span class=\"smcm-tour-shell-avatar\">JA<\/span>\n              <\/div>\n            <\/div>\n            <div class=\"smcm-tour-s10-body\">\n              <h3 class=\"smcm-tour-s10-page-title\">Review<\/h3>\n              <div class=\"smcm-tour-s10-crumb\">Smart Docs \/ My Actions \/ Review<\/div>\n              <div class=\"smcm-tour-s10-search\">Search<\/div>\n              <div class=\"smcm-tour-s10-tabs\">\n                <div class=\"smcm-tour-s10-tab\">MY ACTIONS<\/div>\n                <div class=\"smcm-tour-s10-tab smcm-tour-s10-tab-active\">ALL ACTIONS<\/div>\n                <div class=\"smcm-tour-s10-tab\">REVIEW SOON<\/div>\n                <div class=\"smcm-tour-s10-tab\">IN PROGRESS<\/div>\n                <div class=\"smcm-tour-s10-tab\">COMPLETED<\/div>\n              <\/div>\n              <div class=\"smcm-tour-s10-table\">\n                <div class=\"smcm-tour-s10-thead\">\n                  <span><\/span>\n                  <span>Doc Name<\/span>\n                  <span>Version<\/span>\n                  <span>Type<\/span>\n                  <span>Context<\/span>\n                  <span>Section<\/span>\n                  <span>Created By<\/span>\n                  <span>Submitted On<\/span>\n                  <span>Status<\/span>\n                <\/div>\n                <button type=\"button\"\n                        class=\"smcm-tour-s10-row smcm-tour-s10-row-active smcm-tour-hotspot smcm-tour-hotspot-rect smcm-tour-advance\"\n                        data-goto=\"11\">\n                  <span class=\"smcm-tour-s10-check\"><\/span>\n                  <span>Weekly Audit Document<\/span>\n                  <span>1<\/span>\n                  <span>\ud83d\udcca<\/span>\n                  <span>FSSC<\/span>\n                  <span>Weekly Audit<\/span>\n                  <span>Sam John<\/span>\n                  <span>30\/04\/2026<\/span>\n                  <span>Pending Review<\/span>\n                <\/button>\n                <div class=\"smcm-tour-s10-blur\" aria-hidden=\"true\">\n                  <div class=\"smcm-tour-s10-row\"><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><\/div>\n                  <div class=\"smcm-tour-s10-row\"><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"11\">\n        <div class=\"smcm-tour-slide11\">\n          <div class=\"smcm-tour-shell-wizard-top\">\n            <div class=\"smcm-tour-shell-wizard-top-title\">CR-2025-0142 - Equipment Related Change<\/div>\n            <div class=\"smcm-tour-shell-wizard-top-actions\">\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">CANCEL<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">SAVE<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-solid\" tabindex=\"-1\">SUBMIT<\/button>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-shell-wizard-steps\">\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Change Request<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Assessment<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Planning<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-current\">Effectiveness Review<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Cost Of Quality<\/div>\n          <\/div>\n          <div class=\"smcm-tour-s11-body\">\n            <aside class=\"smcm-tour-shell-wizard-subnav\">\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Change Information<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Initiation<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Impact<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Feasibility Study<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Impact Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Containment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Action Planning<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Task Details<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Acknowledgement<\/div>\n            <\/aside>\n            <div class=\"smcm-tour-s11-content\">\n              <div class=\"smcm-tour-s11-panel\">\n                <div class=\"smcm-tour-s11-panel-title\">Effectiveness Details<\/div>\n                <div class=\"smcm-tour-s11-block\">\n                  <div class=\"smcm-tour-s11-label\">REVIEW<\/div>\n                  <div class=\"smcm-tour-s11-block-body\">\n                    <div class=\"smcm-tour-s11-q\">Success Criteria :<\/div>\n                    <div class=\"smcm-tour-s11-text\">Verify the revised cleaning procedure meets the defined drying and allergen-control requirements across all production lines.<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"smcm-tour-s11-block\">\n                  <div class=\"smcm-tour-s11-label\">VERIFICATION<\/div>\n                  <div class=\"smcm-tour-s11-block-body\">\n                    <div class=\"smcm-tour-s11-row\">\n                      <div class=\"smcm-tour-s11-q\">Has The Change Management Implemented Successfully Based On The Success Criteria ?<\/div>\n                      <span class=\"smcm-tour-s11-badge-no\">No<\/span>\n                    <\/div>\n                    <div class=\"smcm-tour-s11-text\"><strong>Comments :<\/strong> Additional verification required before the change can be marked effective.<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"smcm-tour-s11-blur\" aria-hidden=\"true\"><\/div>\n              <\/div>\n              <div class=\"smcm-tour-s11-callout-wrap\">\n                <button type=\"button\"\n                        class=\"smcm-tour-s11-hotspot-btn smcm-tour-hotspot smcm-tour-advance\"\n                        data-goto=\"12\"\n                        aria-label=\"Continue to next step\"><\/button>\n                <div class=\"smcm-tour-s11-callout\">\n                  <h4>VALIDATION<\/h4>\n                  <p>Confirm implemented changes are effective, meet intended objectives, and have not introduced new risks.<\/p>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"12\">\n        <div class=\"smcm-tour-slide12\">\n          <div class=\"smcm-tour-shell-wizard-top\">\n            <div class=\"smcm-tour-shell-wizard-top-title\">CR-2025-0142 - Equipment Related Change<\/div>\n            <div class=\"smcm-tour-shell-wizard-top-actions\">\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">CANCEL<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">SAVE<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-solid\" tabindex=\"-1\">SUBMIT<\/button>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-shell-wizard-steps\">\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Change Request<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Assessment<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Planning<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-current\">Effectiveness Review<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Cost Of Quality<\/div>\n          <\/div>\n          <div class=\"smcm-tour-s12-body\">\n            <aside class=\"smcm-tour-shell-wizard-subnav\">\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Change Information<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Initiation<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Impact<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Feasibility Study<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Impact Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Containment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Action Planning<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Task Details<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Acknowledgement<\/div>\n            <\/aside>\n            <div class=\"smcm-tour-s12-content\">\n              <div class=\"smcm-tour-s12-blur\" aria-hidden=\"true\"><\/div>\n              <div class=\"smcm-tour-s12-panel\">\n                <div class=\"smcm-tour-s12-panel-title\">CA-PA Status<\/div>\n                <table class=\"smcm-tour-s12-table\">\n                  <thead>\n                    <tr>\n                      <th>Non-Conformance<\/th>\n                      <th>Completed By<\/th>\n                      <th>Completed Date<\/th>\n                      <th>Review<\/th>\n                    <\/tr>\n                  <\/thead>\n                  <tbody>\n                    <tr>\n                      <td>CA-1234 - New Nonconformance Details<\/td>\n                      <td>Sam Johnson<\/td>\n                      <td>23\/04\/2026<\/td>\n                      <td><span class=\"smcm-tour-s12-select\">ACCEPT<\/span><\/td>\n                    <\/tr>\n                    <tr>\n                      <td>CA-1266 - New Nonconformance Details<\/td>\n                      <td>John Doe<\/td>\n                      <td>30\/04\/2026<\/td>\n                      <td><span class=\"smcm-tour-s12-select\" style=\"cursor:default;\">REJECT<\/span><\/td>\n                    <\/tr>\n                  <\/tbody>\n                <\/table>\n              <\/div>\n              <div class=\"smcm-tour-s12-hotspot-wrap\">\n                <button type=\"button\"\n                        class=\"smcm-tour-s12-hotspot-btn smcm-tour-hotspot smcm-tour-advance\"\n                        data-goto=\"13\"\n                        aria-label=\"Continue to next step\"><\/button>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"13\">\n        <div class=\"smcm-tour-slide13\">\n          <div class=\"smcm-tour-shell-wizard-top\">\n            <div class=\"smcm-tour-shell-wizard-top-title\">CR-2025-0142 - Equipment Related Change<\/div>\n            <div class=\"smcm-tour-shell-wizard-top-actions\">\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">CANCEL<\/button>\n              <button type=\"button\" class=\"smcm-tour-shell-wizard-btn smcm-tour-shell-wizard-btn-outline\" tabindex=\"-1\">SAVE<\/button>\n              <button type=\"button\"\n                      class=\"smcm-tour-s13-submit smcm-tour-hotspot smcm-tour-hotspot-rect smcm-tour-advance\"\n                      data-goto=\"14\">SUBMIT<\/button>\n            <\/div>\n            <div class=\"smcm-tour-s13-callout-wrap\">\n              <div class=\"smcm-tour-s13-callout\">\n                <h4>CLOSE CHANGE REQUEST<\/h4>\n                <p>Verify all actions, approvals, and effectiveness checks are complete before formally closing the change request.<\/p>\n              <\/div>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-shell-wizard-steps\">\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Change Request<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Assessment<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-done\">Planning<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step smcm-tour-shell-wizard-current\">Effectiveness Review<\/div>\n            <span class=\"smcm-tour-shell-wizard-step-line\"><\/span>\n            <div class=\"smcm-tour-shell-wizard-step\">Cost Of Quality<\/div>\n          <\/div>\n          <div class=\"smcm-tour-s13-body\">\n            <aside class=\"smcm-tour-shell-wizard-subnav\">\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Change Information<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Initiation<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Change Impact<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Feasibility Study<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Impact Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Assessment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Risk Containment<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-group\">Action Planning<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Task Details<\/div>\n              <div class=\"smcm-tour-shell-wizard-subnav-item\">Acknowledgement<\/div>\n            <\/aside>\n            <div class=\"smcm-tour-s13-content\">\n              <div class=\"smcm-tour-s13-blur\" aria-hidden=\"true\"><\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      \n      <div class=\"smcm-tour-slide\" data-slide=\"14\">\n        <div class=\"smcm-tour-slide14\">\n          <div class=\"smcm-tour-s14-bg\" aria-hidden=\"true\">\n            <div class=\"smcm-tour-s14-bg-side\"><\/div>\n            <div class=\"smcm-tour-s14-bg-main\">\n              <div class=\"smcm-tour-s14-bg-row\"><\/div>\n              <div class=\"smcm-tour-s14-bg-row\"><\/div>\n              <div class=\"smcm-tour-s14-bg-row\"><\/div>\n              <div class=\"smcm-tour-s14-bg-row\"><\/div>\n              <div class=\"smcm-tour-s14-bg-row\"><\/div>\n              <div class=\"smcm-tour-s14-bg-row\"><\/div>\n            <\/div>\n          <\/div>\n          <div class=\"smcm-tour-s14-modal\">\n            <h3 class=\"smcm-tour-s14-title\">Manage Change Without Losing Control From Today<\/h3>\n            <p class=\"smcm-tour-s14-desc\">Schedule a personalized demo to see Change Management full capabilities.<\/p>\n            <a class=\"smcm-tour-s14-btn\"\n               href=\"https:\/\/calendly.com\/smartfoodsafe\/60-minutes\"\n               target=\"_blank\"\n               rel=\"noopener noreferrer\">Book Demo<\/a>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <\/div>\n\n      <div class=\"smcm-tour-footer\">\n        <div class=\"smcm-tour-nav\">\n          <button type=\"button\" class=\"smcm-tour-nav-btn\" id=\"smcmTourPrev\" aria-label=\"Previous\">\u2039<\/button>\n          <span class=\"smcm-tour-counter\" id=\"smcmTourCounter\">1\/14<\/span>\n          <button type=\"button\" class=\"smcm-tour-nav-btn\" id=\"smcmTourNext\" aria-label=\"Next\">\u203a<\/button>\n        <\/div>\n      <\/div>\n\n    <\/div>\n<\/div>\n<\/section>\nDISABLED-HOW-IT-WORKS-END-->\n\n<!-- \u2550\u2550 WHY CHOOSE SMART FOOD SAFE \u2550\u2550 -->\n<section class=\"smcm-why-section\" aria-labelledby=\"smcmWhyHeading\">\n  <div class=\"smcm-why-inner\">\n    <div class=\"smcm-why-header\">\n      <h2 class=\"smcm-why-heading\" id=\"smcmWhyHeading\">Why <span class=\"smcm-why-heading-blue\">Smart Food Safe\u2019s Change Management?<\/span><\/h2>\n      <p class=\"smcm-why-sub\">Generic change-control systems can document a change. Smart Food Safe connects the change to the food safety and quality processes it can affect.<\/p>\n    <\/div>\n\n    <div class=\"smcm-why-panel\">\n      <div class=\"smcm-why-track-wrap\" id=\"smcmWhyTrackWrap\">\n        <div class=\"smcm-why-track\" id=\"smcmWhyTrack\">\n\n          <div class=\"smcm-why-page\">\n            <article class=\"smcm-why-card smcm-why-card--divider\">\n              <div class=\"smcm-why-icon\" aria-hidden=\"true\">\n                <svg class=\"smcm-why-icon-svg\" aria-hidden=\"true\" focusable=\"false\" width=\"140\" height=\"140\" viewBox=\"0 0 140 140\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<g>\n<path d=\"M0 48C0 31.1984 0 22.7976 3.2698 16.3803C6.14601 10.7354 10.7354 6.14601 16.3803 3.2698C22.7976 0 31.1984 0 48 0H92C108.802 0 117.202 0 123.62 3.2698C129.265 6.14601 133.854 10.7354 136.73 16.3803C140 22.7976 140 31.1984 140 48V92C140 108.802 140 117.202 136.73 123.62C133.854 129.265 129.265 133.854 123.62 136.73C117.202 140 108.802 140 92 140H48C31.1984 140 22.7976 140 16.3803 136.73C10.7354 133.854 6.14601 129.265 3.2698 123.62C0 117.202 0 108.802 0 92V48Z\" fill=\"url(#paint0_linear_1609_3750)\"\/>\n\n<path d=\"M63.3335 90H66.6668V76.6667C68.0557 76.6667 69.2363 76.1806 70.2085 75.2083C71.1807 74.2361 71.6668 73.0556 71.6668 71.6667V61.6667H68.3335V71.6667H66.6668V61.6667H63.3335V71.6667H61.6668V61.6667H58.3335V71.6667C58.3335 73.0556 58.8196 74.2361 59.7918 75.2083C60.7641 76.1806 61.9446 76.6667 63.3335 76.6667V90ZM76.6668 90H80.0002V61.6667C78.1668 61.6667 76.5974 62.3194 75.2918 63.625C73.9863 64.9306 73.3335 66.5 73.3335 68.3333V78.3333H76.6668V90ZM43.3335 100V60L70.0002 40L96.6668 60V100H43.3335ZM50.0002 93.3333H90.0002V63.3333L70.0002 48.3333L50.0002 63.3333V93.3333Z\" fill=\"white\"\/>\n<\/g>\n<defs>\n\n<linearGradient id=\"paint0_linear_1609_3750\" x1=\"140\" y1=\"132.65\" x2=\"5.25\" y2=\"6.02379e-07\" gradientUnits=\"userSpaceOnUse\">\n<stop stop-color=\"#B5D3FF\"\/>\n<stop offset=\"0.481457\" stop-color=\"#3D8CFF\"\/>\n<stop offset=\"1\" stop-color=\"#3D8CFF\"\/>\n<\/linearGradient>\n<\/defs>\n<\/svg>\n              <\/div>\n              <div class=\"smcm-why-body\">\n                <h3 class=\"smcm-why-card-title\">Purpose-Built for the Food Industry<\/h3>\n                <p class=\"smcm-why-card-desc\">Designed specifically for food manufacturing and food safety, with workflows that reflect industry requirements rather than generic projects or IT change management.<\/p>\n              <\/div>\n            <\/article>\n\n            <article class=\"smcm-why-card\">\n              <div class=\"smcm-why-icon\" aria-hidden=\"true\">\n                <svg class=\"smcm-why-icon-svg\" aria-hidden=\"true\" focusable=\"false\" width=\"140\" height=\"140\" viewBox=\"0 0 140 140\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<g>\n<path d=\"M0 48C0 31.1984 0 22.7976 3.2698 16.3803C6.14601 10.7354 10.7354 6.14601 16.3803 3.2698C22.7976 0 31.1984 0 48 0H92C108.802 0 117.202 0 123.62 3.2698C129.265 6.14601 133.854 10.7354 136.73 16.3803C140 22.7976 140 31.1984 140 48V92C140 108.802 140 117.202 136.73 123.62C133.854 129.265 129.265 133.854 123.62 136.73C117.202 140 108.802 140 92 140H48C31.1984 140 22.7976 140 16.3803 136.73C10.7354 133.854 6.14601 129.265 3.2698 123.62C0 117.202 0 108.802 0 92V48Z\" fill=\"url(#paint0_linear_1609_3955)\"\/>\n\n<path d=\"M66.6667 100H46.6667C44.8333 100 43.2639 99.3472 41.9583 98.0417C40.6528 96.7361 40 95.1667 40 93.3333V46.6667C40 44.8333 40.6528 43.2639 41.9583 41.9583C43.2639 40.6528 44.8333 40 46.6667 40H66.6667V100ZM60 93.3333V46.6667H46.6667V93.3333H60ZM73.3333 66.6667V40H93.3333C95.1667 40 96.7361 40.6528 98.0417 41.9583C99.3472 43.2639 100 44.8333 100 46.6667V66.6667H73.3333ZM80 60H93.3333V46.6667H80V60ZM73.3333 100V73.3333H100V93.3333C100 95.1667 99.3472 96.7361 98.0417 98.0417C96.7361 99.3472 95.1667 100 93.3333 100H73.3333ZM80 93.3333H93.3333V80H80V93.3333Z\" fill=\"white\"\/>\n<\/g>\n<defs>\n\n<linearGradient id=\"paint0_linear_1609_3955\" x1=\"140\" y1=\"132.65\" x2=\"5.25\" y2=\"6.02379e-07\" gradientUnits=\"userSpaceOnUse\">\n<stop stop-color=\"#B5D3FF\"\/>\n<stop offset=\"0.481457\" stop-color=\"#3D8CFF\"\/>\n<stop offset=\"1\" stop-color=\"#3D8CFF\"\/>\n<\/linearGradient>\n<\/defs>\n<\/svg>\n              <\/div>\n              <div class=\"smcm-why-body\">\n                <h3 class=\"smcm-why-card-title\">Risk-Based by Design<\/h3>\n                <p class=\"smcm-why-card-desc\">Combine impact assessment, risk matrices, decision trees and recurrence checks to support objective, consistent change decisions.<\/p>\n              <\/div>\n            <\/article>\n\n            <article class=\"smcm-why-card smcm-why-card--divider\">\n              <div class=\"smcm-why-icon\" aria-hidden=\"true\">\n                <svg class=\"smcm-why-icon-svg\" aria-hidden=\"true\" focusable=\"false\" width=\"140\" height=\"140\" viewBox=\"0 0 140 140\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<g>\n<path d=\"M0 48C0 31.1984 0 22.7976 3.2698 16.3803C6.14601 10.7354 10.7354 6.14601 16.3803 3.2698C22.7976 0 31.1984 0 48 0H92C108.802 0 117.202 0 123.62 3.2698C129.265 6.14601 133.854 10.7354 136.73 16.3803C140 22.7976 140 31.1984 140 48V92C140 108.802 140 117.202 136.73 123.62C133.854 129.265 129.265 133.854 123.62 136.73C117.202 140 108.802 140 92 140H48C31.1984 140 22.7976 140 16.3803 136.73C10.7354 133.854 6.14601 129.265 3.2698 123.62C0 117.202 0 108.802 0 92V48Z\" fill=\"url(#paint0_linear_1609_4775)\"\/>\n\n<path d=\"M70.0002 103.333C62.2779 101.389 55.9029 96.9582 50.8752 90.0415C45.8474 83.1248 43.3335 75.4443 43.3335 66.9998V46.6665L70.0002 36.6665L96.6668 46.6665V66.9998C96.6668 75.4443 94.1529 83.1248 89.1252 90.0415C84.0974 96.9582 77.7224 101.389 70.0002 103.333ZM70.0002 96.3332C75.389 94.6665 79.889 91.3748 83.5002 86.4582C87.1113 81.5415 89.2224 76.0554 89.8335 69.9998H70.0002V43.7498L50.0002 51.2498V68.4998C50.0002 68.8887 50.0557 69.3887 50.1668 69.9998H70.0002V96.3332Z\" fill=\"white\"\/>\n<\/g>\n<defs>\n\n<linearGradient id=\"paint0_linear_1609_4775\" x1=\"140\" y1=\"132.65\" x2=\"5.25\" y2=\"6.02379e-07\" gradientUnits=\"userSpaceOnUse\">\n<stop stop-color=\"#B5D3FF\"\/>\n<stop offset=\"0.481457\" stop-color=\"#3D8CFF\"\/>\n<stop offset=\"1\" stop-color=\"#3D8CFF\"\/>\n<\/linearGradient>\n<\/defs>\n<\/svg>\n              <\/div>\n              <div class=\"smcm-why-body\">\n                <h3 class=\"smcm-why-card-title\">Connected Quality &amp; Food Safety Ecosystem<\/h3>\n                <p class=\"smcm-why-card-desc\">A change rarely affects one process. Smart Food Safe connects change management with HACCP, CAPA, documents, and audits, to assess its impact and keep food safety and quality aligned.<\/p>\n              <\/div>\n            <\/article>\n          <\/div>\n\n          <div class=\"smcm-why-page\">\n            <article class=\"smcm-why-card\">\n              <div class=\"smcm-why-icon\" aria-hidden=\"true\">\n                <svg class=\"smcm-why-icon-svg\" aria-hidden=\"true\" focusable=\"false\" width=\"140\" height=\"140\" viewBox=\"0 0 140 140\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<g>\n<path d=\"M0 48C0 31.1984 0 22.7976 3.2698 16.3803C6.14601 10.7354 10.7354 6.14601 16.3803 3.2698C22.7976 0 31.1984 0 48 0H92C108.802 0 117.202 0 123.62 3.2698C129.265 6.14601 133.854 10.7354 136.73 16.3803C140 22.7976 140 31.1984 140 48V92C140 108.802 140 117.202 136.73 123.62C133.854 129.265 129.265 133.854 123.62 136.73C117.202 140 108.802 140 92 140H48C31.1984 140 22.7976 140 16.3803 136.73C10.7354 133.854 6.14601 129.265 3.2698 123.62C0 117.202 0 108.802 0 92V48Z\" fill=\"url(#paint0_linear_1609_4160)\"\/>\n\n<path d=\"M79.9998 96.6668V90.0002H66.6665V73.3335H59.9998V80.0002H36.6665V60.0002H59.9998V66.6668H66.6665V50.0002H79.9998V43.3335H103.333V63.3335H79.9998V56.6668H73.3332V83.3335H79.9998V76.6668H103.333V96.6668H79.9998ZM86.6665 90.0002H96.6665V83.3335H86.6665V90.0002ZM43.3332 73.3335H53.3332V66.6668H43.3332V73.3335ZM86.6665 56.6668H96.6665V50.0002H86.6665V56.6668Z\" fill=\"white\"\/>\n<\/g>\n<defs>\n\n<linearGradient id=\"paint0_linear_1609_4160\" x1=\"140\" y1=\"132.65\" x2=\"5.25\" y2=\"6.02379e-07\" gradientUnits=\"userSpaceOnUse\">\n<stop stop-color=\"#B5D3FF\"\/>\n<stop offset=\"0.481457\" stop-color=\"#3D8CFF\"\/>\n<stop offset=\"1\" stop-color=\"#3D8CFF\"\/>\n<\/linearGradient>\n<\/defs>\n<\/svg>\n              <\/div>\n              <div class=\"smcm-why-body\">\n                <h3 class=\"smcm-why-card-title\">Configurable to Your Process<\/h3>\n                <p class=\"smcm-why-card-desc\">Configure change types, forms, impact assessments, risk methodologies, decision trees, workflows, approval levels and effectiveness checks around your organization&#8217;s requirements.<\/p>\n              <\/div>\n            <\/article>\n\n            <article class=\"smcm-why-card smcm-why-card--divider\">\n              <div class=\"smcm-why-icon\" aria-hidden=\"true\">\n                <svg class=\"smcm-why-icon-svg\" aria-hidden=\"true\" focusable=\"false\" width=\"140\" height=\"140\" viewBox=\"0 0 140 140\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<g>\n<path d=\"M0 48C0 31.1984 0 22.7976 3.2698 16.3803C6.14601 10.7354 10.7354 6.14601 16.3803 3.2698C22.7976 0 31.1984 0 48 0H92C108.802 0 117.202 0 123.62 3.2698C129.265 6.14601 133.854 10.7354 136.73 16.3803C140 22.7976 140 31.1984 140 48V92C140 108.802 140 117.202 136.73 123.62C133.854 129.265 129.265 133.854 123.62 136.73C117.202 140 108.802 140 92 140H48C31.1984 140 22.7976 140 16.3803 136.73C10.7354 133.854 6.14601 129.265 3.2698 123.62C0 117.202 0 108.802 0 92V48Z\" fill=\"url(#paint0_linear_1609_4365)\"\/>\n\n<path d=\"M80.6252 78.9585C83.5418 76.0418 85.0002 72.5002 85.0002 68.3335C85.0002 64.1668 83.5418 60.6252 80.6252 57.7085C77.7085 54.7918 74.1668 53.3335 70.0002 53.3335C65.8335 53.3335 62.2918 54.7918 59.3752 57.7085C56.4585 60.6252 55.0002 64.1668 55.0002 68.3335C55.0002 72.5002 56.4585 76.0418 59.3752 78.9585C62.2918 81.8752 65.8335 83.3335 70.0002 83.3335C74.1668 83.3335 77.7085 81.8752 80.6252 78.9585ZM63.6252 74.7085C61.8752 72.9585 61.0002 70.8335 61.0002 68.3335C61.0002 65.8335 61.8752 63.7085 63.6252 61.9585C65.3752 60.2085 67.5002 59.3335 70.0002 59.3335C72.5002 59.3335 74.6252 60.2085 76.3752 61.9585C78.1252 63.7085 79.0002 65.8335 79.0002 68.3335C79.0002 70.8335 78.1252 72.9585 76.3752 74.7085C74.6252 76.4585 72.5002 77.3335 70.0002 77.3335C67.5002 77.3335 65.3752 76.4585 63.6252 74.7085ZM47.8335 86.5418C41.1668 82.0141 36.3335 75.9446 33.3335 68.3335C36.3335 60.7224 41.1668 54.6529 47.8335 50.1252C54.5002 45.5974 61.8891 43.3335 70.0002 43.3335C78.1113 43.3335 85.5002 45.5974 92.1668 50.1252C98.8335 54.6529 103.667 60.7224 106.667 68.3335C103.667 75.9446 98.8335 82.0141 92.1668 86.5418C85.5002 91.0696 78.1113 93.3335 70.0002 93.3335C61.8891 93.3335 54.5002 91.0696 47.8335 86.5418ZM87.2918 81.7085C92.5418 78.4029 96.5557 73.9446 99.3335 68.3335C96.5557 62.7224 92.5418 58.2641 87.2918 54.9585C82.0418 51.6529 76.2779 50.0002 70.0002 50.0002C63.7224 50.0002 57.9585 51.6529 52.7085 54.9585C47.4585 58.2641 43.4446 62.7224 40.6668 68.3335C43.4446 73.9446 47.4585 78.4029 52.7085 81.7085C57.9585 85.0141 63.7224 86.6668 70.0002 86.6668C76.2779 86.6668 82.0418 85.0141 87.2918 81.7085Z\" fill=\"white\"\/>\n<\/g>\n<defs>\n\n<linearGradient id=\"paint0_linear_1609_4365\" x1=\"140\" y1=\"132.65\" x2=\"5.25\" y2=\"6.02379e-07\" gradientUnits=\"userSpaceOnUse\">\n<stop stop-color=\"#B5D3FF\"\/>\n<stop offset=\"0.481457\" stop-color=\"#3D8CFF\"\/>\n<stop offset=\"1\" stop-color=\"#3D8CFF\"\/>\n<\/linearGradient>\n<\/defs>\n<\/svg>\n              <\/div>\n              <div class=\"smcm-why-body\">\n                <h3 class=\"smcm-why-card-title\">Complete Visibility<\/h3>\n                <p class=\"smcm-why-card-desc\">Real-time dashboards provide management with visibility into pending approvals, open changes, overdue actions, risk levels and implementation progress.<\/p>\n              <\/div>\n            <\/article>\n\n            <article class=\"smcm-why-card\">\n              <div class=\"smcm-why-icon\" aria-hidden=\"true\">\n                <svg class=\"smcm-why-icon-svg\" aria-hidden=\"true\" focusable=\"false\" width=\"140\" height=\"140\" viewBox=\"0 0 140 140\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<g>\n<path d=\"M0 48C0 31.1984 0 22.7976 3.2698 16.3803C6.14601 10.7354 10.7354 6.14601 16.3803 3.2698C22.7976 0 31.1984 0 48 0H92C108.802 0 117.202 0 123.62 3.2698C129.265 6.14601 133.854 10.7354 136.73 16.3803C140 22.7976 140 31.1984 140 48V92C140 108.802 140 117.202 136.73 123.62C133.854 129.265 129.265 133.854 123.62 136.73C117.202 140 108.802 140 92 140H48C31.1984 140 22.7976 140 16.3803 136.73C10.7354 133.854 6.14601 129.265 3.2698 123.62C0 117.202 0 108.802 0 92V48Z\" fill=\"url(#paint0_linear_1609_4570)\"\/>\n\n<path d=\"M46.6667 100C44.8333 100 43.2639 99.3472 41.9583 98.0417C40.6528 96.7361 40 95.1667 40 93.3333V46.6667C40 44.8333 40.6528 43.2639 41.9583 41.9583C43.2639 40.6528 44.8333 40 46.6667 40H93.3333C95.1667 40 96.7361 40.6528 98.0417 41.9583C99.3472 43.2639 100 44.8333 100 46.6667V93.3333C100 95.1667 99.3472 96.7361 98.0417 98.0417C96.7361 99.3472 95.1667 100 93.3333 100H46.6667ZM46.6667 86.5V93.3333H93.3333V64.1667L73.5 86.6667L60 73.1667L46.6667 86.5ZM46.6667 77L60 63.6667L73.1667 76.8333L93.3333 54.1667V46.6667H46.6667V77ZM46.6667 64.1667V54.1667V76.8333V63.6667V86.5V73.1667V86.6667V64.1667ZM46.6667 77V46.6667V76.8333V63.6667V77ZM46.6667 86.5V73.1667V86.6667V64.1667V93.3333V86.5Z\" fill=\"white\"\/>\n<\/g>\n<defs>\n\n<linearGradient id=\"paint0_linear_1609_4570\" x1=\"140\" y1=\"132.65\" x2=\"5.25\" y2=\"6.02379e-07\" gradientUnits=\"userSpaceOnUse\">\n<stop stop-color=\"#B5D3FF\"\/>\n<stop offset=\"0.481457\" stop-color=\"#3D8CFF\"\/>\n<stop offset=\"1\" stop-color=\"#3D8CFF\"\/>\n<\/linearGradient>\n<\/defs>\n<\/svg>\n              <\/div>\n              <div class=\"smcm-why-body\">\n                <h3 class=\"smcm-why-card-title\">Drive Continuous Improvement<\/h3>\n                <p class=\"smcm-why-card-desc\">Use change data and trends to understand recurring changes, bottlenecks, risk patterns and opportunities for improvement.<\/p>\n              <\/div>\n            <\/article>\n          <\/div>\n\n        <\/div>\n      <\/div>\n      <div class=\"smcm-why-dots\" id=\"smcmWhyDots\" aria-label=\"Why Smart Food Safe carousel pagination\"><\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n\n<!-- \u2550\u2550 WHAT DIFFERENTIATES US \u2014 COMPARISON SLIDER \u2550\u2550 -->\n<section class=\"smcm-compare-section\" aria-labelledby=\"smcmCompareHeading\">\n  <div class=\"smcm-compare-inner\">\n    <h2 class=\"smcm-compare-heading\" id=\"smcmCompareHeading\">\n      Manual Change Control vs <span class=\"smcm-compare-heading-blue\">Our Change Management Software<\/span>\n    <\/h2>\n    <p class=\"smcm-compare-subtitle\">See the difference between fragmented manual change control and one connected, risk-driven digital workflow.<\/p>\n\n    <div class=\"smcm-compare-frame\" id=\"smcmCompareFrame\">\n      <img\n        class=\"smcm-compare-image smcm-compare-manual\"\n        src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Manual.jpeg\"\n        alt=\"Manual change management approach\"\n        decoding=\"async\"\n      \/>\n\n      <div class=\"smcm-compare-layer\" id=\"smcmCompareSmartLayer\" aria-hidden=\"true\">\n        <img\n          class=\"smcm-compare-image smcm-compare-smart\"\n          src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/smartchange1.jpeg\"\n          alt=\"\"\n            decoding=\"async\"\n        \/>\n      <\/div>\n\n      <input\n        class=\"smcm-compare-range\"\n        id=\"smcmCompareRange\"\n        type=\"range\"\n        min=\"0\"\n        max=\"100\"\n        value=\"50\"\n        step=\"0.1\"\n        aria-label=\"Compare Smart Change with a manual change-management approach\"\n      \/>\n\n      <div class=\"smcm-compare-handle\" aria-hidden=\"true\">\n        <img\n          class=\"smcm-compare-handle-logo\"\n          src=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/SFS-FAV-B.png\"\n          alt=\"\"\n            decoding=\"async\"\n        \/>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n\n<!-- \u2550\u2550 FREQUENTLY ASKED QUESTIONS \u2550\u2550 -->\n<section class=\"smcm-faq-section\" aria-labelledby=\"smcmFaqHeading\">\n  <div class=\"smcm-faq-inner\">\n    <h2 class=\"smcm-faq-heading\" id=\"smcmFaqHeading\">Frequently Asked Questions<\/h2>\n\n    <div class=\"smcm-faq-list\">\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">What is Change Management Software?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">Change Management Software helps organizations <strong>plan, assess, approve, implement, and monitor changes<\/strong> through a structured digital workflow, improving control, compliance, and efficiency.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">How does Smart Food Safe\u2019s Change Management Software help manage change control?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">Smart Food Safe\u2019s Change Management Software streamlines the <strong>entire change lifecycle<\/strong>, from change requests and risk assessment to approval, implementation, and effectiveness review.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">What types of changes can the software manage?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">The software can manage <strong>process, equipment, supplier, material, document, facility, specification, software, and regulatory changes<\/strong> through one configurable platform.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">How does the software manage approvals?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">It automates approval workflows based on <strong>change type, department, location, or risk level<\/strong>, ensuring the right stakeholders review each change.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">What risk assessment methods does the software support?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">The software supports <strong>configurable risk matrices and decision trees<\/strong> to evaluate change impact and help reduce operational risk.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">Can the software integrate with other Smart Food Safe modules?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">Yes. It integrates with <strong>Document Management, CAPA, Audits, Training, Supplier Management, Specifications<\/strong>, and other quality management modules.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">How does the software support compliance?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">It maintains <strong>approval records, electronic signatures, risk assessments, and a complete audit trail<\/strong> to support compliance and audit readiness.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">What happens if a change is unsuccessful?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">Every implemented change can undergo an <strong>effectiveness review<\/strong>, with corrective actions initiated when additional improvements are required.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"smcm-faq-item\">\n        <h4 class=\"smcm-faq-question-heading\">\n\n          <button class=\"smcm-faq-question\" type=\"button\" aria-expanded=\"false\">\n\n            <span class=\"smcm-faq-icon\" aria-hidden=\"true\"><\/span>\n\n            <span class=\"smcm-faq-question-text\">Can the software track change costs?<\/span>\n\n          <\/button>\n\n        <\/h4>\n        <div class=\"smcm-faq-answer\">\n          <div class=\"smcm-faq-answer-inner\">\n            <p class=\"smcm-faq-answer-copy\">Yes. The software can record <strong>implementation costs and quality-related expenses<\/strong>, providing visibility into the financial impact of each change.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<\/div>\n\n<script>\n(function () {\n  var wrap = document.getElementById('smcmRevealWrap');\n  var shot = document.getElementById('smcmRevealShot');\n  if (!wrap || !shot) return;\n\n  var MIN_SCALE = 0.6;\n  var MAX_SCALE = 1;\n\n  var targetScale = MIN_SCALE;\n  var currentScale = MIN_SCALE;\n  var rafId = null;\n  var scrollTicking = false;\n\n  \/\/ Smoothing factor: lower = smoother\/slower catch-up, higher = snappier.\n  \/\/ Wider viewports get a touch more damping so the larger image doesn't\n  \/\/ feel like it's snapping between scroll ticks.\n  function dampingFor(width) {\n    if (width >= 1800) return 0.085;\n    if (width >= 1200) return 0.11;\n    return 0.16;\n  }\n\n  \/\/ Growth is driven directly by how far the page has scrolled from the\n  \/\/ very top \u2014 no need to \"reach\" a separate section first. The image\n  \/\/ is already in view (bottom 40% of the first screen) and starts\n  \/\/ scaling up the instant scrolling begins. Range scales a bit with\n  \/\/ viewport height so short\/tall screens feel proportionate.\n  function scrollRange() {\n    return Math.max(window.innerHeight * 0.7, 420);\n  }\n\n  function computeTarget() {\n    var scrollY = window.scrollY || document.documentElement.scrollTop || 0;\n    var progress = Math.min(Math.max(scrollY \/ scrollRange(), 0), 1);\n    var eased = 1 - Math.pow(1 - progress, 1.5);\n    targetScale = MIN_SCALE + eased * (MAX_SCALE - MIN_SCALE);\n  }\n\n  function tick() {\n    var damping = dampingFor(window.innerWidth);\n    currentScale += (targetScale - currentScale) * damping;\n\n    var delta = Math.abs(targetScale - currentScale);\n    if (delta < 0.0006) {\n      currentScale = targetScale;\n      shot.style.transform = 'scale(' + currentScale.toFixed(5) + ')';\n      rafId = null;\n      return;\n    }\n\n    shot.style.transform = 'scale(' + currentScale.toFixed(5) + ')';\n    rafId = window.requestAnimationFrame(tick);\n  }\n\n  function ensureLoop() {\n    if (rafId === null) {\n      rafId = window.requestAnimationFrame(tick);\n    }\n  }\n\n  function onScroll() {\n    if (!scrollTicking) {\n      window.requestAnimationFrame(function () {\n        computeTarget();\n        ensureLoop();\n        scrollTicking = false;\n      });\n      scrollTicking = true;\n    }\n  }\n\n  shot.style.transform = 'scale(' + MIN_SCALE + ')';\n  window.addEventListener('scroll', onScroll, { passive: true });\n  window.addEventListener('resize', onScroll);\n  computeTarget();\n  ensureLoop();\n})();\n<\/script>\n\n<script>\n(function () {\n  var viewport = document.getElementById('smcmTourViewport');\n  if (!viewport) return;\n\n  var slides = Array.from(viewport.querySelectorAll('.smcm-tour-slide'));\n  var total = slides.length;\n  var current = 1;\n\n  var prevBtn = document.getElementById('smcmTourPrev');\n  var nextBtn = document.getElementById('smcmTourNext');\n  var counter = document.getElementById('smcmTourCounter');\n\n  function render() {\n    slides.forEach(function (s) {\n      s.classList.toggle('smcm-tour-active', parseInt(s.dataset.slide, 10) === current);\n    });\n    if (counter) counter.textContent = current + '\/' + total;\n    if (prevBtn) prevBtn.disabled = current === 1;\n    if (nextBtn) nextBtn.disabled = current === total;\n  }\n\n  function goTo(n) {\n    current = Math.min(Math.max(parseInt(n, 10) || 1, 1), total);\n    render();\n  }\n\n  if (prevBtn) prevBtn.addEventListener('click', function () { goTo(current - 1); });\n  if (nextBtn) nextBtn.addEventListener('click', function () { goTo(current + 1); });\n\n  viewport.addEventListener('click', function (e) {\n    var btn = e.target.closest('.smcm-tour-advance');\n    if (!btn) return;\n    e.preventDefault();\n    var target = btn.getAttribute('data-goto');\n    if (target) goTo(target);\n  });\n\n  render();\n})();\n<\/script>\n\n<script>\n(function () {\n  var tabsWrap = document.getElementById('smcmSfTabs');\n  var mediaWrap = document.getElementById('smcmSfMedia');\n  if (!tabsWrap || !mediaWrap) return;\n\n  var tabs   = Array.from(tabsWrap.querySelectorAll('.smcm-sf-tab'));\n  var images = Array.from(mediaWrap.querySelectorAll('.smcm-sf-media-img'));\n  var total  = tabs.length;\n  var current = 0;\n  var timer;\n  var DURATION = 5000;\n\n  function go(idx) {\n    current = (idx + total) % total;\n\n    tabs.forEach(function (tab, i) {\n      var fill = tab.querySelector('.smcm-sf-tab-progress-fill');\n      var isActive = i === current;\n      tab.classList.toggle('smcm-sf-active', isActive);\n      if (fill) {\n        fill.classList.remove('smcm-sf-animate');\n        fill.style.width = '0%';\n        if (isActive) {\n          void fill.offsetWidth;\n          fill.classList.add('smcm-sf-animate');\n        }\n      }\n    });\n\n    images.forEach(function (img, i) {\n      img.classList.toggle('smcm-sf-active', i === current);\n    });\n  }\n\n  function reset() {\n    clearInterval(timer);\n    timer = setInterval(function () { go(current + 1); }, DURATION);\n  }\n\n  tabs.forEach(function (tab, i) {\n    tab.addEventListener('click', function () {\n      if (i === current) return;\n      go(i);\n      reset();\n    });\n  });\n\n  go(0);\n  reset();\n})();\n<\/script>\n\n\n<script>\n\/* Why Choose Smart Food Safe \u2014 features-style carousel (auto + dots + swipe\/drag) *\/\n(function () {\n  var wrap = document.getElementById('smcmWhyTrackWrap');\n  var track = document.getElementById('smcmWhyTrack');\n  var dotsWrap = document.getElementById('smcmWhyDots');\n  if (!wrap || !track || !dotsWrap) return;\n\n  var cards = Array.from(track.querySelectorAll('.smcm-why-card'));\n  var total = cards.length;\n  var perView = 2;\n  var pageCount = 3;\n  var current = 0;\n  var timer = null;\n  var DURATION = 4000;\n\n  function getPerView() {\n    return window.innerWidth <= 768 ? 3 : 2;\n  }\n\n  function buildDots() {\n    perView = getPerView();\n    pageCount = Math.ceil(total \/ perView);\n    dotsWrap.innerHTML = '';\n\n    for (var i = 0; i < pageCount; i++) {\n      var dot = document.createElement('button');\n      dot.type = 'button';\n      dot.className = 'smcm-why-dot' + (i === 0 ? ' smcm-why-active' : '');\n      dot.setAttribute('aria-label', 'Show Why Choose slide ' + (i + 1) + ' of ' + pageCount);\n      dot.setAttribute('aria-current', i === 0 ? 'true' : 'false');\n      (function (idx) {\n        dot.addEventListener('click', function () {\n          go(idx);\n          reset();\n        });\n      })(i);\n      dotsWrap.appendChild(dot);\n    }\n  }\n\n  function updateDots() {\n    Array.from(dotsWrap.querySelectorAll('.smcm-why-dot')).forEach(function (dot, i) {\n      var active = i === current;\n      dot.classList.toggle('smcm-why-active', active);\n      dot.setAttribute('aria-current', active ? 'true' : 'false');\n    });\n  }\n\n  function applyTransform() {\n    track.style.transform = 'translateX(-' + (current * wrap.offsetWidth) + 'px)';\n  }\n\n  function go(index) {\n    current = (index + pageCount) % pageCount;\n    applyTransform();\n    updateDots();\n  }\n\n  function reset() {\n    window.clearInterval(timer);\n    timer = window.setInterval(function () {\n      go(current + 1);\n    }, DURATION);\n  }\n\n  var resizeTimer = null;\n  window.addEventListener('resize', function () {\n    window.clearTimeout(resizeTimer);\n    resizeTimer = window.setTimeout(function () {\n      var nextPerView = getPerView();\n      if (nextPerView !== perView) {\n        current = 0;\n        buildDots();\n      }\n      applyTransform();\n    }, 100);\n  });\n\n  var startX = 0;\n  var deltaX = 0;\n  var isTouching = false;\n\n  wrap.addEventListener('touchstart', function (event) {\n    isTouching = true;\n    startX = event.touches[0].clientX;\n    deltaX = 0;\n    window.clearInterval(timer);\n  }, { passive: true });\n\n  wrap.addEventListener('touchmove', function (event) {\n    if (!isTouching) return;\n    deltaX = event.touches[0].clientX - startX;\n  }, { passive: true });\n\n  wrap.addEventListener('touchend', function () {\n    if (!isTouching) return;\n    isTouching = false;\n    if (Math.abs(deltaX) > 40) go(current + (deltaX < 0 ? 1 : -1));\n    deltaX = 0;\n    reset();\n  });\n\n  var isDragging = false;\n  var dragStartX = 0;\n  var dragDeltaX = 0;\n\n  wrap.addEventListener('mousedown', function (event) {\n    isDragging = true;\n    dragStartX = event.clientX;\n    dragDeltaX = 0;\n    wrap.classList.add('smcm-why-dragging');\n    window.clearInterval(timer);\n  });\n\n  window.addEventListener('mousemove', function (event) {\n    if (!isDragging) return;\n    dragDeltaX = event.clientX - dragStartX;\n  });\n\n  window.addEventListener('mouseup', function () {\n    if (!isDragging) return;\n    isDragging = false;\n    wrap.classList.remove('smcm-why-dragging');\n    if (Math.abs(dragDeltaX) > 40) go(current + (dragDeltaX < 0 ? 1 : -1));\n    dragDeltaX = 0;\n    reset();\n  });\n\n  buildDots();\n  go(0);\n  reset();\n})();\n<\/script>\n\n\n<script>\n(function () {\n  var frame = document.getElementById('smcmCompareFrame');\n  var range = document.getElementById('smcmCompareRange');\n\n  if (!frame || !range) return;\n\n  function syncFrameWidth() {\n    frame.style.setProperty('--smcm-compare-frame-width', frame.clientWidth + 'px');\n  }\n\n  function updateCompare(value) {\n    var safeValue = Math.max(0, Math.min(100, Number(value) || 0));\n    frame.style.setProperty('--smcm-compare-position', safeValue + '%');\n  }\n\n  range.addEventListener('input', function () {\n    updateCompare(this.value);\n  });\n\n  window.addEventListener('resize', syncFrameWidth);\n\n  if ('ResizeObserver' in window) {\n    var compareObserver = new ResizeObserver(syncFrameWidth);\n    compareObserver.observe(frame);\n  }\n\n  syncFrameWidth();\n  updateCompare(range.value);\n})();\n<\/script>\n\n\n<script>\n(function () {\n  var items = document.querySelectorAll('.smcm-faq-item');\n\n  if (!items.length) return;\n\n  items.forEach(function (item) {\n    var button = item.querySelector('.smcm-faq-question');\n    if (!button) return;\n\n    button.addEventListener('click', function () {\n      var isOpen = item.classList.contains('smcm-faq-open');\n\n      items.forEach(function (otherItem) {\n        otherItem.classList.remove('smcm-faq-open');\n        var otherButton = otherItem.querySelector('.smcm-faq-question');\n        if (otherButton) otherButton.setAttribute('aria-expanded', 'false');\n      });\n\n      if (!isOpen) {\n        item.classList.add('smcm-faq-open');\n        button.setAttribute('aria-expanded', 'true');\n      }\n    });\n  });\n})();\n<\/script>\n\n\n<script>\n(function () {\n  var shell = document.getElementById('smcmTourScaleShell');\n  if (!shell) return;\n\n  var card = shell.querySelector('.smcm-tour-card');\n  var viewport = card ? card.querySelector('#smcmTourViewport') : null;\n  var DESIGN_WIDTH = 1200;\n\n  if (!card) return;\n\n  function syncTourDesktopScale() {\n    var viewportWidth = window.innerWidth || document.documentElement.clientWidth;\n\n    if (viewportWidth >= DESIGN_WIDTH) {\n      card.style.removeProperty('--smcm-tour-scale');\n      shell.style.removeProperty('--smcm-tour-scaled-height');\n      shell.style.height = '';\n      return;\n    }\n\n    var availableWidth = shell.clientWidth;\n    if (!availableWidth) return;\n\n    var scale = Math.min(1, availableWidth \/ DESIGN_WIDTH);\n    card.style.setProperty('--smcm-tour-scale', scale.toFixed(5));\n\n    \/* transform does not change normal-flow height, so compensate the\n       shell using the actual current slide\/card height after scaling. *\/\n    requestAnimationFrame(function () {\n      var scaledHeight = Math.ceil(card.offsetHeight * scale);\n      shell.style.setProperty('--smcm-tour-scaled-height', scaledHeight + 'px');\n      shell.style.height = scaledHeight + 'px';\n    });\n  }\n\n  window.addEventListener('resize', syncTourDesktopScale, { passive: true });\n  window.addEventListener('orientationchange', function () {\n    setTimeout(syncTourDesktopScale, 80);\n  });\n\n  if ('ResizeObserver' in window) {\n    var ro = new ResizeObserver(syncTourDesktopScale);\n    ro.observe(card);\n    ro.observe(shell);\n  }\n\n  if (viewport && 'MutationObserver' in window) {\n    var mo = new MutationObserver(function () {\n      setTimeout(syncTourDesktopScale, 0);\n    });\n    mo.observe(viewport, {\n      subtree: true,\n      attributes: true,\n      attributeFilter: ['class', 'style']\n    });\n  }\n\n  document.addEventListener('click', function (event) {\n    if (\n      event.target.closest('.smcm-tour-advance') ||\n      event.target.closest('#smcmTourPrev') ||\n      event.target.closest('#smcmTourNext')\n    ) {\n      setTimeout(syncTourDesktopScale, 30);\n    }\n  });\n\n  syncTourDesktopScale();\n  setTimeout(syncTourDesktopScale, 120);\n})();\n<\/script>\n\n\n<script>\n(function () {\n  \/* Structure-agnostic Elementor gap fix: instead of guessing a\n     specific auto-generated element ID (fragile \u2014 Elementor can\n     regenerate IDs any time the page is rebuilt), this walks straight\n     up from .smcm-page through however many Elementor wrapper layers\n     actually exist above it on THIS page, and zeroes their spacing\n     directly. Works no matter what the surrounding structure is. *\/\n  function smcmRemoveElementorHeaderGap() {\n    var page = document.querySelector('.smcm-page');\n    if (!page) return;\n\n    page.style.setProperty('margin-top', '0px', 'important');\n    page.style.setProperty('padding-top', '0px', 'important');\n\n    function isElementorWrapper(el) {\n      var cls = el && el.className;\n      return typeof cls === 'string' &&\n        \/elementor-widget|elementor-column|elementor-container|elementor-section|elementor-element\/.test(cls);\n    }\n\n    var el = page.parentElement;\n    var hops = 0;\n\n    \/\/ Walk up through Elementor's typical wrapper chain (widget\n    \/\/ container \u2192 widget \u2192 column-populated \u2192 column \u2192 container \u2192\n    \/\/ section) until we reach something that isn't an Elementor\n    \/\/ wrapper, or we've gone up far enough to be safe. At each level,\n    \/\/ also zero out the bottom spacing of the wrapper immediately\n    \/\/ preceding it \u2014 that covers the gap coming from the SECTION\n    \/\/ ABOVE ours (e.g. the site header) having its own bottom\n    \/\/ padding\/margin, not just spacing on our own side.\n    while (el && hops < 8) {\n      if (!isElementorWrapper(el)) break;\n\n      el.style.setProperty('margin-top', '0px', 'important');\n      el.style.setProperty('padding-top', '0px', 'important');\n      el.style.setProperty('margin-bottom', '0px', 'important');\n\n      var prev = el.previousElementSibling;\n      if (prev &#038;&#038; isElementorWrapper(prev)) {\n        prev.style.setProperty('margin-bottom', '0px', 'important');\n        prev.style.setProperty('padding-bottom', '0px', 'important');\n      }\n\n      el = el.parentElement;\n      hops++;\n    }\n  }\n\n  if (document.readyState === 'loading') {\n    document.addEventListener('DOMContentLoaded', smcmRemoveElementorHeaderGap);\n  } else {\n    smcmRemoveElementorHeaderGap();\n  }\n\n  window.addEventListener('load', smcmRemoveElementorHeaderGap);\n\n  \/* Elementor can repaint its generated styles after load\/editor changes.\n     Reapply a few more times after the page has settled. *\/\n  setTimeout(smcmRemoveElementorHeaderGap, 300);\n  setTimeout(smcmRemoveElementorHeaderGap, 1200);\n  setTimeout(smcmRemoveElementorHeaderGap, 3000);\n\n  if ('ResizeObserver' in window) {\n    var ro = new ResizeObserver(smcmRemoveElementorHeaderGap);\n    ro.observe(document.body);\n  }\n})();\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Change Management Software \u2014 Elementor-Ready Build Change Management Software Bring every change, decision, and action from risk assessment to approval and implementation into one connected&#8230;<\/p>\n","protected":false},"author":6,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-sfs-smart-change.php","meta":{"_joinchat":[],"footnotes":""},"class_list":["post-78863","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Smart Change - Smart Food Safe<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/smartfoodsafe.com\/clone\/smart-change\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Smart Change - Smart Food Safe\" \/>\n<meta property=\"og:description\" content=\"Change Management Software \u2014 Elementor-Ready Build Change Management Software Bring every change, decision, and action from risk assessment to approval and implementation into one connected...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/smartfoodsafe.com\/clone\/smart-change\/\" \/>\n<meta property=\"og:site_name\" content=\"Smart Food Safe\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-15T10:41:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Dashboard-3-1-1-3.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/\",\"url\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/\",\"name\":\"Smart Change - Smart Food Safe\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/smartaudits.online\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/Dashboard-3-1-1-3.png\",\"datePublished\":\"2026-08-18T21:01:29+00:00\",\"dateModified\":\"2026-09-15T10:41:45+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/#primaryimage\",\"url\":\"https:\\\/\\\/smartaudits.online\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/Dashboard-3-1-1-3.png\",\"contentUrl\":\"https:\\\/\\\/smartaudits.online\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/Dashboard-3-1-1-3.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/smart-change\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Smart Change\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/#website\",\"url\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/\",\"name\":\"Smart Food Safe\",\"description\":\"Digitalised food safety\",\"publisher\":{\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/#organization\",\"name\":\"Smart Food Safe\",\"url\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/SFS-B-FULL-1.png\",\"contentUrl\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/SFS-B-FULL-1.png\",\"width\":2382,\"height\":201,\"caption\":\"Smart Food Safe\"},\"image\":{\"@id\":\"https:\\\/\\\/smartfoodsafe.com\\\/clone\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Smart Change - Smart Food Safe","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/","og_locale":"en_US","og_type":"article","og_title":"Smart Change - Smart Food Safe","og_description":"Change Management Software \u2014 Elementor-Ready Build Change Management Software Bring every change, decision, and action from risk assessment to approval and implementation into one connected...","og_url":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/","og_site_name":"Smart Food Safe","article_modified_time":"2026-09-15T10:41:45+00:00","og_image":[{"url":"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Dashboard-3-1-1-3.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/","url":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/","name":"Smart Change - Smart Food Safe","isPartOf":{"@id":"https:\/\/smartfoodsafe.com\/clone\/#website"},"primaryImageOfPage":{"@id":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/#primaryimage"},"image":{"@id":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/#primaryimage"},"thumbnailUrl":"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Dashboard-3-1-1-3.png","datePublished":"2026-08-18T21:01:29+00:00","dateModified":"2026-09-15T10:41:45+00:00","breadcrumb":{"@id":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/smartfoodsafe.com\/clone\/smart-change\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/#primaryimage","url":"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Dashboard-3-1-1-3.png","contentUrl":"https:\/\/smartaudits.online\/wp-content\/uploads\/2026\/08\/Dashboard-3-1-1-3.png"},{"@type":"BreadcrumbList","@id":"https:\/\/smartfoodsafe.com\/clone\/smart-change\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/smartfoodsafe.com\/clone\/"},{"@type":"ListItem","position":2,"name":"Smart Change"}]},{"@type":"WebSite","@id":"https:\/\/smartfoodsafe.com\/clone\/#website","url":"https:\/\/smartfoodsafe.com\/clone\/","name":"Smart Food Safe","description":"Digitalised food safety","publisher":{"@id":"https:\/\/smartfoodsafe.com\/clone\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/smartfoodsafe.com\/clone\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/smartfoodsafe.com\/clone\/#organization","name":"Smart Food Safe","url":"https:\/\/smartfoodsafe.com\/clone\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/smartfoodsafe.com\/clone\/#\/schema\/logo\/image\/","url":"https:\/\/smartfoodsafe.com\/clone\/wp-content\/uploads\/2026\/06\/SFS-B-FULL-1.png","contentUrl":"https:\/\/smartfoodsafe.com\/clone\/wp-content\/uploads\/2026\/06\/SFS-B-FULL-1.png","width":2382,"height":201,"caption":"Smart Food Safe"},"image":{"@id":"https:\/\/smartfoodsafe.com\/clone\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/pages\/78863","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/comments?post=78863"}],"version-history":[{"count":5,"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/pages\/78863\/revisions"}],"predecessor-version":[{"id":78907,"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/pages\/78863\/revisions\/78907"}],"wp:attachment":[{"href":"https:\/\/smartfoodsafe.com\/clone\/wp-json\/wp\/v2\/media?parent=78863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}